@getmicdrop/svelte-components 5.1.3 → 5.2.1

package/dist/recipes/feedback/ErrorDisplay.svelte.d.ts

@@ -1,37 +1,19 @@
-export default ErrorDisplay;
-type ErrorDisplay = SvelteComponent<{
-    className?: string | undefined;
-    error?: string | undefined;
-    show?: boolean | undefined;
-    icon?: string | undefined;
-    iconSize?: string | undefined;
-    shake?: boolean | undefined;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}> & {
-    $$bindings?: string | undefined;
-};
-declare const ErrorDisplay: $$__sveltets_2_IsomorphicComponent<{
-    className?: string | undefined;
-    error?: string | undefined;
-    show?: boolean | undefined;
-    icon?: string | undefined;
-    iconSize?: string | undefined;
-    shake?: boolean | undefined;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
-interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
-    new (options: import("svelte").ComponentConstructorOptions<Props>): import("svelte").SvelteComponent<Props, Events, Slots> & {
-        $$bindings?: Bindings;
-    } & Exports;
-    (internal: unknown, props: Props & {
-        $$events?: Events;
-        $$slots?: Slots;
-    }): Exports & {
-        $set?: any;
-        $on?: any;
-    };
-    z_$$bindings?: Bindings;
+type IconName = "Home" | "Shows" | "Availability" | "Profile" | "Payment" | "Notification" | "More" | "MoreHori" | "Info" | "ChevronLeft" | "ChevronRight" | "Signout" | "CheckCircle" | "CheckCircleOutline" | "ErrorCircle" | "ArrowLeft" | "ArrowRight" | "Back" | "DownArrow" | "Message" | "Reload" | "Copy" | "Cross";
+interface Props {
+    /** Error message to display */
+    error?: string;
+    /** Whether to show the error */
+    show?: boolean;
+    /** Whether to apply shake animation */
+    shake?: boolean;
+    /** Icon to display (from Icon component) */
+    icon?: IconName;
+    /** Size of the icon */
+    iconSize?: string;
+    /** Additional class for the container */
+    className?: string;
 }
+declare const ErrorDisplay: import("svelte").Component<Props, {}, "">;
+type ErrorDisplay = ReturnType<typeof ErrorDisplay>;
+export default ErrorDisplay;
 //# sourceMappingURL=ErrorDisplay.svelte.d.ts.map

package/dist/recipes/feedback/ErrorDisplay.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ErrorDisplay.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/recipes/feedback/ErrorDisplay.svelte.js"],"names":[],"mappings":";;;;;;;;;;;;;AAmDA;;;;;;;;;mBAAgL;6CATnI,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,OAAO,OAAO,QAAQ;IAC3L,cAAc,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,WAAW,OAAO,SAAS,KAAK,GAAG;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IAC9G,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"ErrorDisplay.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/recipes/feedback/ErrorDisplay.svelte.ts"],"names":[],"mappings":"AAME,KAAK,QAAQ,GAAG,MAAM,GAAG,OAAO,GAAG,cAAc,GAAG,SAAS,GAAG,SAAS,GAAG,cAAc,GAAG,MAAM,GAAG,UAAU,GAAG,MAAM,GAAG,aAAa,GAAG,cAAc,GAAG,SAAS,GAAG,aAAa,GAAG,oBAAoB,GAAG,aAAa,GAAG,WAAW,GAAG,YAAY,GAAG,MAAM,GAAG,WAAW,GAAG,SAAS,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAO,CAAC;AAE5T,UAAU,KAAK;IACb,+BAA+B;IAC/B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,gCAAgC;IAChC,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,uCAAuC;IACvC,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,4CAA4C;IAC5C,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,uBAAuB;IACvB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,yCAAyC;IACzC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAyBH,QAAA,MAAM,YAAY,2CAAwC,CAAC;AAC3D,KAAK,YAAY,GAAG,UAAU,CAAC,OAAO,YAAY,CAAC,CAAC;AACpD,eAAe,YAAY,CAAC"}

package/dist/recipes/feedback/StatusIndicator/StatusIndicator.svelte

@@ -1,14 +1,12 @@
-<script>
-  /**
-   * StatusIndicator - Animated spinner/checkmark/error indicator
-   *
-   * Shows loading spinner, success checkmark, or error X with smooth animations.
-   * Used in modals to show action progress and result.
-   *
-   * Flowbite-native: Uses Tailwind colors with minimal animation styles
-   */
-  export let status = "idle"; // "idle" | "loading" | "success" | "error"
-  export let size = 48; // Size in pixels
+<script lang="ts">
+  interface Props {
+    /** Current status: idle, loading, success, or error */
+    status?: "idle" | "loading" | "success" | "error";
+    /** Size in pixels */
+    size?: number;
+  }
+
+  let { status = "idle", size = 48 }: Props = $props();
 </script>
 
 <div
@@ -86,7 +84,6 @@
 </div>
 
 <style>
-  /* Spinner animation - cannot be expressed in Tailwind */
   .spinner svg {
     animation: rotate 1s linear infinite;
   }
@@ -118,7 +115,6 @@
     }
   }
 
-  /* Success animation */
   .success-circle {
     animation: pop-in 300ms ease-out;
   }
@@ -149,7 +145,6 @@
     }
   }
 
-  /* Error animation */
   .error-circle {
     animation: pop-in 300ms ease-out;
   }

package/dist/recipes/feedback/StatusIndicator/StatusIndicator.svelte.d.ts

@@ -1,29 +1,10 @@
-export default StatusIndicator;
-type StatusIndicator = SvelteComponent<{
-    size?: number | undefined;
-    status?: string | undefined;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}> & {
-    $$bindings?: string | undefined;
-};
-declare const StatusIndicator: $$__sveltets_2_IsomorphicComponent<{
-    size?: number | undefined;
-    status?: string | undefined;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
-interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
-    new (options: import("svelte").ComponentConstructorOptions<Props>): import("svelte").SvelteComponent<Props, Events, Slots> & {
-        $$bindings?: Bindings;
-    } & Exports;
-    (internal: unknown, props: Props & {
-        $$events?: Events;
-        $$slots?: Slots;
-    }): Exports & {
-        $set?: any;
-        $on?: any;
-    };
-    z_$$bindings?: Bindings;
+interface Props {
+    /** Current status: idle, loading, success, or error */
+    status?: "idle" | "loading" | "success" | "error";
+    /** Size in pixels */
+    size?: number;
 }
+declare const StatusIndicator: import("svelte").Component<Props, {}, "">;
+type StatusIndicator = ReturnType<typeof StatusIndicator>;
+export default StatusIndicator;
 //# sourceMappingURL=StatusIndicator.svelte.d.ts.map

package/dist/recipes/feedback/StatusIndicator/StatusIndicator.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StatusIndicator.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/recipes/feedback/StatusIndicator/StatusIndicator.svelte.js"],"names":[],"mappings":";;;;;;;;;AA+DA;;;;;mBAA8I;6CATjG,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,OAAO,OAAO,QAAQ;IAC3L,cAAc,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,WAAW,OAAO,SAAS,KAAK,GAAG;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IAC9G,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"StatusIndicator.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/recipes/feedback/StatusIndicator/StatusIndicator.svelte.ts"],"names":[],"mappings":"AAGE,UAAU,KAAK;IACb,uDAAuD;IACvD,MAAM,CAAC,EAAE,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,CAAC;IAClD,qBAAqB;IACrB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAqCH,QAAA,MAAM,eAAe,2CAAwC,CAAC;AAC9D,KAAK,eAAe,GAAG,UAAU,CAAC,OAAO,eAAe,CAAC,CAAC;AAC1D,eAAe,eAAe,CAAC"}

package/dist/recipes/fields/CheckboxField.svelte

@@ -1,51 +1,54 @@
-<script>
-  /**
-   * CheckboxField - Checkbox with label, description, and error support
-   *
-   * Wraps the Checkbox primitive with form field features.
-   *
-   * @example
-   * <CheckboxField
-   *   label="Accept terms"
-   *   description="You agree to our terms of service"
-   *   bind:checked={acceptTerms}
-   *   error={$errors.acceptTerms}
-   *   required
-   * />
-   */
+<script lang="ts">
   import Checkbox from '../../primitives/Checkbox/Checkbox.svelte';
   import ValidationError from '../../primitives/ValidationError.svelte';
 
-  /** Whether the checkbox is checked */
-  export let checked = false;
+  interface Props {
+    /** Whether the checkbox is checked */
+    checked?: boolean;
+    /** The value attribute */
+    value?: string;
+    /** Name attribute for form submission */
+    name?: string;
+    /** Whether the checkbox is disabled */
+    disabled?: boolean;
+    /** Color variant */
+    color?: 'blue' | 'red' | 'green' | 'purple' | 'orange' | 'yellow';
+    /** Label text displayed next to the checkbox */
+    label?: string;
+    /** Description text shown below the label */
+    description?: string;
+    /** Error message to display */
+    error?: string;
+    /** Show required indicator */
+    required?: boolean;
+    /** Additional class for the wrapper div */
+    class?: string;
+    /** Change handler */
+    onchange?: (detail: { checked: boolean; value: string }) => void;
+    /** Click handler */
+    onclick?: () => void;
+    /** Focus handler */
+    onfocus?: () => void;
+    /** Blur handler */
+    onblur?: () => void;
+  }
 
-  /** The value attribute */
-  export let value = '';
-
-  /** Name attribute for form submission */
-  export let name = '';
-
-  /** Whether the checkbox is disabled */
-  export let disabled = false;
-
-  /** Color variant */
-  export let color = 'blue';
-
-  /** Label text displayed next to the checkbox */
-  export let label = '';
-
-  /** Description text shown below the label */
-  export let description = '';
-
-  /** Error message to display */
-  export let error = '';
-
-  /** Show required indicator */
-  export let required = false;
-
-  /** Additional class for the wrapper div */
-  let className = '';
-  export { className as class };
+  let {
+    checked = $bindable(false),
+    value = '',
+    name = '',
+    disabled = false,
+    color = 'blue',
+    label = '',
+    description = '',
+    error = '',
+    required = false,
+    class: className = '',
+    onchange,
+    onclick,
+    onfocus,
+    onblur
+  }: Props = $props();
 </script>
 
 <div class={className}>
@@ -57,10 +60,10 @@
         {disabled}
         {color}
         bind:checked
-        on:change
-        on:click
-        on:focus
-        on:blur
+        {onchange}
+        {onclick}
+        {onfocus}
+        {onblur}
       />
     </div>
     {#if label || description}

package/dist/recipes/fields/CheckboxField.svelte.d.ts

@@ -1,55 +1,37 @@
-export default CheckboxField;
-type CheckboxField = SvelteComponent<{
-    class?: string | undefined;
-    color?: string | undefined;
-    name?: string | undefined;
-    error?: string | undefined;
-    disabled?: boolean | undefined;
-    checked?: boolean | undefined;
-    value?: string | undefined;
-    label?: string | undefined;
-    required?: boolean | undefined;
-    description?: string | undefined;
-}, {
-    change: CustomEvent<any>;
-    click: PointerEvent;
-    focus: FocusEvent;
-    blur: FocusEvent;
-} & {
-    [evt: string]: CustomEvent<any>;
-}, {}> & {
-    $$bindings?: string | undefined;
-};
-declare const CheckboxField: $$__sveltets_2_IsomorphicComponent<{
-    class?: string | undefined;
-    color?: string | undefined;
-    name?: string | undefined;
-    error?: string | undefined;
-    disabled?: boolean | undefined;
-    checked?: boolean | undefined;
-    value?: string | undefined;
-    label?: string | undefined;
-    required?: boolean | undefined;
-    description?: string | undefined;
-}, {
-    change: CustomEvent<any>;
-    click: PointerEvent;
-    focus: FocusEvent;
-    blur: FocusEvent;
-} & {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
-interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
-    new (options: import("svelte").ComponentConstructorOptions<Props>): import("svelte").SvelteComponent<Props, Events, Slots> & {
-        $$bindings?: Bindings;
-    } & Exports;
-    (internal: unknown, props: Props & {
-        $$events?: Events;
-        $$slots?: Slots;
-    }): Exports & {
-        $set?: any;
-        $on?: any;
-    };
-    z_$$bindings?: Bindings;
+interface Props {
+    /** Whether the checkbox is checked */
+    checked?: boolean;
+    /** The value attribute */
+    value?: string;
+    /** Name attribute for form submission */
+    name?: string;
+    /** Whether the checkbox is disabled */
+    disabled?: boolean;
+    /** Color variant */
+    color?: 'blue' | 'red' | 'green' | 'purple' | 'orange' | 'yellow';
+    /** Label text displayed next to the checkbox */
+    label?: string;
+    /** Description text shown below the label */
+    description?: string;
+    /** Error message to display */
+    error?: string;
+    /** Show required indicator */
+    required?: boolean;
+    /** Additional class for the wrapper div */
+    class?: string;
+    /** Change handler */
+    onchange?: (detail: {
+        checked: boolean;
+        value: string;
+    }) => void;
+    /** Click handler */
+    onclick?: () => void;
+    /** Focus handler */
+    onfocus?: () => void;
+    /** Blur handler */
+    onblur?: () => void;
 }
+declare const CheckboxField: import("svelte").Component<Props, {}, "checked">;
+type CheckboxField = ReturnType<typeof CheckboxField>;
+export default CheckboxField;
 //# sourceMappingURL=CheckboxField.svelte.d.ts.map

package/dist/recipes/fields/CheckboxField.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CheckboxField.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/recipes/fields/CheckboxField.svelte.js"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAoGA;;;;;;;;;;;;;;;;;;mBAAyN;6CAT5K,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,OAAO,OAAO,QAAQ;IAC3L,cAAc,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,WAAW,OAAO,SAAS,KAAK,GAAG;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IAC9G,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"CheckboxField.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/recipes/fields/CheckboxField.svelte.ts"],"names":[],"mappings":"AAOE,UAAU,KAAK;IACb,sCAAsC;IACtC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,0BAA0B;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,yCAAyC;IACzC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,uCAAuC;IACvC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,oBAAoB;IACpB,KAAK,CAAC,EAAE,MAAM,GAAG,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,QAAQ,GAAG,QAAQ,CAAC;IAClE,gDAAgD;IAChD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,6CAA6C;IAC7C,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,+BAA+B;IAC/B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,8BAA8B;IAC9B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,2CAA2C;IAC3C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,qBAAqB;IACrB,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE;QAAE,OAAO,EAAE,OAAO,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IACjE,oBAAoB;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,oBAAoB;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,mBAAmB;IACnB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;CACrB;AAgDH,QAAA,MAAM,aAAa,kDAAwC,CAAC;AAC5D,KAAK,aAAa,GAAG,UAAU,CAAC,OAAO,aAAa,CAAC,CAAC;AACtD,eAAe,aAAa,CAAC"}

package/dist/recipes/fields/FormField.svelte

@@ -1,39 +1,36 @@
-<script>
-  /**
-   * FormField - A composition of Label + input slot + ValidationError
-   *
-   * Use this to wrap any input primitive with consistent label, hint, and error display.
-   * For Input component, you can use its built-in label/error props instead.
-   *
-   * @example
-   * <FormField label="Email" error={$errors.email} required>
-   *   <Select bind:value={email} options={options} />
-   * </FormField>
-   */
+<script lang="ts">
+  import type { Snippet } from 'svelte';
   import Label from '../../primitives/Label/Label.svelte';
   import ValidationError from '../../primitives/ValidationError.svelte';
 
-  /** Field label text */
-  export let label = '';
-
-  /** Error message to display */
-  export let error = '';
-
-  /** Hint text shown below input (hidden when error is shown) */
-  export let hint = '';
-
-  /** Show required indicator (*) after label */
-  export let required = false;
-
-  /** ID to pass to the input via slot props */
-  export let id = crypto.randomUUID();
-
-  /** Additional class for the wrapper div */
-  let className = '';
-  export { className as class };
-
-  // Determine label color based on error state
-  $: labelColor = error ? 'red' : 'gray';
+  interface Props {
+    /** Field label text */
+    label?: string;
+    /** Error message to display */
+    error?: string;
+    /** Hint text shown below input */
+    hint?: string;
+    /** Show required indicator after label */
+    required?: boolean;
+    /** ID to pass to the input via slot props */
+    id?: string;
+    /** Additional class for the wrapper div */
+    class?: string;
+    /** Child content (receives id, error, required as props) */
+    children?: Snippet<[{ id: string; error: string; required: boolean }]>;
+  }
+
+  let {
+    label = '',
+    error = '',
+    hint = '',
+    required = false,
+    id = crypto.randomUUID(),
+    class: className = '',
+    children
+  }: Props = $props();
+
+  let labelColor: 'red' | 'gray' = $derived(error ? 'red' : 'gray');
 </script>
 
 <div class="space-y-1 {className}">
@@ -43,7 +40,7 @@
     </Label>
   {/if}
 
-  <slot {id} {error} {required} />
+  {@render children?.({ id, error, required })}
 
   {#if hint && !error}
     <p class="text-sm text-gray-500 dark:text-gray-400">{hint}</p>

package/dist/recipes/fields/FormField.svelte.d.ts

@@ -1,66 +1,25 @@
-export default FormField;
-type FormField = SvelteComponent<$$__sveltets_2_PropsWithChildren<{
-    class?: string | undefined;
-    error?: string | undefined;
-    label?: string | undefined;
-    id?: `${string}-${string}-${string}-${string}-${string}` | undefined;
-    required?: boolean | undefined;
-    hint?: string | undefined;
-}, {
-    default: {
-        id: `${string}-${string}-${string}-${string}-${string}`;
-        error: string;
-        required: boolean;
-    };
-}>, {
-    [evt: string]: CustomEvent<any>;
-}, {
-    default: {
-        id: `${string}-${string}-${string}-${string}-${string}`;
-        error: string;
-        required: boolean;
-    };
-}> & {
-    $$bindings?: string | undefined;
-};
-declare const FormField: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_PropsWithChildren<{
-    class?: string | undefined;
-    error?: string | undefined;
-    label?: string | undefined;
-    id?: `${string}-${string}-${string}-${string}-${string}` | undefined;
-    required?: boolean | undefined;
-    hint?: string | undefined;
-}, {
-    default: {
-        id: `${string}-${string}-${string}-${string}-${string}`;
-        error: string;
-        required: boolean;
-    };
-}>, {
-    [evt: string]: CustomEvent<any>;
-}, {
-    default: {
-        id: `${string}-${string}-${string}-${string}-${string}`;
+import type { Snippet } from 'svelte';
+interface Props {
+    /** Field label text */
+    label?: string;
+    /** Error message to display */
+    error?: string;
+    /** Hint text shown below input */
+    hint?: string;
+    /** Show required indicator after label */
+    required?: boolean;
+    /** ID to pass to the input via slot props */
+    id?: string;
+    /** Additional class for the wrapper div */
+    class?: string;
+    /** Child content (receives id, error, required as props) */
+    children?: Snippet<[{
+        id: string;
         error: string;
         required: boolean;
-    };
-}, {}, string>;
-type $$__sveltets_2_PropsWithChildren<Props, Slots> = Props & (Slots extends {
-    default: any;
-} ? Props extends Record<string, never> ? any : {
-    children?: any;
-} : {});
-interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
-    new (options: import("svelte").ComponentConstructorOptions<Props>): import("svelte").SvelteComponent<Props, Events, Slots> & {
-        $$bindings?: Bindings;
-    } & Exports;
-    (internal: unknown, props: Props & {
-        $$events?: Events;
-        $$slots?: Slots;
-    }): Exports & {
-        $set?: any;
-        $on?: any;
-    };
-    z_$$bindings?: Bindings;
+    }]>;
 }
+declare const FormField: import("svelte").Component<Props, {}, "">;
+type FormField = ReturnType<typeof FormField>;
+export default FormField;
 //# sourceMappingURL=FormField.svelte.d.ts.map

package/dist/recipes/fields/FormField.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FormField.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/recipes/fields/FormField.svelte.js"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAmFA;;;;;;;;;;;;;;;;;;;;;eAA6K;sCATvI,KAAK,EAAE,KAAK;;;;;6CALL,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,OAAO,OAAO,QAAQ;IAC3L,cAAc,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,WAAW,OAAO,SAAS,KAAK,GAAG;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IAC9G,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"FormField.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/recipes/fields/FormField.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AAKpC,UAAU,KAAK;IACb,uBAAuB;IACvB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,+BAA+B;IAC/B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,kCAAkC;IAClC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,0CAA0C;IAC1C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,6CAA6C;IAC7C,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,2CAA2C;IAC3C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,4DAA4D;IAC5D,QAAQ,CAAC,EAAE,OAAO,CAAC,CAAC;QAAE,EAAE,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,OAAO,CAAA;KAAE,CAAC,CAAC,CAAC;CACxE;AAsCH,QAAA,MAAM,SAAS,2CAAwC,CAAC;AACxD,KAAK,SAAS,GAAG,UAAU,CAAC,OAAO,SAAS,CAAC,CAAC;AAC9C,eAAe,SAAS,CAAC"}