fix: tree shaking (#255)

huntabyte · Jan 5, 2024 · a342eb9 · a342eb9
1 parent 28d658d
commit a342eb9
Show file tree

Hide file tree

Showing 189 changed files with 1,257 additions and 822 deletions.
diff --git a/.changeset/olive-cats-compete.md b/.changeset/olive-cats-compete.md
@@ -0,0 +1,5 @@
+---
+"bits-ui": patch
+---
+
+fix: issues with tree shaking
diff --git a/src/lib/bits/accordion/components/accordion-content.svelte b/src/lib/bits/accordion/components/accordion-content.svelte
@@ -2,7 +2,7 @@
 	import { melt } from "@melt-ui/svelte";
 	import type { Transition } from "$lib/internal/index.js";
 	import type { ContentProps } from "../types.js";
-	import { getContent, getAttrs } from "../ctx.js";
+	import { getContent } from "../ctx.js";
 
 	type T = $$Generic<Transition>;
 	type In = $$Generic<Transition>;
@@ -20,7 +20,12 @@
 	export let asChild: $$Props["asChild"] = false;
 	export let el: $$Props["el"] = undefined;
 
-	const { content, isSelected, props } = getContent();
+	const {
+		elements: { content },
+		helpers: { isSelected },
+		props,
+		getAttrs
+	} = getContent();
 
 	const attrs = getAttrs("content");
 

diff --git a/src/lib/bits/accordion/components/accordion-header.svelte b/src/lib/bits/accordion/components/accordion-header.svelte
@@ -1,6 +1,6 @@
 <script lang="ts">
 	import { melt } from "@melt-ui/svelte";
-	import { getAttrs, getCtx } from "../ctx.js";
+	import { getCtx } from "../ctx.js";
 	import type { HeaderProps } from "../types.js";
 
 	type $$Props = HeaderProps;
@@ -10,7 +10,8 @@
 	export let el: $$Props["el"] = undefined;
 
 	const {
-		elements: { heading: header }
+		elements: { heading: header },
+		getAttrs
 	} = getCtx();
 
 	const attrs = getAttrs("header");

diff --git a/src/lib/bits/accordion/components/accordion-item.svelte b/src/lib/bits/accordion/components/accordion-item.svelte
@@ -1,6 +1,6 @@
 <script lang="ts">
 	import { melt } from "@melt-ui/svelte";
-	import { setItem, getAttrs } from "../ctx.js";
+	import { setItem } from "../ctx.js";
 	import type { ItemProps } from "../types.js";
 	type $$Props = ItemProps;
 
@@ -9,7 +9,11 @@
 	export let asChild: $$Props["asChild"] = false;
 	export let el: $$Props["el"] = undefined;
 
-	const { item, props } = setItem({ value, disabled });
+	const {
+		elements: { item },
+		props,
+		getAttrs
+	} = setItem({ value, disabled });
 	const attrs = getAttrs("item");
 
 	$: builder = $item(props);

diff --git a/src/lib/bits/accordion/components/accordion-trigger.svelte b/src/lib/bits/accordion/components/accordion-trigger.svelte
@@ -1,6 +1,6 @@
 <script lang="ts">
 	import { melt } from "@melt-ui/svelte";
-	import { getTrigger, getAttrs } from "../ctx.js";
+	import { getTrigger } from "../ctx.js";
 	import type { TriggerEvents, TriggerProps } from "../types.js";
 	import { createDispatcher } from "$lib/internal/events.js";
 
@@ -10,7 +10,11 @@
 	export let asChild: $$Props["asChild"] = false;
 	export let el: $$Props["el"] = undefined;
 
-	const { trigger, props } = getTrigger();
+	const {
+		elements: { trigger },
+		props,
+		getAttrs
+	} = getTrigger();
 	const dispatch = createDispatcher();
 	const attrs = getAttrs("trigger");
 

diff --git a/src/lib/bits/accordion/components/accordion.svelte b/src/lib/bits/accordion/components/accordion.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
 	import { melt } from "@melt-ui/svelte";
 	import type { Props } from "../types.js";
-	import { setCtx, getAttrs } from "../ctx.js";
+	import { setCtx } from "../ctx.js";
 
 	type Multiple = $$Generic<boolean>;
 	type $$Props = Props<Multiple>;
@@ -16,7 +16,8 @@
 	const {
 		elements: { root },
 		states: { value: localValue },
-		updateOption
+		updateOption,
+		getAttrs
 	} = setCtx({
 		multiple,
 		disabled,

diff --git a/src/lib/bits/accordion/ctx.ts b/src/lib/bits/accordion/ctx.ts
@@ -1,60 +1,61 @@
-import {
-	createAccordion,
-	type Accordion as AccordionReturn,
-	type CreateAccordionProps
-} from "@melt-ui/svelte";
+import { createAccordion, type CreateAccordionProps } from "@melt-ui/svelte";
 import { getContext, setContext } from "svelte";
 import type { ItemProps } from "./types.js";
 import { createBitAttrs, getOptionUpdater, removeUndefined } from "$lib/internal/index.js";
 
-const NAME = "accordion";
-const ITEM_NAME = "accordion-item";
-const PARTS = ["root", "content", "header", "item", "trigger"] as const;
+function getAccordionData() {
+	const NAME = "accordion" as const;
+	const ITEM_NAME = "accordion-item";
+	const PARTS = ["root", "content", "header", "item", "trigger"] as const;
 
-export const getAttrs = createBitAttrs(NAME, PARTS);
-
-type GetReturn = AccordionReturn;
+	return { NAME, ITEM_NAME, PARTS };
+}
 
 export function setCtx<Multiple extends boolean>(props: CreateAccordionProps<Multiple>) {
-	const accordion = createAccordion(removeUndefined(props));
-	setContext(NAME, accordion);
-	return {
-		...accordion,
-		updateOption: getOptionUpdater(accordion.options)
+	const initAccordion = createAccordion(removeUndefined(props));
+	const { NAME, PARTS } = getAccordionData();
+	const getAttrs = createBitAttrs(NAME, PARTS);
+	const accordion = {
+		...initAccordion,
+		getAttrs,
+		updateOption: getOptionUpdater(initAccordion.options)
 	};
+
+	setContext(NAME, accordion);
+	return accordion;
 }
 
 export function getCtx() {
-	return getContext<GetReturn>(NAME);
+	const { NAME } = getAccordionData();
+	return getContext<ReturnType<typeof setCtx>>(NAME);
 }
 
 export function setItem(props: ItemProps) {
+	const { ITEM_NAME } = getAccordionData();
 	setContext(ITEM_NAME, { ...props });
-	const {
-		elements: { item }
-	} = getCtx();
-	return { item, props };
+	const ctx = getCtx();
+	return { ...ctx, props };
 }
 
 export function getItemProps() {
-	const itemProps = getContext<ItemProps>(ITEM_NAME);
-	return itemProps;
+	const { ITEM_NAME } = getAccordionData();
+	return getContext<ItemProps>(ITEM_NAME);
 }
 
 export function getContent() {
-	const {
-		elements: { content },
-		helpers: { isSelected },
-		states: { value }
-	} = getCtx();
+	const ctx = getCtx();
 	const { value: props } = getItemProps();
-	return { content, props, isSelected, value };
+	return {
+		...ctx,
+		props
+	};
 }
 
 export function getTrigger() {
-	const {
-		elements: { trigger }
-	} = getCtx();
+	const ctx = getCtx();
 	const { value, disabled } = getItemProps();
-	return { props: { value, disabled }, trigger };
+	return {
+		...ctx,
+		props: { value, disabled }
+	};
 }
diff --git a/src/lib/bits/alert-dialog/components/alert-dialog-action.svelte b/src/lib/bits/alert-dialog/components/alert-dialog-action.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
 	import { melt } from "@melt-ui/svelte";
 	import { createDispatcher } from "$lib/internal/events.js";
-	import { getCtx, getAttrs } from "../ctx.js";
+	import { getCtx } from "../ctx.js";
 	import type { ActionEvents, ActionProps } from "../types.js";
 
 	type $$Props = ActionProps;
@@ -11,7 +11,8 @@
 	export let el: $$Props["el"] = undefined;
 
 	const {
-		elements: { close }
+		elements: { close },
+		getAttrs
 	} = getCtx();
 
 	const dispatch = createDispatcher();

diff --git a/src/lib/bits/alert-dialog/components/alert-dialog-cancel.svelte b/src/lib/bits/alert-dialog/components/alert-dialog-cancel.svelte
@@ -1,6 +1,6 @@
 <script lang="ts">
 	import { melt } from "@melt-ui/svelte";
-	import { getCtx, getAttrs } from "../ctx.js";
+	import { getCtx } from "../ctx.js";
 	import type { CancelEvents, CancelProps } from "../types.js";
 	import { createDispatcher } from "$lib/internal/events.js";
 
@@ -11,7 +11,8 @@
 	export let el: $$Props["el"] = undefined;
 
 	const {
-		elements: { close }
+		elements: { close },
+		getAttrs
 	} = getCtx();
 
 	const dispatch = createDispatcher();

diff --git a/src/lib/bits/alert-dialog/components/alert-dialog-content.svelte b/src/lib/bits/alert-dialog/components/alert-dialog-content.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
 	import { melt } from "@melt-ui/svelte";
 	import type { Transition } from "$lib/internal/index.js";
-	import { getCtx, getAttrs } from "../ctx.js";
+	import { getCtx } from "../ctx.js";
 	import type { ContentProps } from "../types.js";
 
 	type T = $$Generic<Transition>;
@@ -23,7 +23,8 @@
 	const {
 		elements: { content },
 		states: { open },
-		ids
+		ids,
+		getAttrs
 	} = getCtx();
 
 	const attrs = getAttrs("content");

diff --git a/src/lib/bits/alert-dialog/components/alert-dialog-description.svelte b/src/lib/bits/alert-dialog/components/alert-dialog-description.svelte
@@ -1,6 +1,6 @@
 <script lang="ts">
 	import { melt } from "@melt-ui/svelte";
-	import { getCtx, getAttrs } from "../ctx.js";
+	import { getCtx } from "../ctx.js";
 	import type { DescriptionProps } from "../types.js";
 
 	type $$Props = DescriptionProps;
@@ -11,7 +11,8 @@
 
 	const {
 		elements: { description },
-		ids
+		ids,
+		getAttrs
 	} = getCtx();
 
 	const attrs = getAttrs("description");

diff --git a/src/lib/bits/alert-dialog/components/alert-dialog-overlay.svelte b/src/lib/bits/alert-dialog/components/alert-dialog-overlay.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
 	import { melt } from "@melt-ui/svelte";
 	import type { Transition } from "$lib/internal/index.js";
-	import { getCtx, getAttrs } from "../ctx.js";
+	import { getCtx } from "../ctx.js";
 	import type { OverlayProps } from "../types.js";
 
 	type T = $$Generic<Transition>;
@@ -21,7 +21,8 @@
 
 	const {
 		elements: { overlay },
-		states: { open }
+		states: { open },
+		getAttrs
 	} = getCtx();
 
 	const attrs = getAttrs("overlay");

diff --git a/src/lib/bits/alert-dialog/components/alert-dialog-portal.svelte b/src/lib/bits/alert-dialog/components/alert-dialog-portal.svelte
@@ -1,6 +1,6 @@
 <script lang="ts">
 	import { melt } from "@melt-ui/svelte";
-	import { getCtx, getAttrs } from "../ctx.js";
+	import { getCtx } from "../ctx.js";
 	import type { PortalProps } from "../types.js";
 
 	type $$Props = PortalProps;
@@ -9,7 +9,8 @@
 	export let el: $$Props["el"] = undefined;
 
 	const {
-		elements: { portalled }
+		elements: { portalled },
+		getAttrs
 	} = getCtx();
 	const attrs = getAttrs("portal");
 

diff --git a/src/lib/bits/alert-dialog/components/alert-dialog-title.svelte b/src/lib/bits/alert-dialog/components/alert-dialog-title.svelte
@@ -1,6 +1,6 @@
 <script lang="ts">
 	import { melt } from "@melt-ui/svelte";
-	import { getCtx, getAttrs } from "../ctx.js";
+	import { getCtx } from "../ctx.js";
 	import type { TitleProps } from "../types.js";
 
 	type $$Props = TitleProps;
@@ -12,7 +12,8 @@
 
 	const {
 		elements: { title },
-		ids
+		ids,
+		getAttrs
 	} = getCtx();
 
 	const attrs = getAttrs("title");

diff --git a/src/lib/bits/alert-dialog/components/alert-dialog-trigger.svelte b/src/lib/bits/alert-dialog/components/alert-dialog-trigger.svelte
@@ -1,6 +1,6 @@
 <script lang="ts">
 	import { melt } from "@melt-ui/svelte";
-	import { getCtx, getAttrs } from "../ctx.js";
+	import { getCtx } from "../ctx.js";
 	import type { TriggerEvents, TriggerProps } from "../types.js";
 	import { createDispatcher } from "$lib/internal/events.js";
 
@@ -11,7 +11,8 @@
 	export let el: $$Props["el"] = undefined;
 
 	const {
-		elements: { trigger }
+		elements: { trigger },
+		getAttrs
 	} = getCtx();
 
 	const dispatch = createDispatcher();