import * as __ctHelpers from "commontools"; import { recipe, UI } from "commontools"; interface State { count: number; price: number; discount: number; quantity: number; } export default recipe({ type: "object", properties: { count: { type: "number" }, price: { type: "number" }, discount: { type: "number" }, quantity: { type: "number" } }, required: ["count", "price", "discount", "quantity"] } 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]: (
Count + 1: {__ctHelpers.derive({ type: "object", properties: { state: { type: "object", properties: { count: { type: "number", asOpaque: true } }, required: ["count"] } }, required: ["state"] } as const satisfies __ctHelpers.JSONSchema, { type: "number" } as const satisfies __ctHelpers.JSONSchema, { state: { count: state.count } }, ({ state }) => state.count + 1)}
Count - 1: {__ctHelpers.derive({ type: "object", properties: { state: { type: "object", properties: { count: { type: "number", asOpaque: true } }, required: ["count"] } }, required: ["state"] } as const satisfies __ctHelpers.JSONSchema, { type: "number" } as const satisfies __ctHelpers.JSONSchema, { state: { count: state.count } }, ({ state }) => state.count - 1)}
Count * 2: {__ctHelpers.derive({ type: "object", properties: { state: { type: "object", properties: { count: { type: "number", asOpaque: true } }, required: ["count"] } }, required: ["state"] } as const satisfies __ctHelpers.JSONSchema, { type: "number" } as const satisfies __ctHelpers.JSONSchema, { state: { count: state.count } }, ({ state }) => state.count * 2)}
Price / 2: {__ctHelpers.derive({ type: "object", properties: { state: { type: "object", properties: { price: { type: "number", asOpaque: true } }, required: ["price"] } }, required: ["state"] } as const satisfies __ctHelpers.JSONSchema, { type: "number" } as const satisfies __ctHelpers.JSONSchema, { state: { price: state.price } }, ({ state }) => state.price / 2)}
Count % 3: {__ctHelpers.derive({ type: "object", properties: { state: { type: "object", properties: { count: { type: "number", asOpaque: true } }, required: ["count"] } }, required: ["state"] } as const satisfies __ctHelpers.JSONSchema, { type: "number" } as const satisfies __ctHelpers.JSONSchema, { state: { count: state.count } }, ({ state }) => state.count % 3)}
Discounted Price: {__ctHelpers.derive({ type: "object", properties: { state: { type: "object", properties: { price: { type: "number", asOpaque: true }, discount: { type: "number", asOpaque: true } }, required: ["price", "discount"] } }, required: ["state"] } as const satisfies __ctHelpers.JSONSchema, { type: "number" } as const satisfies __ctHelpers.JSONSchema, { state: { price: state.price, discount: state.discount } }, ({ state }) => state.price - (state.price * state.discount))}
Total: {__ctHelpers.derive({ type: "object", properties: { state: { type: "object", properties: { price: { type: "number", asOpaque: true }, quantity: { type: "number", asOpaque: true } }, required: ["price", "quantity"] } }, required: ["state"] } as const satisfies __ctHelpers.JSONSchema, { type: "number" } as const satisfies __ctHelpers.JSONSchema, { state: { price: state.price, quantity: state.quantity } }, ({ state }) => state.price * state.quantity)}
With Tax (8%): {__ctHelpers.derive({ type: "object", properties: { state: { type: "object", properties: { price: { type: "number", asOpaque: true }, quantity: { type: "number", asOpaque: true } }, required: ["price", "quantity"] } }, required: ["state"] } as const satisfies __ctHelpers.JSONSchema, { type: "number" } as const satisfies __ctHelpers.JSONSchema, { state: { price: state.price, quantity: state.quantity } }, ({ state }) => (state.price * state.quantity) * 1.08)}
Complex: {__ctHelpers.derive({ type: "object", properties: { state: { type: "object", properties: { count: { type: "number", asOpaque: true }, quantity: { type: "number", asOpaque: true }, price: { type: "number", asOpaque: true }, discount: { type: "number", asOpaque: true } }, required: ["count", "quantity", "price", "discount"] } }, required: ["state"] } as const satisfies __ctHelpers.JSONSchema, { type: "number" } as const satisfies __ctHelpers.JSONSchema, { state: { count: state.count, quantity: state.quantity, price: state.price, discount: state.discount } }, ({ state }) => (state.count + state.quantity) * state.price - (state.price * state.discount))}
Count³: {__ctHelpers.derive({ type: "object", properties: { state: { type: "object", properties: { count: { type: "number", asOpaque: true } }, required: ["count"] } }, required: ["state"] } as const satisfies __ctHelpers.JSONSchema, { type: "number" } as const satisfies __ctHelpers.JSONSchema, { state: { count: state.count } }, ({ state }) => state.count * state.count * state.count)}
Price Range: ${__ctHelpers.derive({ type: "object", properties: { state: { type: "object", properties: { price: { type: "number", asOpaque: true } }, required: ["price"] } }, required: ["state"] } as const satisfies __ctHelpers.JSONSchema, { type: "number" } as const satisfies __ctHelpers.JSONSchema, { state: { price: state.price } }, ({ state }) => state.price - 10)} - ${__ctHelpers.derive({ type: "object", properties: { state: { type: "object", properties: { price: { type: "number", asOpaque: true } }, required: ["price"] } }, required: ["state"] } as const satisfies __ctHelpers.JSONSchema, { type: "number" } as const satisfies __ctHelpers.JSONSchema, { state: { price: state.price } }, ({ state }) => state.price + 10)}