ui-ingredients 0.0.29 → 0.0.31

package/dist/editable/create-editable.svelte.js

@@ -1,14 +1,14 @@
-import { createUniqueId } from '../create-unique-id.js';
 import { getEnvironmentContext } from '../environment-provider/context.svelte.js';
 import { getLocaleContext } from '../locale-provider/context.svelte.js';
 import * as editable from '@zag-js/editable';
 import { normalizeProps, reflect, useMachine } from '@zag-js/svelte';
+import { uid } from 'uid';
 export function createEditable(props) {
     const locale = getLocaleContext();
     const environment = getEnvironmentContext();
     const [state, send] = useMachine(editable.machine({
         ...props,
-        id: props.id ?? createUniqueId(),
+        id: props.id ?? uid(),
         dir: locale?.dir,
         edit: props.defaultEdit ?? props.edit,
         getRootNode: environment?.getRootNode,

package/dist/editable/editable.d.ts

@@ -1,4 +1,3 @@
-export { anatomy } from '@zag-js/editable';
 export { default as Area } from './area.svelte';
 export { default as CancelTrigger } from './cancel-trigger.svelte';
 export { default as Control } from './control.svelte';

package/dist/editable/editable.js

@@ -1,4 +1,3 @@
-export { anatomy } from '@zag-js/editable';
 export { default as Area } from './area.svelte';
 export { default as CancelTrigger } from './cancel-trigger.svelte';
 export { default as Control } from './control.svelte';

package/dist/editable/index.d.ts

@@ -8,3 +8,4 @@ export type { EditableLabelProps } from './label.svelte';
 export type { EditablePreviewProps } from './preview.svelte';
 export type { EditableProps } from './root.svelte';
 export type { EditableSubmitTriggerProps } from './submit-trigger.svelte';
+export { anatomy as editableAnatomy } from '@zag-js/editable';

package/dist/editable/index.js

@@ -1 +1,2 @@
 export * as Editable from './editable.js';
+export { anatomy as editableAnatomy } from '@zag-js/editable';

package/dist/editable/root.svelte

@@ -15,6 +15,7 @@
 
 <script lang="ts">
   import {mergeProps} from '../merge-props.js';
+  import {reflect} from '@zag-js/svelte';
   import {createSplitProps} from '@zag-js/utils';
   import {editableContext} from './context.svelte.js';
   import {createEditable} from './create-editable.svelte.js';
@@ -52,7 +53,7 @@
     ])(props),
   );
 
-  let editable = createEditable(editableProps);
+  let editable = createEditable(reflect(() => editableProps));
 
   let mergedProps = $derived(mergeProps(otherProps, editable.getRootProps()));
 

package/dist/field/anatomy.d.ts

@@ -0,0 +1,2 @@
+export declare const anatomy: import("@zag-js/anatomy").AnatomyInstance<"input" | "label" | "select" | "textarea" | "root" | "errorText" | "helperText">;
+export declare const parts: Record<"input" | "label" | "select" | "textarea" | "root" | "errorText" | "helperText", import("@zag-js/anatomy").AnatomyPart>;

package/dist/field/anatomy.js

@@ -0,0 +1,3 @@
+import { createAnatomy } from '@zag-js/anatomy';
+export const anatomy = createAnatomy('field').parts('root', 'label', 'input', 'select', 'textarea', 'errorText', 'helperText');
+export const parts = anatomy.build();

package/dist/field/context.svelte.d.ts

@@ -0,0 +1,3 @@
+import { Context } from '../context.svelte.js';
+import type { CreateFieldReturn } from './create-field.svelte.js';
+export declare const fieldContext: Context<CreateFieldReturn>;

package/dist/field/context.svelte.js

@@ -0,0 +1,2 @@
+import { Context } from '../context.svelte.js';
+export const fieldContext = new Context('Field');

package/dist/field/create-field.svelte.d.ts

@@ -0,0 +1,28 @@
+import type { HTMLProps } from '../types.js';
+interface ElementIds {
+    root?: string;
+    label?: string;
+    control?: string;
+    errorText?: string;
+    helperText?: string;
+}
+export interface CreateFieldProps {
+    id?: string | null;
+    ids?: ElementIds;
+    invalid?: boolean;
+    required?: boolean;
+    disabled?: boolean;
+    readOnly?: boolean;
+}
+export interface CreateFieldReturn extends ReturnType<typeof createField> {
+}
+export declare function createField(props: CreateFieldProps): {
+    getRootProps: () => HTMLProps<"div">;
+    getLabelProps: () => HTMLProps<"label">;
+    getErrorTextProps: () => HTMLProps<"div">;
+    getHelperTextProps: () => HTMLProps<"div">;
+    getInputProps: () => HTMLProps<"input">;
+    getSelectProps: () => HTMLProps<"select">;
+    getTextareaProps: () => HTMLProps<"textarea">;
+};
+export {};

package/dist/field/create-field.svelte.js

@@ -0,0 +1,142 @@
+import { ariaAttr, dataAttr } from '@zag-js/dom-query';
+import { uid } from 'uid';
+import { parts } from './anatomy.js';
+export function createField(props) {
+    const id_ = uid();
+    const { 
+    /**/
+    ids, invalid, disabled, required, readonly, } = $derived.by(() => {
+        const id = props.id ?? id_;
+        const ids = {
+            root: props.ids?.root ?? `field:${id}`,
+            label: props.ids?.label ?? `field:${id}:label`,
+            control: props.ids?.control ?? `field:${id}:control`,
+            errorText: props.ids?.errorText ?? `field:${id}:error-text`,
+            helperText: props.ids?.helperText ?? `field:${id}:helper-text`,
+        };
+        return {
+            ids,
+            invalid: props.invalid ?? false,
+            required: props.required ?? false,
+            disabled: props.disabled ?? false,
+            readonly: props.readOnly ?? false,
+        };
+    });
+    let hasErrorText = $state(false);
+    let hasHelperText = $state(false);
+    const ariaDescribedby = $derived.by(() => {
+        const l = [];
+        if (hasErrorText) {
+            l.push(ids.errorText);
+        }
+        if (hasHelperText) {
+            l.push(ids.helperText);
+        }
+        return l.join(' ');
+    });
+    $effect(() => {
+        if (invalid && document.getElementById(ids.errorText)) {
+            hasErrorText = true;
+        }
+    });
+    $effect(() => {
+        if (document.getElementById(ids.helperText)) {
+            hasHelperText = true;
+        }
+    });
+    function getRootProps() {
+        return {
+            ...parts.root.attrs,
+            id: ids.root,
+            role: 'group',
+            'data-invalid': dataAttr(invalid),
+            'data-disabled': dataAttr(disabled),
+            'data-required': dataAttr(required),
+            'data-readonly': dataAttr(readonly),
+        };
+    }
+    function getLabelProps() {
+        return {
+            ...parts.label.attrs,
+            id: ids.label,
+            for: ids.control,
+            'data-invalid': dataAttr(invalid),
+            'data-disabled': dataAttr(disabled),
+            'data-required': dataAttr(required),
+            'data-readonly': dataAttr(readonly),
+        };
+    }
+    function getErrorTextProps() {
+        return {
+            ...parts.errorText.attrs,
+            id: ids.errorText,
+            hidden: !hasErrorText,
+            'data-invalid': dataAttr(invalid),
+            'data-disabled': dataAttr(disabled),
+            'data-required': dataAttr(required),
+            'data-readonly': dataAttr(readonly),
+        };
+    }
+    function getHelperTextProps() {
+        return {
+            id: ids.helperText,
+            'data-invalid': dataAttr(invalid),
+            'data-disabled': dataAttr(disabled),
+            'data-required': dataAttr(required),
+            'data-readonly': dataAttr(readonly),
+        };
+    }
+    function getInputProps() {
+        return {
+            ...parts.input.attrs,
+            id: ids.control,
+            disabled,
+            required,
+            readonly,
+            'aria-invalid': ariaAttr(invalid),
+            'aria-describedby': ariaDescribedby,
+            'data-invalid': dataAttr(invalid),
+            'data-disabled': dataAttr(disabled),
+            'data-required': dataAttr(required),
+            'data-readonly': dataAttr(readonly),
+        };
+    }
+    function getSelectProps() {
+        return {
+            ...parts.select.attrs,
+            id: ids.control,
+            disabled,
+            required,
+            'aria-invalid': ariaAttr(invalid),
+            'aria-readonly': ariaAttr(readonly),
+            'aria-describedby': ariaDescribedby,
+            'data-invalid': dataAttr(invalid),
+            'data-disabled': dataAttr(disabled),
+            'data-required': dataAttr(required),
+            'data-readonly': dataAttr(readonly),
+        };
+    }
+    function getTextareaProps() {
+        return {
+            ...parts.textarea.attrs,
+            id: ids.control,
+            disabled,
+            required,
+            readonly,
+            'aria-describedby': ariaDescribedby,
+            'data-invalid': dataAttr(invalid),
+            'data-disabled': dataAttr(disabled),
+            'data-required': dataAttr(required),
+            'data-readonly': dataAttr(readonly),
+        };
+    }
+    return {
+        getRootProps,
+        getLabelProps,
+        getErrorTextProps,
+        getHelperTextProps,
+        getInputProps,
+        getSelectProps,
+        getTextareaProps,
+    };
+}

package/dist/field/error-text.svelte

@@ -0,0 +1,26 @@
+<script lang="ts" module>
+  import type {AsChild, HTMLProps} from '../types.js';
+
+  export interface FieldErrorTextProps extends HTMLProps<'div'> {
+    asChild?: AsChild;
+  }
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '../merge-props.js';
+  import {fieldContext} from './context.svelte.js';
+
+  let {asChild, children, ...props}: FieldErrorTextProps = $props();
+
+  let field = fieldContext.get();
+
+  let mergedProps = $derived(mergeProps(props, field.getErrorTextProps()));
+</script>
+
+{#if asChild}
+  {@render asChild(mergedProps)}
+{:else}
+  <div {...mergedProps}>
+    {@render children?.()}
+  </div>
+{/if}

package/dist/field/error-text.svelte.d.ts

@@ -0,0 +1,18 @@
+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 ErrorText: $$__sveltets_2_IsomorphicComponent<FieldErrorTextProps, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, "">;
+type ErrorText = InstanceType<typeof ErrorText>;
+export default ErrorText;

package/dist/field/field.d.ts

@@ -0,0 +1,7 @@
+export { default as ErrorText } from './error-text.svelte';
+export { default as HelperText } from './helper-text.svelte';
+export { default as Input } from './input.svelte';
+export { default as Label } from './label.svelte';
+export { default as Root } from './root.svelte';
+export { default as Select } from './select.svelte';
+export { default as Textarea } from './textarea.svelte';

package/dist/field/field.js

@@ -0,0 +1,7 @@
+export { default as ErrorText } from './error-text.svelte';
+export { default as HelperText } from './helper-text.svelte';
+export { default as Input } from './input.svelte';
+export { default as Label } from './label.svelte';
+export { default as Root } from './root.svelte';
+export { default as Select } from './select.svelte';
+export { default as Textarea } from './textarea.svelte';

package/dist/field/helper-text.svelte

@@ -0,0 +1,26 @@
+<script lang="ts" module>
+  import type {AsChild, HTMLProps} from '../types.js';
+
+  export interface FieldHelperTextProps extends HTMLProps<'div'> {
+    asChild?: AsChild;
+  }
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '../merge-props.js';
+  import {fieldContext} from './context.svelte.js';
+
+  let {asChild, children, ...props}: FieldHelperTextProps = $props();
+
+  let field = fieldContext.get();
+
+  let mergedProps = $derived(mergeProps(props, field.getHelperTextProps()));
+</script>
+
+{#if asChild}
+  {@render asChild(mergedProps)}
+{:else}
+  <div {...mergedProps}>
+    {@render children?.()}
+  </div>
+{/if}

package/dist/field/helper-text.svelte.d.ts

@@ -0,0 +1,18 @@
+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 HelperText: $$__sveltets_2_IsomorphicComponent<FieldHelperTextProps, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, "">;
+type HelperText = InstanceType<typeof HelperText>;
+export default HelperText;

package/dist/field/index.d.ts

@@ -0,0 +1,9 @@
+export { anatomy as fieldAnatomy } from './anatomy.js';
+export type { FieldErrorTextProps } from './error-text.svelte';
+export type { FieldHelperTextProps } from './helper-text.svelte';
+export type { FieldInputProps } from './input.svelte';
+export type { FieldLabelProps } from './label.svelte';
+export type { FieldProps } from './root.svelte';
+export type { FieldSelectProps } from './select.svelte';
+export type { FieldTextareaProps } from './textarea.svelte';
+export * as Field from './field.js';

package/dist/field/index.js

@@ -0,0 +1,2 @@
+export { anatomy as fieldAnatomy } from './anatomy.js';
+export * as Field from './field.js';

package/dist/field/input.svelte

@@ -0,0 +1,24 @@
+<script lang="ts" module>
+  import type {AsChild, HTMLProps} from '../types.js';
+
+  export interface FieldInputProps extends HTMLProps<'input'> {
+    asChild?: AsChild;
+  }
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '../merge-props.js';
+  import {fieldContext} from './context.svelte.js';
+
+  let {asChild, ...props}: FieldInputProps = $props();
+
+  let field = fieldContext.get();
+
+  let mergedProps = $derived(mergeProps(props, field.getInputProps()));
+</script>
+
+{#if asChild}
+  {@render asChild(mergedProps)}
+{:else}
+  <input {...mergedProps} />
+{/if}

package/dist/field/input.svelte.d.ts

@@ -0,0 +1,18 @@
+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 Input: $$__sveltets_2_IsomorphicComponent<FieldInputProps, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, "">;
+type Input = InstanceType<typeof Input>;
+export default Input;

package/dist/field/label.svelte

@@ -0,0 +1,26 @@
+<script lang="ts" module>
+  import type {AsChild, HTMLProps} from '../types.js';
+
+  export interface FieldLabelProps extends HTMLProps<'label'> {
+    asChild?: AsChild;
+  }
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '../merge-props.js';
+  import {fieldContext} from './context.svelte.js';
+
+  let {children, asChild, ...props}: FieldLabelProps = $props();
+
+  let field = fieldContext.get();
+
+  let mergedProps = $derived(mergeProps(props, field.getLabelProps()));
+</script>
+
+{#if asChild}
+  {@render asChild(mergedProps)}
+{:else}
+  <label {...mergedProps}>
+    {@render children?.()}
+  </label>
+{/if}

package/dist/field/label.svelte.d.ts

@@ -0,0 +1,18 @@
+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 Label: $$__sveltets_2_IsomorphicComponent<FieldLabelProps, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, "">;
+type Label = InstanceType<typeof Label>;
+export default Label;

package/dist/field/root.svelte

@@ -0,0 +1,44 @@
+<script lang="ts" module>
+  import type {AsChild, Assign, HTMLProps} from '../types.js';
+  import type {
+    CreateFieldProps,
+    CreateFieldReturn,
+  } from './create-field.svelte.js';
+
+  export interface FieldProps
+    extends Assign<HTMLProps<'div'>, CreateFieldProps> {
+    asChild?: AsChild<CreateFieldReturn>;
+  }
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '../merge-props.js';
+  import {createSplitProps} from '@zag-js/utils';
+  import {fieldContext} from './context.svelte.js';
+  import {createField} from './create-field.svelte.js';
+
+  let {asChild, children, ...props}: FieldProps = $props();
+
+  let [fieldProps, otherProps] = createSplitProps<CreateFieldProps>([
+    'id',
+    'ids',
+    'invalid',
+    'disabled',
+    'readOnly',
+    'required',
+  ])(props);
+
+  let field = createField(fieldProps);
+
+  let mergedProps = $derived(mergeProps(otherProps, field.getRootProps()));
+
+  fieldContext.set(field);
+</script>
+
+{#if asChild}
+  {@render asChild(mergedProps, field)}
+{:else}
+  <div {...mergedProps}>
+    {@render children?.()}
+  </div>
+{/if}

package/dist/field/root.svelte.d.ts

@@ -0,0 +1,18 @@
+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 Root: $$__sveltets_2_IsomorphicComponent<FieldProps, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, "">;
+type Root = InstanceType<typeof Root>;
+export default Root;

package/dist/field/select.svelte

@@ -0,0 +1,24 @@
+<script lang="ts" module>
+  import type {AsChild, HTMLProps} from '../types.js';
+
+  export interface FieldSelectProps extends HTMLProps<'select'> {
+    asChild?: AsChild;
+  }
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '../merge-props.js';
+  import {fieldContext} from './context.svelte.js';
+
+  let {children, asChild, ...props}: FieldSelectProps = $props();
+
+  let field = fieldContext.get();
+
+  let mergedProps = $derived(mergeProps(props, field.getSelectProps()));
+</script>
+
+{#if asChild}
+  {@render asChild(mergedProps)}
+{:else}
+  <select {...mergedProps}>{@render children?.()}</select>
+{/if}

package/dist/field/select.svelte.d.ts

@@ -0,0 +1,18 @@
+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 Select: $$__sveltets_2_IsomorphicComponent<FieldSelectProps, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, "">;
+type Select = InstanceType<typeof Select>;
+export default Select;

package/dist/field/textarea.svelte

@@ -0,0 +1,24 @@
+<script lang="ts" module>
+  import type {AsChild, HTMLProps} from '../types.js';
+
+  export interface FieldTextareaProps extends HTMLProps<'textarea'> {
+    asChild?: AsChild;
+  }
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '../merge-props.js';
+  import {fieldContext} from './context.svelte.js';
+
+  let {asChild, ...props}: FieldTextareaProps = $props();
+
+  let field = fieldContext.get();
+
+  let mergedProps = $derived(mergeProps(props, field.getTextareaProps()));
+</script>
+
+{#if asChild}
+  {@render asChild(mergedProps)}
+{:else}
+  <textarea {...mergedProps}></textarea>
+{/if}

package/dist/field/textarea.svelte.d.ts

@@ -0,0 +1,18 @@
+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 Textarea: $$__sveltets_2_IsomorphicComponent<FieldTextareaProps, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, "">;
+type Textarea = InstanceType<typeof Textarea>;
+export default Textarea;

package/dist/file-upload/create-file-upload.svelte.js

@@ -1,14 +1,14 @@
-import { createUniqueId } from '../create-unique-id.js';
 import { getEnvironmentContext } from '../environment-provider/context.svelte.js';
 import { getLocaleContext } from '../locale-provider/context.svelte.js';
 import * as fileUpload from '@zag-js/file-upload';
 import { normalizeProps, reflect, useMachine } from '@zag-js/svelte';
+import { uid } from 'uid';
 export function createFileUpload(props) {
     const locale = getLocaleContext();
     const environment = getEnvironmentContext();
     const [state, send] = useMachine(fileUpload.machine({
         ...props,
-        id: props.id ?? createUniqueId(),
+        id: props.id ?? uid(),
         dir: locale?.dir,
         locale: props.locale ?? locale?.locale,
         getRootNode: environment?.getRootNode,

package/dist/file-upload/file-upload.d.ts

@@ -1,4 +1,3 @@
-export { anatomy } from '@zag-js/file-upload';
 export { default as Dropzone } from './dropzone.svelte';
 export { default as HiddenInput } from './hidden-input.svelte';
 export { default as ItemDeleteTrigger } from './item-delete-trigger.svelte';

package/dist/file-upload/file-upload.js

@@ -1,4 +1,3 @@
-export { anatomy } from '@zag-js/file-upload';
 export { default as Dropzone } from './dropzone.svelte';
 export { default as HiddenInput } from './hidden-input.svelte';
 export { default as ItemDeleteTrigger } from './item-delete-trigger.svelte';

package/dist/file-upload/index.d.ts

@@ -11,3 +11,4 @@ export type { FileUploadItemProps } from './item.svelte';
 export type { FileUploadLabelProps } from './label.svelte';
 export type { FileUploadProps } from './root.svelte';
 export type { FileUploadTriggerProps } from './trigger.svelte';
+export { anatomy as fileUploadAnatomy } from '@zag-js/file-upload';

package/dist/file-upload/index.js

@@ -1 +1,2 @@
 export * as FileUpload from './file-upload.js';
+export { anatomy as fileUploadAnatomy } from '@zag-js/file-upload';