ui-ingredients 0.0.42 → 0.0.44

package/dist/toast/toaster.svelte

@@ -1,39 +1,39 @@
-<script lang="ts" module>
-  import type {HtmlIngredientProps} from '../types.js';
-  import type {CreateToastReturn} from './create-toast.svelte.js';
-  import type {CreateToasterReturn} from './create-toaster.svelte.js';
-
-  export interface ToasterProps
-    extends HtmlIngredientProps<'div', CreateToastReturn> {
-    toaster: CreateToasterReturn;
-  }
-</script>
-
-<script lang="ts">
-  import {mergeProps} from '../merge-props.js';
-  import {Portal} from '../portal/index.js';
-  import {normalizeProps, useMachine} from '@zag-js/svelte';
-  import * as toast from '@zag-js/toast';
-  import ToastActor from './actor.svelte';
-
-  let {toaster, children, ...props}: ToasterProps = $props();
-
-  let [snapshot, send] = useMachine(toaster.machine);
-
-  let placement = $derived(snapshot.context.placement);
-  let api = $derived(toast.group.connect(snapshot, send, normalizeProps));
-  let toasts = $derived(api.getToastsByPlacement(placement));
-  let mergedProps = $derived(mergeProps(props, api.getGroupProps({placement})));
-</script>
-
-<Portal>
-  <div {...mergedProps}>
-    {#each toasts as toast (toast.id)}
-      <ToastActor actor={toast}>
-        {#snippet children$(ctx)}
-          {@render children?.(ctx)}
-        {/snippet}
-      </ToastActor>
-    {/each}
-  </div>
-</Portal>
+<script lang="ts" module>
+  import type {HtmlIngredientProps} from '../types.js';
+  import type {CreateToastReturn} from './create-toast.svelte.js';
+  import type {CreateToasterReturn} from './create-toaster.svelte.js';
+
+  export interface ToasterProps
+    extends HtmlIngredientProps<'div', CreateToastReturn> {
+    toaster: CreateToasterReturn;
+  }
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '../merge-props.js';
+  import {Portal} from '../portal/index.js';
+  import {normalizeProps, useMachine} from '@zag-js/svelte';
+  import * as toast from '@zag-js/toast';
+  import ToastActor from './actor.svelte';
+
+  let {toaster, children, ...props}: ToasterProps = $props();
+
+  let [snapshot, send] = useMachine(toaster.machine);
+
+  let placement = $derived(snapshot.context.placement);
+  let api = $derived(toast.group.connect(snapshot, send, normalizeProps));
+  let toasts = $derived(api.getToastsByPlacement(placement));
+  let mergedProps = $derived(mergeProps(props, api.getGroupProps({placement})));
+</script>
+
+<Portal>
+  <div {...mergedProps}>
+    {#each toasts as toast (toast.id)}
+      <ToastActor actor={toast}>
+        {#snippet children$(ctx)}
+          {@render children?.(ctx)}
+        {/snippet}
+      </ToastActor>
+    {/each}
+  </div>
+</Portal>

package/dist/tour/arrow-tip.svelte

@@ -0,0 +1,24 @@
+<script lang="ts" module>
+  import type {HtmlIngredientProps} from '../types.js';
+
+  export interface TourArrowTipProps extends HtmlIngredientProps<'span'> {}
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '../merge-props.js';
+  import {getTourContext} from './context.svelte.js';
+
+  let {asChild, children, ...props}: TourArrowTipProps = $props();
+
+  let tour = getTourContext();
+
+  let mergedProps = $derived(mergeProps(props, tour.getArrowTipProps()));
+</script>
+
+{#if asChild}
+  {@render asChild(mergedProps)}
+{:else}
+  <span {...mergedProps}>
+    {@render children?.()}
+  </span>
+{/if}

package/dist/tour/arrow-tip.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 ArrowTip: $$__sveltets_2_IsomorphicComponent<TourArrowTipProps, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, "">;
+type ArrowTip = InstanceType<typeof ArrowTip>;
+export default ArrowTip;

package/dist/tour/arrow.svelte

@@ -0,0 +1,24 @@
+<script lang="ts" module>
+  import type {HtmlIngredientProps} from '../types.js';
+
+  export interface TourArrowProps extends HtmlIngredientProps<'span'> {}
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '../merge-props.js';
+  import {getTourContext} from './context.svelte.js';
+
+  let {asChild, children, ...props}: TourArrowProps = $props();
+
+  let tour = getTourContext();
+
+  let mergedProps = $derived(mergeProps(props, tour.getArrowProps()));
+</script>
+
+{#if asChild}
+  {@render asChild(mergedProps)}
+{:else}
+  <span {...mergedProps}>
+    {@render children?.()}
+  </span>
+{/if}

package/dist/tour/arrow.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 Arrow: $$__sveltets_2_IsomorphicComponent<TourArrowProps, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, "">;
+type Arrow = InstanceType<typeof Arrow>;
+export default Arrow;

package/dist/tour/close-trigger.svelte

@@ -0,0 +1,25 @@
+<script lang="ts" module>
+  import type {HtmlIngredientProps} from '../types.js';
+
+  export interface TourCloseTriggerProps
+    extends HtmlIngredientProps<'button'> {}
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '../merge-props.js';
+  import {getTourContext} from './context.svelte.js';
+
+  let {asChild, children, ...props}: TourCloseTriggerProps = $props();
+
+  let tour = getTourContext();
+
+  let mergedProps = $derived(mergeProps(props, tour.getCloseTriggerProps()));
+</script>
+
+{#if asChild}
+  {@render asChild(mergedProps)}
+{:else}
+  <button type="button" {...mergedProps}>
+    {@render children?.()}
+  </button>
+{/if}

package/dist/tour/close-trigger.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 CloseTrigger: $$__sveltets_2_IsomorphicComponent<TourCloseTriggerProps, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, "">;
+type CloseTrigger = InstanceType<typeof CloseTrigger>;
+export default CloseTrigger;

package/dist/tour/content.svelte

@@ -0,0 +1,30 @@
+<script lang="ts" module>
+  import type {HtmlIngredientProps} from '../types.js';
+
+  export interface TourContentProps extends HtmlIngredientProps<'div'> {}
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '../merge-props.js';
+  import {getPresenceContext} from '../presence/context.svelte.js';
+  import {getTourContext} from './context.svelte.js';
+
+  let {asChild, children, ...props}: TourContentProps = $props();
+
+  let tour = getTourContext();
+  let presence = getPresenceContext();
+
+  let mergedProps = $derived(
+    mergeProps(props, tour.getContentProps(), presence.getPresenceProps()),
+  );
+</script>
+
+{#if presence.mounted}
+  {#if asChild}
+    {@render asChild(mergedProps)}
+  {:else}
+    <div use:presence.ref {...mergedProps}>
+      {@render children?.()}
+    </div>
+  {/if}
+{/if}

package/dist/tour/content.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 Content: $$__sveltets_2_IsomorphicComponent<TourContentProps, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, "">;
+type Content = InstanceType<typeof Content>;
+export default Content;

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

@@ -0,0 +1,2 @@
+import { type CreateTourReturn } from './create-tour.svelte.js';
+export declare const getTourContext: () => CreateTourReturn, setTourContext: (context: CreateTourReturn | (() => CreateTourReturn)) => void;

package/dist/tour/context.svelte.js

@@ -0,0 +1,3 @@
+import { createContext } from '../create-context.svelte.js';
+import {} from './create-tour.svelte.js';
+export const [getTourContext, setTourContext] = createContext('Tour');

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

@@ -0,0 +1,7 @@
+import * as tour from '@zag-js/tour';
+export interface CreateTourProps extends Omit<tour.Context, 'id' | 'dir' | 'getRootNode'> {
+    id?: string | null;
+}
+export interface CreateTourReturn extends tour.Api<any> {
+}
+export declare function createTour(props: CreateTourProps): CreateTourReturn;

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

@@ -0,0 +1,19 @@
+import { getEnvironmentContext } from '../environment-provider/context.svelte.js';
+import { getLocaleContext } from '../locale-provider/context.svelte.js';
+import { normalizeProps, reflect, useMachine } from '@zag-js/svelte';
+import * as tour from '@zag-js/tour';
+import { uid } from 'uid';
+export function createTour(props) {
+    const locale = getLocaleContext();
+    const environment = getEnvironmentContext();
+    const id = uid();
+    const context = $derived(reflect(() => ({
+        ...props,
+        id: props.id ?? id,
+        dir: locale?.dir,
+        getRootNode: environment?.getRootNode,
+    })));
+    const [state, send] = useMachine(tour.machine(context), { context });
+    const api = $derived(reflect(() => tour.connect(state, send, normalizeProps)));
+    return api;
+}

package/dist/tour/description.svelte

@@ -0,0 +1,24 @@
+<script lang="ts" module>
+  import type {HtmlIngredientProps} from '../types.js';
+
+  export interface TourDescriptionProps extends HtmlIngredientProps<'p'> {}
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '../merge-props.js';
+  import {getTourContext} from './context.svelte.js';
+
+  let {asChild, children, ...props}: TourDescriptionProps = $props();
+
+  let tour = getTourContext();
+
+  let mergedProps = $derived(mergeProps(props, tour.getDescriptionProps()));
+</script>
+
+{#if asChild}
+  {@render asChild(mergedProps)}
+{:else}
+  <p {...mergedProps}>
+    {@render children?.()}
+  </p>
+{/if}

package/dist/tour/description.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 Description: $$__sveltets_2_IsomorphicComponent<TourDescriptionProps, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, "">;
+type Description = InstanceType<typeof Description>;
+export default Description;

package/dist/tour/index.d.ts

@@ -0,0 +1,17 @@
+export * as Tour from './tour.js';
+export type { TourArrowTipProps } from './arrow-tip.svelte';
+export type { TourArrowProps } from './arrow.svelte';
+export type { TourCloseTriggerProps } from './close-trigger.svelte';
+export type { TourContentProps } from './content.svelte';
+export type { TourDescriptionProps } from './description.svelte';
+export type { TourNextTriggerProps } from './next-trigger.svelte';
+export type { TourOverlayProps } from './overlay.svelte';
+export type { TourPositionerProps } from './positioner.svelte';
+export type { TourPrevTriggerProps } from './prev-trigger.svelte';
+export type { TourProgressTextProps } from './progress-text.svelte';
+export type { TourProps } from './root.svelte';
+export type { TourSkipTriggerProps } from './skip-trigger.svelte';
+export type { TourSpotlightProps } from './spotlight.svelte';
+export type { TourTitleProps } from './title.svelte';
+export { anatomy as tourAnatomy } from '@zag-js/tour';
+export { getTourContext } from './context.svelte.js';

package/dist/tour/index.js

@@ -0,0 +1,3 @@
+export * as Tour from './tour.js';
+export { anatomy as tourAnatomy } from '@zag-js/tour';
+export { getTourContext } from './context.svelte.js';

package/dist/tour/next-trigger.svelte

@@ -0,0 +1,24 @@
+<script lang="ts" module>
+  import type {HtmlIngredientProps} from '../types.js';
+
+  export interface TourNextTriggerProps extends HtmlIngredientProps<'button'> {}
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '../merge-props.js';
+  import {getTourContext} from './context.svelte.js';
+
+  let {asChild, children, ...props}: TourNextTriggerProps = $props();
+
+  let tour = getTourContext();
+
+  let mergedProps = $derived(mergeProps(props, tour.getNextTriggerProps()));
+</script>
+
+{#if asChild}
+  {@render asChild(mergedProps)}
+{:else}
+  <button type="button" {...mergedProps}>
+    {@render children?.()}
+  </button>
+{/if}

package/dist/tour/next-trigger.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 NextTrigger: $$__sveltets_2_IsomorphicComponent<TourNextTriggerProps, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, "">;
+type NextTrigger = InstanceType<typeof NextTrigger>;
+export default NextTrigger;

package/dist/tour/overlay.svelte

@@ -0,0 +1,43 @@
+<script lang="ts" module>
+  import type {HtmlIngredientProps} from '../types.js';
+
+  export interface TourOverlayProps extends HtmlIngredientProps<'div'> {}
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '../merge-props.js';
+  import {getPresenceStrategyPropsContext} from '../presence/context.svelte.js';
+  import {createPresence} from '../presence/create-presence.svelte.js';
+  import {getTourContext} from './context.svelte.js';
+
+  let {asChild, children, ...props}: TourOverlayProps = $props();
+
+  let tour = getTourContext();
+
+  let presenceStrategyProps = getPresenceStrategyPropsContext();
+  let presence = createPresence({
+    get present() {
+      return tour.currentStep != null;
+    },
+    get lazyMount() {
+      return presenceStrategyProps.lazyMount;
+    },
+    get keepMounted() {
+      return presenceStrategyProps.keepMounted;
+    },
+  });
+
+  let mergedProps = $derived(
+    mergeProps(props, tour.getOverlayProps(), presence.getPresenceProps()),
+  );
+</script>
+
+{#if presence.mounted}
+  {#if asChild}
+    {@render asChild(mergedProps)}
+  {:else}
+    <div use:presence.ref {...mergedProps}>
+      {@render children?.()}
+    </div>
+  {/if}
+{/if}

package/dist/tour/overlay.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 Overlay: $$__sveltets_2_IsomorphicComponent<TourOverlayProps, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, "">;
+type Overlay = InstanceType<typeof Overlay>;
+export default Overlay;

package/dist/tour/positioner.svelte

@@ -0,0 +1,30 @@
+<script lang="ts" module>
+  import type {HtmlIngredientProps} from '../types.js';
+
+  export interface TourPositionerProps extends HtmlIngredientProps<'div'> {}
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '../merge-props.js';
+  import {getPresenceContext} from '../presence/context.svelte.js';
+  import {getTourContext} from './context.svelte.js';
+
+  let {asChild, children, ...props}: TourPositionerProps = $props();
+
+  let tour = getTourContext();
+  let presence = getPresenceContext();
+
+  let mergedProps = $derived(
+    mergeProps(props, tour.getPositionerProps(), presence.getPresenceProps()),
+  );
+</script>
+
+{#if presence.mounted}
+  {#if asChild}
+    {@render asChild(mergedProps)}
+  {:else}
+    <div {...mergedProps}>
+      {@render children?.()}
+    </div>
+  {/if}
+{/if}

package/dist/tour/positioner.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 Positioner: $$__sveltets_2_IsomorphicComponent<TourPositionerProps, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, "">;
+type Positioner = InstanceType<typeof Positioner>;
+export default Positioner;

package/dist/tour/prev-trigger.svelte

@@ -0,0 +1,24 @@
+<script lang="ts" module>
+  import type {HtmlIngredientProps} from '../types.js';
+
+  export interface TourPrevTriggerProps extends HtmlIngredientProps<'button'> {}
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '../merge-props.js';
+  import {getTourContext} from './context.svelte.js';
+
+  let {asChild, children, ...props}: TourPrevTriggerProps = $props();
+
+  let tour = getTourContext();
+
+  let mergedProps = $derived(mergeProps(props, tour.getPrevTriggerProps()));
+</script>
+
+{#if asChild}
+  {@render asChild(mergedProps)}
+{:else}
+  <button type="button" {...mergedProps}>
+    {@render children?.()}
+  </button>
+{/if}

package/dist/tour/prev-trigger.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 PrevTrigger: $$__sveltets_2_IsomorphicComponent<TourPrevTriggerProps, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, "">;
+type PrevTrigger = InstanceType<typeof PrevTrigger>;
+export default PrevTrigger;

package/dist/tour/progress-text.svelte

@@ -0,0 +1,28 @@
+<script lang="ts" module>
+  import type {HtmlIngredientProps} from '../types.js';
+
+  export interface TourProgressTextProps extends HtmlIngredientProps<'span'> {}
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '../merge-props.js';
+  import {getTourContext} from './context.svelte.js';
+
+  let {asChild, children, ...props}: TourProgressTextProps = $props();
+
+  let tour = getTourContext();
+
+  let mergedProps = $derived(mergeProps(props, tour.getProgressTextProps()));
+</script>
+
+{#if asChild}
+  {@render asChild(mergedProps)}
+{:else}
+  <span {...mergedProps}>
+    {#if children}
+      {@render children?.()}
+    {:else}
+      {tour.getProgressText()}
+    {/if}
+  </span>
+{/if}

package/dist/tour/progress-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 ProgressText: $$__sveltets_2_IsomorphicComponent<TourProgressTextProps, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, "">;
+type ProgressText = InstanceType<typeof ProgressText>;
+export default ProgressText;