@continuum-dev/starter-kit 0.1.4

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Bryton Cooper
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,39 @@
+# @continuum-dev/starter-kit
+
+Website: [continuumstack.dev](https://continuumstack.dev)
+GitHub: [brytoncooper/continuum-dev](https://github.com/brytoncooper/continuum-dev)
+
+`@continuum-dev/starter-kit` is the fastest way to get Continuum on screen in a React app.
+
+Continuum itself stays headless by design. The starter kit is the opinionated convenience layer:
+
+- ready-to-use primitives for common Continuum node types
+- a default component map
+- proposal and suggestion UI helpers
+- prompt helpers re-exported from `@continuum-dev/prompts`
+
+## Install
+
+```bash
+npm install @continuum-dev/starter-kit react
+```
+
+## Use it when
+
+- you want a polished starting point instead of building your own component map first
+- you want proposal-safe UI ready on day one
+- you want prompt helpers available from the same package surface
+
+## Example
+
+```tsx
+import { ContinuumProvider, ContinuumRenderer, starterKitComponentMap } from '@continuum-dev/starter-kit';
+
+export function App() {
+  return (
+    <ContinuumProvider components={starterKitComponentMap} persist="localStorage">
+      <ContinuumRenderer view={view} />
+    </ContinuumProvider>
+  );
+}
+```

package/index.d.ts

@@ -0,0 +1,14 @@
+export { ContinuumProvider, ContinuumRenderer } from '@continuum-dev/react';
+export * from '@continuum-dev/core';
+export type { ContinuumNodeMap, ContinuumNodeProps, ContinuumProviderProps, ContinuumPersistError, } from '@continuum-dev/react';
+export { useContinuumAction, useContinuumConflict, useContinuumDiagnostics, useContinuumHydrated, useContinuumSession, useContinuumSnapshot, useContinuumState, useContinuumSuggestions, useContinuumViewport, } from '@continuum-dev/react';
+export * from '@continuum-dev/prompts';
+export { starterKitComponentMap } from './lib/component-map.js';
+export * from './lib/primitives/index.js';
+export { FieldFrame, inputLikeStyle } from './lib/primitives/shared/field-frame.js';
+export { nodeDescription, nodeLabel, nodeNumberProp, nodeOptions, nodePlaceholder, readNodeProp, } from './lib/primitives/shared/node.js';
+export * from './lib/proposals/conflict-banner.js';
+export * from './lib/proposals/field-proposal.js';
+export * from './lib/proposals/suggestions-bar.js';
+export * from './lib/tokens.js';
+//# sourceMappingURL=index.d.ts.map

package/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../packages/starter-kit/src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AACxE,cAAc,iBAAiB,CAAC;AAChC,YAAY,EACV,gBAAgB,EAChB,kBAAkB,EAClB,sBAAsB,EACtB,qBAAqB,GACtB,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EACL,kBAAkB,EAClB,oBAAoB,EACpB,uBAAuB,EACvB,oBAAoB,EACpB,mBAAmB,EACnB,oBAAoB,EACpB,iBAAiB,EACjB,uBAAuB,EACvB,oBAAoB,GACrB,MAAM,kBAAkB,CAAC;AAC1B,cAAc,oBAAoB,CAAC;AACnC,OAAO,EAAE,sBAAsB,EAAE,MAAM,wBAAwB,CAAC;AAChE,cAAc,2BAA2B,CAAC;AAC1C,OAAO,EAAE,UAAU,EAAE,cAAc,EAAE,MAAM,wCAAwC,CAAC;AACpF,OAAO,EACL,eAAe,EACf,SAAS,EACT,cAAc,EACd,WAAW,EACX,eAAe,EACf,YAAY,GACb,MAAM,iCAAiC,CAAC;AACzC,cAAc,oCAAoC,CAAC;AACnD,cAAc,mCAAmC,CAAC;AAClD,cAAc,oCAAoC,CAAC;AACnD,cAAc,iBAAiB,CAAC"}

package/index.js

@@ -0,0 +1,12 @@
+export { ContinuumProvider, ContinuumRenderer } from '@continuum-dev/react';
+export * from '@continuum-dev/core';
+export { useContinuumAction, useContinuumConflict, useContinuumDiagnostics, useContinuumHydrated, useContinuumSession, useContinuumSnapshot, useContinuumState, useContinuumSuggestions, useContinuumViewport, } from '@continuum-dev/react';
+export * from '@continuum-dev/prompts';
+export { starterKitComponentMap } from './lib/component-map.js';
+export * from './lib/primitives/index.js';
+export { FieldFrame, inputLikeStyle } from './lib/primitives/shared/field-frame.js';
+export { nodeDescription, nodeLabel, nodeNumberProp, nodeOptions, nodePlaceholder, readNodeProp, } from './lib/primitives/shared/node.js';
+export * from './lib/proposals/conflict-banner.js';
+export * from './lib/proposals/field-proposal.js';
+export * from './lib/proposals/suggestions-bar.js';
+export * from './lib/tokens.js';

package/lib/component-map.d.ts

@@ -0,0 +1,3 @@
+import type { ContinuumNodeMap } from '@continuum-dev/react';
+export declare const starterKitComponentMap: ContinuumNodeMap;
+//# sourceMappingURL=component-map.d.ts.map

package/lib/component-map.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"component-map.d.ts","sourceRoot":"","sources":["../../../../packages/starter-kit/src/lib/component-map.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAC;AAkBzD,eAAO,MAAM,sBAAsB,EAAE,gBAepC,CAAC"}

package/lib/component-map.js

@@ -0,0 +1,17 @@
+import { ActionButton, CollectionSection, DateInput, GridSection, GroupSection, Presentation, RadioGroupInput, RowSection, SelectInput, SliderInput, TextareaInput, TextInput, ToggleInput, UnknownNode, } from './primitives/index.js';
+export const starterKitComponentMap = {
+    field: TextInput,
+    select: SelectInput,
+    toggle: ToggleInput,
+    date: DateInput,
+    textarea: TextareaInput,
+    'radio-group': RadioGroupInput,
+    slider: SliderInput,
+    action: ActionButton,
+    presentation: Presentation,
+    group: GroupSection,
+    row: RowSection,
+    grid: GridSection,
+    collection: CollectionSection,
+    default: UnknownNode,
+};

package/lib/primitives/actions/action-button.d.ts

@@ -0,0 +1,3 @@
+import type { ContinuumNodeProps } from '@continuum-dev/react';
+export declare function ActionButton({ definition }: ContinuumNodeProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=action-button.d.ts.map

package/lib/primitives/actions/action-button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"action-button.d.ts","sourceRoot":"","sources":["../../../../../../packages/starter-kit/src/lib/primitives/actions/action-button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AAK3D,wBAAgB,YAAY,CAAC,EAAE,UAAU,EAAE,EAAE,kBAAkB,2CA6C9D"}

package/lib/primitives/actions/action-button.js

@@ -0,0 +1,29 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useContinuumAction } from '@continuum-dev/react';
+import { color, control, radius, space, type } from '../../tokens.js';
+import { nodeDescription, nodeLabel, readNodeProp } from '../shared/node.js';
+export function ActionButton({ definition }) {
+    const intentId = readNodeProp(definition, 'intentId') ?? '';
+    const { dispatch, isDispatching, lastResult } = useContinuumAction(intentId);
+    return (_jsxs("div", { style: {
+            display: 'grid',
+            gap: space.sm,
+            alignContent: 'start',
+            justifyItems: 'end',
+            width: '100%',
+            flex: '1 0 100%',
+        }, children: [_jsx("button", { type: "button", style: {
+                    height: control.height,
+                    padding: `0 ${space.lg}px`,
+                    borderRadius: radius.md,
+                    border: `1px solid ${color.borderStrong}`,
+                    background: color.accent,
+                    color: color.surface,
+                    cursor: 'pointer',
+                    justifySelf: 'end',
+                    ...type.body,
+                    fontWeight: 600,
+                }, onClick: () => {
+                    void dispatch(definition.id);
+                }, children: isDispatching ? 'Working…' : nodeLabel(definition) }), nodeDescription(definition) ? (_jsx("div", { style: { ...type.small, color: color.textMuted, textAlign: 'right' }, children: nodeDescription(definition) })) : null, lastResult ? (_jsx("div", { style: { ...type.small, color: color.textMuted, textAlign: 'right' }, children: lastResult.success ? 'Action completed' : 'Action failed' })) : null] }));
+}

package/lib/primitives/content/presentation.d.ts

@@ -0,0 +1,3 @@
+import type { ContinuumNodeProps } from '@continuum-dev/react';
+export declare function Presentation({ definition }: ContinuumNodeProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=presentation.d.ts.map

package/lib/primitives/content/presentation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"presentation.d.ts","sourceRoot":"","sources":["../../../../../../packages/starter-kit/src/lib/primitives/content/presentation.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AAI3D,wBAAgB,YAAY,CAAC,EAAE,UAAU,EAAE,EAAE,kBAAkB,2CAc9D"}

package/lib/primitives/content/presentation.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { color, space, type } from '../../tokens.js';
+import { readNodeProp } from '../shared/node.js';
+export function Presentation({ definition }) {
+    const content = readNodeProp(definition, 'content') ?? '';
+    return (_jsx("div", { style: {
+            display: 'grid',
+            gap: space.sm,
+            padding: `${space.sm}px 0`,
+        }, children: _jsx("div", { style: { ...type.body, color: color.text }, children: content }) }));
+}

package/lib/primitives/content/unknown-node.d.ts

@@ -0,0 +1,3 @@
+import type { ContinuumNodeProps } from '@continuum-dev/react';
+export declare function UnknownNode({ definition }: ContinuumNodeProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=unknown-node.d.ts.map

package/lib/primitives/content/unknown-node.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"unknown-node.d.ts","sourceRoot":"","sources":["../../../../../../packages/starter-kit/src/lib/primitives/content/unknown-node.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AAG3D,wBAAgB,WAAW,CAAC,EAAE,UAAU,EAAE,EAAE,kBAAkB,2CAe7D"}

package/lib/primitives/content/unknown-node.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { color, radius, space, type } from '../../tokens.js';
+export function UnknownNode({ definition }) {
+    return (_jsx("div", { style: {
+            padding: space.lg,
+            borderRadius: radius.md,
+            border: `1px dashed ${color.border}`,
+            background: color.surfaceMuted,
+            ...type.small,
+            color: color.textMuted,
+        }, children: `No starter-kit primitive mapped for "${definition.type}"` }));
+}

package/lib/primitives/fields/date-input.d.ts

@@ -0,0 +1,3 @@
+import type { ContinuumNodeProps } from '@continuum-dev/react';
+export declare function DateInput({ value, onChange, definition }: ContinuumNodeProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=date-input.d.ts.map

package/lib/primitives/fields/date-input.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"date-input.d.ts","sourceRoot":"","sources":["../../../../../../packages/starter-kit/src/lib/primitives/fields/date-input.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AAI3D,wBAAgB,SAAS,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,UAAU,EAAE,EAAE,kBAAkB,2CAa5E"}

package/lib/primitives/fields/date-input.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { FieldFrame, inputLikeStyle } from '../shared/field-frame.js';
+import { nodeDescription, nodeLabel } from '../shared/node.js';
+export function DateInput({ value, onChange, definition }) {
+    const dateValue = value?.value ?? '';
+    return (_jsx(FieldFrame, { label: nodeLabel(definition), description: nodeDescription(definition), children: _jsx("input", { type: "date", value: dateValue, style: inputLikeStyle(), onChange: (event) => onChange({ value: event.target.value, isDirty: true }) }) }));
+}

package/lib/primitives/fields/radio-group.d.ts

@@ -0,0 +1,3 @@
+import type { ContinuumNodeProps } from '@continuum-dev/react';
+export declare function RadioGroupInput({ value, onChange, definition }: ContinuumNodeProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=radio-group.d.ts.map

package/lib/primitives/fields/radio-group.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"radio-group.d.ts","sourceRoot":"","sources":["../../../../../../packages/starter-kit/src/lib/primitives/fields/radio-group.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AAgB3D,wBAAgB,eAAe,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,UAAU,EAAE,EAAE,kBAAkB,2CAqBlF"}

package/lib/primitives/fields/radio-group.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { color, radius, space, type } from '../../tokens.js';
+import { FieldFrame } from '../shared/field-frame.js';
+import { nodeDescription, nodeLabel, nodeOptions } from '../shared/node.js';
+const optionStyle = {
+    display: 'flex',
+    alignItems: 'center',
+    gap: space.md,
+    padding: `${space.sm}px ${space.md}px`,
+    borderRadius: radius.md,
+    border: `1px solid ${color.borderSoft}`,
+    background: color.surfaceMuted,
+};
+export function RadioGroupInput({ value, onChange, definition }) {
+    const selected = value?.value ?? '';
+    const options = nodeOptions(definition);
+    return (_jsx(FieldFrame, { label: nodeLabel(definition), description: nodeDescription(definition), children: _jsx("div", { style: { display: 'grid', gap: space.sm }, children: options.map((option) => (_jsxs("label", { style: optionStyle, children: [_jsx("input", { type: "radio", name: definition.id, checked: selected === option.value, onChange: () => onChange({ value: option.value, isDirty: true }) }), _jsx("span", { style: { ...type.body, color: color.text }, children: option.label })] }, option.value))) }) }));
+}

package/lib/primitives/fields/select-input.d.ts

@@ -0,0 +1,3 @@
+import type { ContinuumNodeProps } from '@continuum-dev/react';
+export declare function SelectInput({ value, onChange, definition }: ContinuumNodeProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=select-input.d.ts.map

package/lib/primitives/fields/select-input.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"select-input.d.ts","sourceRoot":"","sources":["../../../../../../packages/starter-kit/src/lib/primitives/fields/select-input.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AAI3D,wBAAgB,WAAW,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,UAAU,EAAE,EAAE,kBAAkB,2CAoB9E"}

package/lib/primitives/fields/select-input.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { FieldFrame, inputLikeStyle } from '../shared/field-frame.js';
+import { nodeDescription, nodeLabel, nodeOptions } from '../shared/node.js';
+export function SelectInput({ value, onChange, definition }) {
+    const selected = value?.value ?? '';
+    const options = nodeOptions(definition);
+    return (_jsx(FieldFrame, { label: nodeLabel(definition), description: nodeDescription(definition), children: _jsxs("select", { value: selected, style: inputLikeStyle({ cursor: 'pointer', paddingRight: 40 }), onChange: (event) => onChange({ value: event.target.value, isDirty: true }), children: [_jsx("option", { value: "", children: "Select one" }), options.map((option) => (_jsx("option", { value: option.value, children: option.label }, option.value)))] }) }));
+}

package/lib/primitives/fields/slider-input.d.ts

@@ -0,0 +1,3 @@
+import type { ContinuumNodeProps } from '@continuum-dev/react';
+export declare function SliderInput({ value, onChange, definition }: ContinuumNodeProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=slider-input.d.ts.map

package/lib/primitives/fields/slider-input.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"slider-input.d.ts","sourceRoot":"","sources":["../../../../../../packages/starter-kit/src/lib/primitives/fields/slider-input.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AAK3D,wBAAgB,WAAW,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,UAAU,EAAE,EAAE,kBAAkB,2CA4B9E"}

package/lib/primitives/fields/slider-input.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { color, space, type } from '../../tokens.js';
+import { FieldFrame } from '../shared/field-frame.js';
+import { nodeDescription, nodeLabel, nodeNumberProp } from '../shared/node.js';
+export function SliderInput({ value, onChange, definition }) {
+    const min = nodeNumberProp(definition, 'min', 0);
+    const max = nodeNumberProp(definition, 'max', 100);
+    const fallback = Math.round((min + max) / 2);
+    const numericValue = typeof value?.value === 'number'
+        ? value.value
+        : fallback;
+    return (_jsx(FieldFrame, { label: nodeLabel(definition), description: nodeDescription(definition), children: _jsxs("div", { style: { display: 'grid', gap: space.sm }, children: [_jsxs("div", { style: { display: 'flex', justifyContent: 'space-between', ...type.small, color: color.textMuted }, children: [_jsx("span", { children: min }), _jsx("span", { style: { color: color.text }, children: numericValue }), _jsx("span", { children: max })] }), _jsx("input", { type: "range", min: min, max: max, value: numericValue, style: { width: '100%', accentColor: color.accent }, onChange: (event) => onChange({ value: Number(event.target.value), isDirty: true }) })] }) }));
+}

package/lib/primitives/fields/text-input.d.ts

@@ -0,0 +1,3 @@
+import type { ContinuumNodeProps } from '@continuum-dev/react';
+export declare function TextInput({ value, onChange, definition }: ContinuumNodeProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=text-input.d.ts.map

package/lib/primitives/fields/text-input.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"text-input.d.ts","sourceRoot":"","sources":["../../../../../../packages/starter-kit/src/lib/primitives/fields/text-input.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AAI3D,wBAAgB,SAAS,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,UAAU,EAAE,EAAE,kBAAkB,2CA6B5E"}

package/lib/primitives/fields/text-input.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { FieldFrame, inputLikeStyle } from '../shared/field-frame.js';
+import { nodeDescription, nodeLabel, nodePlaceholder, readNodeProp } from '../shared/node.js';
+export function TextInput({ value, onChange, definition }) {
+    const dataType = readNodeProp(definition, 'dataType') ?? 'string';
+    const rawValue = value?.value;
+    const displayValue = dataType === 'number'
+        ? typeof rawValue === 'number'
+            ? String(rawValue)
+            : ''
+        : typeof rawValue === 'string'
+            ? rawValue
+            : '';
+    return (_jsx(FieldFrame, { label: nodeLabel(definition), description: nodeDescription(definition), children: _jsx("input", { type: dataType === 'number' ? 'number' : 'text', value: displayValue, placeholder: nodePlaceholder(definition) ?? `Enter ${nodeLabel(definition).toLowerCase()}`, readOnly: Boolean(readNodeProp(definition, 'readOnly')), style: inputLikeStyle(), onChange: (event) => onChange({
+                value: dataType === 'number' ? Number(event.target.value) : event.target.value,
+                isDirty: true,
+            }) }) }));
+}

package/lib/primitives/fields/textarea-input.d.ts

@@ -0,0 +1,3 @@
+import type { ContinuumNodeProps } from '@continuum-dev/react';
+export declare function TextareaInput({ value, onChange, definition }: ContinuumNodeProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=textarea-input.d.ts.map

package/lib/primitives/fields/textarea-input.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"textarea-input.d.ts","sourceRoot":"","sources":["../../../../../../packages/starter-kit/src/lib/primitives/fields/textarea-input.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AAI3D,wBAAgB,aAAa,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,UAAU,EAAE,EAAE,kBAAkB,2CAahF"}

package/lib/primitives/fields/textarea-input.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { FieldFrame, inputLikeStyle } from '../shared/field-frame.js';
+import { nodeDescription, nodeLabel, nodePlaceholder } from '../shared/node.js';
+export function TextareaInput({ value, onChange, definition }) {
+    const text = value?.value ?? '';
+    return (_jsx(FieldFrame, { label: nodeLabel(definition), description: nodeDescription(definition), children: _jsx("textarea", { value: text, placeholder: nodePlaceholder(definition) ?? `Enter ${nodeLabel(definition).toLowerCase()}`, style: inputLikeStyle({ minHeight: 120, height: 120, resize: 'vertical' }), onChange: (event) => onChange({ value: event.target.value, isDirty: true }) }) }));
+}

package/lib/primitives/fields/toggle-input.d.ts

@@ -0,0 +1,3 @@
+import type { ContinuumNodeProps } from '@continuum-dev/react';
+export declare function ToggleInput({ value, onChange, definition }: ContinuumNodeProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=toggle-input.d.ts.map

package/lib/primitives/fields/toggle-input.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"toggle-input.d.ts","sourceRoot":"","sources":["../../../../../../packages/starter-kit/src/lib/primitives/fields/toggle-input.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AAiC3D,wBAAgB,WAAW,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,UAAU,EAAE,EAAE,kBAAkB,2CAsB9E"}

package/lib/primitives/fields/toggle-input.js

@@ -0,0 +1,32 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { color, control, radius, space, type } from '../../tokens.js';
+import { nodeDescription, nodeLabel } from '../shared/node.js';
+const wrapStyle = {
+    display: 'flex',
+    alignItems: 'center',
+    gap: space.md,
+    minHeight: control.height,
+};
+const trackStyle = (checked) => ({
+    position: 'relative',
+    width: 48,
+    height: 28,
+    borderRadius: radius.pill,
+    background: checked ? color.accent : color.surfaceInset,
+    border: `1px solid ${checked ? color.borderStrong : color.border}`,
+    flexShrink: 0,
+});
+const thumbStyle = (checked) => ({
+    position: 'absolute',
+    top: 3,
+    left: checked ? 23 : 3,
+    width: 20,
+    height: 20,
+    borderRadius: radius.pill,
+    background: color.surface,
+    border: `1px solid ${checked ? color.borderStrong : color.border}`,
+});
+export function ToggleInput({ value, onChange, definition }) {
+    const checked = Boolean(value?.value);
+    return (_jsxs("label", { style: wrapStyle, children: [_jsxs("span", { style: trackStyle(checked), children: [_jsx("span", { style: thumbStyle(checked) }), _jsx("input", { type: "checkbox", checked: checked, style: { opacity: 0, position: 'absolute', inset: 0, cursor: 'pointer' }, onChange: (event) => onChange({ value: event.target.checked, isDirty: true }) })] }), _jsxs("span", { style: { display: 'grid', gap: space.xs }, children: [_jsx("span", { style: { ...type.section, color: color.text }, children: nodeLabel(definition) }), nodeDescription(definition) ? (_jsx("span", { style: { ...type.small, color: color.textMuted }, children: nodeDescription(definition) })) : null] })] }));
+}

package/lib/primitives/index.d.ts

@@ -0,0 +1,15 @@
+export { ActionButton } from './actions/action-button.js';
+export { Presentation } from './content/presentation.js';
+export { UnknownNode } from './content/unknown-node.js';
+export { DateInput } from './fields/date-input.js';
+export { RadioGroupInput } from './fields/radio-group.js';
+export { SelectInput } from './fields/select-input.js';
+export { SliderInput } from './fields/slider-input.js';
+export { TextareaInput } from './fields/textarea-input.js';
+export { TextInput } from './fields/text-input.js';
+export { ToggleInput } from './fields/toggle-input.js';
+export { CollectionSection } from './layout/collection-section.js';
+export { GridSection } from './layout/grid-section.js';
+export { GroupSection } from './layout/group-section.js';
+export { RowSection } from './layout/row-section.js';
+//# sourceMappingURL=index.d.ts.map

package/lib/primitives/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../packages/starter-kit/src/lib/primitives/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACzD,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AACxD,OAAO,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AACnD,OAAO,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAC;AAC1D,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AACvD,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AACvD,OAAO,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAC;AAC3D,OAAO,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AACnD,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AACvD,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AACnE,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AACvD,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACzD,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC"}

package/lib/primitives/index.js

@@ -0,0 +1,14 @@
+export { ActionButton } from './actions/action-button.js';
+export { Presentation } from './content/presentation.js';
+export { UnknownNode } from './content/unknown-node.js';
+export { DateInput } from './fields/date-input.js';
+export { RadioGroupInput } from './fields/radio-group.js';
+export { SelectInput } from './fields/select-input.js';
+export { SliderInput } from './fields/slider-input.js';
+export { TextareaInput } from './fields/textarea-input.js';
+export { TextInput } from './fields/text-input.js';
+export { ToggleInput } from './fields/toggle-input.js';
+export { CollectionSection } from './layout/collection-section.js';
+export { GridSection } from './layout/grid-section.js';
+export { GroupSection } from './layout/group-section.js';
+export { RowSection } from './layout/row-section.js';

package/lib/primitives/layout/collection-section.d.ts

@@ -0,0 +1,3 @@
+import type { ContinuumNodeProps } from '@continuum-dev/react';
+export declare function CollectionSection({ definition, children, nodeId, canAdd, onAdd, }: ContinuumNodeProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=collection-section.d.ts.map

package/lib/primitives/layout/collection-section.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"collection-section.d.ts","sourceRoot":"","sources":["../../../../../../packages/starter-kit/src/lib/primitives/layout/collection-section.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AAoB3D,wBAAgB,iBAAiB,CAAC,EAChC,UAAU,EACV,QAAQ,EACR,MAAM,EACN,MAAM,EACN,KAAK,GACN,EAAE,kBAAkB,2CAqCpB"}

package/lib/primitives/layout/collection-section.js

@@ -0,0 +1,32 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { color, control, radius, space, type } from '../../tokens.js';
+import { nodeDepth, nodeDescription, nodeLabel } from '../shared/node.js';
+const headerStyle = {
+    display: 'grid',
+    gap: space.xs,
+};
+const addButtonStyle = {
+    height: control.height,
+    padding: `0 ${space.md}px`,
+    borderRadius: radius.md,
+    border: `1px solid ${color.border}`,
+    background: color.surface,
+    color: color.text,
+    cursor: 'pointer',
+    flexShrink: 0,
+};
+export function CollectionSection({ definition, children, nodeId, canAdd, onAdd, }) {
+    const depth = nodeDepth(nodeId);
+    return (_jsxs("section", { style: {
+            display: 'grid',
+            gap: space.lg,
+            padding: depth === 0 ? space.xxl : 0,
+            borderRadius: depth === 0 ? radius.lg : 0,
+            background: depth === 0 ? color.surface : 'transparent',
+            border: depth === 0 ? `1px solid ${color.border}` : 'none',
+        }, children: [_jsxs("div", { style: headerStyle, children: [_jsx("div", { style: { ...type.section, color: color.text }, children: nodeLabel(definition) }), nodeDescription(definition) ? (_jsx("div", { style: { ...type.small, color: color.textMuted }, children: nodeDescription(definition) })) : null] }), _jsx("div", { style: { display: 'grid', gap: space.md }, children: children }), _jsx("div", { style: { display: 'flex', justifyContent: 'flex-end' }, children: _jsx("button", { type: "button", style: addButtonStyle, disabled: !canAdd, onClick: () => {
+                        if (typeof onAdd === 'function') {
+                            onAdd();
+                        }
+                    }, children: "Add item" }) })] }));
+}

package/lib/primitives/layout/grid-section.d.ts

@@ -0,0 +1,3 @@
+import type { ContinuumNodeProps } from '@continuum-dev/react';
+export declare function GridSection(props: ContinuumNodeProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=grid-section.d.ts.map

package/lib/primitives/layout/grid-section.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"grid-section.d.ts","sourceRoot":"","sources":["../../../../../../packages/starter-kit/src/lib/primitives/layout/grid-section.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AAK3D,wBAAgB,WAAW,CAAC,KAAK,EAAE,kBAAkB,2CAqBpD"}

package/lib/primitives/layout/grid-section.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { space } from '../../tokens.js';
+import { ContainerShell } from '../shared/container-shell.js';
+import { nodeDescription, nodeLabel, readNodeProp } from '../shared/node.js';
+export function GridSection(props) {
+    const columns = readNodeProp(props.definition, 'columns') ?? 2;
+    return (_jsx(ContainerShell, { title: nodeLabel(props.definition), description: nodeDescription(props.definition), nodeId: props.nodeId, itemIndex: props.itemIndex, canRemove: props.canRemove, onRemove: props.onRemove, layoutStyle: {
+            display: 'grid',
+            gridTemplateColumns: `repeat(${columns}, minmax(0, 1fr))`,
+            gap: space.lg,
+            alignItems: 'start',
+        }, children: props.children }));
+}

package/lib/primitives/layout/group-section.d.ts

@@ -0,0 +1,3 @@
+import type { ContinuumNodeProps } from '@continuum-dev/react';
+export declare function GroupSection(props: ContinuumNodeProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=group-section.d.ts.map

package/lib/primitives/layout/group-section.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"group-section.d.ts","sourceRoot":"","sources":["../../../../../../packages/starter-kit/src/lib/primitives/layout/group-section.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AAiC3D,wBAAgB,YAAY,CAAC,KAAK,EAAE,kBAAkB,2CAcrD"}

package/lib/primitives/layout/group-section.js

@@ -0,0 +1,31 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { space } from '../../tokens.js';
+import { ContainerShell } from '../shared/container-shell.js';
+import { nodeDescription, nodeLabel, readNodeProp } from '../shared/node.js';
+function layoutStyle(definition) {
+    const layout = readNodeProp(definition, 'layout') ?? 'vertical';
+    const columns = readNodeProp(definition, 'columns') ?? 2;
+    if (layout === 'horizontal') {
+        return {
+            display: 'flex',
+            flexWrap: 'wrap',
+            gap: space.lg,
+            alignItems: 'start',
+        };
+    }
+    if (layout === 'grid') {
+        return {
+            display: 'grid',
+            gridTemplateColumns: `repeat(${columns}, minmax(0, 1fr))`,
+            gap: space.lg,
+            alignItems: 'start',
+        };
+    }
+    return {
+        display: 'grid',
+        gap: space.lg,
+    };
+}
+export function GroupSection(props) {
+    return (_jsx(ContainerShell, { title: nodeLabel(props.definition), description: nodeDescription(props.definition), nodeId: props.nodeId, itemIndex: props.itemIndex, canRemove: props.canRemove, onRemove: props.onRemove, layoutStyle: layoutStyle(props.definition), children: props.children }));
+}

package/lib/primitives/layout/row-section.d.ts

@@ -0,0 +1,3 @@
+import type { ContinuumNodeProps } from '@continuum-dev/react';
+export declare function RowSection(props: ContinuumNodeProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=row-section.d.ts.map

package/lib/primitives/layout/row-section.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"row-section.d.ts","sourceRoot":"","sources":["../../../../../../packages/starter-kit/src/lib/primitives/layout/row-section.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AAK3D,wBAAgB,UAAU,CAAC,KAAK,EAAE,kBAAkB,2CAuBnD"}

package/lib/primitives/layout/row-section.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { space } from '../../tokens.js';
+import { ContainerShell } from '../shared/container-shell.js';
+import { nodeDescription, nodeLabel } from '../shared/node.js';
+export function RowSection(props) {
+    const isCollectionItem = typeof props.itemIndex === 'number';
+    return (_jsx(ContainerShell, { title: nodeLabel(props.definition), description: nodeDescription(props.definition), nodeId: props.nodeId, itemIndex: props.itemIndex, canRemove: props.canRemove, onRemove: props.onRemove, itemRemovePlacement: isCollectionItem ? 'inline' : 'header', itemRemoveVariant: isCollectionItem ? 'icon' : 'default', layoutStyle: {
+            display: 'flex',
+            flexWrap: 'wrap',
+            alignItems: 'start',
+            gap: space.lg,
+        }, children: props.children }));
+}

package/lib/primitives/shared/container-shell.d.ts

@@ -0,0 +1,14 @@
+import type { CSSProperties, ReactNode } from 'react';
+export declare function ContainerShell({ title, description, nodeId, itemIndex, canRemove, onRemove, children, layoutStyle, itemRemovePlacement, itemRemoveVariant, }: {
+    title: string;
+    description?: string;
+    nodeId?: string;
+    itemIndex?: number;
+    canRemove?: boolean;
+    onRemove?: () => void;
+    children: ReactNode;
+    layoutStyle: CSSProperties;
+    itemRemovePlacement?: 'header' | 'inline';
+    itemRemoveVariant?: 'default' | 'icon';
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=container-shell.d.ts.map

package/lib/primitives/shared/container-shell.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"container-shell.d.ts","sourceRoot":"","sources":["../../../../../../packages/starter-kit/src/lib/primitives/shared/container-shell.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAmFtD,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,WAAW,EACX,MAAM,EACN,SAAS,EACT,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,WAAW,EACX,mBAA8B,EAC9B,iBAA6B,GAC9B,EAAE;IACD,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,QAAQ,EAAE,SAAS,CAAC;IACpB,WAAW,EAAE,aAAa,CAAC;IAC3B,mBAAmB,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAC;IAC1C,iBAAiB,CAAC,EAAE,SAAS,GAAG,MAAM,CAAC;CACxC,2CAuDA"}