ui-ingredients 0.0.43 → 0.0.45

package/dist/number-input/create-number-input.svelte.js

@@ -9,7 +9,7 @@ export function createNumberInput(props) {
     const locale = getLocaleContext();
     const environment = getEnvironmentContext();
     const id = uid();
-    const context = $derived(reflect(() => ({
+    const context = reflect(() => ({
         ids: {
             label: field?.ids.label,
             input: field?.ids.control,
@@ -23,9 +23,9 @@ export function createNumberInput(props) {
         dir: locale?.dir,
         locale: props.locale ?? locale?.locale,
         getRootNode: environment?.getRootNode,
-    })));
+    }));
     const [state, send] = useMachine(numberInput.machine(context), { context });
-    const api = $derived(reflect(() => {
+    return reflect(() => {
         const o = numberInput.connect(state, send, normalizeProps);
         return {
             ...o,
@@ -36,6 +36,5 @@ export function createNumberInput(props) {
                 };
             },
         };
-    }));
-    return api;
+    });
 }

package/dist/number-input/root.svelte

@@ -21,7 +21,7 @@
 
   let {asChild, children, ...props}: NumberInputProps = $props();
 
-  let [numberInputProps, otherProps] = $derived(
+  let [numberInputProps, localProps] = $derived(
     createSplitProps<CreateNumberInputProps>([
       'id',
       'ids',
@@ -54,7 +54,7 @@
   let numberInput = createNumberInput(reflect(() => numberInputProps));
 
   let mergedProps = $derived(
-    mergeProps(otherProps, numberInput.getRootProps()),
+    mergeProps(localProps, numberInput.getRootProps()),
   );
 
   setNumberInputContext(numberInput);

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

@@ -7,13 +7,12 @@ export function createPagination(props) {
     const locale = getLocaleContext();
     const environment = getEnvironmentContext();
     const id = uid();
-    const context = $derived(reflect(() => ({
+    const context = reflect(() => ({
         ...props,
         id: props.id ?? id,
         dir: locale?.dir,
         getRootNode: environment?.getRootNode,
-    })));
+    }));
     const [state, send] = useMachine(pagination.machine(context), { context });
-    const api = $derived(reflect(() => pagination.connect(state, send, normalizeProps)));
-    return api;
+    return reflect(() => pagination.connect(state, send, normalizeProps));
 }

package/dist/pagination/root.svelte

@@ -21,7 +21,7 @@
 
   let {asChild, children, ...props}: PaginationProps = $props();
 
-  let [paginationProps, otherProps] = $derived(
+  let [paginationProps, localProps] = $derived(
     createSplitProps<CreatePaginationProps>([
       'id',
       'ids',
@@ -38,7 +38,7 @@
 
   let pagination = createPagination(reflect(() => paginationProps));
 
-  let mergedProps = $derived(mergeProps(otherProps, pagination.getRootProps()));
+  let mergedProps = $derived(mergeProps(localProps, pagination.getRootProps()));
 
   setPaginationContext(pagination);
 </script>

package/dist/pin-input/create-pin-input.svelte.js

@@ -9,7 +9,7 @@ export function createPinInputContext(props) {
     const locale = getLocaleContext();
     const environment = getEnvironmentContext();
     const id = uid();
-    const context = $derived(reflect(() => ({
+    const context = reflect(() => ({
         ids: {
             label: field?.ids.label,
             hiddenInput: field?.ids.control,
@@ -22,9 +22,9 @@ export function createPinInputContext(props) {
         id: props.id ?? id,
         dir: locale?.dir,
         getRootNode: environment?.getRootNode,
-    })));
+    }));
     const [state, send] = useMachine(pinInput.machine(context), { context });
-    const api = $derived(reflect(() => {
+    return reflect(() => {
         const o = pinInput.connect(state, send, normalizeProps);
         return {
             ...o,
@@ -42,6 +42,5 @@ export function createPinInputContext(props) {
                 };
             },
         };
-    }));
-    return api;
+    });
 }

package/dist/pin-input/root.svelte

@@ -21,7 +21,7 @@
 
   let {asChild, children, ...props}: PinInputProps = $props();
 
-  let [pinInputProps, otherProps] = $derived(
+  let [pinInputProps, localProps] = $derived(
     createSplitProps<CreatePinInputProps>([
       'id',
       'ids',
@@ -49,7 +49,7 @@
 
   let pinInput = createPinInputContext(reflect(() => pinInputProps));
 
-  let mergedProps = $derived(mergeProps(otherProps, pinInput.getRootProps()));
+  let mergedProps = $derived(mergeProps(localProps, pinInput.getRootProps()));
 
   setPinInputContext(pinInput);
 </script>

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

@@ -7,15 +7,14 @@ export function createPopover(props) {
     const locale = getLocaleContext();
     const environment = getEnvironmentContext();
     const id = uid();
-    const context = $derived(reflect(() => ({
+    const context = reflect(() => ({
         ...props,
         id: props.id ?? id,
         dir: locale?.dir,
         open: props.defaultOpen ?? props.open,
         getRootNode: environment?.getRootNode,
         'open.controlled': props.open != null,
-    })));
+    }));
     const [state, send] = useMachine(popover.machine(context), { context });
-    const api = $derived(reflect(() => popover.connect(state, send, normalizeProps)));
-    return api;
+    return reflect(() => popover.connect(state, send, normalizeProps));
 }

package/dist/popover/root.svelte

@@ -46,17 +46,12 @@
   );
 
   let popover = createPopover(reflect(() => popoverProps));
-  let presence = createPresence({
-    get present() {
-      return popover.open;
-    },
-    get lazyMount() {
-      return presenceStrategyProps.lazyMount;
-    },
-    get keepMounted() {
-      return presenceStrategyProps.keepMounted;
-    },
-  });
+  let presence = createPresence(
+    reflect(() => ({
+      ...presenceStrategyProps,
+      present: popover.open,
+    })),
+  );
 
   setPopoverContext(popover);
   setPresenceContext(presence);

package/dist/presence/root.svelte

@@ -18,14 +18,18 @@
 
   let {asChild, children, ...props}: PresenceProps = $props();
 
-  let [presenceProps, otherProps] = $derived(
-    createSplitProps<CreatePresenceProps>(['present'])(props),
+  let [presenceProps, localProps] = $derived(
+    createSplitProps<CreatePresenceProps>([
+      'present',
+      'lazyMount',
+      'keepMounted',
+    ])(props),
   );
 
   let presence = createPresence(reflect(() => presenceProps));
 
   let mergedProps = $derived(
-    mergeProps(otherProps, presence.getPresenceProps()),
+    mergeProps(localProps, presence.getPresenceProps()),
   );
 </script>
 

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

@@ -7,13 +7,12 @@ export function createProgress(props) {
     const locale = getLocaleContext();
     const environment = getEnvironmentContext();
     const id = uid();
-    const context = $derived(reflect(() => ({
+    const context = reflect(() => ({
         ...props,
         id: props.id ?? id,
         dir: locale?.dir,
         getRootNode: environment?.getRootNode,
-    })));
+    }));
     const [state, send] = useMachine(progress.machine(context), { context });
-    const api = $derived(reflect(() => progress.connect(state, send, normalizeProps)));
-    return api;
+    return reflect(() => progress.connect(state, send, normalizeProps));
 }

package/dist/progress/root.svelte

@@ -21,7 +21,7 @@
 
   let {asChild, children, ...props}: ProgressProps = $props();
 
-  let [progressProps, otherProps] = $derived(
+  let [progressProps, localProps] = $derived(
     createSplitProps<CreateProgressProps>([
       'id',
       'ids',
@@ -35,7 +35,7 @@
 
   let progress = createProgress(reflect(() => progressProps));
 
-  let mergedProps = $derived(mergeProps(otherProps, progress.getRootProps()));
+  let mergedProps = $derived(mergeProps(localProps, progress.getRootProps()));
 
   setProgressContext(progress);
 </script>

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

@@ -7,13 +7,12 @@ export function createQRCode(props) {
     const locale = getLocaleContext();
     const environment = getEnvironmentContext();
     const id = uid();
-    const context = $derived(reflect(() => ({
+    const context = reflect(() => ({
         ...props,
         id: props.id ?? id,
         dir: locale?.dir,
         getRootNode: environment?.getRootNode,
-    })));
+    }));
     const [state, send] = useMachine(qrCode.machine(context), { context });
-    const api = $derived(reflect(() => qrCode.connect(state, send, normalizeProps)));
-    return api;
+    return reflect(() => qrCode.connect(state, send, normalizeProps));
 }

package/dist/qr-code/root.svelte

@@ -21,7 +21,7 @@
 
   let {asChild, children, ...props}: QrCodeProps = $props();
 
-  let [qrCodeProps, otherProps] = $derived(
+  let [qrCodeProps, localProps] = $derived(
     createSplitProps<CreateQrCodeProps>(['id', 'ids', 'value', 'encoding'])(
       props,
     ),
@@ -29,7 +29,7 @@
 
   let qrCode = createQRCode(reflect(() => qrCodeProps));
 
-  let mergedProps = $derived(mergeProps(otherProps, qrCode.getRootProps()));
+  let mergedProps = $derived(mergeProps(localProps, qrCode.getRootProps()));
 
   setQrCodeContext(qrCode);
 </script>

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

@@ -7,13 +7,12 @@ export function createRadioGroup(props) {
     const locale = getLocaleContext();
     const environment = getEnvironmentContext();
     const id = uid();
-    const context = $derived(reflect(() => ({
+    const context = reflect(() => ({
         ...props,
         id: props.id ?? id,
         dir: locale?.dir,
         getRootNode: environment?.getRootNode,
-    })));
+    }));
     const [state, send] = useMachine(radioGroup.machine(context), { context });
-    const api = $derived(reflect(() => radioGroup.connect(state, send, normalizeProps)));
-    return api;
+    return reflect(() => radioGroup.connect(state, send, normalizeProps));
 }

package/dist/radio-group/item.svelte

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

package/dist/radio-group/root.svelte

@@ -21,7 +21,7 @@
 
   let {asChild, children, ...props}: RadioGroupProps = $props();
 
-  let [radioGroupProps, otherProps] = $derived(
+  let [radioGroupProps, localProps] = $derived(
     createSplitProps<CreateRadioGroupProps>([
       'id',
       'ids',
@@ -37,7 +37,7 @@
 
   let radioGroup = createRadioGroup(reflect(() => radioGroupProps));
 
-  let mergedProps = $derived(mergeProps(otherProps, radioGroup.getRootProps()));
+  let mergedProps = $derived(mergeProps(localProps, radioGroup.getRootProps()));
 
   setRadioGroupContext(radioGroup);
 </script>

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

@@ -9,7 +9,7 @@ export function createRatingGroup(props) {
     const locale = getLocaleContext();
     const environment = getEnvironmentContext();
     const id = uid();
-    const context = $derived(reflect(() => ({
+    const context = reflect(() => ({
         ids: {
             label: field?.ids.label,
             hiddenInput: field?.ids.control,
@@ -21,9 +21,9 @@ export function createRatingGroup(props) {
         id: props.id ?? id,
         dir: locale?.dir,
         getRootNode: environment?.getRootNode,
-    })));
+    }));
     const [state, send] = useMachine(ratingGroup.machine(context), { context });
-    const api = $derived(reflect(() => {
+    return reflect(() => {
         const o = ratingGroup.connect(state, send, normalizeProps);
         return {
             ...o,
@@ -34,6 +34,5 @@ export function createRatingGroup(props) {
                 };
             },
         };
-    }));
-    return api;
+    });
 }

package/dist/rating-group/root.svelte

@@ -21,7 +21,7 @@
 
   let {asChild, children, ...props}: RatingGroupProps = $props();
 
-  let [ratingGroupProps, otherProps] = $derived(
+  let [ratingGroupProps, localProps] = $derived(
     createSplitProps<CreateRatingGroupProps>([
       'id',
       'ids',
@@ -43,7 +43,7 @@
   let ratingGroup = createRatingGroup(reflect(() => ratingGroupProps));
 
   let mergedProps = $derived(
-    mergeProps(otherProps, ratingGroup.getRootProps()),
+    mergeProps(localProps, ratingGroup.getRootProps()),
   );
 
   setRatingGroupContext(ratingGroup);

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

@@ -7,13 +7,12 @@ export function createSegmentGroup(props) {
     const locale = getLocaleContext();
     const environment = getEnvironmentContext();
     const id = uid();
-    const context = $derived(reflect(() => ({
+    const context = reflect(() => ({
         ...props,
         id: props.id ?? id,
         dir: locale?.dir,
         getRootNode: environment?.getRootNode,
-    })));
+    }));
     const [state, send] = useMachine(segmentGroup.machine(context));
-    const api = $derived(reflect(() => segmentGroup.connect(state, send, normalizeProps)));
-    return api;
+    return reflect(() => segmentGroup.connect(state, send, normalizeProps));
 }

package/dist/segment-group/item.svelte

@@ -19,14 +19,14 @@
 
   let segmentGroup = getSegmentGroupContext();
 
-  let [itemProps, otherProps] = $derived(
+  let [itemProps, localProps] = $derived(
     createSplitProps<ItemProps>(['value', 'invalid', 'disabled'])(props),
   );
 
   let itemState = $derived(segmentGroup.getItemState(itemProps));
   let mergedProps = $derived(
     mergeProps(
-      otherProps,
+      localProps,
       segmentGroup.getItemProps(itemProps),
       parts.item.attrs,
     ),

package/dist/segment-group/root.svelte

@@ -22,7 +22,7 @@
 
   let {asChild, children, ...props}: SegmentGroupProps = $props();
 
-  let [segmentGroupProps, otherProps] = $derived(
+  let [segmentGroupProps, localProps] = $derived(
     createSplitProps<CreateSegmentGroupProps>([
       'id',
       'ids',
@@ -39,7 +39,7 @@
   let segmentGroup = createSegmentGroup(reflect(() => segmentGroupProps));
 
   let mergedProps = $derived(
-    mergeProps(otherProps, segmentGroup.getRootProps(), parts.root.attrs),
+    mergeProps(localProps, segmentGroup.getRootProps(), parts.root.attrs),
   );
 
   setSegmentGroupContext(segmentGroup);

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

@@ -35,7 +35,7 @@ export function createSelect(props) {
         collection,
     });
     const [state, send] = useMachine(select.machine(context));
-    const api = $derived(reflect(() => {
+    return reflect(() => {
         const o = select.connect(state, send, normalizeProps);
         return {
             ...o,
@@ -46,6 +46,5 @@ export function createSelect(props) {
                 };
             },
         };
-    }));
-    return api;
+    });
 }

package/dist/select/item.svelte

@@ -18,13 +18,13 @@
 
   let select = getSelectContext();
 
-  let [itemProps, otherProps] = $derived(
+  let [itemProps, localProps] = $derived(
     createSplitProps<ItemProps>(['item', 'persistFocus'])(props),
   );
 
   let itemState = $derived(select.getItemState(itemProps));
   let mergedProps = $derived(
-    mergeProps(otherProps, select.getItemProps(itemProps)),
+    mergeProps(localProps, select.getItemProps(itemProps)),
   );
 
   setSelectItemPropsContext(() => itemProps);

package/dist/select/root.svelte

@@ -25,7 +25,7 @@
 
   let {asChild, children, ...props}: SelectProps<T> = $props();
 
-  let [selectProps, otherProps] = $derived(
+  let [selectProps, rest] = $derived(
     createSplitProps<CreateSelectProps<T>>([
       'id',
       'ids',
@@ -58,27 +58,19 @@
     ])(props),
   );
 
-  let select = createSelect(reflect(() => selectProps));
-
-  let [presenceStrategyProps, elementProps] = $derived(
-    createSplitProps<PresenceStrategyProps>(['lazyMount', 'keepMounted'])(
-      otherProps,
-    ),
+  let [presenceStrategyProps, localProps] = $derived(
+    createSplitProps<PresenceStrategyProps>(['lazyMount', 'keepMounted'])(rest),
   );
 
-  let presence = createPresence({
-    get present() {
-      return select.open;
-    },
-    get lazyMount() {
-      return presenceStrategyProps.lazyMount;
-    },
-    get keepMounted() {
-      return presenceStrategyProps.keepMounted;
-    },
-  });
+  let select = createSelect(reflect(() => selectProps));
+  let presence = createPresence(
+    reflect(() => ({
+      ...presenceStrategyProps,
+      present: select.open,
+    })),
+  );
 
-  let mergedProps = $derived(mergeProps(elementProps, select.getRootProps()));
+  let mergedProps = $derived(mergeProps(localProps, select.getRootProps()));
 
   setSelectContext(select);
   setPresenceContext(presence);

package/dist/signature-pad/create-signature-pad.svelte.js

@@ -7,13 +7,12 @@ export function createSignaturePad(props) {
     const locale = getLocaleContext();
     const environment = getEnvironmentContext();
     const id = uid();
-    const context = $derived(reflect(() => ({
+    const context = reflect(() => ({
         ...props,
         id: props.id ?? id,
         dir: locale?.dir,
         getRootNode: environment?.getRootNode,
-    })));
+    }));
     const [state, send] = useMachine(signaturePad.machine(context), { context });
-    const api = $derived(reflect(() => signaturePad.connect(state, send, normalizeProps)));
-    return api;
+    return reflect(() => signaturePad.connect(state, send, normalizeProps));
 }

package/dist/signature-pad/root.svelte

@@ -21,7 +21,7 @@
 
   let {asChild, children, ...props}: SignaturePadProps = $props();
 
-  let [signaturePadProps, otherProps] = $derived(
+  let [signaturePadProps, localProps] = $derived(
     createSplitProps<CreateSignaturePadProps>([
       'id',
       'ids',
@@ -39,7 +39,7 @@
   let signaturePad = createSignaturePad(reflect(() => signaturePadProps));
 
   let mergedProps = $derived(
-    mergeProps(otherProps, signaturePad.getRootProps()),
+    mergeProps(localProps, signaturePad.getRootProps()),
   );
 
   setSignaturePadContext(signaturePad);

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

@@ -7,13 +7,12 @@ export function createSlider(props) {
     const locale = getLocaleContext();
     const environment = getEnvironmentContext();
     const id = uid();
-    const context = $derived(reflect(() => ({
+    const context = reflect(() => ({
         ...props,
         id: props.id ?? id,
         dir: locale?.dir,
         getRootNode: environment?.getRootNode,
-    })));
+    }));
     const [state, send] = useMachine(slider.machine(context), { context });
-    const api = $derived(reflect(() => slider.connect(state, send, normalizeProps)));
-    return api;
+    return reflect(() => slider.connect(state, send, normalizeProps));
 }

package/dist/slider/root.svelte

@@ -21,7 +21,7 @@
 
   let {asChild, children, ...props}: SliderProps = $props();
 
-  let [sliderProps, otherProps] = $derived(
+  let [sliderProps, localProps] = $derived(
     createSplitProps<CreateSliderProps>([
       'id',
       'ids',
@@ -50,7 +50,7 @@
 
   let slider = createSlider(reflect(() => sliderProps));
 
-  let mergedProps = $derived(mergeProps(otherProps, slider.getRootProps()));
+  let mergedProps = $derived(mergeProps(localProps, slider.getRootProps()));
 
   setSliderContext(slider);
 </script>

package/dist/slider/thumb.svelte

@@ -18,12 +18,12 @@
 
   let slider = getSliderContext();
 
-  let [thumbProps, otherProps] = $derived(
+  let [thumbProps, localProps] = $derived(
     createSplitProps<ThumbProps>(['name', 'index'])(props),
   );
 
   let mergedProps = $derived(
-    mergeProps(otherProps, slider.getThumbProps(thumbProps)),
+    mergeProps(localProps, slider.getThumbProps(thumbProps)),
   );
 
   setSliderThumbPropsContext(() => thumbProps);

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

@@ -6,13 +6,12 @@ import { uid } from 'uid';
 export function createSplitter(props) {
     const locale = getLocaleContext();
     const environment = getEnvironmentContext();
-    const context = $derived(reflect(() => ({
+    const context = reflect(() => ({
         ...props,
         id: props.id ?? uid(),
         dir: locale?.dir,
         getRootNode: environment?.getRootNode,
-    })));
+    }));
     const [state, send] = useMachine(splitter.machine(context), { context });
-    const api = $derived(reflect(() => splitter.connect(state, send, normalizeProps)));
-    return api;
+    return reflect(() => splitter.connect(state, send, normalizeProps));
 }

package/dist/splitter/panel.svelte

@@ -15,12 +15,12 @@
 
   let splitter = getSplitterContext();
 
-  let [panelProps, otherProps] = $derived(
+  let [panelProps, localProps] = $derived(
     createSplitProps<PanelProps>(['id', 'snapSize'])(props),
   );
 
   let mergedProps = $derived(
-    mergeProps(otherProps, splitter.getPanelProps(panelProps)),
+    mergeProps(localProps, splitter.getPanelProps(panelProps)),
   );
 </script>
 

package/dist/splitter/resize-trigger.svelte

@@ -27,14 +27,14 @@
 
   let splitter = getSplitterContext();
 
-  let [resizeTriggerProps, otherProps] = $derived(
+  let [resizeTriggerProps, localProps] = $derived(
     createSplitProps<ResizeTriggerProps>(['id', 'step', 'disabled'])(props),
   );
 
   let itemState = $derived(splitter.getResizeTriggerState(resizeTriggerProps));
 
   let mergedProps = $derived(
-    mergeProps(otherProps, splitter.getResizeTriggerProps(resizeTriggerProps)),
+    mergeProps(localProps, splitter.getResizeTriggerProps(resizeTriggerProps)),
   );
 </script>