ui-ingredients 0.0.27 → 0.0.29

package/dist/carousel/viewport.svelte

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

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

@@ -1,3 +1,3 @@
-import { Context } from '../utils.svelte.js';
+import { Context } from '../context.svelte.js';
 import type { CreateCheckboxReturn } from './create-checkbox.svelte.js';
 export declare const checkboxContext: Context<CreateCheckboxReturn>;

package/dist/checkbox/context.svelte.js

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

package/dist/checkbox/control.svelte

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

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

@@ -1,6 +1,6 @@
+import { createUniqueId } from '../create-unique-id.js';
 import { getEnvironmentContext } from '../environment-provider/context.svelte.js';
 import { getLocaleContext } from '../locale-provider/context.svelte.js';
-import { createUniqueId } from '../utils.svelte.js';
 import * as checkbox from '@zag-js/checkbox';
 import { normalizeProps, reflect, useMachine } from '@zag-js/svelte';
 export function createCheckbox(props) {

package/dist/checkbox/hidden-input.svelte

@@ -1,18 +1,18 @@
-<script lang="ts" module>
-  import type {HtmlProps} from '../types.js';
-
-  export interface CheckboxHiddenInputProps extends HtmlProps<'input'> {}
-</script>
-
-<script lang="ts">
-  import {mergeProps} from '../utils.svelte.js';
-  import {checkboxContext} from './context.svelte.js';
-
-  let {...props}: CheckboxHiddenInputProps = $props();
-
-  let checkbox = checkboxContext.get();
-
-  let attrs = $derived(mergeProps(props, checkbox.getHiddenInputProps()));
-</script>
-
-<input {...attrs} />
+<script lang="ts" module>
+  import type {HTMLProps} from '../types.js';
+
+  export interface CheckboxHiddenInputProps extends HTMLProps<'input'> {}
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '../merge-props.js';
+  import {checkboxContext} from './context.svelte.js';
+
+  let {...props}: CheckboxHiddenInputProps = $props();
+
+  let checkbox = checkboxContext.get();
+
+  let mergedProps = $derived(mergeProps(props, checkbox.getHiddenInputProps()));
+</script>
+
+<input {...mergedProps} />

package/dist/checkbox/indicator.svelte

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

package/dist/checkbox/label.svelte

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

package/dist/checkbox/root.svelte

@@ -1,60 +1,53 @@
-<script lang="ts" module>
-  import type {AsChild, Assign, HtmlProps} from '../types.js';
-  import type {Snippet} from 'svelte';
-  import type {CreateCheckboxProps, CreateCheckboxReturn} from './create-checkbox.svelte.js';
-
-  export interface CheckboxProps
-    extends Assign<Omit<HtmlProps<'label'>, 'children'>, CreateCheckboxProps> {
-    asChild?: AsChild<HtmlProps<'label'>, CreateCheckboxReturn>;
-    children?: Snippet<[checkbox: CreateCheckboxReturn]>;
-  }
-</script>
-
-<script lang="ts">
-  import {mergeProps} from '../utils.svelte.js';
-  import {checkboxContext} from './context.svelte.js';
-  import {createCheckbox} from './create-checkbox.svelte.js';
-
-  let {
-    id,
-    ids,
-    form,
-    name,
-    value,
-    checked,
-    invalid,
-    disabled,
-    readOnly,
-    required,
-    onCheckedChange,
-    asChild,
-    children,
-    ...props
-  }: CheckboxProps = $props();
-
-  let checkbox = createCheckbox({
-    id,
-    ids,
-    form,
-    name,
-    value: $state.snapshot(value),
-    checked,
-    invalid,
-    disabled,
-    readOnly,
-    required,
-    onCheckedChange,
-  });
-
-  let attrs = $derived(mergeProps(props, checkbox.getRootProps()));
-
-  checkboxContext.set(checkbox);
-</script>
-
-{#if asChild}
-  {@render asChild(attrs, checkbox)}
-{:else}
-  <label {...attrs}>
-    {@render children?.(checkbox)}
-  </label>
-{/if}
+<script lang="ts" module>
+  import type {AsChild, Assign, HTMLProps} from '../types.js';
+  import type {Snippet} from 'svelte';
+  import type {
+    CreateCheckboxProps,
+    CreateCheckboxReturn,
+  } from './create-checkbox.svelte.js';
+
+  export interface CheckboxProps
+    extends Assign<Omit<HTMLProps<'label'>, 'children'>, CreateCheckboxProps> {
+    asChild?: AsChild<CreateCheckboxReturn>;
+    children?: Snippet<[CreateCheckboxReturn]>;
+  }
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '../merge-props.js';
+  import {createSplitProps} from '@zag-js/utils';
+  import {checkboxContext} from './context.svelte.js';
+  import {createCheckbox} from './create-checkbox.svelte.js';
+
+  let {asChild, children, ...props}: CheckboxProps = $props();
+
+  let [checkboxProps, otherProps] = $derived(
+    createSplitProps<CreateCheckboxProps>([
+      'id',
+      'ids',
+      'form',
+      'name',
+      'value',
+      'checked',
+      'invalid',
+      'disabled',
+      'readOnly',
+      'required',
+      'onCheckedChange',
+    ])(props),
+  );
+
+  let checkbox = createCheckbox(checkboxProps);
+
+  let mergedProps = $derived(mergeProps(otherProps, checkbox.getRootProps()));
+
+  checkboxContext.set(checkbox);
+</script>
+
+{#if asChild}
+  {@render asChild(mergedProps, checkbox)}
+{:else}
+  <label {...mergedProps}>
+    {@render children?.(checkbox)}
+  </label>
+{/if}

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

@@ -1,3 +1,3 @@
-import { Context } from '../utils.svelte.js';
+import { Context } from '../context.svelte.js';
 import type { CreateClipboardReturn } from './create-clipboard.svelte.js';
 export declare const clipboardContext: Context<CreateClipboardReturn>;

package/dist/clipboard/context.svelte.js

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

package/dist/clipboard/control.svelte

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

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

@@ -1,5 +1,5 @@
+import { createUniqueId } from '../create-unique-id.js';
 import { getEnvironmentContext } from '../environment-provider/context.svelte.js';
-import { createUniqueId } from '../utils.svelte.js';
 import * as clipboard from '@zag-js/clipboard';
 import { normalizeProps, reflect, useMachine } from '@zag-js/svelte';
 export function createClipboard(props) {

package/dist/clipboard/indicator.svelte

@@ -1,28 +1,35 @@
-<script lang="ts" module>
-  import type {AsChild, Assign, HtmlProps} from '../types.js';
-  import type {IndicatorProps} from '@zag-js/clipboard';
-
-  export interface ClipboardIndicatorProps
-    extends Assign<HtmlProps<'span'>, Partial<IndicatorProps>> {
-    asChild?: AsChild;
-  }
-</script>
-
-<script lang="ts">
-  import {mergeProps} from '../utils.svelte.js';
-  import {clipboardContext} from './context.svelte.js';
-
-  let {copied = false, asChild, children, ...props}: ClipboardIndicatorProps = $props();
-
-  let clipboard = clipboardContext.get();
-
-  let attrs = $derived(mergeProps(props, clipboard.getIndicatorProps({copied})));
-</script>
-
-{#if asChild}
-  {@render asChild(attrs)}
-{:else}
-  <span {...attrs}>
-    {@render children?.()}
-  </span>
-{/if}
+<script lang="ts" module>
+  import type {AsChild, Assign, HTMLProps} from '../types.js';
+  import type {IndicatorProps} from '@zag-js/clipboard';
+
+  export interface ClipboardIndicatorProps
+    extends Assign<HTMLProps<'span'>, Partial<IndicatorProps>> {
+    asChild?: AsChild;
+  }
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '../merge-props.js';
+  import {clipboardContext} from './context.svelte.js';
+
+  let {
+    copied = false,
+    asChild,
+    children,
+    ...props
+  }: ClipboardIndicatorProps = $props();
+
+  let clipboard = clipboardContext.get();
+
+  let mergedProps = $derived(
+    mergeProps(props, clipboard.getIndicatorProps({copied})),
+  );
+</script>
+
+{#if asChild}
+  {@render asChild(mergedProps)}
+{:else}
+  <span {...mergedProps}>
+    {@render children?.()}
+  </span>
+{/if}

package/dist/clipboard/input.svelte

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

package/dist/clipboard/label.svelte

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