@tachui/forms 0.7.0-alpha1 → 0.7.1-alpha

package/dist/Form-ueYEcSg1.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"Form-ueYEcSg1.cjs","sources":["../src/components/Form.ts"],"sourcesContent":["/**\n * Form Component\n *\n * SwiftUI-inspired form container with validation, state management,\n * and comprehensive form handling capabilities.\n */\n\nimport type {\n  Component,\n  ComponentChildren,\n  ComponentInstance,\n  ComponentProps,\n  DOMNode,\n} from '@tachui/core'\nimport { createEffect, createSignal, defaultChildrenRenderer, h, text } from '@tachui/core'\nimport { createFormState } from '../state'\nimport type { FormProps } from '../types'\n\n/**\n * Helper function to render form children with form context injection\n */\nfunction renderFormChildren(children: ComponentChildren, formContext: any): DOMNode[] {\n  // If children is an array, handle each child\n  if (Array.isArray(children)) {\n    return children.flatMap((child) => renderSingleChild(child, formContext))\n  }\n\n  // Single child\n  return renderSingleChild(children, formContext)\n}\n\n/**\n * Render a single child with form context\n */\nfunction renderSingleChild(child: ComponentChildren, formContext: any): DOMNode[] {\n  // Handle null/undefined\n  if (child === null || child === undefined) {\n    return []\n  }\n\n  // Handle ComponentInstance objects - inject form context\n  if (typeof child === 'object' && 'type' in child && child.type === 'component') {\n    const childWithContext = {\n      ...child,\n      props: {\n        ...child.props,\n        _formContext: formContext,\n      },\n    }\n    // Bind the render function to the new object so 'this.props' works correctly\n    const boundRender = child.render.bind(childWithContext)\n    const rendered = boundRender()\n    return Array.isArray(rendered) ? rendered : [rendered]\n  }\n\n  // Use default children renderer for everything else (strings, numbers, DOMNodes, etc.)\n  return defaultChildrenRenderer(child)\n}\n\n/**\n * Form component implementation\n */\nexport const Form: Component<FormProps> = (props) => {\n  const {\n    onSubmit,\n    onChange,\n    validation = {\n      validateOn: 'blur',\n      stopOnFirstError: false,\n      debounceMs: 300,\n    },\n    initialValues = {},\n    resetOnSubmit = false,\n    preserveValues = false,\n    children,\n    ...restProps\n  } = props\n\n  // Create form state manager\n  const formManager = createFormState(initialValues)\n  const [submissionResult, setSubmissionResult] = createSignal<'idle' | 'success' | 'error'>('idle')\n\n  // Handle form submission\n  const handleSubmit = async (event?: Event) => {\n    if (event) {\n      event.preventDefault()\n    }\n\n    if (!onSubmit) {\n      return\n    }\n\n    try {\n      setSubmissionResult('idle')\n\n      // Validate form before submission\n      const isValid = await formManager.validateForm()\n\n      if (isValid) {\n        const values = formManager.watch()\n        await onSubmit(values, formManager.state)\n        setSubmissionResult('success')\n\n        if (resetOnSubmit) {\n          formManager.resetForm()\n        }\n      } else {\n        setSubmissionResult('error')\n      }\n    } catch (error) {\n      setSubmissionResult('error')\n      console.error('Form submission error:', error)\n    }\n  }\n\n  // Handle form changes\n  createEffect(() => {\n    if (onChange) {\n      // const values = formManager.watch()\n      const state = formManager.state\n\n      // Find the last changed field (this is a simplification)\n      const changedFields = Object.keys(state.fields).filter((name) => state.fields[name].dirty)\n      if (changedFields.length > 0) {\n        const lastChanged = changedFields[changedFields.length - 1]\n        const fieldState = state.fields[lastChanged]\n        onChange(lastChanged, fieldState.value, fieldState)\n      }\n    }\n  })\n\n  // Create form context for child components\n  const formContext = {\n    register: formManager.register,\n    unregister: formManager.unregister,\n    setValue: formManager.setValue,\n    getValue: formManager.getValue,\n    getError: formManager.getError,\n    validateField: formManager.validateField,\n    validation,\n    onChange,\n  }\n\n  const componentInstance: ComponentInstance = {\n    type: 'component',\n    id: restProps.id || 'form',\n    render: () =>\n      h(\n        'form',\n        {\n          ...restProps,\n          onsubmit: handleSubmit,\n          novalidate: true, // We handle validation ourselves\n          'data-tachui-form': true,\n          'data-form-state': formManager.state.valid ? 'valid' : 'invalid',\n          'data-form-submitting': formManager.state.submitting,\n          'data-submission-result': submissionResult(),\n        },\n        ...renderFormChildren(children, formContext)\n      ),\n    props: props,\n    cleanup: [\n      () => {\n        // Cleanup form state if not preserving values\n        if (!preserveValues) {\n          formManager.resetForm()\n        }\n      },\n    ],\n  }\n\n  return componentInstance\n}\n\n/**\n * Enhanced FormSection component for grouping form fields\n * \n * Combines the semantic benefits of <fieldset> with the rich styling\n * and functionality from Core Section component. Provides the best\n * of both worlds: proper form semantics and comprehensive features.\n */\nexport const FormSection: Component<\n  {\n    // Content (enhanced from Core Section)\n    title?: string\n    description?: string\n    header?: string | (() => string) | ComponentInstance\n    footer?: string | (() => string) | ComponentInstance\n    children: ComponentChildren\n\n    // Styling (from Core Section)\n    style?: 'automatic' | 'grouped' | 'inset' | 'plain' | 'sidebar'\n    spacing?: number\n\n    // Behavior (enhanced from Core Section)\n    collapsible?: boolean\n    collapsed?: boolean\n    onToggle?: (collapsed: boolean) => void\n\n    // Accessibility\n    accessibilityLabel?: string\n    accessibilityRole?: string\n  } & ComponentProps\n> = (props) => {\n  const {\n    title,\n    description, \n    header,\n    footer,\n    style = 'automatic',\n    spacing = 12,\n    collapsible = false,\n    collapsed: initialCollapsed = false,\n    onToggle,\n    accessibilityLabel,\n    accessibilityRole = 'group',\n    children,\n    ...restProps\n  } = props\n\n  const [collapsed, setCollapsed] = createSignal(initialCollapsed)\n\n  // Handle toggle with optional callback\n  const handleToggle = () => {\n    const newCollapsed = !collapsed()\n    setCollapsed(newCollapsed)\n    if (onToggle) {\n      onToggle(newCollapsed)\n    }\n  }\n\n  // Resolve dynamic content (from Core Section)\n  const resolveContent = (content: string | (() => string) | ComponentInstance | undefined) => {\n    if (!content) return null\n    if (typeof content === 'string') return content\n    if (typeof content === 'function') return content()\n    return content\n  }\n\n  // Get section styles based on style prop (adapted from Core Section)\n  const getSectionStyles = () => {\n    const baseStyles = {\n      marginBottom: '20px',\n      border: 'none', // Remove default fieldset border\n      padding: '0',   // Remove default fieldset padding\n      margin: '0 0 20px 0', // Override default fieldset margin\n    }\n\n    switch (style) {\n      case 'grouped':\n        return {\n          ...baseStyles,\n          backgroundColor: '#ffffff',\n          border: '1px solid #e0e0e0',\n          borderRadius: '12px',\n          overflow: 'hidden' as const,\n        }\n\n      case 'inset':\n        return {\n          ...baseStyles,\n          backgroundColor: '#f8f9fa',\n          border: '1px solid #e9ecef',\n          borderRadius: '8px',\n          margin: '0 16px 20px 16px',\n        }\n\n      case 'sidebar':\n        return {\n          ...baseStyles,\n          borderLeft: '3px solid #007AFF',\n          paddingLeft: '16px',\n          backgroundColor: '#f8f9fa',\n          borderRadius: '0 8px 8px 0',\n        }\n\n      case 'plain':\n        return baseStyles\n      default:\n        return {\n          ...baseStyles,\n          backgroundColor: '#ffffff',\n          border: '1px solid #f0f0f0',\n          borderRadius: '8px',\n        }\n    }\n  }\n\n  // Get header styles (adapted from Core Section)\n  const getHeaderStyles = () => {\n    const baseStyles = {\n      fontSize: '16px',\n      fontWeight: '600' as const,\n      color: '#1a1a1a',\n      margin: '0 0 12px 0',\n    }\n\n    switch (style) {\n      case 'grouped':\n      case 'inset':\n        return {\n          ...baseStyles,\n          padding: '12px 16px 0 16px',\n          backgroundColor: '#f8f9fa',\n          borderBottom: '1px solid #e9ecef',\n        }\n\n      case 'sidebar':\n        return {\n          ...baseStyles,\n          fontSize: '14px',\n          textTransform: 'uppercase' as const,\n          letterSpacing: '0.5px',\n          color: '#666',\n          marginBottom: '8px',\n        }\n\n      default:\n        return {\n          ...baseStyles,\n          padding: '0 0 8px 0',\n        }\n    }\n  }\n\n  // Get content styles (adapted from Core Section)\n  const getContentStyles = () => {\n    const baseStyles = {\n      display: 'flex',\n      flexDirection: 'column' as const,\n      gap: `${spacing}px`,\n    }\n\n    switch (style) {\n      case 'grouped':\n      case 'inset':\n        return {\n          ...baseStyles,\n          padding: '16px',\n        }\n\n      case 'sidebar':\n        return {\n          ...baseStyles,\n          padding: '8px 0',\n        }\n\n      default:\n        return {\n          ...baseStyles,\n          padding: '12px',\n        }\n    }\n  }\n\n  // Get footer styles (adapted from Core Section)\n  const getFooterStyles = () => {\n    const baseStyles = {\n      fontSize: '14px',\n      color: '#666',\n      margin: '8px 0 0 0',\n    }\n\n    switch (style) {\n      case 'grouped':\n      case 'inset':\n        return {\n          ...baseStyles,\n          padding: '0 16px 12px 16px',\n          backgroundColor: '#f8f9fa',\n          borderTop: '1px solid #e9ecef',\n        }\n\n      default:\n        return {\n          ...baseStyles,\n          padding: '0 0 4px 0',\n        }\n    }\n  }\n\n  // Render header content\n  const renderHeader = () => {\n    // Prioritize title over header for backwards compatibility\n    const headerContent = title || resolveContent(header)\n    if (!headerContent) return []\n\n    const headerStyles = getHeaderStyles()\n\n    // Add collapse toggle if collapsible\n    if (collapsible) {\n      const toggleIcon = collapsed() ? '▶' : '▼'\n\n      return [\n        h(\n          'legend',\n          {\n            style: {\n              ...headerStyles,\n              cursor: 'pointer',\n              display: 'flex',\n              alignItems: 'center',\n              gap: '8px',\n            },\n            onclick: handleToggle,\n          },\n          h(\n            'span',\n            {\n              style: {\n                fontSize: '12px',\n                color: '#666',\n              },\n            },\n            text(toggleIcon)\n          ),\n          ...(typeof headerContent === 'string'\n            ? [text(headerContent)]\n            : [headerContent.render()].flat())\n        )\n      ]\n    }\n\n    return [\n      h(\n        'legend',\n        { style: headerStyles },\n        ...(typeof headerContent === 'string'\n          ? [text(headerContent)]\n          : [headerContent.render()].flat())\n      )\n    ]\n  }\n\n  // Render description if provided (backwards compatibility)\n  const renderDescription = () => {\n    if (!description || collapsed()) return []\n    \n    return [\n      h(\n        'div',\n        {\n          style: {\n            fontSize: '14px',\n            color: '#666',\n            marginBottom: '12px',\n            padding: style === 'grouped' || style === 'inset' ? '0 16px' : '0',\n          },\n        },\n        text(description)\n      )\n    ]\n  }\n\n  // Render content\n  const renderContent = () => {\n    // Don't render content if collapsed\n    if (collapsible && collapsed()) {\n      return []\n    }\n\n    return [\n      h(\n        'div',\n        {\n          style: getContentStyles(),\n        },\n        ...renderFormChildren(children, (props as any)._formContext)\n      )\n    ]\n  }\n\n  // Render footer content\n  const renderFooter = () => {\n    const footerContent = resolveContent(footer)\n    if (!footerContent || collapsed()) return []\n\n    return [\n      h(\n        'div',\n        {\n          style: getFooterStyles(),\n        },\n        ...(typeof footerContent === 'string'\n          ? [text(footerContent)]\n          : [footerContent.render()].flat())\n      )\n    ]\n  }\n\n  const componentInstance: ComponentInstance = {\n    type: 'component',\n    id: restProps.id || 'form-section',\n    render: () =>\n      h(\n        'fieldset',\n        {\n          ...restProps,\n          style: getSectionStyles(),\n          'aria-label': accessibilityLabel,\n          role: accessibilityRole,\n          'data-tachui-form-section': true,\n          'data-collapsible': collapsible,\n          'data-collapsed': collapsed(),\n          'data-style': style,\n        },\n        ...renderHeader(),\n        ...renderDescription(),\n        ...renderContent(),\n        ...renderFooter()\n      ),\n    props: props,\n  }\n\n  return componentInstance\n}\n\n/**\n * Form utilities and helpers\n */\nexport const FormUtils = {\n  /**\n   * Create a form with automatic field registration\n   */\n  createAutoForm: (schema: any) => {\n    // This would be implemented to automatically generate form fields\n    // based on a JSON schema - simplified for now\n    console.log('Auto form creation:', schema)\n    return Form\n  },\n\n  /**\n   * Form validation utilities\n   */\n  validation: {\n    /**\n     * Create a validation schema from field definitions\n     */\n    createSchema: (fields: Record<string, any>) => {\n      return {\n        fields,\n        validate: async (_values: Record<string, any>) => {\n          // TODO: Implement schema-based validation\n          return { valid: true, errors: {} }\n        },\n      }\n    },\n  },\n\n  /**\n   * Form serialization utilities\n   */\n  serialize: {\n    /**\n     * Convert form values to FormData\n     */\n    toFormData: (values: Record<string, any>): FormData => {\n      const formData = new FormData()\n\n      Object.entries(values).forEach(([key, value]) => {\n        if (value !== null && value !== undefined) {\n          if (value instanceof File || value instanceof Blob) {\n            formData.append(key, value)\n          } else if (Array.isArray(value)) {\n            value.forEach((item, index) => {\n              formData.append(`${key}[${index}]`, String(item))\n            })\n          } else {\n            formData.append(key, String(value))\n          }\n        }\n      })\n\n      return formData\n    },\n\n    /**\n     * Convert form values to URL search params\n     */\n    toURLSearchParams: (values: Record<string, any>): URLSearchParams => {\n      const params = new URLSearchParams()\n\n      Object.entries(values).forEach(([key, value]) => {\n        if (value !== null && value !== undefined) {\n          if (Array.isArray(value)) {\n            value.forEach((item) => params.append(key, String(item)))\n          } else {\n            params.append(key, String(value))\n          }\n        }\n      })\n\n      return params\n    },\n\n    /**\n     * Convert form values to JSON\n     */\n    toJSON: (values: Record<string, any>): string => {\n      return JSON.stringify(values, null, 2)\n    },\n  },\n}\n\n// Export form-related types for convenience\nexport type { FormProps, FormState } from '../types'\n"],"names":["renderFormChildren","children","formContext","child","renderSingleChild","childWithContext","rendered","defaultChildrenRenderer","Form","props","onSubmit","onChange","validation","initialValues","resetOnSubmit","preserveValues","restProps","formManager","createFormState","submissionResult","setSubmissionResult","createSignal","handleSubmit","event","values","error","createEffect","state","changedFields","name","lastChanged","fieldState","h","FormSection","title","description","header","footer","style","spacing","collapsible","initialCollapsed","onToggle","accessibilityLabel","accessibilityRole","collapsed","setCollapsed","handleToggle","newCollapsed","resolveContent","content","getSectionStyles","baseStyles","getHeaderStyles","getContentStyles","getFooterStyles","renderHeader","headerContent","headerStyles","toggleIcon","text","renderDescription","renderContent","renderFooter","footerContent","FormUtils","schema","fields","_values","formData","key","value","item","index","params"],"mappings":"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"}

package/dist/Form-ylAr3o_e.js

@@ -1,376 +0,0 @@
-import { createSignal as R, createEffect as B, h as f, text as m, defaultChildrenRenderer as L } from "@tachui/core";
-import { a as j } from "./forms-core-B1bx1drO.js";
-function w(r, t) {
-  return Array.isArray(r) ? r.flatMap((o) => v(o, t)) : v(r, t);
-}
-function v(r, t) {
-  if (r == null)
-    return [];
-  if (typeof r == "object" && "type" in r && r.type === "component") {
-    const o = {
-      ...r,
-      props: {
-        ...r.props,
-        _formContext: t
-      }
-    }, a = r.render.bind(o)();
-    return Array.isArray(a) ? a : [a];
-  }
-  return L(r);
-}
-const P = (r) => {
-  const {
-    onSubmit: t,
-    onChange: o,
-    validation: n = {
-      validateOn: "blur",
-      stopOnFirstError: !1,
-      debounceMs: 300
-    },
-    initialValues: a = {},
-    resetOnSubmit: i = !1,
-    preserveValues: S = !1,
-    children: g,
-    ...b
-  } = r, s = j(a), [h, u] = R("idle"), C = async (l) => {
-    if (l && l.preventDefault(), !!t)
-      try {
-        if (u("idle"), await s.validateForm()) {
-          const d = s.watch();
-          await t(d, s.state), u("success"), i && s.resetForm();
-        } else
-          u("error");
-      } catch (c) {
-        u("error"), console.error("Form submission error:", c);
-      }
-  };
-  B(() => {
-    if (o) {
-      const l = s.state, c = Object.keys(l.fields).filter((d) => l.fields[d].dirty);
-      if (c.length > 0) {
-        const d = c[c.length - 1], y = l.fields[d];
-        o(d, y.value, y);
-      }
-    }
-  });
-  const x = {
-    register: s.register,
-    unregister: s.unregister,
-    setValue: s.setValue,
-    getValue: s.getValue,
-    getError: s.getError,
-    validateField: s.validateField,
-    validation: n,
-    onChange: o
-  };
-  return {
-    type: "component",
-    id: b.id || "form",
-    render: () => f(
-      "form",
-      {
-        ...b,
-        onsubmit: C,
-        novalidate: !0,
-        // We handle validation ourselves
-        "data-tachui-form": !0,
-        "data-form-state": s.state.valid ? "valid" : "invalid",
-        "data-form-submitting": s.state.submitting,
-        "data-submission-result": h()
-      },
-      ...w(g, x)
-    ),
-    props: r,
-    cleanup: [
-      () => {
-        S || s.resetForm();
-      }
-    ]
-  };
-}, _ = (r) => {
-  const {
-    title: t,
-    description: o,
-    header: n,
-    footer: a,
-    style: i = "automatic",
-    spacing: S = 12,
-    collapsible: g = !1,
-    collapsed: b = !1,
-    onToggle: s,
-    accessibilityLabel: h,
-    accessibilityRole: u = "group",
-    children: C,
-    ...x
-  } = r, [p, l] = R(b), c = () => {
-    const e = !p();
-    l(e), s && s(e);
-  }, d = (e) => e ? typeof e == "string" ? e : typeof e == "function" ? e() : e : null, y = () => {
-    const e = {
-      marginBottom: "20px",
-      border: "none",
-      // Remove default fieldset border
-      padding: "0",
-      // Remove default fieldset padding
-      margin: "0 0 20px 0"
-      // Override default fieldset margin
-    };
-    switch (i) {
-      case "grouped":
-        return {
-          ...e,
-          backgroundColor: "#ffffff",
-          border: "1px solid #e0e0e0",
-          borderRadius: "12px",
-          overflow: "hidden"
-        };
-      case "inset":
-        return {
-          ...e,
-          backgroundColor: "#f8f9fa",
-          border: "1px solid #e9ecef",
-          borderRadius: "8px",
-          margin: "0 16px 20px 16px"
-        };
-      case "sidebar":
-        return {
-          ...e,
-          borderLeft: "3px solid #007AFF",
-          paddingLeft: "16px",
-          backgroundColor: "#f8f9fa",
-          borderRadius: "0 8px 8px 0"
-        };
-      case "plain":
-        return e;
-      default:
-        return {
-          ...e,
-          backgroundColor: "#ffffff",
-          border: "1px solid #f0f0f0",
-          borderRadius: "8px"
-        };
-    }
-  }, A = () => {
-    const e = {
-      fontSize: "16px",
-      fontWeight: "600",
-      color: "#1a1a1a",
-      margin: "0 0 12px 0"
-    };
-    switch (i) {
-      case "grouped":
-      case "inset":
-        return {
-          ...e,
-          padding: "12px 16px 0 16px",
-          backgroundColor: "#f8f9fa",
-          borderBottom: "1px solid #e9ecef"
-        };
-      case "sidebar":
-        return {
-          ...e,
-          fontSize: "14px",
-          textTransform: "uppercase",
-          letterSpacing: "0.5px",
-          color: "#666",
-          marginBottom: "8px"
-        };
-      default:
-        return {
-          ...e,
-          padding: "0 0 8px 0"
-        };
-    }
-  }, E = () => {
-    const e = {
-      display: "flex",
-      flexDirection: "column",
-      gap: `${S}px`
-    };
-    switch (i) {
-      case "grouped":
-      case "inset":
-        return {
-          ...e,
-          padding: "16px"
-        };
-      case "sidebar":
-        return {
-          ...e,
-          padding: "8px 0"
-        };
-      default:
-        return {
-          ...e,
-          padding: "12px"
-        };
-    }
-  }, O = () => {
-    const e = {
-      fontSize: "14px",
-      color: "#666",
-      margin: "8px 0 0 0"
-    };
-    switch (i) {
-      case "grouped":
-      case "inset":
-        return {
-          ...e,
-          padding: "0 16px 12px 16px",
-          backgroundColor: "#f8f9fa",
-          borderTop: "1px solid #e9ecef"
-        };
-      default:
-        return {
-          ...e,
-          padding: "0 0 4px 0"
-        };
-    }
-  }, V = () => {
-    const e = t || d(n);
-    if (!e) return [];
-    const F = A();
-    if (g) {
-      const k = p() ? "▶" : "▼";
-      return [
-        f(
-          "legend",
-          {
-            style: {
-              ...F,
-              cursor: "pointer",
-              display: "flex",
-              alignItems: "center",
-              gap: "8px"
-            },
-            onclick: c
-          },
-          f(
-            "span",
-            {
-              style: {
-                fontSize: "12px",
-                color: "#666"
-              }
-            },
-            m(k)
-          ),
-          ...typeof e == "string" ? [m(e)] : [e.render()].flat()
-        )
-      ];
-    }
-    return [
-      f(
-        "legend",
-        { style: F },
-        ...typeof e == "string" ? [m(e)] : [e.render()].flat()
-      )
-    ];
-  }, z = () => !o || p() ? [] : [
-    f(
-      "div",
-      {
-        style: {
-          fontSize: "14px",
-          color: "#666",
-          marginBottom: "12px",
-          padding: i === "grouped" || i === "inset" ? "0 16px" : "0"
-        }
-      },
-      m(o)
-    )
-  ], D = () => g && p() ? [] : [
-    f(
-      "div",
-      {
-        style: E()
-      },
-      ...w(C, r._formContext)
-    )
-  ], I = () => {
-    const e = d(a);
-    return !e || p() ? [] : [
-      f(
-        "div",
-        {
-          style: O()
-        },
-        ...typeof e == "string" ? [m(e)] : [e.render()].flat()
-      )
-    ];
-  };
-  return {
-    type: "component",
-    id: x.id || "form-section",
-    render: () => f(
-      "fieldset",
-      {
-        ...x,
-        style: y(),
-        "aria-label": h,
-        role: u,
-        "data-tachui-form-section": !0,
-        "data-collapsible": g,
-        "data-collapsed": p(),
-        "data-style": i
-      },
-      ...V(),
-      ...z(),
-      ...D(),
-      ...I()
-    ),
-    props: r
-  };
-}, $ = {
-  /**
-   * Create a form with automatic field registration
-   */
-  createAutoForm: (r) => (console.log("Auto form creation:", r), P),
-  /**
-   * Form validation utilities
-   */
-  validation: {
-    /**
-     * Create a validation schema from field definitions
-     */
-    createSchema: (r) => ({
-      fields: r,
-      validate: async (t) => ({ valid: !0, errors: {} })
-    })
-  },
-  /**
-   * Form serialization utilities
-   */
-  serialize: {
-    /**
-     * Convert form values to FormData
-     */
-    toFormData: (r) => {
-      const t = new FormData();
-      return Object.entries(r).forEach(([o, n]) => {
-        n != null && (n instanceof File || n instanceof Blob ? t.append(o, n) : Array.isArray(n) ? n.forEach((a, i) => {
-          t.append(`${o}[${i}]`, String(a));
-        }) : t.append(o, String(n)));
-      }), t;
-    },
-    /**
-     * Convert form values to URL search params
-     */
-    toURLSearchParams: (r) => {
-      const t = new URLSearchParams();
-      return Object.entries(r).forEach(([o, n]) => {
-        n != null && (Array.isArray(n) ? n.forEach((a) => t.append(o, String(a))) : t.append(o, String(n)));
-      }), t;
-    },
-    /**
-     * Convert form values to JSON
-     */
-    toJSON: (r) => JSON.stringify(r, null, 2)
-  }
-};
-export {
-  P as F,
-  _ as a,
-  $ as b
-};
-//# sourceMappingURL=Form-ylAr3o_e.js.map

package/dist/Form-ylAr3o_e.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Form-ylAr3o_e.js","sources":["../src/components/Form.ts"],"sourcesContent":["/**\n * Form Component\n *\n * SwiftUI-inspired form container with validation, state management,\n * and comprehensive form handling capabilities.\n */\n\nimport type {\n  Component,\n  ComponentChildren,\n  ComponentInstance,\n  ComponentProps,\n  DOMNode,\n} from '@tachui/core'\nimport { createEffect, createSignal, defaultChildrenRenderer, h, text } from '@tachui/core'\nimport { createFormState } from '../state'\nimport type { FormProps } from '../types'\n\n/**\n * Helper function to render form children with form context injection\n */\nfunction renderFormChildren(children: ComponentChildren, formContext: any): DOMNode[] {\n  // If children is an array, handle each child\n  if (Array.isArray(children)) {\n    return children.flatMap((child) => renderSingleChild(child, formContext))\n  }\n\n  // Single child\n  return renderSingleChild(children, formContext)\n}\n\n/**\n * Render a single child with form context\n */\nfunction renderSingleChild(child: ComponentChildren, formContext: any): DOMNode[] {\n  // Handle null/undefined\n  if (child === null || child === undefined) {\n    return []\n  }\n\n  // Handle ComponentInstance objects - inject form context\n  if (typeof child === 'object' && 'type' in child && child.type === 'component') {\n    const childWithContext = {\n      ...child,\n      props: {\n        ...child.props,\n        _formContext: formContext,\n      },\n    }\n    // Bind the render function to the new object so 'this.props' works correctly\n    const boundRender = child.render.bind(childWithContext)\n    const rendered = boundRender()\n    return Array.isArray(rendered) ? rendered : [rendered]\n  }\n\n  // Use default children renderer for everything else (strings, numbers, DOMNodes, etc.)\n  return defaultChildrenRenderer(child)\n}\n\n/**\n * Form component implementation\n */\nexport const Form: Component<FormProps> = (props) => {\n  const {\n    onSubmit,\n    onChange,\n    validation = {\n      validateOn: 'blur',\n      stopOnFirstError: false,\n      debounceMs: 300,\n    },\n    initialValues = {},\n    resetOnSubmit = false,\n    preserveValues = false,\n    children,\n    ...restProps\n  } = props\n\n  // Create form state manager\n  const formManager = createFormState(initialValues)\n  const [submissionResult, setSubmissionResult] = createSignal<'idle' | 'success' | 'error'>('idle')\n\n  // Handle form submission\n  const handleSubmit = async (event?: Event) => {\n    if (event) {\n      event.preventDefault()\n    }\n\n    if (!onSubmit) {\n      return\n    }\n\n    try {\n      setSubmissionResult('idle')\n\n      // Validate form before submission\n      const isValid = await formManager.validateForm()\n\n      if (isValid) {\n        const values = formManager.watch()\n        await onSubmit(values, formManager.state)\n        setSubmissionResult('success')\n\n        if (resetOnSubmit) {\n          formManager.resetForm()\n        }\n      } else {\n        setSubmissionResult('error')\n      }\n    } catch (error) {\n      setSubmissionResult('error')\n      console.error('Form submission error:', error)\n    }\n  }\n\n  // Handle form changes\n  createEffect(() => {\n    if (onChange) {\n      // const values = formManager.watch()\n      const state = formManager.state\n\n      // Find the last changed field (this is a simplification)\n      const changedFields = Object.keys(state.fields).filter((name) => state.fields[name].dirty)\n      if (changedFields.length > 0) {\n        const lastChanged = changedFields[changedFields.length - 1]\n        const fieldState = state.fields[lastChanged]\n        onChange(lastChanged, fieldState.value, fieldState)\n      }\n    }\n  })\n\n  // Create form context for child components\n  const formContext = {\n    register: formManager.register,\n    unregister: formManager.unregister,\n    setValue: formManager.setValue,\n    getValue: formManager.getValue,\n    getError: formManager.getError,\n    validateField: formManager.validateField,\n    validation,\n    onChange,\n  }\n\n  const componentInstance: ComponentInstance = {\n    type: 'component',\n    id: restProps.id || 'form',\n    render: () =>\n      h(\n        'form',\n        {\n          ...restProps,\n          onsubmit: handleSubmit,\n          novalidate: true, // We handle validation ourselves\n          'data-tachui-form': true,\n          'data-form-state': formManager.state.valid ? 'valid' : 'invalid',\n          'data-form-submitting': formManager.state.submitting,\n          'data-submission-result': submissionResult(),\n        },\n        ...renderFormChildren(children, formContext)\n      ),\n    props: props,\n    cleanup: [\n      () => {\n        // Cleanup form state if not preserving values\n        if (!preserveValues) {\n          formManager.resetForm()\n        }\n      },\n    ],\n  }\n\n  return componentInstance\n}\n\n/**\n * Enhanced FormSection component for grouping form fields\n * \n * Combines the semantic benefits of <fieldset> with the rich styling\n * and functionality from Core Section component. Provides the best\n * of both worlds: proper form semantics and comprehensive features.\n */\nexport const FormSection: Component<\n  {\n    // Content (enhanced from Core Section)\n    title?: string\n    description?: string\n    header?: string | (() => string) | ComponentInstance\n    footer?: string | (() => string) | ComponentInstance\n    children: ComponentChildren\n\n    // Styling (from Core Section)\n    style?: 'automatic' | 'grouped' | 'inset' | 'plain' | 'sidebar'\n    spacing?: number\n\n    // Behavior (enhanced from Core Section)\n    collapsible?: boolean\n    collapsed?: boolean\n    onToggle?: (collapsed: boolean) => void\n\n    // Accessibility\n    accessibilityLabel?: string\n    accessibilityRole?: string\n  } & ComponentProps\n> = (props) => {\n  const {\n    title,\n    description, \n    header,\n    footer,\n    style = 'automatic',\n    spacing = 12,\n    collapsible = false,\n    collapsed: initialCollapsed = false,\n    onToggle,\n    accessibilityLabel,\n    accessibilityRole = 'group',\n    children,\n    ...restProps\n  } = props\n\n  const [collapsed, setCollapsed] = createSignal(initialCollapsed)\n\n  // Handle toggle with optional callback\n  const handleToggle = () => {\n    const newCollapsed = !collapsed()\n    setCollapsed(newCollapsed)\n    if (onToggle) {\n      onToggle(newCollapsed)\n    }\n  }\n\n  // Resolve dynamic content (from Core Section)\n  const resolveContent = (content: string | (() => string) | ComponentInstance | undefined) => {\n    if (!content) return null\n    if (typeof content === 'string') return content\n    if (typeof content === 'function') return content()\n    return content\n  }\n\n  // Get section styles based on style prop (adapted from Core Section)\n  const getSectionStyles = () => {\n    const baseStyles = {\n      marginBottom: '20px',\n      border: 'none', // Remove default fieldset border\n      padding: '0',   // Remove default fieldset padding\n      margin: '0 0 20px 0', // Override default fieldset margin\n    }\n\n    switch (style) {\n      case 'grouped':\n        return {\n          ...baseStyles,\n          backgroundColor: '#ffffff',\n          border: '1px solid #e0e0e0',\n          borderRadius: '12px',\n          overflow: 'hidden' as const,\n        }\n\n      case 'inset':\n        return {\n          ...baseStyles,\n          backgroundColor: '#f8f9fa',\n          border: '1px solid #e9ecef',\n          borderRadius: '8px',\n          margin: '0 16px 20px 16px',\n        }\n\n      case 'sidebar':\n        return {\n          ...baseStyles,\n          borderLeft: '3px solid #007AFF',\n          paddingLeft: '16px',\n          backgroundColor: '#f8f9fa',\n          borderRadius: '0 8px 8px 0',\n        }\n\n      case 'plain':\n        return baseStyles\n      default:\n        return {\n          ...baseStyles,\n          backgroundColor: '#ffffff',\n          border: '1px solid #f0f0f0',\n          borderRadius: '8px',\n        }\n    }\n  }\n\n  // Get header styles (adapted from Core Section)\n  const getHeaderStyles = () => {\n    const baseStyles = {\n      fontSize: '16px',\n      fontWeight: '600' as const,\n      color: '#1a1a1a',\n      margin: '0 0 12px 0',\n    }\n\n    switch (style) {\n      case 'grouped':\n      case 'inset':\n        return {\n          ...baseStyles,\n          padding: '12px 16px 0 16px',\n          backgroundColor: '#f8f9fa',\n          borderBottom: '1px solid #e9ecef',\n        }\n\n      case 'sidebar':\n        return {\n          ...baseStyles,\n          fontSize: '14px',\n          textTransform: 'uppercase' as const,\n          letterSpacing: '0.5px',\n          color: '#666',\n          marginBottom: '8px',\n        }\n\n      default:\n        return {\n          ...baseStyles,\n          padding: '0 0 8px 0',\n        }\n    }\n  }\n\n  // Get content styles (adapted from Core Section)\n  const getContentStyles = () => {\n    const baseStyles = {\n      display: 'flex',\n      flexDirection: 'column' as const,\n      gap: `${spacing}px`,\n    }\n\n    switch (style) {\n      case 'grouped':\n      case 'inset':\n        return {\n          ...baseStyles,\n          padding: '16px',\n        }\n\n      case 'sidebar':\n        return {\n          ...baseStyles,\n          padding: '8px 0',\n        }\n\n      default:\n        return {\n          ...baseStyles,\n          padding: '12px',\n        }\n    }\n  }\n\n  // Get footer styles (adapted from Core Section)\n  const getFooterStyles = () => {\n    const baseStyles = {\n      fontSize: '14px',\n      color: '#666',\n      margin: '8px 0 0 0',\n    }\n\n    switch (style) {\n      case 'grouped':\n      case 'inset':\n        return {\n          ...baseStyles,\n          padding: '0 16px 12px 16px',\n          backgroundColor: '#f8f9fa',\n          borderTop: '1px solid #e9ecef',\n        }\n\n      default:\n        return {\n          ...baseStyles,\n          padding: '0 0 4px 0',\n        }\n    }\n  }\n\n  // Render header content\n  const renderHeader = () => {\n    // Prioritize title over header for backwards compatibility\n    const headerContent = title || resolveContent(header)\n    if (!headerContent) return []\n\n    const headerStyles = getHeaderStyles()\n\n    // Add collapse toggle if collapsible\n    if (collapsible) {\n      const toggleIcon = collapsed() ? '▶' : '▼'\n\n      return [\n        h(\n          'legend',\n          {\n            style: {\n              ...headerStyles,\n              cursor: 'pointer',\n              display: 'flex',\n              alignItems: 'center',\n              gap: '8px',\n            },\n            onclick: handleToggle,\n          },\n          h(\n            'span',\n            {\n              style: {\n                fontSize: '12px',\n                color: '#666',\n              },\n            },\n            text(toggleIcon)\n          ),\n          ...(typeof headerContent === 'string'\n            ? [text(headerContent)]\n            : [headerContent.render()].flat())\n        )\n      ]\n    }\n\n    return [\n      h(\n        'legend',\n        { style: headerStyles },\n        ...(typeof headerContent === 'string'\n          ? [text(headerContent)]\n          : [headerContent.render()].flat())\n      )\n    ]\n  }\n\n  // Render description if provided (backwards compatibility)\n  const renderDescription = () => {\n    if (!description || collapsed()) return []\n    \n    return [\n      h(\n        'div',\n        {\n          style: {\n            fontSize: '14px',\n            color: '#666',\n            marginBottom: '12px',\n            padding: style === 'grouped' || style === 'inset' ? '0 16px' : '0',\n          },\n        },\n        text(description)\n      )\n    ]\n  }\n\n  // Render content\n  const renderContent = () => {\n    // Don't render content if collapsed\n    if (collapsible && collapsed()) {\n      return []\n    }\n\n    return [\n      h(\n        'div',\n        {\n          style: getContentStyles(),\n        },\n        ...renderFormChildren(children, (props as any)._formContext)\n      )\n    ]\n  }\n\n  // Render footer content\n  const renderFooter = () => {\n    const footerContent = resolveContent(footer)\n    if (!footerContent || collapsed()) return []\n\n    return [\n      h(\n        'div',\n        {\n          style: getFooterStyles(),\n        },\n        ...(typeof footerContent === 'string'\n          ? [text(footerContent)]\n          : [footerContent.render()].flat())\n      )\n    ]\n  }\n\n  const componentInstance: ComponentInstance = {\n    type: 'component',\n    id: restProps.id || 'form-section',\n    render: () =>\n      h(\n        'fieldset',\n        {\n          ...restProps,\n          style: getSectionStyles(),\n          'aria-label': accessibilityLabel,\n          role: accessibilityRole,\n          'data-tachui-form-section': true,\n          'data-collapsible': collapsible,\n          'data-collapsed': collapsed(),\n          'data-style': style,\n        },\n        ...renderHeader(),\n        ...renderDescription(),\n        ...renderContent(),\n        ...renderFooter()\n      ),\n    props: props,\n  }\n\n  return componentInstance\n}\n\n/**\n * Form utilities and helpers\n */\nexport const FormUtils = {\n  /**\n   * Create a form with automatic field registration\n   */\n  createAutoForm: (schema: any) => {\n    // This would be implemented to automatically generate form fields\n    // based on a JSON schema - simplified for now\n    console.log('Auto form creation:', schema)\n    return Form\n  },\n\n  /**\n   * Form validation utilities\n   */\n  validation: {\n    /**\n     * Create a validation schema from field definitions\n     */\n    createSchema: (fields: Record<string, any>) => {\n      return {\n        fields,\n        validate: async (_values: Record<string, any>) => {\n          // TODO: Implement schema-based validation\n          return { valid: true, errors: {} }\n        },\n      }\n    },\n  },\n\n  /**\n   * Form serialization utilities\n   */\n  serialize: {\n    /**\n     * Convert form values to FormData\n     */\n    toFormData: (values: Record<string, any>): FormData => {\n      const formData = new FormData()\n\n      Object.entries(values).forEach(([key, value]) => {\n        if (value !== null && value !== undefined) {\n          if (value instanceof File || value instanceof Blob) {\n            formData.append(key, value)\n          } else if (Array.isArray(value)) {\n            value.forEach((item, index) => {\n              formData.append(`${key}[${index}]`, String(item))\n            })\n          } else {\n            formData.append(key, String(value))\n          }\n        }\n      })\n\n      return formData\n    },\n\n    /**\n     * Convert form values to URL search params\n     */\n    toURLSearchParams: (values: Record<string, any>): URLSearchParams => {\n      const params = new URLSearchParams()\n\n      Object.entries(values).forEach(([key, value]) => {\n        if (value !== null && value !== undefined) {\n          if (Array.isArray(value)) {\n            value.forEach((item) => params.append(key, String(item)))\n          } else {\n            params.append(key, String(value))\n          }\n        }\n      })\n\n      return params\n    },\n\n    /**\n     * Convert form values to JSON\n     */\n    toJSON: (values: Record<string, any>): string => {\n      return JSON.stringify(values, null, 2)\n    },\n  },\n}\n\n// Export form-related types for convenience\nexport type { FormProps, FormState } from '../types'\n"],"names":["renderFormChildren","children","formContext","child","renderSingleChild","childWithContext","rendered","defaultChildrenRenderer","Form","props","onSubmit","onChange","validation","initialValues","resetOnSubmit","preserveValues","restProps","formManager","createFormState","submissionResult","setSubmissionResult","createSignal","handleSubmit","event","values","error","createEffect","state","changedFields","name","lastChanged","fieldState","h","FormSection","title","description","header","footer","style","spacing","collapsible","initialCollapsed","onToggle","accessibilityLabel","accessibilityRole","collapsed","setCollapsed","handleToggle","newCollapsed","resolveContent","content","getSectionStyles","baseStyles","getHeaderStyles","getContentStyles","getFooterStyles","renderHeader","headerContent","headerStyles","toggleIcon","text","renderDescription","renderContent","renderFooter","footerContent","FormUtils","schema","fields","_values","formData","key","value","item","index","params"],"mappings":";;AAqBA,SAASA,EAAmBC,GAA6BC,GAA6B;AAEpF,SAAI,MAAM,QAAQD,CAAQ,IACjBA,EAAS,QAAQ,CAACE,MAAUC,EAAkBD,GAAOD,CAAW,CAAC,IAInEE,EAAkBH,GAAUC,CAAW;AAChD;AAKA,SAASE,EAAkBD,GAA0BD,GAA6B;AAEhF,MAAIC,KAAU;AACZ,WAAO,CAAA;AAIT,MAAI,OAAOA,KAAU,YAAY,UAAUA,KAASA,EAAM,SAAS,aAAa;AAC9E,UAAME,IAAmB;AAAA,MACvB,GAAGF;AAAA,MACH,OAAO;AAAA,QACL,GAAGA,EAAM;AAAA,QACT,cAAcD;AAAA,MAAA;AAAA,IAChB,GAIII,IADcH,EAAM,OAAO,KAAKE,CAAgB,EACrC;AACjB,WAAO,MAAM,QAAQC,CAAQ,IAAIA,IAAW,CAACA,CAAQ;AAAA,EACvD;AAGA,SAAOC,EAAwBJ,CAAK;AACtC;AAKO,MAAMK,IAA6B,CAACC,MAAU;AACnD,QAAM;AAAA,IACJ,UAAAC;AAAA,IACA,UAAAC;AAAA,IACA,YAAAC,IAAa;AAAA,MACX,YAAY;AAAA,MACZ,kBAAkB;AAAA,MAClB,YAAY;AAAA,IAAA;AAAA,IAEd,eAAAC,IAAgB,CAAA;AAAA,IAChB,eAAAC,IAAgB;AAAA,IAChB,gBAAAC,IAAiB;AAAA,IACjB,UAAAd;AAAA,IACA,GAAGe;AAAA,EAAA,IACDP,GAGEQ,IAAcC,EAAgBL,CAAa,GAC3C,CAACM,GAAkBC,CAAmB,IAAIC,EAA2C,MAAM,GAG3FC,IAAe,OAAOC,MAAkB;AAK5C,QAJIA,KACFA,EAAM,eAAA,GAGJ,EAACb;AAIL,UAAI;AAMF,YALAU,EAAoB,MAAM,GAGV,MAAMH,EAAY,aAAA,GAErB;AACX,gBAAMO,IAASP,EAAY,MAAA;AAC3B,gBAAMP,EAASc,GAAQP,EAAY,KAAK,GACxCG,EAAoB,SAAS,GAEzBN,KACFG,EAAY,UAAA;AAAA,QAEhB;AACE,UAAAG,EAAoB,OAAO;AAAA,MAE/B,SAASK,GAAO;AACd,QAAAL,EAAoB,OAAO,GAC3B,QAAQ,MAAM,0BAA0BK,CAAK;AAAA,MAC/C;AAAA,EACF;AAGA,EAAAC,EAAa,MAAM;AACjB,QAAIf,GAAU;AAEZ,YAAMgB,IAAQV,EAAY,OAGpBW,IAAgB,OAAO,KAAKD,EAAM,MAAM,EAAE,OAAO,CAACE,MAASF,EAAM,OAAOE,CAAI,EAAE,KAAK;AACzF,UAAID,EAAc,SAAS,GAAG;AAC5B,cAAME,IAAcF,EAAcA,EAAc,SAAS,CAAC,GACpDG,IAAaJ,EAAM,OAAOG,CAAW;AAC3C,QAAAnB,EAASmB,GAAaC,EAAW,OAAOA,CAAU;AAAA,MACpD;AAAA,IACF;AAAA,EACF,CAAC;AAGD,QAAM7B,IAAc;AAAA,IAClB,UAAUe,EAAY;AAAA,IACtB,YAAYA,EAAY;AAAA,IACxB,UAAUA,EAAY;AAAA,IACtB,UAAUA,EAAY;AAAA,IACtB,UAAUA,EAAY;AAAA,IACtB,eAAeA,EAAY;AAAA,IAC3B,YAAAL;AAAA,IACA,UAAAD;AAAA,EAAA;AA+BF,SA5B6C;AAAA,IAC3C,MAAM;AAAA,IACN,IAAIK,EAAU,MAAM;AAAA,IACpB,QAAQ,MACNgB;AAAA,MACE;AAAA,MACA;AAAA,QACE,GAAGhB;AAAA,QACH,UAAUM;AAAA,QACV,YAAY;AAAA;AAAA,QACZ,oBAAoB;AAAA,QACpB,mBAAmBL,EAAY,MAAM,QAAQ,UAAU;AAAA,QACvD,wBAAwBA,EAAY,MAAM;AAAA,QAC1C,0BAA0BE,EAAA;AAAA,MAAiB;AAAA,MAE7C,GAAGnB,EAAmBC,GAAUC,CAAW;AAAA,IAAA;AAAA,IAE/C,OAAAO;AAAA,IACA,SAAS;AAAA,MACP,MAAM;AAEJ,QAAKM,KACHE,EAAY,UAAA;AAAA,MAEhB;AAAA,IAAA;AAAA,EACF;AAIJ,GASagB,IAsBT,CAACxB,MAAU;AACb,QAAM;AAAA,IACJ,OAAAyB;AAAA,IACA,aAAAC;AAAA,IACA,QAAAC;AAAA,IACA,QAAAC;AAAA,IACA,OAAAC,IAAQ;AAAA,IACR,SAAAC,IAAU;AAAA,IACV,aAAAC,IAAc;AAAA,IACd,WAAWC,IAAmB;AAAA,IAC9B,UAAAC;AAAA,IACA,oBAAAC;AAAA,IACA,mBAAAC,IAAoB;AAAA,IACpB,UAAA3C;AAAA,IACA,GAAGe;AAAA,EAAA,IACDP,GAEE,CAACoC,GAAWC,CAAY,IAAIzB,EAAaoB,CAAgB,GAGzDM,IAAe,MAAM;AACzB,UAAMC,IAAe,CAACH,EAAA;AACtB,IAAAC,EAAaE,CAAY,GACrBN,KACFA,EAASM,CAAY;AAAA,EAEzB,GAGMC,IAAiB,CAACC,MACjBA,IACD,OAAOA,KAAY,WAAiBA,IACpC,OAAOA,KAAY,aAAmBA,EAAA,IACnCA,IAHc,MAOjBC,IAAmB,MAAM;AAC7B,UAAMC,IAAa;AAAA,MACjB,cAAc;AAAA,MACd,QAAQ;AAAA;AAAA,MACR,SAAS;AAAA;AAAA,MACT,QAAQ;AAAA;AAAA,IAAA;AAGV,YAAQd,GAAA;AAAA,MACN,KAAK;AACH,eAAO;AAAA,UACL,GAAGc;AAAA,UACH,iBAAiB;AAAA,UACjB,QAAQ;AAAA,UACR,cAAc;AAAA,UACd,UAAU;AAAA,QAAA;AAAA,MAGd,KAAK;AACH,eAAO;AAAA,UACL,GAAGA;AAAA,UACH,iBAAiB;AAAA,UACjB,QAAQ;AAAA,UACR,cAAc;AAAA,UACd,QAAQ;AAAA,QAAA;AAAA,MAGZ,KAAK;AACH,eAAO;AAAA,UACL,GAAGA;AAAA,UACH,YAAY;AAAA,UACZ,aAAa;AAAA,UACb,iBAAiB;AAAA,UACjB,cAAc;AAAA,QAAA;AAAA,MAGlB,KAAK;AACH,eAAOA;AAAA,MACT;AACE,eAAO;AAAA,UACL,GAAGA;AAAA,UACH,iBAAiB;AAAA,UACjB,QAAQ;AAAA,UACR,cAAc;AAAA,QAAA;AAAA,IAChB;AAAA,EAEN,GAGMC,IAAkB,MAAM;AAC5B,UAAMD,IAAa;AAAA,MACjB,UAAU;AAAA,MACV,YAAY;AAAA,MACZ,OAAO;AAAA,MACP,QAAQ;AAAA,IAAA;AAGV,YAAQd,GAAA;AAAA,MACN,KAAK;AAAA,MACL,KAAK;AACH,eAAO;AAAA,UACL,GAAGc;AAAA,UACH,SAAS;AAAA,UACT,iBAAiB;AAAA,UACjB,cAAc;AAAA,QAAA;AAAA,MAGlB,KAAK;AACH,eAAO;AAAA,UACL,GAAGA;AAAA,UACH,UAAU;AAAA,UACV,eAAe;AAAA,UACf,eAAe;AAAA,UACf,OAAO;AAAA,UACP,cAAc;AAAA,QAAA;AAAA,MAGlB;AACE,eAAO;AAAA,UACL,GAAGA;AAAA,UACH,SAAS;AAAA,QAAA;AAAA,IACX;AAAA,EAEN,GAGME,IAAmB,MAAM;AAC7B,UAAMF,IAAa;AAAA,MACjB,SAAS;AAAA,MACT,eAAe;AAAA,MACf,KAAK,GAAGb,CAAO;AAAA,IAAA;AAGjB,YAAQD,GAAA;AAAA,MACN,KAAK;AAAA,MACL,KAAK;AACH,eAAO;AAAA,UACL,GAAGc;AAAA,UACH,SAAS;AAAA,QAAA;AAAA,MAGb,KAAK;AACH,eAAO;AAAA,UACL,GAAGA;AAAA,UACH,SAAS;AAAA,QAAA;AAAA,MAGb;AACE,eAAO;AAAA,UACL,GAAGA;AAAA,UACH,SAAS;AAAA,QAAA;AAAA,IACX;AAAA,EAEN,GAGMG,IAAkB,MAAM;AAC5B,UAAMH,IAAa;AAAA,MACjB,UAAU;AAAA,MACV,OAAO;AAAA,MACP,QAAQ;AAAA,IAAA;AAGV,YAAQd,GAAA;AAAA,MACN,KAAK;AAAA,MACL,KAAK;AACH,eAAO;AAAA,UACL,GAAGc;AAAA,UACH,SAAS;AAAA,UACT,iBAAiB;AAAA,UACjB,WAAW;AAAA,QAAA;AAAA,MAGf;AACE,eAAO;AAAA,UACL,GAAGA;AAAA,UACH,SAAS;AAAA,QAAA;AAAA,IACX;AAAA,EAEN,GAGMI,IAAe,MAAM;AAEzB,UAAMC,IAAgBvB,KAASe,EAAeb,CAAM;AACpD,QAAI,CAACqB,EAAe,QAAO,CAAA;AAE3B,UAAMC,IAAeL,EAAA;AAGrB,QAAIb,GAAa;AACf,YAAMmB,IAAad,MAAc,MAAM;AAEvC,aAAO;AAAA,QACLb;AAAA,UACE;AAAA,UACA;AAAA,YACE,OAAO;AAAA,cACL,GAAG0B;AAAA,cACH,QAAQ;AAAA,cACR,SAAS;AAAA,cACT,YAAY;AAAA,cACZ,KAAK;AAAA,YAAA;AAAA,YAEP,SAASX;AAAA,UAAA;AAAA,UAEXf;AAAA,YACE;AAAA,YACA;AAAA,cACE,OAAO;AAAA,gBACL,UAAU;AAAA,gBACV,OAAO;AAAA,cAAA;AAAA,YACT;AAAA,YAEF4B,EAAKD,CAAU;AAAA,UAAA;AAAA,UAEjB,GAAI,OAAOF,KAAkB,WACzB,CAACG,EAAKH,CAAa,CAAC,IACpB,CAACA,EAAc,OAAA,CAAQ,EAAE,KAAA;AAAA,QAAK;AAAA,MACpC;AAAA,IAEJ;AAEA,WAAO;AAAA,MACLzB;AAAA,QACE;AAAA,QACA,EAAE,OAAO0B,EAAA;AAAA,QACT,GAAI,OAAOD,KAAkB,WACzB,CAACG,EAAKH,CAAa,CAAC,IACpB,CAACA,EAAc,OAAA,CAAQ,EAAE,KAAA;AAAA,MAAK;AAAA,IACpC;AAAA,EAEJ,GAGMI,IAAoB,MACpB,CAAC1B,KAAeU,EAAA,IAAoB,CAAA,IAEjC;AAAA,IACLb;AAAA,MACE;AAAA,MACA;AAAA,QACE,OAAO;AAAA,UACL,UAAU;AAAA,UACV,OAAO;AAAA,UACP,cAAc;AAAA,UACd,SAASM,MAAU,aAAaA,MAAU,UAAU,WAAW;AAAA,QAAA;AAAA,MACjE;AAAA,MAEFsB,EAAKzB,CAAW;AAAA,IAAA;AAAA,EAClB,GAKE2B,IAAgB,MAEhBtB,KAAeK,MACV,CAAA,IAGF;AAAA,IACLb;AAAA,MACE;AAAA,MACA;AAAA,QACE,OAAOsB,EAAA;AAAA,MAAiB;AAAA,MAE1B,GAAGtD,EAAmBC,GAAWQ,EAAc,YAAY;AAAA,IAAA;AAAA,EAC7D,GAKEsD,IAAe,MAAM;AACzB,UAAMC,IAAgBf,EAAeZ,CAAM;AAC3C,WAAI,CAAC2B,KAAiBnB,EAAA,IAAoB,CAAA,IAEnC;AAAA,MACLb;AAAA,QACE;AAAA,QACA;AAAA,UACE,OAAOuB,EAAA;AAAA,QAAgB;AAAA,QAEzB,GAAI,OAAOS,KAAkB,WACzB,CAACJ,EAAKI,CAAa,CAAC,IACpB,CAACA,EAAc,OAAA,CAAQ,EAAE,KAAA;AAAA,MAAK;AAAA,IACpC;AAAA,EAEJ;AA0BA,SAxB6C;AAAA,IAC3C,MAAM;AAAA,IACN,IAAIhD,EAAU,MAAM;AAAA,IACpB,QAAQ,MACNgB;AAAA,MACE;AAAA,MACA;AAAA,QACE,GAAGhB;AAAA,QACH,OAAOmC,EAAA;AAAA,QACP,cAAcR;AAAA,QACd,MAAMC;AAAA,QACN,4BAA4B;AAAA,QAC5B,oBAAoBJ;AAAA,QACpB,kBAAkBK,EAAA;AAAA,QAClB,cAAcP;AAAA,MAAA;AAAA,MAEhB,GAAGkB,EAAA;AAAA,MACH,GAAGK,EAAA;AAAA,MACH,GAAGC,EAAA;AAAA,MACH,GAAGC,EAAA;AAAA,IAAa;AAAA,IAEpB,OAAAtD;AAAA,EAAA;AAIJ,GAKawD,IAAY;AAAA;AAAA;AAAA;AAAA,EAIvB,gBAAgB,CAACC,OAGf,QAAQ,IAAI,uBAAuBA,CAAM,GAClC1D;AAAA;AAAA;AAAA;AAAA,EAMT,YAAY;AAAA;AAAA;AAAA;AAAA,IAIV,cAAc,CAAC2D,OACN;AAAA,MACL,QAAAA;AAAA,MACA,UAAU,OAAOC,OAER,EAAE,OAAO,IAAM,QAAQ,CAAA,EAAC;AAAA,IACjC;AAAA,EAEJ;AAAA;AAAA;AAAA;AAAA,EAMF,WAAW;AAAA;AAAA;AAAA;AAAA,IAIT,YAAY,CAAC5C,MAA0C;AACrD,YAAM6C,IAAW,IAAI,SAAA;AAErB,oBAAO,QAAQ7C,CAAM,EAAE,QAAQ,CAAC,CAAC8C,GAAKC,CAAK,MAAM;AAC/C,QAAIA,KAAU,SACRA,aAAiB,QAAQA,aAAiB,OAC5CF,EAAS,OAAOC,GAAKC,CAAK,IACjB,MAAM,QAAQA,CAAK,IAC5BA,EAAM,QAAQ,CAACC,GAAMC,MAAU;AAC7B,UAAAJ,EAAS,OAAO,GAAGC,CAAG,IAAIG,CAAK,KAAK,OAAOD,CAAI,CAAC;AAAA,QAClD,CAAC,IAEDH,EAAS,OAAOC,GAAK,OAAOC,CAAK,CAAC;AAAA,MAGxC,CAAC,GAEMF;AAAA,IACT;AAAA;AAAA;AAAA;AAAA,IAKA,mBAAmB,CAAC7C,MAAiD;AACnE,YAAMkD,IAAS,IAAI,gBAAA;AAEnB,oBAAO,QAAQlD,CAAM,EAAE,QAAQ,CAAC,CAAC8C,GAAKC,CAAK,MAAM;AAC/C,QAAIA,KAAU,SACR,MAAM,QAAQA,CAAK,IACrBA,EAAM,QAAQ,CAACC,MAASE,EAAO,OAAOJ,GAAK,OAAOE,CAAI,CAAC,CAAC,IAExDE,EAAO,OAAOJ,GAAK,OAAOC,CAAK,CAAC;AAAA,MAGtC,CAAC,GAEMG;AAAA,IACT;AAAA;AAAA;AAAA;AAAA,IAKA,QAAQ,CAAClD,MACA,KAAK,UAAUA,GAAQ,MAAM,CAAC;AAAA,EACvC;AAEJ;"}

package/dist/components/index.cjs

@@ -1,2 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("../Form-ueYEcSg1.cjs"),e=require("../forms-inputs-DQ5QI_SU.cjs"),o=require("../forms-complex-DLEnXXJ5.cjs");exports.Form=i.Form;exports.FormSection=i.FormSection;exports.FormUtils=i.FormUtils;exports.Checkbox=e.Checkbox;exports.CheckboxGroup=e.CheckboxGroup;exports.ColorField=e.ColorField;exports.CreditCardField=e.CreditCardField;exports.DateField=e.DateField;exports.EmailField=e.EmailField;exports.NumberField=e.NumberField;exports.PasswordField=e.PasswordField;exports.PhoneField=e.PhoneField;exports.PostalCodeField=e.PostalCodeField;exports.Radio=e.Radio;exports.RadioGroup=e.RadioGroup;exports.SSNField=e.SSNField;exports.SearchField=e.SearchField;exports.Switch=e.Switch;exports.TextArea=e.TextArea;exports.TextField=e.TextField;exports.TimeField=e.TimeField;exports.URLField=e.URLField;exports.Combobox=o.Combobox;exports.MultiSelect=o.MultiSelect;exports.Select=o.Select;
-//# sourceMappingURL=index.cjs.map

package/dist/components/index.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/components/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}