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

bits-ui 0.7.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 (288) hide show

package/dist/bits/dropdown-menu/components/DropdownMenuGroup.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/dropdown-menu/components/DropdownMenuItem.svelte CHANGED Viewed

@@ -1,26 +1,30 @@
 <script>import { createDispatcher } from "../../../internal/events.js";
 import { disabledAttrs } from "../../../internal/helpers.js";
 import { melt } from "@melt-ui/svelte";
-import { ctx } from "../ctx.js";
+import { getCtx, getAttrs } from "../ctx.js";
 export let href = void 0;
 export let asChild = false;
 export let disabled = false;
 const {
   elements: { item }
-} = ctx.get();
+} = getCtx();
+$:
+  builder = $item;
+const attrs = getAttrs("item");
 const dispatch = createDispatcher();
 </script>
 <!-- svelte-ignore a11y-no-static-element-interactions applied by melt's action/store -->
 {#if asChild}
-	<slot builder={$item} />
+	<slot {builder} {attrs} />
 {:else}
-	{@const builder = $item}
 	<svelte:element
 		this={href ? "a" : "div"}
 		{href}
 		{...builder} use:builder.action
 		{...$$restProps}
+		{...attrs}
+		{...disabledAttrs(disabled)}
 		on:m-click={dispatch}
 		on:m-focusin={dispatch}
 		on:m-focusout={dispatch}
@@ -28,8 +32,7 @@ const dispatch = createDispatcher();
 		on:m-pointerdown={dispatch}
 		on:m-pointerleave={dispatch}
 		on:m-pointermove={dispatch}
-		{...disabledAttrs(disabled)}
 	>
-		<slot {builder} />
+		<slot {builder} {attrs} />
 	</svelte:element>
 {/if}

package/dist/bits/dropdown-menu/components/DropdownMenuItem.svelte.d.ts CHANGED Viewed

@@ -66,7 +66,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;
@@ -80,7 +80,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;
@@ -95,7 +95,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,16 @@ declare const __propDef: {
     };
     slots: {
         default: {
-            builder: any;
+            builder: {
+                role: string;
+                tabindex: number;
+                'data-orientation': string;
+            } & {
+                [x: `data-melt-${string}`]: "";
+            } & {
+                action: (node: HTMLElement) => import("@melt-ui/svelte/internal/types").MeltActionReturn<"keydown" | "click" | "focusin" | "focusout" | "pointerdown" | "pointerleave" | "pointermove">;
+            };
+            attrs: Record<string, string>;
         };
     };
     events: ItemEvents;

package/dist/bits/dropdown-menu/components/DropdownMenuLabel.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/dropdown-menu/components/DropdownMenuLabel.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,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>;
         };
     };
 };

package/dist/bits/dropdown-menu/components/DropdownMenuRadioGroup.svelte CHANGED Viewed

@@ -1,12 +1,12 @@
 <script>import { melt } from "@melt-ui/svelte";
-import { ctx } from "../ctx.js";
+import { setRadioGroupCtx, getAttrs } from "../ctx.js";
 export let value = void 0;
 export let onValueChange = void 0;
 export let asChild = false;
 const {
   elements: { radioGroup },
   states: { value: localValue }
-} = ctx.setRadioGroup({
+} = setRadioGroupCtx({
   defaultValue: value,
   onValueChange: ({ next }) => {
     if (next) {
@@ -18,13 +18,15 @@ const {
 });
 $:
   value !== void 0 && localValue.set(value);
+$:
+  builder = $radioGroup;
+const attrs = getAttrs("radio-group");
 </script>
 {#if asChild}
-	<slot builder={$radioGroup} />
+	<slot {builder} {attrs} />
 {:else}
-	{@const builder = $radioGroup}
-	<div {...builder} use:builder.action {...$$restProps}>
-		<slot {builder} />
+	<div {...builder} use:builder.action {...$$restProps} {...attrs}>
+		<slot {builder} {attrs} />
 	</div>
 {/if}

package/dist/bits/dropdown-menu/components/DropdownMenuRadioGroup.svelte.d.ts CHANGED Viewed

@@ -65,7 +65,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;
@@ -79,7 +79,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;
@@ -94,7 +94,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;
@@ -218,7 +218,14 @@ declare const __propDef: {
     };
     slots: {
         default: {
-            builder: any;
+            builder: {
+                role: string;
+            } & {
+                [x: `data-melt-${string}`]: "";
+            } & {
+                action: import("svelte/action").Action<any, any, Record<never, any>>;
+            };
+            attrs: Record<string, string>;
         };
     };
 };

package/dist/bits/dropdown-menu/components/DropdownMenuRadioIndicator.svelte CHANGED Viewed

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

package/dist/bits/dropdown-menu/components/DropdownMenuRadioItem.svelte CHANGED Viewed

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

package/dist/bits/dropdown-menu/components/DropdownMenuRadioItem.svelte.d.ts CHANGED Viewed

@@ -66,7 +66,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;
@@ -80,7 +80,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;
@@ -95,7 +95,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,21 @@ declare const __propDef: {
     };
     slots: {
         default: {
-            builder: any;
+            builder: ((itemProps: import("@melt-ui/svelte/dist/builders/menu/types.js")._RadioItemProps) => {
+                disabled: boolean;
+                role: string;
+                'data-state': string;
+                'aria-checked': boolean;
+                'data-disabled': boolean | undefined;
+                'data-value': string;
+                'data-orientation': string;
+                tabindex: number;
+            }) & {
+                [x: `data-melt-${string}`]: "";
+            } & {
+                action: (node: HTMLElement) => import("@melt-ui/svelte/internal/types").MeltActionReturn<"keydown" | "click" | "focusin" | "focusout" | "pointerdown" | "pointerleave" | "pointermove">;
+            };
+            attrs: Record<string, string>;
         };
     };
     events: RadioItemEvents;

package/dist/bits/dropdown-menu/components/DropdownMenuSeparator.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 separator = ctx.get().elements.separator;
+const {
+  elements: { separator }
+} = getCtx();
+$:
+  builder = $separator;
+const attrs = getAttrs("separator");
 </script>
 {#if asChild}
-	<slot builder={$separator} />
+	<slot {builder} {attrs} />
 {:else}
-	<div {...$separator} use:$separator.action {...$$restProps} />
+	<div {...$separator} use:$separator.action {...$$restProps} {...attrs} />
 {/if}

package/dist/bits/dropdown-menu/components/DropdownMenuSeparator.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;
@@ -226,6 +226,7 @@ declare const __propDef: {
             } & {
                 action: import("svelte/action").Action<any, any, Record<never, any>>;
             };
+            attrs: Record<string, string>;
         };
     };
 };

package/dist/bits/dropdown-menu/components/DropdownMenuSub.svelte CHANGED Viewed

@@ -1,8 +1,8 @@
-<script>import { ctx } from "../ctx.js";
+<script>import { setSubMenuCtx } from "../ctx.js";
 export let positioning = void 0;
 export let disabled = void 0;
 export let arrowSize = void 0;
-const { updateOption } = ctx.setSub({
+const { updateOption } = setSubMenuCtx({
   positioning,
   disabled,
   arrowSize

package/dist/bits/dropdown-menu/components/DropdownMenuSubContent.svelte CHANGED Viewed

@@ -1,6 +1,6 @@
 <script>import { melt } from "@melt-ui/svelte";
 import { createDispatcher } from "../../../internal/index.js";
-import { ctx } from "../ctx.js";
+import { getSubContent, getAttrs } from "../ctx.js";
 export let transition = void 0;
 export let transitionConfig = void 0;
 export let inTransition = void 0;
@@ -11,72 +11,73 @@ export let asChild = false;
 const {
   elements: { subMenu },
   states: { subOpen }
-} = ctx.getSubContent();
+} = getSubContent();
 const dispatch = createDispatcher();
+$:
+  builder = $subMenu;
+const attrs = getAttrs("sub-content");
 </script>
-<!-- svelte-ignore a11y-no-static-element-interactions / applied by melt store -->
 {#if asChild && $subOpen}
-	{@const builder = $subMenu}
-	<slot {builder} />
+	<slot {builder} {attrs} />
 {:else if transition && $subOpen}
-	{@const builder = $subMenu}
 	<div
 		transition:transition={transitionConfig}
 		{...builder} use:builder.action
 		{...$$restProps}
+		{...attrs}
 		on:m-focusout={dispatch}
 		on:m-keydown={dispatch}
 		on:m-pointermove={dispatch}
 	>
-		<slot {builder} />
+		<slot {builder} {attrs} />
 	</div>
 {:else if inTransition && outTransition && $subOpen}
-	{@const builder = $subMenu}
 	<div
 		in:inTransition={inTransitionConfig}
 		out:outTransition={outTransitionConfig}
 		{...builder} use:builder.action
 		{...$$restProps}
+		{...attrs}
 		on:m-focusout={dispatch}
 		on:m-keydown={dispatch}
 		on:m-pointermove={dispatch}
 	>
-		<slot {builder} />
+		<slot {builder} {attrs} />
 	</div>
 {:else if inTransition && $subOpen}
-	{@const builder = $subMenu}
 	<div
 		in:inTransition={inTransitionConfig}
 		{...builder} use:builder.action
 		{...$$restProps}
+		{...attrs}
 		on:m-focusout={dispatch}
 		on:m-keydown={dispatch}
 		on:m-pointermove={dispatch}
 	>
-		<slot {builder} />
+		<slot {builder} {attrs} />
 	</div>
 {:else if outTransition && $subOpen}
-	{@const builder = $subMenu}
 	<div
 		out:outTransition={outTransitionConfig}
 		{...builder} use:builder.action
 		{...$$restProps}
+		{...attrs}
 		on:m-focusout={dispatch}
 		on:m-keydown={dispatch}
 		on:m-pointermove={dispatch}
 	>
-		<slot {builder} />
+		<slot {builder} {attrs} />
 	</div>
 {:else if $subOpen}
-	{@const builder = $subMenu}
 	<div
 		{...builder} use:builder.action
 		{...$$restProps}
+		{...attrs}
 		on:m-focusout={dispatch}
 		on:m-keydown={dispatch}
 		on:m-pointermove={dispatch}
 	>
-		<slot {builder} />
+		<slot {builder} {attrs} />
 	</div>
 {/if}

package/dist/bits/dropdown-menu/components/DropdownMenuSubContent.svelte.d.ts CHANGED Viewed

@@ -72,7 +72,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;
@@ -86,7 +86,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;
@@ -101,7 +101,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;
@@ -223,7 +223,20 @@ declare class __sveltets_Render<T extends Transition, In extends Transition, Out
     events(): SubContentEvents;
     slots(): {
         default: {
-            builder: any;
+            builder: {
+                readonly role: "menu";
+                readonly hidden: true | undefined;
+                readonly style: string;
+                readonly id: string;
+                readonly 'aria-labelledby': string;
+                readonly 'data-state': "open" | "closed";
+                readonly tabindex: -1;
+            } & {
+                [x: `data-melt-${string}`]: "";
+            } & {
+                action: (node: HTMLElement) => import("@melt-ui/svelte/internal/types").MeltActionReturn<"keydown" | "focusout" | "pointermove">;
+            };
+            attrs: Record<string, string>;
         };
     };
 }

package/dist/bits/dropdown-menu/components/DropdownMenuSubTrigger.svelte CHANGED Viewed

@@ -1,31 +1,34 @@
 <script>import { melt } from "@melt-ui/svelte";
 import { disabledAttrs } from "../../../internal/helpers.js";
-import { ctx } from "../ctx.js";
+import { getSubTrigger, getAttrs } from "../ctx.js";
 import { createDispatcher } from "../../../internal/events.js";
 export let disabled = false;
 export let asChild = false;
 const {
   elements: { subTrigger }
-} = ctx.getSubTrigger();
+} = getSubTrigger();
 const dispatch = createDispatcher();
+$:
+  builder = $subTrigger;
+$:
+  attrs = { ...getAttrs("sub-trigger"), ...disabledAttrs(disabled) };
 </script>
 <!-- svelte-ignore a11y-no-static-element-interactions applied by melt's action/store -->
 {#if asChild}
-	<slot builder={$subTrigger} />
+	<slot {builder} {attrs} />
 {:else}
-	{@const builder = $subTrigger}
 	<div
 		{...builder} use:builder.action
 		{...$$restProps}
+		{...attrs}
 		on:m-click={dispatch}
 		on:m-focusin={dispatch}
 		on:m-focusout={dispatch}
 		on:m-keydown={dispatch}
 		on:m-pointerleave={dispatch}
 		on:m-pointermove={dispatch}
-		{...disabledAttrs(disabled)}
 	>
-		<slot {builder} />
+		<slot {builder} {attrs} />
 	</div>
 {/if}