@widgetic/creator 0.3.71 → 0.3.73

package/dist/utils/designIntentTelemetry.test.js

@@ -0,0 +1,385 @@
+import { describe, it, expect, beforeEach, vi } from 'vitest';
+import { classifyDesignIntent, recordDesignIntentTelemetry, recordDesignIntentJevOutcome, getDesignIntentTelemetrySnapshot, formatDesignIntentTelemetryReport, parsePersistedTelemetry, resetDesignIntentTelemetry, isJevCandidateBucket, JEV_CANDIDATE_BUCKET } from './designIntentTelemetry';
+const SCHEMA = {
+    componentGroups: [
+        {
+            name: 'Design',
+            components: [
+                {
+                    id: 'appearance',
+                    propertyGroups: [
+                        {
+                            name: 'Colors',
+                            properties: [
+                                {
+                                    id: 'backgroundColor',
+                                    type: 'string',
+                                    defaultValue: '#ffffff',
+                                    inputController: { type: 'colorPicker', description: 'Background Color' }
+                                },
+                                {
+                                    id: 'titleColor',
+                                    type: 'string',
+                                    defaultValue: '#111827',
+                                    inputController: { type: 'colorPicker', description: 'Title Color' }
+                                }
+                            ]
+                        },
+                        {
+                            name: 'Layout',
+                            properties: [
+                                {
+                                    id: 'padding',
+                                    type: 'number',
+                                    defaultValue: 16,
+                                    inputController: { type: 'slider', description: 'Padding', config: { min: 0, max: 64, step: 1 } }
+                                },
+                                {
+                                    id: 'showShadow',
+                                    type: 'boolean',
+                                    defaultValue: true,
+                                    inputController: { type: 'switch', description: 'Drop Shadow' }
+                                },
+                                {
+                                    id: 'widgetTitle',
+                                    type: 'string',
+                                    defaultValue: 'My Widget',
+                                    inputController: { type: 'textInput', description: 'Widget Title' }
+                                }
+                            ]
+                        }
+                    ]
+                }
+            ]
+        }
+    ]
+};
+beforeEach(() => {
+    vi.spyOn(console, 'log').mockImplementation(() => { });
+    resetDesignIntentTelemetry();
+});
+describe('classifyDesignIntent — literal/arithmetic (deterministic)', () => {
+    it.each([
+        'make the background #1a1a2e',
+        'increase the padding by 8',
+        'double the padding',
+        'turn the drop shadow off',
+        'set the padding to 24'
+    ])('%s', (message) => {
+        expect(classifyDesignIntent(message, SCHEMA).bucket).toBe('literal_arithmetic');
+    });
+});
+describe('classifyDesignIntent — bounded-set semantic (JEV-shaped)', () => {
+    it.each([
+        'make it pop',
+        'give it more breathing room',
+        'make the background softer',
+        'make it darker',
+        'change the color to red'
+    ])('%s', (message) => {
+        expect(classifyDesignIntent(message, SCHEMA).bucket).toBe('bounded_set_semantic');
+    });
+    it('records the properties the message named', () => {
+        const result = classifyDesignIntent('change the color to red', SCHEMA);
+        expect(result.propertyIds.length).toBeGreaterThan(1);
+    });
+});
+describe('classifyDesignIntent — free text (LLM)', () => {
+    it.each(['change the widget title to grocery list', 'set the title to hello world'])('%s', (message) => {
+        expect(classifyDesignIntent(message, SCHEMA).bucket).toBe('free_text');
+    });
+});
+describe('classifyDesignIntent — new property (LLM/generation)', () => {
+    it.each(['add a border radius property', 'make the title editable', 'add a shadow setting'])('%s', (message) => {
+        expect(classifyDesignIntent(message, SCHEMA).bucket).toBe('new_property');
+    });
+});
+describe('classifyDesignIntent — not a design ask (codegen as today)', () => {
+    it.each([
+        'add a confetti animation when the timer ends',
+        'how many items are in my list?',
+        'fetch the data from my spreadsheet every morning'
+    ])('%s', (message) => {
+        expect(classifyDesignIntent(message, SCHEMA).bucket).toBe('not_design');
+    });
+});
+describe('shadow telemetry — records without changing behavior', () => {
+    it('counts each bucket and reports fractions over classified sends', () => {
+        recordDesignIntentTelemetry('make the background #1a1a2e', SCHEMA); // literal
+        recordDesignIntentTelemetry('increase the padding by 8', SCHEMA); // literal
+        recordDesignIntentTelemetry('make it pop', SCHEMA); // bounded-set
+        recordDesignIntentTelemetry('change the title to grocery list', SCHEMA); // free text
+        recordDesignIntentTelemetry('add a shadow property', SCHEMA); // new property
+        recordDesignIntentTelemetry('add a confetti animation', SCHEMA); // not design
+        const snap = getDesignIntentTelemetrySnapshot();
+        expect(snap.total).toBe(6);
+        expect(snap.counted).toBe(6);
+        expect(snap.noSchema).toBe(0);
+        expect(snap.buckets).toMatchObject({
+            literal_arithmetic: 2,
+            bounded_set_semantic: 1,
+            free_text: 1,
+            new_property: 1,
+            not_design: 1
+        });
+        expect(snap.deterministicShare).toBeCloseTo(2 / 6, 5);
+        expect(snap.modelShare).toBeCloseTo(3 / 6, 5);
+    });
+    it('counts sends with no design schema separately (unclassifiable)', () => {
+        recordDesignIntentTelemetry('make the background red', {});
+        const snap = getDesignIntentTelemetrySnapshot();
+        expect(snap.total).toBe(1);
+        expect(snap.counted).toBe(0);
+        expect(snap.noSchema).toBe(1);
+        expect(snap.deterministicShare).toBe(0);
+    });
+    it('formats a readable report', () => {
+        recordDesignIntentTelemetry('make the background #1a1a2e', SCHEMA);
+        recordDesignIntentTelemetry('make it pop', SCHEMA);
+        const report = formatDesignIntentTelemetryReport(getDesignIntentTelemetrySnapshot());
+        expect(report).toContain('literal/arithmetic (deterministic): 1 (50.0%)');
+        expect(report).toContain('bounded-set semantic (JEV-shaped):  1 (50.0%)');
+        expect(report).toContain('could skip the LLM (deterministic share): 50.0%');
+    });
+});
+describe('Jev candidate bucket', () => {
+    it('is only the bounded-set-semantic bucket', () => {
+        expect(JEV_CANDIDATE_BUCKET).toBe('bounded_set_semantic');
+        expect(isJevCandidateBucket('bounded_set_semantic')).toBe(true);
+        expect(isJevCandidateBucket('free_text')).toBe(false);
+        expect(isJevCandidateBucket('new_property')).toBe(false);
+        expect(isJevCandidateBucket('literal_arithmetic')).toBe(false);
+        expect(isJevCandidateBucket('not_design')).toBe(false);
+        expect(isJevCandidateBucket(null)).toBe(false);
+        expect(isJevCandidateBucket(undefined)).toBe(false);
+    });
+    it('matches the bucket the classifier gives a semantic design ask', () => {
+        expect(isJevCandidateBucket(classifyDesignIntent('make it pop', SCHEMA).bucket)).toBe(true);
+        expect(isJevCandidateBucket(classifyDesignIntent('add a confetti animation', SCHEMA).bucket)).toBe(false);
+    });
+});
+describe('Jev outcomes split by ask shape', () => {
+    /** The classification of a send, as the caller would hold it. */
+    const classified = (message) => classifyDesignIntent(message, SCHEMA);
+    it('tags the two bounded-set shapes the property question turns on', () => {
+        // A property is named, so the *value* question carries the weight.
+        expect(classified('make the background softer').shape).toBe('property_named');
+        // Only a value is stated, so the *property* question does.
+        expect(classified('make it pop').shape).toBe('value_only');
+    });
+    it('leaves every other bucket shapeless', () => {
+        expect(classified('make the background #1a1a2e').shape).toBeUndefined();
+        expect(classified('set the title to hello world').shape).toBeUndefined();
+        expect(classified('add a shadow property').shape).toBeUndefined();
+        expect(classified('add a confetti animation').shape).toBeUndefined();
+    });
+    it('splits the same reason count by the shape that produced it', () => {
+        recordDesignIntentJevOutcome({
+            source: 'jev',
+            acted: false,
+            reason: 'low_confidence_value',
+            classification: classified('make the background softer')
+        });
+        recordDesignIntentJevOutcome({
+            source: 'jev',
+            acted: false,
+            reason: 'low_confidence',
+            classification: classified('make it pop')
+        });
+        recordDesignIntentJevOutcome({
+            source: 'jev',
+            acted: false,
+            reason: 'low_confidence',
+            classification: classified('make it pop')
+        });
+        recordDesignIntentJevOutcome({
+            source: 'jev',
+            acted: true,
+            reason: 'resolved',
+            classification: classified('give it more breathing room')
+        });
+        const { jev } = getDesignIntentTelemetrySnapshot();
+        expect(jev.attempts).toBe(4);
+        expect(jev.byReason).toMatchObject({ low_confidence: 2, low_confidence_value: 1, resolved: 1 });
+        // The overall total is unchanged; the split is what the report reads.
+        expect(jev.byShape.property_named).toMatchObject({
+            attempts: 1,
+            acted: 0,
+            fellThrough: 1,
+            resolvedShare: 0
+        });
+        expect(jev.byShape.property_named.byReason).toMatchObject({ low_confidence_value: 1 });
+        expect(jev.byShape.value_only).toMatchObject({
+            attempts: 3,
+            acted: 1,
+            fellThrough: 2,
+            resolvedShare: 1 / 3
+        });
+        expect(jev.byShape.value_only.byReason).toMatchObject({ low_confidence: 2, resolved: 1 });
+    });
+    it('counts a dial with no classification as unknown rather than guessing a shape', () => {
+        recordDesignIntentJevOutcome({ source: 'degraded', acted: false, reason: 'timeout' });
+        const { jev } = getDesignIntentTelemetrySnapshot();
+        expect(jev.byShape.unknown).toMatchObject({ attempts: 1, fellThrough: 1, resolvedShare: 0 });
+        expect(jev.byShape.unknown.byReason).toMatchObject({ timeout: 1 });
+        expect(jev.byShape.property_named.attempts).toBe(0);
+        expect(jev.byShape.value_only.attempts).toBe(0);
+    });
+    it('counts a dial on a bucket that is never dialed as the anomaly it is', () => {
+        recordDesignIntentJevOutcome({
+            source: 'jev',
+            acted: false,
+            reason: 'low_confidence',
+            classification: classified('make the background #1a1a2e')
+        });
+        expect(getDesignIntentTelemetrySnapshot().jev.offBucketDials).toBe(1);
+        recordDesignIntentJevOutcome({
+            source: 'jev',
+            acted: false,
+            reason: 'low_confidence',
+            classification: classified('make it pop')
+        });
+        expect(getDesignIntentTelemetrySnapshot().jev.offBucketDials).toBe(1);
+    });
+    it('attributes the client-side no-response dial to the shape it was dialed for', () => {
+        recordDesignIntentJevOutcome({
+            source: 'client_unavailable',
+            acted: false,
+            reason: 'no_response',
+            classification: classified('make it darker')
+        });
+        const { jev } = getDesignIntentTelemetrySnapshot();
+        expect(jev.byShape.value_only.byReason).toMatchObject({ no_response: 1 });
+        // A client failure is not evidence about the option strings.
+        expect(jev.byShape.value_only.attempts).toBe(1);
+    });
+});
+describe('formatDesignIntentTelemetryReport — the Jev breakdown', () => {
+    it('prints the reason counts per ask shape with the knob each points at', () => {
+        recordDesignIntentJevOutcome({
+            source: 'jev',
+            acted: true,
+            reason: 'resolved',
+            classification: classifyDesignIntent('make the background softer', SCHEMA)
+        });
+        recordDesignIntentJevOutcome({
+            source: 'jev',
+            acted: false,
+            reason: 'low_confidence_value',
+            classification: classifyDesignIntent('make the background softer', SCHEMA)
+        });
+        recordDesignIntentJevOutcome({
+            source: 'jev',
+            acted: false,
+            reason: 'none_of_these',
+            classification: classifyDesignIntent('make it pop', SCHEMA)
+        });
+        const report = formatDesignIntentTelemetryReport(getDesignIntentTelemetrySnapshot());
+        expect(report).toContain('Jev fallback on the bounded-set-semantic bucket: 1/3 resolved (33.3%), 2 fell through');
+        // Ties are ordered by name, so the same input always prints the same line.
+        expect(report).toContain('reasons overall: low_confidence_value=1, none_of_these=1, resolved=1');
+        expect(report).toContain('by ask shape (which question carried the ask):');
+        expect(report).toContain('property_named — the value question was under load: 1/2 resolved (50.0%), 1 fell through');
+        expect(report).toContain('value_only — the property question was under load: 0/1 resolved (0.0%), 1 fell through');
+        // The reason is annotated with the lever it implicates, which is the point.
+        expect(report).toContain('low_confidence_value=1 — the confidence floor on the *value* question');
+        expect(report).toContain('none_of_these=1 — the property option strings (nothing matched the ask)');
+    });
+    it('flags a reason the report has no lever for instead of inventing one', () => {
+        recordDesignIntentJevOutcome({ source: 'jev', acted: false, reason: 'brand_new_reason' });
+        const report = formatDesignIntentTelemetryReport(getDesignIntentTelemetrySnapshot());
+        expect(report).toContain('brand_new_reason=1 — unrecognised reason');
+    });
+    it('keeps the report quiet when nothing was dialed', () => {
+        recordDesignIntentTelemetry('make it pop', SCHEMA);
+        const report = formatDesignIntentTelemetryReport(getDesignIntentTelemetrySnapshot());
+        expect(report).toContain('Jev fallback on the bounded-set-semantic bucket: 0/0 resolved (0.0%)');
+        expect(report).not.toContain('by ask shape');
+    });
+    it('surfaces an off-bucket dial only when there is one', () => {
+        expect(formatDesignIntentTelemetryReport(getDesignIntentTelemetrySnapshot())).not.toContain('another bucket');
+        recordDesignIntentJevOutcome({
+            source: 'jev',
+            acted: false,
+            reason: 'low_confidence',
+            classification: classifyDesignIntent('make the background #1a1a2e', SCHEMA)
+        });
+        expect(formatDesignIntentTelemetryReport(getDesignIntentTelemetrySnapshot())).toContain('1 dials were attributed to another bucket');
+    });
+});
+describe('parsePersistedTelemetry — the upgrade path', () => {
+    it('loads a payload stored before the per-shape breakdown existed', () => {
+        // The shape the first version of this module wrote: no byShape, no
+        // offBucketDials. Existing users hold exactly this, so it must not reset.
+        const legacy = JSON.stringify({
+            total: 40,
+            noSchema: 5,
+            buckets: { literal_arithmetic: 20, bounded_set_semantic: 8, free_text: 4, new_property: 2, not_design: 1 },
+            jev: { attempts: 6, acted: 3, fellThrough: 3, byReason: { resolved: 3, low_confidence: 2, no_change: 1 } }
+        });
+        const parsed = parsePersistedTelemetry(legacy);
+        expect(parsed.total).toBe(40);
+        expect(parsed.noSchema).toBe(5);
+        expect(parsed.buckets.bounded_set_semantic).toBe(8);
+        expect(parsed.jev).toMatchObject({ attempts: 6, acted: 3, fellThrough: 3, offBucketDials: 0 });
+        expect(parsed.jev.byReason).toMatchObject({ resolved: 3, low_confidence: 2, no_change: 1 });
+        expect(parsed.jev.byShape).toMatchObject({
+            property_named: { attempts: 0, byReason: {} },
+            value_only: { attempts: 0, byReason: {} },
+            unknown: { attempts: 0, byReason: {} }
+        });
+    });
+    it('round-trips a payload that does have the breakdown', () => {
+        const parsed = parsePersistedTelemetry(JSON.stringify({
+            total: 1,
+            noSchema: 0,
+            buckets: { bounded_set_semantic: 1 },
+            jev: {
+                attempts: 1,
+                acted: 0,
+                fellThrough: 1,
+                byReason: { low_confidence: 1 },
+                byShape: { value_only: { attempts: 1, acted: 0, fellThrough: 1, byReason: { low_confidence: 1 } } },
+                offBucketDials: 0
+            }
+        }));
+        expect(parsed.jev.byShape.value_only.byReason).toMatchObject({ low_confidence: 1 });
+        expect(parsed.jev.byShape.value_only).toMatchObject({ attempts: 1, acted: 0, fellThrough: 1 });
+    });
+    it('reads garbage, negative and non-numeric counters as zero', () => {
+        expect(parsePersistedTelemetry('not json')).toMatchObject({ total: 0, noSchema: 0 });
+        expect(parsePersistedTelemetry(null).jev.attempts).toBe(0);
+        const hostile = parsePersistedTelemetry(JSON.stringify({ total: -3, buckets: { bounded_set_semantic: 'eight' }, jev: { attempts: null } }));
+        expect(hostile.total).toBe(0);
+        expect(hostile.buckets.bounded_set_semantic).toBe(0);
+        expect(hostile.jev.attempts).toBe(0);
+        expect(hostile.jev.byShape.unknown.attempts).toBe(0);
+    });
+});
+describe('recordDesignIntentJevOutcome — the resolution rate', () => {
+    it('counts attempts, acts, fall-throughs, and reasons', () => {
+        recordDesignIntentJevOutcome({ source: 'jev', acted: true, reason: 'resolved' });
+        recordDesignIntentJevOutcome({ source: 'jev', acted: false, reason: 'low_confidence' });
+        recordDesignIntentJevOutcome({ source: 'jev', acted: false, reason: 'low_confidence' });
+        recordDesignIntentJevOutcome({ source: 'degraded', acted: false, reason: 'timeout' });
+        const snap = getDesignIntentTelemetrySnapshot();
+        expect(snap.jev).toMatchObject({ attempts: 4, acted: 1, fellThrough: 3 });
+        expect(snap.jev.resolvedShare).toBeCloseTo(0.25, 5);
+        expect(snap.jev.byReason).toMatchObject({ resolved: 1, low_confidence: 2, timeout: 1 });
+        // Unclassified dials are still counted — under `unknown`, never guessed.
+        expect(snap.jev.byShape.unknown).toMatchObject({ attempts: 4, acted: 1, fellThrough: 3 });
+        expect(snap.jev.byShape.unknown.resolvedShare).toBeCloseTo(0.25, 5);
+    });
+    it('reports zero rather than dividing by zero with no attempts', () => {
+        const snap = getDesignIntentTelemetrySnapshot();
+        expect(snap.jev).toMatchObject({ attempts: 0, acted: 0, fellThrough: 0, resolvedShare: 0 });
+    });
+    it('surfaces the Jev line and reason breakdown in the report', () => {
+        recordDesignIntentJevOutcome({ source: 'jev', acted: true, reason: 'resolved' });
+        recordDesignIntentJevOutcome({ source: 'jev', acted: false, reason: 'none_of_these' });
+        const report = formatDesignIntentTelemetryReport(getDesignIntentTelemetrySnapshot());
+        expect(report).toContain('Jev fallback on the bounded-set-semantic bucket: 1/2 resolved (50.0%)');
+        expect(report).toContain('reasons overall:');
+        expect(report).toContain('none_of_these=1');
+    });
+});

package/dist/utils/designQuickEditValues.d.ts

@@ -0,0 +1,51 @@
+/**
+ * designQuickEditValues — value resolution for the inline design-control card
+ * (`DesignQuickEdit.svelte`).
+ *
+ * The card is created from a resolution snapshot, but the widget's live design
+ * state keeps moving: while the card sits in the chat the user can drag the
+ * very same property in the PropsEditor panel. The card therefore reads its
+ * current value from the host's live design values and only falls back to the
+ * snapshot it was built with, so the two stay in sync in both directions.
+ *
+ * Kept pure so the resolution rules are testable without a DOM.
+ */
+import type { DesignControlProperty, DesignControlRequest } from './designIntentResolver';
+/**
+ * The editor stores some design values as `{ value }` envelopes (option
+ * objects, aspect ratios). The card renders primitives, so unwrap one level;
+ * everything else is returned as-is.
+ */
+export declare function unwrapQuickEditValue(value: unknown): unknown;
+/**
+ * The value a single control should show: the host's live value when one
+ * exists for the property, otherwise the value from the resolution snapshot.
+ */
+export declare function pickQuickEditValue(property: DesignControlProperty, liveValues?: Record<string, unknown> | null): unknown;
+/** Resolve every control's display value in one pass (drives the card's seed). */
+export declare function resolveQuickEditValues(properties: readonly DesignControlProperty[], liveValues?: Record<string, unknown> | null): Record<string, unknown>;
+/**
+ * Whether the property the card controls still exists in the widget's current
+ * design schema. `undefined` means the host did not supply the roster (or the
+ * schema is not loaded yet) — then every control stays live rather than being
+ * disabled on a guess.
+ */
+export declare function isQuickEditPropertyAvailable(propertyId: string, knownPropertyIds?: ReadonlySet<string> | null): boolean;
+/**
+ * Whether a card may read (and write) the live design values of the composition
+ * that is loaded right now.
+ *
+ * A card records the composition it was authored against; the host's live
+ * values belong to whatever composition is loaded *now*. Comparing the two is
+ * the whole guard: an older card under a newly selected composition must not
+ * show — or write — that composition's value under a shared property id.
+ *
+ * A card with no recorded composition (created before the field existed, or by
+ * a host that edits design values with no saved composition) counts as
+ * attached. That is the behaviour that preceded re-attachment, and detaching it
+ * would freeze cards that were working. A card that *did* record one, read back
+ * while no composition is selected, is detached instead: the live values cannot
+ * be shown to belong to it, and reopening the composition is cheap while a
+ * wrong write is not.
+ */
+export declare function isDesignCardAttached(card: Pick<DesignControlRequest, 'compositionId'>, currentCompositionId?: string | null): boolean;

package/dist/utils/designQuickEditValues.js

@@ -0,0 +1,77 @@
+/**
+ * designQuickEditValues — value resolution for the inline design-control card
+ * (`DesignQuickEdit.svelte`).
+ *
+ * The card is created from a resolution snapshot, but the widget's live design
+ * state keeps moving: while the card sits in the chat the user can drag the
+ * very same property in the PropsEditor panel. The card therefore reads its
+ * current value from the host's live design values and only falls back to the
+ * snapshot it was built with, so the two stay in sync in both directions.
+ *
+ * Kept pure so the resolution rules are testable without a DOM.
+ */
+/**
+ * The editor stores some design values as `{ value }` envelopes (option
+ * objects, aspect ratios). The card renders primitives, so unwrap one level;
+ * everything else is returned as-is.
+ */
+export function unwrapQuickEditValue(value) {
+    if (value &&
+        typeof value === 'object' &&
+        !Array.isArray(value) &&
+        'value' in value) {
+        return value.value;
+    }
+    return value;
+}
+/**
+ * The value a single control should show: the host's live value when one
+ * exists for the property, otherwise the value from the resolution snapshot.
+ */
+export function pickQuickEditValue(property, liveValues) {
+    if (liveValues && Object.prototype.hasOwnProperty.call(liveValues, property.id)) {
+        const live = unwrapQuickEditValue(liveValues[property.id]);
+        if (live !== undefined)
+            return live;
+    }
+    return property.value;
+}
+/** Resolve every control's display value in one pass (drives the card's seed). */
+export function resolveQuickEditValues(properties, liveValues) {
+    const next = {};
+    for (const property of properties)
+        next[property.id] = pickQuickEditValue(property, liveValues);
+    return next;
+}
+/**
+ * Whether the property the card controls still exists in the widget's current
+ * design schema. `undefined` means the host did not supply the roster (or the
+ * schema is not loaded yet) — then every control stays live rather than being
+ * disabled on a guess.
+ */
+export function isQuickEditPropertyAvailable(propertyId, knownPropertyIds) {
+    return !knownPropertyIds || knownPropertyIds.has(propertyId);
+}
+/**
+ * Whether a card may read (and write) the live design values of the composition
+ * that is loaded right now.
+ *
+ * A card records the composition it was authored against; the host's live
+ * values belong to whatever composition is loaded *now*. Comparing the two is
+ * the whole guard: an older card under a newly selected composition must not
+ * show — or write — that composition's value under a shared property id.
+ *
+ * A card with no recorded composition (created before the field existed, or by
+ * a host that edits design values with no saved composition) counts as
+ * attached. That is the behaviour that preceded re-attachment, and detaching it
+ * would freeze cards that were working. A card that *did* record one, read back
+ * while no composition is selected, is detached instead: the live values cannot
+ * be shown to belong to it, and reopening the composition is cheap while a
+ * wrong write is not.
+ */
+export function isDesignCardAttached(card, currentCompositionId) {
+    const cardCompositionId = card.compositionId ?? null;
+    if (cardCompositionId === null)
+        return true;
+    return cardCompositionId === (currentCompositionId ?? null);
+}

package/dist/utils/designQuickEditValues.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/utils/designQuickEditValues.test.js

@@ -0,0 +1,100 @@
+import { describe, it, expect } from 'vitest';
+import { unwrapQuickEditValue, pickQuickEditValue, resolveQuickEditValues, isQuickEditPropertyAvailable, isDesignCardAttached } from './designQuickEditValues';
+function property(overrides) {
+    return {
+        label: overrides.id,
+        controllerType: 'slider',
+        value: 0,
+        ...overrides
+    };
+}
+describe('unwrapQuickEditValue', () => {
+    it('leaves primitives alone', () => {
+        expect(unwrapQuickEditValue('#ff0000')).toBe('#ff0000');
+        expect(unwrapQuickEditValue(24)).toBe(24);
+        expect(unwrapQuickEditValue(true)).toBe(true);
+        expect(unwrapQuickEditValue(null)).toBeNull();
+    });
+    it('unwraps a value envelope', () => {
+        expect(unwrapQuickEditValue({ value: 'wide' })).toBe('wide');
+    });
+    it('does not unwrap arrays or objects without a value key', () => {
+        expect(unwrapQuickEditValue([1, 2])).toEqual([1, 2]);
+        expect(unwrapQuickEditValue({ family: 'Inter' })).toEqual({ family: 'Inter' });
+    });
+});
+describe('pickQuickEditValue', () => {
+    it('falls back to the resolution snapshot when the host has no live value', () => {
+        expect(pickQuickEditValue(property({ id: 'padding', value: 8 }), {})).toBe(8);
+        expect(pickQuickEditValue(property({ id: 'padding', value: 8 }), undefined)).toBe(8);
+        expect(pickQuickEditValue(property({ id: 'padding', value: 8 }), null)).toBe(8);
+    });
+    it('prefers the live value — this is the panel → card direction', () => {
+        expect(pickQuickEditValue(property({ id: 'padding', value: 8 }), { padding: 32 })).toBe(32);
+    });
+    it('reads a live value of 0 / false / empty string rather than the snapshot', () => {
+        expect(pickQuickEditValue(property({ id: 'padding', value: 8 }), { padding: 0 })).toBe(0);
+        expect(pickQuickEditValue(property({ id: 'shadow', value: true }), { shadow: false })).toBe(false);
+        expect(pickQuickEditValue(property({ id: 'title', value: 'Hi' }), { title: '' })).toBe('');
+    });
+    it('unwraps an enveloped live value', () => {
+        expect(pickQuickEditValue(property({ id: 'layout', value: 'narrow' }), { layout: { value: 'wide' } })).toBe('wide');
+    });
+    it('ignores an explicit undefined live value', () => {
+        expect(pickQuickEditValue(property({ id: 'padding', value: 8 }), { padding: undefined })).toBe(8);
+    });
+});
+describe('resolveQuickEditValues', () => {
+    it('merges live values over the snapshot per property', () => {
+        const properties = [
+            property({ id: 'padding', value: 8 }),
+            property({ id: 'background', value: '#000000', controllerType: 'colorpicker' })
+        ];
+        expect(resolveQuickEditValues(properties, { background: '#ffffff' })).toEqual({
+            padding: 8,
+            background: '#ffffff'
+        });
+    });
+    it('returns the snapshot values when there is no live state', () => {
+        const properties = [property({ id: 'padding', value: 8 })];
+        expect(resolveQuickEditValues(properties, null)).toEqual({ padding: 8 });
+    });
+});
+describe('isQuickEditPropertyAvailable', () => {
+    it('treats a missing roster as "cannot know" and keeps the control live', () => {
+        expect(isQuickEditPropertyAvailable('padding', undefined)).toBe(true);
+        expect(isQuickEditPropertyAvailable('padding', null)).toBe(true);
+    });
+    it('uses the roster when supplied', () => {
+        const known = new Set(['padding']);
+        expect(isQuickEditPropertyAvailable('padding', known)).toBe(true);
+        expect(isQuickEditPropertyAvailable('droppedProperty', known)).toBe(false);
+    });
+    it('disables everything for an empty roster (schema with no design properties)', () => {
+        expect(isQuickEditPropertyAvailable('padding', new Set())).toBe(false);
+    });
+});
+describe('isDesignCardAttached', () => {
+    const A = 'composition-a';
+    const B = 'composition-b';
+    it('attaches a card to the composition it recorded (this is the reload case)', () => {
+        expect(isDesignCardAttached({ compositionId: A }, A)).toBe(true);
+    });
+    it('detaches a card whose composition is not the one loaded', () => {
+        expect(isDesignCardAttached({ compositionId: A }, B)).toBe(false);
+    });
+    it('detaches a card that recorded a composition while no composition is loaded', () => {
+        // The live values cannot be shown to belong to this card, so it must not
+        // read or write them.
+        expect(isDesignCardAttached({ compositionId: A }, null)).toBe(false);
+        expect(isDesignCardAttached({ compositionId: A }, undefined)).toBe(false);
+    });
+    it('attaches a card that never recorded one — the behaviour before re-attachment', () => {
+        expect(isDesignCardAttached({}, null)).toBe(true);
+        expect(isDesignCardAttached({}, A)).toBe(true);
+        expect(isDesignCardAttached({ compositionId: null }, A)).toBe(true);
+    });
+    it('attaches an unattributed card and an unsaved composition to each other', () => {
+        expect(isDesignCardAttached({ compositionId: null }, null)).toBe(true);
+    });
+});

package/dist/utils/pinScrollToBottom.js

@@ -13,8 +13,13 @@ export function pinScrollToBottom(node) {
     const scrollToBottom = () => {
         if (!pinned)
             return;
-        // rAF so the layout pass has settled before reading scrollHeight.
+        // One frame only. Streaming status text must not queue a scroll per character.
+        if (rafId !== null)
+            return;
         rafId = requestAnimationFrame(() => {
+            rafId = null;
+            if (!pinned)
+                return;
             node.scrollTo({ top: node.scrollHeight, behavior: 'instant' });
         });
     };
@@ -26,7 +31,9 @@ export function pinScrollToBottom(node) {
     observer.observe(node);
     // Content growing also needs re-pinning; observe children changes.
     const contentObserver = new MutationObserver(scrollToBottom);
-    contentObserver.observe(node, { childList: true, subtree: true, characterData: true });
+    // childList only. characterData fired on every streamed token and on the
+    // "48%" status line, and each one forced a layout of this panel.
+    contentObserver.observe(node, { childList: true, subtree: true });
     node.addEventListener('scroll', onScroll, { passive: true });
     // Initial pin after the first layout pass.
     const initialRaf = requestAnimationFrame(scrollToBottom);

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@widgetic/creator",
-	"version": "0.3.71",
+	"version": "0.3.73",
 	"type": "module",
 	"peerDependencies": {
 		"@sveltejs/kit": "^2.20.0",
@@ -35,7 +35,7 @@
 		"i": "rm -rf node_modules && npm i && npm run lps",
 		"start": "node build/index.js",
 		"render-build": "bash render-build.sh",
-		"build": "NODE_ENV=production vite build && npm run package",
+		"build": "NODE_ENV=production NODE_OPTIONS=--max-old-space-size=8192 vite build && npm run package",
 		"package": "NODE_ENV=production svelte-package",
 		"package:watch": "NODE_ENV=development svelte-package --watch",
 		"stop-dev": "lsof -i :5174 | awk 'NR>1 {print $2}' | xargs kill",