@pixel-point/toolcraft 0.0.18 → 0.0.19

package/templates/starter/src/app/starter-acceptance.artifact-export-intent.test.ts

@@ -10,45 +10,50 @@ import type { ToolcraftArtifactExportIntent } from "./acceptance/types";
 const deliveryCases: readonly Readonly<{
   expected: Readonly<{
     imageEnabled: boolean;
+    svgEnabled: boolean;
     videoEnabled: boolean;
   }>;
   intent: ToolcraftArtifactExportIntent;
   name: string;
 }>[] = [
   {
-    expected: { imageEnabled: true, videoEnabled: false },
+    expected: { imageEnabled: true, svgEnabled: false, videoEnabled: false },
     intent: {
       image: { mode: "toolcraft-default" },
+      svg: { mode: "not-requested" },
       video: { mode: "not-requested" },
     },
     name: "enables default image export without unrequested video export",
   },
   {
-    expected: { imageEnabled: true, videoEnabled: false },
+    expected: { imageEnabled: true, svgEnabled: false, videoEnabled: false },
     intent: {
       image: {
         evidence: "The user explicitly requested PNG delivery.",
         mode: "user-requested",
       },
+      svg: { mode: "not-requested" },
       video: { mode: "not-requested" },
     },
     name: "enables explicitly requested image export",
   },
   {
-    expected: { imageEnabled: false, videoEnabled: false },
+    expected: { imageEnabled: false, svgEnabled: false, videoEnabled: false },
     intent: {
       image: {
         evidence: "The user explicitly requested no image export.",
         mode: "user-removed",
       },
+      svg: { mode: "not-requested" },
       video: { mode: "not-requested" },
     },
     name: "disables explicitly removed image export",
   },
   {
-    expected: { imageEnabled: true, videoEnabled: true },
+    expected: { imageEnabled: true, svgEnabled: false, videoEnabled: true },
     intent: {
       image: { mode: "toolcraft-default" },
+      svg: { mode: "not-requested" },
       video: {
         evidence: "The user explicitly requested MP4 delivery.",
         mode: "user-requested",
@@ -57,12 +62,13 @@ const deliveryCases: readonly Readonly<{
     name: "enables explicitly requested video export",
   },
   {
-    expected: { imageEnabled: true, videoEnabled: true },
+    expected: { imageEnabled: true, svgEnabled: false, videoEnabled: true },
     intent: {
       image: {
         evidence: "The user explicitly requested PNG delivery.",
         mode: "user-requested",
       },
+      svg: { mode: "not-requested" },
       video: {
         evidence: "The user explicitly requested MP4 delivery.",
         mode: "user-requested",
@@ -71,12 +77,13 @@ const deliveryCases: readonly Readonly<{
     name: "enables explicitly requested image and video export",
   },
   {
-    expected: { imageEnabled: false, videoEnabled: true },
+    expected: { imageEnabled: false, svgEnabled: false, videoEnabled: true },
     intent: {
       image: {
         evidence: "The user explicitly requested no image export.",
         mode: "user-removed",
       },
+      svg: { mode: "not-requested" },
       video: {
         evidence: "The user explicitly requested MP4 delivery.",
         mode: "user-requested",
@@ -84,6 +91,21 @@ const deliveryCases: readonly Readonly<{
     },
     name: "keeps requested video export when image export is removed",
   },
+  {
+    expected: { imageEnabled: false, svgEnabled: true, videoEnabled: false },
+    intent: {
+      image: {
+        evidence: "The user explicitly requested SVG instead of image export.",
+        mode: "user-removed",
+      },
+      svg: {
+        evidence: "The user explicitly requested editable SVG delivery.",
+        mode: "user-requested",
+      },
+      video: { mode: "not-requested" },
+    },
+    name: "enables requested SVG without retaining default image export",
+  },
 ];
 
 const evidenceCases: readonly Readonly<{
@@ -95,6 +117,7 @@ const evidenceCases: readonly Readonly<{
     expected: [],
     intent: {
       image: { mode: "toolcraft-default" },
+      svg: { mode: "not-requested" },
       video: { mode: "not-requested" },
     },
     name: "accepts default image and not-requested video modes",
@@ -106,6 +129,7 @@ const evidenceCases: readonly Readonly<{
         evidence: "The user explicitly requested PNG delivery.",
         mode: "user-requested",
       },
+      svg: { mode: "not-requested" },
       video: { mode: "not-requested" },
     },
     name: "accepts nonblank requested image evidence",
@@ -117,6 +141,7 @@ const evidenceCases: readonly Readonly<{
         evidence: "The user explicitly requested no image export.",
         mode: "user-removed",
       },
+      svg: { mode: "not-requested" },
       video: { mode: "not-requested" },
     },
     name: "accepts nonblank image removal evidence",
@@ -125,6 +150,7 @@ const evidenceCases: readonly Readonly<{
     expected: [],
     intent: {
       image: { mode: "toolcraft-default" },
+      svg: { mode: "not-requested" },
       video: {
         evidence: "The user explicitly requested MP4 delivery.",
         mode: "user-requested",
@@ -138,6 +164,7 @@ const evidenceCases: readonly Readonly<{
     ],
     intent: {
       image: { evidence: " \n\t ", mode: "user-removed" },
+      svg: { mode: "not-requested" },
       video: { mode: "not-requested" },
     },
     name: "rejects blank image removal evidence",
@@ -148,6 +175,7 @@ const evidenceCases: readonly Readonly<{
     ],
     intent: {
       image: { evidence: "   ", mode: "user-requested" },
+      svg: { mode: "not-requested" },
       video: { mode: "not-requested" },
     },
     name: "rejects blank requested image evidence",
@@ -158,10 +186,22 @@ const evidenceCases: readonly Readonly<{
     ],
     intent: {
       image: { mode: "toolcraft-default" },
+      svg: { mode: "not-requested" },
       video: { evidence: "\t", mode: "user-requested" },
     },
     name: "rejects blank requested video evidence",
   },
+  {
+    expected: [
+      "SVG export user-requested intent requires non-empty evidence.",
+    ],
+    intent: {
+      image: { mode: "toolcraft-default" },
+      svg: { evidence: "\t", mode: "user-requested" },
+      video: { mode: "not-requested" },
+    },
+    name: "rejects blank requested SVG evidence",
+  },
   {
     expected: [
       "Image export user-removed intent requires non-empty evidence.",
@@ -169,6 +209,7 @@ const evidenceCases: readonly Readonly<{
     ],
     intent: {
       image: { evidence: " ", mode: "user-removed" },
+      svg: { mode: "not-requested" },
       video: { evidence: "\n", mode: "user-requested" },
     },
     name: "aggregates blank image and video evidence errors",
@@ -194,15 +235,17 @@ describe("Toolcraft artifact export intent", () => {
       validateToolcraftArtifactExportIntentCorrespondence({
         hasImageExportAction: false,
         hasImageExportSection: false,
+        hasSvgExportAction: false,
         hasVideoExportAction: true,
         hasVideoExportSection: true,
         intent: {
           image: { mode: "toolcraft-default" },
+          svg: { mode: "not-requested" },
           video: { mode: "not-requested" },
         },
       }),
     ).toEqual({
-      delivery: { imageEnabled: true, videoEnabled: false },
+      delivery: { imageEnabled: true, svgEnabled: false, videoEnabled: false },
       errors: [
         'Image export intent "toolcraft-default" requires an export-image panel action.',
         'Image export intent "toolcraft-default" requires an "Image Export" section.',
@@ -217,15 +260,17 @@ describe("Toolcraft artifact export intent", () => {
       validateToolcraftArtifactExportIntentCorrespondence({
         hasImageExportAction: true,
         hasImageExportSection: true,
+        hasSvgExportAction: false,
         hasVideoExportAction: false,
         hasVideoExportSection: false,
         intent: {
           image: { evidence: "  ", mode: "user-removed" },
+          svg: { mode: "not-requested" },
           video: { evidence: "\t", mode: "user-requested" },
         },
       }),
     ).toEqual({
-      delivery: { imageEnabled: false, videoEnabled: true },
+      delivery: { imageEnabled: false, svgEnabled: false, videoEnabled: true },
       errors: [
         "Image export user-removed intent requires non-empty evidence.",
         "Video export user-requested intent requires non-empty evidence.",
@@ -236,4 +281,32 @@ describe("Toolcraft artifact export intent", () => {
       ],
     });
   });
+
+  it("requires requested SVG to correspond to one typed action without a settings section", () => {
+    expect(
+      validateToolcraftArtifactExportIntentCorrespondence({
+        hasImageExportAction: false,
+        hasImageExportSection: false,
+        hasSvgExportAction: false,
+        hasVideoExportAction: false,
+        hasVideoExportSection: false,
+        intent: {
+          image: {
+            evidence: "The user requested SVG only.",
+            mode: "user-removed",
+          },
+          svg: {
+            evidence: "The user requested editable SVG.",
+            mode: "user-requested",
+          },
+          video: { mode: "not-requested" },
+        },
+      }),
+    ).toEqual({
+      delivery: { imageEnabled: false, svgEnabled: true, videoEnabled: false },
+      errors: [
+        'SVG export intent "user-requested" requires an export-svg panel action.',
+      ],
+    });
+  });
 });

package/templates/starter/src/app/starter-acceptance.background-export.test.ts

@@ -11,6 +11,7 @@ import { makeControlAcceptance } from "./starter-acceptance.test-utils";
 const imageExportProductReadiness: ToolcraftProductReadiness = {
   exportIntent: {
     image: { mode: "toolcraft-default" },
+    svg: { mode: "not-requested" },
     video: { mode: "not-requested" },
   },
   interactionOwnership: [],
@@ -28,6 +29,7 @@ const videoExportProductReadiness: ToolcraftProductReadiness = {
   ...imageExportProductReadiness,
   exportIntent: {
     image: { mode: "toolcraft-default" },
+    svg: { mode: "not-requested" },
     video: {
       evidence: "The background fixture explicitly exercises video background export.",
       mode: "user-requested",

package/templates/starter/src/app/starter-acceptance.canvas-sizing.test.ts

@@ -11,6 +11,7 @@ import type { ToolcraftProductReadiness } from "./acceptance/types";
 const infinityProductReadiness: ToolcraftProductReadiness = {
   exportIntent: {
     image: { mode: "toolcraft-default" },
+    svg: { mode: "not-requested" },
     video: { mode: "not-requested" },
   },
   interactionOwnership: [],
@@ -28,6 +29,7 @@ const infinityVideoProductReadiness: ToolcraftProductReadiness = {
   ...infinityProductReadiness,
   exportIntent: {
     image: { mode: "toolcraft-default" },
+    svg: { mode: "not-requested" },
     video: {
       evidence: "The Infinity canvas fixture explicitly exercises video export bounds.",
       mode: "user-requested",

package/templates/starter/src/app/starter-acceptance.color-row-grouping.test.ts

@@ -0,0 +1,118 @@
+import { defineToolcraft } from "@repo/toolcraft-runtime";
+import { describe, expect, it } from "vitest";
+
+import { getToolcraftControlSectionInvariantErrors } from "./acceptance/control-layout";
+
+function makeMixedColorSchema(includeSemanticGroups: boolean) {
+  const withSemanticGroup = (
+    semanticGroup: string,
+  ): { semanticGroup: string } | Record<string, never> =>
+    includeSemanticGroups ? { semanticGroup } : {};
+
+  return defineToolcraft({
+    canvas: { enabled: true },
+    panels: {
+      controls: {
+        sections: [
+          {
+            controls: {
+              trackEnabled: {
+                defaultValue: true,
+                label: "Track",
+                target: "track.enabled",
+                type: "switch",
+              },
+              trackColor: {
+                ...withSemanticGroup("track-line"),
+                defaultValue: { hex: "#F1F1F1" },
+                label: "Track color",
+                target: "track.color",
+                type: "color",
+              },
+              lowerColor: {
+                ...withSemanticGroup("track-range"),
+                defaultValue: { hex: "#7A9CBD" },
+                label: "Lower",
+                target: "track.lower",
+                type: "color",
+              },
+              upperColor: {
+                ...withSemanticGroup("track-range"),
+                defaultValue: { hex: "#52AAFF" },
+                label: "Upper",
+                target: "track.upper",
+                type: "color",
+              },
+            },
+            id: "track-appearance",
+            title: "Track Appearance",
+          },
+        ],
+        title: "Controls",
+      },
+    },
+  });
+}
+
+function makeColorOnlySchema() {
+  return defineToolcraft({
+    canvas: { enabled: true },
+    panels: {
+      controls: {
+        sections: [
+          {
+            controls: {
+              trackColor: {
+                defaultValue: { hex: "#F1F1F1" },
+                label: "Track",
+                target: "track.color",
+                type: "color",
+              },
+              lowerColor: {
+                defaultValue: { hex: "#7A9CBD" },
+                label: "Lower",
+                target: "track.lower",
+                type: "color",
+              },
+              upperColor: {
+                defaultValue: { hex: "#52AAFF" },
+                label: "Upper",
+                target: "track.upper",
+                type: "color",
+              },
+            },
+            id: "track-palette",
+            title: "Track Palette",
+          },
+        ],
+        title: "Controls",
+      },
+    },
+  });
+}
+
+describe("starter acceptance semantic color rows", () => {
+  it("rejects ambiguous plain colors in a mixed section", () => {
+    expect(
+      getToolcraftControlSectionInvariantErrors(makeMixedColorSchema(false)),
+    ).toEqual(
+      expect.arrayContaining([
+        expect.stringContaining(
+          "must declare semanticGroup for every plain Color",
+        ),
+      ]),
+    );
+  });
+
+  it("accepts explicit color banks in a mixed section", () => {
+    expect(
+      getToolcraftControlSectionInvariantErrors(makeMixedColorSchema(true)),
+    ).toEqual([]);
+  });
+
+  it("keeps a color-only section as one implicit bank", () => {
+    expect(
+      getToolcraftControlSectionInvariantErrors(makeColorOnlySchema()),
+    ).toEqual([]);
+  });
+});

package/templates/starter/src/app/starter-acceptance.compound-part-coverage.test.ts

@@ -265,7 +265,7 @@ describe("starter acceptance compound control part coverage contract", () => {
                       { color: "#FFE97A", opacity: 100, position: "100%" },
                     ],
                   },
-                  label: "Gradient",
+                  label: false,
                   orderRole: "color",
                   target: "mesh.gradient",
                   type: "gradient",

package/templates/starter/src/app/starter-acceptance.contract-fixtures.ts

@@ -73,6 +73,7 @@ export const contractSectionInventoryFixture: readonly ToolcraftControlSectionIn
 export const contractTransferModeFixture: ToolcraftTransferMode = {
   animationIntent: { mode: "none" },
   mode: "new-toolcraft-app",
+  referenceInputs: [],
 };
 
 export const contractProductReadinessFixture: ToolcraftProductReadiness = {

package/templates/starter/src/app/starter-acceptance.control-applicability.test.ts

@@ -11,6 +11,7 @@ import { collectToolcraftVisibleAcceptanceControls } from "./acceptance/validate
 const productReadiness: ToolcraftProductReadiness = {
   exportIntent: {
     image: { mode: "toolcraft-default" },
+    svg: { mode: "not-requested" },
     video: { mode: "not-requested" },
   },
   interactionOwnership: [],

package/templates/starter/src/app/starter-acceptance.control-label-context.test.ts

@@ -52,6 +52,7 @@ describe("starter acceptance control label context contract", () => {
             reason: "The motion speed is a decorative self-running effect and does not expose product time transport.",
           },
           mode: "new-toolcraft-app",
+          referenceInputs: [],
         },
       }),
     ).toEqual([]);

package/templates/starter/src/app/starter-acceptance.control-labels.test.ts

@@ -259,8 +259,81 @@ describe("starter acceptance control label contract", () => {
       }),
     ).toEqual(
       expect.arrayContaining([
-        'Accent Shades / accent1 uses visible label "Color 1" for a palette variation color. When colors only add variety to one shared palette, set label: false or use collectionActions with unlabeled items. Keep visible labels only when each color edits a distinct user-facing entity such as Fill, Stroke, Background, Connector, or Object color.',
-        'Accent Shades / accent2 uses visible label "Color 2" for a palette variation color. When colors only add variety to one shared palette, set label: false or use collectionActions with unlabeled items. Keep visible labels only when each color edits a distinct user-facing entity such as Fill, Stroke, Background, Connector, or Object color.',
+        'Accent Shades / accent1 uses visible label "Color 1" for one of multiple sibling colors. Set label: false when the colors form one shared bank, or use a distinct user-facing role such as Fill, Stroke, Background, Connector, or Object color.',
+        'Accent Shades / accent2 uses visible label "Color 2" for one of multiple sibling colors. Set label: false when the colors form one shared bank, or use a distinct user-facing role such as Fill, Stroke, Background, Connector, or Object color.',
+      ]),
+    );
+  });
+
+  it("rejects sequential labels for sibling colors without palette keywords", () => {
+    const schemaWithSpectrumColors = defineContractSchemaFixture({
+      canvas: { enabled: true },
+      panels: {
+        controls: {
+          sections: [
+            {
+              controls: {
+                spectrum: {
+                  defaultValue: "custom",
+                  label: "Spectrum",
+                  options: [{ label: "Custom", value: "custom" }],
+                  target: "dispersion.spectrum",
+                  type: "select",
+                },
+                customColorA: {
+                  defaultValue: { hex: "#A65F15" },
+                  label: "Color 1",
+                  semanticGroup: "custom-spectrum",
+                  target: "dispersion.customColorA",
+                  type: "color",
+                },
+                customColorB: {
+                  defaultValue: { hex: "#371C4D" },
+                  label: "Color 2",
+                  semanticGroup: "custom-spectrum",
+                  target: "dispersion.customColorB",
+                  type: "color",
+                },
+                customColorC: {
+                  defaultValue: { hex: "#375B75" },
+                  label: "Color 3",
+                  semanticGroup: "custom-spectrum",
+                  target: "dispersion.customColorC",
+                  type: "color",
+                },
+                customColorD: {
+                  defaultValue: { hex: "#2A343E" },
+                  label: "Color 4",
+                  semanticGroup: "custom-spectrum",
+                  target: "dispersion.customColorD",
+                  type: "color",
+                },
+              },
+              title: "Spectrum",
+            },
+          ],
+          title: "Controls",
+        },
+      },
+    });
+
+    expect(
+      validateContractAcceptance({
+        schema: schemaWithSpectrumColors,
+        acceptance: [
+          makeControlAcceptance("dispersion.spectrum", "select"),
+          makeControlAcceptance("dispersion.customColorA", "color"),
+          makeControlAcceptance("dispersion.customColorB", "color"),
+          makeControlAcceptance("dispersion.customColorC", "color"),
+          makeControlAcceptance("dispersion.customColorD", "color"),
+        ],
+      }),
+    ).toEqual(
+      expect.arrayContaining([
+        expect.stringContaining('customColorA uses visible label "Color 1"'),
+        expect.stringContaining('customColorB uses visible label "Color 2"'),
+        expect.stringContaining('customColorC uses visible label "Color 3"'),
+        expect.stringContaining('customColorD uses visible label "Color 4"'),
       ]),
     );
   });
@@ -312,7 +385,7 @@ describe("starter acceptance control label contract", () => {
     ).toEqual(
       expect.arrayContaining([
         "Accent Shades mixes labeled and unlabeled color items in one palette variation group. Decide label visibility for the whole group: omit all per-item labels when colors only add variety, or label every item only when each color has a distinct user-facing role.",
-        'Accent Shades / accent2 uses visible label "Color 2" for a palette variation color. When colors only add variety to one shared palette, set label: false or use collectionActions with unlabeled items. Keep visible labels only when each color edits a distinct user-facing entity such as Fill, Stroke, Background, Connector, or Object color.',
+        'Accent Shades / accent2 uses visible label "Color 2" for one of multiple sibling colors. Set label: false when the colors form one shared bank, or use a distinct user-facing role such as Fill, Stroke, Background, Connector, or Object color.',
       ]),
     );
   });
@@ -328,12 +401,14 @@ describe("starter acceptance control label contract", () => {
                 accent1: {
                   defaultValue: { hex: "#9CE6FF" },
                   label: false,
+                  semanticGroup: "accent-palette",
                   target: "palette.accent1",
                   type: "color",
                 },
                 accent2: {
                   defaultValue: { hex: "#FF7A90" },
                   label: false,
+                  semanticGroup: "accent-palette",
                   target: "palette.accent2",
                   type: "color",
                 },

package/templates/starter/src/app/starter-acceptance.control-naming-rules.test.ts

@@ -128,12 +128,88 @@ describe("starter acceptance control naming rules", () => {
     ).toEqual(
       expect.arrayContaining([
         expect.stringContaining(
-          'export.includeBackground) toggle label "Background" duplicates section title "Background". Use a shorter contextual label such as "Include" or rename the toggle to a more specific setting.',
+          'Background / includeBackground visible label "Background" duplicates section title "Background". Set label: false when the section supplies the complete visible context, or use a more specific label for a distinct setting.',
         ),
       ]),
     );
   });
 
+  it("rejects visible select labels that duplicate their section title", () => {
+    const schemaWithDuplicateSelectLabel = defineContractSchemaFixture({
+      canvas: { enabled: true },
+      panels: {
+        controls: {
+          sections: [
+            {
+              controls: {
+                spectrum: {
+                  defaultValue: "custom",
+                  label: "Spectrum",
+                  options: [{ label: "Custom", value: "custom" }],
+                  target: "dispersion.spectrum",
+                  type: "select",
+                },
+              },
+              title: "Spectrum",
+            },
+          ],
+          title: "Controls",
+        },
+      },
+    });
+
+    expect(
+      validateContractAcceptance({
+        schema: schemaWithDuplicateSelectLabel,
+        acceptance: [
+          makeControlAcceptance("dispersion.spectrum", "select"),
+        ],
+      }),
+    ).toEqual(
+      expect.arrayContaining([
+        expect.stringContaining(
+          'Spectrum / spectrum visible label "Spectrum" duplicates section title "Spectrum". Set label: false when the section supplies the complete visible context, or use a more specific label for a distinct setting.',
+        ),
+      ]),
+    );
+  });
+
+  it("allows tabs accessibility names that match their section title", () => {
+    const schemaWithMatchingTabsName = defineContractSchemaFixture({
+      canvas: { enabled: true },
+      panels: {
+        controls: {
+          sections: [
+            {
+              controls: {
+                spectrum: {
+                  defaultValue: "custom",
+                  label: "Spectrum",
+                  options: [{ label: "Custom", value: "custom" }],
+                  target: "dispersion.spectrum",
+                  type: "tabs",
+                },
+              },
+              title: "Spectrum",
+            },
+          ],
+          title: "Controls",
+        },
+      },
+    });
+
+    const errors = validateContractAcceptance({
+      schema: schemaWithMatchingTabsName,
+      acceptance: [makeControlAcceptance("dispersion.spectrum", "tabs")],
+    });
+
+    expect(errors).not.toEqual(
+      expect.arrayContaining([
+        expect.stringContaining("duplicates section title"),
+      ]),
+    );
+  });
+
   it("rejects single Actions controls that duplicate their only button label", () => {
     const schemaWithDuplicateActionLabel = defineContractSchemaFixture({
       canvas: { enabled: true },

package/templates/starter/src/app/starter-acceptance.custom-control-fit-check.test.ts

@@ -82,7 +82,7 @@ describe("starter acceptance custom control built-in fit contract", () => {
               controls: {
                 shapeButtons: {
                   defaultValue: "rect",
-                  label: "Shape",
+                  label: false,
                   orderRole: "style",
                   target: "shape.kind",
                   type: "shapeButtons",