npm - bits-ui - Versions diffs - 0.8.0 → 0.8.1 - Mend

bits-ui 0.8.0 → 0.8.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (284) hide show

package/dist/bits/select/components/Select.svelte CHANGED Viewed

@@ -1,4 +1,4 @@
-<script>import { ctx } from "../ctx.js";
+<script>import { setCtx } from "../ctx.js";
 export let required = void 0;
 export let disabled = void 0;
 export let arrowSize = void 0;
@@ -18,7 +18,7 @@ export let forceVisible = true;
 const {
   states: { open: localOpen, selected: localSelected },
   updateOption
-} = ctx.set({
+} = setCtx({
   required,
   disabled,
   arrowSize,

package/dist/bits/select/components/Select.svelte.d.ts CHANGED Viewed

@@ -8,14 +8,15 @@ declare const __propDef: {
         preventScroll?: boolean | undefined;
         closeOnEscape?: boolean | undefined;
         closeOnOutsideClick?: boolean | undefined;
+        loop?: boolean | undefined;
+        positioning?: import("@melt-ui/svelte/internal/actions").FloatingConfig | undefined;
+        arrowSize?: number | undefined;
         portal?: string | HTMLElement | null | undefined;
         name?: string | undefined;
         required?: boolean | undefined;
-        positioning?: import("@melt-ui/svelte/internal/actions").FloatingConfig | undefined;
-        arrowSize?: number | undefined;
-        loop?: boolean | undefined;
         typeahead?: boolean | undefined;
         scrollAlignment?: "center" | "nearest" | undefined;
+        highlightOnHover?: boolean | undefined;
         selected?: import("@melt-ui/svelte/index.js").ComboboxOption<unknown> | undefined;
         onSelectedChange?: import("../../../internal/types.js").OnChangeFn<import("@melt-ui/svelte/index.js").ComboboxOption<unknown> | undefined> | undefined;
         open?: boolean | undefined;

package/dist/bits/select/components/SelectArrow.svelte CHANGED Viewed

@@ -1,14 +1,17 @@
 <script>import { melt } from "@melt-ui/svelte";
-import { ctx } from "../ctx.js";
+import { setArrow, getAttrs } from "../ctx.js";
 export let asChild = false;
 export let size = 8;
 const {
   elements: { arrow }
-} = ctx.setArrow(size);
+} = setArrow(size);
+$:
+  builder = $arrow;
+const attrs = getAttrs("arrow");
 </script>
 {#if asChild}
-	<slot builder={$arrow} />
+	<slot {builder} {attrs} />
 {:else}
-	<div {...$arrow} use:$arrow.action {...$$restProps} />
+	<div {...builder} use:builder.action {...$$restProps} {...attrs} />
 {/if}

package/dist/bits/select/components/SelectArrow.svelte.d.ts CHANGED Viewed

@@ -64,7 +64,7 @@ declare const __propDef: {
         'aria-atomic'?: import("svelte/elements.js").Booleanish | null | undefined;
         'aria-autocomplete'?: "list" | "none" | "inline" | "both" | null | undefined;
         'aria-busy'?: import("svelte/elements.js").Booleanish | null | undefined;
-        'aria-checked'?: boolean | "true" | "false" | "mixed" | null | undefined;
+        'aria-checked'?: boolean | "false" | "true" | "mixed" | null | undefined;
         'aria-colcount'?: number | null | undefined;
         'aria-colindex'?: number | null | undefined;
         'aria-colspan'?: number | null | undefined;
@@ -78,7 +78,7 @@ declare const __propDef: {
         'aria-expanded'?: import("svelte/elements.js").Booleanish | null | undefined;
         'aria-flowto'?: string | null | undefined;
         'aria-grabbed'?: import("svelte/elements.js").Booleanish | null | undefined;
-        'aria-haspopup'?: import("svelte/elements.js").Booleanish | "dialog" | "grid" | "listbox" | "menu" | "tree" | null | undefined;
+        'aria-haspopup'?: "dialog" | import("svelte/elements.js").Booleanish | "grid" | "listbox" | "menu" | "tree" | null | undefined;
         'aria-hidden'?: import("svelte/elements.js").Booleanish | null | undefined;
         'aria-invalid'?: import("svelte/elements.js").Booleanish | "grammar" | "spelling" | null | undefined;
         'aria-keyshortcuts'?: string | null | undefined;
@@ -93,7 +93,7 @@ declare const __propDef: {
         'aria-owns'?: string | null | undefined;
         'aria-placeholder'?: string | null | undefined;
         'aria-posinset'?: number | null | undefined;
-        'aria-pressed'?: boolean | "true" | "false" | "mixed" | null | undefined;
+        'aria-pressed'?: boolean | "false" | "true" | "mixed" | null | undefined;
         'aria-readonly'?: import("svelte/elements.js").Booleanish | null | undefined;
         'aria-relevant'?: "text" | "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | null | undefined;
         'aria-required'?: import("svelte/elements.js").Booleanish | null | undefined;
@@ -225,6 +225,7 @@ declare const __propDef: {
             } & {
                 action: import("svelte/action").Action<any, any, Record<never, any>>;
             };
+            attrs: Record<string, string>;
         };
     };
 };

package/dist/bits/select/components/SelectContent.svelte CHANGED Viewed

@@ -1,6 +1,6 @@
 <script>import { createDispatcher } from "../../../internal/events.js";
 import { melt } from "@melt-ui/svelte";
-import { ctx } from "../ctx.js";
+import { getCtx, getAttrs } from "../ctx.js";
 export let transition = void 0;
 export let transitionConfig = void 0;
 export let inTransition = void 0;
@@ -11,63 +11,64 @@ export let asChild = false;
 const {
   elements: { menu },
   states: { open }
-} = ctx.get();
+} = getCtx();
 const dispatch = createDispatcher();
+$:
+  builder = $menu;
+const attrs = getAttrs("content");
 </script>
 <!-- svelte-ignore a11y-no-static-element-interactions / applied by melt's builder-->
 {#if asChild && $open}
-	{@const builder = $menu}
-	<slot {builder} />
+	<slot {builder} {attrs} />
 {:else if transition && $open}
-	{@const builder = $menu}
 	<div
 		transition:transition={transitionConfig}
 		{...builder} use:builder.action
 		{...$$restProps}
+		{...attrs}
 		on:m-pointerleave={dispatch}
 		on:keydown
 	>
-		<slot {builder} />
+		<slot {builder} {attrs} />
 	</div>
 {:else if inTransition && outTransition && $open}
-	{@const builder = $menu}
 	<div
 		in:inTransition={inTransitionConfig}
 		out:outTransition={outTransitionConfig}
 		{...builder} use:builder.action
 		{...$$restProps}
+		{...attrs}
 		on:m-pointerleave={dispatch}
 		on:keydown
 	>
-		<slot {builder} />
+		<slot {builder} {attrs} />
 	</div>
 {:else if inTransition && $open}
-	{@const builder = $menu}
 	<div
 		in:inTransition={inTransitionConfig}
 		{...builder} use:builder.action
 		{...$$restProps}
+		{...attrs}
 		on:m-pointerleave={dispatch}
 		on:keydown
 	>
-		<slot {builder} />
+		<slot {builder} {attrs} />
 	</div>
 {:else if outTransition && $open}
-	{@const builder = $menu}
 	<div
 		out:outTransition={outTransitionConfig}
 		{...builder} use:builder.action
 		{...$$restProps}
+		{...attrs}
 		on:m-pointerleave={dispatch}
 		on:keydown
 	>
-		<slot {builder} />
+		<slot {builder} {attrs} />
 	</div>
 {:else if $open}
-	{@const builder = $menu}
-	<div {...builder} use:builder.action {...$$restProps} on:m-pointerleave={dispatch} on:keydown>
-		<slot {builder} />
+	<div {...builder} use:builder.action {...$$restProps} {...attrs} on:m-pointerleave={dispatch} on:keydown>
+		<slot {builder} {attrs} />
 	</div>
 {/if}

package/dist/bits/select/components/SelectContent.svelte.d.ts CHANGED Viewed

@@ -71,7 +71,7 @@ declare class __sveltets_Render<T extends Transition, In extends Transition, Out
         'aria-atomic'?: import("svelte/elements.js").Booleanish | null | undefined;
         'aria-autocomplete'?: "list" | "none" | "inline" | "both" | null | undefined;
         'aria-busy'?: import("svelte/elements.js").Booleanish | null | undefined;
-        'aria-checked'?: boolean | "true" | "false" | "mixed" | null | undefined;
+        'aria-checked'?: boolean | "false" | "true" | "mixed" | null | undefined;
         'aria-colcount'?: number | null | undefined;
         'aria-colindex'?: number | null | undefined;
         'aria-colspan'?: number | null | undefined;
@@ -85,7 +85,7 @@ declare class __sveltets_Render<T extends Transition, In extends Transition, Out
         'aria-expanded'?: import("svelte/elements.js").Booleanish | null | undefined;
         'aria-flowto'?: string | null | undefined;
         'aria-grabbed'?: import("svelte/elements.js").Booleanish | null | undefined;
-        'aria-haspopup'?: import("svelte/elements.js").Booleanish | "dialog" | "grid" | "listbox" | "menu" | "tree" | null | undefined;
+        'aria-haspopup'?: "dialog" | import("svelte/elements.js").Booleanish | "grid" | "listbox" | "menu" | "tree" | null | undefined;
         'aria-hidden'?: import("svelte/elements.js").Booleanish | null | undefined;
         'aria-invalid'?: import("svelte/elements.js").Booleanish | "grammar" | "spelling" | null | undefined;
         'aria-keyshortcuts'?: string | null | undefined;
@@ -100,7 +100,7 @@ declare class __sveltets_Render<T extends Transition, In extends Transition, Out
         'aria-owns'?: string | null | undefined;
         'aria-placeholder'?: string | null | undefined;
         'aria-posinset'?: number | null | undefined;
-        'aria-pressed'?: boolean | "true" | "false" | "mixed" | null | undefined;
+        'aria-pressed'?: boolean | "false" | "true" | "mixed" | null | undefined;
         'aria-readonly'?: import("svelte/elements.js").Booleanish | null | undefined;
         'aria-relevant'?: "text" | "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | null | undefined;
         'aria-required'?: import("svelte/elements.js").Booleanish | null | undefined;
@@ -222,7 +222,17 @@ declare class __sveltets_Render<T extends Transition, In extends Transition, Out
     events(): ContentEvents;
     slots(): {
         default: {
-            builder: any;
+            builder: {
+                readonly hidden: true | undefined;
+                readonly id: string;
+                readonly role: "listbox";
+                readonly style: string;
+            } & {
+                [x: `data-melt-${string}`]: "";
+            } & {
+                action: (node: HTMLElement) => import("@melt-ui/svelte/internal/types").MeltActionReturn<"pointerleave">;
+            };
+            attrs: Record<string, string>;
         };
     };
 }

package/dist/bits/select/components/SelectGroup.svelte CHANGED Viewed

@@ -1,14 +1,16 @@
 <script>import { melt } from "@melt-ui/svelte";
-import { ctx } from "../ctx.js";
+import { setGroupCtx, getAttrs } from "../ctx.js";
 export let asChild = false;
-const { group, id } = ctx.setGroup();
+const { group, id } = setGroupCtx();
+$:
+  builder = $group(id);
+const attrs = getAttrs("group");
 </script>
 {#if asChild}
-	<slot builder={$group(id)} />
+	<slot {builder} {attrs} />
 {:else}
-	{@const builder = $group(id)}
-	<div {...builder} use:builder.action {...$$restProps}>
-		<slot {builder} />
+	<div {...builder} use:builder.action {...$$restProps} {...attrs}>
+		<slot {builder} {attrs} />
 	</div>
 {/if}

package/dist/bits/select/components/SelectGroup.svelte.d.ts CHANGED Viewed

@@ -63,7 +63,7 @@ declare const __propDef: {
         'aria-atomic'?: import("svelte/elements.js").Booleanish | null | undefined;
         'aria-autocomplete'?: "list" | "none" | "inline" | "both" | null | undefined;
         'aria-busy'?: import("svelte/elements.js").Booleanish | null | undefined;
-        'aria-checked'?: boolean | "true" | "false" | "mixed" | null | undefined;
+        'aria-checked'?: boolean | "false" | "true" | "mixed" | null | undefined;
         'aria-colcount'?: number | null | undefined;
         'aria-colindex'?: number | null | undefined;
         'aria-colspan'?: number | null | undefined;
@@ -77,7 +77,7 @@ declare const __propDef: {
         'aria-expanded'?: import("svelte/elements.js").Booleanish | null | undefined;
         'aria-flowto'?: string | null | undefined;
         'aria-grabbed'?: import("svelte/elements.js").Booleanish | null | undefined;
-        'aria-haspopup'?: import("svelte/elements.js").Booleanish | "dialog" | "grid" | "listbox" | "menu" | "tree" | null | undefined;
+        'aria-haspopup'?: "dialog" | import("svelte/elements.js").Booleanish | "grid" | "listbox" | "menu" | "tree" | null | undefined;
         'aria-hidden'?: import("svelte/elements.js").Booleanish | null | undefined;
         'aria-invalid'?: import("svelte/elements.js").Booleanish | "grammar" | "spelling" | null | undefined;
         'aria-keyshortcuts'?: string | null | undefined;
@@ -92,7 +92,7 @@ declare const __propDef: {
         'aria-owns'?: string | null | undefined;
         'aria-placeholder'?: string | null | undefined;
         'aria-posinset'?: number | null | undefined;
-        'aria-pressed'?: boolean | "true" | "false" | "mixed" | null | undefined;
+        'aria-pressed'?: boolean | "false" | "true" | "mixed" | null | undefined;
         'aria-readonly'?: import("svelte/elements.js").Booleanish | null | undefined;
         'aria-relevant'?: "text" | "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | null | undefined;
         'aria-required'?: import("svelte/elements.js").Booleanish | null | undefined;
@@ -216,7 +216,15 @@ declare const __propDef: {
     };
     slots: {
         default: {
-            builder: any;
+            builder: ((groupId: string) => {
+                role: string;
+                'aria-labelledby': string;
+            }) & {
+                [x: `data-melt-${string}`]: "";
+            } & {
+                action: import("svelte/action").Action<any, any, Record<never, any>>;
+            };
+            attrs: Record<string, string>;
         };
     };
 };

package/dist/bits/select/components/SelectInput.svelte CHANGED Viewed

@@ -1,11 +1,16 @@
 <script>import { melt } from "@melt-ui/svelte";
-import { ctx } from "../ctx.js";
+import { getCtx, getAttrs } from "../ctx.js";
 export let asChild = false;
-const input = ctx.get().elements.hiddenInput;
+const {
+  elements: { hiddenInput }
+} = getCtx();
+$:
+  builder = $hiddenInput;
+const attrs = getAttrs("input");
 </script>
 {#if asChild}
-	<slot builder={$input} />
+	<slot {builder} {attrs} />
 {:else}
-	<input {...$input} use:$input.action hidden {...$$restProps} />
+	<input {...builder} use:builder.action hidden {...$$restProps} {...attrs} />
 {/if}

package/dist/bits/select/components/SelectInput.svelte.d.ts CHANGED Viewed

@@ -100,7 +100,7 @@ declare const __propDef: {
         'aria-atomic'?: import("svelte/elements.js").Booleanish | null | undefined;
         'aria-autocomplete'?: "list" | "none" | "inline" | "both" | null | undefined;
         'aria-busy'?: import("svelte/elements.js").Booleanish | null | undefined;
-        'aria-checked'?: boolean | "true" | "false" | "mixed" | null | undefined;
+        'aria-checked'?: boolean | "false" | "true" | "mixed" | null | undefined;
         'aria-colcount'?: number | null | undefined;
         'aria-colindex'?: number | null | undefined;
         'aria-colspan'?: number | null | undefined;
@@ -114,7 +114,7 @@ declare const __propDef: {
         'aria-expanded'?: import("svelte/elements.js").Booleanish | null | undefined;
         'aria-flowto'?: string | null | undefined;
         'aria-grabbed'?: import("svelte/elements.js").Booleanish | null | undefined;
-        'aria-haspopup'?: import("svelte/elements.js").Booleanish | "dialog" | "grid" | "listbox" | "menu" | "tree" | null | undefined;
+        'aria-haspopup'?: "dialog" | import("svelte/elements.js").Booleanish | "grid" | "listbox" | "menu" | "tree" | null | undefined;
         'aria-hidden'?: import("svelte/elements.js").Booleanish | null | undefined;
         'aria-invalid'?: import("svelte/elements.js").Booleanish | "grammar" | "spelling" | null | undefined;
         'aria-keyshortcuts'?: string | null | undefined;
@@ -129,7 +129,7 @@ declare const __propDef: {
         'aria-owns'?: string | null | undefined;
         'aria-placeholder'?: string | null | undefined;
         'aria-posinset'?: number | null | undefined;
-        'aria-pressed'?: boolean | "true" | "false" | "mixed" | null | undefined;
+        'aria-pressed'?: boolean | "false" | "true" | "mixed" | null | undefined;
         'aria-readonly'?: import("svelte/elements.js").Booleanish | null | undefined;
         'aria-relevant'?: "text" | "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | null | undefined;
         'aria-required'?: import("svelte/elements.js").Booleanish | null | undefined;
@@ -266,6 +266,7 @@ declare const __propDef: {
             } & {
                 action: import("svelte/action").Action<any, any, Record<never, any>>;
             };
+            attrs: Record<string, string>;
         };
     };
 };

package/dist/bits/select/components/SelectItem.svelte CHANGED Viewed

@@ -1,25 +1,28 @@
 <script>import { melt } from "@melt-ui/svelte";
-import { ctx } from "../ctx.js";
+import { setItemCtx, getAttrs } from "../ctx.js";
 import { createDispatcher } from "../../../internal/events.js";
 export let value;
 export let disabled = void 0;
 export let label = void 0;
 export let asChild = false;
 const {
-  elements: { option }
-} = ctx.setItem(value);
+  elements: { option: item }
+} = setItemCtx(value);
 const dispatch = createDispatcher();
+$:
+  builder = $item({ value, disabled, label });
+const attrs = getAttrs("item");
 </script>
 <!-- svelte-ignore a11y-no-static-element-interactions / applied by melt's builder-->
 {#if asChild}
-	<slot builder={$option({ value, disabled, label })} />
+	<slot {builder} {attrs} />
 {:else}
-	{@const builder = $option({ value, disabled, label })}
 	<div
 		{...builder} use:builder.action
 		{...$$restProps}
+		{...attrs}
 		on:m-click={dispatch}
 		on:m-pointermove={dispatch}
 		on:focusin
@@ -27,7 +30,7 @@ const dispatch = createDispatcher();
 		on:focusout
 		on:pointerleave
 	>
-		<slot {builder}>
+		<slot {builder} {attrs}>
 			{label ? label : value}
 		</slot>
 	</div>

package/dist/bits/select/components/SelectItem.svelte.d.ts CHANGED Viewed

@@ -67,7 +67,7 @@ declare const __propDef: {
         'aria-atomic'?: import("svelte/elements.js").Booleanish | null | undefined;
         'aria-autocomplete'?: "list" | "none" | "inline" | "both" | null | undefined;
         'aria-busy'?: import("svelte/elements.js").Booleanish | null | undefined;
-        'aria-checked'?: boolean | "true" | "false" | "mixed" | null | undefined;
+        'aria-checked'?: boolean | "false" | "true" | "mixed" | null | undefined;
         'aria-colcount'?: number | null | undefined;
         'aria-colindex'?: number | null | undefined;
         'aria-colspan'?: number | null | undefined;
@@ -81,7 +81,7 @@ declare const __propDef: {
         'aria-expanded'?: import("svelte/elements.js").Booleanish | null | undefined;
         'aria-flowto'?: string | null | undefined;
         'aria-grabbed'?: import("svelte/elements.js").Booleanish | null | undefined;
-        'aria-haspopup'?: import("svelte/elements.js").Booleanish | "dialog" | "grid" | "listbox" | "menu" | "tree" | null | undefined;
+        'aria-haspopup'?: "dialog" | import("svelte/elements.js").Booleanish | "grid" | "listbox" | "menu" | "tree" | null | undefined;
         'aria-hidden'?: import("svelte/elements.js").Booleanish | null | undefined;
         'aria-invalid'?: import("svelte/elements.js").Booleanish | "grammar" | "spelling" | null | undefined;
         'aria-keyshortcuts'?: string | null | undefined;
@@ -96,7 +96,7 @@ declare const __propDef: {
         'aria-owns'?: string | null | undefined;
         'aria-placeholder'?: string | null | undefined;
         'aria-posinset'?: number | null | undefined;
-        'aria-pressed'?: boolean | "true" | "false" | "mixed" | null | undefined;
+        'aria-pressed'?: boolean | "false" | "true" | "mixed" | null | undefined;
         'aria-readonly'?: import("svelte/elements.js").Booleanish | null | undefined;
         'aria-relevant'?: "text" | "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | null | undefined;
         'aria-required'?: import("svelte/elements.js").Booleanish | null | undefined;
@@ -217,7 +217,21 @@ declare const __propDef: {
     };
     slots: {
         default: {
-            builder: any;
+            builder: ((props: import("@melt-ui/svelte/index.js").ComboboxOptionProps<unknown>) => {
+                readonly 'data-value': string;
+                readonly 'data-label': string | undefined;
+                readonly 'data-disabled': true | undefined;
+                readonly 'aria-disabled': true | undefined;
+                readonly 'aria-selected': boolean;
+                readonly 'data-selected': "" | undefined;
+                readonly id: string;
+                readonly role: "option";
+            }) & {
+                [x: `data-melt-${string}`]: "";
+            } & {
+                action: (node: HTMLElement) => import("@melt-ui/svelte/internal/types").MeltActionReturn<"click" | "pointermove">;
+            };
+            attrs: Record<string, string>;
         };
     };
     events: ItemEvents;

package/dist/bits/select/components/SelectItemIndicator.svelte CHANGED Viewed

@@ -1,5 +1,5 @@
-<script>import { ctx } from "../ctx.js";
-const { isSelected, value } = ctx.getItemIndicator();
+<script>import { getItemIndicator } from "../ctx.js";
+const { isSelected, value } = getItemIndicator();
 </script>
 {#if $isSelected(value)}

package/dist/bits/select/components/SelectLabel.svelte CHANGED Viewed

@@ -1,14 +1,16 @@
 <script>import { melt } from "@melt-ui/svelte";
-import { ctx } from "../ctx.js";
+import { getGroupLabel, getAttrs } from "../ctx.js";
 export let asChild = false;
-const { groupLabel, id } = ctx.getGroupLabel();
+const { groupLabel, id } = getGroupLabel();
+$:
+  builder = $groupLabel(id);
+const attrs = getAttrs("label");
 </script>
 {#if asChild}
-	<slot builder={$groupLabel(id)} />
+	<slot {builder} {attrs} />
 {:else}
-	{@const builder = $groupLabel(id)}
-	<div {...builder} use:builder.action {...$$restProps}>
-		<slot {builder} />
+	<div {...builder} use:builder.action {...$$restProps} {...attrs}>
+		<slot {builder} {attrs} />
 	</div>
 {/if}

package/dist/bits/select/components/SelectLabel.svelte.d.ts CHANGED Viewed

@@ -64,7 +64,7 @@ declare const __propDef: {
         'aria-atomic'?: import("svelte/elements.js").Booleanish | null | undefined;
         'aria-autocomplete'?: "list" | "none" | "inline" | "both" | null | undefined;
         'aria-busy'?: import("svelte/elements.js").Booleanish | null | undefined;
-        'aria-checked'?: boolean | "true" | "false" | "mixed" | null | undefined;
+        'aria-checked'?: boolean | "false" | "true" | "mixed" | null | undefined;
         'aria-colcount'?: number | null | undefined;
         'aria-colindex'?: number | null | undefined;
         'aria-colspan'?: number | null | undefined;
@@ -78,7 +78,7 @@ declare const __propDef: {
         'aria-expanded'?: import("svelte/elements.js").Booleanish | null | undefined;
         'aria-flowto'?: string | null | undefined;
         'aria-grabbed'?: import("svelte/elements.js").Booleanish | null | undefined;
-        'aria-haspopup'?: import("svelte/elements.js").Booleanish | "dialog" | "grid" | "listbox" | "menu" | "tree" | null | undefined;
+        'aria-haspopup'?: "dialog" | import("svelte/elements.js").Booleanish | "grid" | "listbox" | "menu" | "tree" | null | undefined;
         'aria-hidden'?: import("svelte/elements.js").Booleanish | null | undefined;
         'aria-invalid'?: import("svelte/elements.js").Booleanish | "grammar" | "spelling" | null | undefined;
         'aria-keyshortcuts'?: string | null | undefined;
@@ -93,7 +93,7 @@ declare const __propDef: {
         'aria-owns'?: string | null | undefined;
         'aria-placeholder'?: string | null | undefined;
         'aria-posinset'?: number | null | undefined;
-        'aria-pressed'?: boolean | "true" | "false" | "mixed" | null | undefined;
+        'aria-pressed'?: boolean | "false" | "true" | "mixed" | null | undefined;
         'aria-readonly'?: import("svelte/elements.js").Booleanish | null | undefined;
         'aria-relevant'?: "text" | "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | null | undefined;
         'aria-required'?: import("svelte/elements.js").Booleanish | null | undefined;
@@ -214,7 +214,14 @@ declare const __propDef: {
     };
     slots: {
         default: {
-            builder: any;
+            builder: ((groupId: string) => {
+                id: string;
+            }) & {
+                [x: `data-melt-${string}`]: "";
+            } & {
+                action: import("svelte/action").Action<any, any, Record<never, any>>;
+            };
+            attrs: Record<string, string>;
         };
     };
     events: LabelEvents;

package/dist/bits/select/components/SelectTrigger.svelte CHANGED Viewed

@@ -1,18 +1,26 @@
 <script>import { melt } from "@melt-ui/svelte";
-import { ctx } from "../ctx.js";
+import { getCtx, getAttrs } from "../ctx.js";
 import { createDispatcher } from "../../../internal/events.js";
 export let asChild = false;
 const {
   elements: { trigger }
-} = ctx.get();
+} = getCtx();
 const dispatch = createDispatcher();
+$:
+  builder = $trigger;
+const attrs = getAttrs("trigger");
 </script>
 {#if asChild}
-	<slot builder={$trigger} />
+	<slot {builder} {attrs} />
 {:else}
-	{@const builder = $trigger}
-	<button {...builder} use:builder.action {...$$restProps} on:m-click={dispatch} on:m-keydown={dispatch}>
-		<slot {builder} />
+	<button
+		{...builder} use:builder.action
+		{...$$restProps}
+		{...attrs}
+		on:m-click={dispatch}
+		on:m-keydown={dispatch}
+	>
+		<slot {builder} {attrs} />
 	</button>
 {/if}

package/dist/bits/select/components/SelectTrigger.svelte.d.ts CHANGED Viewed

@@ -74,7 +74,7 @@ declare const __propDef: {
         'aria-atomic'?: import("svelte/elements.js").Booleanish | null | undefined;
         'aria-autocomplete'?: "list" | "none" | "inline" | "both" | null | undefined;
         'aria-busy'?: import("svelte/elements.js").Booleanish | null | undefined;
-        'aria-checked'?: boolean | "true" | "false" | "mixed" | null | undefined;
+        'aria-checked'?: boolean | "false" | "true" | "mixed" | null | undefined;
         'aria-colcount'?: number | null | undefined;
         'aria-colindex'?: number | null | undefined;
         'aria-colspan'?: number | null | undefined;
@@ -88,7 +88,7 @@ declare const __propDef: {
         'aria-expanded'?: import("svelte/elements.js").Booleanish | null | undefined;
         'aria-flowto'?: string | null | undefined;
         'aria-grabbed'?: import("svelte/elements.js").Booleanish | null | undefined;
-        'aria-haspopup'?: import("svelte/elements.js").Booleanish | "dialog" | "grid" | "listbox" | "menu" | "tree" | null | undefined;
+        'aria-haspopup'?: "dialog" | import("svelte/elements.js").Booleanish | "grid" | "listbox" | "menu" | "tree" | null | undefined;
         'aria-hidden'?: import("svelte/elements.js").Booleanish | null | undefined;
         'aria-invalid'?: import("svelte/elements.js").Booleanish | "grammar" | "spelling" | null | undefined;
         'aria-keyshortcuts'?: string | null | undefined;
@@ -103,7 +103,7 @@ declare const __propDef: {
         'aria-owns'?: string | null | undefined;
         'aria-placeholder'?: string | null | undefined;
         'aria-posinset'?: number | null | undefined;
-        'aria-pressed'?: boolean | "true" | "false" | "mixed" | null | undefined;
+        'aria-pressed'?: boolean | "false" | "true" | "mixed" | null | undefined;
         'aria-readonly'?: import("svelte/elements.js").Booleanish | null | undefined;
         'aria-relevant'?: "text" | "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | null | undefined;
         'aria-required'?: import("svelte/elements.js").Booleanish | null | undefined;
@@ -224,7 +224,22 @@ declare const __propDef: {
     };
     slots: {
         default: {
-            builder: any;
+            builder: {
+                readonly 'aria-activedescendant': string | undefined;
+                readonly 'aria-autocomplete': "list";
+                readonly 'aria-controls': string;
+                readonly 'aria-expanded': boolean;
+                readonly 'aria-labelledby': string;
+                readonly 'data-melt-id': string;
+                readonly id: string;
+                readonly role: "combobox";
+                readonly disabled: true | undefined;
+            } & {
+                [x: `data-melt-${string}`]: "";
+            } & {
+                action: (node: HTMLElement) => import("@melt-ui/svelte/internal/types").MeltActionReturn<"keydown" | "click" | "input">;
+            };
+            attrs: Record<string, string>;
         };
     };
     events: TriggerEvents;

package/dist/bits/select/components/SelectValue.svelte CHANGED Viewed

@@ -1,15 +1,18 @@
-<script>import { ctx } from "../ctx.js";
+<script>import { getCtx, getAttrs } from "../ctx.js";
 export let placeholder = "";
 export let asChild = false;
 const {
   states: { selectedLabel }
-} = ctx.get();
+} = getCtx();
+$:
+  label = $selectedLabel;
+const attrs = getAttrs("value");
 </script>
 {#if asChild}
-	<slot label={$selectedLabel} />
+	<slot {label} {attrs} />
 {:else}
-	<span {...$$restProps}>
-		{$selectedLabel ? $selectedLabel : placeholder}
+	<span {...$$restProps} {...attrs}>
+		{label ? label : placeholder}
 	</span>
 {/if}