ui-ingredients 0.0.26 → 0.0.27

package/dist/popover/trigger.svelte

@@ -1,9 +1,8 @@
 <script lang="ts" module>
-  import type {HtmlProps} from '../types.js';
-  import type {Snippet} from 'svelte';
+  import type {AsChild, HtmlProps} from '../types.js';
 
   export interface PopoverTriggerProps extends HtmlProps<'button'> {
-    asChild?: Snippet<[attrs: Omit<HtmlProps<'button'>, 'children'>]>;
+    asChild?: AsChild<HtmlProps<'button'>>;
   }
 </script>
 

package/dist/progress/circle-range.svelte

@@ -1,9 +1,8 @@
 <script lang="ts" module>
-  import type {HtmlProps} from '../types.js';
-  import type {Snippet} from 'svelte';
+  import type {AsChild, HtmlProps} from '../types.js';
 
   export interface ProgressCircleRangeProps extends HtmlProps<'circle'> {
-    asChild?: Snippet<[attrs: Omit<HtmlProps<'circle'>, 'children'>]>;
+    asChild?: AsChild<HtmlProps<'circle'>>;
   }
 </script>
 

package/dist/progress/circle-track.svelte

@@ -1,9 +1,8 @@
 <script lang="ts" module>
-  import type {HtmlProps} from '../types.js';
-  import type {Snippet} from 'svelte';
+  import type {AsChild, HtmlProps} from '../types.js';
 
   export interface ProgressCircleTrackProps extends HtmlProps<'circle'> {
-    asChild?: Snippet<[attrs: Omit<HtmlProps<'circle'>, 'children'>]>;
+    asChild?: AsChild<HtmlProps<'circle'>>;
   }
 </script>
 

package/dist/progress/circle.svelte

@@ -1,9 +1,8 @@
 <script lang="ts" module>
-  import type {HtmlProps} from '../types.js';
-  import type {Snippet} from 'svelte';
+  import type {AsChild, HtmlProps} from '../types.js';
 
   export interface ProgressCircleProps extends HtmlProps<'svg'> {
-    asChild?: Snippet<[attrs: Omit<HtmlProps<'svg'>, 'children'>]>;
+    asChild?: AsChild<HtmlProps<'svg'>>;
   }
 </script>
 

package/dist/progress/label.svelte

@@ -1,9 +1,8 @@
 <script lang="ts" module>
-  import type {GenericHtmlProps, HtmlProps} from '../types.js';
-  import type {Snippet} from 'svelte';
+  import type {AsChild, HtmlProps} from '../types.js';
 
-  export interface ProgressLabelProps extends HtmlProps<'div'> {
-    asChild?: Snippet<[attrs: Omit<GenericHtmlProps, 'children'>]>;
+  export interface ProgressLabelProps extends HtmlProps<'span'> {
+    asChild?: AsChild;
   }
 </script>
 
@@ -21,7 +20,7 @@
 {#if asChild}
   {@render asChild(attrs)}
 {:else}
-  <div {...attrs}>
+  <span {...attrs}>
     {@render children?.()}
-  </div>
+  </span>
 {/if}

package/dist/progress/range.svelte

@@ -1,9 +1,8 @@
 <script lang="ts" module>
-  import type {GenericHtmlProps, HtmlProps} from '../types.js';
-  import type {Snippet} from 'svelte';
+  import type {AsChild, HtmlProps} from '../types.js';
 
   export interface ProgressRangeProps extends HtmlProps<'div'> {
-    asChild?: Snippet<[attrs: Omit<GenericHtmlProps, 'children'>]>;
+    asChild?: AsChild;
   }
 </script>
 

package/dist/progress/root.svelte

@@ -1,11 +1,11 @@
 <script lang="ts" module>
-  import type {Assign, GenericHtmlProps, HtmlProps} from '../types.js';
+  import type {AsChild, Assign, HtmlProps} from '../types.js';
   import type {Snippet} from 'svelte';
   import type {CreateProgressProps, CreateProgressReturn} from './create-progress.svelte.js';
 
   export interface ProgressProps
     extends Assign<Omit<HtmlProps<'div'>, 'children'>, CreateProgressProps> {
-    asChild?: Snippet<[attrs: Omit<GenericHtmlProps, 'children'>]>;
+    asChild?: AsChild;
     children?: Snippet<[progress: CreateProgressReturn]>;
   }
 </script>

package/dist/progress/track.svelte

@@ -1,9 +1,8 @@
 <script lang="ts" module>
-  import type {GenericHtmlProps, HtmlProps} from '../types.js';
-  import type {Snippet} from 'svelte';
+  import type {AsChild, HtmlProps} from '../types.js';
 
   export interface ProgressTrackProps extends HtmlProps<'div'> {
-    asChild?: Snippet<[attrs: Omit<GenericHtmlProps, 'children'>]>;
+    asChild?: AsChild;
   }
 </script>
 

package/dist/progress/value-text.svelte

@@ -1,9 +1,8 @@
 <script lang="ts" module>
-  import type {GenericHtmlProps, HtmlProps} from '../types.js';
-  import type {Snippet} from 'svelte';
+  import type {AsChild, HtmlProps} from '../types.js';
 
-  export interface ProgressValueTextProps extends HtmlProps<'div'> {
-    asChild?: Snippet<[attrs: Omit<GenericHtmlProps, 'children'>]>;
+  export interface ProgressValueTextProps extends HtmlProps<'span'> {
+    asChild?: AsChild;
   }
 </script>
 
@@ -21,11 +20,11 @@
 {#if asChild}
   {@render asChild(attrs)}
 {:else}
-  <div {...attrs}>
+  <span {...attrs}>
     {#if children}
       {@render children()}
     {:else}
       {progress.percentAsString}
     {/if}
-  </div>
+  </span>
 {/if}

package/dist/progress/view.svelte

@@ -1,10 +1,9 @@
 <script lang="ts" module>
-  import type {Assign, GenericHtmlProps, HtmlProps} from '../types.js';
+  import type {AsChild, Assign, HtmlProps} from '../types.js';
   import type {ViewProps} from '@zag-js/progress';
-  import type {Snippet} from 'svelte';
 
   export interface ProgressViewProps extends Assign<HtmlProps<'div'>, ViewProps> {
-    asChild?: Snippet<[attrs: Omit<GenericHtmlProps, 'children'>]>;
+    asChild?: AsChild;
   }
 </script>
 

package/dist/qr-code/frame.svelte

@@ -1,9 +1,8 @@
 <script lang="ts" module>
-  import type {HtmlProps} from '../types.js';
-  import type {Snippet} from 'svelte';
+  import type {AsChild, HtmlProps} from '../types.js';
 
   export interface QRCodeFrameProps extends HtmlProps<'svg'> {
-    asChild?: Snippet<[attrs: Omit<HtmlProps<'svg'>, 'children'>]>;
+    asChild?: AsChild<HtmlProps<'svg'>>;
   }
 </script>
 

package/dist/qr-code/overlay.svelte

@@ -1,9 +1,8 @@
 <script lang="ts" module>
-  import type {GenericHtmlProps, HtmlProps} from '../types.js';
-  import type {Snippet} from 'svelte';
+  import type {AsChild, HtmlProps} from '../types.js';
 
   export interface QRCodeOverlayProps extends HtmlProps<'div'> {
-    asChild?: Snippet<[attrs: Omit<GenericHtmlProps, 'children'>]>;
+    asChild?: AsChild;
   }
 </script>
 

package/dist/qr-code/pattern.svelte

@@ -1,9 +1,8 @@
 <script lang="ts" module>
-  import type {HtmlProps} from '../types.js';
-  import type {Snippet} from 'svelte';
+  import type {AsChild, HtmlProps} from '../types.js';
 
   export interface QRCodePatternProps extends HtmlProps<'path'> {
-    asChild?: Snippet<[attrs: Omit<HtmlProps<'path'>, 'children'>]>;
+    asChild?: AsChild<HtmlProps<'path'>>;
   }
 </script>
 

package/dist/qr-code/root.svelte

@@ -1,11 +1,11 @@
 <script lang="ts" module>
-  import type {Assign, GenericHtmlProps, HtmlProps} from '../types.js';
+  import type {AsChild, Assign, GenericHtmlProps, HtmlProps} from '../types.js';
   import type {Snippet} from 'svelte';
   import type {CreateQRCodeProps, CreateQRCodeReturn} from './create-qr-code.svelte.js';
 
   export interface QRCodeProps
     extends Assign<Omit<HtmlProps<'div'>, 'children'>, CreateQRCodeProps> {
-    asChild?: Snippet<[attrs: Omit<GenericHtmlProps, 'children'>, qrCode: CreateQRCodeReturn]>;
+    asChild?: AsChild<GenericHtmlProps, CreateQRCodeReturn>;
     children?: Snippet<[qrCode: CreateQRCodeReturn]>;
   }
 </script>

package/dist/radio-group/indicator.svelte

@@ -1,9 +1,8 @@
 <script lang="ts" module>
-  import type {GenericHtmlProps, HtmlProps} from '../types.js';
-  import type {Snippet} from 'svelte';
+  import type {AsChild, HtmlProps} from '../types.js';
 
-  export interface RadioGroupIndicatorProps extends HtmlProps<'div'> {
-    asChild?: Snippet<[attrs: Omit<GenericHtmlProps, 'children'>]>;
+  export interface RadioGroupIndicatorProps extends HtmlProps<'span'> {
+    asChild?: AsChild;
   }
 </script>
 
@@ -21,7 +20,7 @@
 {#if asChild}
   {@render asChild(attrs)}
 {:else}
-  <div {...attrs}>
+  <span {...attrs}>
     {@render children?.()}
-  </div>
+  </span>
 {/if}

package/dist/radio-group/item-control.svelte

@@ -1,9 +1,8 @@
 <script lang="ts" module>
-  import type {GenericHtmlProps, HtmlProps} from '../types.js';
-  import type {Snippet} from 'svelte';
+  import type {AsChild, HtmlProps} from '../types.js';
 
   export interface RadioGroupItemControlProps extends HtmlProps<'div'> {
-    asChild?: Snippet<[attrs: Omit<GenericHtmlProps, 'children'>]>;
+    asChild?: AsChild;
   }
 </script>
 

package/dist/radio-group/item-text.svelte

@@ -1,9 +1,8 @@
 <script lang="ts" module>
-  import type {GenericHtmlProps, HtmlProps} from '../types.js';
-  import type {Snippet} from 'svelte';
+  import type {AsChild, HtmlProps} from '../types.js';
 
-  export interface RadioGroupItemTextProps extends HtmlProps<'div'> {
-    asChild?: Snippet<[attrs: Omit<GenericHtmlProps, 'children'>]>;
+  export interface RadioGroupItemTextProps extends HtmlProps<'span'> {
+    asChild?: AsChild;
   }
 </script>
 
@@ -22,7 +21,7 @@
 {#if asChild}
   {@render asChild(attrs)}
 {:else}
-  <div {...attrs}>
+  <span {...attrs}>
     {@render children?.()}
-  </div>
+  </span>
 {/if}

package/dist/radio-group/item.svelte

@@ -1,11 +1,11 @@
 <script lang="ts" module>
-  import type {Assign, HtmlProps} from '../types.js';
+  import type {AsChild, Assign, HtmlProps} from '../types.js';
   import type {ItemProps, ItemState} from '@zag-js/radio-group';
   import type {Snippet} from 'svelte';
 
   export interface RadioGroupItemProps
     extends Assign<Omit<HtmlProps<'label'>, 'children'>, ItemProps> {
-    asChild?: Snippet<[attrs: Omit<HtmlProps<'label'>, 'children'>, state: ItemState]>;
+    asChild?: AsChild<HtmlProps<'label'>, ItemState>;
     children?: Snippet<[state: ItemState]>;
   }
 </script>

package/dist/radio-group/label.svelte

@@ -1,9 +1,8 @@
 <script lang="ts" module>
-  import type {GenericHtmlProps, HtmlProps} from '../types.js';
-  import type {Snippet} from 'svelte';
+  import type {AsChild, HtmlProps} from '../types.js';
 
-  export interface RadioGroupLabelProps extends HtmlProps<'div'> {
-    asChild?: Snippet<[attrs: Omit<GenericHtmlProps, 'children'>]>;
+  export interface RadioGroupLabelProps extends HtmlProps<'span'> {
+    asChild?: AsChild;
   }
 </script>
 
@@ -21,7 +20,7 @@
 {#if asChild}
   {@render asChild(attrs)}
 {:else}
-  <div {...attrs}>
+  <span {...attrs}>
     {@render children?.()}
-  </div>
+  </span>
 {/if}

package/dist/radio-group/root.svelte

@@ -1,13 +1,11 @@
 <script lang="ts" module>
-  import type {Assign, GenericHtmlProps, HtmlProps} from '../types.js';
+  import type {AsChild, Assign, GenericHtmlProps, HtmlProps} from '../types.js';
   import type {Snippet} from 'svelte';
   import type {CreateRadioGroupProps, CreateRadioGroupReturn} from './create-radio-group.svelte.js';
 
   export interface RadioGroupProps
     extends Assign<Omit<HtmlProps<'div'>, 'children'>, CreateRadioGroupProps> {
-    asChild?: Snippet<
-      [attrs: Omit<GenericHtmlProps, 'children'>, radioGroup: CreateRadioGroupReturn]
-    >;
+    asChild?: AsChild<GenericHtmlProps, CreateRadioGroupReturn>;
     children?: Snippet<[radioGroup: CreateRadioGroupReturn]>;
   }
 </script>

package/dist/rating-group/control.svelte

@@ -1,9 +1,8 @@
 <script lang="ts" module>
-  import type {GenericHtmlProps, HtmlProps} from '../types.js';
-  import type {Snippet} from 'svelte';
+  import type {AsChild, HtmlProps} from '../types.js';
 
   export interface RatingGroupControlProps extends HtmlProps<'div'> {
-    asChild?: Snippet<[attrs: Omit<GenericHtmlProps, 'children'>]>;
+    asChild?: AsChild;
   }
 </script>
 

package/dist/rating-group/item.svelte

@@ -1,11 +1,11 @@
 <script lang="ts" module>
-  import type {Assign, GenericHtmlProps, HtmlProps} from '../types.js';
+  import type {AsChild, Assign, GenericHtmlProps, HtmlProps} from '../types.js';
   import type {ItemProps, ItemState} from '@zag-js/rating-group';
   import type {Snippet} from 'svelte';
 
   export interface RatingGroupItemProps
     extends Assign<Omit<HtmlProps<'div'>, 'children'>, ItemProps> {
-    asChild?: Snippet<[attrs: Omit<GenericHtmlProps, 'children'>, state: ItemState]>;
+    asChild?: AsChild<GenericHtmlProps, ItemState>;
     children: Snippet<[state: ItemState]>;
   }
 </script>

package/dist/rating-group/label.svelte

@@ -1,9 +1,8 @@
 <script lang="ts" module>
-  import type {HtmlProps} from '../types.js';
-  import type {Snippet} from 'svelte';
+  import type {AsChild, HtmlProps} from '../types.js';
 
   export interface RatingGroupLabelProps extends HtmlProps<'label'> {
-    asChild?: Snippet<[attrs: Omit<HtmlProps<'label'>, 'children'>]>;
+    asChild?: AsChild<HtmlProps<'label'>>;
   }
 </script>
 

package/dist/rating-group/root.svelte

@@ -1,5 +1,5 @@
 <script lang="ts" module>
-  import type {Assign, GenericHtmlProps, HtmlProps} from '../types.js';
+  import type {AsChild, Assign, GenericHtmlProps, HtmlProps} from '../types.js';
   import type {Snippet} from 'svelte';
   import type {
     CreateRatingGroupProps,
@@ -8,9 +8,7 @@
 
   export interface RatingGroupProps
     extends Assign<Omit<HtmlProps<'div'>, 'children'>, CreateRatingGroupProps> {
-    asChild?: Snippet<
-      [attrs: Omit<GenericHtmlProps, 'children'>, ratingGroup: CreateRatingGroupReturn]
-    >;
+    asChild?: AsChild<GenericHtmlProps, CreateRatingGroupReturn>;
     children?: Snippet<[ratingGroup: CreateRatingGroupReturn]>;
   }
 </script>

package/dist/segment-group/indicator.svelte

@@ -1,9 +1,8 @@
 <script lang="ts" module>
-  import type {GenericHtmlProps, HtmlProps} from '../types.js';
-  import type {Snippet} from 'svelte';
+  import type {AsChild, HtmlProps} from '../types.js';
 
-  export interface SegmentGroupIndicatorProps extends HtmlProps<'div'> {
-    asChild?: Snippet<[attrs: Omit<GenericHtmlProps, 'children'>]>;
+  export interface SegmentGroupIndicatorProps extends HtmlProps<'span'> {
+    asChild?: AsChild;
   }
 </script>
 
@@ -22,7 +21,7 @@
 {#if asChild}
   {@render asChild(attrs)}
 {:else}
-  <div {...attrs}>
+  <span {...attrs}>
     {@render children?.()}
-  </div>
+  </span>
 {/if}

package/dist/segment-group/item-control.svelte

@@ -1,10 +1,8 @@
 <script lang="ts" module>
-  import type {Snippet} from 'svelte';
-
-  import type {GenericHtmlProps, HtmlProps} from '../types.js';
+  import type {AsChild, HtmlProps} from '../types.js';
 
   export interface SegmentGroupItemControlProps extends HtmlProps<'div'> {
-    asChild?: Snippet<[attrs: Omit<GenericHtmlProps, 'children'>]>;
+    asChild?: AsChild;
   }
 </script>
 

package/dist/segment-group/item-text.svelte

@@ -1,9 +1,8 @@
 <script lang="ts" module>
-  import type {GenericHtmlProps, HtmlProps} from '../types.js';
-  import type {Snippet} from 'svelte';
+  import type {AsChild, HtmlProps} from '../types.js';
 
-  export interface SegmentGroupItemTextProps extends HtmlProps<'div'> {
-    asChild?: Snippet<[attrs: Omit<GenericHtmlProps, 'children'>]>;
+  export interface SegmentGroupItemTextProps extends HtmlProps<'span'> {
+    asChild?: AsChild;
   }
 </script>
 
@@ -25,7 +24,7 @@
 {#if asChild}
   {@render asChild(attrs)}
 {:else}
-  <div {...attrs}>
+  <span {...attrs}>
     {@render children?.()}
-  </div>
+  </span>
 {/if}

package/dist/segment-group/item.svelte

@@ -1,11 +1,11 @@
 <script lang="ts" module>
-  import type {Assign, HtmlProps} from '../types.js';
+  import type {AsChild, Assign, HtmlProps} from '../types.js';
   import type {ItemProps, ItemState} from '@zag-js/radio-group';
   import type {Snippet} from 'svelte';
 
   export interface SegmentGroupItemProps
     extends Assign<Omit<HtmlProps<'label'>, 'children'>, ItemProps> {
-    asChild?: Snippet<[attrs: Omit<HtmlProps<'label'>, 'children'>, state: ItemState]>;
+    asChild?: AsChild<HtmlProps<'label'>, ItemState>;
     children?: Snippet<[state: ItemState]>;
   }
 </script>

package/dist/segment-group/label.svelte

@@ -1,9 +1,8 @@
 <script lang="ts" module>
-  import type {GenericHtmlProps, HtmlProps} from '../types.js';
-  import type {Snippet} from 'svelte';
+  import type {AsChild, HtmlProps} from '../types.js';
 
-  export interface SegmentGroupLabelProps extends HtmlProps<'div'> {
-    asChild?: Snippet<[attrs: Omit<GenericHtmlProps, 'children'>]>;
+  export interface SegmentGroupLabelProps extends HtmlProps<'span'> {
+    asChild?: AsChild;
   }
 </script>
 
@@ -22,7 +21,7 @@
 {#if asChild}
   {@render asChild(attrs)}
 {:else}
-  <div {...attrs}>
+  <span {...attrs}>
     {@render children?.()}
-  </div>
+  </span>
 {/if}

package/dist/segment-group/root.svelte

@@ -1,5 +1,5 @@
 <script lang="ts" module>
-  import type {Assign, GenericHtmlProps, HtmlProps} from '../types.js';
+  import type {AsChild, Assign, GenericHtmlProps, HtmlProps} from '../types.js';
   import type {Snippet} from 'svelte';
   import type {
     CreateSegmentGroupProps,
@@ -8,9 +8,7 @@
 
   export interface SegmentGroupProps
     extends Assign<Omit<HtmlProps<'div'>, 'children'>, CreateSegmentGroupProps> {
-    asChild?: Snippet<
-      [attrs: Omit<GenericHtmlProps, 'children'>, segmentGroup: CreateSegmentGroupReturn]
-    >;
+    asChild?: AsChild<GenericHtmlProps, CreateSegmentGroupReturn>;
     children?: Snippet<[segmentGroup: CreateSegmentGroupReturn]>;
   }
 </script>

package/dist/select/clear-trigger.svelte

@@ -1,9 +1,8 @@
 <script lang="ts" module>
-  import type {HtmlProps} from '../types.js';
-  import type {Snippet} from 'svelte';
+  import type {AsChild, HtmlProps} from '../types.js';
 
   export interface SelectClearTriggerProps extends HtmlProps<'button'> {
-    asChild?: Snippet<[attrs: Omit<HtmlProps<'button'>, 'children'>]>;
+    asChild?: AsChild<HtmlProps<'button'>>;
   }
 </script>
 

package/dist/select/content.svelte

@@ -1,9 +1,8 @@
 <script lang="ts" module>
-  import type {GenericHtmlProps, HtmlProps} from '../types.js';
-  import type {Snippet} from 'svelte';
+  import type {AsChild, HtmlProps} from '../types.js';
 
   export interface SelectContentProps extends HtmlProps<'div'> {
-    asChild?: Snippet<[attrs: Omit<GenericHtmlProps, 'children'>]>;
+    asChild?: AsChild;
   }
 </script>
 

package/dist/select/control.svelte

@@ -1,9 +1,8 @@
 <script lang="ts" module>
-  import type {GenericHtmlProps, HtmlProps} from '../types.js';
-  import type {Snippet} from 'svelte';
+  import type {AsChild, HtmlProps} from '../types.js';
 
   export interface SelectControlProps extends HtmlProps<'div'> {
-    asChild?: Snippet<[attrs: Omit<GenericHtmlProps, 'children'>]>;
+    asChild?: AsChild;
   }
 </script>
 

package/dist/select/indicator.svelte

@@ -1,9 +1,8 @@
 <script lang="ts" module>
-  import type {GenericHtmlProps, HtmlProps} from '../types.js';
-  import type {Snippet} from 'svelte';
+  import type {AsChild, HtmlProps} from '../types.js';
 
-  export interface SelectIndicatorProps extends HtmlProps<'div'> {
-    asChild?: Snippet<[attrs: Omit<GenericHtmlProps, 'children'>]>;
+  export interface SelectIndicatorProps extends HtmlProps<'span'> {
+    asChild?: AsChild;
   }
 </script>
 
@@ -21,7 +20,7 @@
 {#if asChild}
   {@render asChild(attrs)}
 {:else}
-  <div {...attrs}>
+  <span {...attrs}>
     {@render children?.()}
-  </div>
+  </span>
 {/if}

package/dist/select/item-group-label.svelte

@@ -1,9 +1,8 @@
 <script lang="ts" module>
-  import type {GenericHtmlProps, HtmlProps} from '../types.js';
-  import type {Snippet} from 'svelte';
+  import type {AsChild, HtmlProps} from '../types.js';
 
-  export interface SelectItemGroupLabelProps extends HtmlProps<'div'> {
-    asChild?: Snippet<[attrs: Omit<GenericHtmlProps, 'children'>]>;
+  export interface SelectItemGroupLabelProps extends HtmlProps<'span'> {
+    asChild?: AsChild;
   }
 </script>
 
@@ -24,7 +23,7 @@
 {#if asChild}
   {@render asChild(attrs)}
 {:else}
-  <div {...attrs}>
+  <span {...attrs}>
     {@render children?.()}
-  </div>
+  </span>
 {/if}

package/dist/select/item-group.svelte

@@ -1,11 +1,10 @@
 <script lang="ts" module>
-  import type {Assign, GenericHtmlProps, HtmlProps} from '../types.js';
+  import type {AsChild, Assign, HtmlProps} from '../types.js';
   import type {ItemGroupProps} from '@zag-js/select';
-  import type {Snippet} from 'svelte';
 
   export interface SelectItemGroupProps
     extends Assign<HtmlProps<'div'>, Omit<ItemGroupProps, 'id'>> {
-    asChild?: Snippet<[attrs: Omit<GenericHtmlProps, 'children'>]>;
+    asChild?: AsChild;
   }
 </script>
 

package/dist/select/item-indicator.svelte

@@ -1,9 +1,8 @@
 <script lang="ts" module>
-  import type {GenericHtmlProps, HtmlProps} from '../types.js';
-  import type {Snippet} from 'svelte';
+  import type {AsChild, HtmlProps} from '../types.js';
 
-  export interface SelectItemIndicatorProps extends HtmlProps<'div'> {
-    asChild?: Snippet<[attrs: Omit<GenericHtmlProps, 'children'>]>;
+  export interface SelectItemIndicatorProps extends HtmlProps<'span'> {
+    asChild?: AsChild;
   }
 </script>
 
@@ -22,7 +21,7 @@
 {#if asChild}
   {@render asChild(attrs)}
 {:else}
-  <div {...attrs}>
+  <span {...attrs}>
     {@render children?.()}
-  </div>
+  </span>
 {/if}