ui-ingredients 0.0.64 → 0.0.66

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

@@ -8,12 +8,11 @@ export function createDialog(props) {
     const environment = getEnvironmentContext();
     const id = uid();
     const context = reflect(() => ({
-        ...props,
-        id: props.id ?? id,
+        id,
         dir: locale?.dir,
-        open: props.defaultOpen ?? props.open,
+        ...props,
         getRootNode: environment?.getRootNode,
-        'open.controlled': props.open != null,
+        'open.controlled': props.openControlled,
     }));
     const [state, send] = useMachine(dialog.machine(context), { context });
     return reflect(() => dialog.connect(state, send, normalizeProps));

package/dist/dialog/dialog-backdrop.svelte

@@ -30,7 +30,7 @@
   );
 
   let mergedProps = $derived(
-    mergeProps(props, dialog.getBackdropProps(), presence.getPresenceProps()),
+    mergeProps(dialog.getBackdropProps(), presence.getPresenceProps(), props),
   );
 </script>
 

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

@@ -18,7 +18,7 @@
 
   let dialog = getDialogContext();
 
-  let mergedProps = $derived(mergeProps(props, dialog.getCloseTriggerProps()));
+  let mergedProps = $derived(mergeProps(dialog.getCloseTriggerProps(), props));
 </script>
 
 {#if asChild}

package/dist/dialog/dialog-content.svelte

@@ -22,7 +22,7 @@
   let presence = getPresenceContext();
 
   let mergedProps = $derived(
-    mergeProps(props, dialog.getContentProps(), presence.getPresenceProps()),
+    mergeProps(dialog.getContentProps(), presence.getPresenceProps(), props),
   );
 </script>
 

package/dist/dialog/dialog-description.svelte

@@ -18,7 +18,7 @@
 
   let dialog = getDialogContext();
 
-  let mergedProps = $derived(mergeProps(props, dialog.getDescriptionProps()));
+  let mergedProps = $derived(mergeProps(dialog.getDescriptionProps(), props));
 </script>
 
 {#if asChild}

package/dist/dialog/dialog-positioner.svelte

@@ -21,7 +21,7 @@
   let presence = getPresenceContext();
 
   let mergedProps = $derived(
-    mergeProps(props, dialog.getPositionerProps(), presence.getPresenceProps()),
+    mergeProps(dialog.getPositionerProps(), presence.getPresenceProps(), props),
   );
 </script>
 

package/dist/dialog/dialog-title.svelte

@@ -18,7 +18,7 @@
 
   let dialog = getDialogContext();
 
-  let mergedProps = $derived(mergeProps(props, dialog.getTitleProps()));
+  let mergedProps = $derived(mergeProps(dialog.getTitleProps(), props));
 </script>
 
 {#if asChild}

package/dist/dialog/dialog-trigger.svelte

@@ -18,7 +18,7 @@
 
   let dialog = getDialogContext();
 
-  let mergedProps = $derived(mergeProps(props, dialog.getTriggerProps()));
+  let mergedProps = $derived(mergeProps(dialog.getTriggerProps(), props));
 </script>
 
 {#if asChild}

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

@@ -1,7 +1,7 @@
 import * as editable from '@zag-js/editable';
 export interface CreateEditableProps extends Omit<editable.Context, 'id' | 'dir' | 'getRootNode' | 'edit.controlled'> {
-    id?: string | null;
-    defaultEdit?: boolean;
+    id?: string;
+    editControlled?: boolean;
 }
 export interface CreateEditableReturn extends editable.Api {
 }

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

@@ -10,20 +10,19 @@ export function createEditable(props) {
     const environment = getEnvironmentContext();
     const id = uid();
     const context = reflect(() => ({
+        id,
         ids: {
             label: field?.ids.label,
             input: field?.ids.control,
         },
+        dir: locale?.dir,
         invalid: field?.invalid,
         disabled: field?.disabled,
         readOnly: field?.readOnly,
         required: field?.required,
         ...props,
-        id: props.id ?? id,
-        dir: locale?.dir,
-        edit: props.defaultEdit ?? props.edit,
         getRootNode: environment?.getRootNode,
-        'edit.controlled': props.edit != null,
+        'edit.controlled': props.editControlled,
     }));
     const [state, send] = useMachine(editable.machine(context), { context });
     return reflect(() => {

package/dist/editable/editable-area.svelte

@@ -18,7 +18,7 @@
 
   let editable = getEditableContext();
 
-  let mergedProps = $derived(mergeProps(props, editable.getAreaProps()));
+  let mergedProps = $derived(mergeProps(editable.getAreaProps(), props));
 </script>
 
 {#if asChild}

package/dist/editable/editable-cancel-trigger.svelte

@@ -19,7 +19,7 @@
   let editable = getEditableContext();
 
   let mergedProps = $derived(
-    mergeProps(props, editable.getCancelTriggerProps()),
+    mergeProps(editable.getCancelTriggerProps(), props),
   );
 </script>
 

package/dist/editable/editable-control.svelte

@@ -18,7 +18,7 @@
 
   let editable = getEditableContext();
 
-  let mergedProps = $derived(mergeProps(props, editable.getControlProps()));
+  let mergedProps = $derived(mergeProps(editable.getControlProps(), props));
 </script>
 
 {#if asChild}

package/dist/editable/editable-edit-trigger.svelte

@@ -18,7 +18,7 @@
 
   let editable = getEditableContext();
 
-  let mergedProps = $derived(mergeProps(props, editable.getEditTriggerProps()));
+  let mergedProps = $derived(mergeProps(editable.getEditTriggerProps(), props));
 </script>
 
 {#if asChild}

package/dist/editable/editable-input.svelte

@@ -13,7 +13,7 @@
 
   let editable = getEditableContext();
 
-  let mergedProps = $derived(mergeProps(props, editable.getInputProps()));
+  let mergedProps = $derived(mergeProps(editable.getInputProps(), props));
 </script>
 
 {#if asChild}

package/dist/editable/editable-label.svelte

@@ -18,7 +18,7 @@
 
   let editable = getEditableContext();
 
-  let mergedProps = $derived(mergeProps(props, editable.getLabelProps()));
+  let mergedProps = $derived(mergeProps(editable.getLabelProps(), props));
 </script>
 
 {#if asChild}

package/dist/editable/editable-preview.svelte

@@ -18,7 +18,7 @@
 
   let editable = getEditableContext();
 
-  let mergedProps = $derived(mergeProps(props, editable.getPreviewProps()));
+  let mergedProps = $derived(mergeProps(editable.getPreviewProps(), props));
 </script>
 
 {#if asChild}

package/dist/editable/editable-root.svelte

@@ -33,6 +33,7 @@
       'name',
       'form',
       'edit',
+      'editControlled',
       'value',
       'invalid',
       'readOnly',
@@ -41,7 +42,6 @@
       'maxLength',
       'submitMode',
       'autoResize',
-      'defaultEdit',
       'placeholder',
       'finalFocusEl',
       'translations',
@@ -59,7 +59,7 @@
 
   let editable = createEditable(reflect(() => createEditableProps));
 
-  let mergedProps = $derived(mergeProps(localProps, editable.getRootProps()));
+  let mergedProps = $derived(mergeProps(editable.getRootProps(), localProps));
 
   setEditableContext(editable);
 </script>

package/dist/editable/editable-submit-trigger.svelte

@@ -19,7 +19,7 @@
   let editable = getEditableContext();
 
   let mergedProps = $derived(
-    mergeProps(props, editable.getSubmitTriggerProps()),
+    mergeProps(editable.getSubmitTriggerProps(), props),
   );
 </script>
 

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

@@ -7,7 +7,7 @@ interface ElementIds {
     helperText?: string;
 }
 export interface CreateFieldProps {
-    id?: string | null;
+    id?: string;
     ids?: ElementIds;
     invalid?: boolean;
     required?: boolean;

package/dist/field/field-error-text.svelte

@@ -18,7 +18,7 @@
 
   let field = getFieldContext();
 
-  let mergedProps = $derived(mergeProps(props, field.getErrorTextProps()));
+  let mergedProps = $derived(mergeProps(field.getErrorTextProps(), props));
 </script>
 
 {#if asChild}

package/dist/field/field-helper-text.svelte

@@ -18,7 +18,7 @@
 
   let field = getFieldContext();
 
-  let mergedProps = $derived(mergeProps(props, field.getHelperTextProps()));
+  let mergedProps = $derived(mergeProps(field.getHelperTextProps(), props));
 </script>
 
 {#if asChild}

package/dist/field/field-input.svelte

@@ -13,7 +13,7 @@
 
   let field = getFieldContext();
 
-  let mergedProps = $derived(mergeProps(props, field.getInputProps()));
+  let mergedProps = $derived(mergeProps(field.getInputProps(), props));
 </script>
 
 {#if asChild}

package/dist/field/field-label.svelte

@@ -18,7 +18,7 @@
 
   let field = getFieldContext();
 
-  let mergedProps = $derived(mergeProps(props, field.getLabelProps()));
+  let mergedProps = $derived(mergeProps(field.getLabelProps(), props));
 </script>
 
 {#if asChild}

package/dist/field/field-root.svelte

@@ -39,7 +39,7 @@
 
   let field = createField(reflect(() => createFieldProps));
 
-  let mergedProps = $derived(mergeProps(localProps, field.getRootProps()));
+  let mergedProps = $derived(mergeProps(field.getRootProps(), localProps));
 
   setFieldContext(field);
 </script>

package/dist/field/field-select.svelte

@@ -18,7 +18,7 @@
 
   let field = getFieldContext();
 
-  let mergedProps = $derived(mergeProps(props, field.getSelectProps()));
+  let mergedProps = $derived(mergeProps(field.getSelectProps(), props));
 </script>
 
 {#if asChild}

package/dist/field/field-textarea.svelte

@@ -13,7 +13,7 @@
 
   let field = getFieldContext();
 
-  let mergedProps = $derived(mergeProps(props, field.getTextareaProps()));
+  let mergedProps = $derived(mergeProps(field.getTextareaProps(), props));
 </script>
 
 {#if asChild}

package/dist/file-upload/create-file-upload.svelte.d.ts

@@ -1,6 +1,6 @@
 import * as fileUpload from '@zag-js/file-upload';
 export interface CreateFileUploadProps extends Omit<fileUpload.Context, 'id' | 'dir' | 'getRootNode'> {
-    id?: string | null;
+    id?: string;
 }
 export interface CreateFileUploadReturn extends fileUpload.Api<any> {
 }

package/dist/file-upload/file-upload-clear-trigger.svelte

@@ -19,7 +19,7 @@
   let fileUpload = getFileUploadContext();
 
   let mergedProps = $derived(
-    mergeProps(props, fileUpload.getClearTriggerProps()),
+    mergeProps(fileUpload.getClearTriggerProps(), props),
   );
 </script>
 

package/dist/file-upload/file-upload-dropzone.svelte

@@ -18,7 +18,7 @@
 
   let fileUpload = getFileUploadContext();
 
-  let mergedProps = $derived(mergeProps(props, fileUpload.getDropzoneProps()));
+  let mergedProps = $derived(mergeProps(fileUpload.getDropzoneProps(), props));
 </script>
 
 {#if asChild}

package/dist/file-upload/file-upload-hidden-input.svelte

@@ -18,7 +18,7 @@
   let fileUpload = getFileUploadContext();
 
   let mergedProps = $derived(
-    mergeProps(props, fileUpload.getHiddenInputProps()),
+    mergeProps(fileUpload.getHiddenInputProps(), props),
   );
 </script>
 

package/dist/file-upload/file-upload-item-delete-trigger.svelte

@@ -23,7 +23,7 @@
   let itemProps = getFileUploadItemPropsContext();
 
   let mergedProps = $derived(
-    mergeProps(props, fileUpload.getItemDeleteTriggerProps(itemProps)),
+    mergeProps(fileUpload.getItemDeleteTriggerProps(itemProps), props),
   );
 </script>
 

package/dist/file-upload/file-upload-item-group.svelte

@@ -18,7 +18,7 @@
 
   let fileUpload = getFileUploadContext();
 
-  let mergedProps = $derived(mergeProps(props, fileUpload.getItemGroupProps()));
+  let mergedProps = $derived(mergeProps(fileUpload.getItemGroupProps(), props));
 </script>
 
 {#if asChild}

package/dist/file-upload/file-upload-item-name.svelte

@@ -23,7 +23,7 @@
   let itemProps = getFileUploadItemPropsContext();
 
   let mergedProps = $derived(
-    mergeProps(props, fileUpload.getItemNameProps(itemProps)),
+    mergeProps(fileUpload.getItemNameProps(itemProps), props),
   );
 </script>
 

package/dist/file-upload/file-upload-item-preview-image.svelte

@@ -24,7 +24,7 @@
   let itemProps = getFileUploadItemPropsContext();
 
   let mergedProps = $derived(
-    mergeProps(props, fileUpload.getItemPreviewImageProps({url, ...itemProps})),
+    mergeProps(fileUpload.getItemPreviewImageProps({url, ...itemProps}), props),
   );
 
   $effect(() => {

package/dist/file-upload/file-upload-item-preview.svelte

@@ -23,7 +23,7 @@
   let itemProps = getFileUploadItemPropsContext();
 
   let mergedProps = $derived(
-    mergeProps(props, fileUpload.getItemPreviewProps(itemProps)),
+    mergeProps(fileUpload.getItemPreviewProps(itemProps), props),
   );
 </script>
 

package/dist/file-upload/file-upload-item-size-text.svelte

@@ -23,7 +23,7 @@
   let itemProps = getFileUploadItemPropsContext();
 
   let mergedProps = $derived(
-    mergeProps(props, fileUpload.getItemSizeTextProps(itemProps)),
+    mergeProps(fileUpload.getItemSizeTextProps(itemProps), props),
   );
 </script>
 

package/dist/file-upload/file-upload-item.svelte

@@ -28,7 +28,7 @@
   );
 
   let mergedProps = $derived(
-    mergeProps(localProps, fileUpload.getItemProps(itemProps)),
+    mergeProps(fileUpload.getItemProps(itemProps), localProps),
   );
 
   setFileUploadItemPropsContext(() => itemProps);

package/dist/file-upload/file-upload-label.svelte

@@ -18,7 +18,7 @@
 
   let fileUpload = getFileUploadContext();
 
-  let mergedProps = $derived(mergeProps(props, fileUpload.getLabelProps()));
+  let mergedProps = $derived(mergeProps(fileUpload.getLabelProps(), props));
 </script>
 
 {#if asChild}

package/dist/file-upload/file-upload-root.svelte

@@ -52,7 +52,7 @@
 
   let fileUpload = createFileUpload(reflect(() => createFileUploadProps));
 
-  let mergedProps = $derived(mergeProps(localProps, fileUpload.getRootProps()));
+  let mergedProps = $derived(mergeProps(fileUpload.getRootProps(), localProps));
 
   setFileUploadContext(fileUpload);
 </script>

package/dist/file-upload/file-upload-trigger.svelte

@@ -18,7 +18,7 @@
 
   let fileUpload = getFileUploadContext();
 
-  let mergedProps = $derived(mergeProps(props, fileUpload.getTriggerProps()));
+  let mergedProps = $derived(mergeProps(fileUpload.getTriggerProps(), props));
 </script>
 
 {#if asChild}

package/dist/floating-panel/create-floating-panel.svelte.d.ts

@@ -1,6 +1,6 @@
 import * as floatingPanel from '@zag-js/floating-panel';
 export interface CreateFloatingPanelProps extends Omit<floatingPanel.Context, 'id' | 'dir' | 'getRootNode'> {
-    id?: string | null;
+    id?: string;
 }
 export interface CreateFloatingPanelReturn extends floatingPanel.Api<any> {
 }

package/dist/floating-panel/floating-panel-body.svelte

@@ -18,7 +18,7 @@
 
   let floatingPanel = getFloatingPanelContext();
 
-  let mergedProps = $derived(mergeProps(props, floatingPanel.getBodyProps()));
+  let mergedProps = $derived(mergeProps(floatingPanel.getBodyProps(), props));
 </script>
 
 {#if asChild}

package/dist/floating-panel/floating-panel-close-trigger.svelte

@@ -19,7 +19,7 @@
   let floatingPanel = getFloatingPanelContext();
 
   let mergedProps = $derived(
-    mergeProps(props, floatingPanel.getCloseTriggerProps()),
+    mergeProps(floatingPanel.getCloseTriggerProps(), props),
   );
 </script>
 

package/dist/floating-panel/floating-panel-content.svelte

@@ -23,9 +23,9 @@
 
   let mergedProps = $derived(
     mergeProps(
-      props,
       floatingPanel.getContentProps(),
       presence.getPresenceProps(),
+      props,
     ),
   );
 </script>

package/dist/floating-panel/floating-panel-drag-trigger.svelte

@@ -19,7 +19,7 @@
   let floatingPanel = getFloatingPanelContext();
 
   let mergedProps = $derived(
-    mergeProps(props, floatingPanel.getDragTriggerProps()),
+    mergeProps(floatingPanel.getDragTriggerProps(), props),
   );
 </script>
 

package/dist/floating-panel/floating-panel-header.svelte

@@ -18,7 +18,7 @@
 
   let floatingPanel = getFloatingPanelContext();
 
-  let mergedProps = $derived(mergeProps(props, floatingPanel.getHeaderProps()));
+  let mergedProps = $derived(mergeProps(floatingPanel.getHeaderProps(), props));
 </script>
 
 {#if asChild}

package/dist/floating-panel/floating-panel-maximize-trigger.svelte

@@ -19,7 +19,7 @@
   let floatingPanel = getFloatingPanelContext();
 
   let mergedProps = $derived(
-    mergeProps(props, floatingPanel.getMaximizeTriggerProps()),
+    mergeProps(floatingPanel.getMaximizeTriggerProps(), props),
   );
 </script>
 

package/dist/floating-panel/floating-panel-minimize-trigger.svelte

@@ -19,7 +19,7 @@
   let floatingPanel = getFloatingPanelContext();
 
   let mergedProps = $derived(
-    mergeProps(props, floatingPanel.getMinimizeTriggerProps()),
+    mergeProps(floatingPanel.getMinimizeTriggerProps(), props),
   );
 </script>
 

package/dist/floating-panel/floating-panel-positioner.svelte

@@ -22,9 +22,9 @@
 
   let mergedProps = $derived(
     mergeProps(
-      props,
       floatingPanel.getPositionerProps(),
       presence.getPresenceProps(),
+      props,
     ),
   );
 </script>

package/dist/floating-panel/floating-panel-resize-trigger.svelte

@@ -29,8 +29,8 @@
 
   let mergedProps = $derived(
     mergeProps(
-      localProps,
       floatingPanel.getResizeTriggerProps(resizeTriggerProps),
+      localProps,
     ),
   );
 </script>

package/dist/floating-panel/floating-panel-restore-trigger.svelte

@@ -19,7 +19,7 @@
   let floatingPanel = getFloatingPanelContext();
 
   let mergedProps = $derived(
-    mergeProps(props, floatingPanel.getRestoreTriggerProps()),
+    mergeProps(floatingPanel.getRestoreTriggerProps(), props),
   );
 </script>
 

package/dist/floating-panel/floating-panel-title.svelte

@@ -18,7 +18,7 @@
 
   let floatingPanel = getFloatingPanelContext();
 
-  let mergedProps = $derived(mergeProps(props, floatingPanel.getTitleProps()));
+  let mergedProps = $derived(mergeProps(floatingPanel.getTitleProps(), props));
 </script>
 
 {#if asChild}

package/dist/floating-panel/floating-panel-trigger.svelte

@@ -19,7 +19,7 @@
   let floatingPanel = getFloatingPanelContext();
 
   let mergedProps = $derived(
-    mergeProps(props, floatingPanel.getTriggerProps()),
+    mergeProps(floatingPanel.getTriggerProps(), props),
   );
 </script>
 

package/dist/hover-card/create-hover-card.svelte.d.ts

@@ -1,7 +1,7 @@
 import * as hoverCard from '@zag-js/hover-card';
 export interface CreateHoverCardProps extends Omit<hoverCard.Context, 'id' | 'dir' | 'getRootNode' | 'open.controlled'> {
-    id?: string | null;
-    defaultOpen?: boolean;
+    id?: string;
+    openControlled?: boolean;
 }
 export interface CreateHoverCardReturn extends hoverCard.Api {
 }

package/dist/hover-card/create-hover-card.svelte.js

@@ -8,12 +8,11 @@ export function createHoverCard(props) {
     const environment = getEnvironmentContext();
     const id = uid();
     const context = reflect(() => ({
-        ...props,
-        id: props.id ?? id,
+        id,
         dir: locale?.dir,
-        open: props.defaultOpen ?? props.open,
+        ...props,
         getRootNode: environment?.getRootNode,
-        'open.controlled': props.open != null,
+        'open.controlled': props.openControlled,
     }));
     const [state, send] = useMachine(hoverCard.machine(context), { context });
     return reflect(() => hoverCard.connect(state, send, normalizeProps));

package/dist/hover-card/hover-card-arrow-tip.svelte

@@ -18,7 +18,7 @@
 
   let hoverCard = getHoverCardContext();
 
-  let mergedProps = $derived(mergeProps(props, hoverCard.getArrowTipProps()));
+  let mergedProps = $derived(mergeProps(hoverCard.getArrowTipProps(), props));
 </script>
 
 {#if asChild}

package/dist/hover-card/hover-card-arrow.svelte

@@ -18,7 +18,7 @@
 
   let hoverCard = getHoverCardContext();
 
-  let mergedProps = $derived(mergeProps(props, hoverCard.getArrowProps()));
+  let mergedProps = $derived(mergeProps(hoverCard.getArrowProps(), props));
 </script>
 
 {#if asChild}