@open-mercato/core 0.8.1-develop.7296.1.2111d779db → 0.8.1-develop.7441.1.b42958b98c

package/dist/modules/forms/backend/forms/[id]/studio/palette/FormAppearancePanel.js

@@ -0,0 +1,493 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { useT } from "@open-mercato/shared/lib/i18n/context";
+import { cn } from "@open-mercato/shared/lib/utils";
+import { Button } from "@open-mercato/ui/primitives/button";
+import { useConfirmDialog } from "@open-mercato/ui/backend/confirm-dialog";
+import { apiCall } from "@open-mercato/ui/backend/utils/apiCall";
+import { useGuardedMutation } from "@open-mercato/ui/backend/injection/useGuardedMutation";
+import { Label } from "@open-mercato/ui/primitives/label";
+import { buildLogoSrc } from "../../../../../ui/public/style/LogoHeader.js";
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue
+} from "@open-mercato/ui/primitives/select";
+import { ColorControl } from "../style/ColorControl.js";
+import { BackgroundControl } from "../style/BackgroundControl.js";
+import { FORM_THEME_PRESETS } from "../style/presets.js";
+import { belowAaForPair } from "../style/contrast.js";
+const LOGO_SIZES = [
+  { value: "sm", fallback: "Small" },
+  { value: "md", fallback: "Medium" },
+  { value: "lg", fallback: "Large" }
+];
+const LOGO_ALIGNS = [
+  { value: "start", fallback: "Start" },
+  { value: "center", fallback: "Center" },
+  { value: "end", fallback: "End" }
+];
+const TOKEN_PREVIEW_CSS = {
+  surface: "var(--card)",
+  "surface-muted": "var(--muted)",
+  foreground: "var(--foreground)",
+  "muted-foreground": "var(--muted-foreground)",
+  accent: "var(--primary)",
+  border: "var(--border)",
+  transparent: "transparent",
+  inherit: "transparent"
+};
+function colorToPreviewCss(color) {
+  if (typeof color !== "string" || color.length === 0) return "transparent";
+  if (color.startsWith("#")) return color;
+  return TOKEN_PREVIEW_CSS[color] ?? "transparent";
+}
+function backgroundToPreviewCss(background) {
+  if (!background || background.kind === "none") return null;
+  if (background.kind === "color") return colorToPreviewCss(background.color);
+  return `linear-gradient(${background.angle}deg, ${background.from}, ${background.to})`;
+}
+function canonicalize(value) {
+  if (Array.isArray(value)) return value.map(canonicalize);
+  if (value && typeof value === "object") {
+    const out = {};
+    const keys = Object.keys(value);
+    for (const key of keys.sort((a, b) => a < b ? -1 : a > b ? 1 : 0)) {
+      out[key] = canonicalize(value[key]);
+    }
+    return out;
+  }
+  return value;
+}
+function themesEqual(a, b) {
+  return JSON.stringify(canonicalize(a ?? {})) === JSON.stringify(canonicalize(b ?? {}));
+}
+const FONT_FAMILIES = [
+  { value: "system", fallback: "System" },
+  { value: "sans", fallback: "Sans" },
+  { value: "serif", fallback: "Serif" },
+  { value: "mono", fallback: "Mono" },
+  { value: "rounded", fallback: "Rounded" }
+];
+const FONT_SCALES = [
+  { value: "sm", fallback: "Small" },
+  { value: "md", fallback: "Medium" },
+  { value: "lg", fallback: "Large" }
+];
+const LABEL_WEIGHTS = [
+  { value: "normal", fallback: "Normal" },
+  { value: "medium", fallback: "Medium" },
+  { value: "semibold", fallback: "Semibold" },
+  { value: "bold", fallback: "Bold" }
+];
+const RADIUS_SCALES = [
+  { value: "none", fallback: "None" },
+  { value: "sm", fallback: "Small" },
+  { value: "md", fallback: "Medium" },
+  { value: "lg", fallback: "Large" },
+  { value: "full", fallback: "Full" }
+];
+const CONTENT_WIDTHS = [
+  { value: "sm", fallback: "Narrow" },
+  { value: "md", fallback: "Medium" },
+  { value: "lg", fallback: "Wide" },
+  { value: "full", fallback: "Full" }
+];
+const NONE_VALUE = "__none__";
+function FormAppearancePanel({ formId, theme, onThemeChange }) {
+  const t = useT();
+  const { confirm, ConfirmDialogElement } = useConfirmDialog();
+  const { runMutation } = useGuardedMutation({ contextId: "forms.form.theme-logo" });
+  const hasTheme = !!theme && Object.keys(theme).length > 0;
+  const fileInputRef = React.useRef(null);
+  const [isLoading, setIsLoading] = React.useState(false);
+  const [logoError, setLogoError] = React.useState(null);
+  const patch = React.useCallback(
+    (next) => {
+      const merged = { ...theme ?? {}, ...next };
+      for (const key of Object.keys(merged)) {
+        if (merged[key] === void 0) delete merged[key];
+      }
+      onThemeChange(Object.keys(merged).length === 0 ? void 0 : merged);
+    },
+    [theme, onThemeChange]
+  );
+  const applyPreset = React.useCallback(
+    async (presetId) => {
+      const preset = FORM_THEME_PRESETS.find((entry) => entry.id === presetId);
+      if (!preset) return;
+      const target = { ...preset.theme };
+      if (themesEqual(theme, target)) return;
+      if (hasTheme) {
+        const ok = await confirm({
+          title: t("forms.studio.style.preset.confirm.title", "Replace current styling?"),
+          text: t(
+            "forms.studio.style.preset.confirm.body",
+            "Applying a preset overwrites the current colors, background, and typography for this form."
+          ),
+          confirmText: t("forms.studio.style.preset.confirm.submit", "Apply preset")
+        });
+        if (!ok) return;
+      }
+      onThemeChange(target);
+    },
+    [confirm, hasTheme, onThemeChange, t, theme]
+  );
+  const resetStyling = React.useCallback(async () => {
+    if (!hasTheme) return;
+    const ok = await confirm({
+      title: t("forms.studio.style.reset.confirm.title", "Reset styling?"),
+      text: t(
+        "forms.studio.style.reset.confirm.body",
+        "This clears all custom colors, background, and typography. The form returns to the default theme."
+      ),
+      confirmText: t("forms.studio.style.reset.confirm.submit", "Reset styling"),
+      variant: "destructive"
+    });
+    if (!ok) return;
+    onThemeChange(void 0);
+  }, [confirm, hasTheme, onThemeChange, t]);
+  const patchLogo = React.useCallback(
+    (next) => {
+      if (!theme?.logo) return;
+      patch({ logo: { ...theme.logo, ...next } });
+    },
+    [patch, theme]
+  );
+  const handleLogoFile = React.useCallback(
+    async (file) => {
+      if (!file) return;
+      setLogoError(null);
+      setIsLoading(true);
+      try {
+        const body = new FormData();
+        body.append("file", file);
+        const response = await runMutation({
+          operation: () => apiCall(
+            `/api/forms/${encodeURIComponent(formId)}/theme-logo`,
+            { method: "POST", body }
+          ),
+          context: { formId },
+          mutationPayload: { formId }
+        });
+        if (!response.ok || !response.result?.assetId) {
+          setLogoError(t("forms.studio.style.logo.error", "Could not upload that image."));
+          return;
+        }
+        patch({ logo: { ...theme?.logo ?? {}, assetId: response.result.assetId } });
+      } catch {
+        setLogoError(t("forms.studio.style.logo.error", "Could not upload that image."));
+      } finally {
+        setIsLoading(false);
+      }
+    },
+    [formId, patch, runMutation, t, theme]
+  );
+  const contrastIssues = React.useMemo(() => {
+    const issues = [];
+    if (belowAaForPair(theme?.foreground, theme?.surface) !== null) {
+      issues.push(t("forms.studio.style.a11y.textOnSurface", "Text on surface"));
+    }
+    if (belowAaForPair(theme?.inputText, theme?.surface) !== null) {
+      issues.push(t("forms.studio.style.a11y.inputOnSurface", "Input text on surface"));
+    }
+    if (belowAaForPair(theme?.accent, theme?.surface) !== null) {
+      issues.push(t("forms.studio.style.a11y.accentOnSurface", "Accent on surface"));
+    }
+    return issues;
+  }, [theme, t]);
+  const renderEnumSelect = (id, label, current, options, labelKeyPrefix, onPick) => /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+    /* @__PURE__ */ jsx(Label, { htmlFor: id, className: "block text-xs font-medium text-foreground", children: label }),
+    /* @__PURE__ */ jsxs(
+      Select,
+      {
+        value: current ?? NONE_VALUE,
+        onValueChange: (next) => onPick(next === NONE_VALUE ? void 0 : next),
+        children: [
+          /* @__PURE__ */ jsx(SelectTrigger, { id, className: "h-8", children: /* @__PURE__ */ jsx(SelectValue, {}) }),
+          /* @__PURE__ */ jsxs(SelectContent, { children: [
+            /* @__PURE__ */ jsx(SelectItem, { value: NONE_VALUE, children: t("forms.studio.style.inherit", "Default") }),
+            options.map((option) => /* @__PURE__ */ jsx(SelectItem, { value: option.value, children: t(`${labelKeyPrefix}.${option.value}`, option.fallback) }, option.value))
+          ] })
+        ]
+      }
+    )
+  ] });
+  return /* @__PURE__ */ jsxs("div", { className: "space-y-3 border-t border-border pt-3", children: [
+    /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+      /* @__PURE__ */ jsx("h3", { className: "text-xs font-semibold uppercase tracking-wide text-muted-foreground", children: t("forms.studio.style.appearance.title", "Appearance") }),
+      /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: t("forms.studio.style.appearance.helper", "Brand colors, background, and typography for this form.") })
+    ] }),
+    contrastIssues.length > 0 ? /* @__PURE__ */ jsxs("div", { className: "rounded-md border border-status-warning-border bg-status-warning-bg p-2", role: "status", children: [
+      /* @__PURE__ */ jsx("p", { className: "text-xs font-medium text-status-warning-text", children: t("forms.studio.style.a11y.title", "Low contrast") }),
+      /* @__PURE__ */ jsx("ul", { className: "mt-1 list-disc pl-4 text-xs text-status-warning-text", children: contrastIssues.map((issue) => /* @__PURE__ */ jsx("li", { children: issue }, issue)) })
+    ] }) : null,
+    /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+        /* @__PURE__ */ jsx("span", { className: "block text-sm font-medium text-foreground", children: t("forms.studio.style.preset.label", "Preset") }),
+        hasTheme ? /* @__PURE__ */ jsx(
+          Button,
+          {
+            type: "button",
+            variant: "ghost",
+            size: "2xs",
+            className: "text-muted-foreground",
+            onClick: () => {
+              void resetStyling();
+            },
+            children: t("forms.studio.style.reset.label", "Reset")
+          }
+        ) : null
+      ] }),
+      /* @__PURE__ */ jsx("div", { className: "grid grid-cols-2 gap-2", children: FORM_THEME_PRESETS.map((preset) => {
+        const active = themesEqual(theme, preset.theme);
+        const bg = backgroundToPreviewCss(preset.theme.background) ?? colorToPreviewCss(preset.theme.surface);
+        return /* @__PURE__ */ jsxs(
+          Button,
+          {
+            type: "button",
+            variant: "outline",
+            "aria-pressed": active,
+            onClick: () => {
+              void applyPreset(preset.id);
+            },
+            className: cn(
+              "h-auto justify-start gap-2 p-2 text-left hover:bg-muted/50",
+              active ? "border-primary ring-1 ring-primary" : "border-border"
+            ),
+            children: [
+              /* @__PURE__ */ jsxs(
+                "span",
+                {
+                  "aria-hidden": "true",
+                  className: "flex h-7 w-9 shrink-0 items-center justify-center gap-0.5 rounded border border-border",
+                  style: { background: bg },
+                  children: [
+                    /* @__PURE__ */ jsx(
+                      "span",
+                      {
+                        className: "h-3 w-3 rounded-full border border-border",
+                        style: { background: colorToPreviewCss(preset.theme.surface) }
+                      }
+                    ),
+                    /* @__PURE__ */ jsx(
+                      "span",
+                      {
+                        className: "h-3 w-3 rounded-full",
+                        style: { background: colorToPreviewCss(preset.theme.accent) }
+                      }
+                    )
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsx("span", { className: "truncate text-xs font-medium text-foreground", children: t(preset.displayNameKey, preset.fallbackName) })
+            ]
+          },
+          preset.id
+        );
+      }) })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
+      /* @__PURE__ */ jsx("span", { className: "block text-sm font-medium text-foreground", children: t("forms.studio.style.logo.label", "Logo") }),
+      theme?.logo ? /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 rounded-md border border-border bg-muted/30 p-2", children: [
+          /* @__PURE__ */ jsx(
+            "img",
+            {
+              src: buildLogoSrc(theme.logo.assetId),
+              alt: "",
+              className: "max-h-10 w-auto object-contain"
+            }
+          ),
+          /* @__PURE__ */ jsxs("div", { className: "ml-auto flex gap-1", children: [
+            /* @__PURE__ */ jsx(
+              Button,
+              {
+                type: "button",
+                variant: "outline",
+                size: "2xs",
+                disabled: isLoading,
+                onClick: () => fileInputRef.current?.click(),
+                children: isLoading ? t("forms.studio.style.logo.uploading", "Uploading\u2026") : t("forms.studio.style.logo.replace", "Replace")
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              Button,
+              {
+                type: "button",
+                variant: "ghost",
+                size: "2xs",
+                className: "text-status-error-text",
+                onClick: () => patch({ logo: void 0 }),
+                children: t("forms.studio.style.logo.remove", "Remove")
+              }
+            )
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-2", children: [
+          /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+            /* @__PURE__ */ jsx(Label, { htmlFor: "forms-studio-logo-size", className: "block text-xs font-medium text-muted-foreground", children: t("forms.studio.style.logo.size", "Size") }),
+            /* @__PURE__ */ jsxs(
+              Select,
+              {
+                value: theme.logo.size ?? "md",
+                onValueChange: (value) => patchLogo({ size: value }),
+                children: [
+                  /* @__PURE__ */ jsx(SelectTrigger, { id: "forms-studio-logo-size", children: /* @__PURE__ */ jsx(SelectValue, {}) }),
+                  /* @__PURE__ */ jsx(SelectContent, { children: LOGO_SIZES.map((option) => /* @__PURE__ */ jsx(SelectItem, { value: option.value, children: t(`forms.studio.style.logo.sizeOption.${option.value}`, option.fallback) }, option.value)) })
+                ]
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+            /* @__PURE__ */ jsx(Label, { htmlFor: "forms-studio-logo-align", className: "block text-xs font-medium text-muted-foreground", children: t("forms.studio.style.logo.align", "Alignment") }),
+            /* @__PURE__ */ jsxs(
+              Select,
+              {
+                value: theme.logo.align ?? "start",
+                onValueChange: (value) => patchLogo({ align: value }),
+                children: [
+                  /* @__PURE__ */ jsx(SelectTrigger, { id: "forms-studio-logo-align", children: /* @__PURE__ */ jsx(SelectValue, {}) }),
+                  /* @__PURE__ */ jsx(SelectContent, { children: LOGO_ALIGNS.map((option) => /* @__PURE__ */ jsx(SelectItem, { value: option.value, children: t(`forms.studio.style.align.${option.value}`, option.fallback) }, option.value)) })
+                ]
+              }
+            )
+          ] })
+        ] })
+      ] }) : /* @__PURE__ */ jsx(
+        Button,
+        {
+          type: "button",
+          variant: "outline",
+          size: "2xs",
+          disabled: isLoading,
+          onClick: () => fileInputRef.current?.click(),
+          children: isLoading ? t("forms.studio.style.logo.uploading", "Uploading\u2026") : t("forms.studio.style.logo.upload", "Upload logo")
+        }
+      ),
+      logoError ? /* @__PURE__ */ jsx("p", { className: "text-xs text-status-error-text", role: "alert", children: logoError }) : null,
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          ref: fileInputRef,
+          type: "file",
+          accept: "image/png,image/jpeg,image/webp,image/gif",
+          className: "hidden",
+          onChange: (event) => {
+            const file = event.target.files?.[0];
+            event.target.value = "";
+            void handleLogoFile(file ?? void 0);
+          }
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx(
+      BackgroundControl,
+      {
+        label: t("forms.studio.style.theme.background", "Background"),
+        value: theme?.background,
+        onChange: (next) => patch({ background: next })
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      ColorControl,
+      {
+        label: t("forms.studio.style.theme.surface", "Surface"),
+        value: theme?.surface,
+        onChange: (next) => patch({ surface: next })
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      ColorControl,
+      {
+        label: t("forms.studio.style.theme.foreground", "Body text"),
+        value: theme?.foreground,
+        onChange: (next) => patch({ foreground: next }),
+        contrastAgainst: theme?.surface
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      ColorControl,
+      {
+        label: t("forms.studio.style.theme.inputText", "Input text"),
+        value: theme?.inputText,
+        onChange: (next) => patch({ inputText: next }),
+        contrastAgainst: theme?.surface
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      ColorControl,
+      {
+        label: t("forms.studio.style.theme.labelColor", "Label color"),
+        value: theme?.labelColor,
+        onChange: (next) => patch({ labelColor: next }),
+        contrastAgainst: theme?.surface
+      }
+    ),
+    renderEnumSelect(
+      "forms-studio-theme-label-weight",
+      t("forms.studio.style.theme.labelWeight", "Label weight"),
+      theme?.labelWeight,
+      LABEL_WEIGHTS,
+      "forms.studio.style.weight",
+      (next) => patch({ labelWeight: next })
+    ),
+    /* @__PURE__ */ jsx(
+      ColorControl,
+      {
+        label: t("forms.studio.style.theme.accent", "Accent"),
+        value: theme?.accent,
+        onChange: (next) => patch({ accent: next }),
+        contrastAgainst: theme?.surface
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      ColorControl,
+      {
+        label: t("forms.studio.style.theme.border", "Border"),
+        value: theme?.border,
+        onChange: (next) => patch({ border: next })
+      }
+    ),
+    renderEnumSelect(
+      "forms-studio-theme-font-family",
+      t("forms.studio.style.theme.fontFamily", "Font"),
+      theme?.fontFamily,
+      FONT_FAMILIES,
+      "forms.studio.style.fontFamily",
+      (next) => patch({ fontFamily: next })
+    ),
+    renderEnumSelect(
+      "forms-studio-theme-font-scale",
+      t("forms.studio.style.theme.fontScale", "Text size"),
+      theme?.fontScale,
+      FONT_SCALES,
+      "forms.studio.style.fontScale",
+      (next) => patch({ fontScale: next })
+    ),
+    renderEnumSelect(
+      "forms-studio-theme-radius",
+      t("forms.studio.style.theme.radius", "Corner radius"),
+      theme?.radius,
+      RADIUS_SCALES,
+      "forms.studio.style.radius",
+      (next) => patch({ radius: next })
+    ),
+    renderEnumSelect(
+      "forms-studio-theme-content-width",
+      t("forms.studio.style.theme.contentWidth", "Content width"),
+      theme?.contentWidth,
+      CONTENT_WIDTHS,
+      "forms.studio.style.contentWidth",
+      (next) => patch({ contentWidth: next })
+    ),
+    ConfirmDialogElement
+  ] });
+}
+export {
+  FormAppearancePanel
+};
+//# sourceMappingURL=FormAppearancePanel.js.map

package/dist/modules/forms/backend/forms/[id]/studio/palette/FormAppearancePanel.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../../../src/modules/forms/backend/forms/%5Bid%5D/studio/palette/FormAppearancePanel.tsx"],
+  "sourcesContent": ["'use client'\n\n/**\n * Form-level Appearance panel \u2014 authors the `x-om-theme` vocabulary (spec\n * Step 6 / D4). Reads the current theme from the studio schema and emits a new\n * `OmTheme` (or `undefined` to clear) through `onThemeChange`, which the studio\n * routes into `setFormTheme(...)` on the existing autosave path. Every color\n * goes through `ColorControl` (token / hex only) and the background through\n * `BackgroundControl` (none / color / gradient) \u2014 there is no raw CSS channel.\n */\n\nimport * as React from 'react'\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\nimport { cn } from '@open-mercato/shared/lib/utils'\nimport { Button } from '@open-mercato/ui/primitives/button'\nimport { useConfirmDialog } from '@open-mercato/ui/backend/confirm-dialog'\nimport { apiCall } from '@open-mercato/ui/backend/utils/apiCall'\nimport { useGuardedMutation } from '@open-mercato/ui/backend/injection/useGuardedMutation'\nimport { Label } from '@open-mercato/ui/primitives/label'\nimport { buildLogoSrc } from '../../../../../ui/public/style/LogoHeader'\nimport {\n  Select,\n  SelectContent,\n  SelectItem,\n  SelectTrigger,\n  SelectValue,\n} from '@open-mercato/ui/primitives/select'\nimport type {\n  OmBackground,\n  OmColor,\n  OmContentWidth,\n  OmFontFamily,\n  OmFontScale,\n  OmLogoSize,\n  OmRadiusScale,\n  OmTextAlign,\n  OmTextWeight,\n  OmTheme,\n  OmThemeLogo,\n} from '../../../../../schema/style-extensions'\nimport { ColorControl } from '../style/ColorControl'\nimport { BackgroundControl } from '../style/BackgroundControl'\nimport { FORM_THEME_PRESETS } from '../style/presets'\nimport { belowAaForPair } from '../style/contrast'\n\nexport type FormAppearancePanelProps = {\n  formId: string\n  theme: OmTheme | undefined\n  onThemeChange: (next: OmTheme | undefined) => void\n}\n\nconst LOGO_SIZES: ReadonlyArray<{ value: OmLogoSize; fallback: string }> = [\n  { value: 'sm', fallback: 'Small' },\n  { value: 'md', fallback: 'Medium' },\n  { value: 'lg', fallback: 'Large' },\n]\n\nconst LOGO_ALIGNS: ReadonlyArray<{ value: OmTextAlign; fallback: string }> = [\n  { value: 'start', fallback: 'Start' },\n  { value: 'center', fallback: 'Center' },\n  { value: 'end', fallback: 'End' },\n]\n\n/** Map an `OmColor` to a CSS value for a non-interactive preview swatch only. */\nconst TOKEN_PREVIEW_CSS: Record<string, string> = {\n  surface: 'var(--card)',\n  'surface-muted': 'var(--muted)',\n  foreground: 'var(--foreground)',\n  'muted-foreground': 'var(--muted-foreground)',\n  accent: 'var(--primary)',\n  border: 'var(--border)',\n  transparent: 'transparent',\n  inherit: 'transparent',\n}\n\nfunction colorToPreviewCss(color: OmColor | undefined): string {\n  if (typeof color !== 'string' || color.length === 0) return 'transparent'\n  if (color.startsWith('#')) return color\n  return TOKEN_PREVIEW_CSS[color] ?? 'transparent'\n}\n\nfunction backgroundToPreviewCss(background: OmBackground | undefined): string | null {\n  if (!background || background.kind === 'none') return null\n  if (background.kind === 'color') return colorToPreviewCss(background.color)\n  return `linear-gradient(${background.angle}deg, ${background.from}, ${background.to})`\n}\n\n/** Order-insensitive deep compare so an applied preset can show as active. */\nfunction canonicalize(value: unknown): unknown {\n  if (Array.isArray(value)) return value.map(canonicalize)\n  if (value && typeof value === 'object') {\n    const out: Record<string, unknown> = {}\n    const keys = Object.keys(value as Record<string, unknown>)\n    for (const key of keys.sort((a, b) => (a < b ? -1 : a > b ? 1 : 0))) {\n      out[key] = canonicalize((value as Record<string, unknown>)[key])\n    }\n    return out\n  }\n  return value\n}\n\nfunction themesEqual(a: OmTheme | undefined, b: OmTheme | undefined): boolean {\n  return JSON.stringify(canonicalize(a ?? {})) === JSON.stringify(canonicalize(b ?? {}))\n}\n\nconst FONT_FAMILIES: ReadonlyArray<{ value: OmFontFamily; fallback: string }> = [\n  { value: 'system', fallback: 'System' },\n  { value: 'sans', fallback: 'Sans' },\n  { value: 'serif', fallback: 'Serif' },\n  { value: 'mono', fallback: 'Mono' },\n  { value: 'rounded', fallback: 'Rounded' },\n]\n\nconst FONT_SCALES: ReadonlyArray<{ value: OmFontScale; fallback: string }> = [\n  { value: 'sm', fallback: 'Small' },\n  { value: 'md', fallback: 'Medium' },\n  { value: 'lg', fallback: 'Large' },\n]\n\nconst LABEL_WEIGHTS: ReadonlyArray<{ value: OmTextWeight; fallback: string }> = [\n  { value: 'normal', fallback: 'Normal' },\n  { value: 'medium', fallback: 'Medium' },\n  { value: 'semibold', fallback: 'Semibold' },\n  { value: 'bold', fallback: 'Bold' },\n]\n\nconst RADIUS_SCALES: ReadonlyArray<{ value: OmRadiusScale; fallback: string }> = [\n  { value: 'none', fallback: 'None' },\n  { value: 'sm', fallback: 'Small' },\n  { value: 'md', fallback: 'Medium' },\n  { value: 'lg', fallback: 'Large' },\n  { value: 'full', fallback: 'Full' },\n]\n\nconst CONTENT_WIDTHS: ReadonlyArray<{ value: OmContentWidth; fallback: string }> = [\n  { value: 'sm', fallback: 'Narrow' },\n  { value: 'md', fallback: 'Medium' },\n  { value: 'lg', fallback: 'Wide' },\n  { value: 'full', fallback: 'Full' },\n]\n\nconst NONE_VALUE = '__none__'\n\nexport function FormAppearancePanel({ formId, theme, onThemeChange }: FormAppearancePanelProps) {\n  const t = useT()\n  const { confirm, ConfirmDialogElement } = useConfirmDialog()\n  const { runMutation } = useGuardedMutation({ contextId: 'forms.form.theme-logo' })\n  const hasTheme = !!theme && Object.keys(theme).length > 0\n  const fileInputRef = React.useRef<HTMLInputElement | null>(null)\n  const [isLoading, setIsLoading] = React.useState(false)\n  const [logoError, setLogoError] = React.useState<string | null>(null)\n\n  const patch = React.useCallback(\n    (next: Partial<OmTheme>) => {\n      const merged: OmTheme = { ...(theme ?? {}), ...next }\n      for (const key of Object.keys(merged) as Array<keyof OmTheme>) {\n        if (merged[key] === undefined) delete merged[key]\n      }\n      onThemeChange(Object.keys(merged).length === 0 ? undefined : merged)\n    },\n    [theme, onThemeChange],\n  )\n\n  const applyPreset = React.useCallback(\n    async (presetId: string) => {\n      const preset = FORM_THEME_PRESETS.find((entry) => entry.id === presetId)\n      if (!preset) return\n      const target: OmTheme = { ...preset.theme }\n      if (themesEqual(theme, target)) return\n      // Non-destructive: confirm before overwriting an existing theme.\n      if (hasTheme) {\n        const ok = await confirm({\n          title: t('forms.studio.style.preset.confirm.title', 'Replace current styling?'),\n          text: t(\n            'forms.studio.style.preset.confirm.body',\n            'Applying a preset overwrites the current colors, background, and typography for this form.',\n          ),\n          confirmText: t('forms.studio.style.preset.confirm.submit', 'Apply preset'),\n        })\n        if (!ok) return\n      }\n      onThemeChange(target)\n    },\n    [confirm, hasTheme, onThemeChange, t, theme],\n  )\n\n  const resetStyling = React.useCallback(async () => {\n    if (!hasTheme) return\n    const ok = await confirm({\n      title: t('forms.studio.style.reset.confirm.title', 'Reset styling?'),\n      text: t(\n        'forms.studio.style.reset.confirm.body',\n        'This clears all custom colors, background, and typography. The form returns to the default theme.',\n      ),\n      confirmText: t('forms.studio.style.reset.confirm.submit', 'Reset styling'),\n      variant: 'destructive',\n    })\n    if (!ok) return\n    onThemeChange(undefined)\n  }, [confirm, hasTheme, onThemeChange, t])\n\n  const patchLogo = React.useCallback(\n    (next: Partial<OmThemeLogo>) => {\n      if (!theme?.logo) return\n      patch({ logo: { ...theme.logo, ...next } })\n    },\n    [patch, theme],\n  )\n\n  const handleLogoFile = React.useCallback(\n    async (file: File | undefined) => {\n      if (!file) return\n      setLogoError(null)\n      setIsLoading(true)\n      try {\n        const body = new FormData()\n        body.append('file', file)\n        const response = await runMutation({\n          operation: () => apiCall<{ assetId: string }>(\n            `/api/forms/${encodeURIComponent(formId)}/theme-logo`,\n            { method: 'POST', body },\n          ),\n          context: { formId },\n          mutationPayload: { formId },\n        })\n        if (!response.ok || !response.result?.assetId) {\n          setLogoError(t('forms.studio.style.logo.error', 'Could not upload that image.'))\n          return\n        }\n        patch({ logo: { ...(theme?.logo ?? {}), assetId: response.result.assetId } })\n      } catch {\n        setLogoError(t('forms.studio.style.logo.error', 'Could not upload that image.'))\n      } finally {\n        setIsLoading(false)\n      }\n    },\n    [formId, patch, runMutation, t, theme],\n  )\n\n  // Token-aware AA summary for the brand-color pairs an author actually controls\n  // (text-on-surface, accent-on-surface). Advisory only \u2014 never blocks save.\n  const contrastIssues = React.useMemo(() => {\n    const issues: string[] = []\n    if (belowAaForPair(theme?.foreground, theme?.surface) !== null) {\n      issues.push(t('forms.studio.style.a11y.textOnSurface', 'Text on surface'))\n    }\n    if (belowAaForPair(theme?.inputText, theme?.surface) !== null) {\n      issues.push(t('forms.studio.style.a11y.inputOnSurface', 'Input text on surface'))\n    }\n    if (belowAaForPair(theme?.accent, theme?.surface) !== null) {\n      issues.push(t('forms.studio.style.a11y.accentOnSurface', 'Accent on surface'))\n    }\n    return issues\n  }, [theme, t])\n\n  const renderEnumSelect = <Value extends string>(\n    id: string,\n    label: string,\n    current: Value | undefined,\n    options: ReadonlyArray<{ value: Value; fallback: string }>,\n    labelKeyPrefix: string,\n    onPick: (next: Value | undefined) => void,\n  ) => (\n    <div className=\"space-y-1\">\n      <Label htmlFor={id} className=\"block text-xs font-medium text-foreground\">\n        {label}\n      </Label>\n      <Select\n        value={current ?? NONE_VALUE}\n        onValueChange={(next) => onPick(next === NONE_VALUE ? undefined : (next as Value))}\n      >\n        <SelectTrigger id={id} className=\"h-8\">\n          <SelectValue />\n        </SelectTrigger>\n        <SelectContent>\n          <SelectItem value={NONE_VALUE}>{t('forms.studio.style.inherit', 'Default')}</SelectItem>\n          {options.map((option) => (\n            <SelectItem key={option.value} value={option.value}>\n              {t(`${labelKeyPrefix}.${option.value}`, option.fallback)}\n            </SelectItem>\n          ))}\n        </SelectContent>\n      </Select>\n    </div>\n  )\n\n  return (\n    <div className=\"space-y-3 border-t border-border pt-3\">\n      <div className=\"space-y-1\">\n        <h3 className=\"text-xs font-semibold uppercase tracking-wide text-muted-foreground\">\n          {t('forms.studio.style.appearance.title', 'Appearance')}\n        </h3>\n        <p className=\"text-xs text-muted-foreground\">\n          {t('forms.studio.style.appearance.helper', 'Brand colors, background, and typography for this form.')}\n        </p>\n      </div>\n\n      {contrastIssues.length > 0 ? (\n        <div className=\"rounded-md border border-status-warning-border bg-status-warning-bg p-2\" role=\"status\">\n          <p className=\"text-xs font-medium text-status-warning-text\">\n            {t('forms.studio.style.a11y.title', 'Low contrast')}\n          </p>\n          <ul className=\"mt-1 list-disc pl-4 text-xs text-status-warning-text\">\n            {contrastIssues.map((issue) => (\n              <li key={issue}>{issue}</li>\n            ))}\n          </ul>\n        </div>\n      ) : null}\n\n      <div className=\"space-y-1.5\">\n        <div className=\"flex items-center justify-between\">\n          <span className=\"block text-sm font-medium text-foreground\">\n            {t('forms.studio.style.preset.label', 'Preset')}\n          </span>\n          {hasTheme ? (\n            <Button\n              type=\"button\"\n              variant=\"ghost\"\n              size=\"2xs\"\n              className=\"text-muted-foreground\"\n              onClick={() => { void resetStyling() }}\n            >\n              {t('forms.studio.style.reset.label', 'Reset')}\n            </Button>\n          ) : null}\n        </div>\n        <div className=\"grid grid-cols-2 gap-2\">\n          {FORM_THEME_PRESETS.map((preset) => {\n            const active = themesEqual(theme, preset.theme)\n            const bg = backgroundToPreviewCss(preset.theme.background)\n              ?? colorToPreviewCss(preset.theme.surface)\n            return (\n              <Button\n                key={preset.id}\n                type=\"button\"\n                variant=\"outline\"\n                aria-pressed={active}\n                onClick={() => { void applyPreset(preset.id) }}\n                className={cn(\n                  'h-auto justify-start gap-2 p-2 text-left hover:bg-muted/50',\n                  active ? 'border-primary ring-1 ring-primary' : 'border-border',\n                )}\n              >\n                <span\n                  aria-hidden=\"true\"\n                  className=\"flex h-7 w-9 shrink-0 items-center justify-center gap-0.5 rounded border border-border\"\n                  style={{ background: bg }}\n                >\n                  <span\n                    className=\"h-3 w-3 rounded-full border border-border\"\n                    style={{ background: colorToPreviewCss(preset.theme.surface) }}\n                  />\n                  <span\n                    className=\"h-3 w-3 rounded-full\"\n                    style={{ background: colorToPreviewCss(preset.theme.accent) }}\n                  />\n                </span>\n                <span className=\"truncate text-xs font-medium text-foreground\">\n                  {t(preset.displayNameKey, preset.fallbackName)}\n                </span>\n              </Button>\n            )\n          })}\n        </div>\n      </div>\n\n      <div className=\"space-y-1.5\">\n        <span className=\"block text-sm font-medium text-foreground\">\n          {t('forms.studio.style.logo.label', 'Logo')}\n        </span>\n        {theme?.logo ? (\n          <div className=\"space-y-2\">\n            <div className=\"flex items-center gap-2 rounded-md border border-border bg-muted/30 p-2\">\n              <img\n                src={buildLogoSrc(theme.logo.assetId)}\n                alt=\"\"\n                className=\"max-h-10 w-auto object-contain\"\n              />\n              <div className=\"ml-auto flex gap-1\">\n                <Button\n                  type=\"button\"\n                  variant=\"outline\"\n                  size=\"2xs\"\n                  disabled={isLoading}\n                  onClick={() => fileInputRef.current?.click()}\n                >\n                  {isLoading\n                    ? t('forms.studio.style.logo.uploading', 'Uploading\u2026')\n                    : t('forms.studio.style.logo.replace', 'Replace')}\n                </Button>\n                <Button\n                  type=\"button\"\n                  variant=\"ghost\"\n                  size=\"2xs\"\n                  className=\"text-status-error-text\"\n                  onClick={() => patch({ logo: undefined })}\n                >\n                  {t('forms.studio.style.logo.remove', 'Remove')}\n                </Button>\n              </div>\n            </div>\n            <div className=\"grid grid-cols-2 gap-2\">\n              <div className=\"space-y-1\">\n                <Label htmlFor=\"forms-studio-logo-size\" className=\"block text-xs font-medium text-muted-foreground\">\n                  {t('forms.studio.style.logo.size', 'Size')}\n                </Label>\n                <Select\n                  value={theme.logo.size ?? 'md'}\n                  onValueChange={(value) => patchLogo({ size: value as OmLogoSize })}\n                >\n                  <SelectTrigger id=\"forms-studio-logo-size\">\n                    <SelectValue />\n                  </SelectTrigger>\n                  <SelectContent>\n                    {LOGO_SIZES.map((option) => (\n                      <SelectItem key={option.value} value={option.value}>\n                        {t(`forms.studio.style.logo.sizeOption.${option.value}`, option.fallback)}\n                      </SelectItem>\n                    ))}\n                  </SelectContent>\n                </Select>\n              </div>\n              <div className=\"space-y-1\">\n                <Label htmlFor=\"forms-studio-logo-align\" className=\"block text-xs font-medium text-muted-foreground\">\n                  {t('forms.studio.style.logo.align', 'Alignment')}\n                </Label>\n                <Select\n                  value={theme.logo.align ?? 'start'}\n                  onValueChange={(value) => patchLogo({ align: value as OmTextAlign })}\n                >\n                  <SelectTrigger id=\"forms-studio-logo-align\">\n                    <SelectValue />\n                  </SelectTrigger>\n                  <SelectContent>\n                    {LOGO_ALIGNS.map((option) => (\n                      <SelectItem key={option.value} value={option.value}>\n                        {t(`forms.studio.style.align.${option.value}`, option.fallback)}\n                      </SelectItem>\n                    ))}\n                  </SelectContent>\n                </Select>\n              </div>\n            </div>\n          </div>\n        ) : (\n          <Button\n            type=\"button\"\n            variant=\"outline\"\n            size=\"2xs\"\n            disabled={isLoading}\n            onClick={() => fileInputRef.current?.click()}\n          >\n            {isLoading\n              ? t('forms.studio.style.logo.uploading', 'Uploading\u2026')\n              : t('forms.studio.style.logo.upload', 'Upload logo')}\n          </Button>\n        )}\n        {logoError ? (\n          <p className=\"text-xs text-status-error-text\" role=\"alert\">\n            {logoError}\n          </p>\n        ) : null}\n        <input\n          ref={fileInputRef}\n          type=\"file\"\n          accept=\"image/png,image/jpeg,image/webp,image/gif\"\n          className=\"hidden\"\n          onChange={(event) => {\n            const file = event.target.files?.[0]\n            event.target.value = ''\n            void handleLogoFile(file ?? undefined)\n          }}\n        />\n      </div>\n\n      <BackgroundControl\n        label={t('forms.studio.style.theme.background', 'Background')}\n        value={theme?.background}\n        onChange={(next) => patch({ background: next })}\n      />\n\n      <ColorControl\n        label={t('forms.studio.style.theme.surface', 'Surface')}\n        value={theme?.surface}\n        onChange={(next) => patch({ surface: next })}\n      />\n      <ColorControl\n        label={t('forms.studio.style.theme.foreground', 'Body text')}\n        value={theme?.foreground}\n        onChange={(next) => patch({ foreground: next })}\n        contrastAgainst={theme?.surface}\n      />\n      <ColorControl\n        label={t('forms.studio.style.theme.inputText', 'Input text')}\n        value={theme?.inputText}\n        onChange={(next) => patch({ inputText: next })}\n        contrastAgainst={theme?.surface}\n      />\n      <ColorControl\n        label={t('forms.studio.style.theme.labelColor', 'Label color')}\n        value={theme?.labelColor}\n        onChange={(next) => patch({ labelColor: next })}\n        contrastAgainst={theme?.surface}\n      />\n      {renderEnumSelect(\n        'forms-studio-theme-label-weight',\n        t('forms.studio.style.theme.labelWeight', 'Label weight'),\n        theme?.labelWeight,\n        LABEL_WEIGHTS,\n        'forms.studio.style.weight',\n        (next) => patch({ labelWeight: next }),\n      )}\n      <ColorControl\n        label={t('forms.studio.style.theme.accent', 'Accent')}\n        value={theme?.accent}\n        onChange={(next) => patch({ accent: next })}\n        contrastAgainst={theme?.surface}\n      />\n      <ColorControl\n        label={t('forms.studio.style.theme.border', 'Border')}\n        value={theme?.border}\n        onChange={(next) => patch({ border: next })}\n      />\n\n      {renderEnumSelect(\n        'forms-studio-theme-font-family',\n        t('forms.studio.style.theme.fontFamily', 'Font'),\n        theme?.fontFamily,\n        FONT_FAMILIES,\n        'forms.studio.style.fontFamily',\n        (next) => patch({ fontFamily: next }),\n      )}\n      {renderEnumSelect(\n        'forms-studio-theme-font-scale',\n        t('forms.studio.style.theme.fontScale', 'Text size'),\n        theme?.fontScale,\n        FONT_SCALES,\n        'forms.studio.style.fontScale',\n        (next) => patch({ fontScale: next }),\n      )}\n      {renderEnumSelect(\n        'forms-studio-theme-radius',\n        t('forms.studio.style.theme.radius', 'Corner radius'),\n        theme?.radius,\n        RADIUS_SCALES,\n        'forms.studio.style.radius',\n        (next) => patch({ radius: next }),\n      )}\n      {renderEnumSelect(\n        'forms-studio-theme-content-width',\n        t('forms.studio.style.theme.contentWidth', 'Content width'),\n        theme?.contentWidth,\n        CONTENT_WIDTHS,\n        'forms.studio.style.contentWidth',\n        (next) => patch({ contentWidth: next }),\n      )}\n      {ConfirmDialogElement}\n    </div>\n  )\n}\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/modules/forms/backend/forms/[id]/studio/palette/FormPalettePanel.js

@@ -0,0 +1,44 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { useT } from "@open-mercato/shared/lib/i18n/context";
+import { Tabs, TabsContent, TabsList, TabsTrigger } from "@open-mercato/ui/primitives/tabs";
+import { resolveLucideIcon } from "../lucide-icons.js";
+import { InputParametersTab } from "./InputParametersTab.js";
+import { buildPaletteEntries } from "./entries.js";
+import { PaletteCard } from "./PaletteCard.js";
+function PaletteSection({ title, entries }) {
+  const t = useT();
+  return /* @__PURE__ */ jsxs("section", { className: "space-y-2", children: [
+    /* @__PURE__ */ jsx("h3", { className: "text-xs font-semibold uppercase tracking-wide text-muted-foreground", children: title }),
+    /* @__PURE__ */ jsx("div", { className: "space-y-2", children: entries.map((entry) => /* @__PURE__ */ jsx(
+      PaletteCard,
+      {
+        id: entry.id,
+        Icon: resolveLucideIcon(entry.iconName),
+        label: t(entry.displayNameKey)
+      },
+      entry.id
+    )) })
+  ] });
+}
+function FormPalettePanel({ parameters }) {
+  const t = useT();
+  const entries = React.useMemo(() => buildPaletteEntries(), []);
+  return /* @__PURE__ */ jsx("aside", { className: "rounded-lg border border-border bg-card p-4", children: /* @__PURE__ */ jsxs(Tabs, { defaultValue: "elements", children: [
+    /* @__PURE__ */ jsxs(TabsList, { className: "mb-3 grid w-full grid-cols-2", children: [
+      /* @__PURE__ */ jsx(TabsTrigger, { value: "elements", children: t("forms.studio.palette.tabs.elements") }),
+      /* @__PURE__ */ jsx(TabsTrigger, { value: "parameters", children: t("forms.studio.palette.tabs.parameters") })
+    ] }),
+    /* @__PURE__ */ jsxs(TabsContent, { value: "elements", className: "space-y-4", children: [
+      /* @__PURE__ */ jsx(PaletteSection, { title: t("forms.studio.palette.section.input"), entries: entries.input }),
+      /* @__PURE__ */ jsx(PaletteSection, { title: t("forms.studio.palette.section.survey"), entries: entries.survey }),
+      /* @__PURE__ */ jsx(PaletteSection, { title: t("forms.studio.palette.section.layout"), entries: entries.layout })
+    ] }),
+    /* @__PURE__ */ jsx(TabsContent, { value: "parameters", children: /* @__PURE__ */ jsx(InputParametersTab, { ...parameters }) })
+  ] }) });
+}
+export {
+  FormPalettePanel
+};
+//# sourceMappingURL=FormPalettePanel.js.map

package/dist/modules/forms/backend/forms/[id]/studio/palette/FormPalettePanel.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../../../src/modules/forms/backend/forms/%5Bid%5D/studio/palette/FormPalettePanel.tsx"],
+  "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\nimport { Tabs, TabsContent, TabsList, TabsTrigger } from '@open-mercato/ui/primitives/tabs'\nimport { resolveLucideIcon } from '../lucide-icons'\nimport { InputParametersTab, type InputParametersTabProps } from './InputParametersTab'\nimport { buildPaletteEntries } from './entries'\nimport { PaletteCard } from './PaletteCard'\nimport type { PaletteEntry } from '../types'\n\nfunction PaletteSection({ title, entries }: { title: string; entries: PaletteEntry[] }) {\n  const t = useT()\n  return (\n    <section className=\"space-y-2\">\n      <h3 className=\"text-xs font-semibold uppercase tracking-wide text-muted-foreground\">{title}</h3>\n      <div className=\"space-y-2\">\n        {entries.map((entry) => (\n          <PaletteCard\n            key={entry.id}\n            id={entry.id}\n            Icon={resolveLucideIcon(entry.iconName)}\n            label={t(entry.displayNameKey)}\n          />\n        ))}\n      </div>\n    </section>\n  )\n}\n\nexport function FormPalettePanel({ parameters }: { parameters: InputParametersTabProps }) {\n  const t = useT()\n  const entries = React.useMemo(() => buildPaletteEntries(), [])\n  return (\n    <aside className=\"rounded-lg border border-border bg-card p-4\">\n      <Tabs defaultValue=\"elements\">\n        <TabsList className=\"mb-3 grid w-full grid-cols-2\">\n          <TabsTrigger value=\"elements\">{t('forms.studio.palette.tabs.elements')}</TabsTrigger>\n          <TabsTrigger value=\"parameters\">{t('forms.studio.palette.tabs.parameters')}</TabsTrigger>\n        </TabsList>\n        <TabsContent value=\"elements\" className=\"space-y-4\">\n          <PaletteSection title={t('forms.studio.palette.section.input')} entries={entries.input} />\n          <PaletteSection title={t('forms.studio.palette.section.survey')} entries={entries.survey} />\n          <PaletteSection title={t('forms.studio.palette.section.layout')} entries={entries.layout} />\n        </TabsContent>\n        <TabsContent value=\"parameters\">\n          <InputParametersTab {...parameters} />\n        </TabsContent>\n      </Tabs>\n    </aside>\n  )\n}\n"],
+  "mappings": ";AAcI,SACE,KADF;AAZJ,YAAY,WAAW;AACvB,SAAS,YAAY;AACrB,SAAS,MAAM,aAAa,UAAU,mBAAmB;AACzD,SAAS,yBAAyB;AAClC,SAAS,0BAAwD;AACjE,SAAS,2BAA2B;AACpC,SAAS,mBAAmB;AAG5B,SAAS,eAAe,EAAE,OAAO,QAAQ,GAA+C;AACtF,QAAM,IAAI,KAAK;AACf,SACE,qBAAC,aAAQ,WAAU,aACjB;AAAA,wBAAC,QAAG,WAAU,uEAAuE,iBAAM;AAAA,IAC3F,oBAAC,SAAI,WAAU,aACZ,kBAAQ,IAAI,CAAC,UACZ;AAAA,MAAC;AAAA;AAAA,QAEC,IAAI,MAAM;AAAA,QACV,MAAM,kBAAkB,MAAM,QAAQ;AAAA,QACtC,OAAO,EAAE,MAAM,cAAc;AAAA;AAAA,MAHxB,MAAM;AAAA,IAIb,CACD,GACH;AAAA,KACF;AAEJ;AAEO,SAAS,iBAAiB,EAAE,WAAW,GAA4C;AACxF,QAAM,IAAI,KAAK;AACf,QAAM,UAAU,MAAM,QAAQ,MAAM,oBAAoB,GAAG,CAAC,CAAC;AAC7D,SACE,oBAAC,WAAM,WAAU,+CACf,+BAAC,QAAK,cAAa,YACjB;AAAA,yBAAC,YAAS,WAAU,gCAClB;AAAA,0BAAC,eAAY,OAAM,YAAY,YAAE,oCAAoC,GAAE;AAAA,MACvE,oBAAC,eAAY,OAAM,cAAc,YAAE,sCAAsC,GAAE;AAAA,OAC7E;AAAA,IACA,qBAAC,eAAY,OAAM,YAAW,WAAU,aACtC;AAAA,0BAAC,kBAAe,OAAO,EAAE,oCAAoC,GAAG,SAAS,QAAQ,OAAO;AAAA,MACxF,oBAAC,kBAAe,OAAO,EAAE,qCAAqC,GAAG,SAAS,QAAQ,QAAQ;AAAA,MAC1F,oBAAC,kBAAe,OAAO,EAAE,qCAAqC,GAAG,SAAS,QAAQ,QAAQ;AAAA,OAC5F;AAAA,IACA,oBAAC,eAAY,OAAM,cACjB,8BAAC,sBAAoB,GAAG,YAAY,GACtC;AAAA,KACF,GACF;AAEJ;",
+  "names": []
+}