bits-ui 0.12.0 → 0.13.1

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

@@ -1,11 +1,14 @@
 /// <reference types="svelte" />
-import { type Menubar as MenubarReturn, type CreateMenubarProps as MenubarProps, type MenubarMenu as MenubarMenuReturn, type CreateMenubarSubmenuProps, type CreateMenubarMenuProps, type MenubarMenuSubmenu as MenubarSubReturn } from "@melt-ui/svelte";
+import { type CreateMenubarProps as MenubarProps, type CreateMenubarSubmenuProps, type CreateMenubarMenuProps } from "@melt-ui/svelte";
 import type { Writable } from "svelte/store";
 import type { FloatingProps } from "../floating/_types.js";
-export declare const getMenubarAttrs: (part: string) => Record<string, string>;
-export declare const getAttrs: (part: "content" | "checkbox-indicator" | "arrow" | "label" | "group" | "radio-group" | "separator" | "item" | "trigger" | "checkbox-item" | "radio-item" | "sub-content" | "sub-trigger") => Record<string, string>;
+type GetReturn = Omit<ReturnType<typeof setCtx>, "updateOption">;
+type GetMenuReturn = Omit<ReturnType<typeof setMenuCtx>, "updateOption">;
+type GetSubmenuReturn = Omit<ReturnType<typeof setSubMenuCtx>, "updateOption">;
 export declare function setCtx(props: MenubarProps): {
     updateOption: <K extends string, V extends unknown>(key: K, value: V | undefined) => void;
+    getAttrs: (part: "content" | "checkbox-indicator" | "arrow" | "label" | "group" | "radio-group" | "separator" | "item" | "trigger" | "checkbox-item" | "radio-item" | "sub-content" | "sub-trigger") => Record<string, string>;
+    getMenubarAttrs: (part: string) => Record<string, string>;
     ids: import("@melt-ui/svelte/internal/helpers").ToWritableStores<{
         menubar: string;
     }>;
@@ -166,6 +169,7 @@ export declare function setCtx(props: MenubarProps): {
                         defaultOpen: false;
                         typeahead: true;
                         closeOnItemClick: true;
+                        onOutsideClick: undefined;
                     }, "ids">>;
                 };
                 createMenuRadioGroup: (args?: import("@melt-ui/svelte/dist/builders/menu/types.js")._CreateRadioGroupProps | undefined) => {
@@ -214,6 +218,7 @@ export declare function setCtx(props: MenubarProps): {
                 closeOnItemClick: boolean;
                 portal: string | HTMLElement | null | undefined;
                 closeOnOutsideClick: boolean;
+                onOutsideClick: ((event: PointerEvent) => void) | undefined;
                 loop: boolean;
                 defaultOpen: boolean;
                 open?: Writable<boolean> | undefined;
@@ -237,9 +242,10 @@ export declare function setCtx(props: MenubarProps): {
         }> | undefined;
     }, "ids">>;
 };
-export declare function getCtx(): MenubarReturn;
+export declare function getCtx(): GetReturn;
 export declare function setMenuCtx(props: CreateMenubarMenuProps): {
     updateOption: <K extends string, V extends unknown>(key: K, value: V | undefined) => void;
+    getAttrs: (part: "content" | "checkbox-indicator" | "arrow" | "label" | "group" | "radio-group" | "separator" | "item" | "trigger" | "checkbox-item" | "radio-item" | "sub-content" | "sub-trigger") => Record<string, string>;
     ids: import("@melt-ui/svelte/internal/helpers").ToWritableStores<{
         menu: string;
         trigger: string;
@@ -383,6 +389,7 @@ export declare function setMenuCtx(props: CreateMenubarMenuProps): {
                 defaultOpen: false;
                 typeahead: true;
                 closeOnItemClick: true;
+                onOutsideClick: undefined;
             }, "ids">>;
         };
         createMenuRadioGroup: (args?: import("@melt-ui/svelte/dist/builders/menu/types.js")._CreateRadioGroupProps | undefined) => {
@@ -431,6 +438,7 @@ export declare function setMenuCtx(props: CreateMenubarMenuProps): {
         closeOnItemClick: boolean;
         portal: string | HTMLElement | null | undefined;
         closeOnOutsideClick: boolean;
+        onOutsideClick: ((event: PointerEvent) => void) | undefined;
         loop: boolean;
         defaultOpen: boolean;
         open?: Writable<boolean> | undefined;
@@ -445,9 +453,10 @@ export declare function setMenuCtx(props: CreateMenubarMenuProps): {
         }> | undefined;
     }>;
 };
-export declare function getMenuCtx(): MenubarMenuReturn;
+export declare function getMenuCtx(): GetMenuReturn;
 export declare function setSubMenuCtx(props: CreateMenubarSubmenuProps): {
     updateOption: <K extends string, V extends unknown>(key: K, value: V | undefined) => void;
+    getAttrs: (part: "content" | "checkbox-indicator" | "arrow" | "label" | "group" | "radio-group" | "separator" | "item" | "trigger" | "checkbox-item" | "radio-item" | "sub-content" | "sub-trigger") => Record<string, string>;
     ids: import("@melt-ui/svelte/internal/helpers").ToWritableStores<{
         menu: string;
         trigger: string;
@@ -511,8 +520,10 @@ export declare function setSubMenuCtx(props: CreateMenubarSubmenuProps): {
         defaultOpen: false;
         typeahead: true;
         closeOnItemClick: true;
+        onOutsideClick: undefined;
     }, "ids">>;
 };
-export declare function getSubMenuCtx(): MenubarSubReturn;
+export declare function getSubMenuCtx(): GetSubmenuReturn;
 export declare function updatePositioning(props: FloatingProps): void;
 export declare function updateSubPositioning(props: FloatingProps): void;
+export {};

package/dist/bits/menubar/ctx.js

@@ -3,28 +3,37 @@ import { getContext, setContext } from "svelte";
 import { createBitAttrs, getOptionUpdater, removeUndefined } from "../../internal/index.js";
 import { getPositioningUpdater } from "../floating/helpers.js";
 import { getSubmenuCtx } from "../menu/ctx";
-const NAME = "menubar";
-const MENU_NAME = "menu";
-const SUB_NAME = "menu-submenu";
-const PARTS = [
-    "arrow",
-    "checkbox-indicator",
-    "checkbox-item",
-    "content",
-    "group",
-    "item",
-    "label",
-    "radio-group",
-    "radio-item",
-    "separator",
-    "sub-content",
-    "sub-trigger",
-    "trigger"
-];
-export const getMenubarAttrs = createBitAttrs(NAME, ["root"]);
-export const getAttrs = createBitAttrs("menu", PARTS);
+function getMenubarData() {
+    const NAME = "menubar";
+    const MENU_NAME = "menu";
+    const SUB_NAME = "menu-submenu";
+    const PARTS = [
+        "arrow",
+        "checkbox-indicator",
+        "checkbox-item",
+        "content",
+        "group",
+        "item",
+        "label",
+        "radio-group",
+        "radio-item",
+        "separator",
+        "sub-content",
+        "sub-trigger",
+        "trigger"
+    ];
+    return {
+        NAME,
+        MENU_NAME,
+        SUB_NAME,
+        PARTS
+    };
+}
 export function setCtx(props) {
-    const menubar = createMenubar(removeUndefined(props));
+    const { NAME, PARTS, MENU_NAME } = getMenubarData();
+    const getMenubarAttrs = createBitAttrs(NAME, ["root"]);
+    const getAttrs = createBitAttrs(MENU_NAME, PARTS);
+    const menubar = { ...createMenubar(removeUndefined(props)), getAttrs, getMenubarAttrs };
     setContext(NAME, menubar);
     return {
         ...menubar,
@@ -32,11 +41,13 @@ export function setCtx(props) {
     };
 }
 export function getCtx() {
+    const { NAME } = getMenubarData();
     return getContext(NAME);
 }
 export function setMenuCtx(props) {
-    const { builders: { createMenu } } = getCtx();
-    const menu = createMenu({ ...removeUndefined(props), forceVisible: false });
+    const { MENU_NAME } = getMenubarData();
+    const { builders: { createMenu }, getAttrs } = getCtx();
+    const menu = { ...createMenu({ ...removeUndefined(props), forceVisible: false }), getAttrs };
     setContext(MENU_NAME, menu);
     return {
         ...menu,
@@ -44,11 +55,13 @@ export function setMenuCtx(props) {
     };
 }
 export function getMenuCtx() {
+    const { MENU_NAME } = getMenubarData();
     return getContext(MENU_NAME);
 }
 export function setSubMenuCtx(props) {
-    const { builders: { createSubmenu } } = getMenuCtx();
-    const sub = createSubmenu(removeUndefined(props));
+    const { SUB_NAME } = getMenubarData();
+    const { builders: { createSubmenu }, getAttrs } = getMenuCtx();
+    const sub = { ...createSubmenu(removeUndefined(props)), getAttrs };
     setContext(SUB_NAME, sub);
     return {
         ...sub,
@@ -56,6 +69,7 @@ export function setSubMenuCtx(props) {
     };
 }
 export function getSubMenuCtx() {
+    const { SUB_NAME } = getMenubarData();
     return getContext(SUB_NAME);
 }
 const defaultPlacement = {

package/dist/bits/pagination/components/pagination-next-button.svelte

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

package/dist/bits/pagination/components/pagination-page.svelte

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

package/dist/bits/pagination/components/pagination-page.svelte.d.ts

@@ -4,11 +4,11 @@ declare const __propDef: {
     props: PageProps;
     slots: {
         default: {
-            builder: ((pageItem: import("@melt-ui/svelte/index.js").Page) => {
+            builder: {
                 'aria-label': string;
                 'data-value': number;
                 'data-selected': string | undefined;
-            }) & {
+            } & {
                 [x: `data-melt-${string}`]: "";
             } & {
                 action: (node: HTMLElement) => import("@melt-ui/svelte/internal/types").MeltActionReturn<"keydown" | "click">;

package/dist/bits/pagination/components/pagination-prev-button.svelte

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

package/dist/bits/pagination/components/pagination.svelte

@@ -1,5 +1,5 @@
 <script>import { melt } from "@melt-ui/svelte";
-import { getAttrs, setCtx } from "../ctx.js";
+import { setCtx } from "../ctx.js";
 export let count;
 export let page = void 0;
 export let onPageChange = void 0;
@@ -9,7 +9,8 @@ export let asChild = false;
 export let el = void 0;
 const {
   elements: { root },
-  states: { pages, range }
+  states: { pages, range },
+  getAttrs
 } = setCtx({
   count,
   perPage,

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

@@ -1,8 +1,13 @@
 /// <reference types="svelte" />
-import { type CreatePaginationProps, type Pagination as PaginationReturn } from "@melt-ui/svelte";
-export declare const getAttrs: (part: "page" | "root" | "prev-button" | "next-button") => Record<string, string>;
+import { type CreatePaginationProps } from "@melt-ui/svelte";
+export declare function getPaginationData(): {
+    NAME: "pagination";
+    PARTS: readonly ["root", "prev-button", "next-button", "page"];
+};
+type GetReturn = Omit<ReturnType<typeof setCtx>, "updateOption">;
 export declare function setCtx(props: CreatePaginationProps): {
     updateOption: <K extends string, V extends unknown>(key: K, value: V | undefined) => void;
+    getAttrs: (part: "page" | "root" | "prev-button" | "next-button") => Record<string, string>;
     elements: {
         root: import("@melt-ui/svelte/internal/helpers").ExplicitBuilderReturn<import("svelte/store").Stores | undefined, import("svelte/action").Action<any, any, Record<never, any>>, () => {
             'data-scope': string;
@@ -55,4 +60,5 @@ export declare function setCtx(props: CreatePaginationProps): {
         onPageChange?: import("@melt-ui/svelte/internal/helpers").ChangeFn<number> | undefined;
     }, "page" | "defaultPage" | "onPageChange">>;
 };
-export declare function getCtx(): PaginationReturn;
+export declare function getCtx(): GetReturn;
+export {};

package/dist/bits/pagination/ctx.js

@@ -1,11 +1,18 @@
 import { createPagination } from "@melt-ui/svelte";
 import { getContext, setContext } from "svelte";
 import { createBitAttrs, getOptionUpdater, removeUndefined } from "../../internal";
-const NAME = "pagination";
-const PARTS = ["root", "prev-button", "next-button", "page"];
-export const getAttrs = createBitAttrs(NAME, PARTS);
+export function getPaginationData() {
+    const NAME = "pagination";
+    const PARTS = ["root", "prev-button", "next-button", "page"];
+    return {
+        NAME,
+        PARTS
+    };
+}
 export function setCtx(props) {
-    const pagination = createPagination(removeUndefined(props));
+    const { NAME, PARTS } = getPaginationData();
+    const getAttrs = createBitAttrs(NAME, PARTS);
+    const pagination = { ...createPagination(removeUndefined(props)), getAttrs };
     setContext(NAME, pagination);
     return {
         ...pagination,
@@ -13,5 +20,6 @@ export function setCtx(props) {
     };
 }
 export function getCtx() {
+    const { NAME } = getPaginationData();
     return getContext(NAME);
 }

package/dist/bits/pin-input/components/pin-input-hidden-input.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 asChild = false;
 export let el = void 0;
 const {
   elements: { hiddenInput },
-  options: { disabled }
+  options: { disabled },
+  getAttrs
 } = getCtx();
 $:
   attrs = {

package/dist/bits/pin-input/components/pin-input-input.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: { input }
+  elements: { input },
+  getAttrs
 } = getCtx();
 const dispatch = createDispatcher();
 const attrs = getAttrs("input");

package/dist/bits/pin-input/components/pin-input-input.svelte.d.ts

@@ -4,13 +4,13 @@ declare const __propDef: {
     props: InputProps;
     slots: {
         default: {
-            builder: (() => {
+            builder: {
                 'data-complete': string | undefined;
                 placeholder: string;
                 disabled: boolean | undefined;
                 type: "text" | "password";
                 value: string;
-            }) & {
+            } & {
                 [x: `data-melt-${string}`]: "";
             } & {
                 action: (node: HTMLInputElement) => import("@melt-ui/svelte/internal/types").MeltActionReturn<"input" | "keydown" | "blur" | "change" | "focus" | "paste">;

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

@@ -1,5 +1,5 @@
 <script>import { melt } from "@melt-ui/svelte";
-import { setCtx, getAttrs } from "../ctx.js";
+import { setCtx } from "../ctx.js";
 import { derived } from "svelte/store";
 export let placeholder = void 0;
 export let value = void 0;
@@ -14,7 +14,8 @@ const {
   elements: { root },
   states: { value: localValue },
   updateOption,
-  ids
+  ids,
+  getAttrs
 } = setCtx({
   placeholder,
   defaultValue: value,

package/dist/bits/pin-input/ctx.d.ts

@@ -1,8 +1,13 @@
 /// <reference types="svelte" />
-import { type PinInput as PinInputReturn, type CreatePinInputProps as PinInputProps } from "@melt-ui/svelte";
-export declare const getAttrs: (part: "input" | "root" | "hidden-input") => Record<string, string>;
+import { type CreatePinInputProps as PinInputProps } from "@melt-ui/svelte";
+export declare function getPinInputData(): {
+    NAME: "pin-input";
+    PARTS: readonly ["root", "input", "hidden-input"];
+};
+type GetReturn = Omit<ReturnType<typeof setCtx>, "updateOption">;
 export declare function setCtx(props: PinInputProps): {
     updateOption: <K extends string, V extends unknown>(key: K, value: V | undefined) => void;
+    getAttrs: (part: "input" | "root" | "hidden-input") => Record<string, string>;
     ids: import("@melt-ui/svelte/internal/helpers").ToWritableStores<{
         root: string;
     }>;
@@ -60,4 +65,5 @@ export declare function setCtx(props: PinInputProps): {
         }> | undefined;
     }, "value" | "ids">>;
 };
-export declare function getCtx(): PinInputReturn;
+export declare function getCtx(): GetReturn;
+export {};

package/dist/bits/pin-input/ctx.js

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

package/dist/bits/popover/components/popover-arrow.svelte

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

package/dist/bits/popover/components/popover-close.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: { close }
+  elements: { close },
+  getAttrs
 } = getCtx();
 const dispatch = createDispatcher();
 const attrs = getAttrs("close");

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

@@ -1,5 +1,5 @@
 <script>import { melt } from "@melt-ui/svelte";
-import { getCtx, getAttrs, updatePositioning } from "../ctx.js";
+import { getCtx, updatePositioning } from "../ctx.js";
 export let transition = void 0;
 export let transitionConfig = void 0;
 export let inTransition = void 0;
@@ -21,7 +21,8 @@ export let el = void 0;
 const {
   elements: { content },
   states: { open },
-  ids
+  ids,
+  getAttrs
 } = getCtx();
 const attrs = getAttrs("content");
 $:

package/dist/bits/popover/components/popover-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 asChild = false;
 export let id = void 0;
 export let el = void 0;
 const {
   elements: { trigger },
-  ids
+  ids,
+  getAttrs
 } = getCtx();
 const dispatch = createDispatcher();
 const attrs = getAttrs("trigger");

package/dist/bits/popover/components/popover.svelte

@@ -9,6 +9,7 @@ export let open = void 0;
 export let onOpenChange = void 0;
 export let openFocus = void 0;
 export let closeFocus = void 0;
+export let onOutsideClick = void 0;
 const {
   updateOption,
   states: { open: localOpen },
@@ -22,6 +23,7 @@ const {
   defaultOpen: open,
   openFocus,
   closeFocus,
+  onOutsideClick,
   onOpenChange: ({ next }) => {
     if (open !== next) {
       onOpenChange?.(next);
@@ -53,6 +55,8 @@ $:
   updateOption("openFocus", openFocus);
 $:
   updateOption("closeFocus", closeFocus);
+$:
+  updateOption("onOutsideClick", onOutsideClick);
 </script>
 
 <slot ids={$idValues} />

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

@@ -4,6 +4,7 @@ declare const __propDef: {
         preventScroll?: boolean | undefined;
         closeOnEscape?: boolean | undefined;
         closeOnOutsideClick?: boolean | undefined;
+        onOutsideClick?: ((event: PointerEvent) => void) | undefined;
         portal?: string | HTMLElement | null | undefined;
         openFocus?: import("@melt-ui/svelte/index.js").FocusProp | undefined;
         closeFocus?: import("@melt-ui/svelte/index.js").FocusProp | undefined;

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

@@ -1,10 +1,15 @@
 /// <reference types="svelte" />
-import { type CreatePopoverProps, type Popover as PopoverReturn } from "@melt-ui/svelte";
+import { type CreatePopoverProps } from "@melt-ui/svelte";
 import type { Writable } from "svelte/store";
 import type { FloatingProps } from "../floating/_types.js";
-export declare const getAttrs: (part: "content" | "arrow" | "trigger" | "close") => Record<string, string>;
+export declare function getPopoverData(): {
+    NAME: "popover";
+    PARTS: readonly ["arrow", "close", "content", "trigger"];
+};
+type GetReturn = Omit<ReturnType<typeof setCtx>, "updateOption">;
 export declare function setCtx(props: CreatePopoverProps): {
     updateOption: <K extends string, V extends unknown>(key: K, value: V | undefined) => void;
+    getAttrs: (part: "content" | "arrow" | "trigger" | "close") => Record<string, string>;
     ids: import("@melt-ui/svelte/internal/helpers").ToWritableStores<{
         content: string;
         trigger: string;
@@ -58,6 +63,7 @@ export declare function setCtx(props: CreatePopoverProps): {
         disableFocusTrap: boolean;
         closeOnEscape: boolean;
         closeOnOutsideClick: boolean;
+        onOutsideClick: ((event: PointerEvent) => void) | undefined;
         preventScroll: boolean;
         portal: string | HTMLElement | null | undefined;
         forceVisible: boolean;
@@ -69,6 +75,7 @@ export declare function setCtx(props: CreatePopoverProps): {
         }> | undefined;
     }, "open" | "ids">>;
 };
-export declare function getCtx(): PopoverReturn;
-export declare function setArrow(size?: number): PopoverReturn;
+export declare function getCtx(): GetReturn;
+export declare function setArrow(size?: number): GetReturn;
 export declare function updatePositioning(props: FloatingProps): void;
+export {};

package/dist/bits/popover/ctx.js

@@ -2,14 +2,24 @@ import { createPopover } from "@melt-ui/svelte";
 import { getContext, setContext } from "svelte";
 import { createBitAttrs, getOptionUpdater, removeUndefined } from "../../internal/index.js";
 import { getPositioningUpdater } from "../floating/helpers.js";
-const NAME = "popover";
-const PARTS = ["arrow", "close", "content", "trigger"];
-export const getAttrs = createBitAttrs(NAME, PARTS);
+export function getPopoverData() {
+    const NAME = "popover";
+    const PARTS = ["arrow", "close", "content", "trigger"];
+    return {
+        NAME,
+        PARTS
+    };
+}
 export function setCtx(props) {
-    const popover = createPopover({
-        ...removeUndefined(props),
-        forceVisible: true
-    });
+    const { NAME, PARTS } = getPopoverData();
+    const getAttrs = createBitAttrs(NAME, PARTS);
+    const popover = {
+        ...createPopover({
+            ...removeUndefined(props),
+            forceVisible: true
+        }),
+        getAttrs
+    };
     setContext(NAME, popover);
     return {
         ...popover,
@@ -17,6 +27,7 @@ export function setCtx(props) {
     };
 }
 export function getCtx() {
+    const { NAME } = getPopoverData();
     return getContext(NAME);
 }
 export function setArrow(size = 8) {
@@ -24,11 +35,11 @@ export function setArrow(size = 8) {
     popover.options.arrowSize.set(size);
     return popover;
 }
-const defaultPlacement = {
-    side: "bottom",
-    align: "center"
-};
 export function updatePositioning(props) {
+    const defaultPlacement = {
+        side: "bottom",
+        align: "center"
+    };
     const withDefaults = { ...defaultPlacement, ...props };
     const { options: { positioning } } = getCtx();
     const updater = getPositioningUpdater(positioning);

package/dist/bits/progress/components/progress.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 max = void 0;
 export let value = void 0;
 export let onValueChange = void 0;
@@ -8,7 +8,8 @@ export let el = void 0;
 const {
   elements: { root },
   states: { value: localValue },
-  updateOption
+  updateOption,
+  getAttrs
 } = setCtx({
   max,
   defaultValue: value,