ui-ingredients 0.0.40 → 0.0.41

package/dist/accordion/item-content.svelte

@@ -1,8 +1,9 @@
 <script lang="ts" module>
   import type {HtmlIngredientProps} from '../types.js';
+  import type {Action} from 'svelte/action';
 
   export interface AccordionItemContentProps
-    extends HtmlIngredientProps<'div'> {}
+    extends HtmlIngredientProps<'div', never, Action> {}
 </script>
 
 <script lang="ts">
@@ -34,7 +35,7 @@
 </script>
 
 {#if asChild}
-  {@render asChild(mergedProps)}
+  {@render asChild(presence.ref, mergedProps)}
 {:else}
   <div use:presence.ref {...mergedProps}>
     {@render children?.()}

package/dist/color-picker/content.svelte

@@ -1,7 +1,9 @@
 <script lang="ts" module>
   import type {HtmlIngredientProps} from '../types.js';
+  import type {Action} from 'svelte/action';
 
-  export interface ColorPickerContentProps extends HtmlIngredientProps<'div'> {}
+  export interface ColorPickerContentProps
+    extends HtmlIngredientProps<'div', never, Action> {}
 </script>
 
 <script lang="ts">

package/dist/combobox/content.svelte

@@ -1,7 +1,9 @@
 <script lang="ts" module>
   import type {HtmlIngredientProps} from '../types.js';
+  import type {Action} from 'svelte/action';
 
-  export interface ComboboxContentProps extends HtmlIngredientProps<'div'> {}
+  export interface ComboboxContentProps
+    extends HtmlIngredientProps<'div', never, Action> {}
 </script>
 
 <script lang="ts">
@@ -20,7 +22,7 @@
 </script>
 
 {#if asChild}
-  {@render asChild(mergedProps)}
+  {@render asChild(presence.ref, mergedProps)}
 {:else}
   <div use:presence.ref {...mergedProps}>
     {@render children?.()}

package/dist/date-picker/content.svelte

@@ -1,7 +1,9 @@
 <script lang="ts" module>
   import type {HtmlIngredientProps} from '../types.js';
+  import type {Action} from 'svelte/action';
 
-  export interface DatePickerContentProps extends HtmlIngredientProps<'div'> {}
+  export interface DatePickerContentProps
+    extends HtmlIngredientProps<'div', never, Action> {}
 </script>
 
 <script lang="ts">
@@ -24,7 +26,7 @@
 </script>
 
 {#if asChild}
-  {@render asChild(mergedProps)}
+  {@render asChild(presence.ref, mergedProps)}
 {:else}
   <div use:presence.ref {...mergedProps}>
     {@render children?.()}

package/dist/dialog/backdrop.svelte

@@ -1,7 +1,9 @@
 <script lang="ts" module>
   import type {HtmlIngredientProps} from '../types.js';
+  import type {Action} from 'svelte/action';
 
-  export interface DialogBackdropProps extends HtmlIngredientProps<'div'> {}
+  export interface DialogBackdropProps
+    extends HtmlIngredientProps<'div', never, Action> {}
 </script>
 
 <script lang="ts">
@@ -24,7 +26,7 @@
 </script>
 
 {#if asChild}
-  {@render asChild(mergedProps)}
+  {@render asChild(presence.ref, mergedProps)}
 {:else}
   <div use:presence.ref {...mergedProps}>
     {@render children?.()}

package/dist/dialog/content.svelte

@@ -1,7 +1,9 @@
 <script lang="ts" module>
   import type {HtmlIngredientProps} from '../types.js';
+  import type {Action} from 'svelte/action';
 
-  export interface DialogContentProps extends HtmlIngredientProps<'div'> {}
+  export interface DialogContentProps
+    extends HtmlIngredientProps<'div', never, Action> {}
 </script>
 
 <script lang="ts">
@@ -20,7 +22,7 @@
 </script>
 
 {#if asChild}
-  {@render asChild(mergedProps)}
+  {@render asChild(presence.ref, mergedProps)}
 {:else}
   <div use:presence.ref {...mergedProps}>
     {@render children?.()}

package/dist/hover-card/content.svelte

@@ -1,7 +1,9 @@
 <script lang="ts" module>
   import type {HtmlIngredientProps} from '../types.js';
+  import type {Action} from 'svelte/action';
 
-  export interface HoverCardContentProps extends HtmlIngredientProps<'div'> {}
+  export interface HoverCardContentProps
+    extends HtmlIngredientProps<'div', never, Action> {}
 </script>
 
 <script lang="ts">
@@ -20,7 +22,7 @@
 </script>
 
 {#if asChild}
-  {@render asChild(mergedProps)}
+  {@render asChild(presence.ref, mergedProps)}
 {:else}
   <div use:presence.ref {...mergedProps}>
     {@render children?.()}

package/dist/menu/content.svelte

@@ -1,7 +1,9 @@
 <script lang="ts" module>
   import type {HtmlIngredientProps} from '../types.js';
+  import type {Action} from 'svelte/action';
 
-  export interface MenuContentProps extends HtmlIngredientProps<'div'> {}
+  export interface MenuContentProps
+    extends HtmlIngredientProps<'div', never, Action> {}
 </script>
 
 <script lang="ts">
@@ -20,7 +22,7 @@
 </script>
 
 {#if asChild}
-  {@render asChild(mergedProps)}
+  {@render asChild(presence.ref, mergedProps)}
 {:else}
   <div use:presence.ref {...mergedProps}>
     {@render children?.()}

package/dist/popover/content.svelte

@@ -1,7 +1,9 @@
 <script lang="ts" module>
   import type {HtmlIngredientProps} from '../types.js';
+  import type {Action} from 'svelte/action';
 
-  export interface PopoverContentProps extends HtmlIngredientProps<'div'> {}
+  export interface PopoverContentProps
+    extends HtmlIngredientProps<'div', never, Action> {}
 </script>
 
 <script lang="ts">
@@ -20,7 +22,7 @@
 </script>
 
 {#if asChild}
-  {@render asChild(mergedProps)}
+  {@render asChild(presence.ref, mergedProps)}
 {:else}
   <div use:presence.ref {...mergedProps}>
     {@render children?.()}

package/dist/select/content.svelte

@@ -1,7 +1,9 @@
 <script lang="ts" module>
   import type {HtmlIngredientProps} from '../types.js';
+  import type {Action} from 'svelte/action';
 
-  export interface SelectContentProps extends HtmlIngredientProps<'div'> {}
+  export interface SelectContentProps
+    extends HtmlIngredientProps<'div', never, Action> {}
 </script>
 
 <script lang="ts">
@@ -20,7 +22,7 @@
 </script>
 
 {#if asChild}
-  {@render asChild(mergedProps)}
+  {@render asChild(presence.ref, mergedProps)}
 {:else}
   <div use:presence.ref {...mergedProps}>
     {@render children?.()}

package/dist/tooltip/content.svelte

@@ -1,7 +1,9 @@
 <script lang="ts" module>
   import type {HtmlIngredientProps} from '../types.js';
+  import type {Action} from 'svelte/action';
 
-  export interface TooltipContentProps extends HtmlIngredientProps<'div'> {}
+  export interface TooltipContentProps
+    extends HtmlIngredientProps<'div', never, Action> {}
 </script>
 
 <script lang="ts">
@@ -20,7 +22,7 @@
 </script>
 
 {#if asChild}
-  {@render asChild(mergedProps)}
+  {@render asChild(presence.ref, mergedProps)}
 {:else}
   <div use:presence.ref {...mergedProps}>
     {@render children?.()}

package/dist/types.d.ts

@@ -1,4 +1,5 @@
 import type { Snippet } from 'svelte';
+import type { Action } from 'svelte/action';
 import type { SvelteHTMLElements } from 'svelte/elements';
 import type { TransitionConfig } from 'svelte/transition';
 export type GenericObject = Record<string, any>;
@@ -13,10 +14,14 @@ export interface TransitionProps {
     out?: TransitionFunction;
     transition?: TransitionFunction;
 }
-export type AsChild<Context = never> = [Context] extends [never] ? Snippet<[attrs: GenericObject]> : Snippet<[attrs: GenericObject, context: Context]>;
+export type AsChildWithRef<Ref extends Action, Context = never> = [
+    Context
+] extends [never] ? Snippet<[ref: Ref, attrs: GenericObject]> : Snippet<[ref: Ref, attrs: GenericObject, context: Context]>;
+export type AsChildWithoutRef<Context = never> = [Context] extends [never] ? Snippet<[attrs: GenericObject]> : Snippet<[attrs: GenericObject, context: Context]>;
+export type AsChild<Ref extends Action, Context = never> = [Ref] extends [never] ? AsChildWithoutRef<Context> : AsChildWithRef<Ref, Context>;
 export type Children<T = never> = [T] extends [never] ? Snippet : Snippet<[context: T]>;
 export type PropsWithoutChildren<T> = Omit<T, 'children'>;
-export type HtmlIngredientProps<T extends IntrinsicElements, Context = never> = TransitionProps & PropsWithoutChildren<HtmlProps<T>> & {
-    asChild?: AsChild<Context>;
+export type HtmlIngredientProps<Element extends IntrinsicElements, Context = never, Ref extends Action = never> = TransitionProps & PropsWithoutChildren<HtmlProps<Element>> & {
     children?: Children<Context>;
+    asChild?: AsChild<Ref, Context>;
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "ui-ingredients",
   "type": "module",
-  "version": "0.0.40",
+  "version": "0.0.41",
   "packageManager": "pnpm@9.7.0",
   "svelte": "./dist/index.js",
   "types": "./dist/index.d.ts",