ui-ingredients 0.0.10 → 0.0.12

package/dist/progress/circle-range.svelte

@@ -1,20 +1,21 @@
-<script lang="ts" context="module">
-  import type {SvelteHtmlProps} from '../types.js';
-
-  export interface ProgressCircleRangeProps extends SvelteHtmlProps<'circle'> {}
-</script>
-
-<script lang="ts">
-  import {mergeProps} from '@zag-js/svelte';
-  import {useProgressContext} from './context.svelte.js';
-
-  let {children, ...props}: ProgressCircleRangeProps = $props();
-
-  let context = useProgressContext();
-
-  let attrs = $derived(mergeProps(props, context.getCircleRangeProps()));
-</script>
-
-<circle {...attrs}>
-  {@render children?.()}
-</circle>
+<script lang="ts" context="module">
+  import type {HtmlIngredientProps} from '../types.js';
+
+  export interface ProgressCircleRangeProps
+    extends HtmlIngredientProps<'circle'> {}
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '@zag-js/svelte';
+  import {useProgressContext} from './context.svelte.js';
+
+  let {children, ...props}: ProgressCircleRangeProps = $props();
+
+  let context = useProgressContext();
+
+  let attrs = $derived(mergeProps(props, context.getCircleRangeProps()));
+</script>
+
+<circle {...attrs}>
+  {@render children?.()}
+</circle>

package/dist/progress/circle-range.svelte.d.ts

@@ -1,5 +1,5 @@
-import type { SvelteHtmlProps } from '../types.js';
-export interface ProgressCircleRangeProps extends SvelteHtmlProps<'circle'> {
+import type { HtmlIngredientProps } from '../types.js';
+export interface ProgressCircleRangeProps extends HtmlIngredientProps<'circle'> {
 }
 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> & {

package/dist/progress/circle-track.svelte

@@ -1,20 +1,21 @@
-<script lang="ts" context="module">
-  import type {SvelteHtmlProps} from '../types.js';
-
-  export interface ProgressCircleTrackProps extends SvelteHtmlProps<'circle'> {}
-</script>
-
-<script lang="ts">
-  import {mergeProps} from '@zag-js/svelte';
-  import {useProgressContext} from './context.svelte.js';
-
-  let {children, ...props}: ProgressCircleTrackProps = $props();
-
-  let context = useProgressContext();
-
-  let attrs = $derived(mergeProps(props, context.getCircleTrackProps()));
-</script>
-
-<circle {...attrs}>
-  {@render children?.()}
-</circle>
+<script lang="ts" context="module">
+  import type {HtmlIngredientProps} from '../types.js';
+
+  export interface ProgressCircleTrackProps
+    extends HtmlIngredientProps<'circle'> {}
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '@zag-js/svelte';
+  import {useProgressContext} from './context.svelte.js';
+
+  let {children, ...props}: ProgressCircleTrackProps = $props();
+
+  let context = useProgressContext();
+
+  let attrs = $derived(mergeProps(props, context.getCircleTrackProps()));
+</script>
+
+<circle {...attrs}>
+  {@render children?.()}
+</circle>

package/dist/progress/circle-track.svelte.d.ts

@@ -1,5 +1,5 @@
-import type { SvelteHtmlProps } from '../types.js';
-export interface ProgressCircleTrackProps extends SvelteHtmlProps<'circle'> {
+import type { HtmlIngredientProps } from '../types.js';
+export interface ProgressCircleTrackProps extends HtmlIngredientProps<'circle'> {
 }
 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> & {

package/dist/progress/circle.svelte

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

package/dist/progress/circle.svelte.d.ts

@@ -1,5 +1,5 @@
-import type { SvelteHtmlProps } from '../types.js';
-export interface ProgressCircleProps extends SvelteHtmlProps<'svg'> {
+import type { HtmlIngredientProps } from '../types.js';
+export interface ProgressCircleProps extends HtmlIngredientProps<'svg'> {
 }
 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> & {

package/dist/progress/index.d.ts

@@ -1,8 +1,10 @@
-export { default as CircleRange, type ProgressCircleRangeProps, } from './circle-range.svelte';
-export { default as CircleTrack, type ProgressCircleTrackProps, } from './circle-track.svelte';
-export { default as Circle, type ProgressCircleProps } from './circle.svelte';
-export { default as Label, type ProgressLabelProps } from './label.svelte';
-export { default as Range, type ProgressRangeProps } from './range.svelte';
-export { default as Root, type ProgressProps } from './root.svelte';
-export { default as Track, type ProgressTrackProps } from './track.svelte';
-export { default as ValueText, type ProgressValueTextProps, } from './value-text.svelte';
+export { anatomy as progressAnatomy } from '@zag-js/progress';
+export type { ProgressCircleRangeProps } from './circle-range.svelte';
+export type { ProgressCircleTrackProps } from './circle-track.svelte';
+export type { ProgressCircleProps } from './circle.svelte';
+export type { ProgressLabelProps } from './label.svelte';
+export * as Progress from './progress.js';
+export type { ProgressRangeProps } from './range.svelte';
+export type { ProgressProps } from './root.svelte';
+export type { ProgressTrackProps } from './track.svelte';
+export type { ProgressValueTextProps } from './value-text.svelte';

package/dist/progress/index.js

@@ -1,8 +1,2 @@
-export { default as CircleRange, } from './circle-range.svelte';
-export { default as CircleTrack, } from './circle-track.svelte';
-export { default as Circle } from './circle.svelte';
-export { default as Label } from './label.svelte';
-export { default as Range } from './range.svelte';
-export { default as Root } from './root.svelte';
-export { default as Track } from './track.svelte';
-export { default as ValueText, } from './value-text.svelte';
+export { anatomy as progressAnatomy } from '@zag-js/progress';
+export * as Progress from './progress.js';

package/dist/progress/label.svelte

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

package/dist/progress/label.svelte.d.ts

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

package/dist/progress/progress.d.ts

@@ -0,0 +1,8 @@
+export { default as CircleRange } from './circle-range.svelte';
+export { default as CircleTrack } from './circle-track.svelte';
+export { default as Circle } from './circle.svelte';
+export { default as Label } from './label.svelte';
+export { default as Range } from './range.svelte';
+export { default as Root } from './root.svelte';
+export { default as Track } from './track.svelte';
+export { default as ValueText } from './value-text.svelte';

package/dist/progress/progress.js

@@ -0,0 +1,8 @@
+export { default as CircleRange } from './circle-range.svelte';
+export { default as CircleTrack } from './circle-track.svelte';
+export { default as Circle } from './circle.svelte';
+export { default as Label } from './label.svelte';
+export { default as Range } from './range.svelte';
+export { default as Root } from './root.svelte';
+export { default as Track } from './track.svelte';
+export { default as ValueText } from './value-text.svelte';

package/dist/progress/range.svelte

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

package/dist/progress/range.svelte.d.ts

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

package/dist/progress/root.svelte

@@ -1,56 +1,61 @@
-<script lang="ts" context="module">
-  import type {Assign, SvelteHtmlProps} from '../types.js';
-  import type {Snippet} from 'svelte';
-  import type {
-    CreateProgressContextProps,
-    CreateProgressContextReturn,
-  } from './context.svelte.js';
-
-  export interface ProgressProps
-    extends Assign<
-      Omit<SvelteHtmlProps<'div'>, 'children'>,
-      Omit<CreateProgressContextProps, 'id'>
-    > {
-    children?: Snippet<[context: CreateProgressContextReturn]>;
-  }
-</script>
-
-<script lang="ts">
-  import {uuid} from '../utils.svelte.js';
-  import {mergeProps} from '@zag-js/svelte';
-  import {createProgressContext, setProgressContext} from './context.svelte.js';
-
-  let {
-    id,
-    ids,
-    dir,
-    max,
-    min,
-    value,
-    orientation,
-    translations,
-    getRootNode,
-    children,
-    ...props
-  }: ProgressProps = $props();
-
-  let context = createProgressContext({
-    id: id ?? uuid(),
-    ids,
-    dir,
-    max,
-    min,
-    value: $state.snapshot(value),
-    orientation,
-    translations,
-    getRootNode,
-  });
-
-  let attrs = $derived(mergeProps(props, context.getRootProps()));
-
-  setProgressContext(context);
-</script>
-
-<div {...attrs}>
-  {@render children?.(context)}
-</div>
+<script lang="ts" context="module">
+  import type {Assign, HtmlIngredientProps} from '../types.js';
+  import type {Snippet} from 'svelte';
+  import type {
+    CreateProgressContextProps,
+    CreateProgressContextReturn,
+  } from './context.svelte.js';
+
+  export interface ProgressProps
+    extends Assign<
+      Omit<HtmlIngredientProps<'div'>, 'children'>,
+      Omit<CreateProgressContextProps, 'id'>
+    > {
+    children?: Snippet<[context: CreateProgressContextReturn]>;
+  }
+</script>
+
+<script lang="ts">
+  import {useEnvironmentContext} from '../environment-provider/index.js';
+  import {useLocaleContext} from '../locale-provider/index.js';
+  import {uuid} from '../utils.svelte.js';
+  import {mergeProps} from '@zag-js/svelte';
+  import {createProgressContext, setProgressContext} from './context.svelte.js';
+
+  let {
+    id,
+    ids,
+    dir,
+    max,
+    min,
+    value,
+    orientation,
+    translations,
+    getRootNode,
+    children,
+    ...props
+  }: ProgressProps = $props();
+
+  let localeContext = useLocaleContext();
+  let environmentContext = useEnvironmentContext();
+
+  let context = createProgressContext({
+    id: id ?? uuid(),
+    ids,
+    dir: dir ?? localeContext?.dir,
+    max,
+    min,
+    value: $state.snapshot(value),
+    orientation,
+    translations,
+    getRootNode: getRootNode ?? environmentContext?.getRootNode,
+  });
+
+  let attrs = $derived(mergeProps(props, context.getRootProps()));
+
+  setProgressContext(context);
+</script>
+
+<div {...attrs}>
+  {@render children?.(context)}
+</div>

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

@@ -1,7 +1,7 @@
-import type { Assign, SvelteHtmlProps } from '../types.js';
+import type { Assign, HtmlIngredientProps } from '../types.js';
 import type { Snippet } from 'svelte';
 import type { CreateProgressContextProps, CreateProgressContextReturn } from './context.svelte.js';
-export interface ProgressProps extends Assign<Omit<SvelteHtmlProps<'div'>, 'children'>, Omit<CreateProgressContextProps, 'id'>> {
+export interface ProgressProps extends Assign<Omit<HtmlIngredientProps<'div'>, 'children'>, Omit<CreateProgressContextProps, 'id'>> {
     children?: Snippet<[context: CreateProgressContextReturn]>;
 }
 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> {

package/dist/progress/track.svelte

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

package/dist/progress/track.svelte.d.ts

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

package/dist/progress/value-text.svelte

@@ -1,24 +1,24 @@
-<script lang="ts" context="module">
-  import type {SvelteHtmlProps} from '../types.js';
-
-  export interface ProgressValueTextProps extends SvelteHtmlProps<'div'> {}
-</script>
-
-<script lang="ts">
-  import {mergeProps} from '@zag-js/svelte';
-  import {useProgressContext} from './context.svelte.js';
-
-  let {children, ...props}: ProgressValueTextProps = $props();
-
-  let context = useProgressContext();
-
-  let attrs = $derived(mergeProps(props, context.getValueTextProps()));
-</script>
-
-<div {...attrs}>
-  {#if children}
-    {@render children()}
-  {:else}
-    {context.percentAsString}
-  {/if}
-</div>
+<script lang="ts" context="module">
+  import type {HtmlIngredientProps} from '../types.js';
+
+  export interface ProgressValueTextProps extends HtmlIngredientProps<'div'> {}
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '@zag-js/svelte';
+  import {useProgressContext} from './context.svelte.js';
+
+  let {children, ...props}: ProgressValueTextProps = $props();
+
+  let context = useProgressContext();
+
+  let attrs = $derived(mergeProps(props, context.getValueTextProps()));
+</script>
+
+<div {...attrs}>
+  {#if children}
+    {@render children()}
+  {:else}
+    {context.percentAsString}
+  {/if}
+</div>

package/dist/progress/value-text.svelte.d.ts

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

package/dist/qr-code/frame.svelte

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

package/dist/qr-code/frame.svelte.d.ts

@@ -1,5 +1,5 @@
-import type { SvelteHtmlProps } from '../types.js';
-export interface QRCodeFrameProps extends SvelteHtmlProps<'svg'> {
+import type { HtmlIngredientProps } from '../types.js';
+export interface QRCodeFrameProps extends HtmlIngredientProps<'svg'> {
 }
 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> & {

package/dist/qr-code/index.d.ts

@@ -1,4 +1,6 @@
-export { default as Frame, type QRCodeFrameProps } from './frame.svelte';
-export { default as Overlay, type QRCodeOverlayProps } from './overlay.svelte';
-export { default as Pattern, type QRCodePatternProps } from './pattern.svelte';
-export { default as Root, type QRCodeProps } from './root.svelte';
+export { anatomy as qrCodeAnatomy } from '@zag-js/qr-code';
+export type { QRCodeFrameProps } from './frame.svelte';
+export type { QRCodeOverlayProps } from './overlay.svelte';
+export type { QRCodePatternProps } from './pattern.svelte';
+export * as QRCode from './qr-code.js';
+export type { QRCodeProps } from './root.svelte';

package/dist/qr-code/index.js

@@ -1,4 +1,2 @@
-export { default as Frame } from './frame.svelte';
-export { default as Overlay } from './overlay.svelte';
-export { default as Pattern } from './pattern.svelte';
-export { default as Root } from './root.svelte';
+export { anatomy as qrCodeAnatomy } from '@zag-js/qr-code';
+export * as QRCode from './qr-code.js';