ui-ingredients 0.14.0 → 0.15.1

package/dist/field/field-textarea.svelte

@@ -1,51 +1,51 @@
-<script lang="ts" module>
-  import type {HtmlIngredientProps} from '../types.js';
-  import {autoresizeTextarea} from '@zag-js/auto-resize';
-  import type {Action} from 'svelte/action';
-
-  export interface FieldTextareaProps
-    extends HtmlIngredientProps<
-      'textarea',
-      HTMLTextAreaElement,
-      never,
-      Action<HTMLTextAreaElement>
-    > {
-    autoResize?: boolean;
-  }
-
-  function action(node: HTMLTextAreaElement) {
-    const destroy = autoresizeTextarea(node);
-
-    return {
-      destroy,
-    };
-  }
-</script>
-
-<script lang="ts">
-  import {mergeProps} from '../merge-props.js';
-  import {getFieldContext} from './field-context.svelte.js';
-
-  let {
-    ref = $bindable(null),
-    autoResize,
-    asChild,
-    ...props
-  }: FieldTextareaProps = $props();
-
-  let field = getFieldContext();
-
-  let mergedProps = $derived(
-    mergeProps(field?.getTextareaProps() ?? {}, props),
-  );
-
-  function wrappedAction(node: HTMLTextAreaElement) {
-    return autoResize ? action(node) : {};
-  }
-</script>
-
-{#if asChild}
-  {@render asChild(wrappedAction, mergedProps)}
-{:else}
-  <textarea bind:this={ref} use:wrappedAction {...mergedProps}></textarea>
-{/if}
+<script lang="ts" module>
+  import type {HtmlIngredientProps} from '../types.js';
+  import {autoresizeTextarea} from '@zag-js/auto-resize';
+  import type {Action} from 'svelte/action';
+
+  export interface FieldTextareaProps
+    extends HtmlIngredientProps<
+      'textarea',
+      HTMLTextAreaElement,
+      never,
+      Action<HTMLTextAreaElement>
+    > {
+    autoResize?: boolean;
+  }
+
+  function action(node: HTMLTextAreaElement) {
+    const destroy = autoresizeTextarea(node);
+
+    return {
+      destroy,
+    };
+  }
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '../merge-props.js';
+  import {getFieldContext} from './field-context.svelte.js';
+
+  let {
+    ref = $bindable(null),
+    autoResize,
+    asChild,
+    ...props
+  }: FieldTextareaProps = $props();
+
+  let field = getFieldContext();
+
+  let mergedProps = $derived(
+    mergeProps(field?.getTextareaProps() ?? {}, props),
+  );
+
+  function wrappedAction(node: HTMLTextAreaElement) {
+    return autoResize ? action(node) : {};
+  }
+</script>
+
+{#if asChild}
+  {@render asChild(wrappedAction, mergedProps)}
+{:else}
+  <textarea bind:this={ref} use:wrappedAction {...mergedProps}></textarea>
+{/if}

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

@@ -0,0 +1 @@
+export { anatomy } from '@zag-js/file-upload';

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

@@ -0,0 +1 @@
+export { anatomy } from '@zag-js/file-upload';

package/dist/file-upload/file-upload-clear-trigger.svelte

@@ -1,32 +1,32 @@
-<script lang="ts" module>
-  import type {HtmlIngredientProps} from '../types.js';
-
-  export interface FileUploadClearTriggerProps
-    extends HtmlIngredientProps<'button', HTMLButtonElement> {}
-</script>
-
-<script lang="ts">
-  import {mergeProps} from '../merge-props.js';
-  import {getFileUploadContext} from './file-upload-context.svelte.js';
-
-  let {
-    ref = $bindable(null),
-    asChild,
-    children,
-    ...props
-  }: FileUploadClearTriggerProps = $props();
-
-  let fileUpload = getFileUploadContext();
-
-  let mergedProps = $derived(
-    mergeProps(fileUpload.getClearTriggerProps(), props),
-  );
-</script>
-
-{#if asChild}
-  {@render asChild(mergedProps)}
-{:else}
-  <button bind:this={ref} {...mergedProps}>
-    {@render children?.()}
-  </button>
-{/if}
+<script lang="ts" module>
+  import type {HtmlIngredientProps} from '../types.js';
+
+  export interface FileUploadClearTriggerProps
+    extends HtmlIngredientProps<'button', HTMLButtonElement> {}
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '../merge-props.js';
+  import {getFileUploadContext} from './file-upload-context.svelte.js';
+
+  let {
+    ref = $bindable(null),
+    asChild,
+    children,
+    ...props
+  }: FileUploadClearTriggerProps = $props();
+
+  let fileUpload = getFileUploadContext();
+
+  let mergedProps = $derived(
+    mergeProps(fileUpload.getClearTriggerProps(), props),
+  );
+</script>
+
+{#if asChild}
+  {@render asChild(mergedProps)}
+{:else}
+  <button bind:this={ref} {...mergedProps}>
+    {@render children?.()}
+  </button>
+{/if}

package/dist/file-upload/file-upload-dropzone.svelte

@@ -1,30 +1,30 @@
-<script lang="ts" module>
-  import type {HtmlIngredientProps} from '../types.js';
-
-  export interface FileUploadDropzoneProps
-    extends HtmlIngredientProps<'div', HTMLDivElement> {}
-</script>
-
-<script lang="ts">
-  import {mergeProps} from '../merge-props.js';
-  import {getFileUploadContext} from './file-upload-context.svelte.js';
-
-  let {
-    ref = $bindable(null),
-    asChild,
-    children,
-    ...props
-  }: FileUploadDropzoneProps = $props();
-
-  let fileUpload = getFileUploadContext();
-
-  let mergedProps = $derived(mergeProps(fileUpload.getDropzoneProps(), props));
-</script>
-
-{#if asChild}
-  {@render asChild(mergedProps)}
-{:else}
-  <div bind:this={ref} {...mergedProps}>
-    {@render children?.()}
-  </div>
-{/if}
+<script lang="ts" module>
+  import type {HtmlIngredientProps} from '../types.js';
+
+  export interface FileUploadDropzoneProps
+    extends HtmlIngredientProps<'div', HTMLDivElement> {}
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '../merge-props.js';
+  import {getFileUploadContext} from './file-upload-context.svelte.js';
+
+  let {
+    ref = $bindable(null),
+    asChild,
+    children,
+    ...props
+  }: FileUploadDropzoneProps = $props();
+
+  let fileUpload = getFileUploadContext();
+
+  let mergedProps = $derived(mergeProps(fileUpload.getDropzoneProps(), props));
+</script>
+
+{#if asChild}
+  {@render asChild(mergedProps)}
+{:else}
+  <div bind:this={ref} {...mergedProps}>
+    {@render children?.()}
+  </div>
+{/if}

package/dist/file-upload/file-upload-hidden-input.svelte

@@ -1,29 +1,29 @@
-<script lang="ts" module>
-  import type {HtmlIngredientProps} from '../types.js';
-
-  export interface FileUploadHiddenInputProps
-    extends HtmlIngredientProps<'input', HTMLInputElement> {}
-</script>
-
-<script lang="ts">
-  import {mergeProps} from '../merge-props.js';
-  import {getFileUploadContext} from './file-upload-context.svelte.js';
-
-  let {
-    ref = $bindable(null),
-    asChild,
-    ...props
-  }: FileUploadHiddenInputProps = $props();
-
-  let fileUpload = getFileUploadContext();
-
-  let mergedProps = $derived(
-    mergeProps(fileUpload.getHiddenInputProps(), props),
-  );
-</script>
-
-{#if asChild}
-  {@render asChild(mergedProps)}
-{:else}
-  <input bind:this={ref} {...mergedProps} />
-{/if}
+<script lang="ts" module>
+  import type {HtmlIngredientProps} from '../types.js';
+
+  export interface FileUploadHiddenInputProps
+    extends HtmlIngredientProps<'input', HTMLInputElement> {}
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '../merge-props.js';
+  import {getFileUploadContext} from './file-upload-context.svelte.js';
+
+  let {
+    ref = $bindable(null),
+    asChild,
+    ...props
+  }: FileUploadHiddenInputProps = $props();
+
+  let fileUpload = getFileUploadContext();
+
+  let mergedProps = $derived(
+    mergeProps(fileUpload.getHiddenInputProps(), props),
+  );
+</script>
+
+{#if asChild}
+  {@render asChild(mergedProps)}
+{:else}
+  <input bind:this={ref} {...mergedProps} />
+{/if}

package/dist/file-upload/file-upload-item-delete-trigger.svelte

@@ -1,36 +1,36 @@
-<script lang="ts" module>
-  import type {HtmlIngredientProps} from '../types.js';
-
-  export interface FileUploadItemDeleteTriggerProps
-    extends HtmlIngredientProps<'button', HTMLButtonElement> {}
-</script>
-
-<script lang="ts">
-  import {mergeProps} from '../merge-props.js';
-  import {
-    getFileUploadContext,
-    getFileUploadItemPropsContext,
-  } from './file-upload-context.svelte.js';
-
-  let {
-    ref = $bindable(null),
-    asChild,
-    children,
-    ...props
-  }: FileUploadItemDeleteTriggerProps = $props();
-
-  let fileUpload = getFileUploadContext();
-  let itemProps = getFileUploadItemPropsContext();
-
-  let mergedProps = $derived(
-    mergeProps(fileUpload.getItemDeleteTriggerProps(itemProps), props),
-  );
-</script>
-
-{#if asChild}
-  {@render asChild(mergedProps)}
-{:else}
-  <button bind:this={ref} {...mergedProps}>
-    {@render children?.()}
-  </button>
-{/if}
+<script lang="ts" module>
+  import type {HtmlIngredientProps} from '../types.js';
+
+  export interface FileUploadItemDeleteTriggerProps
+    extends HtmlIngredientProps<'button', HTMLButtonElement> {}
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '../merge-props.js';
+  import {
+    getFileUploadContext,
+    getFileUploadItemPropsContext,
+  } from './file-upload-context.svelte.js';
+
+  let {
+    ref = $bindable(null),
+    asChild,
+    children,
+    ...props
+  }: FileUploadItemDeleteTriggerProps = $props();
+
+  let fileUpload = getFileUploadContext();
+  let itemProps = getFileUploadItemPropsContext();
+
+  let mergedProps = $derived(
+    mergeProps(fileUpload.getItemDeleteTriggerProps(itemProps), props),
+  );
+</script>
+
+{#if asChild}
+  {@render asChild(mergedProps)}
+{:else}
+  <button bind:this={ref} {...mergedProps}>
+    {@render children?.()}
+  </button>
+{/if}

package/dist/file-upload/file-upload-item-group.svelte

@@ -1,30 +1,30 @@
-<script lang="ts" module>
-  import type {HtmlIngredientProps} from '../types.js';
-
-  export interface FileUploadItemGroupProps
-    extends HtmlIngredientProps<'div', HTMLDivElement> {}
-</script>
-
-<script lang="ts">
-  import {mergeProps} from '../merge-props.js';
-  import {getFileUploadContext} from './file-upload-context.svelte.js';
-
-  let {
-    ref = $bindable(null),
-    asChild,
-    children,
-    ...props
-  }: FileUploadItemGroupProps = $props();
-
-  let fileUpload = getFileUploadContext();
-
-  let mergedProps = $derived(mergeProps(fileUpload.getItemGroupProps(), props));
-</script>
-
-{#if asChild}
-  {@render asChild(mergedProps)}
-{:else}
-  <div bind:this={ref} {...mergedProps}>
-    {@render children?.()}
-  </div>
-{/if}
+<script lang="ts" module>
+  import type {HtmlIngredientProps} from '../types.js';
+
+  export interface FileUploadItemGroupProps
+    extends HtmlIngredientProps<'div', HTMLDivElement> {}
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '../merge-props.js';
+  import {getFileUploadContext} from './file-upload-context.svelte.js';
+
+  let {
+    ref = $bindable(null),
+    asChild,
+    children,
+    ...props
+  }: FileUploadItemGroupProps = $props();
+
+  let fileUpload = getFileUploadContext();
+
+  let mergedProps = $derived(mergeProps(fileUpload.getItemGroupProps(), props));
+</script>
+
+{#if asChild}
+  {@render asChild(mergedProps)}
+{:else}
+  <div bind:this={ref} {...mergedProps}>
+    {@render children?.()}
+  </div>
+{/if}

package/dist/file-upload/file-upload-item-name.svelte

@@ -1,40 +1,40 @@
-<script lang="ts" module>
-  import type {HtmlIngredientProps} from '../types.js';
-
-  export interface FileUploadItemNameProps
-    extends HtmlIngredientProps<'span', HTMLSpanElement> {}
-</script>
-
-<script lang="ts">
-  import {mergeProps} from '../merge-props.js';
-  import {
-    getFileUploadContext,
-    getFileUploadItemPropsContext,
-  } from './file-upload-context.svelte.js';
-
-  let {
-    ref = $bindable(null),
-    asChild,
-    children,
-    ...props
-  }: FileUploadItemNameProps = $props();
-
-  let fileUpload = getFileUploadContext();
-  let itemProps = getFileUploadItemPropsContext();
-
-  let mergedProps = $derived(
-    mergeProps(fileUpload.getItemNameProps(itemProps), props),
-  );
-</script>
-
-{#if asChild}
-  {@render asChild(mergedProps)}
-{:else}
-  <span bind:this={ref} {...mergedProps}>
-    {#if children}
-      {@render children()}
-    {:else}
-      {itemProps.file.name}
-    {/if}
-  </span>
-{/if}
+<script lang="ts" module>
+  import type {HtmlIngredientProps} from '../types.js';
+
+  export interface FileUploadItemNameProps
+    extends HtmlIngredientProps<'span', HTMLSpanElement> {}
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '../merge-props.js';
+  import {
+    getFileUploadContext,
+    getFileUploadItemPropsContext,
+  } from './file-upload-context.svelte.js';
+
+  let {
+    ref = $bindable(null),
+    asChild,
+    children,
+    ...props
+  }: FileUploadItemNameProps = $props();
+
+  let fileUpload = getFileUploadContext();
+  let itemProps = getFileUploadItemPropsContext();
+
+  let mergedProps = $derived(
+    mergeProps(fileUpload.getItemNameProps(itemProps), props),
+  );
+</script>
+
+{#if asChild}
+  {@render asChild(mergedProps)}
+{:else}
+  <span bind:this={ref} {...mergedProps}>
+    {#if children}
+      {@render children()}
+    {:else}
+      {itemProps.file.name}
+    {/if}
+  </span>
+{/if}

package/dist/file-upload/file-upload-item-preview-image.svelte

@@ -1,41 +1,41 @@
-<script lang="ts" module>
-  import type {HtmlIngredientProps} from '../types.js';
-
-  export interface FileUploadItemPreviewImageProps
-    extends HtmlIngredientProps<'img', HTMLImageElement> {}
-</script>
-
-<script lang="ts">
-  import {mergeProps} from '../merge-props.js';
-  import {
-    getFileUploadContext,
-    getFileUploadItemPropsContext,
-  } from './file-upload-context.svelte.js';
-
-  let {
-    ref = $bindable(null),
-    asChild,
-    ...props
-  }: FileUploadItemPreviewImageProps = $props();
-
-  let url = $state('');
-
-  let fileUpload = getFileUploadContext();
-  let itemProps = getFileUploadItemPropsContext();
-
-  let mergedProps = $derived(
-    mergeProps(fileUpload.getItemPreviewImageProps({url, ...itemProps}), props),
-  );
-
-  $effect(() => {
-    fileUpload.createFileUrl(itemProps.file, (result) => {
-      url = result;
-    });
-  });
-</script>
-
-{#if asChild}
-  {@render asChild(mergedProps)}
-{:else}
-  <img bind:this={ref} {...mergedProps} />
-{/if}
+<script lang="ts" module>
+  import type {HtmlIngredientProps} from '../types.js';
+
+  export interface FileUploadItemPreviewImageProps
+    extends HtmlIngredientProps<'img', HTMLImageElement> {}
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '../merge-props.js';
+  import {
+    getFileUploadContext,
+    getFileUploadItemPropsContext,
+  } from './file-upload-context.svelte.js';
+
+  let {
+    ref = $bindable(null),
+    asChild,
+    ...props
+  }: FileUploadItemPreviewImageProps = $props();
+
+  let url = $state('');
+
+  let fileUpload = getFileUploadContext();
+  let itemProps = getFileUploadItemPropsContext();
+
+  let mergedProps = $derived(
+    mergeProps(fileUpload.getItemPreviewImageProps({url, ...itemProps}), props),
+  );
+
+  $effect(() => {
+    fileUpload.createFileUrl(itemProps.file, (result) => {
+      url = result;
+    });
+  });
+</script>
+
+{#if asChild}
+  {@render asChild(mergedProps)}
+{:else}
+  <img bind:this={ref} {...mergedProps} />
+{/if}

package/dist/file-upload/file-upload-item-preview.svelte

@@ -1,36 +1,36 @@
-<script lang="ts" module>
-  import type {HtmlIngredientProps} from '../types.js';
-
-  export interface FileUploadItemPreviewProps
-    extends HtmlIngredientProps<'div', HTMLDivElement> {}
-</script>
-
-<script lang="ts">
-  import {mergeProps} from '../merge-props.js';
-  import {
-    getFileUploadContext,
-    getFileUploadItemPropsContext,
-  } from './file-upload-context.svelte.js';
-
-  let {
-    ref = $bindable(null),
-    asChild,
-    children,
-    ...props
-  }: FileUploadItemPreviewProps = $props();
-
-  let fileUpload = getFileUploadContext();
-  let itemProps = getFileUploadItemPropsContext();
-
-  let mergedProps = $derived(
-    mergeProps(fileUpload.getItemPreviewProps(itemProps), props),
-  );
-</script>
-
-{#if asChild}
-  {@render asChild(mergedProps)}
-{:else}
-  <div bind:this={ref} {...mergedProps}>
-    {@render children?.()}
-  </div>
-{/if}
+<script lang="ts" module>
+  import type {HtmlIngredientProps} from '../types.js';
+
+  export interface FileUploadItemPreviewProps
+    extends HtmlIngredientProps<'div', HTMLDivElement> {}
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '../merge-props.js';
+  import {
+    getFileUploadContext,
+    getFileUploadItemPropsContext,
+  } from './file-upload-context.svelte.js';
+
+  let {
+    ref = $bindable(null),
+    asChild,
+    children,
+    ...props
+  }: FileUploadItemPreviewProps = $props();
+
+  let fileUpload = getFileUploadContext();
+  let itemProps = getFileUploadItemPropsContext();
+
+  let mergedProps = $derived(
+    mergeProps(fileUpload.getItemPreviewProps(itemProps), props),
+  );
+</script>
+
+{#if asChild}
+  {@render asChild(mergedProps)}
+{:else}
+  <div bind:this={ref} {...mergedProps}>
+    {@render children?.()}
+  </div>
+{/if}