bits-ui 0.0.32 → 0.0.33

package/dist/bits/alert-dialog/components/AlertDialog.svelte

@@ -3,7 +3,7 @@ export let preventScroll = void 0;
 export let closeOnEscape = void 0;
 export let closeOnOutsideClick = void 0;
 export let portal = void 0;
-export let forceVisible = true;
+export let forceVisible = void 0;
 export let open = void 0;
 export let onOpenChange = void 0;
 const {

package/dist/bits/alert-dialog/components/AlertDialogContent.svelte

@@ -3,23 +3,19 @@ import { ctx } from "../ctx.js";
 export let transition = void 0;
 export let transitionConfig = void 0;
 export let asChild = false;
-const {
-  elements: { content },
-  states: { open }
-} = ctx.get();
+const content = ctx.get().elements.content;
 </script>
 
-{#if $open}
+{#if asChild}
+	<slot builder={$content} />
+{:else if transition}
 	{@const builder = $content}
-	{#if asChild}
+	<div {...builder} use:builder.action {...$$restProps} transition:transition={transitionConfig}>
 		<slot {builder} />
-	{:else if transition}
-		<div {...builder} use:builder.action {...$$restProps} transition:transition={transitionConfig}>
-			<slot {builder} />
-		</div>
-	{:else}
-		<div {...builder} use:builder.action {...$$restProps}>
-			<slot {builder} />
-		</div>
-	{/if}
+	</div>
+{:else}
+	{@const builder = $content}
+	<div {...builder} use:builder.action {...$$restProps}>
+		<slot {builder} />
+	</div>
 {/if}

package/dist/bits/alert-dialog/components/AlertDialogOverlay.svelte

@@ -1,17 +1,11 @@
 <script>import { melt } from "@melt-ui/svelte";
 import { ctx } from "../ctx.js";
 export let asChild = false;
-const {
-  elements: { overlay },
-  states: { open }
-} = ctx.get();
+const overlay = ctx.get().elements.overlay;
 </script>
 
-{#if $open}
-	{@const builder = $overlay}
-	{#if asChild}
-		<slot {builder} />
-	{:else}
-		<div {...builder} use:builder.action {...$$restProps} />
-	{/if}
+{#if asChild}
+	<slot builder={$overlay} />
+{:else}
+	<div {...$overlay} use:$overlay.action {...$$restProps} />
 {/if}

package/dist/bits/alert-dialog/components/AlertDialogOverlay.svelte.d.ts

@@ -216,7 +216,19 @@ declare const __propDef: {
     };
     slots: {
         default: {
-            builder: any;
+            builder: {
+                readonly hidden: true | undefined;
+                readonly tabindex: -1;
+                readonly style: string;
+                readonly 'aria-hidden': true;
+                readonly 'data-state': "open" | "closed";
+            } & {
+                [x: `data-melt-${string}`]: "";
+            } & {
+                action: <Node_2 extends unknown>(node: HTMLElement) => {
+                    destroy(): void;
+                };
+            };
         };
     };
 };

package/dist/bits/alert-dialog/components/AlertDialogPortal.svelte

@@ -7,11 +7,13 @@ const {
 } = ctx.get();
 </script>
 
-{#if asChild}
-	<slot builder={$portalled} />
-{:else}
+{#if $open}
 	{@const builder = $portalled}
-	<div {...builder} use:builder.action {...$$restProps}>
-		<slot {builder} />
-	</div>
+	{#if asChild}
+		<slot builder={$portalled} />
+	{:else}
+		<div {...builder} use:builder.action {...$$restProps}>
+			<slot {builder} />
+		</div>
+	{/if}
 {/if}

package/dist/bits/alert-dialog/ctx.js

@@ -5,7 +5,8 @@ const NAME = "AlertDialog";
 function set(props) {
     const alertDialog = createDialog({
         ...removeUndefined(props),
-        role: "alertdialog"
+        role: "alertdialog",
+        forceVisible: true
     });
     setContext(NAME, alertDialog);
     return {

package/dist/bits/context-menu/components/ContextMenuContent.svelte

@@ -1,5 +1,4 @@
-<script>import Overlay from "../../../internal/overlay.svelte";
-import { melt } from "@melt-ui/svelte";
+<script>import { melt } from "@melt-ui/svelte";
 import { ctx } from "../ctx.js";
 export let sideOffset = 5;
 export let transition = void 0;
@@ -12,17 +11,14 @@ const {
 </script>
 
 {#if $open}
-	<Overlay />
 	{@const builder = $menu}
 	{#if asChild}
 		<slot {builder} />
 	{:else if transition}
-		<Overlay />
 		<div {...builder} use:builder.action {...$$restProps} on:m-keydown transition:transition={transitionConfig}>
 			<slot {builder} />
 		</div>
 	{:else}
-		<Overlay />
 		<div {...builder} use:builder.action {...$$restProps} on:m-keydown>
 			<slot {builder} />
 		</div>

package/dist/bits/dialog/components/Dialog.svelte

@@ -3,7 +3,7 @@ export let preventScroll = void 0;
 export let closeOnEscape = void 0;
 export let closeOnOutsideClick = void 0;
 export let portal = void 0;
-export let forceVisible = true;
+export let forceVisible = void 0;
 export let open = void 0;
 export let onOpenChange = void 0;
 const {

package/dist/bits/dialog/components/DialogContent.svelte

@@ -3,24 +3,19 @@ import { ctx } from "../ctx.js";
 export let transition = void 0;
 export let transitionConfig = void 0;
 export let asChild = false;
-const {
-  elements: { content },
-  states: { open }
-} = ctx.get();
+const content = ctx.get().elements.content;
 </script>
 
-{#if $open}
-	{#if asChild}
-		<slot builder={$content} />
-	{:else if transition}
-		{@const builder = $content}
-		<div {...builder} use:builder.action {...$$restProps} transition:transition={transitionConfig}>
-			<slot {builder} />
-		</div>
-	{:else}
-		{@const builder = $content}
-		<div {...builder} use:builder.action {...$$restProps}>
-			<slot {builder} />
-		</div>
-	{/if}
+{#if asChild}
+	<slot builder={$content} />
+{:else if transition}
+	{@const builder = $content}
+	<div {...builder} use:builder.action {...$$restProps} transition:transition={transitionConfig}>
+		<slot {builder} />
+	</div>
+{:else}
+	{@const builder = $content}
+	<div {...builder} use:builder.action {...$$restProps}>
+		<slot {builder} />
+	</div>
 {/if}

package/dist/bits/dialog/components/DialogOverlay.svelte

@@ -1,17 +1,11 @@
 <script>import { melt } from "@melt-ui/svelte";
 import { ctx } from "../ctx.js";
 export let asChild = false;
-const {
-  elements: { overlay },
-  states: { open }
-} = ctx.get();
+const overlay = ctx.get().elements.overlay;
 </script>
 
-{#if $open}
-	{@const builder = $overlay}
-	{#if asChild}
-		<slot {builder} />
-	{:else}
-		<div {...builder} use:builder.action {...$$restProps} />
-	{/if}
+{#if asChild}
+	<slot builder={$overlay} />
+{:else}
+	<div {...$overlay} use:$overlay.action {...$$restProps} />
 {/if}

package/dist/bits/dialog/components/DialogOverlay.svelte.d.ts

@@ -216,7 +216,19 @@ declare const __propDef: {
     };
     slots: {
         default: {
-            builder: any;
+            builder: {
+                readonly hidden: true | undefined;
+                readonly tabindex: -1;
+                readonly style: string;
+                readonly 'aria-hidden': true;
+                readonly 'data-state': "open" | "closed";
+            } & {
+                [x: `data-melt-${string}`]: "";
+            } & {
+                action: <Node_2 extends unknown>(node: HTMLElement) => {
+                    destroy(): void;
+                };
+            };
         };
     };
 };

package/dist/bits/dialog/components/DialogPortal.svelte

@@ -1,10 +1,13 @@
 <script>import { melt } from "@melt-ui/svelte";
 import { ctx } from "../ctx.js";
 const {
-  elements: { portalled }
+  elements: { portalled },
+  states: { open }
 } = ctx.get();
 </script>
 
-<div {...$portalled} use:$portalled.action {...$$restProps}>
-	<slot />
-</div>
+{#if $open}
+	<div {...$portalled} use:$portalled.action {...$$restProps}>
+		<slot />
+	</div>
+{/if}

package/dist/bits/dialog/ctx.js

@@ -7,7 +7,7 @@ export const ctx = {
     get
 };
 function set(props) {
-    const dialog = createDialog({ ...removeUndefined(props), role: "dialog" });
+    const dialog = createDialog({ ...removeUndefined(props), role: "dialog", forceVisible: true });
     setContext(NAME, dialog);
     return {
         ...dialog,

package/dist/bits/dropdown-menu/components/DropdownMenuContent.svelte

@@ -1,5 +1,4 @@
-<script>import Overlay from "../../../internal/overlay.svelte";
-import { melt } from "@melt-ui/svelte";
+<script>import { melt } from "@melt-ui/svelte";
 import { ctx } from "../ctx.js";
 export let sideOffset = 5;
 export let transition = void 0;
@@ -13,7 +12,6 @@ const {
 
 <!-- svelte-ignore a11y-no-static-element-interactions applied by melt's action/store -->
 {#if $open}
-	<Overlay />
 	{@const builder = $menu}
 	{#if asChild}
 		<slot {builder} />

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

@@ -1,5 +1,4 @@
-<script>import Overlay from "../../../internal/overlay.svelte";
-import { melt } from "@melt-ui/svelte";
+<script>import { melt } from "@melt-ui/svelte";
 import { ctx } from "../ctx.js";
 export let transition = void 0;
 export let transitionConfig = void 0;
@@ -13,7 +12,6 @@ const {
 <!-- svelte-ignore a11y-no-static-element-interactions / applied by melt's builder-->
 
 {#if $open}
-	<Overlay />
 	{@const builder = $menu}
 	{#if asChild}
 		<slot {builder} />

package/dist/internal/helpers.d.ts

@@ -22,6 +22,4 @@ export declare function disabledAttrs(disabled: boolean): {
     "data-disabled"?: undefined;
 };
 export declare function bitWrap<T extends object>(storeValues: T, bit: string): T;
-export declare function sleep(ms: number): Promise<unknown>;
-export declare function styleToString(style: Record<string, number | string | undefined>): string;
 export {};

package/dist/internal/helpers.js

@@ -61,13 +61,3 @@ export function bitWrap(storeValues, bit) {
         [`data-bits-${bit}`]: ""
     };
 }
-export function sleep(ms) {
-    return new Promise((resolve) => setTimeout(resolve, ms));
-}
-export function styleToString(style) {
-    return Object.keys(style).reduce((str, key) => {
-        if (style[key] === undefined)
-            return str;
-        return str + `${key}:${style[key]};`;
-    }, "");
-}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bits-ui",
-  "version": "0.0.32",
+  "version": "0.0.33",
   "license": "MIT",
   "exports": {
     ".": {
@@ -47,7 +47,6 @@
     "svelte-wrap-balancer": "^0.0.4",
     "tailwind-variants": "^0.1.13",
     "tailwindcss": "^3.3.2",
-    "tailwindcss-animate": "^1.0.6",
     "tslib": "^2.4.1",
     "typescript": "^5.0.0",
     "unist-util-visit": "^5.0.0",

package/dist/internal/overlay.svelte

@@ -1,10 +0,0 @@
-<script>import { styleToString } from ".";
-</script>
-
-<div
-	style={styleToString({
-		position: "fixed",
-		inset: 0,
-		"z-index": 50
-	})}
-/>

package/dist/internal/overlay.svelte.d.ts

@@ -1,14 +0,0 @@
-import { SvelteComponent } from "svelte";
-declare const __propDef: {
-    props: Record<string, never>;
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-};
-export type OverlayProps = typeof __propDef.props;
-export type OverlayEvents = typeof __propDef.events;
-export type OverlaySlots = typeof __propDef.slots;
-export default class Overlay extends SvelteComponent<OverlayProps, OverlayEvents, OverlaySlots> {
-}
-export {};