ui-ingredients 0.3.0 → 0.4.0

package/dist/alert-dialog/alert-dialog-root.svelte

@@ -0,0 +1,48 @@
+<script lang="ts" module>
+  import type {PresenceStrategyProps} from '../presence/create-presence.svelte.js';
+  import type {Snippet} from 'svelte';
+  import type {
+    CreateAlertDialogProps,
+    CreateAlertDialogReturn,
+  } from './create-alert-dialog.svelte.js';
+
+  export interface AlertDialogProps
+    extends CreateAlertDialogProps,
+      PresenceStrategyProps {
+    children?: Snippet<[CreateAlertDialogReturn]>;
+  }
+</script>
+
+<script lang="ts">
+  import {createPresence} from '../presence/create-presence.svelte.js';
+  import {
+    setPresenceContext,
+    setPresenceStrategyPropsContext,
+  } from '../presence/presence-context.svelte.js';
+  import {reflect} from '@zag-js/svelte';
+  import {createSplitProps} from '@zag-js/utils';
+  import {setAlertDialogContext} from './alert-dialog-context.svelte.js';
+  import {createAlertDialog} from './create-alert-dialog.svelte.js';
+
+  let {children, ...props}: AlertDialogProps = $props();
+
+  let [presenceStrategyProps, createDialogProps] = $derived(
+    createSplitProps<PresenceStrategyProps>(['lazyMount', 'keepMounted'])(
+      props,
+    ),
+  );
+
+  let alertDialog = createAlertDialog(reflect(() => createDialogProps));
+  let presence = createPresence(
+    reflect(() => ({
+      ...presenceStrategyProps,
+      present: alertDialog.open,
+    })),
+  );
+
+  setAlertDialogContext(alertDialog);
+  setPresenceContext(presence);
+  setPresenceStrategyPropsContext(() => presenceStrategyProps);
+</script>
+
+{@render children?.(alertDialog)}

package/dist/alert-dialog/alert-dialog-root.svelte.d.ts

@@ -0,0 +1,24 @@
+import type { PresenceStrategyProps } from '../presence/create-presence.svelte.js';
+import type { Snippet } from 'svelte';
+import type { CreateAlertDialogProps, CreateAlertDialogReturn } from './create-alert-dialog.svelte.js';
+export interface AlertDialogProps extends CreateAlertDialogProps, PresenceStrategyProps {
+    children?: Snippet<[CreateAlertDialogReturn]>;
+}
+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 AlertDialogRoot: $$__sveltets_2_IsomorphicComponent<AlertDialogProps, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, "">;
+type AlertDialogRoot = InstanceType<typeof AlertDialogRoot>;
+export default AlertDialogRoot;

package/dist/alert-dialog/alert-dialog-title.svelte

@@ -0,0 +1,30 @@
+<script lang="ts" module>
+  import type {HtmlIngredientProps} from '../types.js';
+
+  export interface AlertDialogTitleProps
+    extends HtmlIngredientProps<'h2', HTMLHeadingElement> {}
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '../merge-props.js';
+  import {getAlertDialogContext} from './alert-dialog-context.svelte.js';
+
+  let {
+    ref = $bindable(null),
+    asChild,
+    children,
+    ...props
+  }: AlertDialogTitleProps = $props();
+
+  let alertDialog = getAlertDialogContext();
+
+  let mergedProps = $derived(mergeProps(alertDialog.getTitleProps(), props));
+</script>
+
+{#if asChild}
+  {@render asChild(mergedProps)}
+{:else}
+  <h2 bind:this={ref} {...mergedProps}>
+    {@render children?.()}
+  </h2>
+{/if}

package/dist/alert-dialog/alert-dialog-title.svelte.d.ts

@@ -0,0 +1,21 @@
+import type { HtmlIngredientProps } from '../types.js';
+export interface AlertDialogTitleProps extends HtmlIngredientProps<'h2', HTMLHeadingElement> {
+}
+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 AlertDialogTitle: $$__sveltets_2_IsomorphicComponent<AlertDialogTitleProps, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, "ref">;
+type AlertDialogTitle = InstanceType<typeof AlertDialogTitle>;
+export default AlertDialogTitle;

package/dist/alert-dialog/alert-dialog-trigger.svelte

@@ -0,0 +1,30 @@
+<script lang="ts" module>
+  import type {HtmlIngredientProps} from '../types.js';
+
+  export interface AlertDialogTriggerProps
+    extends HtmlIngredientProps<'button', HTMLButtonElement> {}
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '../merge-props.js';
+  import {getAlertDialogContext} from './alert-dialog-context.svelte.js';
+
+  let {
+    ref = $bindable(null),
+    asChild,
+    children,
+    ...props
+  }: AlertDialogTriggerProps = $props();
+
+  let alertDialog = getAlertDialogContext();
+
+  let mergedProps = $derived(mergeProps(alertDialog.getTriggerProps(), props));
+</script>
+
+{#if asChild}
+  {@render asChild(mergedProps)}
+{:else}
+  <button bind:this={ref} type="button" {...mergedProps}>
+    {@render children?.()}
+  </button>
+{/if}

package/dist/alert-dialog/alert-dialog-trigger.svelte.d.ts

@@ -0,0 +1,21 @@
+import type { HtmlIngredientProps } from '../types.js';
+export interface AlertDialogTriggerProps extends HtmlIngredientProps<'button', HTMLButtonElement> {
+}
+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 AlertDialogTrigger: $$__sveltets_2_IsomorphicComponent<AlertDialogTriggerProps, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, "ref">;
+type AlertDialogTrigger = InstanceType<typeof AlertDialogTrigger>;
+export default AlertDialogTrigger;

package/dist/alert-dialog/alert-dialog.d.ts

@@ -0,0 +1,8 @@
+export { default as Backdrop } from './alert-dialog-backdrop.svelte';
+export { default as CloseTrigger } from './alert-dialog-close-trigger.svelte';
+export { default as Content } from './alert-dialog-content.svelte';
+export { default as Description } from './alert-dialog-description.svelte';
+export { default as Positioner } from './alert-dialog-positioner.svelte';
+export { default as Root } from './alert-dialog-root.svelte';
+export { default as Title } from './alert-dialog-title.svelte';
+export { default as Trigger } from './alert-dialog-trigger.svelte';

package/dist/alert-dialog/alert-dialog.js

@@ -0,0 +1,8 @@
+export { default as Backdrop } from './alert-dialog-backdrop.svelte';
+export { default as CloseTrigger } from './alert-dialog-close-trigger.svelte';
+export { default as Content } from './alert-dialog-content.svelte';
+export { default as Description } from './alert-dialog-description.svelte';
+export { default as Positioner } from './alert-dialog-positioner.svelte';
+export { default as Root } from './alert-dialog-root.svelte';
+export { default as Title } from './alert-dialog-title.svelte';
+export { default as Trigger } from './alert-dialog-trigger.svelte';

package/dist/alert-dialog/create-alert-dialog.svelte.d.ts

@@ -0,0 +1,8 @@
+import * as dialog from '@zag-js/dialog';
+export interface CreateAlertDialogProps extends Omit<dialog.Context, 'id' | 'dir' | 'role' | 'getRootNode' | 'open.controlled'> {
+    id?: string;
+    openControlled?: boolean;
+}
+export interface CreateAlertDialogReturn extends dialog.Api {
+}
+export declare function createAlertDialog(props: CreateAlertDialogProps): CreateAlertDialogReturn;

package/dist/alert-dialog/create-alert-dialog.svelte.js

@@ -0,0 +1,48 @@
+import { getEnvironmentContext } from '../environment-provider/enviroment-provider-context.svelte.js';
+import { getLocaleContext } from '../locale-provider/local-provider-context.svelte.js';
+import { mergeProps } from '../merge-props.js';
+import * as dialog from '@zag-js/dialog';
+import { normalizeProps, reflect, useMachine } from '@zag-js/svelte';
+import { uid } from 'uid';
+import { parts } from './alert-dialog-anatomy.js';
+export function createAlertDialog(props) {
+    const locale = getLocaleContext();
+    const environment = getEnvironmentContext();
+    const id = uid();
+    const context = reflect(() => ({
+        id,
+        dir: locale?.dir,
+        role: 'alertdialog',
+        ...props,
+        getRootNode: environment?.getRootNode,
+        'open.controlled': props.openControlled,
+    }));
+    const [state, send] = useMachine(dialog.machine(context), { context });
+    return reflect(() => {
+        const o = dialog.connect(state, send, normalizeProps);
+        return {
+            ...o,
+            getBackdropProps() {
+                return mergeProps(o.getBackdropProps(), parts.backdrop.attrs);
+            },
+            getCloseTriggerProps() {
+                return mergeProps(o.getCloseTriggerProps(), parts.closeTrigger.attrs);
+            },
+            getContentProps() {
+                return mergeProps(o.getContentProps(), parts.content.attrs);
+            },
+            getDescriptionProps() {
+                return mergeProps(o.getDescriptionProps(), parts.description.attrs);
+            },
+            getPositionerProps() {
+                return mergeProps(o.getPositionerProps(), parts.positioner.attrs);
+            },
+            getTitleProps() {
+                return mergeProps(o.getTitleProps(), parts.title.attrs);
+            },
+            getTriggerProps() {
+                return mergeProps(o.getTriggerProps(), parts.trigger.attrs);
+            },
+        };
+    });
+}

package/dist/alert-dialog/index.d.ts

@@ -0,0 +1,11 @@
+export * as AlertDialog from './alert-dialog.js';
+export type { AlertDialogBackdropProps } from './alert-dialog-backdrop.svelte';
+export type { AlertDialogCloseTriggerProps } from './alert-dialog-close-trigger.svelte';
+export type { AlertDialogContentProps } from './alert-dialog-content.svelte';
+export type { AlertDialogDescriptionProps } from './alert-dialog-description.svelte';
+export type { AlertDialogPositionerProps } from './alert-dialog-positioner.svelte';
+export type { AlertDialogProps } from './alert-dialog-root.svelte';
+export type { AlertDialogTitleProps } from './alert-dialog-title.svelte';
+export type { AlertDialogTriggerProps } from './alert-dialog-trigger.svelte';
+export { anatomy as alertDialogAnatomy } from './alert-dialog-anatomy.js';
+export { getAlertDialogContext } from './alert-dialog-context.svelte.js';

package/dist/alert-dialog/index.js

@@ -0,0 +1,3 @@
+export * as AlertDialog from './alert-dialog.js';
+export { anatomy as alertDialogAnatomy } from './alert-dialog-anatomy.js';
+export { getAlertDialogContext } from './alert-dialog-context.svelte.js';

package/dist/breadcrumbs/breadcrumbs-anatomy.d.ts

@@ -0,0 +1,2 @@
+export declare const anatomy: import("@zag-js/anatomy").AnatomyInstance<"link" | "list" | "separator" | "root" | "item">;
+export declare const parts: Record<"link" | "list" | "separator" | "root" | "item", import("@zag-js/anatomy").AnatomyPart>;

package/dist/breadcrumbs/breadcrumbs-anatomy.js

@@ -0,0 +1,3 @@
+import { createAnatomy } from '@zag-js/anatomy';
+export const anatomy = createAnatomy('breadcrumbs').parts('root', 'list', 'item', 'link', 'separator');
+export const parts = anatomy.build();

package/dist/breadcrumbs/breadcrumbs-context.svelte.d.ts

@@ -0,0 +1,2 @@
+import type { CreateBreadcrumbsReturn } from './create-breadcrumbs.js';
+export declare const getBreadcrumbsContext: () => CreateBreadcrumbsReturn, setBreadcrumbsContext: (context: CreateBreadcrumbsReturn | (() => CreateBreadcrumbsReturn)) => void;

package/dist/breadcrumbs/breadcrumbs-context.svelte.js

@@ -0,0 +1,2 @@
+import { createContext } from '../create-context.svelte.js';
+export const [getBreadcrumbsContext, setBreadcrumbsContext] = createContext('Breadcrumbs');

package/dist/breadcrumbs/breadcrumbs-item.svelte

@@ -0,0 +1,25 @@
+<script lang="ts" module>
+  import type {HtmlIngredientProps} from '../types.js';
+
+  export interface BreadcrumbsItemProps
+    extends HtmlIngredientProps<'li', HTMLLIElement> {}
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '../merge-props.js';
+  import {createBreadcrumbs} from './create-breadcrumbs.js';
+
+  let {ref, asChild, children, ...props}: BreadcrumbsItemProps = $props();
+
+  let breadcrumbs = createBreadcrumbs();
+
+  let attrs = $derived(mergeProps(breadcrumbs.getItemProps(), props));
+</script>
+
+{#if asChild}
+  {@render asChild(attrs)}
+{:else}
+  <li bind:this={ref} {...attrs}>
+    {@render children?.()}
+  </li>
+{/if}

package/dist/breadcrumbs/breadcrumbs-item.svelte.d.ts

@@ -0,0 +1,21 @@
+import type { HtmlIngredientProps } from '../types.js';
+export interface BreadcrumbsItemProps extends HtmlIngredientProps<'li', HTMLLIElement> {
+}
+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 BreadcrumbsItem: $$__sveltets_2_IsomorphicComponent<BreadcrumbsItemProps, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, "">;
+type BreadcrumbsItem = InstanceType<typeof BreadcrumbsItem>;
+export default BreadcrumbsItem;

package/dist/breadcrumbs/breadcrumbs-link.svelte

@@ -0,0 +1,33 @@
+<script lang="ts" module>
+  import type {Assign, HtmlIngredientProps} from '../types.js';
+  import type {LinkProps} from './create-breadcrumbs.js';
+
+  export interface BreadcrumbsLinkProps
+    extends Assign<HtmlIngredientProps<'a', HTMLAnchorElement>, LinkProps> {}
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '../merge-props.js';
+  import {createSplitProps} from '@zag-js/utils';
+  import {getBreadcrumbsContext} from './breadcrumbs-context.svelte.js';
+
+  let {ref, asChild, children, ...props}: BreadcrumbsLinkProps = $props();
+
+  let [linkProps, localProps] = $derived(
+    createSplitProps<LinkProps>(['href', 'current'])(props),
+  );
+
+  let breadcrumbs = getBreadcrumbsContext();
+
+  let attrs = $derived(
+    mergeProps(breadcrumbs.getLinkProps(linkProps), localProps),
+  );
+</script>
+
+{#if asChild}
+  {@render asChild(attrs)}
+{:else}
+  <a bind:this={ref} {...attrs}>
+    {@render children?.()}
+  </a>
+{/if}

package/dist/breadcrumbs/breadcrumbs-link.svelte.d.ts

@@ -0,0 +1,22 @@
+import type { Assign, HtmlIngredientProps } from '../types.js';
+import type { LinkProps } from './create-breadcrumbs.js';
+export interface BreadcrumbsLinkProps extends Assign<HtmlIngredientProps<'a', HTMLAnchorElement>, LinkProps> {
+}
+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 BreadcrumbsLink: $$__sveltets_2_IsomorphicComponent<BreadcrumbsLinkProps, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, "">;
+type BreadcrumbsLink = InstanceType<typeof BreadcrumbsLink>;
+export default BreadcrumbsLink;

package/dist/breadcrumbs/breadcrumbs-list.svelte

@@ -0,0 +1,25 @@
+<script lang="ts" module>
+  import type {HtmlIngredientProps} from '../types.js';
+
+  export interface BreadcrumbsListProps
+    extends HtmlIngredientProps<'ol', HTMLOListElement> {}
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '../merge-props.js';
+  import {getBreadcrumbsContext} from './breadcrumbs-context.svelte.js';
+
+  let {ref, asChild, children, ...props}: BreadcrumbsListProps = $props();
+
+  let breadcrumbs = getBreadcrumbsContext();
+
+  let attrs = $derived(mergeProps(breadcrumbs.getListProps(), props));
+</script>
+
+{#if asChild}
+  {@render asChild(attrs)}
+{:else}
+  <ol bind:this={ref} {...attrs}>
+    {@render children?.()}
+  </ol>
+{/if}

package/dist/breadcrumbs/breadcrumbs-list.svelte.d.ts

@@ -0,0 +1,21 @@
+import type { HtmlIngredientProps } from '../types.js';
+export interface BreadcrumbsListProps extends HtmlIngredientProps<'ol', HTMLOListElement> {
+}
+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 BreadcrumbsList: $$__sveltets_2_IsomorphicComponent<BreadcrumbsListProps, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, "">;
+type BreadcrumbsList = InstanceType<typeof BreadcrumbsList>;
+export default BreadcrumbsList;

package/dist/breadcrumbs/breadcrumbs-root.svelte

@@ -0,0 +1,29 @@
+<script lang="ts" module>
+  import type {HtmlIngredientProps} from '../types.js';
+  import type {CreateBreadcrumbsReturn} from './create-breadcrumbs.js';
+
+  export interface BreadcrumbsProps
+    extends HtmlIngredientProps<'nav', HTMLElement, CreateBreadcrumbsReturn> {}
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '../merge-props.js';
+  import {setBreadcrumbsContext} from './breadcrumbs-context.svelte.js';
+  import {createBreadcrumbs} from './create-breadcrumbs.js';
+
+  let {ref, asChild, children, ...props}: BreadcrumbsProps = $props();
+
+  let breadcrumbs = createBreadcrumbs();
+
+  let attrs = $derived(mergeProps(breadcrumbs.getRootProps(), props));
+
+  setBreadcrumbsContext(breadcrumbs);
+</script>
+
+{#if asChild}
+  {@render asChild(attrs, breadcrumbs)}
+{:else}
+  <nav bind:this={ref} {...attrs}>
+    {@render children?.(breadcrumbs)}
+  </nav>
+{/if}

package/dist/breadcrumbs/breadcrumbs-root.svelte.d.ts

@@ -0,0 +1,22 @@
+import type { HtmlIngredientProps } from '../types.js';
+import type { CreateBreadcrumbsReturn } from './create-breadcrumbs.js';
+export interface BreadcrumbsProps extends HtmlIngredientProps<'nav', HTMLElement, CreateBreadcrumbsReturn> {
+}
+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 BreadcrumbsRoot: $$__sveltets_2_IsomorphicComponent<BreadcrumbsProps, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, "">;
+type BreadcrumbsRoot = InstanceType<typeof BreadcrumbsRoot>;
+export default BreadcrumbsRoot;

package/dist/breadcrumbs/breadcrumbs-separator.svelte

@@ -0,0 +1,25 @@
+<script lang="ts" module>
+  import type {HtmlIngredientProps} from '../types.js';
+
+  export interface BreadcrumbsSeparatorProps
+    extends HtmlIngredientProps<'span', HTMLSpanElement> {}
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '../merge-props.js';
+  import {getBreadcrumbsContext} from './breadcrumbs-context.svelte.js';
+
+  let {ref, asChild, children, ...props}: BreadcrumbsSeparatorProps = $props();
+
+  let breadcrumbs = getBreadcrumbsContext();
+
+  let attrs = $derived(mergeProps(breadcrumbs.getSeparatorProps(), props));
+</script>
+
+{#if asChild}
+  {@render asChild(attrs)}
+{:else}
+  <span bind:this={ref} {...attrs}>
+    {@render children?.()}
+  </span>
+{/if}

package/dist/breadcrumbs/breadcrumbs-separator.svelte.d.ts

@@ -0,0 +1,21 @@
+import type { HtmlIngredientProps } from '../types.js';
+export interface BreadcrumbsSeparatorProps extends HtmlIngredientProps<'span', HTMLSpanElement> {
+}
+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 BreadcrumbsSeparator: $$__sveltets_2_IsomorphicComponent<BreadcrumbsSeparatorProps, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, "">;
+type BreadcrumbsSeparator = InstanceType<typeof BreadcrumbsSeparator>;
+export default BreadcrumbsSeparator;

package/dist/breadcrumbs/breadcrumbs.d.ts

@@ -0,0 +1,5 @@
+export { default as Item } from './breadcrumbs-item.svelte';
+export { default as Link } from './breadcrumbs-link.svelte';
+export { default as List } from './breadcrumbs-list.svelte';
+export { default as Root } from './breadcrumbs-root.svelte';
+export { default as Separator } from './breadcrumbs-separator.svelte';

package/dist/breadcrumbs/breadcrumbs.js

@@ -0,0 +1,5 @@
+export { default as Item } from './breadcrumbs-item.svelte';
+export { default as Link } from './breadcrumbs-link.svelte';
+export { default as List } from './breadcrumbs-list.svelte';
+export { default as Root } from './breadcrumbs-root.svelte';
+export { default as Separator } from './breadcrumbs-separator.svelte';

package/dist/breadcrumbs/create-breadcrumbs.d.ts

@@ -0,0 +1,13 @@
+import type { HTMLAnchorAttributes, HTMLAttributes, HTMLLiAttributes, HTMLOlAttributes } from 'svelte/elements';
+export interface LinkProps {
+    href: string;
+    current?: boolean;
+}
+export interface CreateBreadcrumbsReturn {
+    getRootProps(): HTMLAttributes<HTMLElement>;
+    getListProps(): HTMLOlAttributes;
+    getItemProps(): HTMLLiAttributes;
+    getLinkProps(props: LinkProps): HTMLAnchorAttributes;
+    getSeparatorProps(): HTMLAttributes<HTMLElement>;
+}
+export declare function createBreadcrumbs(): CreateBreadcrumbsReturn;

package/dist/breadcrumbs/create-breadcrumbs.js

@@ -0,0 +1,47 @@
+import { ariaAttr, dataAttr } from '@zag-js/dom-query';
+import { parts } from './breadcrumbs-anatomy.js';
+export function createBreadcrumbs() {
+    function getRootProps() {
+        return {
+            role: 'navigation',
+            'aria-label': 'Breadcrumb',
+            ...parts.root.attrs,
+        };
+    }
+    function getListProps() {
+        return {
+            role: 'list',
+            ...parts.list.attrs,
+        };
+    }
+    function getItemProps() {
+        return {
+            role: 'listitem',
+            ...parts.item.attrs,
+        };
+    }
+    function getLinkProps(props) {
+        return {
+            role: 'link',
+            href: props.current ? undefined : props.href,
+            'aria-current': props.current ? 'page' : undefined,
+            'data-current': dataAttr(props.current),
+            'aria-disabled': ariaAttr(props.current),
+            'data-disabled': dataAttr(props.current),
+            ...parts.link.attrs,
+        };
+    }
+    function getSeparatorProps() {
+        return {
+            'aria-hidden': true,
+            ...parts.separator.attrs,
+        };
+    }
+    return {
+        getRootProps,
+        getListProps,
+        getItemProps,
+        getLinkProps,
+        getSeparatorProps,
+    };
+}

package/dist/breadcrumbs/index.d.ts

@@ -0,0 +1,8 @@
+export * as Breadcrumbs from './breadcrumbs.js';
+export type { BreadcrumbsItemProps } from './breadcrumbs-item.svelte';
+export type { BreadcrumbsLinkProps } from './breadcrumbs-link.svelte';
+export type { BreadcrumbsListProps } from './breadcrumbs-list.svelte';
+export type { BreadcrumbsProps } from './breadcrumbs-root.svelte';
+export type { BreadcrumbsSeparatorProps } from './breadcrumbs-separator.svelte';
+export { anatomy as breadcrumbsAnatomy } from './breadcrumbs-anatomy.js';
+export { getBreadcrumbsContext as getBreadcrumbContext } from './breadcrumbs-context.svelte.js';

package/dist/breadcrumbs/index.js

@@ -0,0 +1,3 @@
+export * as Breadcrumbs from './breadcrumbs.js';
+export { anatomy as breadcrumbsAnatomy } from './breadcrumbs-anatomy.js';
+export { getBreadcrumbsContext as getBreadcrumbContext } from './breadcrumbs-context.svelte.js';