ui-ingredients 0.0.62 → 0.0.64

package/dist/date-picker/date-picker-view-control.svelte

@@ -1,4 +1,4 @@
-<script lang="ts" context="module">
+<script lang="ts" module>
   import type {HtmlIngredientProps} from '../types.js';
 
   export interface DatePickerViewControlProps
@@ -13,7 +13,7 @@
   } from './date-picker-context.svelte.js';
 
   let {
-    this: e,
+    ref = $bindable(null),
     asChild,
     children,
     ...props
@@ -30,7 +30,7 @@
 {#if asChild}
   {@render asChild(mergedProps)}
 {:else}
-  <div bind:this={e} {...mergedProps}>
+  <div bind:this={ref} {...mergedProps}>
     {@render children?.()}
   </div>
 {/if}

package/dist/date-picker/date-picker-view-control.svelte.d.ts

@@ -16,6 +16,6 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
 }
 declare const DatePickerViewControl: $$__sveltets_2_IsomorphicComponent<DatePickerViewControlProps, {
     [evt: string]: CustomEvent<any>;
-}, {}, {}, "">;
+}, {}, {}, "ref">;
 type DatePickerViewControl = InstanceType<typeof DatePickerViewControl>;
 export default DatePickerViewControl;

package/dist/date-picker/date-picker-view-trigger.svelte

@@ -1,4 +1,4 @@
-<script lang="ts" context="module">
+<script lang="ts" module>
   import type {HtmlIngredientProps} from '../types.js';
 
   export interface DatePickerViewTriggerProps
@@ -13,7 +13,7 @@
   } from './date-picker-context.svelte.js';
 
   let {
-    this: e,
+    ref = $bindable(null),
     asChild,
     children,
     ...props
@@ -30,7 +30,7 @@
 {#if asChild}
   {@render asChild(mergedProps)}
 {:else}
-  <button bind:this={e} type="button" {...mergedProps}>
+  <button bind:this={ref} type="button" {...mergedProps}>
     {@render children?.()}
   </button>
 {/if}

package/dist/date-picker/date-picker-view-trigger.svelte.d.ts

@@ -16,6 +16,6 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
 }
 declare const DatePickerViewTrigger: $$__sveltets_2_IsomorphicComponent<DatePickerViewTriggerProps, {
     [evt: string]: CustomEvent<any>;
-}, {}, {}, "">;
+}, {}, {}, "ref">;
 type DatePickerViewTrigger = InstanceType<typeof DatePickerViewTrigger>;
 export default DatePickerViewTrigger;

package/dist/date-picker/date-picker-view.svelte

@@ -1,4 +1,4 @@
-<script lang="ts" context="module">
+<script lang="ts" module>
   import type {Assign, HtmlIngredientProps} from '../types.js';
   import type {ViewProps} from '@zag-js/date-picker';
 
@@ -15,7 +15,7 @@
 
   let {
     view = 'day',
-    this: e,
+    ref = $bindable(null),
     asChild,
     children,
     ...props
@@ -35,7 +35,7 @@
 {#if asChild}
   {@render asChild(mergedProps)}
 {:else}
-  <div bind:this={e} {...mergedProps}>
+  <div bind:this={ref} {...mergedProps}>
     {@render children?.()}
   </div>
 {/if}

package/dist/date-picker/date-picker-view.svelte.d.ts

@@ -17,6 +17,6 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
 }
 declare const DatePickerView: $$__sveltets_2_IsomorphicComponent<DatePickerViewProps, {
     [evt: string]: CustomEvent<any>;
-}, {}, {}, "">;
+}, {}, {}, "ref">;
 type DatePickerView = InstanceType<typeof DatePickerView>;
 export default DatePickerView;

package/dist/date-picker/date-picker-year-select.svelte

@@ -1,4 +1,4 @@
-<script lang="ts" context="module">
+<script lang="ts" module>
   import type {HtmlIngredientProps} from '../types.js';
 
   export interface DatePickerYearSelectProps
@@ -10,7 +10,7 @@
   import {getDatePickerContext} from './date-picker-context.svelte.js';
 
   let {
-    this: e,
+    ref = $bindable(null),
     asChild,
     children,
     ...props
@@ -26,7 +26,7 @@
 {#if asChild}
   {@render asChild(mergedProps)}
 {:else}
-  <select bind:this={e} {...mergedProps}>
+  <select bind:this={ref} {...mergedProps}>
     {#if children}
       {@render children()}
     {:else}

package/dist/date-picker/date-picker-year-select.svelte.d.ts

@@ -16,6 +16,6 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
 }
 declare const DatePickerYearSelect: $$__sveltets_2_IsomorphicComponent<DatePickerYearSelectProps, {
     [evt: string]: CustomEvent<any>;
-}, {}, {}, "">;
+}, {}, {}, "ref">;
 type DatePickerYearSelect = InstanceType<typeof DatePickerYearSelect>;
 export default DatePickerYearSelect;

package/dist/date-picker/date-picker-year-table-cell-trigger.svelte

@@ -1,4 +1,4 @@
-<script lang="ts" context="module">
+<script lang="ts" module>
   import type {HtmlIngredientProps} from '../types.js';
 
   export interface DatePickerYearTableCellTriggerProps
@@ -13,7 +13,7 @@
   } from './date-picker-context.svelte.js';
 
   let {
-    this: e,
+    ref = $bindable(null),
     asChild,
     children,
     ...props
@@ -30,7 +30,7 @@
 {#if asChild}
   {@render asChild(mergedProps)}
 {:else}
-  <button bind:this={e} type="button" {...mergedProps}>
+  <button bind:this={ref} type="button" {...mergedProps}>
     {@render children?.()}
   </button>
 {/if}

package/dist/date-picker/date-picker-year-table-cell-trigger.svelte.d.ts

@@ -16,6 +16,6 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
 }
 declare const DatePickerYearTableCellTrigger: $$__sveltets_2_IsomorphicComponent<DatePickerYearTableCellTriggerProps, {
     [evt: string]: CustomEvent<any>;
-}, {}, {}, "">;
+}, {}, {}, "ref">;
 type DatePickerYearTableCellTrigger = InstanceType<typeof DatePickerYearTableCellTrigger>;
 export default DatePickerYearTableCellTrigger;

package/dist/date-picker/date-picker-year-table-cell.svelte

@@ -1,4 +1,4 @@
-<script lang="ts" context="module">
+<script lang="ts" module>
   import type {Assign, HtmlIngredientProps} from '../types.js';
   import type {TableCellProps, TableCellState} from '@zag-js/date-picker';
 
@@ -18,7 +18,7 @@
   } from './date-picker-context.svelte.js';
 
   let {
-    this: e,
+    ref = $bindable(null),
     asChild,
     children,
     ...props
@@ -44,7 +44,7 @@
 {#if asChild}
   {@render asChild(mergedProps, tableCellState)}
 {:else}
-  <td bind:this={e} {...mergedProps}>
+  <td bind:this={ref} {...mergedProps}>
     {@render children?.(tableCellState)}
   </td>
 {/if}

package/dist/date-picker/date-picker-year-table-cell.svelte.d.ts

@@ -17,6 +17,6 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
 }
 declare const DatePickerYearTableCell: $$__sveltets_2_IsomorphicComponent<DatePickerYearTableCellProps, {
     [evt: string]: CustomEvent<any>;
-}, {}, {}, "">;
+}, {}, {}, "ref">;
 type DatePickerYearTableCell = InstanceType<typeof DatePickerYearTableCell>;
 export default DatePickerYearTableCell;

package/dist/dialog/dialog-backdrop.svelte

@@ -1,4 +1,4 @@
-<script lang="ts" context="module">
+<script lang="ts" module>
   import type {HtmlIngredientProps} from '../types.js';
   import type {Action} from 'svelte/action';
 
@@ -13,7 +13,12 @@
   import {reflect} from '@zag-js/svelte';
   import {getDialogContext} from './dialog-context.svelte.js';
 
-  let {this: e, asChild, children, ...props}: DialogBackdropProps = $props();
+  let {
+    ref = $bindable(null),
+    asChild,
+    children,
+    ...props
+  }: DialogBackdropProps = $props();
 
   let dialog = getDialogContext();
   let presenceStrategyProps = getPresenceStrategyPropsContext();
@@ -33,7 +38,7 @@
   {#if asChild}
     {@render asChild(presence.ref, mergedProps)}
   {:else}
-    <div bind:this={e} use:presence.ref {...mergedProps}>
+    <div bind:this={ref} use:presence.ref {...mergedProps}>
       {@render children?.()}
     </div>
   {/if}

package/dist/dialog/dialog-backdrop.svelte.d.ts

@@ -17,6 +17,6 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
 }
 declare const DialogBackdrop: $$__sveltets_2_IsomorphicComponent<DialogBackdropProps, {
     [evt: string]: CustomEvent<any>;
-}, {}, {}, "">;
+}, {}, {}, "ref">;
 type DialogBackdrop = InstanceType<typeof DialogBackdrop>;
 export default DialogBackdrop;

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

@@ -1,4 +1,4 @@
-<script lang="ts" context="module">
+<script lang="ts" module>
   import type {HtmlIngredientProps} from '../types.js';
 
   export interface DialogCloseTriggerProps
@@ -10,7 +10,7 @@
   import {getDialogContext} from './dialog-context.svelte.js';
 
   let {
-    this: e,
+    ref = $bindable(null),
     asChild,
     children,
     ...props
@@ -24,7 +24,7 @@
 {#if asChild}
   {@render asChild(mergedProps)}
 {:else}
-  <button bind:this={e} type="button" {...mergedProps}>
+  <button bind:this={ref} type="button" {...mergedProps}>
     {@render children?.()}
   </button>
 {/if}

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

@@ -16,6 +16,6 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
 }
 declare const DialogCloseTrigger: $$__sveltets_2_IsomorphicComponent<DialogCloseTriggerProps, {
     [evt: string]: CustomEvent<any>;
-}, {}, {}, "">;
+}, {}, {}, "ref">;
 type DialogCloseTrigger = InstanceType<typeof DialogCloseTrigger>;
 export default DialogCloseTrigger;

package/dist/dialog/dialog-content.svelte

@@ -1,4 +1,4 @@
-<script lang="ts" context="module">
+<script lang="ts" module>
   import type {HtmlIngredientProps} from '../types.js';
   import type {Action} from 'svelte/action';
 
@@ -11,7 +11,12 @@
   import {getPresenceContext} from '../presence/presence-context.svelte.js';
   import {getDialogContext} from './dialog-context.svelte.js';
 
-  let {this: e, asChild, children, ...props}: DialogContentProps = $props();
+  let {
+    ref = $bindable(null),
+    asChild,
+    children,
+    ...props
+  }: DialogContentProps = $props();
 
   let dialog = getDialogContext();
   let presence = getPresenceContext();
@@ -25,7 +30,7 @@
   {#if asChild}
     {@render asChild(presence.ref, mergedProps)}
   {:else}
-    <div bind:this={e} use:presence.ref {...mergedProps}>
+    <div bind:this={ref} use:presence.ref {...mergedProps}>
       {@render children?.()}
     </div>
   {/if}

package/dist/dialog/dialog-content.svelte.d.ts

@@ -17,6 +17,6 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
 }
 declare const DialogContent: $$__sveltets_2_IsomorphicComponent<DialogContentProps, {
     [evt: string]: CustomEvent<any>;
-}, {}, {}, "">;
+}, {}, {}, "ref">;
 type DialogContent = InstanceType<typeof DialogContent>;
 export default DialogContent;

package/dist/dialog/dialog-description.svelte

@@ -1,4 +1,4 @@
-<script lang="ts" context="module">
+<script lang="ts" module>
   import type {HtmlIngredientProps} from '../types.js';
 
   export interface DialogDescriptionProps
@@ -9,7 +9,12 @@
   import {mergeProps} from '../merge-props.js';
   import {getDialogContext} from './dialog-context.svelte.js';
 
-  let {this: e, asChild, children, ...props}: DialogDescriptionProps = $props();
+  let {
+    ref = $bindable(null),
+    asChild,
+    children,
+    ...props
+  }: DialogDescriptionProps = $props();
 
   let dialog = getDialogContext();
 
@@ -19,7 +24,7 @@
 {#if asChild}
   {@render asChild(mergedProps)}
 {:else}
-  <p bind:this={e} {...mergedProps}>
+  <p bind:this={ref} {...mergedProps}>
     {@render children?.()}
   </p>
 {/if}

package/dist/dialog/dialog-description.svelte.d.ts

@@ -16,6 +16,6 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
 }
 declare const DialogDescription: $$__sveltets_2_IsomorphicComponent<DialogDescriptionProps, {
     [evt: string]: CustomEvent<any>;
-}, {}, {}, "">;
+}, {}, {}, "ref">;
 type DialogDescription = InstanceType<typeof DialogDescription>;
 export default DialogDescription;

package/dist/dialog/dialog-positioner.svelte

@@ -1,4 +1,4 @@
-<script lang="ts" context="module">
+<script lang="ts" module>
   import type {HtmlIngredientProps} from '../types.js';
 
   export interface DialogPositionerProps
@@ -10,7 +10,12 @@
   import {getPresenceContext} from '../presence/presence-context.svelte.js';
   import {getDialogContext} from './dialog-context.svelte.js';
 
-  let {this: e, asChild, children, ...props}: DialogPositionerProps = $props();
+  let {
+    ref = $bindable(null),
+    asChild,
+    children,
+    ...props
+  }: DialogPositionerProps = $props();
 
   let dialog = getDialogContext();
   let presence = getPresenceContext();
@@ -24,7 +29,7 @@
   {#if asChild}
     {@render asChild(mergedProps)}
   {:else}
-    <div bind:this={e} {...mergedProps}>
+    <div bind:this={ref} {...mergedProps}>
       {@render children?.()}
     </div>
   {/if}

package/dist/dialog/dialog-positioner.svelte.d.ts

@@ -16,6 +16,6 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
 }
 declare const DialogPositioner: $$__sveltets_2_IsomorphicComponent<DialogPositionerProps, {
     [evt: string]: CustomEvent<any>;
-}, {}, {}, "">;
+}, {}, {}, "ref">;
 type DialogPositioner = InstanceType<typeof DialogPositioner>;
 export default DialogPositioner;

package/dist/dialog/dialog-root.svelte

@@ -1,4 +1,4 @@
-<script lang="ts" context="module">
+<script lang="ts" module>
   import type {PresenceStrategyProps} from '../presence/create-presence.svelte.js';
   import type {Snippet} from 'svelte';
   import type {

package/dist/dialog/dialog-title.svelte

@@ -1,4 +1,4 @@
-<script lang="ts" context="module">
+<script lang="ts" module>
   import type {HtmlIngredientProps} from '../types.js';
 
   export interface DialogTitleProps
@@ -9,7 +9,12 @@
   import {mergeProps} from '../merge-props.js';
   import {getDialogContext} from './dialog-context.svelte.js';
 
-  let {this: e, asChild, children, ...props}: DialogTitleProps = $props();
+  let {
+    ref = $bindable(null),
+    asChild,
+    children,
+    ...props
+  }: DialogTitleProps = $props();
 
   let dialog = getDialogContext();
 
@@ -19,7 +24,7 @@
 {#if asChild}
   {@render asChild(mergedProps)}
 {:else}
-  <h2 bind:this={e} {...mergedProps}>
+  <h2 bind:this={ref} {...mergedProps}>
     {@render children?.()}
   </h2>
 {/if}

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

@@ -16,6 +16,6 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
 }
 declare const DialogTitle: $$__sveltets_2_IsomorphicComponent<DialogTitleProps, {
     [evt: string]: CustomEvent<any>;
-}, {}, {}, "">;
+}, {}, {}, "ref">;
 type DialogTitle = InstanceType<typeof DialogTitle>;
 export default DialogTitle;

package/dist/dialog/dialog-trigger.svelte

@@ -1,4 +1,4 @@
-<script lang="ts" context="module">
+<script lang="ts" module>
   import type {HtmlIngredientProps} from '../types.js';
 
   export interface DialogTriggerProps
@@ -9,7 +9,12 @@
   import {mergeProps} from '../merge-props.js';
   import {getDialogContext} from './dialog-context.svelte.js';
 
-  let {this: e, asChild, children, ...props}: DialogTriggerProps = $props();
+  let {
+    ref = $bindable(null),
+    asChild,
+    children,
+    ...props
+  }: DialogTriggerProps = $props();
 
   let dialog = getDialogContext();
 
@@ -19,7 +24,7 @@
 {#if asChild}
   {@render asChild(mergedProps)}
 {:else}
-  <button bind:this={e} type="button" {...mergedProps}>
+  <button bind:this={ref} type="button" {...mergedProps}>
     {@render children?.()}
   </button>
 {/if}

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

@@ -16,6 +16,6 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
 }
 declare const DialogTrigger: $$__sveltets_2_IsomorphicComponent<DialogTriggerProps, {
     [evt: string]: CustomEvent<any>;
-}, {}, {}, "">;
+}, {}, {}, "ref">;
 type DialogTrigger = InstanceType<typeof DialogTrigger>;
 export default DialogTrigger;

package/dist/editable/editable-area.svelte

@@ -1,4 +1,4 @@
-<script lang="ts" context="module">
+<script lang="ts" module>
   import type {HtmlIngredientProps} from '../types.js';
 
   export interface EditableAreaProps
@@ -9,7 +9,12 @@
   import {mergeProps} from '../merge-props.js';
   import {getEditableContext} from './editable-context.svelte.js';
 
-  let {this: e, asChild, children, ...props}: EditableAreaProps = $props();
+  let {
+    ref = $bindable(null),
+    asChild,
+    children,
+    ...props
+  }: EditableAreaProps = $props();
 
   let editable = getEditableContext();
 
@@ -19,7 +24,7 @@
 {#if asChild}
   {@render asChild(mergedProps)}
 {:else}
-  <div bind:this={e} {...mergedProps}>
+  <div bind:this={ref} {...mergedProps}>
     {@render children?.()}
   </div>
 {/if}

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

@@ -16,6 +16,6 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
 }
 declare const EditableArea: $$__sveltets_2_IsomorphicComponent<EditableAreaProps, {
     [evt: string]: CustomEvent<any>;
-}, {}, {}, "">;
+}, {}, {}, "ref">;
 type EditableArea = InstanceType<typeof EditableArea>;
 export default EditableArea;

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

@@ -1,4 +1,4 @@
-<script lang="ts" context="module">
+<script lang="ts" module>
   import type {HtmlIngredientProps} from '../types.js';
 
   export interface EditableCancelTriggerProps
@@ -10,7 +10,7 @@
   import {getEditableContext} from './editable-context.svelte.js';
 
   let {
-    this: e,
+    ref = $bindable(null),
     asChild,
     children,
     ...props
@@ -26,7 +26,7 @@
 {#if asChild}
   {@render asChild(mergedProps)}
 {:else}
-  <button bind:this={e} type="button" {...mergedProps}>
+  <button bind:this={ref} type="button" {...mergedProps}>
     {@render children?.()}
   </button>
 {/if}

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

@@ -16,6 +16,6 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
 }
 declare const EditableCancelTrigger: $$__sveltets_2_IsomorphicComponent<EditableCancelTriggerProps, {
     [evt: string]: CustomEvent<any>;
-}, {}, {}, "">;
+}, {}, {}, "ref">;
 type EditableCancelTrigger = InstanceType<typeof EditableCancelTrigger>;
 export default EditableCancelTrigger;

package/dist/editable/editable-control.svelte

@@ -1,4 +1,4 @@
-<script lang="ts" context="module">
+<script lang="ts" module>
   import type {HtmlIngredientProps} from '../types.js';
 
   export interface EditableControlProps
@@ -9,7 +9,12 @@
   import {mergeProps} from '../merge-props.js';
   import {getEditableContext} from './editable-context.svelte.js';
 
-  let {this: e, asChild, children, ...props}: EditableControlProps = $props();
+  let {
+    ref = $bindable(null),
+    asChild,
+    children,
+    ...props
+  }: EditableControlProps = $props();
 
   let editable = getEditableContext();
 
@@ -19,7 +24,7 @@
 {#if asChild}
   {@render asChild(mergedProps)}
 {:else}
-  <div bind:this={e} {...mergedProps}>
+  <div bind:this={ref} {...mergedProps}>
     {@render children?.()}
   </div>
 {/if}

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

@@ -16,6 +16,6 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
 }
 declare const EditableControl: $$__sveltets_2_IsomorphicComponent<EditableControlProps, {
     [evt: string]: CustomEvent<any>;
-}, {}, {}, "">;
+}, {}, {}, "ref">;
 type EditableControl = InstanceType<typeof EditableControl>;
 export default EditableControl;

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

@@ -1,4 +1,4 @@
-<script lang="ts" context="module">
+<script lang="ts" module>
   import type {HtmlIngredientProps} from '../types.js';
 
   export interface EditableEditTriggerProps
@@ -10,7 +10,7 @@
   import {getEditableContext} from './editable-context.svelte.js';
 
   let {
-    this: e,
+    ref = $bindable(null),
     asChild,
     children,
     ...props
@@ -24,7 +24,7 @@
 {#if asChild}
   {@render asChild(mergedProps)}
 {:else}
-  <button bind:this={e} type="button" {...mergedProps}>
+  <button bind:this={ref} type="button" {...mergedProps}>
     {@render children?.()}
   </button>
 {/if}

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

@@ -16,6 +16,6 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
 }
 declare const EditableEditTrigger: $$__sveltets_2_IsomorphicComponent<EditableEditTriggerProps, {
     [evt: string]: CustomEvent<any>;
-}, {}, {}, "">;
+}, {}, {}, "ref">;
 type EditableEditTrigger = InstanceType<typeof EditableEditTrigger>;
 export default EditableEditTrigger;

package/dist/editable/editable-input.svelte

@@ -1,4 +1,4 @@
-<script lang="ts" context="module">
+<script lang="ts" module>
   import type {HtmlIngredientProps} from '../types.js';
 
   export interface EditableInputProps
@@ -9,7 +9,7 @@
   import {mergeProps} from '../merge-props.js';
   import {getEditableContext} from './editable-context.svelte.js';
 
-  let {this: e, asChild, ...props}: EditableInputProps = $props();
+  let {ref = $bindable(null), asChild, ...props}: EditableInputProps = $props();
 
   let editable = getEditableContext();
 
@@ -19,5 +19,5 @@
 {#if asChild}
   {@render asChild(mergedProps)}
 {:else}
-  <input bind:this={e} {...mergedProps} />
+  <input bind:this={ref} {...mergedProps} />
 {/if}

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

@@ -16,6 +16,6 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
 }
 declare const EditableInput: $$__sveltets_2_IsomorphicComponent<EditableInputProps, {
     [evt: string]: CustomEvent<any>;
-}, {}, {}, "">;
+}, {}, {}, "ref">;
 type EditableInput = InstanceType<typeof EditableInput>;
 export default EditableInput;