@page-speed/forms 0.7.0 → 0.7.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -8,6 +8,11 @@ import { cva } from 'class-variance-authority';
8
8
  function cn(...inputs) {
9
9
  return twMerge(clsx(inputs));
10
10
  }
11
+ function humanizeFieldName(name) {
12
+ if (!name) return "This field";
13
+ const words = name.replace(/_/g, " ").replace(/([a-z])([A-Z])/g, "$1 $2").toLowerCase().trim();
14
+ return words.charAt(0).toUpperCase() + words.slice(1);
15
+ }
11
16
  var INPUT_AUTOFILL_RESET_CLASSES = "autofill:bg-transparent autofill:text-foreground [&:-webkit-autofill]:[-webkit-text-fill-color:hsl(var(--foreground))] [&:-webkit-autofill]:[caret-color:hsl(var(--foreground))] [&:-webkit-autofill]:[box-shadow:0_0_0px_1000px_hsl(var(--background))_inset] [&:-webkit-autofill:hover]:[box-shadow:0_0_0px_1000px_hsl(var(--background))_inset] [&:-webkit-autofill:focus]:[box-shadow:0_0_0px_1000px_hsl(var(--background))_inset] [&:-webkit-autofill]:[transition:background-color_9999s_ease-out,color_9999s_ease-out]";
12
17
 
13
18
  // src/components/ui/label.tsx
@@ -284,6 +289,6 @@ var LabelGroup = ({
284
289
  return /* @__PURE__ */ React2.createElement("div", { className: "flex flex-1 flex-col gap-0.5" }, primaryElement, secondaryElement);
285
290
  };
286
291
 
287
- export { Button, Field, FieldDescription, FieldError, FieldGroup, FieldLabel, INPUT_AUTOFILL_RESET_CLASSES, Input, LabelGroup, TextInput, buttonVariants, cn };
288
- //# sourceMappingURL=chunk-J37BGNM6.js.map
289
- //# sourceMappingURL=chunk-J37BGNM6.js.map
292
+ export { Button, Field, FieldDescription, FieldError, FieldGroup, FieldLabel, INPUT_AUTOFILL_RESET_CLASSES, Input, LabelGroup, TextInput, buttonVariants, cn, humanizeFieldName };
293
+ //# sourceMappingURL=chunk-SUF7WJS6.js.map
294
+ //# sourceMappingURL=chunk-SUF7WJS6.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/lib/utils.ts","../src/components/ui/label.tsx","../src/components/ui/field.tsx","../src/components/ui/input.tsx","../src/inputs/TextInput.tsx","../src/components/ui/button.tsx","../src/core/label-group.tsx"],"names":["React","LabelPrimitive","React3","React4","React5","React6"],"mappings":"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","file":"chunk-SUF7WJS6.js","sourcesContent":["import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\n/**\n * Converts a field name (snake_case or camelCase) to a human-readable label.\n *\n * @example\n * humanizeFieldName(\"first_name\") // \"First name\"\n * humanizeFieldName(\"email\") // \"Email\"\n * humanizeFieldName(\"accepts_sms_marketing\") // \"Accepts sms marketing\"\n */\nexport function humanizeFieldName(name: string): string {\n if (!name) return \"This field\";\n\n // Replace underscores with spaces and split camelCase\n const words = name\n .replace(/_/g, \" \")\n .replace(/([a-z])([A-Z])/g, \"$1 $2\")\n .toLowerCase()\n .trim();\n\n // Capitalize first letter only\n return words.charAt(0).toUpperCase() + words.slice(1);\n}\n\n/**\n * Normalizes browser autofill colors so inputs keep theme colors.\n */\nexport const INPUT_AUTOFILL_RESET_CLASSES =\n \"autofill:bg-transparent autofill:text-foreground \" +\n \"[&:-webkit-autofill]:[-webkit-text-fill-color:hsl(var(--foreground))] \" +\n \"[&:-webkit-autofill]:[caret-color:hsl(var(--foreground))] \" +\n \"[&:-webkit-autofill]:[box-shadow:0_0_0px_1000px_hsl(var(--background))_inset] \" +\n \"[&:-webkit-autofill:hover]:[box-shadow:0_0_0px_1000px_hsl(var(--background))_inset] \" +\n \"[&:-webkit-autofill:focus]:[box-shadow:0_0_0px_1000px_hsl(var(--background))_inset] \" +\n \"[&:-webkit-autofill]:[transition:background-color_9999s_ease-out,color_9999s_ease-out]\";\n","import * as React from \"react\"\nimport { Label as LabelPrimitive } from \"radix-ui\"\n\nimport { cn } from \"../../lib/utils\"\n\nfunction Label({\n className,\n ...props\n}: React.ComponentProps<typeof LabelPrimitive.Root>) {\n return (\n <LabelPrimitive.Root\n data-slot=\"label\"\n className={cn(\n \"flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50\",\n className\n )}\n {...props}\n />\n )\n}\n\nexport { Label }\n","import * as React from \"react\";\nimport { Label } from \"./label\";\nimport { cn } from \"../../lib/utils\";\n\ntype FieldOrientation = \"vertical\" | \"horizontal\";\n\ninterface FieldProps extends React.HTMLAttributes<HTMLDivElement> {\n orientation?: FieldOrientation;\n invalid?: boolean;\n}\n\n/**\n * Field - Container component for form inputs with validation display\n *\n * Provides consistent layout and spacing for form fields with labels,\n * inputs, descriptions, and error messages.\n */\nconst Field = React.forwardRef<HTMLDivElement, FieldProps>(\n({ className, orientation = \"vertical\", invalid = false, ...props }, ref) => {\n return (\n <div\n ref={ref}\n data-slot=\"field\"\n data-orientation={orientation}\n data-invalid={invalid || undefined}\n className={cn(\n // Use space-y instead of flex to avoid interfering with parent grid layouts\n orientation === \"horizontal\"\n ? \"flex items-center gap-2\"\n : \"space-y-1.5\",\n className,\n )}\n {...props}\n />\n );\n});\nField.displayName = \"Field\";\n\n/**\n * FieldGroup - Container for multiple related fields\n *\n * Used to group fields together (e.g., first name + last name in a row)\n */\nconst FieldGroup = React.forwardRef<\n HTMLDivElement,\n React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => {\n return (\n <div\n ref={ref}\n data-slot=\"field-group\"\n className={cn(\"flex flex-col gap-4\", className)}\n {...props}\n />\n );\n});\nFieldGroup.displayName = \"FieldGroup\";\n\n/**\n * FieldLabel - Label component for form fields\n *\n * Wrapper around ShadCN Label with consistent styling\n */\nconst FieldLabel = React.forwardRef<\n HTMLLabelElement,\n React.LabelHTMLAttributes<HTMLLabelElement> & {\n required?: boolean;\n }\n>(({ className, required, children, ...props }, ref) => {\n return (\n <Label\n ref={ref}\n data-slot=\"field-label\"\n className={cn(\n \"text-sm font-medium leading-none select-none\",\n \"peer-disabled:cursor-not-allowed peer-disabled:opacity-50\",\n className,\n )}\n {...props}\n >\n {children}\n {required && <span className=\"text-destructive ml-1\">*</span>}\n </Label>\n );\n});\nFieldLabel.displayName = \"FieldLabel\";\n\n/**\n * FieldDescription - Helper text for form fields\n *\n * Displays additional information or instructions for the field\n */\nconst FieldDescription = React.forwardRef<\n HTMLParagraphElement,\n React.HTMLAttributes<HTMLParagraphElement>\n>(({ className, ...props }, ref) => {\n return (\n <p\n ref={ref}\n data-slot=\"field-description\"\n className={cn(\"text-sm opacity-70\", className)}\n {...props}\n />\n );\n});\nFieldDescription.displayName = \"FieldDescription\";\n\n/**\n * FieldError - Error message display for form fields\n *\n * Shows validation errors with proper styling and accessibility\n */\nconst FieldError = React.forwardRef<\n HTMLParagraphElement,\n React.HTMLAttributes<HTMLParagraphElement>\n>(({ className, ...props }, ref) => {\n return (\n <p\n ref={ref}\n data-slot=\"field-error\"\n role=\"alert\"\n aria-live=\"polite\"\n className={cn(\"text-sm text-destructive\", className)}\n {...props}\n />\n );\n});\nFieldError.displayName = \"FieldError\";\n\nexport { Field, FieldGroup, FieldLabel, FieldDescription, FieldError };\n","import * as React from \"react\";\nimport { cn } from \"../../lib/utils\";\nimport { INPUT_AUTOFILL_RESET_CLASSES } from \"../../lib/utils\";\n\n/**\n * Input component - Optimized for dynamic theming across thousands of client brands\n *\n * CRITICAL: This component must work with dynamic Section backgrounds (light/dark/primary/etc)\n * Only uses CSS variables that adapt automatically - NO hardcoded semantic colors\n *\n * See: SHADCN_INTEGRATION_GUIDE.md for full documentation\n */\nconst Input = React.forwardRef<HTMLInputElement, React.ComponentProps<\"input\">>(\n ({ className, type, ...props }, ref) => {\n return (\n <input\n ref={ref}\n type={type}\n data-slot=\"input\"\n className={cn(\n // Core structure - no hardcoded colors, uses CSS variables\n \"flex h-9 w-full min-w-0 rounded-md border border-input\",\n \"bg-transparent px-3 py-1 text-base shadow-sm\",\n \"transition-colors outline-none md:text-sm\",\n\n // Focus state - uses ring-ring CSS variable (adapts to theme)\n \"focus-visible:ring-1 focus-visible:ring-ring\",\n\n // Error state - uses destructive CSS variables (adapts to theme)\n \"aria-invalid:border-destructive aria-invalid:ring-1 aria-invalid:ring-destructive\",\n\n // Disabled state - no color hardcoding\n \"disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50\",\n\n // File input specific - inherits text color from parent\n \"file:inline-flex file:h-7 file:border-0 file:bg-transparent\",\n \"file:text-sm file:font-medium\",\n\n // Autofill reset - prevents browser from overriding our dynamic colors\n INPUT_AUTOFILL_RESET_CLASSES,\n\n className,\n )}\n {...props}\n />\n );\n },\n);\nInput.displayName = \"Input\";\n\nexport { Input };\n","\"use client\";\n\nimport * as React from \"react\";\nimport type { InputProps } from \"../core/types\";\nimport { Input } from \"../components/ui/input\";\nimport { cn } from \"../lib/utils\";\n\n/**\n * TextInput - High-performance text input component (ShadCN-based)\n *\n * Built on ShadCN Input component with form-specific behavior:\n * - Error state handling\n * - Valid value indicator (ring-2)\n * - Form integration (onChange, onBlur)\n * - Full accessibility support\n *\n * @example\n * ```tsx\n * const form = useForm({ initialValues: { email: '' } });\n *\n * <TextInput\n * {...form.getFieldProps('email')}\n * type=\"email\"\n * placeholder=\"Enter your email\"\n * error={!!form.errors.email}\n * aria-invalid={!!form.errors.email}\n * aria-describedby={form.errors.email ? 'email-error' : undefined}\n * />\n * ```\n *\n * @see https://opensite.ai/developers/page-speed/forms/text-input\n */\nexport function TextInput({\n name,\n value,\n onChange,\n onBlur,\n placeholder,\n disabled = false,\n required = false,\n error = false,\n className = \"\",\n type = \"text\",\n id = \"text\",\n suppressValueRing = false,\n ...props\n}: InputProps<string> & {\n type?: \"text\" | \"email\" | \"password\" | \"url\" | \"tel\" | \"search\";\n /**\n * When true, suppresses the `ring-2 ring-ring` applied when a value is\n * present. Use this when the component is embedded inside a wrapper (e.g.\n * ButtonGroupForm) that renders its own unified ring.\n */\n suppressValueRing?: boolean;\n}) {\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n onChange(e.target.value);\n };\n\n const handleBlur = () => {\n onBlur?.();\n };\n\n const hasValue = String(value ?? \"\").trim().length > 0;\n\n return (\n <Input\n type={type}\n id={id}\n name={name}\n value={value ?? \"\"}\n onChange={handleChange}\n onBlur={handleBlur}\n placeholder={placeholder}\n disabled={disabled}\n required={required}\n className={cn(\n // Valid value indicator - ring-2 when has value, no error, and not suppressed\n !suppressValueRing && !error && hasValue && \"ring-2 ring-ring\",\n // Error state - handled by Input component via aria-invalid\n className,\n )}\n aria-invalid={error || props[\"aria-invalid\"]}\n aria-describedby={props[\"aria-describedby\"]}\n aria-required={required || props[\"aria-required\"]}\n {...props}\n />\n );\n}\n\nTextInput.displayName = \"TextInput\";\n","import * as React from \"react\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\nimport { Slot } from \"radix-ui\"\n\nimport { cn } from \"../../lib/utils\"\n\nconst buttonVariants = cva(\n \"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 aria-invalid:border-destructive\",\n {\n variants: {\n variant: {\n default: \"bg-primary text-primary-foreground hover:bg-primary/90\",\n destructive:\n \"bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20\",\n outline:\n \"border border-input bg-transparent shadow-xs hover:bg-accent hover:text-accent-foreground\",\n secondary:\n \"bg-secondary text-secondary-foreground hover:bg-secondary/80\",\n ghost:\n \"hover:bg-accent hover:text-accent-foreground\",\n link: \"text-primary underline-offset-4 hover:underline\",\n },\n size: {\n default: \"h-9 px-4 py-2 has-[>svg]:px-3\",\n xs: \"h-6 gap-1 rounded-md px-2 text-xs has-[>svg]:px-1.5 [&_svg:not([class*='size-'])]:size-3\",\n sm: \"h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5\",\n lg: \"h-10 rounded-md px-6 has-[>svg]:px-4\",\n icon: \"size-9\",\n \"icon-xs\": \"size-6 rounded-md [&_svg:not([class*='size-'])]:size-3\",\n \"icon-sm\": \"size-8\",\n \"icon-lg\": \"size-10\",\n },\n },\n defaultVariants: {\n variant: \"default\",\n size: \"default\",\n },\n }\n)\n\nfunction Button({\n className,\n variant = \"default\",\n size = \"default\",\n asChild = false,\n ...props\n}: React.ComponentProps<\"button\"> &\n VariantProps<typeof buttonVariants> & {\n asChild?: boolean\n }) {\n const Comp = asChild ? Slot.Root : \"button\"\n\n return (\n <Comp\n data-slot=\"button\"\n data-variant={variant}\n data-size={size}\n className={cn(buttonVariants({ variant, size, className }))}\n {...props}\n />\n )\n}\n\nexport { Button, buttonVariants }\n","\"use client\";\n\nimport * as React from \"react\";\nimport type { ReactNode } from \"react\";\nimport { FieldDescription, FieldLabel } from \"../components/ui/field\";\nimport { cn } from \"../lib/utils\";\n\nexport type LabelGroupProps = {\n variant?: \"legend\" | \"label\" | \"text\";\n secondary?: ReactNode;\n secondaryId?: string;\n primary?: ReactNode;\n labelHtmlFor?: string;\n required?: boolean;\n primaryClassName?: string;\n secondaryClassName?: string;\n};\n\nconst LabelGroup = ({\n labelHtmlFor,\n required = false,\n variant = \"label\",\n secondaryId,\n secondary,\n primary,\n primaryClassName,\n secondaryClassName,\n}: LabelGroupProps) => {\n const primaryClasses = cn(\n \"text-sm font-medium leading-snug\",\n variant === \"legend\" ? \"mb-1.5\" : \"mb-1 block\",\n primaryClassName,\n );\n\n const requiredIndicator =\n required && variant !== \"label\" ? (\n <span className=\"text-destructive pl-0.5\" aria-label=\"required\">\n *\n </span>\n ) : null;\n\n let primaryElement: ReactNode = null;\n if (primary) {\n if (variant === \"label\") {\n primaryElement = (\n <FieldLabel\n htmlFor={labelHtmlFor}\n required={required}\n className={primaryClasses}\n >\n {primary}\n </FieldLabel>\n );\n } else if (variant === \"legend\") {\n primaryElement = (\n <legend data-slot=\"field-legend\" className={primaryClasses}>\n {primary}\n {requiredIndicator}\n </legend>\n );\n } else {\n primaryElement = (\n <div data-slot=\"field-label\" className={primaryClasses}>\n {primary}\n {requiredIndicator}\n </div>\n );\n }\n }\n\n const secondaryElement = secondary ? (\n <FieldDescription\n id={secondaryId}\n className={cn(\"leading-normal font-normal\", secondaryClassName)}\n >\n {secondary}\n </FieldDescription>\n ) : null;\n\n if (!primaryElement && !secondaryElement) return null;\n\n // Legend should remain a direct child of fieldset for proper semantics.\n if (variant === \"legend\") {\n return (\n <>\n {primaryElement}\n {secondaryElement}\n </>\n );\n }\n\n return (\n <div className=\"flex flex-1 flex-col gap-0.5\">\n {primaryElement}\n {secondaryElement}\n </div>\n );\n};\n\nexport { LabelGroup };\n"]}
@@ -30,6 +30,11 @@ var React2__namespace = /*#__PURE__*/_interopNamespace(React2);
30
30
  function cn(...inputs) {
31
31
  return tailwindMerge.twMerge(clsx.clsx(inputs));
32
32
  }
33
+ function humanizeFieldName(name) {
34
+ if (!name) return "This field";
35
+ const words = name.replace(/_/g, " ").replace(/([a-z])([A-Z])/g, "$1 $2").toLowerCase().trim();
36
+ return words.charAt(0).toUpperCase() + words.slice(1);
37
+ }
33
38
  var INPUT_AUTOFILL_RESET_CLASSES = "autofill:bg-transparent autofill:text-foreground [&:-webkit-autofill]:[-webkit-text-fill-color:hsl(var(--foreground))] [&:-webkit-autofill]:[caret-color:hsl(var(--foreground))] [&:-webkit-autofill]:[box-shadow:0_0_0px_1000px_hsl(var(--background))_inset] [&:-webkit-autofill:hover]:[box-shadow:0_0_0px_1000px_hsl(var(--background))_inset] [&:-webkit-autofill:focus]:[box-shadow:0_0_0px_1000px_hsl(var(--background))_inset] [&:-webkit-autofill]:[transition:background-color_9999s_ease-out,color_9999s_ease-out]";
34
39
 
35
40
  // src/components/ui/label.tsx
@@ -318,5 +323,6 @@ exports.LabelGroup = LabelGroup;
318
323
  exports.TextInput = TextInput;
319
324
  exports.buttonVariants = buttonVariants;
320
325
  exports.cn = cn;
321
- //# sourceMappingURL=chunk-QMWZLGON.cjs.map
322
- //# sourceMappingURL=chunk-QMWZLGON.cjs.map
326
+ exports.humanizeFieldName = humanizeFieldName;
327
+ //# sourceMappingURL=chunk-WQ4HD5UD.cjs.map
328
+ //# sourceMappingURL=chunk-WQ4HD5UD.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/lib/utils.ts","../src/components/ui/label.tsx","../src/components/ui/field.tsx","../src/components/ui/input.tsx","../src/inputs/TextInput.tsx","../src/components/ui/button.tsx","../src/core/label-group.tsx"],"names":["twMerge","clsx","React","LabelPrimitive","React2","React3","React4","cva","Slot","React5","React6"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGO,SAAS,MAAM,MAAA,EAAsB;AAC1C,EAAA,OAAOA,qBAAA,CAAQC,SAAA,CAAK,MAAM,CAAC,CAAA;AAC7B;AAUO,SAAS,kBAAkB,IAAA,EAAsB;AACtD,EAAA,IAAI,CAAC,MAAM,OAAO,YAAA;AAGlB,EAAA,MAAM,KAAA,GAAQ,IAAA,CACX,OAAA,CAAQ,IAAA,EAAM,GAAG,CAAA,CACjB,OAAA,CAAQ,iBAAA,EAAmB,OAAO,CAAA,CAClC,WAAA,EAAY,CACZ,IAAA,EAAK;AAGR,EAAA,OAAO,KAAA,CAAM,OAAO,CAAC,CAAA,CAAE,aAAY,GAAI,KAAA,CAAM,MAAM,CAAC,CAAA;AACtD;AAKO,IAAM,4BAAA,GACX;;;AC5BF,SAAS,KAAA,CAAM;AAAA,EACb,SAAA;AAAA,EACA,GAAG;AACL,CAAA,EAAqD;AACnD,EAAA,uBACEC,iBAAA,CAAA,aAAA;AAAA,IAACC,aAAA,CAAe,IAAA;AAAA,IAAf;AAAA,MACC,WAAA,EAAU,OAAA;AAAA,MACV,SAAA,EAAW,EAAA;AAAA,QACT,qNAAA;AAAA,QACA;AAAA,OACF;AAAA,MACC,GAAG;AAAA;AAAA,GACN;AAEJ;;;ACFA,IAAM,KAAA,GAAcC,iBAAA,CAAA,UAAA;AAAA,EACpB,CAAC,EAAE,SAAA,EAAW,WAAA,GAAc,UAAA,EAAY,UAAU,KAAA,EAAO,GAAG,KAAA,EAAM,EAAG,GAAA,KAAQ;AAC3E,IAAA,uBACEA,iBAAA,CAAA,aAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,WAAA,EAAU,OAAA;AAAA,QACV,kBAAA,EAAkB,WAAA;AAAA,QAClB,gBAAc,OAAA,IAAW,MAAA;AAAA,QACzB,SAAA,EAAW,EAAA;AAAA;AAAA,UAET,WAAA,KAAgB,eACZ,yBAAA,GACA,aAAA;AAAA,UACJ;AAAA,SACF;AAAA,QACC,GAAG;AAAA;AAAA,KACN;AAAA,EAEJ;AAAC;AACD,KAAA,CAAM,WAAA,GAAc,OAAA;AAOpB,IAAM,UAAA,GAAmBA,6BAGvB,CAAC,EAAE,WAAW,GAAG,KAAA,IAAS,GAAA,KAAQ;AAClC,EAAA,uBACEA,iBAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,GAAA;AAAA,MACA,WAAA,EAAU,aAAA;AAAA,MACV,SAAA,EAAW,EAAA,CAAG,qBAAA,EAAuB,SAAS,CAAA;AAAA,MAC7C,GAAG;AAAA;AAAA,GACN;AAEJ,CAAC;AACD,UAAA,CAAW,WAAA,GAAc,YAAA;AAOzB,IAAM,UAAA,GAAmBA,iBAAA,CAAA,UAAA,CAKvB,CAAC,EAAE,SAAA,EAAW,UAAU,QAAA,EAAU,GAAG,KAAA,EAAM,EAAG,GAAA,KAAQ;AACtD,EAAA,uBACEA,iBAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,GAAA;AAAA,MACA,WAAA,EAAU,aAAA;AAAA,MACV,SAAA,EAAW,EAAA;AAAA,QACT,8CAAA;AAAA,QACA,2DAAA;AAAA,QACA;AAAA,OACF;AAAA,MACC,GAAG;AAAA,KAAA;AAAA,IAEH,QAAA;AAAA,IACA,QAAA,oBAAYA,iBAAA,CAAA,aAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,2BAAwB,GAAC;AAAA,GACxD;AAEJ,CAAC;AACD,UAAA,CAAW,WAAA,GAAc,YAAA;AAOzB,IAAM,gBAAA,GAAyBA,6BAG7B,CAAC,EAAE,WAAW,GAAG,KAAA,IAAS,GAAA,KAAQ;AAClC,EAAA,uBACEA,iBAAA,CAAA,aAAA;AAAA,IAAC,GAAA;AAAA,IAAA;AAAA,MACC,GAAA;AAAA,MACA,WAAA,EAAU,mBAAA;AAAA,MACV,SAAA,EAAW,EAAA,CAAG,oBAAA,EAAsB,SAAS,CAAA;AAAA,MAC5C,GAAG;AAAA;AAAA,GACN;AAEJ,CAAC;AACD,gBAAA,CAAiB,WAAA,GAAc,kBAAA;AAO/B,IAAM,UAAA,GAAmBA,6BAGvB,CAAC,EAAE,WAAW,GAAG,KAAA,IAAS,GAAA,KAAQ;AAClC,EAAA,uBACEA,iBAAA,CAAA,aAAA;AAAA,IAAC,GAAA;AAAA,IAAA;AAAA,MACC,GAAA;AAAA,MACA,WAAA,EAAU,aAAA;AAAA,MACV,IAAA,EAAK,OAAA;AAAA,MACL,WAAA,EAAU,QAAA;AAAA,MACV,SAAA,EAAW,EAAA,CAAG,0BAAA,EAA4B,SAAS,CAAA;AAAA,MAClD,GAAG;AAAA;AAAA,GACN;AAEJ,CAAC;AACD,UAAA,CAAW,WAAA,GAAc,YAAA;ACnHzB,IAAM,KAAA,GAAcC,iBAAA,CAAA,UAAA;AAAA,EAClB,CAAC,EAAE,SAAA,EAAW,MAAM,GAAG,KAAA,IAAS,GAAA,KAAQ;AACtC,IAAA,uBACEA,iBAAA,CAAA,aAAA;AAAA,MAAC,OAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,IAAA;AAAA,QACA,WAAA,EAAU,OAAA;AAAA,QACV,SAAA,EAAW,EAAA;AAAA;AAAA,UAET,wDAAA;AAAA,UACA,8CAAA;AAAA,UACA,2CAAA;AAAA;AAAA,UAGA,8CAAA;AAAA;AAAA,UAGA,mFAAA;AAAA;AAAA,UAGA,8EAAA;AAAA;AAAA,UAGA,6DAAA;AAAA,UACA,+BAAA;AAAA;AAAA,UAGA,4BAAA;AAAA,UAEA;AAAA,SACF;AAAA,QACC,GAAG;AAAA;AAAA,KACN;AAAA,EAEJ;AACF;AACA,KAAA,CAAM,WAAA,GAAc,OAAA;;;AChBb,SAAS,SAAA,CAAU;AAAA,EACxB,IAAA;AAAA,EACA,KAAA;AAAA,EACA,QAAA;AAAA,EACA,MAAA;AAAA,EACA,WAAA;AAAA,EACA,QAAA,GAAW,KAAA;AAAA,EACX,QAAA,GAAW,KAAA;AAAA,EACX,KAAA,GAAQ,KAAA;AAAA,EACR,SAAA,GAAY,EAAA;AAAA,EACZ,IAAA,GAAO,MAAA;AAAA,EACP,EAAA,GAAK,MAAA;AAAA,EACL,iBAAA,GAAoB,KAAA;AAAA,EACpB,GAAG;AACL,CAAA,EAQG;AACD,EAAA,MAAM,YAAA,GAAe,CAAC,CAAA,KAA2C;AAC/D,IAAA,QAAA,CAAS,CAAA,CAAE,OAAO,KAAK,CAAA;AAAA,EACzB,CAAA;AAEA,EAAA,MAAM,aAAa,MAAM;AACvB,IAAA,MAAA,IAAS;AAAA,EACX,CAAA;AAEA,EAAA,MAAM,WAAW,MAAA,CAAO,KAAA,IAAS,EAAE,CAAA,CAAE,IAAA,GAAO,MAAA,GAAS,CAAA;AAErD,EAAA,uBACEC,iBAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,IAAA;AAAA,MACA,EAAA;AAAA,MACA,IAAA;AAAA,MACA,OAAO,KAAA,IAAS,EAAA;AAAA,MAChB,QAAA,EAAU,YAAA;AAAA,MACV,MAAA,EAAQ,UAAA;AAAA,MACR,WAAA;AAAA,MACA,QAAA;AAAA,MACA,QAAA;AAAA,MACA,SAAA,EAAW,EAAA;AAAA;AAAA,QAET,CAAC,iBAAA,IAAqB,CAAC,KAAA,IAAS,QAAA,IAAY,kBAAA;AAAA;AAAA,QAE5C;AAAA,OACF;AAAA,MACA,cAAA,EAAc,KAAA,IAAS,KAAA,CAAM,cAAc,CAAA;AAAA,MAC3C,kBAAA,EAAkB,MAAM,kBAAkB,CAAA;AAAA,MAC1C,eAAA,EAAe,QAAA,IAAY,KAAA,CAAM,eAAe,CAAA;AAAA,MAC/C,GAAG;AAAA;AAAA,GACN;AAEJ;AAEA,SAAA,CAAU,WAAA,GAAc,WAAA;ACpFxB,IAAM,cAAA,GAAiBC,0BAAA;AAAA,EACrB,uZAAA;AAAA,EACA;AAAA,IACE,QAAA,EAAU;AAAA,MACR,OAAA,EAAS;AAAA,QACP,OAAA,EAAS,wDAAA;AAAA,QACT,WAAA,EACE,qFAAA;AAAA,QACF,OAAA,EACE,2FAAA;AAAA,QACF,SAAA,EACE,8DAAA;AAAA,QACF,KAAA,EACE,8CAAA;AAAA,QACF,IAAA,EAAM;AAAA,OACR;AAAA,MACA,IAAA,EAAM;AAAA,QACJ,OAAA,EAAS,+BAAA;AAAA,QACT,EAAA,EAAI,0FAAA;AAAA,QACJ,EAAA,EAAI,+CAAA;AAAA,QACJ,EAAA,EAAI,sCAAA;AAAA,QACJ,IAAA,EAAM,QAAA;AAAA,QACN,SAAA,EAAW,wDAAA;AAAA,QACX,SAAA,EAAW,QAAA;AAAA,QACX,SAAA,EAAW;AAAA;AACb,KACF;AAAA,IACA,eAAA,EAAiB;AAAA,MACf,OAAA,EAAS,SAAA;AAAA,MACT,IAAA,EAAM;AAAA;AACR;AAEJ;AAEA,SAAS,MAAA,CAAO;AAAA,EACd,SAAA;AAAA,EACA,OAAA,GAAU,SAAA;AAAA,EACV,IAAA,GAAO,SAAA;AAAA,EACP,OAAA,GAAU,KAAA;AAAA,EACV,GAAG;AACL,CAAA,EAGK;AACH,EAAA,MAAM,IAAA,GAAO,OAAA,GAAUC,YAAA,CAAK,IAAA,GAAO,QAAA;AAEnC,EAAA,uBACEC,iBAAA,CAAA,aAAA;AAAA,IAAC,IAAA;AAAA,IAAA;AAAA,MACC,WAAA,EAAU,QAAA;AAAA,MACV,cAAA,EAAc,OAAA;AAAA,MACd,WAAA,EAAW,IAAA;AAAA,MACX,SAAA,EAAW,GAAG,cAAA,CAAe,EAAE,SAAS,IAAA,EAAM,SAAA,EAAW,CAAC,CAAA;AAAA,MACzD,GAAG;AAAA;AAAA,GACN;AAEJ;AC3CA,IAAM,aAAa,CAAC;AAAA,EAClB,YAAA;AAAA,EACA,QAAA,GAAW,KAAA;AAAA,EACX,OAAA,GAAU,OAAA;AAAA,EACV,WAAA;AAAA,EACA,SAAA;AAAA,EACA,OAAA;AAAA,EACA,gBAAA;AAAA,EACA;AACF,CAAA,KAAuB;AACrB,EAAA,MAAM,cAAA,GAAiB,EAAA;AAAA,IACrB,kCAAA;AAAA,IACA,OAAA,KAAY,WAAW,QAAA,GAAW,YAAA;AAAA,IAClC;AAAA,GACF;AAEA,EAAA,MAAM,iBAAA,GACJ,QAAA,IAAY,OAAA,KAAY,OAAA,mBACtBC,iBAAA,CAAA,aAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,yBAAA,EAA0B,YAAA,EAAW,UAAA,EAAA,EAAW,GAEhE,CAAA,GACE,IAAA;AAEN,EAAA,IAAI,cAAA,GAA4B,IAAA;AAChC,EAAA,IAAI,OAAA,EAAS;AACX,IAAA,IAAI,YAAY,OAAA,EAAS;AACvB,MAAA,cAAA,mBACEA,iBAAA,CAAA,aAAA;AAAA,QAAC,UAAA;AAAA,QAAA;AAAA,UACC,OAAA,EAAS,YAAA;AAAA,UACT,QAAA;AAAA,UACA,SAAA,EAAW;AAAA,SAAA;AAAA,QAEV;AAAA,OACH;AAAA,IAEJ,CAAA,MAAA,IAAW,YAAY,QAAA,EAAU;AAC/B,MAAA,cAAA,mDACG,QAAA,EAAA,EAAO,WAAA,EAAU,gBAAe,SAAA,EAAW,cAAA,EAAA,EACzC,SACA,iBACH,CAAA;AAAA,IAEJ,CAAA,MAAO;AACL,MAAA,cAAA,mDACG,KAAA,EAAA,EAAI,WAAA,EAAU,eAAc,SAAA,EAAW,cAAA,EAAA,EACrC,SACA,iBACH,CAAA;AAAA,IAEJ;AAAA,EACF;AAEA,EAAA,MAAM,mBAAmB,SAAA,mBACvBA,iBAAA,CAAA,aAAA;AAAA,IAAC,gBAAA;AAAA,IAAA;AAAA,MACC,EAAA,EAAI,WAAA;AAAA,MACJ,SAAA,EAAW,EAAA,CAAG,4BAAA,EAA8B,kBAAkB;AAAA,KAAA;AAAA,IAE7D;AAAA,GACH,GACE,IAAA;AAEJ,EAAA,IAAI,CAAC,cAAA,IAAkB,CAAC,gBAAA,EAAkB,OAAO,IAAA;AAGjD,EAAA,IAAI,YAAY,QAAA,EAAU;AACxB,IAAA,uBACEA,iBAAA,CAAA,aAAA,CAAAA,iBAAA,CAAA,QAAA,EAAA,IAAA,EACG,gBACA,gBACH,CAAA;AAAA,EAEJ;AAEA,EAAA,uBACEA,iBAAA,CAAA,aAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,8BAAA,EAAA,EACZ,gBACA,gBACH,CAAA;AAEJ","file":"chunk-WQ4HD5UD.cjs","sourcesContent":["import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\n/**\n * Converts a field name (snake_case or camelCase) to a human-readable label.\n *\n * @example\n * humanizeFieldName(\"first_name\") // \"First name\"\n * humanizeFieldName(\"email\") // \"Email\"\n * humanizeFieldName(\"accepts_sms_marketing\") // \"Accepts sms marketing\"\n */\nexport function humanizeFieldName(name: string): string {\n if (!name) return \"This field\";\n\n // Replace underscores with spaces and split camelCase\n const words = name\n .replace(/_/g, \" \")\n .replace(/([a-z])([A-Z])/g, \"$1 $2\")\n .toLowerCase()\n .trim();\n\n // Capitalize first letter only\n return words.charAt(0).toUpperCase() + words.slice(1);\n}\n\n/**\n * Normalizes browser autofill colors so inputs keep theme colors.\n */\nexport const INPUT_AUTOFILL_RESET_CLASSES =\n \"autofill:bg-transparent autofill:text-foreground \" +\n \"[&:-webkit-autofill]:[-webkit-text-fill-color:hsl(var(--foreground))] \" +\n \"[&:-webkit-autofill]:[caret-color:hsl(var(--foreground))] \" +\n \"[&:-webkit-autofill]:[box-shadow:0_0_0px_1000px_hsl(var(--background))_inset] \" +\n \"[&:-webkit-autofill:hover]:[box-shadow:0_0_0px_1000px_hsl(var(--background))_inset] \" +\n \"[&:-webkit-autofill:focus]:[box-shadow:0_0_0px_1000px_hsl(var(--background))_inset] \" +\n \"[&:-webkit-autofill]:[transition:background-color_9999s_ease-out,color_9999s_ease-out]\";\n","import * as React from \"react\"\nimport { Label as LabelPrimitive } from \"radix-ui\"\n\nimport { cn } from \"../../lib/utils\"\n\nfunction Label({\n className,\n ...props\n}: React.ComponentProps<typeof LabelPrimitive.Root>) {\n return (\n <LabelPrimitive.Root\n data-slot=\"label\"\n className={cn(\n \"flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50\",\n className\n )}\n {...props}\n />\n )\n}\n\nexport { Label }\n","import * as React from \"react\";\nimport { Label } from \"./label\";\nimport { cn } from \"../../lib/utils\";\n\ntype FieldOrientation = \"vertical\" | \"horizontal\";\n\ninterface FieldProps extends React.HTMLAttributes<HTMLDivElement> {\n orientation?: FieldOrientation;\n invalid?: boolean;\n}\n\n/**\n * Field - Container component for form inputs with validation display\n *\n * Provides consistent layout and spacing for form fields with labels,\n * inputs, descriptions, and error messages.\n */\nconst Field = React.forwardRef<HTMLDivElement, FieldProps>(\n({ className, orientation = \"vertical\", invalid = false, ...props }, ref) => {\n return (\n <div\n ref={ref}\n data-slot=\"field\"\n data-orientation={orientation}\n data-invalid={invalid || undefined}\n className={cn(\n // Use space-y instead of flex to avoid interfering with parent grid layouts\n orientation === \"horizontal\"\n ? \"flex items-center gap-2\"\n : \"space-y-1.5\",\n className,\n )}\n {...props}\n />\n );\n});\nField.displayName = \"Field\";\n\n/**\n * FieldGroup - Container for multiple related fields\n *\n * Used to group fields together (e.g., first name + last name in a row)\n */\nconst FieldGroup = React.forwardRef<\n HTMLDivElement,\n React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => {\n return (\n <div\n ref={ref}\n data-slot=\"field-group\"\n className={cn(\"flex flex-col gap-4\", className)}\n {...props}\n />\n );\n});\nFieldGroup.displayName = \"FieldGroup\";\n\n/**\n * FieldLabel - Label component for form fields\n *\n * Wrapper around ShadCN Label with consistent styling\n */\nconst FieldLabel = React.forwardRef<\n HTMLLabelElement,\n React.LabelHTMLAttributes<HTMLLabelElement> & {\n required?: boolean;\n }\n>(({ className, required, children, ...props }, ref) => {\n return (\n <Label\n ref={ref}\n data-slot=\"field-label\"\n className={cn(\n \"text-sm font-medium leading-none select-none\",\n \"peer-disabled:cursor-not-allowed peer-disabled:opacity-50\",\n className,\n )}\n {...props}\n >\n {children}\n {required && <span className=\"text-destructive ml-1\">*</span>}\n </Label>\n );\n});\nFieldLabel.displayName = \"FieldLabel\";\n\n/**\n * FieldDescription - Helper text for form fields\n *\n * Displays additional information or instructions for the field\n */\nconst FieldDescription = React.forwardRef<\n HTMLParagraphElement,\n React.HTMLAttributes<HTMLParagraphElement>\n>(({ className, ...props }, ref) => {\n return (\n <p\n ref={ref}\n data-slot=\"field-description\"\n className={cn(\"text-sm opacity-70\", className)}\n {...props}\n />\n );\n});\nFieldDescription.displayName = \"FieldDescription\";\n\n/**\n * FieldError - Error message display for form fields\n *\n * Shows validation errors with proper styling and accessibility\n */\nconst FieldError = React.forwardRef<\n HTMLParagraphElement,\n React.HTMLAttributes<HTMLParagraphElement>\n>(({ className, ...props }, ref) => {\n return (\n <p\n ref={ref}\n data-slot=\"field-error\"\n role=\"alert\"\n aria-live=\"polite\"\n className={cn(\"text-sm text-destructive\", className)}\n {...props}\n />\n );\n});\nFieldError.displayName = \"FieldError\";\n\nexport { Field, FieldGroup, FieldLabel, FieldDescription, FieldError };\n","import * as React from \"react\";\nimport { cn } from \"../../lib/utils\";\nimport { INPUT_AUTOFILL_RESET_CLASSES } from \"../../lib/utils\";\n\n/**\n * Input component - Optimized for dynamic theming across thousands of client brands\n *\n * CRITICAL: This component must work with dynamic Section backgrounds (light/dark/primary/etc)\n * Only uses CSS variables that adapt automatically - NO hardcoded semantic colors\n *\n * See: SHADCN_INTEGRATION_GUIDE.md for full documentation\n */\nconst Input = React.forwardRef<HTMLInputElement, React.ComponentProps<\"input\">>(\n ({ className, type, ...props }, ref) => {\n return (\n <input\n ref={ref}\n type={type}\n data-slot=\"input\"\n className={cn(\n // Core structure - no hardcoded colors, uses CSS variables\n \"flex h-9 w-full min-w-0 rounded-md border border-input\",\n \"bg-transparent px-3 py-1 text-base shadow-sm\",\n \"transition-colors outline-none md:text-sm\",\n\n // Focus state - uses ring-ring CSS variable (adapts to theme)\n \"focus-visible:ring-1 focus-visible:ring-ring\",\n\n // Error state - uses destructive CSS variables (adapts to theme)\n \"aria-invalid:border-destructive aria-invalid:ring-1 aria-invalid:ring-destructive\",\n\n // Disabled state - no color hardcoding\n \"disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50\",\n\n // File input specific - inherits text color from parent\n \"file:inline-flex file:h-7 file:border-0 file:bg-transparent\",\n \"file:text-sm file:font-medium\",\n\n // Autofill reset - prevents browser from overriding our dynamic colors\n INPUT_AUTOFILL_RESET_CLASSES,\n\n className,\n )}\n {...props}\n />\n );\n },\n);\nInput.displayName = \"Input\";\n\nexport { Input };\n","\"use client\";\n\nimport * as React from \"react\";\nimport type { InputProps } from \"../core/types\";\nimport { Input } from \"../components/ui/input\";\nimport { cn } from \"../lib/utils\";\n\n/**\n * TextInput - High-performance text input component (ShadCN-based)\n *\n * Built on ShadCN Input component with form-specific behavior:\n * - Error state handling\n * - Valid value indicator (ring-2)\n * - Form integration (onChange, onBlur)\n * - Full accessibility support\n *\n * @example\n * ```tsx\n * const form = useForm({ initialValues: { email: '' } });\n *\n * <TextInput\n * {...form.getFieldProps('email')}\n * type=\"email\"\n * placeholder=\"Enter your email\"\n * error={!!form.errors.email}\n * aria-invalid={!!form.errors.email}\n * aria-describedby={form.errors.email ? 'email-error' : undefined}\n * />\n * ```\n *\n * @see https://opensite.ai/developers/page-speed/forms/text-input\n */\nexport function TextInput({\n name,\n value,\n onChange,\n onBlur,\n placeholder,\n disabled = false,\n required = false,\n error = false,\n className = \"\",\n type = \"text\",\n id = \"text\",\n suppressValueRing = false,\n ...props\n}: InputProps<string> & {\n type?: \"text\" | \"email\" | \"password\" | \"url\" | \"tel\" | \"search\";\n /**\n * When true, suppresses the `ring-2 ring-ring` applied when a value is\n * present. Use this when the component is embedded inside a wrapper (e.g.\n * ButtonGroupForm) that renders its own unified ring.\n */\n suppressValueRing?: boolean;\n}) {\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n onChange(e.target.value);\n };\n\n const handleBlur = () => {\n onBlur?.();\n };\n\n const hasValue = String(value ?? \"\").trim().length > 0;\n\n return (\n <Input\n type={type}\n id={id}\n name={name}\n value={value ?? \"\"}\n onChange={handleChange}\n onBlur={handleBlur}\n placeholder={placeholder}\n disabled={disabled}\n required={required}\n className={cn(\n // Valid value indicator - ring-2 when has value, no error, and not suppressed\n !suppressValueRing && !error && hasValue && \"ring-2 ring-ring\",\n // Error state - handled by Input component via aria-invalid\n className,\n )}\n aria-invalid={error || props[\"aria-invalid\"]}\n aria-describedby={props[\"aria-describedby\"]}\n aria-required={required || props[\"aria-required\"]}\n {...props}\n />\n );\n}\n\nTextInput.displayName = \"TextInput\";\n","import * as React from \"react\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\nimport { Slot } from \"radix-ui\"\n\nimport { cn } from \"../../lib/utils\"\n\nconst buttonVariants = cva(\n \"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 aria-invalid:border-destructive\",\n {\n variants: {\n variant: {\n default: \"bg-primary text-primary-foreground hover:bg-primary/90\",\n destructive:\n \"bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20\",\n outline:\n \"border border-input bg-transparent shadow-xs hover:bg-accent hover:text-accent-foreground\",\n secondary:\n \"bg-secondary text-secondary-foreground hover:bg-secondary/80\",\n ghost:\n \"hover:bg-accent hover:text-accent-foreground\",\n link: \"text-primary underline-offset-4 hover:underline\",\n },\n size: {\n default: \"h-9 px-4 py-2 has-[>svg]:px-3\",\n xs: \"h-6 gap-1 rounded-md px-2 text-xs has-[>svg]:px-1.5 [&_svg:not([class*='size-'])]:size-3\",\n sm: \"h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5\",\n lg: \"h-10 rounded-md px-6 has-[>svg]:px-4\",\n icon: \"size-9\",\n \"icon-xs\": \"size-6 rounded-md [&_svg:not([class*='size-'])]:size-3\",\n \"icon-sm\": \"size-8\",\n \"icon-lg\": \"size-10\",\n },\n },\n defaultVariants: {\n variant: \"default\",\n size: \"default\",\n },\n }\n)\n\nfunction Button({\n className,\n variant = \"default\",\n size = \"default\",\n asChild = false,\n ...props\n}: React.ComponentProps<\"button\"> &\n VariantProps<typeof buttonVariants> & {\n asChild?: boolean\n }) {\n const Comp = asChild ? Slot.Root : \"button\"\n\n return (\n <Comp\n data-slot=\"button\"\n data-variant={variant}\n data-size={size}\n className={cn(buttonVariants({ variant, size, className }))}\n {...props}\n />\n )\n}\n\nexport { Button, buttonVariants }\n","\"use client\";\n\nimport * as React from \"react\";\nimport type { ReactNode } from \"react\";\nimport { FieldDescription, FieldLabel } from \"../components/ui/field\";\nimport { cn } from \"../lib/utils\";\n\nexport type LabelGroupProps = {\n variant?: \"legend\" | \"label\" | \"text\";\n secondary?: ReactNode;\n secondaryId?: string;\n primary?: ReactNode;\n labelHtmlFor?: string;\n required?: boolean;\n primaryClassName?: string;\n secondaryClassName?: string;\n};\n\nconst LabelGroup = ({\n labelHtmlFor,\n required = false,\n variant = \"label\",\n secondaryId,\n secondary,\n primary,\n primaryClassName,\n secondaryClassName,\n}: LabelGroupProps) => {\n const primaryClasses = cn(\n \"text-sm font-medium leading-snug\",\n variant === \"legend\" ? \"mb-1.5\" : \"mb-1 block\",\n primaryClassName,\n );\n\n const requiredIndicator =\n required && variant !== \"label\" ? (\n <span className=\"text-destructive pl-0.5\" aria-label=\"required\">\n *\n </span>\n ) : null;\n\n let primaryElement: ReactNode = null;\n if (primary) {\n if (variant === \"label\") {\n primaryElement = (\n <FieldLabel\n htmlFor={labelHtmlFor}\n required={required}\n className={primaryClasses}\n >\n {primary}\n </FieldLabel>\n );\n } else if (variant === \"legend\") {\n primaryElement = (\n <legend data-slot=\"field-legend\" className={primaryClasses}>\n {primary}\n {requiredIndicator}\n </legend>\n );\n } else {\n primaryElement = (\n <div data-slot=\"field-label\" className={primaryClasses}>\n {primary}\n {requiredIndicator}\n </div>\n );\n }\n }\n\n const secondaryElement = secondary ? (\n <FieldDescription\n id={secondaryId}\n className={cn(\"leading-normal font-normal\", secondaryClassName)}\n >\n {secondary}\n </FieldDescription>\n ) : null;\n\n if (!primaryElement && !secondaryElement) return null;\n\n // Legend should remain a direct child of fieldset for proper semantics.\n if (variant === \"legend\") {\n return (\n <>\n {primaryElement}\n {secondaryElement}\n </>\n );\n }\n\n return (\n <div className=\"flex flex-1 flex-col gap-0.5\">\n {primaryElement}\n {secondaryElement}\n </div>\n );\n};\n\nexport { LabelGroup };\n"]}
package/dist/core.cjs CHANGED
@@ -1,38 +1,38 @@
1
1
  'use strict';
2
2
 
3
3
  require('./chunk-V7JSGFCI.cjs');
4
- var chunk33XRILGQ_cjs = require('./chunk-33XRILGQ.cjs');
5
- require('./chunk-QMWZLGON.cjs');
4
+ var chunkDKLPYENR_cjs = require('./chunk-DKLPYENR.cjs');
5
+ require('./chunk-WQ4HD5UD.cjs');
6
6
 
7
7
 
8
8
 
9
9
  Object.defineProperty(exports, "ButtonGroupForm", {
10
10
  enumerable: true,
11
- get: function () { return chunk33XRILGQ_cjs.ButtonGroupForm; }
11
+ get: function () { return chunkDKLPYENR_cjs.ButtonGroupForm; }
12
12
  });
13
13
  Object.defineProperty(exports, "Field", {
14
14
  enumerable: true,
15
- get: function () { return chunk33XRILGQ_cjs.Field; }
15
+ get: function () { return chunkDKLPYENR_cjs.Field; }
16
16
  });
17
17
  Object.defineProperty(exports, "Form", {
18
18
  enumerable: true,
19
- get: function () { return chunk33XRILGQ_cjs.Form; }
19
+ get: function () { return chunkDKLPYENR_cjs.Form; }
20
20
  });
21
21
  Object.defineProperty(exports, "FormContext", {
22
22
  enumerable: true,
23
- get: function () { return chunk33XRILGQ_cjs.FormContext; }
23
+ get: function () { return chunkDKLPYENR_cjs.FormContext; }
24
24
  });
25
25
  Object.defineProperty(exports, "FormFeedback", {
26
26
  enumerable: true,
27
- get: function () { return chunk33XRILGQ_cjs.FormFeedback; }
27
+ get: function () { return chunkDKLPYENR_cjs.FormFeedback; }
28
28
  });
29
29
  Object.defineProperty(exports, "useField", {
30
30
  enumerable: true,
31
- get: function () { return chunk33XRILGQ_cjs.useField; }
31
+ get: function () { return chunkDKLPYENR_cjs.useField; }
32
32
  });
33
33
  Object.defineProperty(exports, "useForm", {
34
34
  enumerable: true,
35
- get: function () { return chunk33XRILGQ_cjs.useForm; }
35
+ get: function () { return chunkDKLPYENR_cjs.useForm; }
36
36
  });
37
37
  //# sourceMappingURL=core.cjs.map
38
38
  //# sourceMappingURL=core.cjs.map
package/dist/core.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import './chunk-UBDA7CS5.js';
2
- export { ButtonGroupForm, Field, Form, FormContext, FormFeedback, useField, useForm } from './chunk-6TCB3X5J.js';
3
- import './chunk-J37BGNM6.js';
2
+ export { ButtonGroupForm, Field, Form, FormContext, FormFeedback, useField, useForm } from './chunk-BW752X33.js';
3
+ import './chunk-SUF7WJS6.js';
4
4
  //# sourceMappingURL=core.js.map
5
5
  //# sourceMappingURL=core.js.map
package/dist/index.cjs CHANGED
@@ -1,54 +1,54 @@
1
1
  'use strict';
2
2
 
3
3
  require('./chunk-V7JSGFCI.cjs');
4
- var chunk33XRILGQ_cjs = require('./chunk-33XRILGQ.cjs');
5
- var chunkQMWZLGON_cjs = require('./chunk-QMWZLGON.cjs');
4
+ var chunkDKLPYENR_cjs = require('./chunk-DKLPYENR.cjs');
5
+ var chunkWQ4HD5UD_cjs = require('./chunk-WQ4HD5UD.cjs');
6
6
 
7
7
 
8
8
 
9
9
  Object.defineProperty(exports, "Field", {
10
10
  enumerable: true,
11
- get: function () { return chunk33XRILGQ_cjs.Field; }
11
+ get: function () { return chunkDKLPYENR_cjs.Field; }
12
12
  });
13
13
  Object.defineProperty(exports, "Form", {
14
14
  enumerable: true,
15
- get: function () { return chunk33XRILGQ_cjs.Form; }
15
+ get: function () { return chunkDKLPYENR_cjs.Form; }
16
16
  });
17
17
  Object.defineProperty(exports, "FormContext", {
18
18
  enumerable: true,
19
- get: function () { return chunk33XRILGQ_cjs.FormContext; }
19
+ get: function () { return chunkDKLPYENR_cjs.FormContext; }
20
20
  });
21
21
  Object.defineProperty(exports, "FormFeedback", {
22
22
  enumerable: true,
23
- get: function () { return chunk33XRILGQ_cjs.FormFeedback; }
23
+ get: function () { return chunkDKLPYENR_cjs.FormFeedback; }
24
24
  });
25
25
  Object.defineProperty(exports, "useField", {
26
26
  enumerable: true,
27
- get: function () { return chunk33XRILGQ_cjs.useField; }
27
+ get: function () { return chunkDKLPYENR_cjs.useField; }
28
28
  });
29
29
  Object.defineProperty(exports, "useForm", {
30
30
  enumerable: true,
31
- get: function () { return chunk33XRILGQ_cjs.useForm; }
31
+ get: function () { return chunkDKLPYENR_cjs.useForm; }
32
32
  });
33
33
  Object.defineProperty(exports, "FieldDescription", {
34
34
  enumerable: true,
35
- get: function () { return chunkQMWZLGON_cjs.FieldDescription; }
35
+ get: function () { return chunkWQ4HD5UD_cjs.FieldDescription; }
36
36
  });
37
37
  Object.defineProperty(exports, "FieldError", {
38
38
  enumerable: true,
39
- get: function () { return chunkQMWZLGON_cjs.FieldError; }
39
+ get: function () { return chunkWQ4HD5UD_cjs.FieldError; }
40
40
  });
41
41
  Object.defineProperty(exports, "FieldGroup", {
42
42
  enumerable: true,
43
- get: function () { return chunkQMWZLGON_cjs.FieldGroup; }
43
+ get: function () { return chunkWQ4HD5UD_cjs.FieldGroup; }
44
44
  });
45
45
  Object.defineProperty(exports, "FieldWrapper", {
46
46
  enumerable: true,
47
- get: function () { return chunkQMWZLGON_cjs.Field; }
47
+ get: function () { return chunkWQ4HD5UD_cjs.Field; }
48
48
  });
49
49
  Object.defineProperty(exports, "FormFieldLabel", {
50
50
  enumerable: true,
51
- get: function () { return chunkQMWZLGON_cjs.FieldLabel; }
51
+ get: function () { return chunkWQ4HD5UD_cjs.FieldLabel; }
52
52
  });
53
53
  //# sourceMappingURL=index.cjs.map
54
54
  //# sourceMappingURL=index.cjs.map
package/dist/index.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import './chunk-UBDA7CS5.js';
2
- export { Field, Form, FormContext, FormFeedback, useField, useForm } from './chunk-6TCB3X5J.js';
3
- export { FieldDescription, FieldError, FieldGroup, Field as FieldWrapper, FieldLabel as FormFieldLabel } from './chunk-J37BGNM6.js';
2
+ export { Field, Form, FormContext, FormFeedback, useField, useForm } from './chunk-BW752X33.js';
3
+ export { FieldDescription, FieldError, FieldGroup, Field as FieldWrapper, FieldLabel as FormFieldLabel } from './chunk-SUF7WJS6.js';
4
4
  //# sourceMappingURL=index.js.map
5
5
  //# sourceMappingURL=index.js.map
package/dist/inputs.cjs CHANGED
@@ -1,57 +1,57 @@
1
1
  'use strict';
2
2
 
3
- var chunkI4EKHIVF_cjs = require('./chunk-I4EKHIVF.cjs');
4
- var chunkQMWZLGON_cjs = require('./chunk-QMWZLGON.cjs');
3
+ var chunkER3C5JAE_cjs = require('./chunk-ER3C5JAE.cjs');
4
+ var chunkWQ4HD5UD_cjs = require('./chunk-WQ4HD5UD.cjs');
5
5
 
6
6
 
7
7
 
8
8
  Object.defineProperty(exports, "Checkbox", {
9
9
  enumerable: true,
10
- get: function () { return chunkI4EKHIVF_cjs.Checkbox; }
10
+ get: function () { return chunkER3C5JAE_cjs.Checkbox; }
11
11
  });
12
12
  Object.defineProperty(exports, "CheckboxGroup", {
13
13
  enumerable: true,
14
- get: function () { return chunkI4EKHIVF_cjs.CheckboxGroup; }
14
+ get: function () { return chunkER3C5JAE_cjs.CheckboxGroup; }
15
15
  });
16
16
  Object.defineProperty(exports, "DatePicker", {
17
17
  enumerable: true,
18
- get: function () { return chunkI4EKHIVF_cjs.DatePicker; }
18
+ get: function () { return chunkER3C5JAE_cjs.DatePicker; }
19
19
  });
20
20
  Object.defineProperty(exports, "DateRangePicker", {
21
21
  enumerable: true,
22
- get: function () { return chunkI4EKHIVF_cjs.DateRangePicker; }
22
+ get: function () { return chunkER3C5JAE_cjs.DateRangePicker; }
23
23
  });
24
24
  Object.defineProperty(exports, "FileInput", {
25
25
  enumerable: true,
26
- get: function () { return chunkI4EKHIVF_cjs.FileInput; }
26
+ get: function () { return chunkER3C5JAE_cjs.FileInput; }
27
27
  });
28
28
  Object.defineProperty(exports, "MultiSelect", {
29
29
  enumerable: true,
30
- get: function () { return chunkI4EKHIVF_cjs.MultiSelect; }
30
+ get: function () { return chunkER3C5JAE_cjs.MultiSelect; }
31
31
  });
32
32
  Object.defineProperty(exports, "Radio", {
33
33
  enumerable: true,
34
- get: function () { return chunkI4EKHIVF_cjs.Radio; }
34
+ get: function () { return chunkER3C5JAE_cjs.Radio; }
35
35
  });
36
36
  Object.defineProperty(exports, "Select", {
37
37
  enumerable: true,
38
- get: function () { return chunkI4EKHIVF_cjs.Select; }
38
+ get: function () { return chunkER3C5JAE_cjs.Select; }
39
39
  });
40
40
  Object.defineProperty(exports, "Switch", {
41
41
  enumerable: true,
42
- get: function () { return chunkI4EKHIVF_cjs.Switch; }
42
+ get: function () { return chunkER3C5JAE_cjs.Switch; }
43
43
  });
44
44
  Object.defineProperty(exports, "TextArea", {
45
45
  enumerable: true,
46
- get: function () { return chunkI4EKHIVF_cjs.TextArea; }
46
+ get: function () { return chunkER3C5JAE_cjs.TextArea; }
47
47
  });
48
48
  Object.defineProperty(exports, "TimePicker", {
49
49
  enumerable: true,
50
- get: function () { return chunkI4EKHIVF_cjs.TimePicker; }
50
+ get: function () { return chunkER3C5JAE_cjs.TimePicker; }
51
51
  });
52
52
  Object.defineProperty(exports, "TextInput", {
53
53
  enumerable: true,
54
- get: function () { return chunkQMWZLGON_cjs.TextInput; }
54
+ get: function () { return chunkWQ4HD5UD_cjs.TextInput; }
55
55
  });
56
56
  //# sourceMappingURL=inputs.cjs.map
57
57
  //# sourceMappingURL=inputs.cjs.map
package/dist/inputs.js CHANGED
@@ -1,4 +1,4 @@
1
- export { Checkbox, CheckboxGroup, DatePicker, DateRangePicker, FileInput, MultiSelect, Radio, Select, Switch, TextArea, TimePicker } from './chunk-AI5Q4N6D.js';
2
- export { TextInput } from './chunk-J37BGNM6.js';
1
+ export { Checkbox, CheckboxGroup, DatePicker, DateRangePicker, FileInput, MultiSelect, Radio, Select, Switch, TextArea, TimePicker } from './chunk-5BAN5ICD.js';
2
+ export { TextInput } from './chunk-SUF7WJS6.js';
3
3
  //# sourceMappingURL=inputs.js.map
4
4
  //# sourceMappingURL=inputs.js.map
@@ -1,8 +1,8 @@
1
1
  'use strict';
2
2
 
3
- var chunk33XRILGQ_cjs = require('./chunk-33XRILGQ.cjs');
4
- var chunkI4EKHIVF_cjs = require('./chunk-I4EKHIVF.cjs');
5
- var chunkQMWZLGON_cjs = require('./chunk-QMWZLGON.cjs');
3
+ var chunkDKLPYENR_cjs = require('./chunk-DKLPYENR.cjs');
4
+ var chunkER3C5JAE_cjs = require('./chunk-ER3C5JAE.cjs');
5
+ var chunkWQ4HD5UD_cjs = require('./chunk-WQ4HD5UD.cjs');
6
6
  var React2 = require('react');
7
7
 
8
8
  function _interopNamespace(e) {
@@ -394,7 +394,8 @@ function generateValidationSchema(fields) {
394
394
  acc[field.name] = (value, allValues) => {
395
395
  if (field.required) {
396
396
  if (!value || typeof value === "string" && !value.trim()) {
397
- return `${field.label} is required`;
397
+ const displayName = field.label || chunkWQ4HD5UD_cjs.humanizeFieldName(field.name);
398
+ return `${displayName} is required`;
398
399
  }
399
400
  }
400
401
  if (field.type === "email" && value) {
@@ -565,7 +566,7 @@ function useContactForm(options) {
565
566
  window.location.assign(destination);
566
567
  }, 150);
567
568
  }, [navigate, redirectUrl]);
568
- const form = chunk33XRILGQ_cjs.useForm({
569
+ const form = chunkDKLPYENR_cjs.useForm({
569
570
  initialValues: React2.useMemo(
570
571
  () => generateInitialValues(formFields),
571
572
  [formFields]
@@ -643,7 +644,7 @@ function DynamicFormField({
643
644
  const usesInlineCheckboxLabel = field.type === "checkbox";
644
645
  const shouldRenderFieldLabel = renderLabel && !usesGroupLegend && !usesInlineCheckboxLabel;
645
646
  return /* @__PURE__ */ React2__namespace.createElement(
646
- chunk33XRILGQ_cjs.Field,
647
+ chunkDKLPYENR_cjs.Field,
647
648
  {
648
649
  name: field.name,
649
650
  label: shouldRenderFieldLabel ? field.label : void 0,
@@ -652,7 +653,7 @@ function DynamicFormField({
652
653
  className
653
654
  },
654
655
  ({ field: formField, meta }) => /* @__PURE__ */ React2__namespace.createElement("div", null, (field.type === "text" || field.type === "email" || field.type === "tel" || field.type === "search" || field.type === "password" || field.type === "url") && /* @__PURE__ */ React2__namespace.createElement(
655
- chunkQMWZLGON_cjs.TextInput,
656
+ chunkWQ4HD5UD_cjs.TextInput,
656
657
  {
657
658
  ...formField,
658
659
  id: fieldId,
@@ -663,7 +664,7 @@ function DynamicFormField({
663
664
  "aria-label": field.label
664
665
  }
665
666
  ), field.type === "number" && /* @__PURE__ */ React2__namespace.createElement(
666
- chunkQMWZLGON_cjs.TextInput,
667
+ chunkWQ4HD5UD_cjs.TextInput,
667
668
  {
668
669
  ...formField,
669
670
  id: fieldId,
@@ -674,7 +675,7 @@ function DynamicFormField({
674
675
  "aria-label": field.label
675
676
  }
676
677
  ), field.type === "textarea" && /* @__PURE__ */ React2__namespace.createElement(
677
- chunkI4EKHIVF_cjs.TextArea,
678
+ chunkER3C5JAE_cjs.TextArea,
678
679
  {
679
680
  ...formField,
680
681
  id: fieldId,
@@ -685,7 +686,7 @@ function DynamicFormField({
685
686
  "aria-label": field.label
686
687
  }
687
688
  ), field.type === "select" && field.options && /* @__PURE__ */ React2__namespace.createElement(
688
- chunkI4EKHIVF_cjs.Select,
689
+ chunkER3C5JAE_cjs.Select,
689
690
  {
690
691
  ...formField,
691
692
  id: fieldId,
@@ -696,7 +697,7 @@ function DynamicFormField({
696
697
  "aria-label": field.label
697
698
  }
698
699
  ), field.type === "multi-select" && field.options && /* @__PURE__ */ React2__namespace.createElement(
699
- chunkI4EKHIVF_cjs.MultiSelect,
700
+ chunkER3C5JAE_cjs.MultiSelect,
700
701
  {
701
702
  ...formField,
702
703
  id: fieldId,
@@ -707,7 +708,7 @@ function DynamicFormField({
707
708
  "aria-label": field.label
708
709
  }
709
710
  ), field.type === "radio" && field.options && /* @__PURE__ */ React2__namespace.createElement(
710
- chunkI4EKHIVF_cjs.Radio,
711
+ chunkER3C5JAE_cjs.Radio,
711
712
  {
712
713
  ...formField,
713
714
  id: fieldId,
@@ -721,7 +722,7 @@ function DynamicFormField({
721
722
  "aria-label": field.label
722
723
  }
723
724
  ), field.type === "checkbox" && /* @__PURE__ */ React2__namespace.createElement(
724
- chunkI4EKHIVF_cjs.Checkbox,
725
+ chunkER3C5JAE_cjs.Checkbox,
725
726
  {
726
727
  ...formField,
727
728
  id: fieldId,
@@ -735,7 +736,7 @@ function DynamicFormField({
735
736
  "aria-label": field.label
736
737
  }
737
738
  ), field.type === "checkbox-group" && field.options && /* @__PURE__ */ React2__namespace.createElement(
738
- chunkI4EKHIVF_cjs.CheckboxGroup,
739
+ chunkER3C5JAE_cjs.CheckboxGroup,
739
740
  {
740
741
  ...formField,
741
742
  id: fieldId,
@@ -749,7 +750,7 @@ function DynamicFormField({
749
750
  "aria-label": field.label
750
751
  }
751
752
  ), (field.type === "date-picker" || field.type === "date") && /* @__PURE__ */ React2__namespace.createElement(
752
- chunkI4EKHIVF_cjs.DatePicker,
753
+ chunkER3C5JAE_cjs.DatePicker,
753
754
  {
754
755
  ...formField,
755
756
  id: fieldId,
@@ -759,7 +760,7 @@ function DynamicFormField({
759
760
  "aria-label": field.label
760
761
  }
761
762
  ), field.type === "date-range" && /* @__PURE__ */ React2__namespace.createElement(
762
- chunkI4EKHIVF_cjs.DateRangePicker,
763
+ chunkER3C5JAE_cjs.DateRangePicker,
763
764
  {
764
765
  ...formField,
765
766
  id: fieldId,
@@ -769,7 +770,7 @@ function DynamicFormField({
769
770
  "aria-label": field.label
770
771
  }
771
772
  ), field.type === "time" && /* @__PURE__ */ React2__namespace.createElement(
772
- chunkI4EKHIVF_cjs.TimePicker,
773
+ chunkER3C5JAE_cjs.TimePicker,
773
774
  {
774
775
  ...formField,
775
776
  id: fieldId,
@@ -779,7 +780,7 @@ function DynamicFormField({
779
780
  "aria-label": field.label
780
781
  }
781
782
  ), field.type === "file" && /* @__PURE__ */ React2__namespace.createElement(
782
- chunkI4EKHIVF_cjs.FileInput,
783
+ chunkER3C5JAE_cjs.FileInput,
783
784
  {
784
785
  ...formField,
785
786
  id: fieldId,
@@ -919,7 +920,7 @@ function FormEngine(props) {
919
920
  };
920
921
  }, [isButtonGroup, buttonGroupSetup, api]);
921
922
  return /* @__PURE__ */ React2__namespace.createElement("div", { className: styleRules?.formContainer }, /* @__PURE__ */ React2__namespace.createElement(
922
- chunk33XRILGQ_cjs.Form,
923
+ chunkDKLPYENR_cjs.Form,
923
924
  {
924
925
  form,
925
926
  fields: isButtonGroup ? formFields : void 0,
@@ -939,7 +940,7 @@ function FormEngine(props) {
939
940
  !isButtonGroup && /* @__PURE__ */ React2__namespace.createElement(React2__namespace.Fragment, null, /* @__PURE__ */ React2__namespace.createElement(
940
941
  "div",
941
942
  {
942
- className: chunkQMWZLGON_cjs.cn(
943
+ className: chunkWQ4HD5UD_cjs.cn(
943
944
  "grid grid-cols-12 gap-6 md:gap-10",
944
945
  styleRules?.fieldsContainer
945
946
  )
@@ -948,7 +949,7 @@ function FormEngine(props) {
948
949
  "div",
949
950
  {
950
951
  key: field.name,
951
- className: chunkQMWZLGON_cjs.cn(
952
+ className: chunkWQ4HD5UD_cjs.cn(
952
953
  getColumnSpanClass(field.columnSpan ?? 12),
953
954
  "min-w-0"
954
955
  )
@@ -966,7 +967,7 @@ function FormEngine(props) {
966
967
  )
967
968
  ))
968
969
  ), /* @__PURE__ */ React2__namespace.createElement(
969
- chunkQMWZLGON_cjs.Button,
970
+ chunkWQ4HD5UD_cjs.Button,
970
971
  {
971
972
  type: "submit",
972
973
  variant: submitButtonSetup?.submitVariant ?? DEFAULT_BUTTON_VARIANT,