import * as __ctHelpers from "commontools"; import { derive, recipe, UI } from "commontools"; interface SubItem { id: number; name: string; active: boolean; } interface Item { id: number; title: string; subItems: SubItem[]; } interface State { items: Item[]; } export default recipe({ type: "object", properties: { items: { type: "array", items: { $ref: "#/$defs/Item" } } }, required: ["items"], $defs: { Item: { type: "object", properties: { id: { type: "number" }, title: { type: "string" }, subItems: { type: "array", items: { $ref: "#/$defs/SubItem" } } }, required: ["id", "title", "subItems"] }, SubItem: { type: "object", properties: { id: { type: "number" }, name: { type: "string" }, active: { type: "boolean" } }, required: ["id", "name", "active"] } } } as const satisfies __ctHelpers.JSONSchema, { type: "object", properties: { $UI: { $ref: "#/$defs/Element" } }, required: ["$UI"], $defs: { Element: { type: "object", properties: { type: { type: "string", "enum": ["vnode"] }, name: { type: "string" }, props: { $ref: "#/$defs/Props" }, children: { $ref: "#/$defs/RenderNode" }, $UI: { $ref: "#/$defs/VNode" } }, required: ["type", "name", "props"] }, VNode: { type: "object", properties: { type: { type: "string", "enum": ["vnode"] }, name: { type: "string" }, props: { $ref: "#/$defs/Props" }, children: { $ref: "#/$defs/RenderNode" }, $UI: { $ref: "#/$defs/VNode" } }, required: ["type", "name", "props"] }, RenderNode: { anyOf: [{ type: "string" }, { type: "number" }, { type: "boolean", "enum": [false] }, { type: "boolean", "enum": [true] }, { $ref: "#/$defs/VNode" }, { type: "object", properties: {} }, { type: "array", items: { $ref: "#/$defs/RenderNode" } }] }, Props: { type: "object", properties: {}, additionalProperties: { anyOf: [{ type: "string" }, { type: "number" }, { type: "boolean", "enum": [false] }, { type: "boolean", "enum": [true] }, { type: "object", additionalProperties: true }, { type: "array", items: true }, { asCell: true }, { asStream: true }, { type: "null" }] } } } } as const satisfies __ctHelpers.JSONSchema, (state) => { return { [UI]: (
Active items:{" "} {derive({ type: "array", items: { $ref: "#/$defs/SubItem" }, $defs: { SubItem: { type: "object", properties: { id: { type: "number" }, name: { type: "string" }, active: { type: "boolean" } }, required: ["id", "name", "active"] } } } as const satisfies __ctHelpers.JSONSchema, { type: "string" } as const satisfies __ctHelpers.JSONSchema, item.subItems, (subs) => subs .filter((s) => s.active) .map((s) => s.name) .join(", "))}