feat(studio): add stroke-summary format/parse helpers for the flat Style group

packages/studio/src/components/editor/propertyPanelFlatStyleHelpers.test.ts

@@ -0,0 +1,23 @@
+import { describe, expect, it } from "vitest";
+import { formatStrokeSummary, parseStrokeSummary } from "./propertyPanelFlatStyleHelpers";
+
+describe("formatStrokeSummary", () => {
+  it("formats width and style into one string", () => {
+    expect(formatStrokeSummary(1, "solid")).toBe("1px solid");
+    expect(formatStrokeSummary(2.5, "dashed")).toBe("2.5px dashed");
+    expect(formatStrokeSummary(0, "none")).toBe("0px none");
+  });
+});
+
+describe("parseStrokeSummary", () => {
+  it("parses a well-formed summary back into width and style", () => {
+    expect(parseStrokeSummary("1px solid")).toEqual({ widthPx: 1, style: "solid" });
+    expect(parseStrokeSummary("  2.5px   dashed  ")).toEqual({ widthPx: 2.5, style: "dashed" });
+  });
+
+  it("returns null for unparseable input", () => {
+    expect(parseStrokeSummary("garbage")).toBeNull();
+    expect(parseStrokeSummary("")).toBeNull();
+    expect(parseStrokeSummary("1px")).toBeNull();
+  });
+});

packages/studio/src/components/editor/propertyPanelFlatStyleHelpers.ts

@@ -0,0 +1,12 @@
+export function formatStrokeSummary(widthPx: number, style: string): string {
+  return `${widthPx}px ${style}`;
+}
+
+export function parseStrokeSummary(text: string): { widthPx: number; style: string } | null {
+  const match = /^\s*(-?\d+(?:\.\d+)?)px\s+(\S+)\s*$/.exec(text);
+  if (!match) return null;
+  const widthPx = Number.parseFloat(match[1]);
+  const style = match[2];
+  if (!Number.isFinite(widthPx) || !style) return null;
+  return { widthPx, style };
+}