ui-ingredients 0.0.61 → 0.0.63

package/dist/number-input/number-input-root.svelte

@@ -19,7 +19,12 @@
   import {createNumberInput} from './create-number-input.svelte.js';
   import {setNumberInputContext} from './number-input-context.svelte.js';
 
-  let {this: e, asChild, children, ...props}: NumberInputProps = $props();
+  let {
+    ref = $bindable(null),
+    asChild,
+    children,
+    ...props
+  }: NumberInputProps = $props();
 
   let [createNumberInputProps, localProps] = $derived(
     createSplitProps<CreateNumberInputProps>([
@@ -63,7 +68,7 @@
 {#if asChild}
   {@render asChild(mergedProps, numberInput)}
 {:else}
-  <div bind:this={e} {...mergedProps}>
+  <div bind:this={ref} {...mergedProps}>
     {@render children?.(numberInput)}
   </div>
 {/if}

package/dist/number-input/number-input-root.svelte.d.ts

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

package/dist/number-input/number-input-scrubber.svelte

@@ -10,7 +10,7 @@
   import {getNumberInputContext} from './number-input-context.svelte.js';
 
   let {
-    this: e,
+    ref = $bindable(null),
     asChild,
     children,
     ...props
@@ -24,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/number-input/number-input-scrubber.svelte.d.ts

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

package/dist/pagination/pagination-ellipsis.svelte

@@ -14,7 +14,7 @@
   import {getPaginationContext} from './pagination-context.svelte.js';
 
   let {
-    this: e,
+    ref = $bindable(null),
     index,
     asChild,
     children,
@@ -31,7 +31,7 @@
 {#if asChild}
   {@render asChild(mergedProps)}
 {:else}
-  <span bind:this={e} {...mergedProps}>
+  <span bind:this={ref} {...mergedProps}>
     {@render children?.()}
   </span>
 {/if}

package/dist/pagination/pagination-ellipsis.svelte.d.ts

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

package/dist/pagination/pagination-item.svelte

@@ -14,7 +14,7 @@
   import {getPaginationContext} from './pagination-context.svelte.js';
 
   let {
-    this: e,
+    ref = $bindable(null),
     value,
     asChild,
     children,
@@ -37,7 +37,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/pagination/pagination-item.svelte.d.ts

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

package/dist/pagination/pagination-next-trigger.svelte

@@ -10,7 +10,7 @@
   import {getPaginationContext} from './pagination-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/pagination/pagination-next-trigger.svelte.d.ts

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

package/dist/pagination/pagination-prev-trigger.svelte

@@ -10,7 +10,7 @@
   import {getPaginationContext} from './pagination-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/pagination/pagination-prev-trigger.svelte.d.ts

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

package/dist/pagination/pagination-root.svelte

@@ -19,7 +19,12 @@
   import {createPagination} from './create-pagination.svelte.js';
   import {setPaginationContext} from './pagination-context.svelte.js';
 
-  let {this: e, asChild, children, ...props}: PaginationProps = $props();
+  let {
+    ref = $bindable(null),
+    asChild,
+    children,
+    ...props
+  }: PaginationProps = $props();
 
   let [createPaginationProps, localProps] = $derived(
     createSplitProps<CreatePaginationProps>([
@@ -46,7 +51,7 @@
 {#if asChild}
   {@render asChild(mergedProps, pagination)}
 {:else}
-  <div bind:this={e} {...mergedProps}>
+  <div bind:this={ref} {...mergedProps}>
     {@render children?.(pagination)}
   </div>
 {/if}

package/dist/pagination/pagination-root.svelte.d.ts

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

package/dist/pin-input/pin-input-clear-trigger.svelte

@@ -11,7 +11,7 @@
   import {getPinInputContext} from './pin-input-context.svelte.js';
 
   let {
-    this: e,
+    ref = $bindable(null),
     asChild,
     children,
     ...props
@@ -31,7 +31,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/pin-input/pin-input-clear-trigger.svelte.d.ts

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

package/dist/pin-input/pin-input-hidden-input.svelte

@@ -9,7 +9,11 @@
   import {mergeProps} from '../merge-props.js';
   import {getPinInputContext} from './pin-input-context.svelte.js';
 
-  let {this: e, asChild, ...props}: PinInputHiddenInputProps = $props();
+  let {
+    ref = $bindable(null),
+    asChild,
+    ...props
+  }: PinInputHiddenInputProps = $props();
 
   let pinInput = getPinInputContext();
 
@@ -19,5 +23,5 @@
 {#if asChild}
   {@render asChild(mergedProps)}
 {:else}
-  <input bind:this={e} {...mergedProps} />
+  <input bind:this={ref} {...mergedProps} />
 {/if}

package/dist/pin-input/pin-input-hidden-input.svelte.d.ts

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

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

@@ -13,7 +13,12 @@
   import {mergeProps} from '../merge-props.js';
   import {getPinInputContext} from './pin-input-context.svelte.js';
 
-  let {this: e, index, asChild, ...props}: PinInputInputProps = $props();
+  let {
+    ref = $bindable(null),
+    index,
+    asChild,
+    ...props
+  }: PinInputInputProps = $props();
 
   let pinInput = getPinInputContext();
 
@@ -25,5 +30,5 @@
 {#if asChild}
   {@render asChild(mergedProps)}
 {:else}
-  <input bind:this={e} {...mergedProps} />
+  <input bind:this={ref} {...mergedProps} />
 {/if}

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

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

package/dist/pin-input/pin-input-label.svelte

@@ -9,7 +9,12 @@
   import {mergeProps} from '../merge-props.js';
   import {getPinInputContext} from './pin-input-context.svelte.js';
 
-  let {this: e, asChild, children, ...props}: PinInputLabelProps = $props();
+  let {
+    ref = $bindable(null),
+    asChild,
+    children,
+    ...props
+  }: PinInputLabelProps = $props();
 
   let pinInput = getPinInputContext();
 
@@ -19,7 +24,7 @@
 {#if asChild}
   {@render asChild(mergedProps)}
 {:else}
-  <label bind:this={e} {...mergedProps}>
+  <label bind:this={ref} {...mergedProps}>
     {@render children?.()}
   </label>
 {/if}

package/dist/pin-input/pin-input-label.svelte.d.ts

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

package/dist/pin-input/pin-input-root.svelte

@@ -19,7 +19,12 @@
   import {createPinInputContext} from './create-pin-input.svelte.js';
   import {setPinInputContext} from './pin-input-context.svelte.js';
 
-  let {this: e, asChild, children, ...props}: PinInputProps = $props();
+  let {
+    ref = $bindable(null),
+    asChild,
+    children,
+    ...props
+  }: PinInputProps = $props();
 
   let [createPinInputProps, localProps] = $derived(
     createSplitProps<CreatePinInputProps>([
@@ -57,7 +62,7 @@
 {#if asChild}
   {@render asChild(mergedProps, pinInput)}
 {:else}
-  <div bind:this={e} {...mergedProps}>
+  <div bind:this={ref} {...mergedProps}>
     {@render children?.(pinInput)}
   </div>
 {/if}

package/dist/pin-input/pin-input-root.svelte.d.ts

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

package/dist/popover/popover-arrow-tip.svelte

@@ -9,7 +9,12 @@
   import {mergeProps} from '../merge-props.js';
   import {getPopoverContext} from './popover-context.svelte.js';
 
-  let {this: e, asChild, children, ...props}: PopoverArrowTipProps = $props();
+  let {
+    ref = $bindable(null),
+    asChild,
+    children,
+    ...props
+  }: PopoverArrowTipProps = $props();
 
   let popover = getPopoverContext();
 
@@ -19,7 +24,7 @@
 {#if asChild}
   {@render asChild(mergedProps)}
 {:else}
-  <span bind:this={e} {...mergedProps}>
+  <span bind:this={ref} {...mergedProps}>
     {@render children?.()}
   </span>
 {/if}

package/dist/popover/popover-arrow-tip.svelte.d.ts

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

package/dist/popover/popover-arrow.svelte

@@ -9,7 +9,12 @@
   import {mergeProps} from '../merge-props.js';
   import {getPopoverContext} from './popover-context.svelte.js';
 
-  let {this: e, asChild, children, ...props}: PopoverArrowProps = $props();
+  let {
+    ref = $bindable(null),
+    asChild,
+    children,
+    ...props
+  }: PopoverArrowProps = $props();
 
   let popover = getPopoverContext();
 
@@ -19,7 +24,7 @@
 {#if asChild}
   {@render asChild(mergedProps)}
 {:else}
-  <span bind:this={e} {...mergedProps}>
+  <span bind:this={ref} {...mergedProps}>
     {@render children?.()}
   </span>
 {/if}

package/dist/popover/popover-arrow.svelte.d.ts

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

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

@@ -10,7 +10,7 @@
   import {getPopoverContext} from './popover-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/popover/popover-close-trigger.svelte.d.ts

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

package/dist/popover/popover-content.svelte

@@ -11,7 +11,12 @@
   import {getPresenceContext} from '../presence/presence-context.svelte.js';
   import {getPopoverContext} from './popover-context.svelte.js';
 
-  let {this: e, asChild, children, ...props}: PopoverContentProps = $props();
+  let {
+    ref = $bindable(null),
+    asChild,
+    children,
+    ...props
+  }: PopoverContentProps = $props();
 
   let popover = getPopoverContext();
   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/popover/popover-content.svelte.d.ts

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

package/dist/popover/popover-description.svelte

@@ -10,7 +10,7 @@
   import {getPopoverContext} from './popover-context.svelte.js';
 
   let {
-    this: e,
+    ref = $bindable(null),
     asChild,
     children,
     ...props
@@ -24,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/popover/popover-description.svelte.d.ts

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

package/dist/popover/popover-positioner.svelte

@@ -10,7 +10,12 @@
   import {getPresenceContext} from '../presence/presence-context.svelte.js';
   import {getPopoverContext} from './popover-context.svelte.js';
 
-  let {this: e, asChild, children, ...props}: PopoverPositionerProps = $props();
+  let {
+    ref = $bindable(null),
+    asChild,
+    children,
+    ...props
+  }: PopoverPositionerProps = $props();
 
   let popover = getPopoverContext();
   let presence = getPresenceContext();
@@ -28,7 +33,7 @@
   {#if asChild}
     {@render asChild(mergedProps)}
   {:else}
-    <div bind:this={e} {...mergedProps}>
+    <div bind:this={ref} {...mergedProps}>
       {@render children?.()}
     </div>
   {/if}

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

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

package/dist/popover/popover-title.svelte

@@ -9,7 +9,12 @@
   import {mergeProps} from '../merge-props.js';
   import {getPopoverContext} from './popover-context.svelte.js';
 
-  let {this: e, asChild, children, ...props}: PopoverTitleProps = $props();
+  let {
+    ref = $bindable(null),
+    asChild,
+    children,
+    ...props
+  }: PopoverTitleProps = $props();
 
   let popover = getPopoverContext();
 
@@ -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/popover/popover-title.svelte.d.ts

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

package/dist/popover/popover-trigger.svelte

@@ -9,7 +9,12 @@
   import {mergeProps} from '../merge-props.js';
   import {getPopoverContext} from './popover-context.svelte.js';
 
-  let {this: e, asChild, children, ...props}: PopoverTriggerProps = $props();
+  let {
+    ref = $bindable(null),
+    asChild,
+    children,
+    ...props
+  }: PopoverTriggerProps = $props();
 
   let popover = getPopoverContext();
 
@@ -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/popover/popover-trigger.svelte.d.ts

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

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

@@ -9,10 +9,9 @@ export interface PresenceStrategyProps {
 export interface CreatePresenceProps extends PresenceStrategyProps {
     present: boolean;
 }
-export interface CreatePresenceReturn extends ReturnType<typeof createPresence> {
-}
-export declare function createPresence(props: CreatePresenceProps): {
-    ref: Action<HTMLElement, undefined, Record<never, any>>;
+export interface CreatePresenceReturn {
+    ref: Action;
     getPresenceProps: () => HTMLAttributes<HTMLElement>;
-    readonly mounted: boolean;
-};
+    mounted: boolean;
+}
+export declare function createPresence(props: CreatePresenceProps): CreatePresenceReturn;

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

@@ -10,7 +10,7 @@
   import {getProgressContext} from './progress-context.svelte.js';
 
   let {
-    this: e,
+    ref = $bindable(null),
     asChild,
     children,
     ...props
@@ -24,7 +24,7 @@
 {#if asChild}
   {@render asChild(mergedProps)}
 {:else}
-  <circle bind:this={e} {...mergedProps}>
+  <circle bind:this={ref} {...mergedProps}>
     {@render children?.()}
   </circle>
 {/if}

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

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