@vertebr/react 0.3.0 → 0.5.0

package/dist/components/config/form/ConfigField.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ConfigField.d.ts","sourceRoot":"","sources":["../../../../src/components/config/form/ConfigField.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,KAAK,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAGjE,OAAO,KAAK,EAAE,WAAW,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAYvE,OAAO,KAAK,EAAE,iBAAiB,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAElE,MAAM,MAAM,gBAAgB,GAAG,eAAe,GAAG;IAC/C,QAAQ,EAAE,MAAM,CAAC;IACjB,KAAK,EAAE,WAAW,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,iBAAiB,CAAC;IAC3B,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,WAAW,CAAC,CAAC;IACpC,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACjC,IAAI,EAAE,aAAa,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC;IAC7C,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,kBAAkB,CAAC,CAAC;IAC7C,QAAQ,CAAC,EAAE,CACT,KAAK,EAAE,MAAM,EACb,KAAK,EAAE,IAAI,EAAE,KACV,OAAO,CAAC,KAAK,CAAC;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,IAAI,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC,CAAC;IACpD,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB,CAAC;AAEF,wBAAgB,WAAW,CAAC,EAC1B,QAAQ,EACR,KAAK,EACL,UAAU,EACV,OAAO,EACP,MAAM,EACN,OAAO,EACP,IAAI,EACJ,OAAO,EACP,QAAQ,EACR,aAAa,EACb,aAAa,EACb,eAAe,EACf,gBAAgB,EAChB,UAAU,GACX,EAAE,gBAAgB,+BA0LlB"}
+{"version":3,"file":"ConfigField.d.ts","sourceRoot":"","sources":["../../../../src/components/config/form/ConfigField.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,KAAK,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAIjE,OAAO,KAAK,EAAE,WAAW,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAoBvE,OAAO,KAAK,EAAE,iBAAiB,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAElE,MAAM,MAAM,gBAAgB,GAAG,eAAe,GAAG;IAC/C,QAAQ,EAAE,MAAM,CAAC;IACjB,KAAK,EAAE,WAAW,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,iBAAiB,CAAC;IAC3B,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,WAAW,CAAC,CAAC;IACpC,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACjC,IAAI,EAAE,aAAa,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC;IAC7C,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,kBAAkB,CAAC,CAAC;IAC7C,QAAQ,CAAC,EAAE,CACT,KAAK,EAAE,MAAM,EACb,KAAK,EAAE,IAAI,EAAE,KACV,OAAO,CAAC,KAAK,CAAC;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,IAAI,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC,CAAC;IACpD,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B,CAAC;AAEF,wBAAgB,WAAW,CAAC,EAC1B,QAAQ,EACR,KAAK,EACL,UAAU,EACV,OAAO,EACP,MAAM,EACN,OAAO,EACP,IAAI,EACJ,OAAO,EACP,QAAQ,EACR,aAAa,EACb,aAAa,EACb,eAAe,EACf,gBAAgB,EAChB,UAAU,EACV,eAAe,GAChB,EAAE,gBAAgB,+BA8OlB"}

package/dist/components/config/form/ConfigField.js

@@ -2,15 +2,20 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Controller } from "react-hook-form";
 import * as Label from "@radix-ui/react-label";
 import * as Switch from "@radix-ui/react-switch";
+import { VisibilityEyeButton } from "../VisibilityEye";
 import { isDescriptionField } from "../../../lib/description";
 import { collectRecordImages, isImageField, urlsFromValue, } from "../../../lib/images";
 import { isCentsField, isPriceField } from "../../../lib/price";
 import { ImageUploadControl } from "../../resources/ImageUploadControl";
 import { DescriptionInput } from "../DescriptionInput";
+import { EnumInput } from "../EnumInput";
+import { EnumListInput } from "../EnumListInput";
 import { PriceInput } from "../PriceInput";
-import { displayLabel, firstImageUrl, spanFor } from "./helpers";
-export function ConfigField({ fieldKey, field, groupLabel, variant, schema, watched, form, uploads, onUpload, galleryUpload, onListGallery, onUploadGallery, hideImagePreview, hideUpload, }) {
+import { displayLabel, firstImageUrl, isMultilineField, fieldVisibilityKey, spanFor, } from "./helpers";
+export function ConfigField({ fieldKey, field, groupLabel, variant, schema, watched, form, uploads, onUpload, galleryUpload, onListGallery, onUploadGallery, hideImagePreview, hideUpload, visibilityGroup, }) {
     const label = displayLabel(fieldKey, field, groupLabel);
+    const visibilityKey = fieldVisibilityKey(fieldKey, schema, visibilityGroup ?? groupLabel);
+    const visibilityOn = !visibilityKey || watched?.[visibilityKey] !== false;
     const showInlinePreview = !hideImagePreview &&
         field.type !== "file[]" &&
         isImageField(fieldKey, field) &&
@@ -18,7 +23,7 @@ export function ConfigField({ fieldKey, field, groupLabel, variant, schema, watc
     if (field.type === "boolean") {
         return (_jsxs("div", { className: "vertebr-switch-row", children: [_jsx(Label.Root, { htmlFor: fieldKey, children: label }), _jsx(Controller, { control: form.control, name: fieldKey, render: ({ field: controllerField }) => (_jsx(Switch.Root, { className: "vertebr-switch", id: fieldKey, checked: Boolean(controllerField.value), onCheckedChange: controllerField.onChange, children: _jsx(Switch.Thumb, { className: "vertebr-switch-thumb" }) })) })] }));
     }
-    return (_jsxs("div", { className: "vertebr-field", "data-span": spanFor(fieldKey, field, variant), "data-kind": isImageField(fieldKey, field) ? "image" : undefined, children: [_jsx(Label.Root, { htmlFor: fieldKey, children: label }), showInlinePreview ? (_jsxs("div", { className: "vertebr-field-media", children: [_jsx("img", { src: firstImageUrl(watched[fieldKey]) ?? "", alt: "" }), _jsx("input", { id: fieldKey, type: "text", readOnly: field.readOnly, ...form.register(fieldKey) })] })) : field.type === "richtext" || isDescriptionField(fieldKey, field) ? (_jsx(Controller, { control: form.control, name: fieldKey, render: ({ field: controllerField }) => (_jsx(DescriptionInput, { id: fieldKey, name: controllerField.name, inputRef: controllerField.ref, value: typeof controllerField.value === "string"
+    return (_jsxs("div", { className: "vertebr-field", "data-span": spanFor(fieldKey, field, variant), "data-kind": isImageField(fieldKey, field) ? "image" : undefined, "data-storefront": visibilityKey ? (visibilityOn ? "on" : "off") : undefined, children: [_jsxs("div", { className: "vertebr-field-head", children: [_jsx(Label.Root, { htmlFor: fieldKey, children: label }), visibilityKey ? (_jsx(VisibilityEyeButton, { name: visibilityKey, label: label, form: form })) : null] }), showInlinePreview ? (_jsxs("div", { className: "vertebr-field-media", children: [_jsx("img", { src: firstImageUrl(watched[fieldKey]) ?? "", alt: "" }), _jsx("input", { id: fieldKey, type: "text", readOnly: field.readOnly, ...form.register(fieldKey) })] })) : field.type === "richtext" || isDescriptionField(fieldKey, field) ? (_jsx(Controller, { control: form.control, name: fieldKey, render: ({ field: controllerField }) => (_jsx(DescriptionInput, { id: fieldKey, name: controllerField.name, inputRef: controllerField.ref, value: typeof controllerField.value === "string"
                         ? controllerField.value
                         : "", readOnly: field.readOnly, recordImages: collectRecordImages(schema, watched), galleryUpload: galleryUpload, onListGallery: onListGallery, onUploadGallery: onUploadGallery, onBlur: controllerField.onBlur, onChange: controllerField.onChange })) })) : field.type === "file[]" ? (_jsx(Controller, { control: form.control, name: fieldKey, render: ({ field: controllerField }) => {
                     const urls = urlsFromValue(controllerField.value);
@@ -29,7 +34,7 @@ export function ConfigField({ fieldKey, field, groupLabel, variant, schema, watc
                         : "", onBlur: controllerField.onBlur, onChange: (event) => {
                         const next = event.target.value;
                         controllerField.onChange(next === "" ? undefined : Number(next));
-                    }, name: controllerField.name, ref: controllerField.ref })) })) : (_jsx("input", { id: fieldKey, type: "text", readOnly: field.readOnly, ...form.register(fieldKey) })), !hideUpload && uploads?.[fieldKey] && onUpload && !field.readOnly ? (_jsx(ImageUploadControl, { meta: uploads[fieldKey], multiple: field.type === "file[]", onUpload: async (files) => {
+                    }, name: controllerField.name, ref: controllerField.ref })) })) : field.type === "enum" ? (_jsx(Controller, { control: form.control, name: fieldKey, render: ({ field: controllerField }) => (_jsx(EnumInput, { id: fieldKey, value: controllerField.value, field: field, readOnly: field.readOnly, onChange: controllerField.onChange })) })) : field.type === "enum[]" ? (_jsx(Controller, { control: form.control, name: fieldKey, render: ({ field: controllerField }) => (_jsx(EnumListInput, { id: fieldKey, value: controllerField.value, field: field, readOnly: field.readOnly, onChange: controllerField.onChange })) })) : isMultilineField(fieldKey, field) ? (_jsx("textarea", { id: fieldKey, rows: 5, readOnly: field.readOnly, ...form.register(fieldKey) })) : (_jsx("input", { id: fieldKey, type: "text", readOnly: field.readOnly, ...form.register(fieldKey) })), !hideUpload && uploads?.[fieldKey] && onUpload && !field.readOnly ? (_jsx(ImageUploadControl, { meta: uploads[fieldKey], multiple: field.type === "file[]", onUpload: async (files) => {
                     const uploaded = await onUpload(fieldKey, files);
                     const urls = uploaded
                         .map((item) => item.url)

package/dist/components/config/form/ConfigForm.d.ts

@@ -1,4 +1,4 @@
 import type { ConfigFormProps } from "./types";
 export type { ConfigFormProps, ConfigFormVariant } from "./types";
-export declare function ConfigForm({ schema, value, onSave, variant, uploads, onUpload, galleryUpload, onListGallery, onUploadGallery, }: ConfigFormProps): import("react").JSX.Element;
+export declare function ConfigForm({ schema, value, onSave, submitLabel, variant, uploads, onUpload, galleryUpload, onListGallery, onUploadGallery, onChange, hideActions, }: ConfigFormProps): import("react").JSX.Element;
 //# sourceMappingURL=ConfigForm.d.ts.map

package/dist/components/config/form/ConfigForm.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ConfigForm.d.ts","sourceRoot":"","sources":["../../../../src/components/config/form/ConfigForm.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAE/C,YAAY,EAAE,eAAe,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAElE,wBAAgB,UAAU,CAAC,EACzB,MAAM,EACN,KAAK,EACL,MAAM,EACN,OAAkB,EAClB,OAAO,EACP,QAAQ,EACR,aAAa,EACb,aAAa,EACb,eAAe,GAChB,EAAE,eAAe,+BA0EjB"}
+{"version":3,"file":"ConfigForm.d.ts","sourceRoot":"","sources":["../../../../src/components/config/form/ConfigForm.tsx"],"names":[],"mappings":"AAWA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAE/C,YAAY,EAAE,eAAe,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAElE,wBAAgB,UAAU,CAAC,EACzB,MAAM,EACN,KAAK,EACL,MAAM,EACN,WAAW,EACX,OAAkB,EAClB,OAAO,EACP,QAAQ,EACR,aAAa,EACb,aAAa,EACb,eAAe,EACf,QAAQ,EACR,WAAW,GACZ,EAAE,eAAe,+BA8FjB"}

package/dist/components/config/form/ConfigForm.js

@@ -2,22 +2,29 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { useEffect, useMemo, useState } from "react";
 import { useForm, useWatch } from "react-hook-form";
 import { zodResolver } from "@hookform/resolvers/zod";
-import { buildZodSchema, groupFields } from "./helpers";
+import { buildZodSchema, groupFields, withSpecVisibility, withSpecVisibilityValues, } from "./helpers";
 import { RecordConfigForm } from "./RecordConfigForm";
 import { SettingsConfigForm } from "./SettingsConfigForm";
-export function ConfigForm({ schema, value, onSave, variant = "config", uploads, onUpload, galleryUpload, onListGallery, onUploadGallery, }) {
-    const zodSchema = useMemo(() => buildZodSchema(schema), [schema]);
-    const groups = useMemo(() => groupFields(schema, variant), [schema, variant]);
+export function ConfigForm({ schema, value, onSave, submitLabel, variant = "config", uploads, onUpload, galleryUpload, onListGallery, onUploadGallery, onChange, hideActions, }) {
+    const editorSchema = useMemo(() => (variant === "record" ? withSpecVisibility(schema) : schema), [schema, variant]);
+    const editorValue = useMemo(() => variant === "record"
+        ? withSpecVisibilityValues(editorSchema, value)
+        : value, [editorSchema, value, variant]);
+    const zodSchema = useMemo(() => buildZodSchema(editorSchema), [editorSchema]);
+    const groups = useMemo(() => groupFields(editorSchema, variant), [editorSchema, variant]);
     const [status, setStatus] = useState(null);
     const [tone, setTone] = useState();
     const form = useForm({
         resolver: zodResolver(zodSchema),
-        defaultValues: value,
+        defaultValues: editorValue,
     });
     const watched = useWatch({ control: form.control });
     useEffect(() => {
-        form.reset(value);
-    }, [value, form]);
+        onChange?.((watched ?? {}));
+    }, [watched, onChange]);
+    useEffect(() => {
+        form.reset(editorValue);
+    }, [editorValue, form]);
     const onSubmit = form.handleSubmit(async (data) => {
         setStatus("Saving…");
         setTone(undefined);
@@ -43,12 +50,12 @@ export function ConfigForm({ schema, value, onSave, variant = "config", uploads,
         return () => window.removeEventListener("keydown", onKeyDown);
     }, [onSubmit]);
     const onDiscard = () => {
-        form.reset(value);
+        form.reset(editorValue);
         setStatus(null);
         setTone(undefined);
     };
     const shared = {
-        schema,
+        schema: editorSchema,
         groups,
         watched,
         form,
@@ -62,6 +69,8 @@ export function ConfigForm({ schema, value, onSave, variant = "config", uploads,
         status,
         tone,
         onDiscard,
+        submitLabel,
+        hideActions,
     };
     if (variant === "record") {
         return _jsx(RecordConfigForm, { ...shared });

package/dist/components/config/form/ConfigFormActions.d.ts

@@ -5,6 +5,7 @@ export type ConfigFormActionsProps = {
     status: string | null;
     tone?: "ok" | "danger";
     onDiscard: () => void;
+    submitLabel?: string;
 };
-export declare function ConfigFormActions({ form, isDirty, status, tone, onDiscard, }: ConfigFormActionsProps): import("react").JSX.Element;
+export declare function ConfigFormActions({ form, isDirty, status, tone, onDiscard, submitLabel, }: ConfigFormActionsProps): import("react").JSX.Element;
 //# sourceMappingURL=ConfigFormActions.d.ts.map

package/dist/components/config/form/ConfigFormActions.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ConfigFormActions.d.ts","sourceRoot":"","sources":["../../../../src/components/config/form/ConfigFormActions.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAErD,MAAM,MAAM,sBAAsB,GAAG;IACnC,IAAI,EAAE,aAAa,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC;IAC7C,OAAO,EAAE,OAAO,CAAC;IACjB,MAAM,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,IAAI,CAAC,EAAE,IAAI,GAAG,QAAQ,CAAC;IACvB,SAAS,EAAE,MAAM,IAAI,CAAC;CACvB,CAAC;AAEF,wBAAgB,iBAAiB,CAAC,EAChC,IAAI,EACJ,OAAO,EACP,MAAM,EACN,IAAI,EACJ,SAAS,GACV,EAAE,sBAAsB,+BA0BxB"}
+{"version":3,"file":"ConfigFormActions.d.ts","sourceRoot":"","sources":["../../../../src/components/config/form/ConfigFormActions.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAErD,MAAM,MAAM,sBAAsB,GAAG;IACnC,IAAI,EAAE,aAAa,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC;IAC7C,OAAO,EAAE,OAAO,CAAC;IACjB,MAAM,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,IAAI,CAAC,EAAE,IAAI,GAAG,QAAQ,CAAC;IACvB,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,wBAAgB,iBAAiB,CAAC,EAChC,IAAI,EACJ,OAAO,EACP,MAAM,EACN,IAAI,EACJ,SAAS,EACT,WAA4B,GAC7B,EAAE,sBAAsB,+BA0BxB"}

package/dist/components/config/form/ConfigFormActions.js

@@ -1,4 +1,4 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-export function ConfigFormActions({ form, isDirty, status, tone, onDiscard, }) {
-    return (_jsxs("div", { className: "vertebr-actions", children: [_jsx("button", { className: "vertebr-btn vertebr-btn-primary", type: "submit", disabled: form.formState.isSubmitting || !isDirty, children: form.formState.isSubmitting ? "Saving…" : "Save changes" }), isDirty ? (_jsx("button", { className: "vertebr-btn", type: "button", onClick: onDiscard, children: "Discard" })) : null, isDirty ? (_jsx("span", { className: "vertebr-dirty", children: "Unsaved" })) : status ? (_jsx("span", { className: "vertebr-status", "data-tone": tone, children: status })) : null, _jsx("span", { className: "vertebr-actions-spacer" }), _jsx("span", { className: "vertebr-kbd", children: "\u2318S" })] }));
+export function ConfigFormActions({ form, isDirty, status, tone, onDiscard, submitLabel = "Save changes", }) {
+    return (_jsxs("div", { className: "vertebr-actions", children: [_jsx("button", { className: "vertebr-btn vertebr-btn-primary", type: "submit", disabled: form.formState.isSubmitting || !isDirty, children: form.formState.isSubmitting ? "Saving…" : submitLabel }), isDirty ? (_jsx("button", { className: "vertebr-btn", type: "button", onClick: onDiscard, children: "Discard" })) : null, isDirty ? (_jsx("span", { className: "vertebr-dirty", children: "Unsaved" })) : status ? (_jsx("span", { className: "vertebr-status", "data-tone": tone, children: status })) : null, _jsx("span", { className: "vertebr-actions-spacer" }), _jsx("span", { className: "vertebr-kbd", children: "\u2318S" })] }));
 }

package/dist/components/config/form/RecordConfigForm.d.ts

@@ -16,6 +16,8 @@ export type RecordConfigFormProps = GalleryHandlers & {
     status: string | null;
     tone?: "ok" | "danger";
     onDiscard: () => void;
+    submitLabel?: string;
+    hideActions?: boolean;
 };
-export declare function RecordConfigForm({ schema, groups, watched, form, uploads, onUpload, galleryUpload, onListGallery, onUploadGallery, onSubmit, isDirty, status, tone, onDiscard, }: RecordConfigFormProps): import("react").JSX.Element;
+export declare function RecordConfigForm({ schema, groups, watched, form, uploads, onUpload, galleryUpload, onListGallery, onUploadGallery, onSubmit, isDirty, status, tone, onDiscard, submitLabel, }: RecordConfigFormProps): import("react").JSX.Element;
 //# sourceMappingURL=RecordConfigForm.d.ts.map

package/dist/components/config/form/RecordConfigForm.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RecordConfigForm.d.ts","sourceRoot":"","sources":["../../../../src/components/config/form/RecordConfigForm.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AACrD,OAAO,KAAK,EAAE,WAAW,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAUvE,OAAO,KAAK,EAAE,UAAU,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAE3D,MAAM,MAAM,qBAAqB,GAAG,eAAe,GAAG;IACpD,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,WAAW,CAAC,CAAC;IACpC,MAAM,EAAE,UAAU,EAAE,CAAC;IACrB,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACjC,IAAI,EAAE,aAAa,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC;IAC7C,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,kBAAkB,CAAC,CAAC;IAC7C,QAAQ,CAAC,EAAE,CACT,KAAK,EAAE,MAAM,EACb,KAAK,EAAE,IAAI,EAAE,KACV,OAAO,CAAC,KAAK,CAAC;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,IAAI,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC,CAAC;IACpD,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC,eAAe,CAAC,KAAK,IAAI,CAAC;IAC5D,OAAO,EAAE,OAAO,CAAC;IACjB,MAAM,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,IAAI,CAAC,EAAE,IAAI,GAAG,QAAQ,CAAC;IACvB,SAAS,EAAE,MAAM,IAAI,CAAC;CACvB,CAAC;AAEF,wBAAgB,gBAAgB,CAAC,EAC/B,MAAM,EACN,MAAM,EACN,OAAO,EACP,IAAI,EACJ,OAAO,EACP,QAAQ,EACR,aAAa,EACb,aAAa,EACb,eAAe,EACf,QAAQ,EACR,OAAO,EACP,MAAM,EACN,IAAI,EACJ,SAAS,GACV,EAAE,qBAAqB,+BA4HvB"}
+{"version":3,"file":"RecordConfigForm.d.ts","sourceRoot":"","sources":["../../../../src/components/config/form/RecordConfigForm.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AACrD,OAAO,KAAK,EAAE,WAAW,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAYvE,OAAO,KAAK,EAAE,UAAU,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAE3D,MAAM,MAAM,qBAAqB,GAAG,eAAe,GAAG;IACpD,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,WAAW,CAAC,CAAC;IACpC,MAAM,EAAE,UAAU,EAAE,CAAC;IACrB,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACjC,IAAI,EAAE,aAAa,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC;IAC7C,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,kBAAkB,CAAC,CAAC;IAC7C,QAAQ,CAAC,EAAE,CACT,KAAK,EAAE,MAAM,EACb,KAAK,EAAE,IAAI,EAAE,KACV,OAAO,CAAC,KAAK,CAAC;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,IAAI,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC,CAAC;IACpD,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC,eAAe,CAAC,KAAK,IAAI,CAAC;IAC5D,OAAO,EAAE,OAAO,CAAC;IACjB,MAAM,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,IAAI,CAAC,EAAE,IAAI,GAAG,QAAQ,CAAC;IACvB,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC;AAEF,wBAAgB,gBAAgB,CAAC,EAC/B,MAAM,EACN,MAAM,EACN,OAAO,EACP,IAAI,EACJ,OAAO,EACP,QAAQ,EACR,aAAa,EACb,aAAa,EACb,eAAe,EACf,QAAQ,EACR,OAAO,EACP,MAAM,EACN,IAAI,EACJ,SAAS,EACT,WAAW,GACZ,EAAE,qBAAqB,+BAoJvB"}

package/dist/components/config/form/RecordConfigForm.js

@@ -3,12 +3,13 @@ import { looksLikeUrl } from "../../../lib/images";
 import { ImageUploadControl } from "../../resources/ImageUploadControl";
 import { ConfigField } from "./ConfigField";
 import { ConfigFormActions } from "./ConfigFormActions";
-import { findPrimaryImageKey, firstImageUrl, isStockField, } from "./helpers";
-export function RecordConfigForm({ schema, groups, watched, form, uploads, onUpload, galleryUpload, onListGallery, onUploadGallery, onSubmit, isDirty, status, tone, onDiscard, }) {
+import { VisibilityEyeButton } from "../VisibilityEye";
+import { findPrimaryImageKey, firstImageUrl, groupVisibilityKey, isStockField, } from "./helpers";
+export function RecordConfigForm({ schema, groups, watched, form, uploads, onUpload, galleryUpload, onListGallery, onUploadGallery, onSubmit, isDirty, status, tone, onDiscard, submitLabel, }) {
     const imageKey = findPrimaryImageKey(schema, watched);
     const imageValue = imageKey ? firstImageUrl(watched?.[imageKey]) ?? "" : "";
-    const asideGroups = groups.filter((group) => /^(Media|Status)$/i.test(group.id));
-    const mainGroups = groups.filter((group) => !/^(Media|Status)$/i.test(group.id));
+    const asideGroups = groups.filter((group) => /^(Media|Display|Status)$/i.test(group.id));
+    const mainGroups = groups.filter((group) => !/^(Media|Display|Status)$/i.test(group.id));
     const fieldProps = {
         variant: "record",
         schema,
@@ -28,10 +29,17 @@ export function RecordConfigForm({ schema, groups, watched, form, uploads, onUpl
                                                 shouldTouch: true,
                                             });
                                         }
-                                    } })) : null, asideGroups.map((group) => (_jsxs("div", { className: "vertebr-record-block", "data-layout": /^inventory$/i.test(group.id) ? "chips" : undefined, children: [_jsx("div", { className: "vertebr-record-block-label", children: group.label }), _jsx("div", { className: "vertebr-form-fields", "data-layout": isStockField(group.fields[0]?.[0] ?? "", group.fields[0]?.[1])
+                                    } })) : null, asideGroups.map((group) => (_jsxs("div", { className: "vertebr-record-block", "data-layout": /^inventory$/i.test(group.id) ? "chips" : undefined, children: [_jsx(RecordBlockLabel, { groupId: group.id, label: group.label, schema: schema, form: form }), _jsx("div", { className: "vertebr-form-fields", "data-layout": isStockField(group.fields[0]?.[0] ?? "", group.fields[0]?.[1])
                                                 ? "chips"
-                                                : undefined, children: group.fields.map(([key, field]) => (_jsx(ConfigField, { fieldKey: key, field: field, groupLabel: group.label, hideImagePreview: true, hideUpload: key === imageKey, ...fieldProps }, key))) })] }, group.id)))] }), _jsx("div", { className: "vertebr-record-main", children: mainGroups.map((group) => {
+                                                : undefined, children: group.fields.map(([key, field]) => (_jsx(ConfigField, { fieldKey: key, field: field, groupLabel: group.label, visibilityGroup: group.id, hideImagePreview: true, hideUpload: key === imageKey, ...fieldProps }, key))) })] }, group.id)))] }), _jsx("div", { className: "vertebr-record-main", children: mainGroups.map((group) => {
                                 const inventory = /^inventory$/i.test(group.id);
-                                return (_jsxs("div", { className: "vertebr-record-block", "data-layout": inventory ? "chips" : undefined, children: [_jsx("div", { className: "vertebr-record-block-label", children: group.label }), _jsx("div", { className: "vertebr-form-fields", "data-layout": inventory ? "chips" : undefined, children: group.fields.map(([key, field]) => (_jsx(ConfigField, { fieldKey: key, field: field, groupLabel: group.label, ...fieldProps }, key))) })] }, group.id));
-                            }) })] }) }), _jsx(ConfigFormActions, { form: form, isDirty: isDirty, status: status, tone: tone, onDiscard: onDiscard })] }));
+                                const specs = /^specs$/i.test(group.id);
+                                const sectionKey = groupVisibilityKey(group.id, schema);
+                                const sectionOn = !sectionKey || watched?.[sectionKey] !== false;
+                                return (_jsxs("div", { className: "vertebr-record-block", "data-layout": inventory ? "chips" : specs ? "specs" : undefined, "data-storefront": sectionKey ? (sectionOn ? "on" : "off") : undefined, children: [_jsx(RecordBlockLabel, { groupId: group.id, label: group.label, schema: schema, form: form }), _jsx("div", { className: "vertebr-form-fields", "data-layout": inventory ? "chips" : specs ? "specs" : undefined, children: group.fields.map(([key, field]) => (_jsx(ConfigField, { fieldKey: key, field: field, groupLabel: group.label, visibilityGroup: group.id, ...fieldProps }, key))) })] }, group.id));
+                            }) })] }) }), _jsx(ConfigFormActions, { form: form, isDirty: isDirty, status: status, tone: tone, onDiscard: onDiscard, submitLabel: submitLabel })] }));
+}
+function RecordBlockLabel({ groupId, label, schema, form, }) {
+    const visibilityKey = groupVisibilityKey(groupId, schema);
+    return (_jsxs("div", { className: "vertebr-record-block-label", children: [_jsx("span", { children: label }), visibilityKey ? (_jsx(VisibilityEyeButton, { name: visibilityKey, label: label, form: form })) : null] }));
 }

package/dist/components/config/form/SettingsConfigForm.d.ts

@@ -16,6 +16,8 @@ export type SettingsConfigFormProps = GalleryHandlers & {
     status: string | null;
     tone?: "ok" | "danger";
     onDiscard: () => void;
+    submitLabel?: string;
+    hideActions?: boolean;
 };
-export declare function SettingsConfigForm({ schema, groups, watched, form, uploads, onUpload, galleryUpload, onListGallery, onUploadGallery, onSubmit, isDirty, status, tone, onDiscard, }: SettingsConfigFormProps): import("react").JSX.Element;
+export declare function SettingsConfigForm({ schema, groups, watched, form, uploads, onUpload, galleryUpload, onListGallery, onUploadGallery, onSubmit, isDirty, status, tone, onDiscard, submitLabel, hideActions, }: SettingsConfigFormProps): import("react").JSX.Element;
 //# sourceMappingURL=SettingsConfigForm.d.ts.map

package/dist/components/config/form/SettingsConfigForm.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SettingsConfigForm.d.ts","sourceRoot":"","sources":["../../../../src/components/config/form/SettingsConfigForm.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AACrD,OAAO,KAAK,EAAE,WAAW,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAGvE,OAAO,KAAK,EAAE,UAAU,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAE3D,MAAM,MAAM,uBAAuB,GAAG,eAAe,GAAG;IACtD,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,WAAW,CAAC,CAAC;IACpC,MAAM,EAAE,UAAU,EAAE,CAAC;IACrB,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACjC,IAAI,EAAE,aAAa,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC;IAC7C,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,kBAAkB,CAAC,CAAC;IAC7C,QAAQ,CAAC,EAAE,CACT,KAAK,EAAE,MAAM,EACb,KAAK,EAAE,IAAI,EAAE,KACV,OAAO,CAAC,KAAK,CAAC;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,IAAI,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC,CAAC;IACpD,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC,eAAe,CAAC,KAAK,IAAI,CAAC;IAC5D,OAAO,EAAE,OAAO,CAAC;IACjB,MAAM,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,IAAI,CAAC,EAAE,IAAI,GAAG,QAAQ,CAAC;IACvB,SAAS,EAAE,MAAM,IAAI,CAAC;CACvB,CAAC;AAEF,wBAAgB,kBAAkB,CAAC,EACjC,MAAM,EACN,MAAM,EACN,OAAO,EACP,IAAI,EACJ,OAAO,EACP,QAAQ,EACR,aAAa,EACb,aAAa,EACb,eAAe,EACf,QAAQ,EACR,OAAO,EACP,MAAM,EACN,IAAI,EACJ,SAAS,GACV,EAAE,uBAAuB,+BAmDzB"}
+{"version":3,"file":"SettingsConfigForm.d.ts","sourceRoot":"","sources":["../../../../src/components/config/form/SettingsConfigForm.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AACrD,OAAO,KAAK,EAAE,WAAW,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAGvE,OAAO,KAAK,EAAE,UAAU,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAE3D,MAAM,MAAM,uBAAuB,GAAG,eAAe,GAAG;IACtD,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,WAAW,CAAC,CAAC;IACpC,MAAM,EAAE,UAAU,EAAE,CAAC;IACrB,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACjC,IAAI,EAAE,aAAa,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC;IAC7C,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,kBAAkB,CAAC,CAAC;IAC7C,QAAQ,CAAC,EAAE,CACT,KAAK,EAAE,MAAM,EACb,KAAK,EAAE,IAAI,EAAE,KACV,OAAO,CAAC,KAAK,CAAC;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,IAAI,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC,CAAC;IACpD,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC,eAAe,CAAC,KAAK,IAAI,CAAC;IAC5D,OAAO,EAAE,OAAO,CAAC;IACjB,MAAM,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,IAAI,CAAC,EAAE,IAAI,GAAG,QAAQ,CAAC;IACvB,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC;AAEF,wBAAgB,kBAAkB,CAAC,EACjC,MAAM,EACN,MAAM,EACN,OAAO,EACP,IAAI,EACJ,OAAO,EACP,QAAQ,EACR,aAAa,EACb,aAAa,EACb,eAAe,EACf,QAAQ,EACR,OAAO,EACP,MAAM,EACN,IAAI,EACJ,SAAS,EACT,WAAW,EACX,WAAW,GACZ,EAAE,uBAAuB,+BAsDzB"}

package/dist/components/config/form/SettingsConfigForm.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { ConfigField } from "./ConfigField";
 import { ConfigFormActions } from "./ConfigFormActions";
-export function SettingsConfigForm({ schema, groups, watched, form, uploads, onUpload, galleryUpload, onListGallery, onUploadGallery, onSubmit, isDirty, status, tone, onDiscard, }) {
+export function SettingsConfigForm({ schema, groups, watched, form, uploads, onUpload, galleryUpload, onListGallery, onUploadGallery, onSubmit, isDirty, status, tone, onDiscard, submitLabel, hideActions, }) {
     const singleGroup = groups.length === 1;
-    return (_jsxs("form", { className: "vertebr-form", "data-variant": "config", onSubmit: onSubmit, children: [_jsx("div", { className: "vertebr-form-scroll", children: groups.map((group) => (_jsxs("div", { className: "vertebr-form-section", "data-plain": singleGroup ? "true" : undefined, children: [!singleGroup ? (_jsxs("div", { className: "vertebr-form-section-head", children: [_jsx("h3", { children: group.label }), _jsx("span", { className: "vertebr-form-section-count", children: group.fields.length })] })) : null, _jsx("div", { className: "vertebr-form-fields", children: group.fields.map(([key, field]) => (_jsx(ConfigField, { fieldKey: key, field: field, groupLabel: group.label, variant: "config", schema: schema, watched: watched, form: form, uploads: uploads, onUpload: onUpload, galleryUpload: galleryUpload, onListGallery: onListGallery, onUploadGallery: onUploadGallery }, key))) })] }, group.id))) }), _jsx(ConfigFormActions, { form: form, isDirty: isDirty, status: status, tone: tone, onDiscard: onDiscard })] }));
+    return (_jsxs("form", { className: "vertebr-form", "data-variant": "config", onSubmit: onSubmit, children: [_jsx("div", { className: "vertebr-form-scroll", children: groups.map((group) => (_jsxs("div", { className: "vertebr-form-section", "data-plain": singleGroup ? "true" : undefined, children: [!singleGroup ? (_jsxs("div", { className: "vertebr-form-section-head", children: [_jsx("h3", { children: group.label }), _jsx("span", { className: "vertebr-form-section-count", children: group.fields.length })] })) : null, _jsx("div", { className: "vertebr-form-fields", children: group.fields.map(([key, field]) => (_jsx(ConfigField, { fieldKey: key, field: field, groupLabel: group.label, variant: "config", schema: schema, watched: watched, form: form, uploads: uploads, onUpload: onUpload, galleryUpload: galleryUpload, onListGallery: onListGallery, onUploadGallery: onUploadGallery }, key))) })] }, group.id))) }), hideActions ? null : (_jsx(ConfigFormActions, { form: form, isDirty: isDirty, status: status, tone: tone, onDiscard: onDiscard, submitLabel: submitLabel }))] }));
 }

package/dist/components/config/form/helpers/fields.d.ts

@@ -0,0 +1,7 @@
+import type { FieldSchema } from "@vertebr/client";
+import type { ConfigFormVariant } from "../types";
+export declare function isStockField(key: string, field?: FieldSchema): boolean;
+export declare function isSpecsField(key: string, field?: FieldSchema): boolean;
+export declare function isMultilineField(key: string, field?: FieldSchema): boolean;
+export declare function spanFor(key: string, field: FieldSchema, variant: ConfigFormVariant): "wide" | "full" | undefined;
+//# sourceMappingURL=fields.d.ts.map

package/dist/components/config/form/helpers/fields.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"fields.d.ts","sourceRoot":"","sources":["../../../../../src/components/config/form/helpers/fields.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAGnD,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAElD,wBAAgB,YAAY,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,WAAW,GAAG,OAAO,CAGtE;AAED,wBAAgB,YAAY,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,WAAW,GAAG,OAAO,CAKtE;AAED,wBAAgB,gBAAgB,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,WAAW,GAAG,OAAO,CAG1E;AAED,wBAAgB,OAAO,CACrB,GAAG,EAAE,MAAM,EACX,KAAK,EAAE,WAAW,EAClB,OAAO,EAAE,iBAAiB,GACzB,MAAM,GAAG,MAAM,GAAG,SAAS,CAO7B"}

package/dist/components/config/form/helpers/fields.js

@@ -0,0 +1,31 @@
+import { isDescriptionField } from "../../../../lib/description";
+import { isImageField } from "../../../../lib/images";
+export function isStockField(key, field) {
+    const hay = `${key} ${field?.label ?? ""}`;
+    return /(stock|inventory|qty|quantity)/i.test(hay);
+}
+export function isSpecsField(key, field) {
+    if (/^show[A-Z]/.test(key))
+        return false;
+    if (/^specs$/i.test(field?.group ?? ""))
+        return true;
+    const hay = `${key} ${field?.label ?? ""}`;
+    return /(material|fit|care|fabric|composition|^details$)/i.test(hay);
+}
+export function isMultilineField(key, field) {
+    const hay = `${key} ${field?.label ?? ""}`;
+    return /(detail|notes|bio|bullets|body|message|html)/i.test(hay);
+}
+export function spanFor(key, field, variant) {
+    if (field.type === "boolean")
+        return "full";
+    if (field.type === "enum[]")
+        return "full";
+    if (field.type === "richtext" || isDescriptionField(key, field))
+        return "full";
+    if (isMultilineField(key, field))
+        return "full";
+    if (variant === "record" && isImageField(key, field))
+        return "full";
+    return undefined;
+}

package/dist/components/config/form/helpers/groups.d.ts

@@ -0,0 +1,4 @@
+import type { FieldSchema } from "@vertebr/client";
+import type { ConfigFormVariant, FieldGroup } from "../types";
+export declare function groupFields(schema: Record<string, FieldSchema>, variant: ConfigFormVariant): FieldGroup[];
+//# sourceMappingURL=groups.d.ts.map

package/dist/components/config/form/helpers/groups.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"groups.d.ts","sourceRoot":"","sources":["../../../../../src/components/config/form/helpers/groups.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AACnD,OAAO,KAAK,EACV,iBAAiB,EAEjB,UAAU,EACX,MAAM,UAAU,CAAC;AA4ElB,wBAAgB,WAAW,CACzB,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,WAAW,CAAC,EACnC,OAAO,EAAE,iBAAiB,GACzB,UAAU,EAAE,CA6Cd"}

package/dist/components/config/form/helpers/groups.js

@@ -0,0 +1,107 @@
+import { isSpecsField } from "./fields";
+import { humanizeKey } from "./labels";
+import { isPairedVisibilityField } from "./visibility";
+const RECORD_GROUP_ORDER = [
+    "Details",
+    "Content",
+    "Specs",
+    "Pricing",
+    "Inventory",
+    "Media",
+    "Display",
+    "Status",
+];
+function inferConfigGroup(key, field) {
+    if (field.group?.trim())
+        return field.group.trim();
+    const source = field.label?.trim() || humanizeKey(key);
+    const words = source.split(/\s+/).filter(Boolean);
+    if (words.length >= 2)
+        return words[0];
+    return "General";
+}
+function inferRecordGroup(key, field) {
+    if (field.group?.trim())
+        return field.group.trim();
+    const k = key.toLowerCase();
+    const label = (field.label ?? "").toLowerCase();
+    const hay = `${k} ${label}`;
+    if (/(image|img|photo|avatar|thumbnail|thumb|cover|media_url)/i.test(hay)) {
+        return "Media";
+    }
+    if (/(price|cost|cents|amount|msrp)/i.test(hay)) {
+        return "Pricing";
+    }
+    if (/(stock|inventory|qty|quantity)/i.test(hay)) {
+        return "Inventory";
+    }
+    if (/^display$/i.test(field.group ?? "") || /^show[A-Z]/.test(key)) {
+        return "Display";
+    }
+    if (field.type === "boolean" ||
+        /(^|_)(active|enabled|published|status|visible)(_|$)/i.test(k) ||
+        /^(active|enabled|published|status|visible)$/i.test(label)) {
+        return "Status";
+    }
+    if (field.type === "richtext" ||
+        /(description|body|content|summary|bio)/i.test(hay)) {
+        return "Content";
+    }
+    if (isSpecsField(key, field)) {
+        return "Specs";
+    }
+    return "Details";
+}
+function sortGroups(groups, variant) {
+    if (variant !== "record")
+        return groups;
+    const rank = (id) => {
+        const index = RECORD_GROUP_ORDER.indexOf(id);
+        return index === -1 ? RECORD_GROUP_ORDER.length + 1 : index;
+    };
+    return [...groups].sort((a, b) => rank(a.id) - rank(b.id));
+}
+export function groupFields(schema, variant) {
+    const order = [];
+    const map = new Map();
+    const explicit = new Set();
+    for (const entry of Object.entries(schema)) {
+        const [key, field] = entry;
+        if (isPairedVisibilityField(key, schema))
+            continue;
+        const group = variant === "record"
+            ? inferRecordGroup(key, field)
+            : inferConfigGroup(key, field);
+        if (field.group?.trim())
+            explicit.add(group);
+        if (!map.has(group)) {
+            map.set(group, []);
+            order.push(group);
+        }
+        map.get(group).push(entry);
+    }
+    if (variant === "config") {
+        for (const [group, fields] of [...map.entries()]) {
+            if (fields.length > 1 || explicit.has(group) || group === "General") {
+                continue;
+            }
+            if (!map.has("General")) {
+                map.set("General", []);
+                order.unshift("General");
+            }
+            map.get("General").push(...fields);
+            map.delete(group);
+            const idx = order.indexOf(group);
+            if (idx >= 0)
+                order.splice(idx, 1);
+        }
+    }
+    const groups = order
+        .filter((id) => map.has(id))
+        .map((id) => ({
+        id,
+        label: id,
+        fields: map.get(id),
+    }));
+    return sortGroups(groups, variant);
+}

package/dist/components/config/form/helpers/images.d.ts

@@ -0,0 +1,4 @@
+import type { FieldSchema } from "@vertebr/client";
+export declare function firstImageUrl(value: unknown): string | null;
+export declare function findPrimaryImageKey(schema: Record<string, FieldSchema>, values: Record<string, unknown> | undefined): string | null;
+//# sourceMappingURL=images.d.ts.map

package/dist/components/config/form/helpers/images.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"images.d.ts","sourceRoot":"","sources":["../../../../../src/components/config/form/helpers/images.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAGnD,wBAAgB,aAAa,CAAC,KAAK,EAAE,OAAO,GAAG,MAAM,GAAG,IAAI,CAU3D;AAED,wBAAgB,mBAAmB,CACjC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,WAAW,CAAC,EACnC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,SAAS,GAC1C,MAAM,GAAG,IAAI,CASf"}

package/dist/components/config/form/helpers/images.js

@@ -0,0 +1,27 @@
+import { isImageField, looksLikeUrl } from "../../../../lib/images";
+export function firstImageUrl(value) {
+    const items = Array.isArray(value) ? value : [value];
+    for (const item of items) {
+        if (typeof item === "string" && looksLikeUrl(item))
+            return item;
+        if (item && typeof item === "object" && "url" in item) {
+            const url = item.url;
+            if (typeof url === "string" && looksLikeUrl(url))
+                return url;
+        }
+    }
+    return null;
+}
+export function findPrimaryImageKey(schema, values) {
+    for (const [key, field] of Object.entries(schema)) {
+        if (!isImageField(key, field))
+            continue;
+        if (firstImageUrl(values?.[key]))
+            return key;
+    }
+    for (const [key, field] of Object.entries(schema)) {
+        if (isImageField(key, field))
+            return key;
+    }
+    return null;
+}

package/dist/components/config/form/helpers/index.d.ts

@@ -0,0 +1,7 @@
+export { buildZodSchema } from "./schema";
+export { displayLabel, humanizeKey, optionLabel, } from "./labels";
+export { isMultilineField, isSpecsField, isStockField, spanFor, } from "./fields";
+export { fieldVisibilityKey, groupVisibilityKey, isPairedVisibilityField, showFlagKey, visibilityToggleKey, withSpecVisibility, withSpecVisibilityValues, } from "./visibility";
+export { groupFields } from "./groups";
+export { findPrimaryImageKey, firstImageUrl } from "./images";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/config/form/helpers/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/config/form/helpers/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAC1C,OAAO,EACL,YAAY,EACZ,WAAW,EACX,WAAW,GACZ,MAAM,UAAU,CAAC;AAClB,OAAO,EACL,gBAAgB,EAChB,YAAY,EACZ,YAAY,EACZ,OAAO,GACR,MAAM,UAAU,CAAC;AAClB,OAAO,EACL,kBAAkB,EAClB,kBAAkB,EAClB,uBAAuB,EACvB,WAAW,EACX,mBAAmB,EACnB,kBAAkB,EAClB,wBAAwB,GACzB,MAAM,cAAc,CAAC;AACtB,OAAO,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AACvC,OAAO,EAAE,mBAAmB,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC"}

package/dist/components/config/form/helpers/index.js

@@ -0,0 +1,6 @@
+export { buildZodSchema } from "./schema";
+export { displayLabel, humanizeKey, optionLabel, } from "./labels";
+export { isMultilineField, isSpecsField, isStockField, spanFor, } from "./fields";
+export { fieldVisibilityKey, groupVisibilityKey, isPairedVisibilityField, showFlagKey, visibilityToggleKey, withSpecVisibility, withSpecVisibilityValues, } from "./visibility";
+export { groupFields } from "./groups";
+export { findPrimaryImageKey, firstImageUrl } from "./images";

package/dist/components/config/form/helpers/labels.d.ts

@@ -0,0 +1,5 @@
+import type { FieldSchema } from "@vertebr/client";
+export declare function humanizeKey(key: string): string;
+export declare function optionLabel(value: string, field?: FieldSchema): string;
+export declare function displayLabel(key: string, field: FieldSchema, group: string): string;
+//# sourceMappingURL=labels.d.ts.map

package/dist/components/config/form/helpers/labels.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"labels.d.ts","sourceRoot":"","sources":["../../../../../src/components/config/form/helpers/labels.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAEnD,wBAAgB,WAAW,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAK/C;AAED,wBAAgB,WAAW,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,WAAW,GAAG,MAAM,CAItE;AAMD,wBAAgB,YAAY,CAC1B,GAAG,EAAE,MAAM,EACX,KAAK,EAAE,WAAW,EAClB,KAAK,EAAE,MAAM,GACZ,MAAM,CAcR"}

package/dist/components/config/form/helpers/labels.js

@@ -0,0 +1,28 @@
+export function humanizeKey(key) {
+    return key
+        .replace(/([a-z])([A-Z])/g, "$1 $2")
+        .replace(/[_-]+/g, " ")
+        .trim();
+}
+export function optionLabel(value, field) {
+    const labeled = field?.optionLabels?.[value]?.trim();
+    if (labeled)
+        return labeled;
+    return humanizeKey(value);
+}
+function escapeRegExp(value) {
+    return value.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+}
+export function displayLabel(key, field, group) {
+    const label = field.label?.trim() || humanizeKey(key);
+    const stripped = label.replace(new RegExp(`^${escapeRegExp(group)}\\s+`, "i"), "");
+    if (/^inventory$/i.test(group)) {
+        const stock = label.replace(/^stock\s+/i, "").trim();
+        if (stock && stock !== label)
+            return stock;
+    }
+    if (/^pricing$/i.test(group) && /cents/i.test(label)) {
+        return label.replace(/\s*\(cents\)/i, "").trim() || label;
+    }
+    return stripped || label;
+}

package/dist/components/config/form/helpers/schema.d.ts

@@ -0,0 +1,8 @@
+import { z } from "zod";
+import type { FieldSchema } from "@vertebr/client";
+export declare function buildZodSchema(schema: Record<string, FieldSchema>): z.ZodObject<Record<string, z.ZodTypeAny>, "strip", z.ZodTypeAny, {
+    [x: string]: any;
+}, {
+    [x: string]: any;
+}>;
+//# sourceMappingURL=schema.d.ts.map

package/dist/components/config/form/helpers/schema.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"schema.d.ts","sourceRoot":"","sources":["../../../../../src/components/config/form/helpers/schema.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AACxB,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAEnD,wBAAgB,cAAc,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,WAAW,CAAC;;;;GA0BjE"}

package/dist/components/config/form/helpers/schema.js

@@ -0,0 +1,30 @@
+import { z } from "zod";
+export function buildZodSchema(schema) {
+    const shape = {};
+    for (const [key, field] of Object.entries(schema)) {
+        let zodField;
+        switch (field.type) {
+            case "number":
+                zodField = z.number();
+                if (field.min != null)
+                    zodField = zodField.min(field.min);
+                if (field.max != null)
+                    zodField = zodField.max(field.max);
+                break;
+            case "boolean":
+                zodField = z.boolean();
+                break;
+            case "file[]":
+            case "enum[]":
+                zodField = z.array(z.string());
+                break;
+            default:
+                zodField = z.string();
+        }
+        if (!field.required) {
+            zodField = zodField.optional();
+        }
+        shape[key] = zodField;
+    }
+    return z.object(shape);
+}

package/dist/components/config/form/helpers/visibility.d.ts

@@ -0,0 +1,13 @@
+import type { FieldSchema } from "@vertebr/client";
+export declare function showFlagKey(fieldKey: string): string;
+/** Ensure each Specs field has a paired `showX` boolean in the editor schema. */
+export declare function withSpecVisibility(schema: Record<string, FieldSchema>): Record<string, FieldSchema>;
+export declare function withSpecVisibilityValues(schema: Record<string, FieldSchema>, value: Record<string, unknown>): Record<string, unknown>;
+/** `showMaterial` paired with `material`, `showPrice` with `priceCents`. */
+export declare function visibilityToggleKey(fieldKey: string, schema: Record<string, FieldSchema>): string | null;
+export declare function isPairedVisibilityField(key: string, schema: Record<string, FieldSchema>): boolean;
+/** Section-level storefront flag, e.g. Pricing → `showPrice`. */
+export declare function groupVisibilityKey(groupId: string, schema: Record<string, FieldSchema>): string | null;
+/** Field-level flag, skipped when the section header already owns it. */
+export declare function fieldVisibilityKey(fieldKey: string, schema: Record<string, FieldSchema>, groupId?: string): string | null;
+//# sourceMappingURL=visibility.d.ts.map

package/dist/components/config/form/helpers/visibility.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"visibility.d.ts","sourceRoot":"","sources":["../../../../../src/components/config/form/helpers/visibility.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAInD,wBAAgB,WAAW,CAAC,QAAQ,EAAE,MAAM,GAAG,MAAM,CAEpD;AAED,iFAAiF;AACjF,wBAAgB,kBAAkB,CAChC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,WAAW,CAAC,GAClC,MAAM,CAAC,MAAM,EAAE,WAAW,CAAC,CAc7B;AAED,wBAAgB,wBAAwB,CACtC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,WAAW,CAAC,EACnC,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAC7B,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CASzB;AAMD,4EAA4E;AAC5E,wBAAgB,mBAAmB,CACjC,QAAQ,EAAE,MAAM,EAChB,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,WAAW,CAAC,GAClC,MAAM,GAAG,IAAI,CASf;AAcD,wBAAgB,uBAAuB,CACrC,GAAG,EAAE,MAAM,EACX,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,WAAW,CAAC,GAClC,OAAO,CAMT;AAED,iEAAiE;AACjE,wBAAgB,kBAAkB,CAChC,OAAO,EAAE,MAAM,EACf,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,WAAW,CAAC,GAClC,MAAM,GAAG,IAAI,CAIf;AAED,yEAAyE;AACzE,wBAAgB,kBAAkB,CAChC,QAAQ,EAAE,MAAM,EAChB,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,WAAW,CAAC,EACnC,OAAO,CAAC,EAAE,MAAM,GACf,MAAM,GAAG,IAAI,CAKf"}