import * as __ctHelpers from "commontools"; /** * Test case for nested map transformation inside ternary. * * The key scenario: `item.tags.map(...)` where `item` is from an outer * `mapWithPattern` callback, and the whole thing is inside a ternary * that gets wrapped in `ifElse` → `derive`. * * The inner map on `item.tags` should still be transformed to * `mapWithPattern` because `item` comes from a mapWithPattern element, * NOT from the derive's captures. */ import { Cell, computed, Default, pattern, UI } from "commontools"; interface Tag { name: string; } interface Item { label: string; tags: Tag[]; selectedIndex: number; } interface PatternInput { items?: Cell>; } export default pattern(({ items }) => { const hasItems = __ctHelpers.derive({ type: "object", properties: { items: { type: "array", items: { $ref: "#/$defs/Item" }, asCell: true } }, required: ["items"], $defs: { Item: { type: "object", properties: { label: { type: "string" }, tags: { type: "array", items: { $ref: "#/$defs/Tag" } }, selectedIndex: { type: "number" } }, required: ["label", "tags", "selectedIndex"] }, Tag: { type: "object", properties: { name: { type: "string" } }, required: ["name"] } } } as const satisfies __ctHelpers.JSONSchema, { type: "boolean" } as const satisfies __ctHelpers.JSONSchema, { items: items }, ({ items }) => items.get().length > 0); return { [UI]: (
{__ctHelpers.ifElse({ type: "boolean", asOpaque: true } as const satisfies __ctHelpers.JSONSchema, { type: "array", items: { $ref: "#/$defs/Element" }, asOpaque: true, $defs: { Element: { type: "object", properties: { type: { type: "string" }, 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" }, 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" }, { $ref: "#/$defs/VNode" }, { type: "object", properties: {} }, { type: "array", items: { $ref: "#/$defs/RenderNode" } }] }, Props: { type: "object", properties: {}, additionalProperties: { anyOf: [{ type: "string" }, { type: "number" }, { type: "boolean" }, { type: "object", additionalProperties: true }, { type: "array", items: true }, {}, { type: "null" }] } } } } as const satisfies __ctHelpers.JSONSchema, { type: "object", properties: { type: { type: "string" }, name: { type: "string" }, props: { $ref: "#/$defs/Props" }, children: { $ref: "#/$defs/RenderNode" }, $UI: { $ref: "#/$defs/VNode" } }, required: ["type", "name", "props"], $defs: { VNode: { type: "object", properties: { type: { type: "string" }, 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" }, { $ref: "#/$defs/VNode" }, { type: "object", properties: {} }, { type: "array", items: { $ref: "#/$defs/RenderNode" } }] }, Props: { type: "object", properties: {}, additionalProperties: { anyOf: [{ type: "string" }, { type: "number" }, { type: "boolean" }, { type: "object", additionalProperties: true }, { type: "array", items: true }, {}, { type: "null" }] } } } } as const satisfies __ctHelpers.JSONSchema, { anyOf: [{ $ref: "#/$defs/Element" }, { type: "array", items: { $ref: "#/$defs/Element" }, asOpaque: true }], $defs: { Element: { type: "object", properties: { type: { type: "string" }, 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" }, 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" }, { $ref: "#/$defs/VNode" }, { type: "object", properties: {} }, { type: "array", items: { $ref: "#/$defs/RenderNode" } }] }, Props: { type: "object", properties: {}, additionalProperties: { anyOf: [{ type: "string" }, { type: "number" }, { type: "boolean" }, { type: "object", additionalProperties: true }, { type: "array", items: true }, {}, { type: "null" }] } } } } as const satisfies __ctHelpers.JSONSchema, hasItems, __ctHelpers.derive({ type: "object", properties: { items: { type: "array", items: { $ref: "#/$defs/Item" }, asCell: true } }, required: ["items"], $defs: { Item: { type: "object", properties: { label: { type: "string" }, tags: { type: "array", items: { $ref: "#/$defs/Tag" } }, selectedIndex: { type: "number" } }, required: ["label", "tags", "selectedIndex"] }, Tag: { type: "object", properties: { name: { type: "string" } }, required: ["name"] } } } as const satisfies __ctHelpers.JSONSchema, { type: "array", items: { $ref: "#/$defs/Element" }, asOpaque: true, $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, { items: items }, ({ items }) => (items.mapWithPattern(__ctHelpers.recipe({ type: "object", properties: { element: { $ref: "#/$defs/Item" }, params: { type: "object", properties: {} } }, required: ["element", "params"], $defs: { Item: { type: "object", properties: { label: { type: "string" }, tags: { type: "array", items: { $ref: "#/$defs/Tag" } }, selectedIndex: { type: "number" } }, required: ["label", "tags", "selectedIndex"] }, Tag: { type: "object", properties: { name: { type: "string" } }, required: ["name"] } } } as const satisfies __ctHelpers.JSONSchema, { 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"], $defs: { 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, ({ element: item, params: {} }) => (
{item.label}
    {item.tags.mapWithPattern(__ctHelpers.recipe({ type: "object", properties: { element: { $ref: "#/$defs/Tag" }, index: { type: "number" }, params: { type: "object", properties: { item: { type: "object", properties: { selectedIndex: { type: "number", asOpaque: true } }, required: ["selectedIndex"] } }, required: ["item"] } }, required: ["element", "params"], $defs: { Tag: { type: "object", properties: { name: { type: "string" } }, required: ["name"] } } } as const satisfies __ctHelpers.JSONSchema, { 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"], $defs: { 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, ({ element: tag, index: i, params: { item } }) => (
  • {__ctHelpers.ifElse({ type: "boolean" } as const satisfies __ctHelpers.JSONSchema, { type: "string" } as const satisfies __ctHelpers.JSONSchema, { type: "string" } as const satisfies __ctHelpers.JSONSchema, { "enum": ["", "* "] } as const satisfies __ctHelpers.JSONSchema, __ctHelpers.derive({ type: "object", properties: { i: { type: "number", asOpaque: true }, item: { type: "object", properties: { selectedIndex: { type: "number", asOpaque: true } }, required: ["selectedIndex"] } }, required: ["i", "item"] } as const satisfies __ctHelpers.JSONSchema, { type: "boolean" } as const satisfies __ctHelpers.JSONSchema, { i: i, item: { selectedIndex: item.selectedIndex } }, ({ i, item }) => i === item.selectedIndex), "* ", "")} {tag.name}
  • )), { item: { selectedIndex: item.selectedIndex } })}
)), {}))),

No items

)}
), }; }, { type: "object", properties: { items: { type: "array", items: { $ref: "#/$defs/Item" }, "default": [], asCell: true } }, $defs: { Item: { type: "object", properties: { label: { type: "string" }, tags: { type: "array", items: { $ref: "#/$defs/Tag" } }, selectedIndex: { type: "number" } }, required: ["label", "tags", "selectedIndex"] }, Tag: { type: "object", properties: { name: { type: "string" } }, required: ["name"] } } } 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); // @ts-ignore: Internals function h(...args: any[]) { return __ctHelpers.h.apply(null, args); } // @ts-ignore: Internals h.fragment = __ctHelpers.h.fragment;