Compare commits

..
27 changed files with 195 additions and 485 deletions
+1 -1
View File
@@ -1,4 +1,4 @@
{
"monorepoCommit": "99b2868b7e974441744657b35049f5baae4a499b",
"monorepoCommit": "1a4fa8f940f1ce3bd18662c28f1e9e9ca452e6cd",
"sourcePath": "quixos-instance/packages/project-react-runtime"
}
+4 -5
View File
@@ -1,9 +1,8 @@
# Generated from the checked package contract
package_id: "package:project-react-runtime"
package_revision_id: "package:project-react-runtime@1"
runtime_protocol_version: "quixos-capabilities-v1"
exports: { export_id: "export:project-react-runtime:create-component" runtime_symbol: "createComponent" }
exports: { export_id: "export:project-react-runtime:source-get" runtime_symbol: "sourceGet" }
exports: { export_id: "export:project-react-runtime:props-get" runtime_symbol: "propsGet" }
exports: { export_id: "export:project-react-runtime:props-watch" runtime_symbol: "propsWatch" }
exports: { export_id: "export:project-react-runtime:props-watch-stop" runtime_symbol: "propsWatchStop" }
exports: { export_id: "export:project-react-runtime:source-get" runtime_symbol: "source.get" }
exports: { export_id: "export:project-react-runtime:props-get" runtime_symbol: "props.get" }
exports: { export_id: "export:project-react-runtime:props-watch" runtime_symbol: "props.watch" }
exports: { export_id: "export:project-react-runtime:props-watch-stop" runtime_symbol: "props.watchStop" }
Generated
+7 -7
View File
@@ -37,17 +37,17 @@
"quixosNixHelpers": {
"flake": false,
"locked": {
"lastModified": 1789602549,
"narHash": "sha256-DD66dQ3dzEvG13Zju/4sVSV4pnktSUkJ/Rbr1KkHMdg=",
"ref": "refs/tags/quixos-reachability/e2747066ca7d9d001dcb5dd936e17969ed88fc5f",
"rev": "e2747066ca7d9d001dcb5dd936e17969ed88fc5f",
"revCount": 32,
"lastModified": 1788574090,
"narHash": "sha256-bSgc0LS2Ub01fnE14VqazdZzFuVPl4sykmA2d1l4kDs=",
"ref": "refs/tags/quixos-reachability/7177130c0365f2fa58ea4877366e1c5d17db4c01",
"rev": "7177130c0365f2fa58ea4877366e1c5d17db4c01",
"revCount": 4,
"type": "git",
"url": "https://gitea-external.egads.tutti.syntaxblitz.net/quixos/quixos-nix-helpers.git"
},
"original": {
"ref": "refs/tags/quixos-reachability/e2747066ca7d9d001dcb5dd936e17969ed88fc5f",
"rev": "e2747066ca7d9d001dcb5dd936e17969ed88fc5f",
"ref": "refs/tags/quixos-reachability/7177130c0365f2fa58ea4877366e1c5d17db4c01",
"rev": "7177130c0365f2fa58ea4877366e1c5d17db4c01",
"type": "git",
"url": "https://gitea-external.egads.tutti.syntaxblitz.net/quixos/quixos-nix-helpers.git"
}
+9 -11
View File
@@ -6,33 +6,31 @@
flake-utils.url = "github:numtide/flake-utils";
quixosNixHelpers = {
url = "git+https://gitea-external.egads.tutti.syntaxblitz.net/quixos/quixos-nix-helpers.git?ref=refs/tags/quixos-reachability/e2747066ca7d9d001dcb5dd936e17969ed88fc5f&rev=e2747066ca7d9d001dcb5dd936e17969ed88fc5f";
url = "git+https://gitea-external.egads.tutti.syntaxblitz.net/quixos/quixos-nix-helpers.git?ref=refs/tags/quixos-reachability/7177130c0365f2fa58ea4877366e1c5d17db4c01&rev=7177130c0365f2fa58ea4877366e1c5d17db4c01";
flake = false;
};
};
outputs =
inputs@{
nixpkgs,
flake-utils,
quixosNixHelpers,
...
}:
outputs = inputs@{ nixpkgs, flake-utils, quixosNixHelpers, ... }:
let
quixosHelpers = import "${quixosNixHelpers}/quixos-package-helpers.nix";
in
quixosHelpers.mkCaminoTsYarnNixifyFlake {
inherit inputs nixpkgs flake-utils;
packageRoot = ./.;
migrationEntrypoint = "dist/migrate.js";
promptName = "project-react-runtime";
bundle = {
entry = "src/server.ts";
browserSources = true;
entry = "dist/server.js";
};
installServer = {
libexecName = "project-react-runtime";
descriptorPath = "descriptor.quixos-package.txtpb";
extraFiles = [
{
source = "dist/project-component.mjs";
target = "project-component.mjs";
}
];
};
};
}
+2 -2
View File
@@ -8,11 +8,11 @@
"server": "dist/server.js"
},
"scripts": {
"build": "rm -rf dist && tsc -p tsconfig.build.json",
"build": "rm -rf dist && tsc -p tsconfig.build.json && node scripts/build-component.mjs",
"typecheck": "tsc --noEmit"
},
"dependencies": {
"@quixos/camino-package-runtime": "https://gitea-external.egads.tutti.syntaxblitz.net/quixos/camino-package-runtime.git#commit=cd2b04dc8c2daeea633bf8ecdd31d20fdc41f2ab",
"@quixos/camino-package-runtime": "https://gitea-external.egads.tutti.syntaxblitz.net/quixos/camino-package-runtime.git#commit=79fbee2b32e867bc084f83d46fb46d835a5f149e",
"react": "^18.3.1"
},
"devDependencies": {
+2 -3
View File
@@ -2,16 +2,15 @@ import interface Named;
import interface ProjectTasks;
external atom ProjectReactComponent id "atom:project-react-component";
external atom Project id "atom:project";
type ProjectProps = record {named: interface-ref<Named>; tasks: interface-ref<ProjectTasks>;};
package ProjectReactRuntime id "package:project-react-runtime" revision "package:project-react-runtime@1" {
constructor createComponent id "export:project-react-runtime:create-component" constructs ProjectReactComponent : atom-ref<Project>;
operation sourceGet id "export:project-react-runtime:source-get" : unit -> string mode call receiver atom ProjectReactComponent;
operation propsGet id "export:project-react-runtime:props-get" : unit -> ProjectProps mode call receiver atom ProjectReactComponent requires {
operation propsGet id "export:project-react-runtime:props-get" : unit -> message "org.quixos.web-studio.ReactProps" mode call receiver atom ProjectReactComponent requires {
interface named id "port:project-react:named" : Named;
interface tasks id "port:project-react:tasks" : ProjectTasks;
};
operation propsWatch id "export:project-react-runtime:props-watch" : unit -> watch-handle mode watch-start emits ProjectProps receiver atom ProjectReactComponent requires {
operation propsWatch id "export:project-react-runtime:props-watch" : unit -> watch-handle mode watch-start emits message "org.quixos.web-studio.ReactProps" receiver atom ProjectReactComponent requires {
interface named id "port:project-react:named" : Named;
interface tasks id "port:project-react:tasks" : ProjectTasks;
};
-10
View File
@@ -1,10 +0,0 @@
{
"backend": "typescript",
"bindingOutput": "src/gen/qx.ts",
"options": {
"react": {
"propsExports": ["propsGet"],
"components": [{ "module": "../project-component.js", "propsExport": "propsGet" }]
}
}
}
+3 -3
View File
@@ -1,14 +1,14 @@
quixos-lock version 1 {
quixos source {
repository "https://gitea-external.egads.tutti.syntaxblitz.net/quixos/quixos.git";
commit "99b2868b7e974441744657b35049f5baae4a499b";
commit "1a4fa8f940f1ce3bd18662c28f1e9e9ca452e6cd";
}
interface Named source {
repository "https://repos.quixos.org/quixos-templates/interface-named.git";
commit "07765f61c3803fd73253020bfbb40e1fffaf5ec9";
commit "33d6b16df0340cc0f036e987e0f65eabe38f8c24";
}
interface ProjectTasks source {
repository "https://repos.quixos.org/quixos-templates/interface-project-tasks.git";
commit "1a7eddbce430f17c5817f83d680d3ffc783a071a";
commit "305d1c335af6f61d13bcf3348f66e00fc33aad6a";
}
}
-6
View File
@@ -1,6 +0,0 @@
{
"generatedBy": "qx-scaffold-v1",
"schemaVersion": 1,
"contracts": {},
"migrations": []
}
-4
View File
@@ -1,4 +0,0 @@
{
"generatedBy": "qx-scaffold-v1",
"nixifyPluginUrl": "https://gitea-external.egads.tutti.syntaxblitz.net/quixos/yarn-plugin-nixify-patched/raw/commit/4528fdd20b30d869262443b3f044549810e75fb8/dist/yarn-plugin-nixify.js"
}
+34
View File
@@ -0,0 +1,34 @@
import { build } from "esbuild";
const platformModules = new Map([
[
"@quixos/web-studio-react-runtime",
"/__quixos/platform/web-studio-react-runtime/v1.mjs",
],
["react", "/__quixos/platform/react/v18.mjs"],
["react/jsx-runtime", "/__quixos/platform/react-jsx-runtime/v18.mjs"],
["react/jsx-dev-runtime", "/__quixos/platform/react-jsx-dev-runtime/v18.mjs"],
]);
await build({
entryPoints: ["dist/project-component.js"],
outfile: "dist/project-component.mjs",
bundle: true,
format: "esm",
platform: "browser",
target: "es2022",
sourcemap: true,
plugins: [
{
name: "quixos-platform-modules",
setup(buildApi) {
buildApi.onResolve({ filter: /.*/ }, (args) => {
const platformPath = platformModules.get(args.path);
return platformPath
? { path: platformPath, external: true }
: undefined;
});
},
},
],
});
-4
View File
@@ -1,4 +0,0 @@
declare module "*?browser-source" {
const source: string;
export default source;
}
-277
View File
@@ -1,277 +0,0 @@
// Generated by quixos-codegen-ts. Do not edit. Binding ABI version 1.
import { bindQxHandler, type QxObjectRef, type QxWatchHandle, type QxHandler, type QxDerived, type QxContextLifecycle, type QxLiveValue, type QxHandlerSpec, type QxMessages } from "@quixos/camino-package-runtime";
export const packageRevisionId = "package:project-react-runtime@1";
declare const appliedType: unique symbol;
type QxApplied<Definition extends string, Arguments extends readonly unknown[]> = string & {readonly [appliedType]: (value: [Definition, Arguments]) => [Definition, Arguments]};
export type Contexts = { "createComponent": { "objectId": QxObjectRef<"atom:atom:project-react-component">; "input": QxObjectRef<"atom:atom:project">; "ports": { } } & QxContextLifecycle<{ "objectId": QxObjectRef<"atom:atom:project-react-component">; "input": QxObjectRef<"atom:atom:project">; "ports": { } } & {signal?: AbortSignal}>; "propsGet": { "objectId": QxObjectRef<"atom:atom:project-react-component">; "input": null; "ports": { "named": { "objectId": QxObjectRef<"interface:interface:named@1">; "live": { "name.get": () => Promise<QxLiveValue>; "name.set": (input: string) => Promise<QxLiveValue> }; "name.get": () => Promise<string>; "name.set": (input: string) => Promise<null> }; "tasks": { "objectId": QxObjectRef<"interface:interface:project-tasks@1">; "live": { "tasks.resolve": () => Promise<QxLiveValue>; "tasks.connect": (input: QxObjectRef<"atom:atom:task">) => Promise<QxLiveValue>; "tasks.disconnect": (input: QxObjectRef<"atom:atom:task">) => Promise<QxLiveValue> }; "tasks.resolve": () => Promise<Array<QxObjectRef<"atom:atom:task">>>; "tasks.connect": (input: QxObjectRef<"atom:atom:task">) => Promise<null>; "tasks.disconnect": (input: QxObjectRef<"atom:atom:task">) => Promise<null> } } } & QxContextLifecycle<{ "objectId": QxObjectRef<"atom:atom:project-react-component">; "input": null; "ports": { "named": { "objectId": QxObjectRef<"interface:interface:named@1">; "live": { "name.get": () => Promise<QxLiveValue>; "name.set": (input: string) => Promise<QxLiveValue> }; "name.get": () => Promise<string>; "name.set": (input: string) => Promise<null> }; "tasks": { "objectId": QxObjectRef<"interface:interface:project-tasks@1">; "live": { "tasks.resolve": () => Promise<QxLiveValue>; "tasks.connect": (input: QxObjectRef<"atom:atom:task">) => Promise<QxLiveValue>; "tasks.disconnect": (input: QxObjectRef<"atom:atom:task">) => Promise<QxLiveValue> }; "tasks.resolve": () => Promise<Array<QxObjectRef<"atom:atom:task">>>; "tasks.connect": (input: QxObjectRef<"atom:atom:task">) => Promise<null>; "tasks.disconnect": (input: QxObjectRef<"atom:atom:task">) => Promise<null> } } } & {signal?: AbortSignal}>; "propsWatch": { "objectId": QxObjectRef<"atom:atom:project-react-component">; "input": null; "ports": { "named": { "objectId": QxObjectRef<"interface:interface:named@1">; "live": { "name.get": () => Promise<QxLiveValue>; "name.set": (input: string) => Promise<QxLiveValue> }; "name.get": () => Promise<string>; "name.set": (input: string) => Promise<null> }; "tasks": { "objectId": QxObjectRef<"interface:interface:project-tasks@1">; "live": { "tasks.resolve": () => Promise<QxLiveValue>; "tasks.connect": (input: QxObjectRef<"atom:atom:task">) => Promise<QxLiveValue>; "tasks.disconnect": (input: QxObjectRef<"atom:atom:task">) => Promise<QxLiveValue> }; "tasks.resolve": () => Promise<Array<QxObjectRef<"atom:atom:task">>>; "tasks.connect": (input: QxObjectRef<"atom:atom:task">) => Promise<null>; "tasks.disconnect": (input: QxObjectRef<"atom:atom:task">) => Promise<null> } } } & QxContextLifecycle<{ "objectId": QxObjectRef<"atom:atom:project-react-component">; "input": null; "ports": { "named": { "objectId": QxObjectRef<"interface:interface:named@1">; "live": { "name.get": () => Promise<QxLiveValue>; "name.set": (input: string) => Promise<QxLiveValue> }; "name.get": () => Promise<string>; "name.set": (input: string) => Promise<null> }; "tasks": { "objectId": QxObjectRef<"interface:interface:project-tasks@1">; "live": { "tasks.resolve": () => Promise<QxLiveValue>; "tasks.connect": (input: QxObjectRef<"atom:atom:task">) => Promise<QxLiveValue>; "tasks.disconnect": (input: QxObjectRef<"atom:atom:task">) => Promise<QxLiveValue> }; "tasks.resolve": () => Promise<Array<QxObjectRef<"atom:atom:task">>>; "tasks.connect": (input: QxObjectRef<"atom:atom:task">) => Promise<null>; "tasks.disconnect": (input: QxObjectRef<"atom:atom:task">) => Promise<null> } } } & {signal?: AbortSignal}>; "propsWatchStop": { "objectId": QxObjectRef<"atom:atom:project-react-component">; "input": QxWatchHandle; "ports": { } } & QxContextLifecycle<{ "objectId": QxObjectRef<"atom:atom:project-react-component">; "input": QxWatchHandle; "ports": { } } & {signal?: AbortSignal}>; "sourceGet": { "objectId": QxObjectRef<"atom:atom:project-react-component">; "input": null; "ports": { } } & QxContextLifecycle<{ "objectId": QxObjectRef<"atom:atom:project-react-component">; "input": null; "ports": { } } & {signal?: AbortSignal}> };
export type Results = { "createComponent": QxObjectRef<"atom:atom:project-react-component">; "propsGet": { "named": QxObjectRef<"interface:interface:named@1">; "tasks": QxObjectRef<"interface:interface:project-tasks@1"> }; "propsWatch": { "named": QxObjectRef<"interface:interface:named@1">; "tasks": QxObjectRef<"interface:interface:project-tasks@1"> }; "propsWatchStop": null; "sourceGet": string };
export type Implementation = { "createComponent": QxHandler<Contexts["createComponent"], QxObjectRef<"atom:atom:project-react-component">>; "propsGet": QxHandler<Contexts["propsGet"], { "named": QxObjectRef<"interface:interface:named@1">; "tasks": QxObjectRef<"interface:interface:project-tasks@1"> }> | QxDerived<Contexts["propsGet"], { "named": QxObjectRef<"interface:interface:named@1">; "tasks": QxObjectRef<"interface:interface:project-tasks@1"> }>; "propsWatch": QxDerived<Contexts["propsWatch"], { "named": QxObjectRef<"interface:interface:named@1">; "tasks": QxObjectRef<"interface:interface:project-tasks@1"> }>; "propsWatchStop": QxHandler<Contexts["propsWatchStop"], null>; "sourceGet": QxHandler<Contexts["sourceGet"], string> | QxDerived<Contexts["sourceGet"], string> };
const messages = { } satisfies QxMessages;
const specs = {
"createComponent": {
"inputType": {
"kind": "object-ref",
"expectation": {
"kind": "atom",
"atomId": "atom:project"
}
},
"outputType": {
"kind": "object-ref",
"expectation": {
"kind": "atom",
"atomId": "atom:project-react-component"
}
},
"ports": {}
},
"propsGet": {
"inputType": {
"kind": "builtin",
"name": "unit"
},
"outputType": {
"kind": "record",
"fields": {
"named": {
"kind": "object-ref",
"expectation": {
"kind": "interface",
"interfaceRevisionId": "interface:named@1"
}
},
"tasks": {
"kind": "object-ref",
"expectation": {
"kind": "interface",
"interfaceRevisionId": "interface:project-tasks@1"
}
}
}
},
"ports": {
"named": {
"kind": "interface",
"id": "port:project-react:named",
"operations": {
"name.get": {
"id": "operation:named:name:get",
"inputType": {
"kind": "builtin",
"name": "unit"
},
"outputType": {
"kind": "scalar",
"name": "string"
}
},
"name.set": {
"id": "operation:named:name:set",
"inputType": {
"kind": "scalar",
"name": "string"
},
"outputType": {
"kind": "builtin",
"name": "unit"
}
}
}
},
"tasks": {
"kind": "interface",
"id": "port:project-react:tasks",
"operations": {
"tasks.resolve": {
"id": "operation:project-tasks:tasks:resolve",
"inputType": {
"kind": "builtin",
"name": "unit"
},
"outputType": {
"kind": "list",
"value": {
"kind": "object-ref",
"expectation": {
"kind": "atom",
"atomId": "atom:task"
}
}
}
},
"tasks.connect": {
"id": "operation:project-tasks:tasks:connect",
"inputType": {
"kind": "object-ref",
"expectation": {
"kind": "atom",
"atomId": "atom:task"
}
},
"outputType": {
"kind": "builtin",
"name": "unit"
}
},
"tasks.disconnect": {
"id": "operation:project-tasks:tasks:disconnect",
"inputType": {
"kind": "object-ref",
"expectation": {
"kind": "atom",
"atomId": "atom:task"
}
},
"outputType": {
"kind": "builtin",
"name": "unit"
}
}
}
}
}
},
"propsWatch": {
"inputType": {
"kind": "builtin",
"name": "unit"
},
"outputType": {
"kind": "builtin",
"name": "watch-handle"
},
"eventType": {
"kind": "record",
"fields": {
"named": {
"kind": "object-ref",
"expectation": {
"kind": "interface",
"interfaceRevisionId": "interface:named@1"
}
},
"tasks": {
"kind": "object-ref",
"expectation": {
"kind": "interface",
"interfaceRevisionId": "interface:project-tasks@1"
}
}
}
},
"ports": {
"named": {
"kind": "interface",
"id": "port:project-react:named",
"operations": {
"name.get": {
"id": "operation:named:name:get",
"inputType": {
"kind": "builtin",
"name": "unit"
},
"outputType": {
"kind": "scalar",
"name": "string"
}
},
"name.set": {
"id": "operation:named:name:set",
"inputType": {
"kind": "scalar",
"name": "string"
},
"outputType": {
"kind": "builtin",
"name": "unit"
}
}
}
},
"tasks": {
"kind": "interface",
"id": "port:project-react:tasks",
"operations": {
"tasks.resolve": {
"id": "operation:project-tasks:tasks:resolve",
"inputType": {
"kind": "builtin",
"name": "unit"
},
"outputType": {
"kind": "list",
"value": {
"kind": "object-ref",
"expectation": {
"kind": "atom",
"atomId": "atom:task"
}
}
}
},
"tasks.connect": {
"id": "operation:project-tasks:tasks:connect",
"inputType": {
"kind": "object-ref",
"expectation": {
"kind": "atom",
"atomId": "atom:task"
}
},
"outputType": {
"kind": "builtin",
"name": "unit"
}
},
"tasks.disconnect": {
"id": "operation:project-tasks:tasks:disconnect",
"inputType": {
"kind": "object-ref",
"expectation": {
"kind": "atom",
"atomId": "atom:task"
}
},
"outputType": {
"kind": "builtin",
"name": "unit"
}
}
}
}
}
},
"propsWatchStop": {
"inputType": {
"kind": "builtin",
"name": "watch-handle"
},
"outputType": {
"kind": "builtin",
"name": "unit"
},
"ports": {}
},
"sourceGet": {
"inputType": {
"kind": "builtin",
"name": "unit"
},
"outputType": {
"kind": "scalar",
"name": "string"
},
"ports": {}
}
} satisfies Record<string, QxHandlerSpec>;
export const createRuntime = (implementation: Implementation) => ({
packageRevisionId,
exports: {
"export:project-react-runtime:create-component": bindQxHandler(specs["createComponent"], implementation["createComponent"], messages),
"export:project-react-runtime:props-get": bindQxHandler(specs["propsGet"], implementation["propsGet"], messages),
"export:project-react-runtime:props-watch": bindQxHandler(specs["propsWatch"], implementation["propsWatch"], messages),
"export:project-react-runtime:props-watch-stop": bindQxHandler(specs["propsWatchStop"], implementation["propsWatchStop"], messages),
"export:project-react-runtime:source-get": bindQxHandler(specs["sourceGet"], implementation["sourceGet"], messages),
},
});
-7
View File
@@ -1,7 +0,0 @@
// Generated from checked QX contracts. Do not edit.
import type {ObjectRef, InterfaceReference, ReadableField, WritableField} from "@quixos/web-studio-react-runtime";
export type Interface0 = InterfaceReference<"interface:named@1", {"name": WritableField<string>}> ;
export type Interface1 = InterfaceReference<"interface:project-tasks@1", {"tasks": ReadableField<Array<ObjectRef<"atom:task">>>}> ;
export type ReactResults = {"propsGet": {"named": Interface0;"tasks": Interface1}};
type CheckedComponent<K extends keyof ReactResults, C extends (props: {camino: ReactResults[K]; render: any; dispatch: (action: any) => void}) => unknown> = C;
type Component0 = CheckedComponent<"propsGet", typeof import("../project-component.js")["default"]>;
+29 -20
View File
@@ -1,25 +1,28 @@
// Generated by the Quixos React platform contract. Do not edit.
declare module "@quixos/web-studio-react-runtime" {
import type * as React from "react";
export function useComponentOverlayContainer(): HTMLElement;
export function useComponentStyleRoot(): ShadowRoot;
export type ObjectRef<AtomId extends string> = string & {
readonly $quixosAtom: AtomId;
};
export type FieldCapability = {objectId: string; interfaceRevisionId: string; getOperationId: string; watchOperationId?: string; setOperationId?: string; inputKind?: "fields" | "value"};
export type ReadableField<T> = {readonly value?: T; readonly capability: FieldCapability};
/** set(T) uses the resolved capability: native CRDT fields send incremental edits;
* custom/manual setters receive semantic values. Storage provenance grants no authority. */
export type WritableField<T> = ReadableField<T> & {readonly $writeType?: (value: T) => T; readonly writable: true; readonly capability: FieldCapability & {setOperationId: string}};
export type LiveFieldProp<T> = ReadableField<T>;
export type InterfaceReference<I extends string, Fields> = {readonly $quixosRef: string; readonly interfaceRevisionId: I; readonly fields: Fields};
export type LiveFieldProp<T> = {
value: T;
source: {
objectId: string;
slotId: string;
valueType?: string;
storagePolicy?: string;
revision?: string | number | bigint;
crdtSnapshot?: {
type: string;
encoding: string;
payload: string;
};
};
};
export type ReactComponentHostProps<Action> = {
onAction?: (action: Action) => void;
fallback?: React.ReactNode;
fallback?: unknown;
className?: string;
style?: React.CSSProperties;
/** Optional extra action. The host still displays and reports errors by default. */
extraErrorAction?: (error: Error) => void;
style?: Record<string, string | number | undefined>;
onError?: (error: Error) => void;
};
export type ReactComponentImplementationProps<CaminoProps, RenderProps, Action> = {
camino: CaminoProps;
@@ -36,10 +39,16 @@ declare module "@quixos/web-studio-react-runtime" {
interfaceRevisionId: string,
operationId: string,
value?: unknown,
options?: {clientMutationId?: string; signal?: AbortSignal},
) => Promise<Result>;
export const h: typeof React.createElement;
export function useLiveField<T>(field: ReadableField<T>, options: {write: (value: T) => Promise<void>}): readonly [T, (value: T) => Promise<void>];
export function useLiveField<T>(field: WritableField<T>): readonly [T, (value: T) => Promise<void>];
export function useLiveField<T>(field: ReadableField<T>): readonly [T];
export const h: (...args: any[]) => any;
export const useLiveField: <T>(
field: LiveFieldProp<T>,
options?: {
reconcileRegister?: (state: {
confirmed: T;
optimistic: T;
pending: boolean;
}) => T;
},
) => [T, (value: T) => void | Promise<void>];
}
-2
View File
@@ -1,2 +0,0 @@
// This adapter keeps the implementation file hand-authored.
export { createComponent as handler } from "../project-react.impl.js";
-2
View File
@@ -1,2 +0,0 @@
// This adapter keeps the implementation file hand-authored.
export { props as handler } from "../project-react.impl.js";
-2
View File
@@ -1,2 +0,0 @@
// This adapter keeps the implementation file hand-authored.
export { props as handler } from "../project-react.impl.js";
-2
View File
@@ -1,2 +0,0 @@
// This adapter keeps the implementation file hand-authored.
export { stopWatch as handler } from "../project-react.impl.js";
-2
View File
@@ -1,2 +0,0 @@
// This adapter keeps the implementation file hand-authored.
export { source as handler } from "../project-react.impl.js";
-3
View File
@@ -1,3 +0,0 @@
// Generated by qx-scaffold-v1
import { serveMigration } from "@quixos/camino-package-runtime";
await serveMigration({});
+63 -79
View File
@@ -3,6 +3,8 @@ import {
h,
invokeCapability,
useLiveField,
type LiveFieldProp,
type ObjectRef,
type ReactComponentImplementationProps,
} from "@quixos/web-studio-react-runtime";
import {
@@ -11,11 +13,14 @@ import {
type TodoReactComponentAction,
} from "./gen/quixos.todo.TodoReactComponent.react.js";
import type { ProjectReactComponentRenderProps } from "./gen/quixos.todo.ProjectReactComponent.react.js";
import type { ReactResults } from "./gen/react-props.gen.js";
type TaskRef = TodoComponentProps["forObject"];
type ProjectCaminoProps = ReactResults["propsGet"];
type ProjectCaminoProps = {
project_id: ObjectRef<"atom:project">;
name: LiveFieldProp<string>;
tasks: TaskRef[];
};
type ProjectComponentProps = ReactComponentImplementationProps<
ProjectCaminoProps,
@@ -34,8 +39,7 @@ const colors = {
};
export default function ProjectComponent({ camino, render }: ProjectComponentProps) {
const [name, setName] = useLiveField(camino.named.fields.name);
const [tasks] = useLiveField(camino.tasks.fields.tasks);
const [name, setName] = useLiveField(camino.name);
const [selectedTask, setSelectedTask] = useState<TaskRef | null>(null);
const [newTaskTitle, setNewTaskTitle] = useState("");
const [addingTask, setAddingTask] = useState(false);
@@ -49,7 +53,7 @@ export default function ProjectComponent({ camino, render }: ProjectComponentPro
setAddTaskError("");
try {
await invokeCapability(
camino.named.$quixosRef,
camino.project_id,
"interface:project-actions@1",
"operation:project-actions:add-task",
newTaskTitle,
@@ -63,19 +67,17 @@ export default function ProjectComponent({ camino, render }: ProjectComponentPro
};
return (
<section
style={{
display: "grid",
gridTemplateRows: "auto auto minmax(0, 1fr)",
gap: "12px",
width: "100%",
height: "100%",
minHeight: 0,
padding: render.compact ? "11px" : "14px",
color: colors.ink,
fontFamily: "Avenir Next, Nunito, ui-sans-serif, system-ui, sans-serif",
}}
>
<section style={{
display: "grid",
gridTemplateRows: "auto auto minmax(0, 1fr)",
gap: "12px",
width: "100%",
height: "100%",
minHeight: 0,
padding: render.compact ? "11px" : "14px",
color: colors.ink,
fontFamily: "Avenir Next, Nunito, ui-sans-serif, system-ui, sans-serif",
}}>
<header style={{ display: "flex", alignItems: "center", justifyContent: "space-between", gap: "12px" }}>
<div style={{ display: "grid", gap: "2px", minWidth: 0, flex: 1 }}>
<input
@@ -97,19 +99,17 @@ export default function ProjectComponent({ camino, render }: ProjectComponentPro
/>
<span style={{ color: colors.muted, fontSize: "11px" }}>A little clearing for useful things.</span>
</div>
<span
style={{
flex: "0 0 auto",
border: `1px solid ${colors.line}`,
borderRadius: "8px",
background: colors.paper,
color: colors.moss,
fontSize: "11px",
fontWeight: 800,
padding: "5px 8px",
}}
>
{tasks.length} {tasks.length === 1 ? "task" : "tasks"}
<span style={{
flex: "0 0 auto",
border: `1px solid ${colors.line}`,
borderRadius: "8px",
background: colors.paper,
color: colors.moss,
fontSize: "11px",
fontWeight: 800,
padding: "5px 8px",
}}>
{camino.tasks.length} {camino.tasks.length === 1 ? "task" : "tasks"}
</span>
</header>
@@ -126,13 +126,7 @@ export default function ProjectComponent({ camino, render }: ProjectComponentPro
onInput={(event) => setNewTaskTitle(event.currentTarget.value)}
placeholder="What wants doing?"
disabled={addingTask}
style={{
minWidth: 0,
border: `1px solid ${colors.line}`,
borderRadius: "9px",
background: "#fff",
padding: "8px 10px",
}}
style={{ minWidth: 0, border: `1px solid ${colors.line}`, borderRadius: "9px", background: "#fff", padding: "8px 10px" }}
/>
<button
type="submit"
@@ -150,51 +144,41 @@ export default function ProjectComponent({ camino, render }: ProjectComponentPro
>
{addingTask ? "Planting…" : "Add task"}
</button>
{addTaskError ? (
<div role="alert" style={{ gridColumn: "1 / -1", color: "#9f4741", fontSize: "11px" }}>
{addTaskError}
</div>
) : null}
{addTaskError ? <div role="alert" style={{ gridColumn: "1 / -1", color: "#9f4741", fontSize: "11px" }}>{addTaskError}</div> : null}
</form>
<div
style={{
display: "grid",
alignContent: "start",
gap: "9px",
minHeight: 0,
overflow: "auto",
paddingRight: "3px",
}}
>
{tasks.length === 0 ? (
<div
style={{
display: "grid",
placeItems: "center",
minHeight: render.compact ? "80px" : "140px",
border: `1px dashed ${colors.line}`,
borderRadius: "12px",
background: colors.paper,
color: colors.muted,
fontSize: "12px",
textAlign: "center",
}}
>
<div style={{
display: "grid",
alignContent: "start",
gap: "9px",
minHeight: 0,
overflow: "auto",
paddingRight: "3px",
}}>
{camino.tasks.length === 0 ? (
<div style={{
display: "grid",
placeItems: "center",
minHeight: render.compact ? "80px" : "140px",
border: `1px dashed ${colors.line}`,
borderRadius: "12px",
background: colors.paper,
color: colors.muted,
fontSize: "12px",
textAlign: "center",
}}>
Your project is quiet. Add the first task when it arrives.
</div>
) : (
tasks.map((task) => (
<TodoComponent
key={task}
forObject={task}
selected={selectedTask === task}
compact={render.compact ?? true}
onAction={(action) => handleTaskAction(task, action)}
fallback={<div style={{ color: colors.muted, fontSize: "11px" }}>Waking task…</div>}
/>
))
)}
) : camino.tasks.map((task) => (
<TodoComponent
key={task}
forObject={task}
selected={selectedTask === task}
compact={render.compact ?? true}
onAction={(action) => handleTaskAction(task, action)}
fallback={<div style={{ color: colors.muted, fontSize: "11px" }}>Waking task…</div>}
/>
))}
</div>
</section>
);
+22 -11
View File
@@ -1,13 +1,24 @@
import componentSource from "./project-component.js?browser-source";
import type { Contexts, Results } from "./gen/qx.js";
import fs from "node:fs/promises";
import path from "node:path";
import { fileURLToPath } from "node:url";
import { derived, type RuntimeContext } from "@quixos/camino-package-runtime";
const dirname = path.dirname(fileURLToPath(import.meta.url));
const componentSourcePath = path.join(dirname, "project-component.mjs");
export const source = async () => await fs.readFile(componentSourcePath, "utf8");
export const createComponent = (context: RuntimeContext) => context.objectId;
export const props = derived(async (context: RuntimeContext) => {
const named = context.interface("port:project-react:named");
const tasks = context.interface("port:project-react:tasks");
return {
project_id: named.objectId,
component_id: context.objectId,
name: await named.live("operation:named:name:get"),
tasks: await tasks.invoke("operation:project-tasks:tasks:resolve"),
};
});
export const source = () => componentSource;
export const createComponent = ({ objectId }: Contexts["createComponent"]) => objectId;
export const props = {
kind: "derived" as const,
get: async ({ ports }: Contexts["propsGet"]): Promise<Results["propsGet"]> => ({
named: ports.named.objectId,
tasks: ports.tasks.objectId,
}),
};
export const stopWatch = () => null;
+12 -16
View File
@@ -1,17 +1,13 @@
// Generated by qx-scaffold-v1
import { servePackageRuntime } from "@quixos/camino-package-runtime";
import { createRuntime } from "./gen/qx.js";
import { handler as impl0 } from "./impl/createComponent.js";
import { handler as impl1 } from "./impl/sourceGet.js";
import { handler as impl2 } from "./impl/propsGet.js";
import { handler as impl3 } from "./impl/propsWatch.js";
import { handler as impl4 } from "./impl/propsWatchStop.js";
servePackageRuntime(
createRuntime({
createComponent: impl0,
sourceGet: impl1,
propsGet: impl2,
propsWatch: impl3,
propsWatchStop: impl4,
}),
);
import { createComponent, props, source, stopWatch } from "./project-react.impl.js";
servePackageRuntime({
packageRevisionId: "package:project-react-runtime@1",
exports: {
"export:project-react-runtime:create-component": createComponent,
"export:project-react-runtime:source-get": source,
"export:project-react-runtime:props-get": props,
"export:project-react-runtime:props-watch": props,
"export:project-react-runtime:props-watch-stop": stopWatch,
},
});
+2 -1
View File
@@ -12,7 +12,8 @@
"types": ["node"],
"outDir": "dist",
"rootDir": "src",
"jsx": "react-jsx"
"jsx": "react",
"jsxFactory": "h"
},
"include": ["src/**/*.ts", "src/**/*.tsx"]
}
+1 -1
View File
@@ -161,7 +161,7 @@ cacheEntries = {
"@connectrpc/connect@npm:2.1.2" = { filename = "@connectrpc-connect-npm-2.1.2-ab34825de3-4e15000890.zip"; hash = "sha512-ThUACJAjt1Lv1E+pQKWuHh+gDhvrxLoM7ScruTWSDYw7hbd0UOZErUQruMqaJ1sMFxNviWuo7/A2F4Ex2wHWFQ=="; };
"@esbuild/linux-arm64@npm:0.25.12" = { filename = "@esbuild-linux-arm64-npm-0.25.12-a5aaa0e70e-10c0.zip"; hash = "sha512-tm9zhnNR4GZv4A+Sgbt9jdCJ0iGlzvYxGCaxaScbhFH14mX7QWJRYaCvFCZB1dseApmaq6mNwbilL0wJnbB8tw=="; };
"@esbuild/linux-x64@npm:0.25.12" = { filename = "@esbuild-linux-x64-npm-0.25.12-07c7c22cce-10c0.zip"; hash = "sha512-U2QGT8ZIZN8q2WPSFDC32+sZGKgp49gvnHzIf/vKVR4xIzjcgBbjAIKI+FqfGBmGBWu8eCpS7lR9JDXdUHOFkw=="; };
"@quixos/camino-package-runtime@https://gitea-external.egads.tutti.syntaxblitz.net/quixos/camino-package-runtime.git#commit=cd2b04dc8c2daeea633bf8ecdd31d20fdc41f2ab" = { filename = "@quixos-camino-package-runtime-https-99aa94a9bf-7872db96f5.zip"; hash = "sha512-eHLblvUv7jzGJ45p9j7PY5UsK74OeyZp2Z36rC5ki0BlGUXgCHAzeJ6YvaWov64433kSLJT9NjkocOgUacVvZg=="; };
"@quixos/camino-package-runtime@https://gitea-external.egads.tutti.syntaxblitz.net/quixos/camino-package-runtime.git#commit=79fbee2b32e867bc084f83d46fb46d835a5f149e" = { filename = "@quixos-camino-package-runtime-https-6b15f0bf98-7203f55b47.zip"; hash = "sha512-cgP1W0cHFFYuzH3Ly/fVC9OW5DxQOXyKcViTt6g/DbOMw3f53dOAZ/yh34lAwEJQvoDMaclvOf56bLwaNZ06EA=="; };
"@types/node@npm:24.13.3" = { filename = "@types-node-npm-24.13.3-b512a0bbeb-a5bc08f49b.zip"; hash = "sha512-pbwI9JuVgdzcqQ4CzXcZejx5mECAdmSULlzVFhpVPU0q6AZPfjKUQQ10jX0Ji1wYSL5/pQwG8pxBk6sWvk5Z6w=="; };
"@types/prop-types@npm:15.7.15" = { filename = "@types-prop-types-npm-15.7.15-cefe16a1fa-b59aad1ad1.zip"; hash = "sha512-tZqtGtGb8XM89ST9TmGBlsbHaQ9I7nCjJ+tFCkKquOigY/vlnKClcBrr4tktWCKSwPuEXqV0dPahX2mUsOJgsg=="; };
"@types/react@npm:18.3.31" = { filename = "@types-react-npm-18.3.31-d376eb19a5-44180549dd.zip"; hash = "sha512-RBgFSd0EX1Nuzs0545qs34KOdq3BxKkLEy9FPiPMNwxGSNkQKuQBFy69j9ixl3qQGjniFOU+x3FxsnUUtYjBeQ=="; };
+4 -4
View File
@@ -213,14 +213,14 @@ __metadata:
languageName: node
linkType: hard
"@quixos/camino-package-runtime@https://gitea-external.egads.tutti.syntaxblitz.net/quixos/camino-package-runtime.git#commit=cd2b04dc8c2daeea633bf8ecdd31d20fdc41f2ab":
"@quixos/camino-package-runtime@https://gitea-external.egads.tutti.syntaxblitz.net/quixos/camino-package-runtime.git#commit=79fbee2b32e867bc084f83d46fb46d835a5f149e":
version: 0.1.0
resolution: "@quixos/camino-package-runtime@https://gitea-external.egads.tutti.syntaxblitz.net/quixos/camino-package-runtime.git#commit=cd2b04dc8c2daeea633bf8ecdd31d20fdc41f2ab"
resolution: "@quixos/camino-package-runtime@https://gitea-external.egads.tutti.syntaxblitz.net/quixos/camino-package-runtime.git#commit=79fbee2b32e867bc084f83d46fb46d835a5f149e"
dependencies:
"@bufbuild/protobuf": "npm:^2.12.1"
"@connectrpc/connect": "npm:^2.1.2"
"@connectrpc/connect-node": "npm:^2.1.2"
checksum: 10c0/7872db96f52fee3cc6278e69f63ecf63952c2bbe0e7b2669d99dfaac2e648b40651945e0087033789e98bda5a8bfae38df79122c94fd36392870e81469c56f66
checksum: 10c0/7203f55b470714562ecc7dcbcbf7d50bd396e43c50397c8a715893b7a83f0db38cc377f9ddd38067fca1df8940c04250be80cc69c96f39fe7a6cbc1a359d3a10
languageName: node
linkType: hard
@@ -228,7 +228,7 @@ __metadata:
version: 0.0.0-use.local
resolution: "@quixos/project-react-runtime@workspace:."
dependencies:
"@quixos/camino-package-runtime": "https://gitea-external.egads.tutti.syntaxblitz.net/quixos/camino-package-runtime.git#commit=cd2b04dc8c2daeea633bf8ecdd31d20fdc41f2ab"
"@quixos/camino-package-runtime": "https://gitea-external.egads.tutti.syntaxblitz.net/quixos/camino-package-runtime.git#commit=79fbee2b32e867bc084f83d46fb46d835a5f149e"
"@types/node": "npm:^24"
"@types/react": "npm:^18.3.12"
esbuild: "npm:^0.25.12"