@servicetitan/json-render-react 0.3.2-anv-5204-fcd3b83 → 0.4.0

package/dist/catalog/core/catalog-prompt.md

@@ -68,7 +68,7 @@ AVAILABLE COMPONENTS (21):
 - Listbox: { label: string, options: Array<{ value: string, label: string }>, value?: string, disabled?: boolean } - Single-select dropdown for choosing one value from a fixed list of known options. options: [{ value, label }] — value is stored in state, label is shown. Bind the selection with $bindState on value; emits a "change" event on selection. Use only when options are predefined; for free-text user input use Input, and for 2–7 visible mutually-exclusive choices prefer RadioGroup. disabled: true prevents selection. [events: change]
 - RadioGroup: { label: string, options: Array<{ value: string, label: string }>, value?: string, disabled?: boolean } - Group of radio buttons for picking one option from 2–7 visible mutually-exclusive choices. options: [{ value, label }]. Bind the selection with $bindState on value; emits a "change" event on selection. For longer option lists use Listbox. disabled: true prevents selection. [events: change]
 - Switch: { label: string, checked?: boolean, disabled?: boolean } - Toggle switch for a single binary on/off setting with immediate effect (no form submit). Prefer over Checkbox for enabling/disabling features. Bind state with $bindState on checked; emits a "change" event when toggled. disabled: true prevents toggling. [events: change]
-- GuidanceCard: { state?: "default" | "accepted" | "rejected" | "skipped", referenceLabel: string, referenceHref?: string, changeSections: Array<{ type: undefined, changes: Array<{ id: string, label: string, from?: string, to?: string, reason?: string }> } | { type: undefined, label: string, changeTables: Array<{ label: string, columns: Array<{ key: string, header: string, minWidth?: "compact" | "standard" | "wide" }>, data: Array<unknown>, reason?: string }> }>, appliedChangeIds?: Array<string>, defaultExpanded?: boolean } - Suggested-change review card for Atlas agent chat. Use in the default state while the user can accept, edit, or dismiss AI-proposed updates to an estimate/invoice. state: default (selectable diffs + actions) | accepted (collapsible accepted summary) | rejected | skipped (collapsible read-only summaries). Bind state and appliedChangeIds with $bindState so apply/reject can update lifecycle state locally. Checkbox selection is managed internally and defaults to all single-change and table-row ids selected. changeSections[] defines ordered body content: type single (changes[] with label/from/to/reason) or type table (label + changeTables[] with editable labels, columns[{ key, header, minWidth? }], data, optional reason). Column minWidth presets: compact (codes/SKUs/quantities) | standard (names/dates) | wide (descriptions/diffs) — omit when flexible. Table cell rendering is defined per cell via plain string or { type: text | diff | addition, ... }. appliedChangeIds filters accepted-state content. referenceHref opens the linked record in a new tab. Emits apply, edit, and dismiss. [events: apply, edit, dismiss]
+- GuidanceCard: { state?: "default" | "accepted" | "rejected" | "skipped", referenceLabel: string, referenceHref?: string, changeSections: Array<{ type: undefined, changes: Array<{ id: string, label: string, from?: string, to?: string, reason?: string }> } | { type: undefined, label: string, changeTables: Array<{ label: string, columns: Array<{ key: string, header: string, minWidth?: "compact" | "standard" | "wide" }>, data: Array<unknown>, reason?: string }> }>, appliedChangeIds?: Array<string>, defaultExpanded?: boolean } - Suggested-change review card for Atlas agent chat. Use in the default state while the user can accept, edit, or dismiss AI-proposed updates to an estimate/invoice. state: default (selectable diffs + actions) | accepted (collapsible accepted summary) | rejected | skipped (collapsible read-only summaries). Bind state and appliedChangeIds with $bindState so apply/reject can update lifecycle state locally. Checkbox selection is managed internally and defaults to all single-change and table-row ids selected. changeSections[] defines ordered body content: type single (changes[] with label/from/to/reason) or type table (label + changeTables[] with editable labels, columns[{ key, header, minWidth? }], data, optional reason). Each data row requires a top-level id for selection/filtering — do NOT add an id column; use keys like code, sku, or name for visible identifiers. Column minWidth presets: compact (codes/SKUs/quantities) | standard (names/dates) | wide (descriptions/diffs) — omit when flexible. Table cell rendering is defined per cell via plain string or { type: text | diff | addition, ... }. appliedChangeIds filters accepted-state content. referenceHref opens the linked record in a new tab. Emits apply, edit, and dismiss. [events: apply, edit, dismiss]
 
 AVAILABLE ACTIONS:
 
@@ -299,8 +299,8 @@ LINECHART
 GUIDANCECARD
 - Use when Atlas proposes suggested changes to an estimate or invoice inline in chat. GuidanceCard is a standalone root — do NOT wrap it in Card or Flex.
 - state: default (selectable diffs + apply/edit/dismiss actions) | accepted (collapsible accepted summary) | rejected | skipped (collapsible read-only summaries). Default is default.
-- Bind `state` and `appliedChangeIds` with $bindState (e.g. `/cardState`, `/appliedChangeIds`) so Storybook and local previews can flip lifecycle state on apply/reject. On apply, chain setState to `"accepted"` and set `/appliedChangeIds` to the ids being applied before atlas.submitUserAction.
-- changeSections[] defines ordered body content: type single (changes[] with id, label, optional from/to/reason) or type table (label + changeTables[] with editable labels, columns, and data rows with id). Table cell rendering is defined per cell: plain string or `{ type: "text" | "diff" | "addition", ... }` — not on the column.
+- Bind `state` and `appliedChangeIds` with $bindState (e.g. `/cardState`, `/appliedChangeIds`). The catalog renderer writes the selected ids to the bound `appliedChangeIds` path on apply/edit before emitting — do not set `/appliedChangeIds` manually in on handlers. On apply, chain setState to `"accepted"` (and `"rejected"` on dismiss) before atlas.submitUserAction.
+- changeSections[] defines ordered body content: type single (changes[] with id, label, optional from/to/reason) or type table (label + changeTables[] with editable labels, columns, and data rows each with a top-level id). Table column `key` must match a field on the row object — never use `id` as a column key (row id is for selection only; expose SKUs/codes via keys like `code` or `sku`). Table cell rendering is defined per cell: plain string or `{ type: "text" | "diff" | "addition", ... }` — not on the column.
 - Table column `minWidth` presets (optional): **compact** — codes, SKUs, quantities, unit prices; **standard** — names, categories, dates, single-line labels; **wide** — descriptions, notes, scope text, or any column with diff/addition cells. Omit when the column can flex.
 - Emits apply, edit, and dismiss. Wire actions via on.apply/on.edit/on.dismiss; use atlas.submitUserAction with descriptive actionIds.
 

package/dist/catalog/marketing/catalog-prompt.md

@@ -68,7 +68,7 @@ AVAILABLE COMPONENTS (22):
 - Listbox: { label: string, options: Array<{ value: string, label: string }>, value?: string, disabled?: boolean } - Single-select dropdown for choosing one value from a fixed list of known options. options: [{ value, label }] — value is stored in state, label is shown. Bind the selection with $bindState on value; emits a "change" event on selection. Use only when options are predefined; for free-text user input use Input, and for 2–7 visible mutually-exclusive choices prefer RadioGroup. disabled: true prevents selection. [events: change]
 - RadioGroup: { label: string, options: Array<{ value: string, label: string }>, value?: string, disabled?: boolean } - Group of radio buttons for picking one option from 2–7 visible mutually-exclusive choices. options: [{ value, label }]. Bind the selection with $bindState on value; emits a "change" event on selection. For longer option lists use Listbox. disabled: true prevents selection. [events: change]
 - Switch: { label: string, checked?: boolean, disabled?: boolean } - Toggle switch for a single binary on/off setting with immediate effect (no form submit). Prefer over Checkbox for enabling/disabling features. Bind state with $bindState on checked; emits a "change" event when toggled. disabled: true prevents toggling. [events: change]
-- GuidanceCard: { state?: "default" | "accepted" | "rejected" | "skipped", referenceLabel: string, referenceHref?: string, changeSections: Array<{ type: undefined, changes: Array<{ id: string, label: string, from?: string, to?: string, reason?: string }> } | { type: undefined, label: string, changeTables: Array<{ label: string, columns: Array<{ key: string, header: string, minWidth?: "compact" | "standard" | "wide" }>, data: Array<unknown>, reason?: string }> }>, appliedChangeIds?: Array<string>, defaultExpanded?: boolean } - Suggested-change review card for Atlas agent chat. Use in the default state while the user can accept, edit, or dismiss AI-proposed updates to an estimate/invoice. state: default (selectable diffs + actions) | accepted (collapsible accepted summary) | rejected | skipped (collapsible read-only summaries). Bind state and appliedChangeIds with $bindState so apply/reject can update lifecycle state locally. Checkbox selection is managed internally and defaults to all single-change and table-row ids selected. changeSections[] defines ordered body content: type single (changes[] with label/from/to/reason) or type table (label + changeTables[] with editable labels, columns[{ key, header, minWidth? }], data, optional reason). Column minWidth presets: compact (codes/SKUs/quantities) | standard (names/dates) | wide (descriptions/diffs) — omit when flexible. Table cell rendering is defined per cell via plain string or { type: text | diff | addition, ... }. appliedChangeIds filters accepted-state content. referenceHref opens the linked record in a new tab. Emits apply, edit, and dismiss. [events: apply, edit, dismiss]
+- GuidanceCard: { state?: "default" | "accepted" | "rejected" | "skipped", referenceLabel: string, referenceHref?: string, changeSections: Array<{ type: undefined, changes: Array<{ id: string, label: string, from?: string, to?: string, reason?: string }> } | { type: undefined, label: string, changeTables: Array<{ label: string, columns: Array<{ key: string, header: string, minWidth?: "compact" | "standard" | "wide" }>, data: Array<unknown>, reason?: string }> }>, appliedChangeIds?: Array<string>, defaultExpanded?: boolean } - Suggested-change review card for Atlas agent chat. Use in the default state while the user can accept, edit, or dismiss AI-proposed updates to an estimate/invoice. state: default (selectable diffs + actions) | accepted (collapsible accepted summary) | rejected | skipped (collapsible read-only summaries). Bind state and appliedChangeIds with $bindState so apply/reject can update lifecycle state locally. Checkbox selection is managed internally and defaults to all single-change and table-row ids selected. changeSections[] defines ordered body content: type single (changes[] with label/from/to/reason) or type table (label + changeTables[] with editable labels, columns[{ key, header, minWidth? }], data, optional reason). Each data row requires a top-level id for selection/filtering — do NOT add an id column; use keys like code, sku, or name for visible identifiers. Column minWidth presets: compact (codes/SKUs/quantities) | standard (names/dates) | wide (descriptions/diffs) — omit when flexible. Table cell rendering is defined per cell via plain string or { type: text | diff | addition, ... }. appliedChangeIds filters accepted-state content. referenceHref opens the linked record in a new tab. Emits apply, edit, and dismiss. [events: apply, edit, dismiss]
 - RevenueCard: { title: string, value: string, trend?: "up" | "down" | "flat", delta?: string } - KPI metric card. trend: up=green↑ down=red↓ flat=grey→. delta e.g. "+12% vs last month". Leaf node — no children.
 
 AVAILABLE ACTIONS:
@@ -300,8 +300,8 @@ LINECHART
 GUIDANCECARD
 - Use when Atlas proposes suggested changes to an estimate or invoice inline in chat. GuidanceCard is a standalone root — do NOT wrap it in Card or Flex.
 - state: default (selectable diffs + apply/edit/dismiss actions) | accepted (collapsible accepted summary) | rejected | skipped (collapsible read-only summaries). Default is default.
-- Bind `state` and `appliedChangeIds` with $bindState (e.g. `/cardState`, `/appliedChangeIds`) so Storybook and local previews can flip lifecycle state on apply/reject. On apply, chain setState to `"accepted"` and set `/appliedChangeIds` to the ids being applied before atlas.submitUserAction.
-- changeSections[] defines ordered body content: type single (changes[] with id, label, optional from/to/reason) or type table (label + changeTables[] with editable labels, columns, and data rows with id). Table cell rendering is defined per cell: plain string or `{ type: "text" | "diff" | "addition", ... }` — not on the column.
+- Bind `state` and `appliedChangeIds` with $bindState (e.g. `/cardState`, `/appliedChangeIds`). The catalog renderer writes the selected ids to the bound `appliedChangeIds` path on apply/edit before emitting — do not set `/appliedChangeIds` manually in on handlers. On apply, chain setState to `"accepted"` (and `"rejected"` on dismiss) before atlas.submitUserAction.
+- changeSections[] defines ordered body content: type single (changes[] with id, label, optional from/to/reason) or type table (label + changeTables[] with editable labels, columns, and data rows each with a top-level id). Table column `key` must match a field on the row object — never use `id` as a column key (row id is for selection only; expose SKUs/codes via keys like `code` or `sku`). Table cell rendering is defined per cell: plain string or `{ type: "text" | "diff" | "addition", ... }` — not on the column.
 - Table column `minWidth` presets (optional): **compact** — codes, SKUs, quantities, unit prices; **standard** — names, categories, dates, single-line labels; **wide** — descriptions, notes, scope text, or any column with diff/addition cells. Omit when the column can flex.
 - Emits apply, edit, and dismiss. Wire actions via on.apply/on.edit/on.dismiss; use atlas.submitUserAction with descriptive actionIds.
 

package/dist/core/catalog/guidance-card-column-width.d.ts

@@ -7,5 +7,6 @@ export declare const GUIDANCE_CARD_COLUMN_WIDTHS: {
     readonly wide: 280;
 };
 export type GuidanceCardColumnWidth = keyof typeof GUIDANCE_CARD_COLUMN_WIDTHS;
+/** Map catalog `minWidth` presets to pixel values for the CRK internal Table. */
 export declare function resolveGuidanceCardColumnMinWidth(width: GuidanceCardColumnWidth): number;
 export declare function resolveGuidanceCardColumnMinWidth(width: GuidanceCardColumnWidth | undefined): number | undefined;

package/dist/core/catalog/guidance-card.d.ts

@@ -1,6 +1,7 @@
 import { z } from 'zod';
 import { guidanceCardCatalog } from './guidance-card.catalog';
 export { guidanceCardCatalog };
+/** Maps catalog props to {@link GuidanceCard}, publishing selected ids to bound state on apply/edit. */
 export declare const GuidanceCardRenderer: ({ props, emit, bindings, }: {
     props: z.infer<typeof guidanceCardCatalog.props>;
     emit: (event: string) => void;

package/dist/index.js

@@ -1052,7 +1052,7 @@ var Ln = ({ props: e }) => /* @__PURE__ */ S("div", {
 		"edit",
 		"dismiss"
 	],
-	description: "Suggested-change review card for Atlas agent chat. Use in the default state while the user can accept, edit, or dismiss AI-proposed updates to an estimate/invoice. state: default (selectable diffs + actions) | accepted (collapsible accepted summary) | rejected | skipped (collapsible read-only summaries). Bind state and appliedChangeIds with $bindState so apply/reject can update lifecycle state locally. Checkbox selection is managed internally and defaults to all single-change and table-row ids selected. changeSections[] defines ordered body content: type single (changes[] with label/from/to/reason) or type table (label + changeTables[] with editable labels, columns[{ key, header, minWidth? }], data, optional reason). Column minWidth presets: compact (codes/SKUs/quantities) | standard (names/dates) | wide (descriptions/diffs) — omit when flexible. Table cell rendering is defined per cell via plain string or { type: text | diff | addition, ... }. appliedChangeIds filters accepted-state content. referenceHref opens the linked record in a new tab. Emits apply, edit, and dismiss."
+	description: "Suggested-change review card for Atlas agent chat. Use in the default state while the user can accept, edit, or dismiss AI-proposed updates to an estimate/invoice. state: default (selectable diffs + actions) | accepted (collapsible accepted summary) | rejected | skipped (collapsible read-only summaries). Bind state and appliedChangeIds with $bindState so apply/reject can update lifecycle state locally. Checkbox selection is managed internally and defaults to all single-change and table-row ids selected. changeSections[] defines ordered body content: type single (changes[] with label/from/to/reason) or type table (label + changeTables[] with editable labels, columns[{ key, header, minWidth? }], data, optional reason). Each data row requires a top-level id for selection/filtering — do NOT add an id column; use keys like code, sku, or name for visible identifiers. Column minWidth presets: compact (codes/SKUs/quantities) | standard (names/dates) | wide (descriptions/diffs) — omit when flexible. Table cell rendering is defined per cell via plain string or { type: text | diff | addition, ... }. appliedChangeIds filters accepted-state content. referenceHref opens the linked record in a new tab. Emits apply, edit, and dismiss."
 }, ar = {
 	props: w.object({
 		name: w.enum([
@@ -1712,8 +1712,8 @@ var Xr = ({ props: e, emit: t, bindings: n }) => {
 		changes: e.changes.map((e) => ({
 			id: e.id,
 			label: e.label,
-			from: e.from ?? null,
-			to: e.to ?? null,
+			...e.from === void 0 ? {} : { from: e.from },
+			...e.to === void 0 ? {} : { to: e.to },
 			...e.reason === void 0 ? {} : { reason: e.reason }
 		}))
 	} : {