ui-ingredients 0.26.0 → 0.28.0

package/dist/popover/popover-close-trigger.svelte

@@ -17,7 +17,6 @@
   }: PopoverCloseTriggerProps = $props();
 
   let popover = getPopoverContext();
-
   let mergedProps = $derived(mergeProps(popover.getCloseTriggerProps(), props));
 </script>
 

package/dist/popover/popover-content.svelte

@@ -20,7 +20,6 @@
 
   let popover = getPopoverContext();
   let presence = getPresenceContext();
-
   let mergedProps = $derived(
     mergeProps(popover.getContentProps(), presence.getPresenceProps(), props),
   );

package/dist/popover/popover-description.svelte

@@ -17,7 +17,6 @@
   }: PopoverDescriptionProps = $props();
 
   let popover = getPopoverContext();
-
   let mergedProps = $derived(mergeProps(popover.getDescriptionProps(), props));
 </script>
 

package/dist/popover/popover-indicator.svelte

@@ -17,7 +17,6 @@
   }: PopoverIndicatorProps = $props();
 
   let popover = getPopoverContext();
-
   let mergedProps = $derived(mergeProps(popover.getIndicatorProps(), props));
 </script>
 

package/dist/popover/popover-positioner.svelte

@@ -19,7 +19,6 @@
 
   let popover = getPopoverContext();
   let presence = getPresenceContext();
-
   let mergedProps = $derived(
     mergeProps(
       popover.getPositionerProps(),

package/dist/popover/popover-root.svelte

@@ -25,23 +25,23 @@
 
   let [createPopoverProps, presenceStrategyProps] = $derived(
     createSplitProps<CreatePopoverProps>([
-      'id',
-      'ids',
-      'open',
-      'openControlled',
-      'modal',
       'autoFocus',
-      'portalled',
-      'positioning',
       'closeOnEscape',
-      'initialFocusEl',
-      'persistentElements',
       'closeOnInteractOutside',
-      'onOpenChange',
-      'onFocusOutside',
+      'id',
+      'ids',
+      'initialFocusEl',
+      'modal',
       'onEscapeKeyDown',
+      'onFocusOutside',
       'onInteractOutside',
+      'onOpenChange',
       'onPointerDownOutside',
+      'open',
+      'openControlled',
+      'persistentElements',
+      'portalled',
+      'positioning',
     ])(props),
   );
 

package/dist/popover/popover-title.svelte

@@ -17,7 +17,6 @@
   }: PopoverTitleProps = $props();
 
   let popover = getPopoverContext();
-
   let mergedProps = $derived(mergeProps(popover.getTitleProps(), props));
 </script>
 

package/dist/popover/popover-trigger.svelte

@@ -17,7 +17,6 @@
   }: PopoverTriggerProps = $props();
 
   let popover = getPopoverContext();
-
   let mergedProps = $derived(mergeProps(popover.getTriggerProps(), props));
 </script>
 

package/dist/presence/presence.svelte

@@ -20,14 +20,13 @@
 
   let [createPresenceProps, localProps] = $derived(
     createSplitProps<CreatePresenceProps>([
-      'present',
-      'lazyMount',
       'keepMounted',
+      'lazyMount',
+      'present',
     ])(props),
   );
 
   let presence = createPresence(reflect(() => createPresenceProps));
-
   let mergedProps = $derived(
     mergeProps<HTMLAttributes<HTMLDivElement>>(
       presence.getPresenceProps(),

package/dist/progress/progress-root.svelte

@@ -31,9 +31,10 @@
       'ids',
       'max',
       'min',
-      'value',
+      'onValueChange',
       'orientation',
       'translations',
+      'value',
     ])(props),
   );
 

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

@@ -1,4 +1,5 @@
 export * as QrCode from './qr-code.js';
+export type { QrCodeDownloadTriggerProps } from './qr-code-download-trigger.svelte';
 export type { QrCodeFrameProps } from './qr-code-frame.svelte';
 export type { QrCodeOverlayProps } from './qr-code-overlay.svelte';
 export type { QrCodePatternProps } from './qr-code-pattern.svelte';

package/dist/qr-code/qr-code-download-trigger.svelte

@@ -0,0 +1,45 @@
+<script lang="ts" module>
+  import type {DownloadTriggerProps} from '@zag-js/qr-code';
+  import type {Assign, HtmlIngredientProps} from '../types.js';
+
+  export interface QrCodeDownloadTriggerProps
+    extends Assign<
+      HtmlIngredientProps<'button', HTMLButtonElement>,
+      DownloadTriggerProps
+    > {}
+</script>
+
+<script lang="ts">
+  import {createSplitProps} from '../create-split-props.js';
+  import {mergeProps} from '@zag-js/svelte';
+  import {getQrCodeContext} from './qr-code-context.svelte.js';
+
+  let {
+    ref = $bindable(null),
+    asChild,
+    children,
+    ...props
+  }: QrCodeDownloadTriggerProps = $props();
+
+  let [downloadTriggerProps, localProps] = $derived(
+    createSplitProps<DownloadTriggerProps>(['fileName', 'mimeType', 'quality'])(
+      props,
+    ),
+  );
+
+  let qrCode = getQrCodeContext();
+  let mergedProps = $derived(
+    mergeProps(
+      qrCode.getDownloadTriggerProps(downloadTriggerProps),
+      localProps,
+    ),
+  );
+</script>
+
+{#if asChild}
+  {@render asChild(mergedProps)}
+{:else}
+  <button bind:this={ref} {...mergedProps}>
+    {@render children?.()}
+  </button>
+{/if}

package/dist/qr-code/qr-code-download-trigger.svelte.d.ts

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

package/dist/qr-code/qr-code-root.svelte

@@ -26,9 +26,13 @@
   }: QrCodeProps = $props();
 
   let [createQrCodeProps, localProps] = $derived(
-    createSplitProps<CreateQrCodeProps>(['id', 'ids', 'value', 'encoding'])(
-      props,
-    ),
+    createSplitProps<CreateQrCodeProps>([
+      'encoding',
+      'id',
+      'ids',
+      'onValueChange',
+      'value',
+    ])(props),
   );
 
   let qrCode = createQRCode(reflect(() => createQrCodeProps));

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

@@ -1,3 +1,4 @@
+export { default as DownloadTrigger } from './qr-code-download-trigger.svelte';
 export { default as Frame } from './qr-code-frame.svelte';
 export { default as Overlay } from './qr-code-overlay.svelte';
 export { default as Pattern } from './qr-code-pattern.svelte';

package/dist/qr-code/qr-code.js

@@ -1,3 +1,4 @@
+export { default as DownloadTrigger } from './qr-code-download-trigger.svelte';
 export { default as Frame } from './qr-code-frame.svelte';
 export { default as Overlay } from './qr-code-overlay.svelte';
 export { default as Pattern } from './qr-code-pattern.svelte';

package/dist/radio-group/radio-group-indicator.svelte

@@ -17,7 +17,6 @@
   }: RadioGroupIndicatorProps = $props();
 
   let radioGroup = getRadioGroupContext();
-
   let mergedProps = $derived(mergeProps(radioGroup.getIndicatorProps(), props));
 </script>
 

package/dist/radio-group/radio-group-item-control.svelte

@@ -21,7 +21,6 @@
 
   let radioGroup = getRadioGroupContext();
   let itemProps = getRadioGroupItemPropsContext();
-
   let mergedProps = $derived(
     mergeProps(radioGroup.getItemControlProps(itemProps), props),
   );

package/dist/radio-group/radio-group-item-hidden-input.svelte

@@ -20,7 +20,6 @@
 
   let radioGroup = getRadioGroupContext();
   let itemProps = getRadioGroupItemPropsContext();
-
   let mergedProps = $derived(
     mergeProps(radioGroup.getItemHiddenInputProps(itemProps), props),
   );

package/dist/radio-group/radio-group-item-text.svelte

@@ -21,7 +21,6 @@
 
   let radioGroup = getRadioGroupContext();
   let itemProps = getRadioGroupItemPropsContext();
-
   let mergedProps = $derived(
     mergeProps(radioGroup.getItemTextProps(itemProps), props),
   );

package/dist/radio-group/radio-group-item.svelte

@@ -24,14 +24,12 @@
     ...props
   }: RadioGroupItemProps = $props();
 
-  let radioGroup = getRadioGroupContext();
-
   let [itemProps, localProps] = $derived(
     createSplitProps<ItemProps>(['value', 'invalid', 'disabled'])(props),
   );
 
+  let radioGroup = getRadioGroupContext();
   let itemState = $derived(radioGroup.getItemState(itemProps));
-
   let mergedProps = $derived(
     mergeProps(radioGroup.getItemProps(itemProps), localProps),
   );

package/dist/radio-group/radio-group-label.svelte

@@ -17,7 +17,6 @@
   }: RadioGroupLabelProps = $props();
 
   let radioGroup = getRadioGroupContext();
-
   let mergedProps = $derived(mergeProps(radioGroup.getLabelProps(), props));
 </script>
 

package/dist/radio-group/radio-group-root.svelte

@@ -27,20 +27,19 @@
 
   let [createRadioGroupProps, localProps] = $derived(
     createSplitProps<CreateRadioGroupProps>([
+      'disabled',
+      'form',
       'id',
       'ids',
-      'form',
       'name',
-      'value',
-      'disabled',
-      'readOnly',
-      'orientation',
       'onValueChange',
+      'orientation',
+      'readOnly',
+      'value',
     ])(props),
   );
 
   let radioGroup = createRadioGroup(reflect(() => createRadioGroupProps));
-
   let mergedProps = $derived(mergeProps(radioGroup.getRootProps(), localProps));
 
   setRadioGroupContext(radioGroup);

package/dist/rating-group/rating-group-control.svelte

@@ -17,7 +17,6 @@
   }: RatingGroupControlProps = $props();
 
   let ratingGroup = getRatingGroupContext();
-
   let mergedProps = $derived(mergeProps(ratingGroup.getControlProps(), props));
 </script>
 

package/dist/rating-group/rating-group-hidden-input.svelte

@@ -16,7 +16,6 @@
   }: RatingGroupHiddenInputProps = $props();
 
   let radioGroup = getRatingGroupContext();
-
   let mergedProps = $derived(
     mergeProps(radioGroup.getHiddenInputProps(), props),
   );

package/dist/rating-group/rating-group-item.svelte

@@ -22,14 +22,9 @@
   }: RatingGroupItemProps = $props();
 
   let ratingGroup = getRatingGroupContext();
-
   let itemState = $derived(ratingGroup.getItemState({index}));
   let mergedProps = $derived(
-    mergeProps(
-      {'aria-checked': itemState.checked},
-      ratingGroup.getItemProps({index}),
-      props,
-    ),
+    mergeProps(ratingGroup.getItemProps({index}), props),
   );
 </script>
 

package/dist/rating-group/rating-group-label.svelte

@@ -17,7 +17,6 @@
   }: RatingGroupLabelProps = $props();
 
   let ratingGroup = getRatingGroupContext();
-
   let mergedProps = $derived(mergeProps(ratingGroup.getLabelProps(), props));
 </script>
 

package/dist/rating-group/rating-group-root.svelte

@@ -27,25 +27,24 @@
 
   let [createRatingGroupProps, localProps] = $derived(
     createSplitProps<CreateRatingGroupProps>([
+      'allowHalf',
+      'autoFocus',
+      'count',
+      'disabled',
+      'form',
       'id',
       'ids',
-      'form',
       'name',
-      'count',
-      'value',
-      'disabled',
+      'onHoverChange',
+      'onValueChange',
       'readOnly',
       'required',
-      'autoFocus',
-      'allowHalf',
       'translations',
-      'onHoverChange',
-      'onValueChange',
+      'value',
     ])(props),
   );
 
   let ratingGroup = createRatingGroup(reflect(() => createRatingGroupProps));
-
   let mergedProps = $derived(
     mergeProps(ratingGroup.getRootProps(), localProps),
   );

package/dist/segment-group/segment-group-indicator.svelte

@@ -17,7 +17,6 @@
   }: SegmentGroupIndicatorProps = $props();
 
   let segmentGroup = getSegmentGroupContext();
-
   let mergedProps = $derived(
     mergeProps(segmentGroup.getIndicatorProps(), props),
   );

package/dist/segment-group/segment-group-item-control.svelte

@@ -21,7 +21,6 @@
 
   let segmentGroup = getSegmentGroupContext();
   let itemProps = getSegmentGroupItemPropsContext();
-
   let mergedProps = $derived(
     mergeProps(segmentGroup.getItemControlProps(itemProps), props),
   );

package/dist/segment-group/segment-group-item-hidden-input.svelte

@@ -20,7 +20,6 @@
 
   let segmentGroup = getSegmentGroupContext();
   let itemProps = getSegmentGroupItemPropsContext();
-
   let mergedProps = $derived(
     mergeProps(segmentGroup.getItemHiddenInputProps(itemProps), props),
   );

package/dist/segment-group/segment-group-item-text.svelte

@@ -21,7 +21,6 @@
 
   let segmentGroup = getSegmentGroupContext();
   let itemProps = getSegmentGroupItemPropsContext();
-
   let mergedProps = $derived(
     mergeProps(segmentGroup.getItemTextProps(itemProps), props),
   );

package/dist/segment-group/segment-group-item.svelte

@@ -24,12 +24,11 @@
     ...props
   }: SegmentGroupItemProps = $props();
 
-  let segmentGroup = getSegmentGroupContext();
-
   let [itemProps, localProps] = $derived(
     createSplitProps<ItemProps>(['value', 'invalid', 'disabled'])(props),
   );
 
+  let segmentGroup = getSegmentGroupContext();
   let itemState = $derived(segmentGroup.getItemState(itemProps));
   let mergedProps = $derived(
     mergeProps(segmentGroup.getItemProps(itemProps), localProps),

package/dist/segment-group/segment-group-label.svelte

@@ -17,7 +17,6 @@
   }: SegmentGroupLabelProps = $props();
 
   let segmentGroup = getSegmentGroupContext();
-
   let mergedProps = $derived(mergeProps(segmentGroup.getLabelProps(), props));
 </script>
 

package/dist/segment-group/segment-group-root.svelte

@@ -27,20 +27,19 @@
 
   let [createSegmentGroupProps, localProps] = $derived(
     createSplitProps<CreateSegmentGroupProps>([
+      'disabled',
+      'form',
       'id',
       'ids',
-      'form',
       'name',
-      'value',
-      'disabled',
-      'readOnly',
-      'orientation',
       'onValueChange',
+      'orientation',
+      'readOnly',
+      'value',
     ])(props),
   );
 
   let segmentGroup = createSegmentGroup(reflect(() => createSegmentGroupProps));
-
   let mergedProps = $derived(
     mergeProps(segmentGroup.getRootProps(), localProps),
   );

package/dist/select/select-clear-trigger.svelte

@@ -17,7 +17,6 @@
   }: SelectClearTriggerProps = $props();
 
   let select = getSelectContext();
-
   let mergedProps = $derived(mergeProps(select.getClearTriggerProps(), props));
 </script>
 

package/dist/select/select-content.svelte

@@ -20,7 +20,6 @@
 
   let select = getSelectContext();
   let presence = getPresenceContext();
-
   let mergedProps = $derived(
     mergeProps(select.getContentProps(), presence.getPresenceProps(), props),
   );

package/dist/select/select-control.svelte

@@ -17,7 +17,6 @@
   }: SelectControlProps = $props();
 
   let select = getSelectContext();
-
   let mergedProps = $derived(mergeProps(select.getControlProps(), props));
 </script>
 

package/dist/select/select-hidden-select.svelte

@@ -17,7 +17,6 @@
   }: SelectHiddenSelectProps = $props();
 
   let select = getSelectContext();
-
   let mergedProps = $derived(mergeProps(select.getHiddenSelectProps(), props));
 </script>
 

package/dist/select/select-indicator.svelte

@@ -17,7 +17,6 @@
   }: SelectIndicatorProps = $props();
 
   let select = getSelectContext();
-
   let mergedProps = $derived(mergeProps(select.getIndicatorProps(), props));
 </script>
 

package/dist/select/select-item-group-label.svelte

@@ -20,9 +20,7 @@
   }: SelectItemGroupLabelProps = $props();
 
   let select = getSelectContext();
-
   let itemGroupProps = getSelectItemGroupPropsContext();
-
   let mergedProps = $derived(
     mergeProps(
       select.getItemGroupLabelProps({htmlFor: itemGroupProps.id}),

package/dist/select/select-item-group.svelte

@@ -23,12 +23,8 @@
 
   let select = getSelectContext();
 
-  let id_ = createUniqueId();
-
-  let itemGroupProps = $derived({
-    id: id ?? id_,
-  });
-
+  let uid = createUniqueId();
+  let itemGroupProps = $derived({id: id ?? uid});
   let mergedProps = $derived(
     mergeProps(select.getItemGroupProps(itemGroupProps), props),
   );

package/dist/select/select-item-indicator.svelte

@@ -21,7 +21,6 @@
 
   let select = getSelectContext();
   let itemProps = getSelectItemPropsContext();
-
   let mergedProps = $derived(
     mergeProps(select.getItemIndicatorProps(itemProps), props),
   );

package/dist/select/select-item-text.svelte

@@ -21,7 +21,6 @@
 
   let select = getSelectContext();
   let itemProps = getSelectItemPropsContext();
-
   let mergedProps = $derived(
     mergeProps(select.getItemTextProps(itemProps), props),
   );

package/dist/select/select-item.svelte

@@ -24,12 +24,11 @@
     ...props
   }: SelectItemProps = $props();
 
-  let select = getSelectContext();
-
   let [itemProps, localProps] = $derived(
     createSplitProps<ItemProps>(['item', 'persistFocus'])(props),
   );
 
+  let select = getSelectContext();
   let itemState = $derived(select.getItemState(itemProps));
   let mergedProps = $derived(
     mergeProps(select.getItemProps(itemProps), localProps),

package/dist/select/select-label.svelte

@@ -17,7 +17,6 @@
   }: SelectLabelProps = $props();
 
   let select = getSelectContext();
-
   let mergedProps = $derived(mergeProps(select.getLabelProps(), props));
 </script>
 

package/dist/select/select-list.svelte

@@ -17,7 +17,6 @@
   }: SelectListProps = $props();
 
   let select = getSelectContext();
-
   let mergedProps = $derived(mergeProps(select.getListProps(), props));
 </script>
 

package/dist/select/select-positioner.svelte

@@ -19,7 +19,6 @@
 
   let select = getSelectContext();
   let presence = getPresenceContext();
-
   let mergedProps = $derived(
     mergeProps(select.getPositionerProps(), presence.getPresenceProps(), props),
   );