@page-speed/forms 0.7.3 → 0.7.4

package/dist/chunk-PDMFWP5I.cjs.map

@@ -0,0 +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":"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","file":"chunk-PDMFWP5I.cjs","sourcesContent":["import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\nimport { FormFieldConfig } from \"../integration\";\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\n/**\n * Converts a field name (snake_case or camelCase) to a human-readable label.\n *\n * @example\n * fieldIsChoiceCard(field) // false\n */\nexport function fieldIsChoiceCard(field: FormFieldConfig) {\n  if ([\"radio\", \"checkbox-group\"].includes(field.type)) {\n    return field?.options\n      ? field?.options?.some((opt) => opt.description)\n      : false;\n  } else {\n    return false;\n  }\n}\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 * - Optional start/end icon support with automatic padding\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  iconStart,\n  iconEnd,\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   * Optional icon rendered at the start (left) of the input.\n   * Automatically adjusts input padding when provided.\n   */\n  iconStart?: React.ReactNode;\n  /**\n   * Optional icon rendered at the end (right) of the input.\n   * Automatically adjusts input padding when provided.\n   */\n  iconEnd?: React.ReactNode;\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  const hasIconStart = Boolean(iconStart);\n  const hasIconEnd = Boolean(iconEnd);\n\n  if (hasIconStart || hasIconEnd) {\n    return (\n      <div className=\"relative\">\n        {hasIconStart && (\n          <span\n            className=\"absolute left-3 top-1/2 -translate-y-1/2 pointer-events-none\"\n            aria-hidden=\"true\"\n          >\n            {iconStart}\n          </span>\n        )}\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            !suppressValueRing && !error && hasValue && \"ring-2 ring-ring\",\n            hasIconStart && \"pl-10\",\n            hasIconEnd && \"pr-10\",\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        {hasIconEnd && (\n          <span\n            className=\"absolute right-3 top-1/2 -translate-y-1/2 pointer-events-none\"\n            aria-hidden=\"true\"\n          >\n            {iconEnd}\n          </span>\n        )}\n      </div>\n    );\n  }\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-2.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/{chunk-SUF7WJS6.js → chunk-QHAQYOBT.js}

@@ -14,6 +14,13 @@ function humanizeFieldName(name) {
   return words.charAt(0).toUpperCase() + words.slice(1);
 }
 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]";
+function fieldIsChoiceCard(field) {
+  if (["radio", "checkbox-group"].includes(field.type)) {
+    return field?.options ? field?.options?.some((opt) => opt.description) : false;
+  } else {
+    return false;
+  }
+}
 
 // src/components/ui/label.tsx
 function Label({
@@ -157,6 +164,8 @@ function TextInput({
   type = "text",
   id = "text",
   suppressValueRing = false,
+  iconStart,
+  iconEnd,
   ...props
 }) {
   const handleChange = (e) => {
@@ -166,6 +175,48 @@ function TextInput({
     onBlur?.();
   };
   const hasValue = String(value ?? "").trim().length > 0;
+  const hasIconStart = Boolean(iconStart);
+  const hasIconEnd = Boolean(iconEnd);
+  if (hasIconStart || hasIconEnd) {
+    return /* @__PURE__ */ React2.createElement("div", { className: "relative" }, hasIconStart && /* @__PURE__ */ React2.createElement(
+      "span",
+      {
+        className: "absolute left-3 top-1/2 -translate-y-1/2 pointer-events-none",
+        "aria-hidden": "true"
+      },
+      iconStart
+    ), /* @__PURE__ */ React2.createElement(
+      Input,
+      {
+        type,
+        id,
+        name,
+        value: value ?? "",
+        onChange: handleChange,
+        onBlur: handleBlur,
+        placeholder,
+        disabled,
+        required,
+        className: cn(
+          !suppressValueRing && !error && hasValue && "ring-2 ring-ring",
+          hasIconStart && "pl-10",
+          hasIconEnd && "pr-10",
+          className
+        ),
+        "aria-invalid": error || props["aria-invalid"],
+        "aria-describedby": props["aria-describedby"],
+        "aria-required": required || props["aria-required"],
+        ...props
+      }
+    ), hasIconEnd && /* @__PURE__ */ React2.createElement(
+      "span",
+      {
+        className: "absolute right-3 top-1/2 -translate-y-1/2 pointer-events-none",
+        "aria-hidden": "true"
+      },
+      iconEnd
+    ));
+  }
   return /* @__PURE__ */ React2.createElement(
     Input,
     {
@@ -252,7 +303,7 @@ var LabelGroup = ({
 }) => {
   const primaryClasses = cn(
     "text-sm font-medium leading-snug",
-    variant === "legend" ? "mb-1.5" : "mb-1 block",
+    variant === "legend" ? "mb-2.5" : "mb-1 block",
     primaryClassName
   );
   const requiredIndicator = required && variant !== "label" ? /* @__PURE__ */ React2.createElement("span", { className: "text-destructive pl-0.5", "aria-label": "required" }, "*") : null;
@@ -289,6 +340,6 @@ var LabelGroup = ({
   return /* @__PURE__ */ React2.createElement("div", { className: "flex flex-1 flex-col gap-0.5" }, primaryElement, secondaryElement);
 };
 
-export { Button, Field, FieldDescription, FieldError, FieldGroup, FieldLabel, INPUT_AUTOFILL_RESET_CLASSES, Input, LabelGroup, TextInput, buttonVariants, cn, humanizeFieldName };
-//# sourceMappingURL=chunk-SUF7WJS6.js.map
-//# sourceMappingURL=chunk-SUF7WJS6.js.map
+export { Button, Field, FieldDescription, FieldError, FieldGroup, FieldLabel, INPUT_AUTOFILL_RESET_CLASSES, Input, LabelGroup, TextInput, buttonVariants, cn, fieldIsChoiceCard, humanizeFieldName };
+//# sourceMappingURL=chunk-QHAQYOBT.js.map
+//# sourceMappingURL=chunk-QHAQYOBT.js.map

package/dist/chunk-QHAQYOBT.js.map

@@ -0,0 +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-QHAQYOBT.js","sourcesContent":["import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\nimport { FormFieldConfig } from \"../integration\";\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\n/**\n * Converts a field name (snake_case or camelCase) to a human-readable label.\n *\n * @example\n * fieldIsChoiceCard(field) // false\n */\nexport function fieldIsChoiceCard(field: FormFieldConfig) {\n  if ([\"radio\", \"checkbox-group\"].includes(field.type)) {\n    return field?.options\n      ? field?.options?.some((opt) => opt.description)\n      : false;\n  } else {\n    return false;\n  }\n}\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 * - Optional start/end icon support with automatic padding\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  iconStart,\n  iconEnd,\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   * Optional icon rendered at the start (left) of the input.\n   * Automatically adjusts input padding when provided.\n   */\n  iconStart?: React.ReactNode;\n  /**\n   * Optional icon rendered at the end (right) of the input.\n   * Automatically adjusts input padding when provided.\n   */\n  iconEnd?: React.ReactNode;\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  const hasIconStart = Boolean(iconStart);\n  const hasIconEnd = Boolean(iconEnd);\n\n  if (hasIconStart || hasIconEnd) {\n    return (\n      <div className=\"relative\">\n        {hasIconStart && (\n          <span\n            className=\"absolute left-3 top-1/2 -translate-y-1/2 pointer-events-none\"\n            aria-hidden=\"true\"\n          >\n            {iconStart}\n          </span>\n        )}\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            !suppressValueRing && !error && hasValue && \"ring-2 ring-ring\",\n            hasIconStart && \"pl-10\",\n            hasIconEnd && \"pr-10\",\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        {hasIconEnd && (\n          <span\n            className=\"absolute right-3 top-1/2 -translate-y-1/2 pointer-events-none\"\n            aria-hidden=\"true\"\n          >\n            {iconEnd}\n          </span>\n        )}\n      </div>\n    );\n  }\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-2.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/{chunk-ZH6XDBWH.js → chunk-SF6NKDID.js}

@@ -1,10 +1,11 @@
-import { cn, FieldLabel, FieldDescription, LabelGroup, Field, INPUT_AUTOFILL_RESET_CLASSES, Button, Input, buttonVariants } from './chunk-SUF7WJS6.js';
+import { cn, FieldLabel, FieldDescription, LabelGroup, Field, INPUT_AUTOFILL_RESET_CLASSES, Button, Input, buttonVariants } from './chunk-QHAQYOBT.js';
 import * as React19 from 'react';
 import { Dialog as Dialog$1, Checkbox as Checkbox$1, RadioGroup as RadioGroup$1, Switch as Switch$1, Select as Select$1, Popover as Popover$1 } from 'radix-ui';
 import { Command as Command$1 } from 'cmdk';
 import { useDirection } from '@radix-ui/react-direction';
 import { Slot } from '@radix-ui/react-slot';
 import { getDefaultClassNames, DayPicker } from 'react-day-picker';
+import { Icon, DEFAULT_ICON_API_BASE_URL } from '@page-speed/icon';
 
 function Textarea({ className, ...props }) {
   return /* @__PURE__ */ React19.createElement(
@@ -13,7 +14,7 @@ function Textarea({ className, ...props }) {
       "data-slot": "textarea",
       className: cn(
         // Core structure - uses CSS variables only
-        "flex field-sizing-content min-h-16 w-full rounded-md border border-input",
+        "flex field-sizing-content min-h-32 w-full rounded-md border border-input",
         "bg-transparent px-3 py-2 text-base shadow-xs",
         "transition-[color,box-shadow] outline-none md:text-sm",
         // Focus state - uses ring-ring CSS variable
@@ -104,6 +105,7 @@ function Checkbox({
         "aria-invalid:border-destructive aria-invalid:ring-destructive/20",
         // Disabled state
         "disabled:cursor-not-allowed disabled:opacity-50",
+        " mt-1",
         className
       ),
       ...props
@@ -448,7 +450,17 @@ function Radio({
     return options.some((option) => option.description);
   }, [options]);
   const groupDescriptionId = description ? `${name}-description` : void 0;
-  return /* @__PURE__ */ React19.createElement("div", { className: cn("w-full", className), "data-invalid": error || void 0 }, (label || description) && /* @__PURE__ */ React19.createElement("div", { className: "mb-3 space-y-1" }, label && /* @__PURE__ */ React19.createElement("div", { className: "text-base font-medium leading-none" }, label), description && /* @__PURE__ */ React19.createElement(FieldDescription, { id: groupDescriptionId, className: "leading-snug" }, description)), /* @__PURE__ */ React19.createElement(
+  return /* @__PURE__ */ React19.createElement("div", { className: cn("w-full", className), "data-invalid": error || void 0 }, /* @__PURE__ */ React19.createElement(
+    LabelGroup,
+    {
+      labelHtmlFor: name,
+      required,
+      variant: "legend",
+      secondaryId: groupDescriptionId,
+      secondary: description,
+      primary: label
+    }
+  ), /* @__PURE__ */ React19.createElement(
     RadioGroup,
     {
       name,
@@ -458,8 +470,9 @@ function Radio({
       disabled,
       required,
       className: cn(
-        layout === "grid" && "grid grid-cols-1 md:grid-cols-2 gap-3",
-        layout === "inline" && "flex flex-wrap gap-0"
+        layout === "grid" && "grid grid-cols-1 md:grid-cols-2",
+        layout === "inline" && "flex flex-wrap",
+        useChoiceCard ? "gap-3" : "gap-0"
       ),
       "aria-invalid": error || props["aria-invalid"],
       "aria-describedby": groupDescriptionId || props["aria-describedby"],
@@ -476,8 +489,11 @@ function Radio({
           key: option.value,
           htmlFor: radioId,
           className: cn(
-            "flex gap-3 p-3 duration-200 select-auto font-normal leading-normal",
-            useChoiceCard && "border rounded-lg hover:ring-2 hover:ring-ring/50",
+            "flex gap-3 duration-200",
+            "select-auto font-normal leading-normal",
+            useChoiceCard && "hover:ring-2 hover:ring-ring",
+            useChoiceCard && "border rounded-lg p-3",
+            !useChoiceCard && "p-1",
             useChoiceCard && isSelected && "ring-2 ring-ring",
             useChoiceCard && error && "border-destructive",
             isDisabled ? "opacity-50 cursor-not-allowed" : "cursor-pointer"
@@ -2551,7 +2567,7 @@ function FileInput({
   value = [],
   onChange,
   onBlur,
-  placeholder = "Choose file...",
+  placeholder,
   disabled = false,
   required = false,
   error = false,
@@ -2829,7 +2845,26 @@ function FileInput({
       }
     };
   }, [imageToCrop]);
-  const fileCountLabel = normalizedValue.length > 0 ? `${normalizedValue.length} file(s) selected` : placeholder;
+  const dynamicPlaceholder = React19.useMemo(() => {
+    if (placeholder) {
+      return placeholder;
+    }
+    return `Drag & drop file${multiple ? "s" : ""} here`;
+  }, [multiple, placeholder]);
+  const metadataElement = React19.useMemo(() => {
+    const metaList = [];
+    if (accept) {
+      metaList.push(`Accepted: ${accept}`);
+    }
+    if (maxSize) {
+      metaList.push(`Max size: ${formatFileSize(maxSize)}`);
+    }
+    if (metaList.length > 0) {
+      return /* @__PURE__ */ React19.createElement("div", { className: "flex text-center items-center justify-center gap-4" }, metaList.map((str) => /* @__PURE__ */ React19.createElement("span", { key: str, className: "font-sm opacity-75" }, str)));
+    } else {
+      return null;
+    }
+  }, [accept, maxSize]);
   return /* @__PURE__ */ React19.createElement(React19.Fragment, null, /* @__PURE__ */ React19.createElement(
     FileUpload,
     {
@@ -2860,33 +2895,33 @@ function FileInput({
       FileUploadDropzone,
       {
         role: "button",
-        "aria-label": placeholder,
+        "aria-label": dynamicPlaceholder,
         className: cn(
-          "flex min-h-32 w-full cursor-pointer items-center justify-center border-input bg-transparent p-6 transition-colors",
-          "hover:bg-accent/50",
-          "data-[dragging]:bg-accent/50",
+          "flex min-h-32 w-full cursor-pointer",
+          "items-center justify-center border-input",
+          "bg-transparent p-6 transition-colors",
+          "data-[dragging]:ring-2 hover:ring-2",
           disabled && "cursor-not-allowed opacity-50",
           error && "border-destructive"
         )
       },
-      /* @__PURE__ */ React19.createElement("div", { className: "flex flex-col items-center gap-1 text-center" }, /* @__PURE__ */ React19.createElement("div", { className: "flex items-center justify-center rounded-full border p-2.5" }, /* @__PURE__ */ React19.createElement(
+      /* @__PURE__ */ React19.createElement("div", { className: "flex flex-col items-center gap-3 text-center" }, /* @__PURE__ */ React19.createElement("div", { className: "flex items-center justify-center rounded-full border p-2.5" }, /* @__PURE__ */ React19.createElement(
         "svg",
         {
-          width: "24",
-          height: "24",
+          width: "18",
+          height: "18",
           viewBox: "0 0 24 24",
           fill: "none",
           stroke: "currentColor",
           strokeWidth: "2",
           strokeLinecap: "round",
           strokeLinejoin: "round",
-          className: "text-muted-foreground",
           "aria-hidden": "true"
         },
         /* @__PURE__ */ React19.createElement("path", { d: "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" }),
         /* @__PURE__ */ React19.createElement("polyline", { points: "17 8 12 3 7 8" }),
         /* @__PURE__ */ React19.createElement("line", { x1: "12", y1: "3", x2: "12", y2: "15" })
-      )), /* @__PURE__ */ React19.createElement("p", { className: "text-sm font-medium" }, fileCountLabel), accept && /* @__PURE__ */ React19.createElement("p", { className: "text-muted-foreground text-xs" }, "Accepted: ", accept), /* @__PURE__ */ React19.createElement("p", { className: "text-muted-foreground text-xs" }, "Max size: ", formatFileSize(maxSize)))
+      )), /* @__PURE__ */ React19.createElement("div", { className: "flex flex-col items-center justify-center gap-1 text-center" }, /* @__PURE__ */ React19.createElement("p", { className: "text-sm font-medium" }, dynamicPlaceholder), metadataElement))
     ),
     /* @__PURE__ */ React19.createElement(FileUploadList, { className: "mt-4" }, normalizedValue.map((file, index) => {
       const progressValue = uploadProgress[file.name];
@@ -2896,9 +2931,12 @@ function FileInput({
         {
           key: `${file.name}-${index}`,
           value: file,
-          className: "flex items-center gap-3 border-border bg-card text-card-foreground hover:bg-accent/50 transition-colors"
+          className: cn(
+            "flex items-center gap-3",
+            "border-border bg-card text-card-foreground"
+          )
         },
-        showPreview ? /* @__PURE__ */ React19.createElement(FileUploadItemPreview, { className: "h-12 w-12 rounded [&>img]:h-full [&>img]:w-full [&>img]:object-cover [&>svg]:size-6" }) : null,
+        showPreview ? /* @__PURE__ */ React19.createElement(FileUploadItemPreview, { className: "size-12 rounded [&>img]:h-full [&>img]:w-full [&>img]:object-cover [&>svg]:size-6" }) : null,
         /* @__PURE__ */ React19.createElement("div", { className: "flex min-w-0 flex-1 flex-col" }, /* @__PURE__ */ React19.createElement(FileUploadItemMetadata, { className: "min-w-0" }), hasProgress && progressValue < 100 ? /* @__PURE__ */ React19.createElement("div", { className: "mt-1 flex items-center gap-2" }, /* @__PURE__ */ React19.createElement(
           "div",
           {
@@ -2916,7 +2954,7 @@ function FileInput({
               style: { width: `${progressValue}%` }
             }
           )
-        ), /* @__PURE__ */ React19.createElement("span", { className: "text-xs" }, progressValue, "%")) : null),
+        ), /* @__PURE__ */ React19.createElement("span", { className: "text-xs" }, progressValue, "%")) : /* @__PURE__ */ React19.createElement("span", { className: "text-xs" }, formatFileSize(file.size))),
         enableCropping && file.type.startsWith("image/") ? /* @__PURE__ */ React19.createElement(
           Button,
           {
@@ -2928,7 +2966,7 @@ function FileInput({
               handleCrop(file);
             },
             disabled,
-            className: "h-8 w-8 p-0",
+            className: "size-8 p-0",
             "aria-label": `Crop ${file.name}`
           },
           /* @__PURE__ */ React19.createElement(
@@ -2952,10 +2990,10 @@ function FileInput({
           Button,
           {
             type: "button",
-            variant: "ghost",
-            size: "icon",
+            variant: "outline",
+            size: "icon-sm",
             disabled,
-            className: "h-8 w-8 p-0",
+            className: "size-8 p-0",
             "aria-label": `Remove ${file.name}`
           },
           /* @__PURE__ */ React19.createElement(
@@ -3023,7 +3061,7 @@ function FileInput({
       /* @__PURE__ */ React19.createElement("div", { className: "p-4" }, /* @__PURE__ */ React19.createElement(
         "div",
         {
-          className: "relative h-96 w-full overflow-hidden rounded-md bg-accent/40",
+          className: "relative h-96 w-full overflow-hidden rounded-md",
           onMouseDown: (event) => {
             event.preventDefault();
             const startX = event.clientX - crop.x;
@@ -3107,7 +3145,7 @@ function FileInput({
           step: "0.1",
           value: zoom,
           onChange: (event) => onZoomChange(parseFloat(event.target.value)),
-          className: "h-2 flex-1 cursor-pointer appearance-none rounded-lg bg-accent/60",
+          className: "h-2 flex-1 cursor-pointer appearance-none rounded-lg bg-primary",
           "aria-label": "Zoom level"
         }
       ))),
@@ -3349,8 +3387,6 @@ function CalendarDayButton({
     }
   );
 }
-
-// src/inputs/DatePicker.tsx
 function formatDate(date, format) {
   if (!date) return "";
   const d = new Date(date);
@@ -3495,19 +3531,12 @@ function DatePicker({
       "aria-hidden": "true"
     },
     /* @__PURE__ */ React19.createElement(
-      "svg",
+      Icon,
       {
-        xmlns: "http://www.w3.org/2000/svg",
-        width: "18",
-        height: "18",
-        viewBox: "0 0 24 24",
-        fill: "none",
-        stroke: "currentColor",
-        strokeLinecap: "round",
-        strokeLinejoin: "round",
-        strokeWidth: "2"
-      },
-      /* @__PURE__ */ React19.createElement("path", { d: "M8 2v4m8-4v4m5 8V6a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h8M3 10h18m-5 10l2 2l4-4" })
+        name: "material-symbols/edit-calendar-outline",
+        apiKey: DEFAULT_ICON_API_BASE_URL,
+        size: 18
+      }
     )
   ), /* @__PURE__ */ React19.createElement(PopoverTrigger, { asChild: true }, /* @__PURE__ */ React19.createElement(
     "input",
@@ -3516,9 +3545,13 @@ function DatePicker({
       id: props.id,
       type: "text",
       className: cn(
-        "flex h-9 w-full rounded-md border border-input bg-transparent py-1 text-base shadow-sm transition-colors",
-        "focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring",
-        "disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
+        "flex h-9 w-full rounded-md border",
+        "border-input bg-transparent py-1 text-base",
+        "shadow-sm transition-colors",
+        "focus-visible:outline-none focus-visible:ring-1",
+        "focus-visible:ring-ring",
+        "disabled:cursor-not-allowed",
+        "disabled:opacity-50 md:text-sm",
         INPUT_AUTOFILL_RESET_CLASSES,
         showIcon ? "pl-10" : "pl-3",
         clearable && value ? "pr-10" : "pr-3",
@@ -4058,5 +4091,5 @@ function DateRangePicker({
 DateRangePicker.displayName = "DateRangePicker";
 
 export { Checkbox2 as Checkbox, CheckboxGroup, DatePicker, DateRangePicker, FileInput, MultiSelect, Radio, Select2 as Select, Switch2 as Switch, TextArea, TimePicker };
-//# sourceMappingURL=chunk-ZH6XDBWH.js.map
-//# sourceMappingURL=chunk-ZH6XDBWH.js.map
+//# sourceMappingURL=chunk-SF6NKDID.js.map
+//# sourceMappingURL=chunk-SF6NKDID.js.map