bits-ui 0.12.0 → 0.13.1

package/dist/bits/separator/ctx.js

@@ -1,10 +1,17 @@
 import { createSeparator } from "@melt-ui/svelte";
 import { createBitAttrs, getOptionUpdater, removeUndefined } from "../../internal/index.js";
-const NAME = "separator";
-const PARTS = ["root"];
-export const getAttrs = createBitAttrs(NAME, PARTS);
+function getSeparatorData() {
+    const NAME = "separator";
+    const PARTS = ["root"];
+    return {
+        NAME,
+        PARTS
+    };
+}
 export function setCtx(props) {
-    const separator = createSeparator(removeUndefined(props));
+    const { NAME, PARTS } = getSeparatorData();
+    const getAttrs = createBitAttrs(NAME, PARTS);
+    const separator = { ...createSeparator(removeUndefined(props)), getAttrs };
     return {
         ...separator,
         updateOption: getOptionUpdater(separator.options)

package/dist/bits/slider/components/slider-input.svelte

@@ -1,8 +1,9 @@
-<script>import { getCtx, getAttrs } from "../ctx.js";
+<script>import { getCtx } from "../ctx.js";
 import { srOnlyStyles } from "../../../internal/style.js";
 export let el = void 0;
 const {
-  states: { value }
+  states: { value },
+  getAttrs
 } = getCtx();
 function getValue(value2) {
   if (value2.length === 1) {

package/dist/bits/slider/components/slider-range.svelte

@@ -1,9 +1,10 @@
 <script>import { melt } from "@melt-ui/svelte";
-import { getCtx, getAttrs } from "../ctx.js";
+import { getCtx } from "../ctx.js";
 export let asChild = false;
 export let el = void 0;
 const {
-  elements: { range }
+  elements: { range },
+  getAttrs
 } = getCtx();
 const attrs = getAttrs("range");
 $:

package/dist/bits/slider/components/slider-thumb.svelte

@@ -1,10 +1,11 @@
 <script>import { melt } from "@melt-ui/svelte";
-import { getCtx, getAttrs } from "../ctx.js";
+import { getCtx } from "../ctx.js";
 import { createDispatcher } from "../../../internal/events.js";
 export let asChild = false;
 export let el = void 0;
 const {
-  elements: { thumb }
+  elements: { thumb },
+  getAttrs
 } = getCtx();
 const dispatch = createDispatcher();
 const attrs = getAttrs("thumb");

package/dist/bits/slider/components/slider-thumb.svelte.d.ts

@@ -4,16 +4,18 @@ declare const __propDef: {
     props: ThumbProps;
     slots: {
         default: {
-            builder: (() => {
+            builder: {
                 readonly role: "slider";
                 readonly 'aria-valuemin': number;
                 readonly 'aria-valuemax': number;
                 readonly 'aria-valuenow': number;
+                readonly 'aria-disabled': true | undefined;
+                readonly 'aria-orientation': import("@melt-ui/svelte/index.js").SliderOrientation;
                 readonly 'data-melt-part': "thumb";
                 readonly 'data-value': number;
                 readonly style: string;
                 readonly tabindex: 0 | -1;
-            }) & {
+            } & {
                 [x: `data-melt-${string}`]: "";
             } & {
                 action: (node: HTMLElement) => import("@melt-ui/svelte/internal/types").MeltActionReturn<"keydown">;

package/dist/bits/slider/components/slider-tick.svelte

@@ -1,9 +1,10 @@
 <script>import { melt } from "@melt-ui/svelte";
-import { getCtx, getAttrs } from "../ctx.js";
+import { getCtx } from "../ctx.js";
 export let asChild = false;
 export let el = void 0;
 const {
-  elements: { tick }
+  elements: { tick },
+  getAttrs
 } = getCtx();
 const attrs = getAttrs("tick");
 $:

package/dist/bits/slider/components/slider-tick.svelte.d.ts

@@ -7,11 +7,11 @@ declare const __propDef: {
     };
     slots: {
         default: {
-            builder: (() => {
+            builder: {
                 'data-bounded': boolean | undefined;
                 'data-value': number;
                 style: string;
-            }) & {
+            } & {
                 [x: `data-melt-${string}`]: "";
             } & {
                 action: import("svelte/action").Action<any, any, Record<never, any>>;

package/dist/bits/slider/components/slider.svelte

@@ -1,5 +1,5 @@
 <script>import { melt } from "@melt-ui/svelte";
-import { setCtx, getAttrs } from "../ctx.js";
+import { setCtx } from "../ctx.js";
 export let disabled = void 0;
 export let min = void 0;
 export let max = void 0;
@@ -12,7 +12,8 @@ export let el = void 0;
 const {
   elements: { root },
   states: { value: localValue, ticks },
-  updateOption
+  updateOption,
+  getAttrs
 } = setCtx({
   disabled,
   min,

package/dist/bits/slider/components/slider.svelte.d.ts

@@ -8,8 +8,9 @@ declare const __propDef: {
     slots: {
         default: {
             builder: {
+                dir: "ltr" | "rtl";
                 disabled: boolean | undefined;
-                'aria-disabled': "true" | undefined;
+                'data-disabled': boolean | undefined;
                 'data-orientation': import("@melt-ui/svelte/index.js").SliderOrientation;
                 style: string | undefined;
                 'data-melt-id': string;

package/dist/bits/slider/ctx.d.ts

@@ -1,12 +1,14 @@
 /// <reference types="svelte" />
-import { type CreateSliderProps, type Slider as SliderReturn } from "@melt-ui/svelte";
-export declare const getAttrs: (part: "input" | "root" | "range" | "thumb" | "tick") => Record<string, string>;
+import { type CreateSliderProps } from "@melt-ui/svelte";
+type GetReturn = Omit<ReturnType<typeof setCtx>, "updateOption">;
 export declare function setCtx(props: CreateSliderProps): {
     updateOption: <K extends string, V extends unknown>(key: K, value: V | undefined) => void;
+    getAttrs: (part: "input" | "root" | "range" | "thumb" | "tick") => Record<string, string>;
     elements: {
-        root: import("@melt-ui/svelte/internal/helpers").ExplicitBuilderReturn<[import("svelte/store").Writable<boolean>, import("svelte/store").Writable<import("@melt-ui/svelte").SliderOrientation>], import("svelte/action").Action<any, any, Record<never, any>>, ([$disabled, $orientation]: [boolean, import("@melt-ui/svelte").SliderOrientation]) => {
+        root: import("@melt-ui/svelte/internal/helpers").ExplicitBuilderReturn<[import("svelte/store").Writable<boolean>, import("svelte/store").Writable<import("@melt-ui/svelte").SliderOrientation>, import("svelte/store").Writable<"ltr" | "rtl">], import("svelte/action").Action<any, any, Record<never, any>>, ([$disabled, $orientation, $dir]: [boolean, import("@melt-ui/svelte").SliderOrientation, "ltr" | "rtl"]) => {
+            dir: "ltr" | "rtl";
             disabled: boolean | undefined;
-            'aria-disabled': "true" | undefined;
+            'data-disabled': boolean | undefined;
             'data-orientation': import("@melt-ui/svelte").SliderOrientation;
             style: string | undefined;
             'data-melt-id': string;
@@ -15,11 +17,13 @@ export declare function setCtx(props: CreateSliderProps): {
             update: (updater: import("svelte/store").Updater<number[]>, sideEffect?: ((newValue: number[]) => void) | undefined) => void;
             set: (this: void, value: number[]) => void;
             subscribe(this: void, run: import("svelte/store").Subscriber<number[]>, invalidate?: import("svelte/store").Invalidator<number[]> | undefined): import("svelte/store").Unsubscriber;
-        }, import("svelte/store").Readable<(val: number) => number>, import("svelte/store").Writable<number>, import("svelte/store").Writable<number>, import("svelte/store").Writable<boolean>, import("svelte/store").Writable<import("@melt-ui/svelte").SliderOrientation>], (node: HTMLElement) => import("@melt-ui/svelte/internal/types").MeltActionReturn<"keydown">, ([$value, $position, $min, $max, $disabled, $orientation]: [number[], (val: number) => number, number, number, boolean, import("@melt-ui/svelte").SliderOrientation]) => () => {
+        }, import("svelte/store").Readable<(val: number) => number>, import("svelte/store").Writable<number>, import("svelte/store").Writable<number>, import("svelte/store").Writable<boolean>, import("svelte/store").Writable<import("@melt-ui/svelte").SliderOrientation>, import("svelte/store").Readable<"rl" | "lr" | "tb" | "bt">], (node: HTMLElement) => import("@melt-ui/svelte/internal/types").MeltActionReturn<"keydown">, ([$value, $position, $min, $max, $disabled, $orientation, $direction]: [number[], (val: number) => number, number, number, boolean, import("@melt-ui/svelte").SliderOrientation, "rl" | "lr" | "tb" | "bt"]) => () => {
             readonly role: "slider";
             readonly 'aria-valuemin': number;
             readonly 'aria-valuemax': number;
             readonly 'aria-valuenow': number;
+            readonly 'aria-disabled': true | undefined;
+            readonly 'aria-orientation': import("@melt-ui/svelte").SliderOrientation;
             readonly 'data-melt-part': "thumb";
             readonly 'data-value': number;
             readonly style: string;
@@ -29,14 +33,14 @@ export declare function setCtx(props: CreateSliderProps): {
             update: (updater: import("svelte/store").Updater<number[]>, sideEffect?: ((newValue: number[]) => void) | undefined) => void;
             set: (this: void, value: number[]) => void;
             subscribe(this: void, run: import("svelte/store").Subscriber<number[]>, invalidate?: import("svelte/store").Invalidator<number[]> | undefined): import("svelte/store").Unsubscriber;
-        }, import("svelte/store").Writable<import("@melt-ui/svelte").SliderOrientation>, import("svelte/store").Readable<(val: number) => number>], import("svelte/action").Action<any, any, Record<never, any>>, ([$value, $orientation, $position]: [number[], import("@melt-ui/svelte").SliderOrientation, (val: number) => number]) => {
+        }, import("svelte/store").Readable<"rl" | "lr" | "tb" | "bt">, import("svelte/store").Readable<(val: number) => number>], import("svelte/action").Action<any, any, Record<never, any>>, ([$value, $direction, $position]: [number[], "rl" | "lr" | "tb" | "bt", (val: number) => number]) => {
             style: string;
         }, string>;
         tick: import("@melt-ui/svelte/internal/helpers").ExplicitBuilderReturn<[import("svelte/store").Readable<number>, {
             update: (updater: import("svelte/store").Updater<number[]>, sideEffect?: ((newValue: number[]) => void) | undefined) => void;
             set: (this: void, value: number[]) => void;
             subscribe(this: void, run: import("svelte/store").Subscriber<number[]>, invalidate?: import("svelte/store").Invalidator<number[]> | undefined): import("svelte/store").Unsubscriber;
-        }, import("svelte/store").Writable<number>, import("svelte/store").Writable<number>, import("svelte/store").Writable<number>, import("svelte/store").Writable<import("@melt-ui/svelte").SliderOrientation>], import("svelte/action").Action<any, any, Record<never, any>>, ([$ticks, $value, $min, $max, $step, $orientation]: [number, number[], number, number, number, import("@melt-ui/svelte").SliderOrientation]) => () => {
+        }, import("svelte/store").Writable<number>, import("svelte/store").Writable<number>, import("svelte/store").Writable<number>, import("svelte/store").Readable<"rl" | "lr" | "tb" | "bt">], import("svelte/action").Action<any, any, Record<never, any>>, ([$ticks, $value, $min, $max, $step, $direction]: [number, number[], number, number, number, "rl" | "lr" | "tb" | "bt"]) => () => {
             'data-bounded': boolean | undefined;
             'data-value': number;
             style: string;
@@ -58,7 +62,9 @@ export declare function setCtx(props: CreateSliderProps): {
         max: number;
         step: number;
         orientation: import("@melt-ui/svelte").SliderOrientation;
+        dir: "ltr" | "rtl";
         disabled: boolean;
     }, "defaultValue" | "value" | "onValueChange">>;
 };
-export declare function getCtx(): SliderReturn;
+export declare function getCtx(): GetReturn;
+export {};

package/dist/bits/slider/ctx.js

@@ -1,11 +1,18 @@
 import { createBitAttrs, getOptionUpdater, removeUndefined } from "../../internal/index.js";
 import { createSlider } from "@melt-ui/svelte";
 import { getContext, setContext } from "svelte";
-const NAME = "slider";
-const PARTS = ["root", "input", "range", "thumb", "tick"];
-export const getAttrs = createBitAttrs(NAME, PARTS);
+function getSliderData() {
+    const NAME = "slider";
+    const PARTS = ["root", "input", "range", "thumb", "tick"];
+    return {
+        NAME,
+        PARTS
+    };
+}
 export function setCtx(props) {
-    const slider = createSlider(removeUndefined(props));
+    const { NAME, PARTS } = getSliderData();
+    const getAttrs = createBitAttrs(NAME, PARTS);
+    const slider = { ...createSlider(removeUndefined(props)), getAttrs };
     setContext(NAME, slider);
     return {
         ...slider,
@@ -13,5 +20,6 @@ export function setCtx(props) {
     };
 }
 export function getCtx() {
+    const { NAME } = getSliderData();
     return getContext(NAME);
 }

package/dist/bits/switch/components/switch-thumb.svelte

@@ -1,8 +1,9 @@
-<script>import { getCtx, getAttrs } from "../ctx.js";
+<script>import { getCtx } from "../ctx.js";
 export let asChild = false;
 export let el = void 0;
 const {
-  states: { checked }
+  states: { checked },
+  getAttrs
 } = getCtx();
 $:
   attrs = {

package/dist/bits/switch/components/switch.svelte

@@ -1,5 +1,5 @@
 <script>import { melt } from "@melt-ui/svelte";
-import { setCtx, getAttrs } from "../ctx.js";
+import { setCtx } from "../ctx.js";
 import { createDispatcher } from "../../../internal/events.js";
 import SwitchInput from "./switch-input.svelte";
 export let checked = void 0;
@@ -15,7 +15,8 @@ export let el = void 0;
 const {
   elements: { root },
   states: { checked: localChecked },
-  updateOption
+  updateOption,
+  getAttrs
 } = setCtx({
   disabled,
   name,

package/dist/bits/switch/ctx.d.ts

@@ -1,8 +1,9 @@
 /// <reference types="svelte" />
-import { type CreateSwitchProps, type Switch as SwitchReturn } from "@melt-ui/svelte";
-export declare const getAttrs: (part: "input" | "root" | "thumb") => Record<string, string>;
+import { type CreateSwitchProps } from "@melt-ui/svelte";
+type GetReturn = Omit<ReturnType<typeof setCtx>, "updateOption">;
 export declare function setCtx(props: CreateSwitchProps): {
     updateOption: <K extends string, V extends unknown>(key: K, value: V | undefined) => void;
+    getAttrs: (part: "input" | "root" | "thumb") => Record<string, string>;
     elements: {
         root: import("@melt-ui/svelte/internal/helpers").ExplicitBuilderReturn<[{
             update: (updater: import("svelte/store").Updater<boolean>, sideEffect?: ((newValue: boolean) => void) | undefined) => void;
@@ -51,4 +52,5 @@ export declare function setCtx(props: CreateSwitchProps): {
         value: string;
     }, "checked">>;
 };
-export declare function getCtx(): SwitchReturn;
+export declare function getCtx(): GetReturn;
+export {};

package/dist/bits/switch/ctx.js

@@ -1,11 +1,18 @@
 import { createSwitch } from "@melt-ui/svelte";
 import { getContext, setContext } from "svelte";
 import { createBitAttrs, getOptionUpdater, removeUndefined } from "../../internal/index.js";
-const NAME = "switch";
-const PARTS = ["root", "input", "thumb"];
-export const getAttrs = createBitAttrs(NAME, PARTS);
+function getSwitchData() {
+    const NAME = "switch";
+    const PARTS = ["root", "input", "thumb"];
+    return {
+        NAME,
+        PARTS
+    };
+}
 export function setCtx(props) {
-    const Switch = createSwitch(removeUndefined(props));
+    const { NAME, PARTS } = getSwitchData();
+    const getAttrs = createBitAttrs(NAME, PARTS);
+    const Switch = { ...createSwitch(removeUndefined(props)), getAttrs };
     setContext(NAME, Switch);
     return {
         ...Switch,
@@ -13,5 +20,6 @@ export function setCtx(props) {
     };
 }
 export function getCtx() {
+    const { NAME } = getSwitchData();
     return getContext(NAME);
 }

package/dist/bits/tabs/components/tabs-content.svelte

@@ -1,10 +1,11 @@
 <script>import { melt } from "@melt-ui/svelte";
-import { getCtx, getAttrs } from "../ctx.js";
+import { getCtx } from "../ctx.js";
 export let value;
 export let asChild = false;
 export let el = void 0;
 const {
-  elements: { content }
+  elements: { content },
+  getAttrs
 } = getCtx();
 const attrs = getAttrs("content");
 $:

package/dist/bits/tabs/components/tabs-content.svelte.d.ts

@@ -7,12 +7,12 @@ declare const __propDef: {
     };
     slots: {
         default: {
-            builder: ((tabValue: string) => {
+            builder: {
                 role: string;
                 'aria-labelledby': string;
                 hidden: boolean | undefined;
                 tabindex: number;
-            }) & {
+            } & {
                 [x: `data-melt-${string}`]: "";
             } & {
                 action: import("svelte/action").Action<any, any, Record<never, any>>;

package/dist/bits/tabs/components/tabs-list.svelte

@@ -1,9 +1,10 @@
 <script>import { melt } from "@melt-ui/svelte";
-import { getCtx, getAttrs } from "../ctx.js";
+import { getCtx } from "../ctx.js";
 export let asChild = false;
 export let el = void 0;
 const {
-  elements: { list }
+  elements: { list },
+  getAttrs
 } = getCtx();
 const attrs = getAttrs("list");
 $:

package/dist/bits/tabs/components/tabs-trigger.svelte

@@ -1,12 +1,13 @@
 <script>import { melt } from "@melt-ui/svelte";
-import { getCtx, getAttrs } from "../ctx.js";
+import { getCtx } from "../ctx.js";
 import { createDispatcher } from "../../../internal/events.js";
 export let value;
 export let disabled = void 0;
 export let asChild = false;
 export let el = void 0;
 const {
-  elements: { trigger }
+  elements: { trigger },
+  getAttrs
 } = getCtx();
 const dispatch = createDispatcher();
 const attrs = getAttrs("trigger");

package/dist/bits/tabs/components/tabs-trigger.svelte.d.ts

@@ -4,7 +4,7 @@ declare const __propDef: {
     props: TriggerProps;
     slots: {
         default: {
-            builder: ((props: import("@melt-ui/svelte/index.js").TabsTriggerProps) => {
+            builder: {
                 type: string;
                 role: string;
                 'data-state': string;
@@ -13,7 +13,7 @@ declare const __propDef: {
                 'data-orientation': import("@melt-ui/svelte/internal/types").Orientation;
                 'data-disabled': boolean | undefined;
                 disabled: boolean | undefined;
-            }) & {
+            } & {
                 [x: `data-melt-${string}`]: "";
             } & {
                 action: (node: HTMLElement) => import("@melt-ui/svelte/internal/types").MeltActionReturn<"keydown" | "click" | "focus">;

package/dist/bits/tabs/components/tabs.svelte

@@ -1,5 +1,5 @@
 <script>import { melt } from "@melt-ui/svelte";
-import { setCtx, getAttrs } from "../ctx.js";
+import { setCtx } from "../ctx.js";
 export let orientation = void 0;
 export let activateOnFocus = void 0;
 export let loop = void 0;
@@ -11,7 +11,8 @@ export let el = void 0;
 const {
   elements: { root },
   states: { value: localValue },
-  updateOption
+  updateOption,
+  getAttrs
 } = setCtx({
   orientation,
   activateOnFocus,

package/dist/bits/tabs/ctx.d.ts

@@ -1,8 +1,9 @@
 /// <reference types="svelte" />
-import { type CreateTabsProps, type Tabs as TabsReturn } from "@melt-ui/svelte";
-export declare const getAttrs: (part: "content" | "list" | "root" | "trigger") => Record<string, string>;
+import { type CreateTabsProps } from "@melt-ui/svelte";
+type GetReturn = Omit<ReturnType<typeof setCtx>, "updateOption">;
 export declare function setCtx(props: CreateTabsProps): {
     updateOption: <K extends string, V extends unknown>(key: K, value: V | undefined) => void;
+    getAttrs: (part: "content" | "list" | "root" | "trigger") => Record<string, string>;
     elements: {
         root: import("@melt-ui/svelte/internal/helpers").ExplicitBuilderReturn<import("svelte/store").Writable<import("@melt-ui/svelte/internal/types").Orientation>, import("svelte/action").Action<any, any, Record<never, any>>, ($orientation: import("@melt-ui/svelte/internal/types").Orientation) => {
             'data-orientation': import("@melt-ui/svelte/internal/types").Orientation;
@@ -54,4 +55,5 @@ export declare function setCtx(props: CreateTabsProps): {
         autoSet: boolean;
     }, "defaultValue" | "value" | "onValueChange" | "autoSet">>;
 };
-export declare function getCtx(): TabsReturn;
+export declare function getCtx(): GetReturn;
+export {};

package/dist/bits/tabs/ctx.js

@@ -1,11 +1,18 @@
 import { createTabs } from "@melt-ui/svelte";
 import { createBitAttrs, getOptionUpdater, removeUndefined } from "../../internal/index.js";
 import { getContext, setContext } from "svelte";
-const NAME = "tabs";
-const PARTS = ["root", "content", "list", "trigger"];
-export const getAttrs = createBitAttrs(NAME, PARTS);
+function getTabsData() {
+    const NAME = "tabs";
+    const PARTS = ["root", "content", "list", "trigger"];
+    return {
+        NAME,
+        PARTS
+    };
+}
 export function setCtx(props) {
-    const tabs = createTabs(removeUndefined(props));
+    const { NAME, PARTS } = getTabsData();
+    const getAttrs = createBitAttrs(NAME, PARTS);
+    const tabs = { ...createTabs(removeUndefined(props)), getAttrs };
     setContext(NAME, tabs);
     return {
         ...tabs,
@@ -13,5 +20,6 @@ export function setCtx(props) {
     };
 }
 export function getCtx() {
+    const { NAME } = getTabsData();
     return getContext(NAME);
 }

package/dist/bits/toggle/components/toggle.svelte

@@ -1,5 +1,5 @@
 <script>import { melt } from "@melt-ui/svelte";
-import { setCtx, getAttrs } from "../ctx.js";
+import { setCtx } from "../ctx.js";
 import { createDispatcher } from "../../../internal/events.js";
 export let disabled = void 0;
 export let pressed = void 0;
@@ -9,7 +9,8 @@ export let el = void 0;
 const {
   elements: { root },
   states: { pressed: localPressed },
-  updateOption
+  updateOption,
+  getAttrs
 } = setCtx({
   disabled,
   defaultPressed: pressed,

package/dist/bits/toggle/ctx.d.ts

@@ -1,8 +1,9 @@
 /// <reference types="svelte" />
-import { type CreateToggleProps, type Toggle as ToggleReturn } from "@melt-ui/svelte";
-export declare const getAttrs: (part: "input" | "root") => Record<string, string>;
+import { type CreateToggleProps } from "@melt-ui/svelte";
+type GetReturn = Omit<ReturnType<typeof setCtx>, "updateOption">;
 export declare function setCtx(props: CreateToggleProps): {
     updateOption: <K extends string, V extends unknown>(key: K, value: V | undefined) => void;
+    getAttrs: (part: "input" | "root") => Record<string, string>;
     elements: {
         root: import("@melt-ui/svelte/internal/helpers").ExplicitBuilderReturn<[{
             update: (updater: import("svelte/store").Updater<boolean>, sideEffect?: ((newValue: boolean) => void) | undefined) => void;
@@ -30,4 +31,5 @@ export declare function setCtx(props: CreateToggleProps): {
         onPressedChange?: import("@melt-ui/svelte/internal/helpers").ChangeFn<boolean> | undefined;
     }, "pressed">>;
 };
-export declare function getCtx(): ToggleReturn;
+export declare function getCtx(): GetReturn;
+export {};

package/dist/bits/toggle/ctx.js

@@ -1,11 +1,18 @@
 import { createBitAttrs, getOptionUpdater, removeUndefined } from "../../internal/index.js";
 import { createToggle } from "@melt-ui/svelte";
 import { getContext, setContext } from "svelte";
-const NAME = "toggle";
-const PARTS = ["root", "input"];
-export const getAttrs = createBitAttrs(NAME, PARTS);
+function getToggleData() {
+    const NAME = "toggle";
+    const PARTS = ["root", "input"];
+    return {
+        NAME,
+        PARTS
+    };
+}
 export function setCtx(props) {
-    const toggle = createToggle(removeUndefined(props));
+    const { NAME, PARTS } = getToggleData();
+    const getAttrs = createBitAttrs(NAME, PARTS);
+    const toggle = { ...createToggle(removeUndefined(props)), getAttrs };
     setContext(NAME, toggle);
     return {
         ...toggle,
@@ -13,5 +20,6 @@ export function setCtx(props) {
     };
 }
 export function getCtx() {
+    const { NAME } = getToggleData();
     return getContext(NAME);
 }

package/dist/bits/toggle-group/components/toggle-group-item.svelte

@@ -1,12 +1,13 @@
 <script>import { melt } from "@melt-ui/svelte";
-import { getCtx, getAttrs } from "../ctx.js";
+import { getCtx } from "../ctx.js";
 import { createDispatcher } from "../../../internal";
 export let value;
 export let disabled = false;
 export let asChild = false;
 export let el = void 0;
 const {
-  elements: { item }
+  elements: { item },
+  getAttrs
 } = getCtx();
 const dispatch = createDispatcher();
 const attrs = getAttrs("item");

package/dist/bits/toggle-group/components/toggle-group-item.svelte.d.ts

@@ -4,7 +4,7 @@ declare const __propDef: {
     props: ItemProps;
     slots: {
         default: {
-            builder: ((props: import("@melt-ui/svelte/index.js").ToggleGroupItemProps) => {
+            builder: {
                 readonly disabled: true | undefined;
                 readonly pressed: boolean;
                 readonly 'data-orientation': import("@melt-ui/svelte/internal/types").Orientation;
@@ -16,7 +16,7 @@ declare const __propDef: {
                 readonly type: "button";
                 readonly role: "radio" | undefined;
                 readonly tabindex: 0 | -1;
-            }) & {
+            } & {
                 [x: `data-melt-${string}`]: "";
             } & {
                 action: (node: HTMLElement) => import("@melt-ui/svelte/internal/types").MeltActionReturn<"keydown" | "click">;

package/dist/bits/toggle-group/components/toggle-group.svelte

@@ -1,5 +1,5 @@
 <script>import { melt } from "@melt-ui/svelte";
-import { setCtx, getAttrs } from "../ctx.js";
+import { setCtx } from "../ctx.js";
 export let type = "single";
 export let disabled = void 0;
 export let loop = void 0;
@@ -11,7 +11,8 @@ export let el = void 0;
 const {
   elements: { root },
   states: { value: localValue },
-  updateOption
+  updateOption,
+  getAttrs
 } = setCtx({
   disabled,
   type,

package/dist/bits/toggle-group/ctx.d.ts

@@ -1,9 +1,9 @@
 /// <reference types="svelte" />
-import { type CreateToggleGroupProps, type ToggleGroup as ToggleGroupReturn } from "@melt-ui/svelte";
-export declare const getAttrs: (part: "root" | "item") => Record<string, string>;
-type GetReturn = ToggleGroupReturn;
+import { type CreateToggleGroupProps } from "@melt-ui/svelte";
+type GetReturn = Omit<ReturnType<typeof setCtx>, "updateOption">;
 export declare function setCtx<T extends "single" | "multiple">(props: CreateToggleGroupProps<T>): {
     updateOption: <K extends string, V extends unknown>(key: K, value: V | undefined) => void;
+    getAttrs: (part: "root" | "item") => Record<string, string>;
     elements: {
         root: import("@melt-ui/svelte/internal/helpers").ExplicitBuilderReturn<import("svelte/store").Writable<import("@melt-ui/svelte/internal/types").Orientation>, import("svelte/action").Action<any, any, Record<never, any>>, ($orientation: import("@melt-ui/svelte/internal/types").Orientation) => {
             readonly role: "group";