ui-ingredients 0.0.16 → 0.0.17

package/dist/toast/close-trigger.svelte

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

package/dist/toast/close-trigger.svelte.d.ts

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

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

@@ -1,8 +1,3 @@
-import * as toast from '@zag-js/toast';
-export interface CreateToastContextProps extends toast.Service {
-}
-export interface CreateToastContextReturn extends ReturnType<typeof createToastContext> {
-}
-export declare function createToastContext(props: CreateToastContextProps): any;
-export declare function setToastContext(value: CreateToastContextReturn): void;
-export declare function useToastContext(): CreateToastContextReturn;
+import { Context } from '../utils.svelte.js';
+import type { CreateToastReturn } from './create-toast.svelte.js';
+export declare const toastContext: Context<CreateToastReturn>;

package/dist/toast/context.svelte.js

@@ -1,14 +1,2 @@
-import { normalizeProps, reflect, useActor } from '@zag-js/svelte';
-import * as toast from '@zag-js/toast';
-import { getContext, setContext } from 'svelte';
-export function createToastContext(props) {
-    const [state, send] = useActor(props);
-    const api = $derived(reflect(() => toast.connect(state, send, normalizeProps)));
-    return api;
-}
-export function setToastContext(value) {
-    setContext('Toast', value);
-}
-export function useToastContext() {
-    return getContext('Toast');
-}
+import { Context } from '../utils.svelte.js';
+export const toastContext = new Context('Toast');

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

@@ -0,0 +1,6 @@
+import * as toast from '@zag-js/toast';
+export interface CreateToastProps extends toast.Service {
+}
+export interface CreateToastReturn extends toast.Api {
+}
+export declare function createToast(props: CreateToastProps): any;

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

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

package/dist/toast/create-toaster.svelte.js

@@ -1,11 +1,11 @@
-import { useEnvironmentContext } from '../environment-provider/index.js';
-import { useLocaleContext } from '../locale-provider/index.js';
+import { getEnvironmentContext } from '../environment-provider/index.js';
+import { getLocaleContext } from '../locale-provider/index.js';
 import { createUniqueId } from '../utils.svelte.js';
 import { normalizeProps, reflect } from '@zag-js/svelte';
 import * as toast from '@zag-js/toast';
 export default function createToaster(props) {
-    const localContext = useLocaleContext();
-    const environmentContext = useEnvironmentContext();
+    const localContext = getLocaleContext();
+    const environmentContext = getEnvironmentContext();
     const id = $derived(props?.id ?? createUniqueId());
     const dir = $derived(props?.dir ?? localContext?.dir);
     const getRootNode = $derived(props?.getRootNode ?? environmentContext?.getRootNode);

package/dist/toast/description.svelte

@@ -1,4 +1,4 @@
-<script lang="ts" context="module">
+<script lang="ts" module>
   import type {HtmlIngredientProps} from '../types.js';
 
   export interface ToastDescriptionProps extends HtmlIngredientProps<'div'> {}
@@ -6,11 +6,11 @@
 
 <script lang="ts">
   import {mergeProps} from '@zag-js/svelte';
-  import {useToastContext} from './context.svelte.js';
+  import {toastContext} from './context.svelte.js';
 
   let {children, ...props}: ToastDescriptionProps = $props();
 
-  let context = useToastContext();
+  let context = toastContext.get();
 
   let attrs = $derived(mergeProps(props, context.getDescriptionProps()));
 </script>

package/dist/toast/description.svelte.d.ts

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

@@ -1,21 +1,20 @@
-<script lang="ts" context="module">
+<script lang="ts" module>
   import type {HtmlIngredientProps} from '../types.js';
   import type {Snippet} from 'svelte';
-  import type {CreateToastContextReturn} from './context.svelte.js';
+  import type {CreateToastReturn} from './create-toast.svelte.js';
 
-  export interface ToastProps
-    extends Omit<HtmlIngredientProps<'div'>, 'children'> {
-    children?: Snippet<[context: CreateToastContextReturn]>;
+  export interface ToastProps extends Omit<HtmlIngredientProps<'div'>, 'children'> {
+    children?: Snippet<[api: CreateToastReturn]>;
   }
 </script>
 
 <script lang="ts">
   import {mergeProps} from '@zag-js/svelte';
-  import {useToastContext} from './context.svelte.js';
+  import {toastContext} from './context.svelte.js';
 
   let {children, ...props}: ToastProps = $props();
 
-  let context = useToastContext();
+  let context = toastContext.get();
 
   let attrs = $derived(mergeProps(props, context.getRootProps()));
 </script>

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

@@ -1,9 +1,3 @@
-import type { HtmlIngredientProps } from '../types.js';
-import type { Snippet } from 'svelte';
-import type { CreateToastContextReturn } from './context.svelte.js';
-export interface ToastProps extends Omit<HtmlIngredientProps<'div'>, 'children'> {
-    children?: Snippet<[context: CreateToastContextReturn]>;
-}
 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/toast/title.svelte

@@ -1,4 +1,4 @@
-<script lang="ts" context="module">
+<script lang="ts" module>
   import type {HtmlIngredientProps} from '../types.js';
 
   export interface ToastTitleProps extends HtmlIngredientProps<'div'> {}
@@ -6,11 +6,11 @@
 
 <script lang="ts">
   import {mergeProps} from '@zag-js/svelte';
-  import {useToastContext} from './context.svelte.js';
+  import {toastContext} from './context.svelte.js';
 
   let {children, ...props}: ToastTitleProps = $props();
 
-  let context = useToastContext();
+  let context = toastContext.get();
 
   let attrs = $derived(mergeProps(props, context.getTitleProps()));
 </script>

package/dist/toast/title.svelte.d.ts

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

@@ -1,5 +1,5 @@
-export { default as ActionTrigger, type ToastActionTriggerProps, } from './action-trigger.svelte';
-export { default as CloseTrigger, type ToastCloseTriggerProps, } from './close-trigger.svelte';
-export { default as Description, type ToastDescriptionProps, } from './description.svelte';
+export { default as ActionTrigger, type ToastActionTriggerProps } from './action-trigger.svelte';
+export { default as CloseTrigger, type ToastCloseTriggerProps } from './close-trigger.svelte';
+export { default as Description, type ToastDescriptionProps } from './description.svelte';
 export { default as Root, type ToastProps } from './root.svelte';
 export { default as Title, type ToastTitleProps } from './title.svelte';

package/dist/toast/toast.js

@@ -1,5 +1,5 @@
-export { default as ActionTrigger, } from './action-trigger.svelte';
-export { default as CloseTrigger, } from './close-trigger.svelte';
-export { default as Description, } from './description.svelte';
+export { default as ActionTrigger } from './action-trigger.svelte';
+export { default as CloseTrigger } from './close-trigger.svelte';
+export { default as Description } from './description.svelte';
 export { default as Root } from './root.svelte';
 export { default as Title } from './title.svelte';

package/dist/toast/toaster.svelte

@@ -1,13 +1,12 @@
-<script lang="ts" context="module">
+<script lang="ts" module>
   import type {HtmlIngredientProps} from '../types.js';
   import type {Snippet} from 'svelte';
-  import type {CreateToastContextReturn} from './context.svelte.js';
+  import type {CreateToastReturn} from './create-toast.svelte.js';
   import type {CreateToasterReturn} from './create-toaster.svelte.js';
 
-  export interface ToasterProps
-    extends Omit<HtmlIngredientProps<'div'>, 'children'> {
+  export interface ToasterProps extends Omit<HtmlIngredientProps<'div'>, 'children'> {
     toaster: CreateToasterReturn;
-    children: Snippet<[CreateToastContextReturn]>;
+    children: Snippet<[api: CreateToastReturn]>;
   }
 </script>
 

package/dist/toast/toaster.svelte.d.ts

@@ -1,11 +1,3 @@
-import type { HtmlIngredientProps } from '../types.js';
-import type { Snippet } from 'svelte';
-import type { CreateToastContextReturn } from './context.svelte.js';
-import type { CreateToasterReturn } from './create-toaster.svelte.js';
-export interface ToasterProps extends Omit<HtmlIngredientProps<'div'>, 'children'> {
-    toaster: CreateToasterReturn;
-    children: Snippet<[CreateToastContextReturn]>;
-}
 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/toggle-group/context.svelte.d.ts

@@ -1,8 +1,3 @@
-import * as toggleGroup from '@zag-js/toggle-group';
-export interface CreateToggleGroupContextProps extends toggleGroup.Context {
-}
-export interface CreateToggleGroupContextReturn extends ReturnType<typeof createToggleGroupContext> {
-}
-export declare function createToggleGroupContext(props: CreateToggleGroupContextProps): any;
-export declare function setToggleGroupContext(value: CreateToggleGroupContextReturn): void;
-export declare function useToggleGroupContext(): CreateToggleGroupContextReturn;
+import { Context } from '../utils.svelte.js';
+import type { CreateToggleGroupReturn } from './create-toggle-group.svelte.js';
+export declare const toggleGroupContext: Context<CreateToggleGroupReturn>;

package/dist/toggle-group/context.svelte.js

@@ -1,14 +1,2 @@
-import { normalizeProps, reflect, useMachine } from '@zag-js/svelte';
-import * as toggleGroup from '@zag-js/toggle-group';
-import { getContext, setContext } from 'svelte';
-export function createToggleGroupContext(props) {
-    const [state, send] = useMachine(toggleGroup.machine(props));
-    const api = $derived(reflect(() => toggleGroup.connect(state, send, normalizeProps)));
-    return api;
-}
-export function setToggleGroupContext(value) {
-    setContext('ToggleGroup', value);
-}
-export function useToggleGroupContext() {
-    return getContext('ToggleGroup');
-}
+import { Context } from '../utils.svelte.js';
+export const toggleGroupContext = new Context('ToggleGroup');

package/dist/toggle-group/create-toggle-group.svelte.d.ts

@@ -0,0 +1,6 @@
+import * as toggleGroup from '@zag-js/toggle-group';
+export interface CreateToggleGroupProps extends toggleGroup.Context {
+}
+export interface CreateToggleGroupReturn extends toggleGroup.Api {
+}
+export declare function createToggleGroup(props: CreateToggleGroupProps): CreateToggleGroupReturn;

package/dist/toggle-group/create-toggle-group.svelte.js

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

package/dist/toggle-group/item.svelte

@@ -1,4 +1,4 @@
-<script lang="ts" context="module">
+<script lang="ts" module>
   import type {Assign, HtmlIngredientProps} from '../types.js';
   import type {ItemProps, ItemState} from '@zag-js/toggle-group';
   import type {Snippet} from 'svelte';
@@ -11,17 +11,19 @@
 
 <script lang="ts">
   import {mergeProps} from '@zag-js/svelte';
-  import {useToggleGroupContext} from './context.svelte.js';
+  import {toggleGroupContext} from './context.svelte.js';
 
   let {value, disabled, children, ...props}: ToggleGroupItemProps = $props();
 
-  let context = useToggleGroupContext();
+  let context = toggleGroupContext.get();
 
-  let state = $derived(context.getItemState({value}));
+  let itemProps = $derived({
+    value,
+    disabled,
+  });
 
-  let attrs = $derived(
-    mergeProps(props, context.getItemProps({value, disabled})),
-  );
+  let state = $derived(context.getItemState(itemProps));
+  let attrs = $derived(mergeProps(props, context.getItemProps(itemProps)));
 </script>
 
 <button type="button" {...attrs}>

package/dist/toggle-group/item.svelte.d.ts

@@ -1,9 +1,3 @@
-import type { Assign, HtmlIngredientProps } from '../types.js';
-import type { ItemProps, ItemState } from '@zag-js/toggle-group';
-import type { Snippet } from 'svelte';
-export interface ToggleGroupItemProps extends Assign<Omit<HtmlIngredientProps<'button'>, 'children'>, ItemProps> {
-    children?: Snippet<[state: ItemState]>;
-}
 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/toggle-group/root.svelte

@@ -1,29 +1,27 @@
-<script lang="ts" context="module">
+<script lang="ts" module>
   import type {Assign, HtmlIngredientProps} from '../types.js';
   import type {Snippet} from 'svelte';
   import type {
-    CreateToggleGroupContextProps,
-    CreateToggleGroupContextReturn,
-  } from './context.svelte.js';
+    CreateToggleGroupProps,
+    CreateToggleGroupReturn,
+  } from './create-toggle-group.svelte.js';
 
   export interface ToggleGroupProps
     extends Assign<
       Omit<HtmlIngredientProps<'div'>, 'children'>,
-      Omit<CreateToggleGroupContextProps, 'id'>
+      Omit<CreateToggleGroupProps, 'id'>
     > {
-    children?: Snippet<[context: CreateToggleGroupContextReturn]>;
+    children?: Snippet<[api: CreateToggleGroupReturn]>;
   }
 </script>
 
 <script lang="ts">
-  import {useEnvironmentContext} from '../environment-provider/index.js';
-  import {useLocaleContext} from '../locale-provider/index.js';
+  import {getEnvironmentContext} from '../environment-provider/index.js';
+  import {getLocaleContext} from '../locale-provider/index.js';
   import {createUniqueId} from '../utils.svelte.js';
   import {mergeProps} from '@zag-js/svelte';
-  import {
-    createToggleGroupContext,
-    setToggleGroupContext,
-  } from './context.svelte.js';
+  import {toggleGroupContext} from './context.svelte.js';
+  import {createToggleGroup} from './create-toggle-group.svelte.js';
 
   let {
     id,
@@ -41,11 +39,13 @@
     ...props
   }: ToggleGroupProps = $props();
 
-  let localeContext = useLocaleContext();
-  let environmentContext = useEnvironmentContext();
+  let localeContext = getLocaleContext();
+  let environmentContext = getEnvironmentContext();
 
-  let context = createToggleGroupContext({
-    id: id ?? createUniqueId(),
+  let uid = createUniqueId();
+
+  let context = createToggleGroup({
+    id: id ?? uid,
     ids,
     dir: dir ?? localeContext?.dir,
     value: $state.snapshot(value),
@@ -60,7 +60,7 @@
 
   let attrs = $derived(mergeProps(props, context.getRootProps()));
 
-  setToggleGroupContext(context);
+  toggleGroupContext.set(context);
 </script>
 
 <div {...attrs}>

package/dist/toggle-group/root.svelte.d.ts

@@ -1,9 +1,3 @@
-import type { Assign, HtmlIngredientProps } from '../types.js';
-import type { Snippet } from 'svelte';
-import type { CreateToggleGroupContextProps, CreateToggleGroupContextReturn } from './context.svelte.js';
-export interface ToggleGroupProps extends Assign<Omit<HtmlIngredientProps<'div'>, 'children'>, Omit<CreateToggleGroupContextProps, 'id'>> {
-    children?: Snippet<[context: CreateToggleGroupContextReturn]>;
-}
 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/tooltip/arrow-tip.svelte

@@ -1,4 +1,4 @@
-<script lang="ts" context="module">
+<script lang="ts" module>
   import type {HtmlIngredientProps} from '../types.js';
 
   export interface TooltipArrowTipProps extends HtmlIngredientProps<'div'> {}
@@ -6,11 +6,11 @@
 
 <script lang="ts">
   import {mergeProps} from '@zag-js/svelte';
-  import {useTooltipContext} from './context.svelte.js';
+  import {tooltipContext} from './context.svelte.js';
 
   let {children, ...props}: TooltipArrowTipProps = $props();
 
-  let context = useTooltipContext();
+  let context = tooltipContext.get();
 
   let attrs = $derived(mergeProps(props, context.getArrowTipProps()));
 </script>

package/dist/tooltip/arrow-tip.svelte.d.ts

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

@@ -1,4 +1,4 @@
-<script lang="ts" context="module">
+<script lang="ts" module>
   import type {HtmlIngredientProps} from '../types.js';
 
   export interface TooltipArrowProps extends HtmlIngredientProps<'div'> {}
@@ -6,11 +6,11 @@
 
 <script lang="ts">
   import {mergeProps} from '@zag-js/svelte';
-  import {useTooltipContext} from './context.svelte.js';
+  import {tooltipContext} from './context.svelte.js';
 
   let {children, ...props}: TooltipArrowProps = $props();
 
-  let context = useTooltipContext();
+  let context = tooltipContext.get();
 
   let attrs = $derived(mergeProps(props, context.getArrowProps()));
 </script>

package/dist/tooltip/arrow.svelte.d.ts

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

@@ -1,4 +1,4 @@
-<script lang="ts" context="module">
+<script lang="ts" module>
   import type {HtmlIngredientProps} from '../types.js';
 
   export interface TooltipContentProps extends HtmlIngredientProps<'div'> {}
@@ -6,11 +6,11 @@
 
 <script lang="ts">
   import {mergeProps} from '@zag-js/svelte';
-  import {useTooltipContext} from './context.svelte.js';
+  import {tooltipContext} from './context.svelte.js';
 
   let {children, ...props}: TooltipContentProps = $props();
 
-  let context = useTooltipContext();
+  let context = tooltipContext.get();
 
   let attrs = $derived(mergeProps(props, context.getContentProps()));
 </script>

package/dist/tooltip/content.svelte.d.ts

@@ -1,6 +1,3 @@
-import type { HtmlIngredientProps } from '../types.js';
-export interface TooltipContentProps 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/tooltip/context.svelte.d.ts

@@ -1,8 +1,3 @@
-import * as tooltip from '@zag-js/tooltip';
-export interface CreateTooltipContextProps extends tooltip.Context {
-}
-export interface CreateTooltipContextReturn extends ReturnType<typeof createTooltipContext> {
-}
-export declare function createTooltipContext(props: CreateTooltipContextProps): any;
-export declare function setTooltipContext(value: CreateTooltipContextReturn): void;
-export declare function useTooltipContext(): CreateTooltipContextReturn;
+import { Context } from '../utils.svelte.js';
+import type { CreateTooltipReturn } from './create-tooltip.svelte.js';
+export declare const tooltipContext: Context<CreateTooltipReturn>;

package/dist/tooltip/context.svelte.js

@@ -1,14 +1,2 @@
-import { normalizeProps, reflect, useMachine } from '@zag-js/svelte';
-import * as tooltip from '@zag-js/tooltip';
-import { getContext, setContext } from 'svelte';
-export function createTooltipContext(props) {
-    const [state, send] = useMachine(tooltip.machine(props));
-    const api = $derived(reflect(() => tooltip.connect(state, send, normalizeProps)));
-    return api;
-}
-export function setTooltipContext(value) {
-    setContext('Tooltip', value);
-}
-export function useTooltipContext() {
-    return getContext('Tooltip');
-}
+import { Context } from '../utils.svelte.js';
+export const tooltipContext = new Context('Tooltip');

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

@@ -0,0 +1,6 @@
+import * as tooltip from '@zag-js/tooltip';
+export interface CreateTooltipProps extends tooltip.Context {
+}
+export interface CreateTooltipReturn extends tooltip.Api {
+}
+export declare function createTooltip(props: CreateTooltipProps): any;

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

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

package/dist/tooltip/positioner.svelte

@@ -1,4 +1,4 @@
-<script lang="ts" context="module">
+<script lang="ts" module>
   import type {HtmlIngredientProps} from '../types.js';
 
   export interface TooltipPositionerProps extends HtmlIngredientProps<'div'> {}
@@ -6,11 +6,11 @@
 
 <script lang="ts">
   import {mergeProps} from '@zag-js/svelte';
-  import {useTooltipContext} from './context.svelte.js';
+  import {tooltipContext} from './context.svelte.js';
 
   let {children, ...props}: TooltipPositionerProps = $props();
 
-  let context = useTooltipContext();
+  let context = tooltipContext.get();
 
   let attrs = $derived(mergeProps(props, context.getPositionerProps()));
 </script>

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

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