ui-ingredients 0.0.16 → 0.0.17

package/dist/menu/menu.d.ts

@@ -1 +1,16 @@
-export {};
+export { default as ArrowTip } from './arrow-tip.svelte';
+export { default as Arrow } from './arrow.svelte';
+export { default as Content } from './content.svelte';
+export { default as ContextTrigger } from './context-trigger.svelte';
+export { default as Indicator } from './indicator.svelte';
+export { default as ItemGroupLabel } from './item-group-label.svelte';
+export { default as ItemGroup } from './item-group.svelte';
+export { default as Item } from './item.svelte';
+export { default as OptionItemIndicator } from './option-item-indicator.svelte';
+export { default as OptionItemText } from './option-item-text.svelte';
+export { default as OptionItem } from './option-item.svelte';
+export { default as Positioner } from './positioner.svelte';
+export { default as Root } from './root.svelte';
+export { default as Separator } from './separator.svelte';
+export { default as TriggerItem } from './trigger-item.svelte';
+export { default as Trigger } from './trigger.svelte';

package/dist/menu/menu.js

@@ -1 +1,16 @@
-"use strict";
+export { default as ArrowTip } from './arrow-tip.svelte';
+export { default as Arrow } from './arrow.svelte';
+export { default as Content } from './content.svelte';
+export { default as ContextTrigger } from './context-trigger.svelte';
+export { default as Indicator } from './indicator.svelte';
+export { default as ItemGroupLabel } from './item-group-label.svelte';
+export { default as ItemGroup } from './item-group.svelte';
+export { default as Item } from './item.svelte';
+export { default as OptionItemIndicator } from './option-item-indicator.svelte';
+export { default as OptionItemText } from './option-item-text.svelte';
+export { default as OptionItem } from './option-item.svelte';
+export { default as Positioner } from './positioner.svelte';
+export { default as Root } from './root.svelte';
+export { default as Separator } from './separator.svelte';
+export { default as TriggerItem } from './trigger-item.svelte';
+export { default as Trigger } from './trigger.svelte';

package/dist/menu/option-item-indicator.svelte

@@ -0,0 +1,22 @@
+<script lang="ts" module>
+  import type {HtmlIngredientProps} from '../types.js';
+
+  export interface MenuOptionItemIndicatorProps extends HtmlIngredientProps<'span'> {}
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '@zag-js/svelte';
+  import {menuContext, menuOptionItemPropsContext} from './context.svelte.js';
+
+  let {children, ...props}: MenuOptionItemIndicatorProps = $props();
+
+  let context = menuContext.get();
+
+  let optionItemProps = menuOptionItemPropsContext.get();
+
+  let attrs = $derived(mergeProps(props, context.getItemIndicatorProps(optionItemProps)));
+</script>
+
+<span {...attrs}>
+  {@render children?.()}
+</span>

package/dist/menu/option-item-indicator.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 OptionItemIndicator: $$__sveltets_2_IsomorphicComponent<MenuOptionItemIndicatorProps, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, "">;
+type OptionItemIndicator = InstanceType<typeof OptionItemIndicator>;
+export default OptionItemIndicator;

package/dist/menu/option-item-text.svelte

@@ -0,0 +1,26 @@
+<script lang="ts" module>
+  import type {HtmlIngredientProps} from '../types.js';
+
+  export interface MenuOptionItemTextProps extends HtmlIngredientProps<'span'> {}
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '@zag-js/svelte';
+  import {menuContext, menuOptionItemPropsContext} from './context.svelte.js';
+
+  let {children, ...props}: MenuOptionItemTextProps = $props();
+
+  let context = menuContext.get();
+
+  let optionItemProps = menuOptionItemPropsContext.get();
+
+  let attrs = $derived(mergeProps(props, context.getItemTextProps(optionItemProps)));
+</script>
+
+<span {...attrs}>
+  {#if children}
+    {@render children()}
+  {:else}
+    {optionItemProps.valueText}
+  {/if}
+</span>

package/dist/menu/option-item-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 OptionItemText: $$__sveltets_2_IsomorphicComponent<MenuOptionItemTextProps, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, "">;
+type OptionItemText = InstanceType<typeof OptionItemText>;
+export default OptionItemText;

package/dist/menu/option-item.svelte

@@ -0,0 +1,51 @@
+<script lang="ts" module>
+  import type {Assign, HtmlIngredientProps, PickPartial} from '../types.js';
+  import type {OptionItemProps, OptionItemState} from '@zag-js/menu';
+  import type {Snippet} from 'svelte';
+
+  export interface MenuOptionItemProps
+    extends Assign<
+      Omit<HtmlIngredientProps<'div'>, 'children'>,
+      PickPartial<OptionItemProps, 'type' | 'checked'>
+    > {
+    children?: Snippet<[state: OptionItemState]>;
+  }
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '@zag-js/svelte';
+  import {menuContext, menuOptionItemPropsContext} from './context.svelte.js';
+
+  let {
+    type = 'checkbox',
+    value,
+    checked = false,
+    disabled,
+    valueText,
+    closeOnSelect,
+    onCheckedChange,
+    children,
+    ...props
+  }: MenuOptionItemProps = $props();
+
+  let context = menuContext.get();
+
+  let itemProps = $derived({
+    type,
+    value,
+    checked,
+    disabled,
+    valueText,
+    closeOnSelect,
+    onCheckedChange,
+  });
+
+  let state = $derived(context.getOptionItemState(itemProps));
+  let attrs = $derived(mergeProps(props, context.getOptionItemProps(itemProps)));
+
+  menuOptionItemPropsContext.set(() => itemProps);
+</script>
+
+<div {...attrs}>
+  {@render children?.(state)}
+</div>

package/dist/menu/option-item.svelte.d.ts

@@ -1,21 +1,8 @@
-export default OptionItem;
-type OptionItem = SvelteComponent<{
-    [x: string]: never;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}> & {
-    $$bindings?: string | undefined;
-};
-declare const OptionItem: $$__sveltets_2_IsomorphicComponent<{
-    [x: string]: never;
-}, {
-    [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> & {
+    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
         $$bindings?: Bindings;
     } & Exports;
-    (internal: unknown, props: {
+    (internal: unknown, props: Props & {
         $$events?: Events;
         $$slots?: Slots;
     }): Exports & {
@@ -24,3 +11,8 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     };
     z_$$bindings?: Bindings;
 }
+declare const OptionItem: $$__sveltets_2_IsomorphicComponent<MenuOptionItemProps, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, "">;
+type OptionItem = InstanceType<typeof OptionItem>;
+export default OptionItem;

package/dist/menu/positioner.svelte

@@ -0,0 +1,20 @@
+<script lang="ts" module>
+  import type {HtmlIngredientProps} from '../types.js';
+
+  export interface MenuPositionerProps extends HtmlIngredientProps<'div'> {}
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '@zag-js/svelte';
+  import {menuContext} from './context.svelte.js';
+
+  let {children, ...props}: MenuPositionerProps = $props();
+
+  let context = menuContext.get();
+
+  let attrs = $derived(mergeProps(props, context.getPositionerProps()));
+</script>
+
+<div {...attrs}>
+  {@render children?.()}
+</div>

package/dist/menu/positioner.svelte.d.ts

@@ -1,21 +1,8 @@
-export default Positioner;
-type Positioner = SvelteComponent<{
-    [x: string]: never;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}> & {
-    $$bindings?: string | undefined;
-};
-declare const Positioner: $$__sveltets_2_IsomorphicComponent<{
-    [x: string]: never;
-}, {
-    [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> & {
+    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
         $$bindings?: Bindings;
     } & Exports;
-    (internal: unknown, props: {
+    (internal: unknown, props: Props & {
         $$events?: Events;
         $$slots?: Slots;
     }): Exports & {
@@ -24,3 +11,8 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     };
     z_$$bindings?: Bindings;
 }
+declare const Positioner: $$__sveltets_2_IsomorphicComponent<MenuPositionerProps, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, "">;
+type Positioner = InstanceType<typeof Positioner>;
+export default Positioner;

package/dist/menu/root.svelte

@@ -0,0 +1,75 @@
+<script lang="ts" module>
+  import type {Snippet} from 'svelte';
+  import {type CreateMenuProps, type CreateMenuReturn} from './create-menu.svelte.js';
+
+  export interface MenuRootProps extends Omit<CreateMenuProps, 'id'> {
+    id?: string | null;
+    children?: Snippet<[api: CreateMenuReturn]>;
+  }
+</script>
+
+<script lang="ts">
+  import {getEnvironmentContext} from '../environment-provider/index.js';
+  import {getLocaleContext} from '../locale-provider/index.js';
+  import {createUniqueId} from '../utils.svelte.js';
+  import {menuContext} from './context.svelte.js';
+  import {createMenu} from './create-menu.svelte.js';
+
+  let {
+    id,
+    ids,
+    dir,
+    open,
+    'open.controlled': openControlled,
+    loopFocus,
+    typeahead,
+    composite,
+    positioning,
+    anchorPoint,
+    closeOnSelect,
+    'aria-label': ariaLabel,
+    highlightedValue,
+    onSelect,
+    onOpenChange,
+    onFocusOutside,
+    onEscapeKeyDown,
+    onHighlightChange,
+    onInteractOutside,
+    onPointerDownOutside,
+    getRootNode,
+    children,
+  }: MenuRootProps = $props();
+
+  let localeContext = getLocaleContext();
+  let environmnetContext = getEnvironmentContext();
+
+  let uid = createUniqueId();
+
+  let context = createMenu({
+    id: id ?? uid,
+    ids,
+    dir: dir ?? localeContext?.dir,
+    open,
+    'open.controlled': openControlled,
+    loopFocus,
+    typeahead,
+    composite,
+    positioning,
+    anchorPoint,
+    closeOnSelect,
+    'aria-label': ariaLabel,
+    highlightedValue,
+    onSelect,
+    onOpenChange,
+    onFocusOutside,
+    onEscapeKeyDown,
+    onHighlightChange,
+    onInteractOutside,
+    onPointerDownOutside,
+    getRootNode: getRootNode ?? environmnetContext?.getRootNode,
+  });
+
+  menuContext.set(context);
+</script>
+
+{@render children?.(context)}

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

@@ -1,21 +1,8 @@
-export default Root;
-type Root = SvelteComponent<{
-    [x: string]: never;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}> & {
-    $$bindings?: string | undefined;
-};
-declare const Root: $$__sveltets_2_IsomorphicComponent<{
-    [x: string]: never;
-}, {
-    [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> & {
+    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
         $$bindings?: Bindings;
     } & Exports;
-    (internal: unknown, props: {
+    (internal: unknown, props: Props & {
         $$events?: Events;
         $$slots?: Slots;
     }): Exports & {
@@ -24,3 +11,8 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     };
     z_$$bindings?: Bindings;
 }
+declare const Root: $$__sveltets_2_IsomorphicComponent<MenuRootProps, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, "">;
+type Root = InstanceType<typeof Root>;
+export default Root;

package/dist/menu/separator.svelte

@@ -0,0 +1,20 @@
+<script lang="ts" module>
+  import type {HtmlIngredientProps} from '../types.js';
+
+  export interface MenuSeparatorProps extends HtmlIngredientProps<'div'> {}
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '@zag-js/svelte';
+  import {menuContext} from './context.svelte.js';
+
+  let {children, ...props}: MenuSeparatorProps = $props();
+
+  let context = menuContext.get();
+
+  let attrs = $derived(mergeProps(props, context.getSeparatorProps()));
+</script>
+
+<div {...attrs}>
+  {@render children?.()}
+</div>

package/dist/menu/separator.svelte.d.ts

@@ -1,21 +1,8 @@
-export default Separator;
-type Separator = SvelteComponent<{
-    [x: string]: never;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}> & {
-    $$bindings?: string | undefined;
-};
-declare const Separator: $$__sveltets_2_IsomorphicComponent<{
-    [x: string]: never;
-}, {
-    [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> & {
+    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
         $$bindings?: Bindings;
     } & Exports;
-    (internal: unknown, props: {
+    (internal: unknown, props: Props & {
         $$events?: Events;
         $$slots?: Slots;
     }): Exports & {
@@ -24,3 +11,8 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     };
     z_$$bindings?: Bindings;
 }
+declare const Separator: $$__sveltets_2_IsomorphicComponent<MenuSeparatorProps, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, "">;
+type Separator = InstanceType<typeof Separator>;
+export default Separator;

package/dist/menu/trigger-item.svelte

@@ -0,0 +1,20 @@
+<script lang="ts" module>
+  import type {HtmlIngredientProps} from '../types.js';
+
+  export interface MenuTriggerItemIndicatorProps extends HtmlIngredientProps<'button'> {}
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '@zag-js/svelte';
+  import {menuContext} from './context.svelte.js';
+
+  let {children, ...props}: MenuTriggerItemIndicatorProps = $props();
+
+  let context = menuContext.get();
+
+  let attrs = $derived(mergeProps(props, context.getTriggerItemProps(context)));
+</script>
+
+<button type="button" {...attrs}>
+  {@render children?.()}
+</button>

package/dist/menu/trigger-item.svelte.d.ts

@@ -1,21 +1,8 @@
-export default TriggerItem;
-type TriggerItem = SvelteComponent<{
-    [x: string]: never;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}> & {
-    $$bindings?: string | undefined;
-};
-declare const TriggerItem: $$__sveltets_2_IsomorphicComponent<{
-    [x: string]: never;
-}, {
-    [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> & {
+    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
         $$bindings?: Bindings;
     } & Exports;
-    (internal: unknown, props: {
+    (internal: unknown, props: Props & {
         $$events?: Events;
         $$slots?: Slots;
     }): Exports & {
@@ -24,3 +11,8 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     };
     z_$$bindings?: Bindings;
 }
+declare const TriggerItem: $$__sveltets_2_IsomorphicComponent<MenuTriggerItemIndicatorProps, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, "">;
+type TriggerItem = InstanceType<typeof TriggerItem>;
+export default TriggerItem;

package/dist/menu/trigger.svelte

@@ -0,0 +1,20 @@
+<script lang="ts" module>
+  import type {HtmlIngredientProps} from '../types.js';
+
+  export interface MenuTriggerProps extends HtmlIngredientProps<'button'> {}
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '@zag-js/svelte';
+  import {menuContext} from './context.svelte.js';
+
+  let {children, ...props}: MenuTriggerProps = $props();
+
+  let context = menuContext.get();
+
+  let attrs = $derived(mergeProps(props, context.getTriggerProps()));
+</script>
+
+<button type="button" {...attrs}>
+  {@render children?.()}
+</button>

package/dist/menu/trigger.svelte.d.ts

@@ -1,21 +1,8 @@
-export default Trigger;
-type Trigger = SvelteComponent<{
-    [x: string]: never;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}> & {
-    $$bindings?: string | undefined;
-};
-declare const Trigger: $$__sveltets_2_IsomorphicComponent<{
-    [x: string]: never;
-}, {
-    [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> & {
+    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
         $$bindings?: Bindings;
     } & Exports;
-    (internal: unknown, props: {
+    (internal: unknown, props: Props & {
         $$events?: Events;
         $$slots?: Slots;
     }): Exports & {
@@ -24,3 +11,8 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     };
     z_$$bindings?: Bindings;
 }
+declare const Trigger: $$__sveltets_2_IsomorphicComponent<MenuTriggerProps, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, "">;
+type Trigger = InstanceType<typeof Trigger>;
+export default Trigger;

package/dist/number-input/context.svelte.d.ts

@@ -1,8 +1,3 @@
-import * as numberInput from '@zag-js/number-input';
-export interface CreateNumberInputContextProps extends numberInput.Context {
-}
-export interface CreateNumberInputContextReturn extends ReturnType<typeof createNumberInputContext> {
-}
-export declare function createNumberInputContext(props: CreateNumberInputContextProps): any;
-export declare function setNumberInputContext(value: CreateNumberInputContextReturn): void;
-export declare function useNumberInputContext(): CreateNumberInputContextReturn;
+import { Context } from '../utils.svelte.js';
+import type { CreateNumberInputReturn } from './create-number-input.svelte.js';
+export declare const numberInputContext: Context<CreateNumberInputReturn>;

package/dist/number-input/context.svelte.js

@@ -1,14 +1,2 @@
-import * as numberInput from '@zag-js/number-input';
-import { normalizeProps, reflect, useMachine } from '@zag-js/svelte';
-import { getContext, setContext } from 'svelte';
-export function createNumberInputContext(props) {
-    const [state, send] = useMachine(numberInput.machine(props));
-    const api = $derived(reflect(() => numberInput.connect(state, send, normalizeProps)));
-    return api;
-}
-export function setNumberInputContext(value) {
-    setContext('NumberInput', value);
-}
-export function useNumberInputContext() {
-    return getContext('NumberInput');
-}
+import { Context } from '../utils.svelte.js';
+export const numberInputContext = new Context('NumberInput');

package/dist/number-input/control.svelte

@@ -1,17 +1,16 @@
-<script lang="ts" context="module">
+<script lang="ts" module>
   import type {HtmlIngredientProps} from '../types.js';
 
-  export interface NumberInputControlTriggerProps
-    extends HtmlIngredientProps<'div'> {}
+  export interface NumberInputControlTriggerProps extends HtmlIngredientProps<'div'> {}
 </script>
 
 <script lang="ts">
   import {mergeProps} from '@zag-js/svelte';
-  import {useNumberInputContext} from './context.svelte.js';
+  import {numberInputContext} from './context.svelte.js';
 
   let {children, ...props}: NumberInputControlTriggerProps = $props();
 
-  let context = useNumberInputContext();
+  let context = numberInputContext.get();
 
   let attrs = $derived(mergeProps(props, context.getControlProps()));
 </script>

package/dist/number-input/control.svelte.d.ts

@@ -1,6 +1,3 @@
-import type { HtmlIngredientProps } from '../types.js';
-export interface NumberInputControlTriggerProps extends HtmlIngredientProps<'div'> {
-}
 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;

package/dist/number-input/create-number-input.svelte.d.ts

@@ -0,0 +1,6 @@
+import * as numberInput from '@zag-js/number-input';
+export interface CreateNumberInputProps extends numberInput.Context {
+}
+export interface CreateNumberInputReturn extends numberInput.Api {
+}
+export declare function createNumberInput(props: CreateNumberInputProps): CreateNumberInputReturn;

package/dist/number-input/create-number-input.svelte.js

@@ -0,0 +1,7 @@
+import * as numberInput from '@zag-js/number-input';
+import { normalizeProps, reflect, useMachine } from '@zag-js/svelte';
+export function createNumberInput(props) {
+    const [state, send] = useMachine(numberInput.machine(props));
+    const api = $derived(reflect(() => numberInput.connect(state, send, normalizeProps)));
+    return api;
+}

package/dist/number-input/decrement-trigger.svelte

@@ -1,17 +1,16 @@
-<script lang="ts" context="module">
+<script lang="ts" module>
   import type {HtmlIngredientProps} from '../types.js';
 
-  export interface NumberInputDecrementTriggerProps
-    extends HtmlIngredientProps<'button'> {}
+  export interface NumberInputDecrementTriggerProps extends HtmlIngredientProps<'button'> {}
 </script>
 
 <script lang="ts">
   import {mergeProps} from '@zag-js/svelte';
-  import {useNumberInputContext} from './context.svelte.js';
+  import {numberInputContext} from './context.svelte.js';
 
   let {children, ...props}: NumberInputDecrementTriggerProps = $props();
 
-  let context = useNumberInputContext();
+  let context = numberInputContext.get();
 
   let attrs = $derived(mergeProps(props, context.getDecrementTriggerProps()));
 </script>

package/dist/number-input/decrement-trigger.svelte.d.ts

@@ -1,6 +1,3 @@
-import type { HtmlIngredientProps } from '../types.js';
-export interface NumberInputDecrementTriggerProps extends HtmlIngredientProps<'button'> {
-}
 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;