@viax.io/uxm 4.36.0

package/dist/ui/color-input/color-model.cjs

@@ -0,0 +1,174 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var color_model_exports = {};
+__export(color_model_exports, {
+  formatColor: () => formatColor,
+  hsvToRgb: () => hsvToRgb,
+  hsvaToRgba: () => hsvaToRgba,
+  parseColorString: () => parseColorString,
+  rgbToHsv: () => rgbToHsv,
+  rgbaToHsva: () => rgbaToHsva
+});
+module.exports = __toCommonJS(color_model_exports);
+var import_contrast = require("../../lib/contrast.cjs");
+const clamp = (n, min, max) => Math.min(max, Math.max(min, n));
+function rgbToHsv({ r, g, b }) {
+  const rn = r / 255;
+  const gn = g / 255;
+  const bn = b / 255;
+  const max = Math.max(rn, gn, bn);
+  const min = Math.min(rn, gn, bn);
+  const d = max - min;
+  let h = 0;
+  if (d !== 0) {
+    switch (max) {
+      case rn:
+        h = (gn - bn) / d % 6;
+        break;
+      case gn:
+        h = (bn - rn) / d + 2;
+        break;
+      default:
+        h = (rn - gn) / d + 4;
+        break;
+    }
+    h *= 60;
+    if (h < 0) h += 360;
+  }
+  const s = max === 0 ? 0 : d / max;
+  return { h, s: s * 100, v: max * 100 };
+}
+function hsvToRgb({ h, s, v }) {
+  const sn = clamp(s, 0, 100) / 100;
+  const vn = clamp(v, 0, 100) / 100;
+  const c = vn * sn;
+  const hp = (h % 360 + 360) % 360 / 60;
+  const x = c * (1 - Math.abs(hp % 2 - 1));
+  let r = 0;
+  let g = 0;
+  let b = 0;
+  if (hp < 1) [r, g, b] = [c, x, 0];
+  else if (hp < 2) [r, g, b] = [x, c, 0];
+  else if (hp < 3) [r, g, b] = [0, c, x];
+  else if (hp < 4) [r, g, b] = [0, x, c];
+  else if (hp < 5) [r, g, b] = [x, 0, c];
+  else [r, g, b] = [c, 0, x];
+  const m = vn - c;
+  return { r: (r + m) * 255, g: (g + m) * 255, b: (b + m) * 255 };
+}
+function rgbaToHsva(rgba) {
+  const { h, s, v } = rgbToHsv(rgba);
+  return { h, s, v, a: rgba.a };
+}
+function hsvaToRgba(hsva) {
+  const { r, g, b } = hsvToRgb(hsva);
+  return { r, g, b, a: hsva.a };
+}
+function parseAlpha(token) {
+  const n = token.endsWith("%") ? parseFloat(token) / 100 : parseFloat(token);
+  return Number.isNaN(n) ? 1 : clamp(n, 0, 1);
+}
+function parseColorString(input) {
+  const v = input.trim();
+  const hex = v.match(/^#([0-9a-f]{3,8})$/i);
+  if (hex) {
+    const h = hex[1];
+    if (h.length === 3 || h.length === 4) {
+      return {
+        r: parseInt(h[0] + h[0], 16),
+        g: parseInt(h[1] + h[1], 16),
+        b: parseInt(h[2] + h[2], 16),
+        a: h.length === 4 ? parseInt(h[3] + h[3], 16) / 255 : 1
+      };
+    }
+    if (h.length === 6 || h.length === 8) {
+      return {
+        r: parseInt(h.slice(0, 2), 16),
+        g: parseInt(h.slice(2, 4), 16),
+        b: parseInt(h.slice(4, 6), 16),
+        a: h.length === 8 ? parseInt(h.slice(6, 8), 16) / 255 : 1
+      };
+    }
+    return null;
+  }
+  const rgb = v.match(/^rgba?\(([^)]+)\)$/i);
+  if (rgb) {
+    const parts = rgb[1].split(/[\s,/]+/).filter(Boolean);
+    if (parts.length < 3) return null;
+    const channels = parts.slice(0, 3).map(
+      (p) => p.endsWith("%") ? Math.round(parseFloat(p) * 255 / 100) : Math.round(parseFloat(p))
+    );
+    if (channels.some((n) => Number.isNaN(n))) return null;
+    const [r, g, b] = channels;
+    return { r, g, b, a: parts[3] !== void 0 ? parseAlpha(parts[3]) : 1 };
+  }
+  const hsl = v.match(/^hsla?\(([^)]+)\)$/i);
+  if (hsl) {
+    const parts = hsl[1].split(/[\s,/]+/).filter(Boolean);
+    if (parts.length < 3) return null;
+    const h = parseFloat(parts[0]);
+    const s = parseFloat(parts[1]);
+    const l = parseFloat(parts[2]);
+    if ([h, s, l].some((n) => Number.isNaN(n))) return null;
+    const { r, g, b } = (0, import_contrast.hslToRgb)({ h, s, l });
+    return {
+      r: Math.round(r),
+      g: Math.round(g),
+      b: Math.round(b),
+      a: parts[3] !== void 0 ? parseAlpha(parts[3]) : 1
+    };
+  }
+  return null;
+}
+function formatAlpha(a) {
+  return String(Math.round(clamp(a, 0, 1) * 100) / 100);
+}
+function hexByte(n) {
+  return clamp(Math.round(n), 0, 255).toString(16).padStart(2, "0");
+}
+function formatColor(rgba, format) {
+  const r = clamp(Math.round(rgba.r), 0, 255);
+  const g = clamp(Math.round(rgba.g), 0, 255);
+  const b = clamp(Math.round(rgba.b), 0, 255);
+  switch (format) {
+    case "hex":
+      return rgba.a < 1 ? `${(0, import_contrast.rgbToHex)({ r, g, b })}${hexByte(rgba.a * 255)}` : (0, import_contrast.rgbToHex)({ r, g, b });
+    case "rgb":
+      return `rgb(${r}, ${g}, ${b})`;
+    case "rgba":
+      return `rgba(${r}, ${g}, ${b}, ${formatAlpha(rgba.a)})`;
+    case "hsl": {
+      const { h, s, l } = (0, import_contrast.rgbToHsl)({ r, g, b });
+      const hr = Math.round(h);
+      const sr = Math.round(s);
+      const lr = Math.round(l);
+      return rgba.a < 1 ? `hsla(${hr}, ${sr}%, ${lr}%, ${formatAlpha(rgba.a)})` : `hsl(${hr}, ${sr}%, ${lr}%)`;
+    }
+  }
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  formatColor,
+  hsvToRgb,
+  hsvaToRgba,
+  parseColorString,
+  rgbToHsv,
+  rgbaToHsva
+});
+//# sourceMappingURL=color-model.cjs.map

package/dist/ui/color-input/color-model.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/ui/color-input/color-model.ts"],"sourcesContent":["import { hslToRgb, rgbToHsl, rgbToHex, type RGB } from '@/lib/contrast';\n\n/**\n * Color model for ColorInput. Adds the pieces `@/lib/contrast` doesn't cover:\n * an alpha channel (`RGBA`), the HSV color space (`HSVA` — the natural model\n * for a 2D saturation/value picker), a permissive multi-syntax parser\n * (`parseColorString`) and a format-directed serializer (`formatColor`).\n * Everything hue/lightness related delegates to the shared `contrast` helpers\n * so there's one source of truth for the math.\n */\n\n/** The output/representation formats ColorInput understands. */\nexport type ColorFormat = 'hex' | 'rgb' | 'rgba' | 'hsl';\n\n/** Red/green/blue channels 0–255, alpha 0–1. */\nexport interface RGBA {\n  r: number;\n  g: number;\n  b: number;\n  a: number;\n}\n\n/** Hue 0–360, saturation & value 0–100, alpha 0–1. */\nexport interface HSVA {\n  h: number;\n  s: number;\n  v: number;\n  a: number;\n}\n\nconst clamp = (n: number, min: number, max: number): number => Math.min(max, Math.max(min, n));\n\n/**\n * RGB → HSV. Hue matches the HSL convention (so it lines up with the shared\n * hue slider), but saturation/value use the HSV formulas — that's what a\n * rectangular saturation/brightness area needs.\n */\nexport function rgbToHsv({ r, g, b }: RGB): { h: number; s: number; v: number } {\n  const rn = r / 255;\n  const gn = g / 255;\n  const bn = b / 255;\n  const max = Math.max(rn, gn, bn);\n  const min = Math.min(rn, gn, bn);\n  const d = max - min;\n  let h = 0;\n  if (d !== 0) {\n    switch (max) {\n      case rn: h = ((gn - bn) / d) % 6; break;\n      case gn: h = (bn - rn) / d + 2; break;\n      default: h = (rn - gn) / d + 4; break;\n    }\n    h *= 60;\n    if (h < 0) h += 360;\n  }\n  const s = max === 0 ? 0 : d / max;\n  return { h, s: s * 100, v: max * 100 };\n}\n\n/** HSV → RGB (channels 0–255). Inverse of `rgbToHsv`. */\nexport function hsvToRgb({ h, s, v }: { h: number; s: number; v: number }): RGB {\n  const sn = clamp(s, 0, 100) / 100;\n  const vn = clamp(v, 0, 100) / 100;\n  const c = vn * sn;\n  const hp = ((((h % 360) + 360) % 360)) / 60;\n  const x = c * (1 - Math.abs((hp % 2) - 1));\n  let r = 0;\n  let g = 0;\n  let b = 0;\n  if (hp < 1) [r, g, b] = [c, x, 0];\n  else if (hp < 2) [r, g, b] = [x, c, 0];\n  else if (hp < 3) [r, g, b] = [0, c, x];\n  else if (hp < 4) [r, g, b] = [0, x, c];\n  else if (hp < 5) [r, g, b] = [x, 0, c];\n  else [r, g, b] = [c, 0, x];\n  const m = vn - c;\n  return { r: (r + m) * 255, g: (g + m) * 255, b: (b + m) * 255 };\n}\n\n/** Combine `rgbToHsv` with an alpha passthrough. */\nexport function rgbaToHsva(rgba: RGBA): HSVA {\n  const { h, s, v } = rgbToHsv(rgba);\n  return { h, s, v, a: rgba.a };\n}\n\n/** Combine `hsvToRgb` with an alpha passthrough. */\nexport function hsvaToRgba(hsva: HSVA): RGBA {\n  const { r, g, b } = hsvToRgb(hsva);\n  return { r, g, b, a: hsva.a };\n}\n\n/** Parse an alpha token — `\"0.5\"` or `\"50%\"` — into a clamped 0–1 number. */\nfunction parseAlpha(token: string): number {\n  const n = token.endsWith('%') ? parseFloat(token) / 100 : parseFloat(token);\n  return Number.isNaN(n) ? 1 : clamp(n, 0, 1);\n}\n\n/**\n * Parse any of the supported color syntaxes into `RGBA`, or `null` when the\n * string isn't a recognizable color. Handles:\n *   - hex: `#rgb`, `#rgba`, `#rrggbb`, `#rrggbbaa` (alpha from the 4/8-digit forms)\n *   - `rgb()` / `rgba()` — channels as 0–255 or `%`, optional 4th alpha component\n *   - `hsl()` / `hsla()` — converted through the shared `hslToRgb`\n * Comma- and space/slash-separated argument lists are both accepted.\n */\nexport function parseColorString(input: string): RGBA | null {\n  const v = input.trim();\n\n  const hex = v.match(/^#([0-9a-f]{3,8})$/i);\n  if (hex) {\n    const h = hex[1];\n    if (h.length === 3 || h.length === 4) {\n      return {\n        r: parseInt(h[0] + h[0], 16),\n        g: parseInt(h[1] + h[1], 16),\n        b: parseInt(h[2] + h[2], 16),\n        a: h.length === 4 ? parseInt(h[3] + h[3], 16) / 255 : 1,\n      };\n    }\n    if (h.length === 6 || h.length === 8) {\n      return {\n        r: parseInt(h.slice(0, 2), 16),\n        g: parseInt(h.slice(2, 4), 16),\n        b: parseInt(h.slice(4, 6), 16),\n        a: h.length === 8 ? parseInt(h.slice(6, 8), 16) / 255 : 1,\n      };\n    }\n    return null;\n  }\n\n  const rgb = v.match(/^rgba?\\(([^)]+)\\)$/i);\n  if (rgb) {\n    const parts = rgb[1].split(/[\\s,/]+/).filter(Boolean);\n    if (parts.length < 3) return null;\n    const channels = parts.slice(0, 3).map((p) =>\n      p.endsWith('%') ? Math.round((parseFloat(p) * 255) / 100) : Math.round(parseFloat(p)),\n    );\n    if (channels.some((n) => Number.isNaN(n))) return null;\n    const [r, g, b] = channels;\n    return { r, g, b, a: parts[3] !== undefined ? parseAlpha(parts[3]) : 1 };\n  }\n\n  const hsl = v.match(/^hsla?\\(([^)]+)\\)$/i);\n  if (hsl) {\n    const parts = hsl[1].split(/[\\s,/]+/).filter(Boolean);\n    if (parts.length < 3) return null;\n    const h = parseFloat(parts[0]);\n    const s = parseFloat(parts[1]);\n    const l = parseFloat(parts[2]);\n    if ([h, s, l].some((n) => Number.isNaN(n))) return null;\n    const { r, g, b } = hslToRgb({ h, s, l });\n    return {\n      r: Math.round(r),\n      g: Math.round(g),\n      b: Math.round(b),\n      a: parts[3] !== undefined ? parseAlpha(parts[3]) : 1,\n    };\n  }\n\n  return null;\n}\n\n/** Serialize an alpha value with up to 2 decimals and no trailing zeros. */\nfunction formatAlpha(a: number): string {\n  return String(Math.round(clamp(a, 0, 1) * 100) / 100);\n}\n\n/** Serialize a single channel as a two-digit lowercase hex byte. */\nfunction hexByte(n: number): string {\n  return clamp(Math.round(n), 0, 255).toString(16).padStart(2, '0');\n}\n\n/**\n * Serialize `RGBA` into the requested format:\n *   - `hex`  → `#rrggbb`, or `#rrggbbaa` when `a < 1`\n *   - `rgb`  → `rgb(r, g, b)` (alpha dropped)\n *   - `rgba` → `rgba(r, g, b, a)`\n *   - `hsl`  → `hsl(h, s%, l%)`, or `hsla(h, s%, l%, a)` when `a < 1`\n */\nexport function formatColor(rgba: RGBA, format: ColorFormat): string {\n  const r = clamp(Math.round(rgba.r), 0, 255);\n  const g = clamp(Math.round(rgba.g), 0, 255);\n  const b = clamp(Math.round(rgba.b), 0, 255);\n  switch (format) {\n    case 'hex':\n      return rgba.a < 1 ? `${rgbToHex({ r, g, b })}${hexByte(rgba.a * 255)}` : rgbToHex({ r, g, b });\n    case 'rgb':\n      return `rgb(${r}, ${g}, ${b})`;\n    case 'rgba':\n      return `rgba(${r}, ${g}, ${b}, ${formatAlpha(rgba.a)})`;\n    case 'hsl': {\n      const { h, s, l } = rgbToHsl({ r, g, b });\n      const hr = Math.round(h);\n      const sr = Math.round(s);\n      const lr = Math.round(l);\n      return rgba.a < 1\n        ? `hsla(${hr}, ${sr}%, ${lr}%, ${formatAlpha(rgba.a)})`\n        : `hsl(${hr}, ${sr}%, ${lr}%)`;\n    }\n  }\n}\n"],"mappings":"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","names":[]}

package/dist/ui/color-input/color-model.d.ts

@@ -0,0 +1,63 @@
+import { type RGB } from '../../lib/contrast.js';
+/**
+ * Color model for ColorInput. Adds the pieces `@/lib/contrast` doesn't cover:
+ * an alpha channel (`RGBA`), the HSV color space (`HSVA` — the natural model
+ * for a 2D saturation/value picker), a permissive multi-syntax parser
+ * (`parseColorString`) and a format-directed serializer (`formatColor`).
+ * Everything hue/lightness related delegates to the shared `contrast` helpers
+ * so there's one source of truth for the math.
+ */
+/** The output/representation formats ColorInput understands. */
+export type ColorFormat = 'hex' | 'rgb' | 'rgba' | 'hsl';
+/** Red/green/blue channels 0–255, alpha 0–1. */
+export interface RGBA {
+    r: number;
+    g: number;
+    b: number;
+    a: number;
+}
+/** Hue 0–360, saturation & value 0–100, alpha 0–1. */
+export interface HSVA {
+    h: number;
+    s: number;
+    v: number;
+    a: number;
+}
+/**
+ * RGB → HSV. Hue matches the HSL convention (so it lines up with the shared
+ * hue slider), but saturation/value use the HSV formulas — that's what a
+ * rectangular saturation/brightness area needs.
+ */
+export declare function rgbToHsv({ r, g, b }: RGB): {
+    h: number;
+    s: number;
+    v: number;
+};
+/** HSV → RGB (channels 0–255). Inverse of `rgbToHsv`. */
+export declare function hsvToRgb({ h, s, v }: {
+    h: number;
+    s: number;
+    v: number;
+}): RGB;
+/** Combine `rgbToHsv` with an alpha passthrough. */
+export declare function rgbaToHsva(rgba: RGBA): HSVA;
+/** Combine `hsvToRgb` with an alpha passthrough. */
+export declare function hsvaToRgba(hsva: HSVA): RGBA;
+/**
+ * Parse any of the supported color syntaxes into `RGBA`, or `null` when the
+ * string isn't a recognizable color. Handles:
+ *   - hex: `#rgb`, `#rgba`, `#rrggbb`, `#rrggbbaa` (alpha from the 4/8-digit forms)
+ *   - `rgb()` / `rgba()` — channels as 0–255 or `%`, optional 4th alpha component
+ *   - `hsl()` / `hsla()` — converted through the shared `hslToRgb`
+ * Comma- and space/slash-separated argument lists are both accepted.
+ */
+export declare function parseColorString(input: string): RGBA | null;
+/**
+ * Serialize `RGBA` into the requested format:
+ *   - `hex`  → `#rrggbb`, or `#rrggbbaa` when `a < 1`
+ *   - `rgb`  → `rgb(r, g, b)` (alpha dropped)
+ *   - `rgba` → `rgba(r, g, b, a)`
+ *   - `hsl`  → `hsl(h, s%, l%)`, or `hsla(h, s%, l%, a)` when `a < 1`
+ */
+export declare function formatColor(rgba: RGBA, format: ColorFormat): string;
+//# sourceMappingURL=color-model.d.ts.map

package/dist/ui/color-input/color-model.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"color-model.d.ts","sourceRoot":"","sources":["../../../src/ui/color-input/color-model.ts"],"names":[],"mappings":"AAAA,OAAO,EAAgC,KAAK,GAAG,EAAE,MAAM,gBAAgB,CAAC;AAExE;;;;;;;GAOG;AAEH,gEAAgE;AAChE,MAAM,MAAM,WAAW,GAAG,KAAK,GAAG,KAAK,GAAG,MAAM,GAAG,KAAK,CAAC;AAEzD,gDAAgD;AAChD,MAAM,WAAW,IAAI;IACnB,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;CACX;AAED,sDAAsD;AACtD,MAAM,WAAW,IAAI;IACnB,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;CACX;AAID;;;;GAIG;AACH,wBAAgB,QAAQ,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,EAAE,GAAG,GAAG;IAAE,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CAAE,CAmB9E;AAED,yDAAyD;AACzD,wBAAgB,QAAQ,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,EAAE;IAAE,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CAAE,GAAG,GAAG,CAiB9E;AAED,oDAAoD;AACpD,wBAAgB,UAAU,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,CAG3C;AAED,oDAAoD;AACpD,wBAAgB,UAAU,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,CAG3C;AAQD;;;;;;;GAOG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI,CAuD3D;AAYD;;;;;;GAMG;AACH,wBAAgB,WAAW,CAAC,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,WAAW,GAAG,MAAM,CAqBnE"}

package/dist/ui/color-input/color-model.js

@@ -0,0 +1,145 @@
+import { hslToRgb, rgbToHsl, rgbToHex } from "../../lib/contrast.js";
+const clamp = (n, min, max) => Math.min(max, Math.max(min, n));
+function rgbToHsv({ r, g, b }) {
+  const rn = r / 255;
+  const gn = g / 255;
+  const bn = b / 255;
+  const max = Math.max(rn, gn, bn);
+  const min = Math.min(rn, gn, bn);
+  const d = max - min;
+  let h = 0;
+  if (d !== 0) {
+    switch (max) {
+      case rn:
+        h = (gn - bn) / d % 6;
+        break;
+      case gn:
+        h = (bn - rn) / d + 2;
+        break;
+      default:
+        h = (rn - gn) / d + 4;
+        break;
+    }
+    h *= 60;
+    if (h < 0) h += 360;
+  }
+  const s = max === 0 ? 0 : d / max;
+  return { h, s: s * 100, v: max * 100 };
+}
+function hsvToRgb({ h, s, v }) {
+  const sn = clamp(s, 0, 100) / 100;
+  const vn = clamp(v, 0, 100) / 100;
+  const c = vn * sn;
+  const hp = (h % 360 + 360) % 360 / 60;
+  const x = c * (1 - Math.abs(hp % 2 - 1));
+  let r = 0;
+  let g = 0;
+  let b = 0;
+  if (hp < 1) [r, g, b] = [c, x, 0];
+  else if (hp < 2) [r, g, b] = [x, c, 0];
+  else if (hp < 3) [r, g, b] = [0, c, x];
+  else if (hp < 4) [r, g, b] = [0, x, c];
+  else if (hp < 5) [r, g, b] = [x, 0, c];
+  else [r, g, b] = [c, 0, x];
+  const m = vn - c;
+  return { r: (r + m) * 255, g: (g + m) * 255, b: (b + m) * 255 };
+}
+function rgbaToHsva(rgba) {
+  const { h, s, v } = rgbToHsv(rgba);
+  return { h, s, v, a: rgba.a };
+}
+function hsvaToRgba(hsva) {
+  const { r, g, b } = hsvToRgb(hsva);
+  return { r, g, b, a: hsva.a };
+}
+function parseAlpha(token) {
+  const n = token.endsWith("%") ? parseFloat(token) / 100 : parseFloat(token);
+  return Number.isNaN(n) ? 1 : clamp(n, 0, 1);
+}
+function parseColorString(input) {
+  const v = input.trim();
+  const hex = v.match(/^#([0-9a-f]{3,8})$/i);
+  if (hex) {
+    const h = hex[1];
+    if (h.length === 3 || h.length === 4) {
+      return {
+        r: parseInt(h[0] + h[0], 16),
+        g: parseInt(h[1] + h[1], 16),
+        b: parseInt(h[2] + h[2], 16),
+        a: h.length === 4 ? parseInt(h[3] + h[3], 16) / 255 : 1
+      };
+    }
+    if (h.length === 6 || h.length === 8) {
+      return {
+        r: parseInt(h.slice(0, 2), 16),
+        g: parseInt(h.slice(2, 4), 16),
+        b: parseInt(h.slice(4, 6), 16),
+        a: h.length === 8 ? parseInt(h.slice(6, 8), 16) / 255 : 1
+      };
+    }
+    return null;
+  }
+  const rgb = v.match(/^rgba?\(([^)]+)\)$/i);
+  if (rgb) {
+    const parts = rgb[1].split(/[\s,/]+/).filter(Boolean);
+    if (parts.length < 3) return null;
+    const channels = parts.slice(0, 3).map(
+      (p) => p.endsWith("%") ? Math.round(parseFloat(p) * 255 / 100) : Math.round(parseFloat(p))
+    );
+    if (channels.some((n) => Number.isNaN(n))) return null;
+    const [r, g, b] = channels;
+    return { r, g, b, a: parts[3] !== void 0 ? parseAlpha(parts[3]) : 1 };
+  }
+  const hsl = v.match(/^hsla?\(([^)]+)\)$/i);
+  if (hsl) {
+    const parts = hsl[1].split(/[\s,/]+/).filter(Boolean);
+    if (parts.length < 3) return null;
+    const h = parseFloat(parts[0]);
+    const s = parseFloat(parts[1]);
+    const l = parseFloat(parts[2]);
+    if ([h, s, l].some((n) => Number.isNaN(n))) return null;
+    const { r, g, b } = hslToRgb({ h, s, l });
+    return {
+      r: Math.round(r),
+      g: Math.round(g),
+      b: Math.round(b),
+      a: parts[3] !== void 0 ? parseAlpha(parts[3]) : 1
+    };
+  }
+  return null;
+}
+function formatAlpha(a) {
+  return String(Math.round(clamp(a, 0, 1) * 100) / 100);
+}
+function hexByte(n) {
+  return clamp(Math.round(n), 0, 255).toString(16).padStart(2, "0");
+}
+function formatColor(rgba, format) {
+  const r = clamp(Math.round(rgba.r), 0, 255);
+  const g = clamp(Math.round(rgba.g), 0, 255);
+  const b = clamp(Math.round(rgba.b), 0, 255);
+  switch (format) {
+    case "hex":
+      return rgba.a < 1 ? `${rgbToHex({ r, g, b })}${hexByte(rgba.a * 255)}` : rgbToHex({ r, g, b });
+    case "rgb":
+      return `rgb(${r}, ${g}, ${b})`;
+    case "rgba":
+      return `rgba(${r}, ${g}, ${b}, ${formatAlpha(rgba.a)})`;
+    case "hsl": {
+      const { h, s, l } = rgbToHsl({ r, g, b });
+      const hr = Math.round(h);
+      const sr = Math.round(s);
+      const lr = Math.round(l);
+      return rgba.a < 1 ? `hsla(${hr}, ${sr}%, ${lr}%, ${formatAlpha(rgba.a)})` : `hsl(${hr}, ${sr}%, ${lr}%)`;
+    }
+  }
+}
+export {
+  formatColor,
+  hsvToRgb,
+  hsvaToRgba,
+  parseColorString,
+  rgbToHsv,
+  rgbaToHsva
+};
+//# sourceMappingURL=color-model.js.map

package/dist/ui/color-input/color-model.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/ui/color-input/color-model.ts"],"sourcesContent":["import { hslToRgb, rgbToHsl, rgbToHex, type RGB } from '@/lib/contrast';\n\n/**\n * Color model for ColorInput. Adds the pieces `@/lib/contrast` doesn't cover:\n * an alpha channel (`RGBA`), the HSV color space (`HSVA` — the natural model\n * for a 2D saturation/value picker), a permissive multi-syntax parser\n * (`parseColorString`) and a format-directed serializer (`formatColor`).\n * Everything hue/lightness related delegates to the shared `contrast` helpers\n * so there's one source of truth for the math.\n */\n\n/** The output/representation formats ColorInput understands. */\nexport type ColorFormat = 'hex' | 'rgb' | 'rgba' | 'hsl';\n\n/** Red/green/blue channels 0–255, alpha 0–1. */\nexport interface RGBA {\n  r: number;\n  g: number;\n  b: number;\n  a: number;\n}\n\n/** Hue 0–360, saturation & value 0–100, alpha 0–1. */\nexport interface HSVA {\n  h: number;\n  s: number;\n  v: number;\n  a: number;\n}\n\nconst clamp = (n: number, min: number, max: number): number => Math.min(max, Math.max(min, n));\n\n/**\n * RGB → HSV. Hue matches the HSL convention (so it lines up with the shared\n * hue slider), but saturation/value use the HSV formulas — that's what a\n * rectangular saturation/brightness area needs.\n */\nexport function rgbToHsv({ r, g, b }: RGB): { h: number; s: number; v: number } {\n  const rn = r / 255;\n  const gn = g / 255;\n  const bn = b / 255;\n  const max = Math.max(rn, gn, bn);\n  const min = Math.min(rn, gn, bn);\n  const d = max - min;\n  let h = 0;\n  if (d !== 0) {\n    switch (max) {\n      case rn: h = ((gn - bn) / d) % 6; break;\n      case gn: h = (bn - rn) / d + 2; break;\n      default: h = (rn - gn) / d + 4; break;\n    }\n    h *= 60;\n    if (h < 0) h += 360;\n  }\n  const s = max === 0 ? 0 : d / max;\n  return { h, s: s * 100, v: max * 100 };\n}\n\n/** HSV → RGB (channels 0–255). Inverse of `rgbToHsv`. */\nexport function hsvToRgb({ h, s, v }: { h: number; s: number; v: number }): RGB {\n  const sn = clamp(s, 0, 100) / 100;\n  const vn = clamp(v, 0, 100) / 100;\n  const c = vn * sn;\n  const hp = ((((h % 360) + 360) % 360)) / 60;\n  const x = c * (1 - Math.abs((hp % 2) - 1));\n  let r = 0;\n  let g = 0;\n  let b = 0;\n  if (hp < 1) [r, g, b] = [c, x, 0];\n  else if (hp < 2) [r, g, b] = [x, c, 0];\n  else if (hp < 3) [r, g, b] = [0, c, x];\n  else if (hp < 4) [r, g, b] = [0, x, c];\n  else if (hp < 5) [r, g, b] = [x, 0, c];\n  else [r, g, b] = [c, 0, x];\n  const m = vn - c;\n  return { r: (r + m) * 255, g: (g + m) * 255, b: (b + m) * 255 };\n}\n\n/** Combine `rgbToHsv` with an alpha passthrough. */\nexport function rgbaToHsva(rgba: RGBA): HSVA {\n  const { h, s, v } = rgbToHsv(rgba);\n  return { h, s, v, a: rgba.a };\n}\n\n/** Combine `hsvToRgb` with an alpha passthrough. */\nexport function hsvaToRgba(hsva: HSVA): RGBA {\n  const { r, g, b } = hsvToRgb(hsva);\n  return { r, g, b, a: hsva.a };\n}\n\n/** Parse an alpha token — `\"0.5\"` or `\"50%\"` — into a clamped 0–1 number. */\nfunction parseAlpha(token: string): number {\n  const n = token.endsWith('%') ? parseFloat(token) / 100 : parseFloat(token);\n  return Number.isNaN(n) ? 1 : clamp(n, 0, 1);\n}\n\n/**\n * Parse any of the supported color syntaxes into `RGBA`, or `null` when the\n * string isn't a recognizable color. Handles:\n *   - hex: `#rgb`, `#rgba`, `#rrggbb`, `#rrggbbaa` (alpha from the 4/8-digit forms)\n *   - `rgb()` / `rgba()` — channels as 0–255 or `%`, optional 4th alpha component\n *   - `hsl()` / `hsla()` — converted through the shared `hslToRgb`\n * Comma- and space/slash-separated argument lists are both accepted.\n */\nexport function parseColorString(input: string): RGBA | null {\n  const v = input.trim();\n\n  const hex = v.match(/^#([0-9a-f]{3,8})$/i);\n  if (hex) {\n    const h = hex[1];\n    if (h.length === 3 || h.length === 4) {\n      return {\n        r: parseInt(h[0] + h[0], 16),\n        g: parseInt(h[1] + h[1], 16),\n        b: parseInt(h[2] + h[2], 16),\n        a: h.length === 4 ? parseInt(h[3] + h[3], 16) / 255 : 1,\n      };\n    }\n    if (h.length === 6 || h.length === 8) {\n      return {\n        r: parseInt(h.slice(0, 2), 16),\n        g: parseInt(h.slice(2, 4), 16),\n        b: parseInt(h.slice(4, 6), 16),\n        a: h.length === 8 ? parseInt(h.slice(6, 8), 16) / 255 : 1,\n      };\n    }\n    return null;\n  }\n\n  const rgb = v.match(/^rgba?\\(([^)]+)\\)$/i);\n  if (rgb) {\n    const parts = rgb[1].split(/[\\s,/]+/).filter(Boolean);\n    if (parts.length < 3) return null;\n    const channels = parts.slice(0, 3).map((p) =>\n      p.endsWith('%') ? Math.round((parseFloat(p) * 255) / 100) : Math.round(parseFloat(p)),\n    );\n    if (channels.some((n) => Number.isNaN(n))) return null;\n    const [r, g, b] = channels;\n    return { r, g, b, a: parts[3] !== undefined ? parseAlpha(parts[3]) : 1 };\n  }\n\n  const hsl = v.match(/^hsla?\\(([^)]+)\\)$/i);\n  if (hsl) {\n    const parts = hsl[1].split(/[\\s,/]+/).filter(Boolean);\n    if (parts.length < 3) return null;\n    const h = parseFloat(parts[0]);\n    const s = parseFloat(parts[1]);\n    const l = parseFloat(parts[2]);\n    if ([h, s, l].some((n) => Number.isNaN(n))) return null;\n    const { r, g, b } = hslToRgb({ h, s, l });\n    return {\n      r: Math.round(r),\n      g: Math.round(g),\n      b: Math.round(b),\n      a: parts[3] !== undefined ? parseAlpha(parts[3]) : 1,\n    };\n  }\n\n  return null;\n}\n\n/** Serialize an alpha value with up to 2 decimals and no trailing zeros. */\nfunction formatAlpha(a: number): string {\n  return String(Math.round(clamp(a, 0, 1) * 100) / 100);\n}\n\n/** Serialize a single channel as a two-digit lowercase hex byte. */\nfunction hexByte(n: number): string {\n  return clamp(Math.round(n), 0, 255).toString(16).padStart(2, '0');\n}\n\n/**\n * Serialize `RGBA` into the requested format:\n *   - `hex`  → `#rrggbb`, or `#rrggbbaa` when `a < 1`\n *   - `rgb`  → `rgb(r, g, b)` (alpha dropped)\n *   - `rgba` → `rgba(r, g, b, a)`\n *   - `hsl`  → `hsl(h, s%, l%)`, or `hsla(h, s%, l%, a)` when `a < 1`\n */\nexport function formatColor(rgba: RGBA, format: ColorFormat): string {\n  const r = clamp(Math.round(rgba.r), 0, 255);\n  const g = clamp(Math.round(rgba.g), 0, 255);\n  const b = clamp(Math.round(rgba.b), 0, 255);\n  switch (format) {\n    case 'hex':\n      return rgba.a < 1 ? `${rgbToHex({ r, g, b })}${hexByte(rgba.a * 255)}` : rgbToHex({ r, g, b });\n    case 'rgb':\n      return `rgb(${r}, ${g}, ${b})`;\n    case 'rgba':\n      return `rgba(${r}, ${g}, ${b}, ${formatAlpha(rgba.a)})`;\n    case 'hsl': {\n      const { h, s, l } = rgbToHsl({ r, g, b });\n      const hr = Math.round(h);\n      const sr = Math.round(s);\n      const lr = Math.round(l);\n      return rgba.a < 1\n        ? `hsla(${hr}, ${sr}%, ${lr}%, ${formatAlpha(rgba.a)})`\n        : `hsl(${hr}, ${sr}%, ${lr}%)`;\n    }\n  }\n}\n"],"mappings":"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","names":[]}

package/dist/ui/color-input/index.cjs

@@ -0,0 +1,23 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var color_input_exports = {};
+module.exports = __toCommonJS(color_input_exports);
+__reExport(color_input_exports, require("./color-input.cjs"), module.exports);
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  ...require("./color-input.cjs")
+});
+//# sourceMappingURL=index.cjs.map

package/dist/ui/color-input/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/ui/color-input/index.ts"],"sourcesContent":["export * from './color-input';\n"],"mappings":";;;;;;;;;;;;;;;AAAA;AAAA;AAAA,gCAAc,0BAAd;","names":[]}

package/dist/ui/color-input/index.d.ts

@@ -0,0 +1,2 @@
+export * from './color-input.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/ui/color-input/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/color-input/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC"}

package/dist/ui/color-input/index.js

@@ -0,0 +1,2 @@
+export * from "./color-input.js";
+//# sourceMappingURL=index.js.map

package/dist/ui/color-input/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/ui/color-input/index.ts"],"sourcesContent":["export * from './color-input';\n"],"mappings":"AAAA,cAAc;","names":[]}

package/dist/ui/component-row/component-row-preview.cjs

@@ -0,0 +1,92 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var component_row_preview_exports = {};
+__export(component_row_preview_exports, {
+  ComponentRowPreview: () => ComponentRowPreview
+});
+module.exports = __toCommonJS(component_row_preview_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_ui = require("../../ui/index.cjs");
+const ROWS = [
+  {
+    name: "Practice Type",
+    type: "Predefined Options",
+    glyph: "list",
+    chevron: true,
+    iconBg: "color-mix(in srgb, var(--color-highlight-cool) 20%, transparent)",
+    iconColor: "var(--color-on-highlight-cool)"
+  },
+  {
+    name: "Practice Name",
+    type: "Text",
+    glyph: "square",
+    chevron: false,
+    iconBg: "color-mix(in srgb, var(--color-accent-light) 24%, transparent)",
+    iconColor: "var(--color-accent-bold)"
+  },
+  {
+    name: "Number of Operatories",
+    type: "Number",
+    glyph: "grid",
+    chevron: false,
+    iconBg: "color-mix(in srgb, var(--color-highlight-warm) 28%, transparent)",
+    iconColor: "var(--color-on-highlight-warm)"
+  }
+];
+function ComponentRowPreview({ styles }) {
+  const vars = {
+    "--uxm-component-row-padding-x": `${styles.paddingX}px`,
+    "--uxm-component-row-padding-y": `${styles.paddingY}px`,
+    "--uxm-component-row-gap": `${styles.gap}px`,
+    "--uxm-component-row-drag-color": styles.dragColor,
+    "--uxm-component-row-drag-hover-color": styles.dragHoverColor,
+    "--uxm-component-row-icon-badge-size": `${styles.iconBadgeSize}px`,
+    "--uxm-component-row-icon-badge-radius": `${styles.iconBadgeRadius}px`,
+    "--uxm-component-row-icon-badge-padding": `${styles.iconBadgePadding}px`,
+    "--uxm-component-row-name-color": styles.nameColor,
+    "--uxm-component-row-name-size": `${styles.nameSize}px`,
+    "--uxm-component-row-name-weight": styles.nameWeight,
+    "--uxm-component-row-type-label-color": styles.typeLabelColor,
+    "--uxm-component-row-type-label-size": `${styles.typeLabelSize}px`,
+    "--uxm-component-row-type-label-weight": styles.typeLabelWeight,
+    "--uxm-component-row-chevron-color": styles.chevronColor,
+    "--uxm-component-row-chevron-size": `${styles.chevronSize}px`,
+    "--uxm-component-row-row-hover-bg": styles.rowHoverBg,
+    "--uxm-component-row-row-hover-radius": `${styles.rowHoverRadius}px`
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { display: "flex", flexDirection: "column", gap: 4, width: 480 }, children: ROWS.map((r) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_ui.ComponentRow,
+    {
+      style: vars,
+      icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ui.Icon, { glyph: r.glyph, size: 14 }),
+      name: r.name,
+      type: r.type,
+      chevron: r.chevron,
+      iconBg: r.iconBg,
+      iconColor: r.iconColor,
+      dragHandle: true
+    },
+    r.name
+  )) });
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  ComponentRowPreview
+});
+//# sourceMappingURL=component-row-preview.cjs.map

package/dist/ui/component-row/component-row-preview.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/ui/component-row/component-row-preview.tsx"],"sourcesContent":["import type { PreviewProps } from '@/previews/types';\nimport { ComponentRow, Icon } from '@/ui';\n\nimport type { CSSProperties } from 'react';\n\n/**\n * Preview renders the real shipped `<ComponentRow>` atom, projecting each\n * registry knob onto its `--uxm-component-row-*` custom property. Badge tints\n * come from the per-type visual dictionary at runtime in MODO; sample tints\n * are used here for the editor canvas.\n */\nconst ROWS = [\n  {\n    name: 'Practice Type',\n    type: 'Predefined Options',\n    glyph: 'list',\n    chevron: true,\n    iconBg: 'color-mix(in srgb, var(--color-highlight-cool) 20%, transparent)',\n    iconColor: 'var(--color-on-highlight-cool)',\n  },\n  {\n    name: 'Practice Name',\n    type: 'Text',\n    glyph: 'square',\n    chevron: false,\n    iconBg: 'color-mix(in srgb, var(--color-accent-light) 24%, transparent)',\n    iconColor: 'var(--color-accent-bold)',\n  },\n  {\n    name: 'Number of Operatories',\n    type: 'Number',\n    glyph: 'grid',\n    chevron: false,\n    iconBg: 'color-mix(in srgb, var(--color-highlight-warm) 28%, transparent)',\n    iconColor: 'var(--color-on-highlight-warm)',\n  },\n];\n\nexport function ComponentRowPreview({ styles }: PreviewProps) {\n  const vars = {\n    '--uxm-component-row-padding-x': `${styles.paddingX}px`,\n    '--uxm-component-row-padding-y': `${styles.paddingY}px`,\n    '--uxm-component-row-gap': `${styles.gap}px`,\n    '--uxm-component-row-drag-color': styles.dragColor,\n    '--uxm-component-row-drag-hover-color': styles.dragHoverColor,\n    '--uxm-component-row-icon-badge-size': `${styles.iconBadgeSize}px`,\n    '--uxm-component-row-icon-badge-radius': `${styles.iconBadgeRadius}px`,\n    '--uxm-component-row-icon-badge-padding': `${styles.iconBadgePadding}px`,\n    '--uxm-component-row-name-color': styles.nameColor,\n    '--uxm-component-row-name-size': `${styles.nameSize}px`,\n    '--uxm-component-row-name-weight': styles.nameWeight,\n    '--uxm-component-row-type-label-color': styles.typeLabelColor,\n    '--uxm-component-row-type-label-size': `${styles.typeLabelSize}px`,\n    '--uxm-component-row-type-label-weight': styles.typeLabelWeight,\n    '--uxm-component-row-chevron-color': styles.chevronColor,\n    '--uxm-component-row-chevron-size': `${styles.chevronSize}px`,\n    '--uxm-component-row-row-hover-bg': styles.rowHoverBg,\n    '--uxm-component-row-row-hover-radius': `${styles.rowHoverRadius}px`,\n  } as CSSProperties;\n\n  return (\n    <div style={{ display: 'flex', flexDirection: 'column', gap: 4, width: 480 }}>\n      {ROWS.map((r) => (\n        <ComponentRow\n          key={r.name}\n          style={vars}\n          icon={<Icon glyph={r.glyph} size={14} />}\n          name={r.name}\n          type={r.type}\n          chevron={r.chevron}\n          iconBg={r.iconBg}\n          iconColor={r.iconColor}\n          dragHandle\n        />\n      ))}\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAkEgB;AAjEhB,gBAAmC;AAUnC,MAAM,OAAO;AAAA,EACX;AAAA,IACE,MAAM;AAAA,IACN,MAAM;AAAA,IACN,OAAO;AAAA,IACP,SAAS;AAAA,IACT,QAAQ;AAAA,IACR,WAAW;AAAA,EACb;AAAA,EACA;AAAA,IACE,MAAM;AAAA,IACN,MAAM;AAAA,IACN,OAAO;AAAA,IACP,SAAS;AAAA,IACT,QAAQ;AAAA,IACR,WAAW;AAAA,EACb;AAAA,EACA;AAAA,IACE,MAAM;AAAA,IACN,MAAM;AAAA,IACN,OAAO;AAAA,IACP,SAAS;AAAA,IACT,QAAQ;AAAA,IACR,WAAW;AAAA,EACb;AACF;AAEO,SAAS,oBAAoB,EAAE,OAAO,GAAiB;AAC5D,QAAM,OAAO;AAAA,IACX,iCAAiC,GAAG,OAAO,QAAQ;AAAA,IACnD,iCAAiC,GAAG,OAAO,QAAQ;AAAA,IACnD,2BAA2B,GAAG,OAAO,GAAG;AAAA,IACxC,kCAAkC,OAAO;AAAA,IACzC,wCAAwC,OAAO;AAAA,IAC/C,uCAAuC,GAAG,OAAO,aAAa;AAAA,IAC9D,yCAAyC,GAAG,OAAO,eAAe;AAAA,IAClE,0CAA0C,GAAG,OAAO,gBAAgB;AAAA,IACpE,kCAAkC,OAAO;AAAA,IACzC,iCAAiC,GAAG,OAAO,QAAQ;AAAA,IACnD,mCAAmC,OAAO;AAAA,IAC1C,wCAAwC,OAAO;AAAA,IAC/C,uCAAuC,GAAG,OAAO,aAAa;AAAA,IAC9D,yCAAyC,OAAO;AAAA,IAChD,qCAAqC,OAAO;AAAA,IAC5C,oCAAoC,GAAG,OAAO,WAAW;AAAA,IACzD,oCAAoC,OAAO;AAAA,IAC3C,wCAAwC,GAAG,OAAO,cAAc;AAAA,EAClE;AAEA,SACE,4CAAC,SAAI,OAAO,EAAE,SAAS,QAAQ,eAAe,UAAU,KAAK,GAAG,OAAO,IAAI,GACxE,eAAK,IAAI,CAAC,MACT;AAAA,IAAC;AAAA;AAAA,MAEC,OAAO;AAAA,MACP,MAAM,4CAAC,kBAAK,OAAO,EAAE,OAAO,MAAM,IAAI;AAAA,MACtC,MAAM,EAAE;AAAA,MACR,MAAM,EAAE;AAAA,MACR,SAAS,EAAE;AAAA,MACX,QAAQ,EAAE;AAAA,MACV,WAAW,EAAE;AAAA,MACb,YAAU;AAAA;AAAA,IARL,EAAE;AAAA,EAST,CACD,GACH;AAEJ;","names":[]}

package/dist/ui/component-row/component-row-preview.d.ts

@@ -0,0 +1,3 @@
+import type { PreviewProps } from '../../previews/types.js';
+export declare function ComponentRowPreview({ styles }: PreviewProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=component-row-preview.d.ts.map

package/dist/ui/component-row/component-row-preview.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"component-row-preview.d.ts","sourceRoot":"","sources":["../../../src/ui/component-row/component-row-preview.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAsCrD,wBAAgB,mBAAmB,CAAC,EAAE,MAAM,EAAE,EAAE,YAAY,2CAuC3D"}