@dryui/ui 0.3.0 → 0.4.0

package/dist/date-range-picker/date-range-picker-button-trigger.svelte

@@ -0,0 +1,77 @@
+<script lang="ts">
+	import type { Snippet } from 'svelte';
+	import type { HTMLButtonAttributes } from 'svelte/elements';
+	import Button from '../button/button.svelte';
+	import { getDateRangePickerCtx } from './context.svelte.js';
+	import { formatDate } from '@dryui/primitives';
+
+	interface Props extends Omit<HTMLButtonAttributes, 'children'> {
+		placeholder?: string;
+		children?: Snippet | undefined;
+	}
+
+	let { placeholder = 'Select date range', children, ...rest }: Props = $props();
+
+	const ctx = getDateRangePickerCtx();
+
+	$effect(() => {
+		const node = document.getElementById(ctx.triggerId);
+		if (node) {
+			ctx.triggerEl = node as HTMLButtonElement;
+		}
+		return () => {
+			if (ctx.triggerEl && ctx.triggerEl.id === ctx.triggerId) {
+				ctx.triggerEl = null;
+			}
+		};
+	});
+
+	const formatOpts: Intl.DateTimeFormatOptions = {
+		year: 'numeric',
+		month: 'short',
+		day: 'numeric'
+	};
+
+	const displayText = $derived.by(() => {
+		if (ctx.startDate && ctx.endDate) {
+			return `${formatDate(ctx.startDate, ctx.locale, formatOpts)} – ${formatDate(ctx.endDate, ctx.locale, formatOpts)}`;
+		}
+		if (ctx.startDate) {
+			return formatDate(ctx.startDate, ctx.locale, formatOpts);
+		}
+		return '';
+	});
+</script>
+
+<Button
+	variant="outline"
+	type="button"
+	id={ctx.triggerId}
+	aria-haspopup="dialog"
+	aria-expanded={ctx.open}
+	aria-controls={ctx.contentId}
+	data-state={ctx.open ? 'open' : 'closed'}
+	data-disabled={ctx.disabled ? '' : undefined}
+	disabled={ctx.disabled}
+	popovertarget={ctx.contentId}
+	{...rest}
+>
+	{#if children}
+		{@render children()}
+	{:else}
+		<span data-placeholder={!ctx.startDate ? '' : undefined}>
+			{displayText || placeholder}
+		</span>
+	{/if}
+	<svg
+		xmlns="http://www.w3.org/2000/svg"
+		viewBox="0 0 24 24"
+		fill="none"
+		stroke="currentColor"
+		stroke-width="2"
+		aria-hidden="true"
+		><rect x="3" y="4" width="18" height="17" rx="2" ry="2" /><path
+			d="M16 2v4M8 2v4M3 10h18"
+		/></svg
+	>
+</Button>

package/dist/date-range-picker/date-range-picker-button-trigger.svelte.d.ts

@@ -0,0 +1,9 @@
+import type { Snippet } from 'svelte';
+import type { HTMLButtonAttributes } from 'svelte/elements';
+interface Props extends Omit<HTMLButtonAttributes, 'children'> {
+    placeholder?: string;
+    children?: Snippet | undefined;
+}
+declare const DateRangePickerButtonTrigger: import("svelte").Component<Props, {}, "">;
+type DateRangePickerButtonTrigger = ReturnType<typeof DateRangePickerButtonTrigger>;
+export default DateRangePickerButtonTrigger;

package/dist/date-range-picker/date-range-picker-content.svelte.d.ts

@@ -1,8 +1,10 @@
 import type { Snippet } from 'svelte';
-import type { DateRangePickerContentProps } from './index.js';
-interface Props extends DateRangePickerContentProps {
-	children: Snippet;
+import type { HTMLAttributes } from 'svelte/elements';
+interface Props extends HTMLAttributes<HTMLDivElement> {
+    placement?: 'top' | 'top-start' | 'top-end' | 'bottom' | 'bottom-start' | 'bottom-end';
+    offset?: number;
+    children: Snippet;
 }
-declare const DateRangePickerContent: import('svelte').Component<Props, {}, ''>;
+declare const DateRangePickerContent: import("svelte").Component<Props, {}, "">;
 type DateRangePickerContent = ReturnType<typeof DateRangePickerContent>;
 export default DateRangePickerContent;

package/dist/date-range-picker/date-range-picker-root.svelte.d.ts

@@ -1,8 +1,14 @@
-import type { DateRangePickerRootProps } from './index.js';
-declare const DateRangePickerRoot: import('svelte').Component<
-	DateRangePickerRootProps,
-	{},
-	'open' | 'startDate' | 'endDate'
->;
+import type { Snippet } from 'svelte';
+interface Props {
+    open?: boolean;
+    startDate?: Date | null;
+    endDate?: Date | null;
+    locale?: string;
+    min?: Date | null;
+    max?: Date | null;
+    disabled?: boolean;
+    children: Snippet;
+}
+declare const DateRangePickerRoot: import("svelte").Component<Props, {}, "open" | "startDate" | "endDate">;
 type DateRangePickerRoot = ReturnType<typeof DateRangePickerRoot>;
 export default DateRangePickerRoot;

package/dist/date-range-picker/index.d.ts

@@ -1,9 +1,9 @@
 export type { DateRangePickerRootProps, DateRangePickerTriggerProps, DateRangePickerContentProps, DateRangePickerCalendarProps, DateRangePickerPresetProps } from '@dryui/primitives';
 import DateRangePickerRoot from './date-range-picker-root.svelte';
-import DateRangePickerTrigger from './date-range-picker-trigger.svelte';
+import DateRangePickerTrigger from './date-range-picker-button-trigger.svelte';
 import DateRangePickerContent from './date-range-picker-content.svelte';
-import DateRangePickerCalendar from './date-range-picker-calendar.svelte';
-import DateRangePickerPreset from './date-range-picker-preset.svelte';
+import DateRangePickerCalendar from './date-range-picker-button-calendar.svelte';
+import DateRangePickerPreset from './date-range-picker-button-preset.svelte';
 export declare const DateRangePicker: {
     Root: typeof DateRangePickerRoot;
     Trigger: typeof DateRangePickerTrigger;

package/dist/date-range-picker/index.js

@@ -1,8 +1,8 @@
 import DateRangePickerRoot from './date-range-picker-root.svelte';
-import DateRangePickerTrigger from './date-range-picker-trigger.svelte';
+import DateRangePickerTrigger from './date-range-picker-button-trigger.svelte';
 import DateRangePickerContent from './date-range-picker-content.svelte';
-import DateRangePickerCalendar from './date-range-picker-calendar.svelte';
-import DateRangePickerPreset from './date-range-picker-preset.svelte';
+import DateRangePickerCalendar from './date-range-picker-button-calendar.svelte';
+import DateRangePickerPreset from './date-range-picker-button-preset.svelte';
 export const DateRangePicker = {
     Root: DateRangePickerRoot,
     Trigger: DateRangePickerTrigger,

package/dist/date-time-input/date-time-input.svelte.d.ts

@@ -1,13 +1,13 @@
 import type { HTMLAttributes } from 'svelte/elements';
 interface Props extends HTMLAttributes<HTMLDivElement> {
-	value?: Date;
-	min?: Date;
-	max?: Date;
-	disabled?: boolean;
-	locale?: string;
-	name?: string;
-	size?: 'sm' | 'md' | 'lg';
+    value?: Date;
+    min?: Date;
+    max?: Date;
+    disabled?: boolean;
+    locale?: string;
+    name?: string;
+    size?: 'sm' | 'md' | 'lg';
 }
-declare const DateTimeInput: import('svelte').Component<Props, {}, 'value'>;
+declare const DateTimeInput: import("svelte").Component<Props, {}, "value">;
 type DateTimeInput = ReturnType<typeof DateTimeInput>;
 export default DateTimeInput;

package/dist/description-list/description-list-description.svelte.d.ts

@@ -1,8 +1,8 @@
 import type { Snippet } from 'svelte';
 import type { HTMLAttributes } from 'svelte/elements';
 interface Props extends HTMLAttributes<HTMLElement> {
-	children: Snippet;
+    children: Snippet;
 }
-declare const DescriptionListDescription: import('svelte').Component<Props, {}, ''>;
+declare const DescriptionListDescription: import("svelte").Component<Props, {}, "">;
 type DescriptionListDescription = ReturnType<typeof DescriptionListDescription>;
 export default DescriptionListDescription;

package/dist/description-list/description-list-item.svelte.d.ts

@@ -1,8 +1,8 @@
 import type { Snippet } from 'svelte';
 import type { HTMLAttributes } from 'svelte/elements';
 interface Props extends HTMLAttributes<HTMLDivElement> {
-	children: Snippet;
+    children: Snippet;
 }
-declare const DescriptionListItem: import('svelte').Component<Props, {}, ''>;
+declare const DescriptionListItem: import("svelte").Component<Props, {}, "">;
 type DescriptionListItem = ReturnType<typeof DescriptionListItem>;
 export default DescriptionListItem;

package/dist/description-list/description-list-root.svelte.d.ts

@@ -1,8 +1,8 @@
 import type { Snippet } from 'svelte';
 import type { HTMLAttributes } from 'svelte/elements';
 interface Props extends HTMLAttributes<HTMLDListElement> {
-	children: Snippet;
+    children: Snippet;
 }
-declare const DescriptionListRoot: import('svelte').Component<Props, {}, ''>;
+declare const DescriptionListRoot: import("svelte").Component<Props, {}, "">;
 type DescriptionListRoot = ReturnType<typeof DescriptionListRoot>;
 export default DescriptionListRoot;

package/dist/description-list/description-list-term.svelte.d.ts

@@ -1,8 +1,8 @@
 import type { Snippet } from 'svelte';
 import type { HTMLAttributes } from 'svelte/elements';
 interface Props extends HTMLAttributes<HTMLElement> {
-	children: Snippet;
+    children: Snippet;
 }
-declare const DescriptionListTerm: import('svelte').Component<Props, {}, ''>;
+declare const DescriptionListTerm: import("svelte").Component<Props, {}, "">;
 type DescriptionListTerm = ReturnType<typeof DescriptionListTerm>;
 export default DescriptionListTerm;

package/dist/diagram/diagram.svelte

@@ -265,7 +265,7 @@
 							data-part="node-texture"
 							width={node.width}
 							height={node.height}
-							rx={node.variant === 'pill' ? node.height / 2 : 16}
+							rx={16}
 							fill="url(#dry-diagram-{uid}-dots)"
 						/>
 					{/if}

package/dist/diagram/edge-routing.js

@@ -202,8 +202,10 @@ function buildVerticalBusPoints(endpoints, busY) {
 function buildPathFromCollapsed(collapsed) {
     if (collapsed.length === 0)
         return '';
-    if (collapsed.length === 1)
-        return `M ${collapsed[0].x} ${collapsed[0].y}`;
+    if (collapsed.length === 1) {
+        const p = collapsed[0];
+        return `M ${p.x} ${p.y}`;
+    }
     return collapsed
         .map((point, index) => (index === 0 ? `M ${point.x} ${point.y}` : `L ${point.x} ${point.y}`))
         .join(' ');

package/dist/diagram/layout.js

@@ -101,15 +101,12 @@ function orderWithinLayers(layers, adjacencyOut, adjacencyIn, clusterMap) {
     const posInLayer = new Map();
     // Initialize positions
     for (const layer of layers) {
-        for (let i = 0; i < layer.length; i++) {
-            posInLayer.set(layer[i], i);
-        }
+        layer.forEach((id, i) => posInLayer.set(id, i));
     }
-    // Down sweep
-    for (let i = 1; i < layers.length; i++) {
-        const sorted = layers[i].map((nodeId) => {
-            const preds = adjacencyIn.get(nodeId) || [];
-            const positions = preds
+    function resortLayer(layer, neighbors) {
+        const sorted = layer.map((nodeId) => {
+            const adj = neighbors.get(nodeId) ?? [];
+            const positions = adj
                 .map((p) => posInLayer.get(p))
                 .filter((p) => p !== undefined);
             const barycenter = positions.length > 0
@@ -118,37 +115,27 @@ function orderWithinLayers(layers, adjacencyOut, adjacencyIn, clusterMap) {
             return { id: nodeId, bary: barycenter };
         });
         sorted.sort((a, b) => a.bary - b.bary);
-        layers[i] = sorted.map((s) => s.id);
-        for (let j = 0; j < layers[i].length; j++) {
-            posInLayer.set(layers[i][j], j);
-        }
+        return sorted.map((s) => s.id);
+    }
+    // Down sweep
+    for (let i = 1; i < layers.length; i++) {
+        const next = resortLayer(layers[i], adjacencyIn);
+        layers[i] = next;
+        next.forEach((id, j) => posInLayer.set(id, j));
     }
     // Up sweep
     for (let i = layers.length - 2; i >= 0; i--) {
-        const sorted = layers[i].map((nodeId) => {
-            const succs = adjacencyOut.get(nodeId) || [];
-            const positions = succs
-                .map((s) => posInLayer.get(s))
-                .filter((p) => p !== undefined);
-            const barycenter = positions.length > 0
-                ? positions.reduce((a, b) => a + b, 0) / positions.length
-                : (posInLayer.get(nodeId) ?? 0);
-            return { id: nodeId, bary: barycenter };
-        });
-        sorted.sort((a, b) => a.bary - b.bary);
-        layers[i] = sorted.map((s) => s.id);
-        for (let j = 0; j < layers[i].length; j++) {
-            posInLayer.set(layers[i][j], j);
-        }
+        const next = resortLayer(layers[i], adjacencyOut);
+        layers[i] = next;
+        next.forEach((id, j) => posInLayer.set(id, j));
     }
     // Cluster-aware grouping: after barycenter ordering, group cluster members together
     // and push non-clustered nodes to the edges
     if (clusterMap && clusterMap.size > 0) {
         for (let i = 0; i < layers.length; i++) {
-            layers[i] = groupByCluster(layers[i], clusterMap, adjacencyIn, adjacencyOut, posInLayer);
-            for (let j = 0; j < layers[i].length; j++) {
-                posInLayer.set(layers[i][j], j);
-            }
+            const regrouped = groupByCluster(layers[i], clusterMap, adjacencyIn, adjacencyOut, posInLayer);
+            layers[i] = regrouped;
+            regrouped.forEach((id, j) => posInLayer.set(id, j));
         }
     }
     return layers;
@@ -253,7 +240,7 @@ function assignCoordinates(layers, nodeDims, direction, nodeGap, layerGap, clust
         const layer = layerOrder[li];
         const layerSize = sizeOrder[li];
         // Center this layer's nodes
-        const crossExtent = layerCrossExtents[reversed ? layerOrder.length - 1 - li : li];
+        const crossExtent = layerCrossExtents[reversed ? layerOrder.length - 1 - li : li] ?? 0;
         let crossOffset = MARGIN + (maxCrossExtent - crossExtent) / 2;
         for (let ni = 0; ni < layer.length; ni++) {
             const id = layer[ni];
@@ -839,17 +826,19 @@ function layoutSequence(config) {
     const actorXMap = new Map();
     const actorColorMap = new Map();
     for (let i = 0; i < actors.length; i++) {
+        const actor = actors[i];
         const x = MARGIN + i * SEQ_ACTOR_GAP + SEQ_ACTOR_GAP / 2;
-        actorXMap.set(actors[i].id, x);
-        actorColorMap.set(actors[i].id, actors[i].color || 'neutral');
+        actorXMap.set(actor.id, x);
+        actorColorMap.set(actor.id, actor.color || 'neutral');
     }
     // Compute message Y positions (increment per message)
     const messageStartY = SEQ_TOP_MARGIN + SEQ_ACTOR_BOX_HEIGHT + 30;
     const messageYPositions = [];
     let currentY = messageStartY;
     for (let i = 0; i < messages.length; i++) {
+        const msg = messages[i];
         messageYPositions.push(currentY);
-        const isSelf = messages[i].from === messages[i].to;
+        const isSelf = msg.from === msg.to;
         currentY += isSelf ? SEQ_MESSAGE_GAP + SEQ_SELF_LOOP_HEIGHT : SEQ_MESSAGE_GAP;
     }
     // Bottom of the diagram
@@ -869,7 +858,7 @@ function layoutSequence(config) {
     const positionedMessages = messages.map((msg, i) => {
         const fromX = actorXMap.get(msg.from) ?? 0;
         const toX = actorXMap.get(msg.to) ?? 0;
-        const y = messageYPositions[i];
+        const y = messageYPositions[i] ?? messageStartY;
         const isSelf = msg.from === msg.to;
         let labelX;
         let labelY;

package/dist/dialog/dialog-body.svelte.d.ts

@@ -1,8 +1,8 @@
 import type { Snippet } from 'svelte';
 import type { HTMLAttributes } from 'svelte/elements';
 interface Props extends HTMLAttributes<HTMLDivElement> {
-	children: Snippet;
+    children: Snippet;
 }
-declare const DialogBody: import('svelte').Component<Props, {}, ''>;
+declare const DialogBody: import("svelte").Component<Props, {}, "">;
 type DialogBody = ReturnType<typeof DialogBody>;
 export default DialogBody;

package/dist/dialog/dialog-close.svelte.d.ts

@@ -1,8 +1,8 @@
 import type { Snippet } from 'svelte';
 import type { HTMLButtonAttributes } from 'svelte/elements';
 interface Props extends HTMLButtonAttributes {
-	children: Snippet;
+    children: Snippet;
 }
-declare const DialogClose: import('svelte').Component<Props, {}, ''>;
+declare const DialogClose: import("svelte").Component<Props, {}, "">;
 type DialogClose = ReturnType<typeof DialogClose>;
 export default DialogClose;

package/dist/dialog/dialog-content.svelte.d.ts

@@ -1,8 +1,8 @@
 import type { Snippet } from 'svelte';
 import type { HTMLAttributes } from 'svelte/elements';
 interface Props extends HTMLAttributes<HTMLDialogElement> {
-	children: Snippet;
+    children: Snippet;
 }
-declare const DialogContent: import('svelte').Component<Props, {}, ''>;
+declare const DialogContent: import("svelte").Component<Props, {}, "">;
 type DialogContent = ReturnType<typeof DialogContent>;
 export default DialogContent;

package/dist/dialog/dialog-footer.svelte.d.ts

@@ -1,8 +1,8 @@
 import type { Snippet } from 'svelte';
 import type { HTMLAttributes } from 'svelte/elements';
 interface Props extends HTMLAttributes<HTMLDivElement> {
-	children: Snippet;
+    children: Snippet;
 }
-declare const DialogFooter: import('svelte').Component<Props, {}, ''>;
+declare const DialogFooter: import("svelte").Component<Props, {}, "">;
 type DialogFooter = ReturnType<typeof DialogFooter>;
 export default DialogFooter;

package/dist/dialog/dialog-header.svelte.d.ts

@@ -1,8 +1,8 @@
 import type { Snippet } from 'svelte';
 import type { HTMLAttributes } from 'svelte/elements';
 interface Props extends HTMLAttributes<HTMLDivElement> {
-	children: Snippet;
+    children: Snippet;
 }
-declare const DialogHeader: import('svelte').Component<Props, {}, ''>;
+declare const DialogHeader: import("svelte").Component<Props, {}, "">;
 type DialogHeader = ReturnType<typeof DialogHeader>;
 export default DialogHeader;

package/dist/dialog/dialog-overlay.svelte.d.ts

@@ -1,5 +1,6 @@
 import type { HTMLAttributes } from 'svelte/elements';
-interface Props extends HTMLAttributes<HTMLDivElement> {}
-declare const DialogOverlay: import('svelte').Component<Props, {}, ''>;
+interface Props extends HTMLAttributes<HTMLDivElement> {
+}
+declare const DialogOverlay: import("svelte").Component<Props, {}, "">;
 type DialogOverlay = ReturnType<typeof DialogOverlay>;
 export default DialogOverlay;

package/dist/dialog/dialog-root.svelte.d.ts

@@ -1,8 +1,8 @@
 import type { Snippet } from 'svelte';
 interface Props {
-	open?: boolean;
-	children: Snippet;
+    open?: boolean;
+    children: Snippet;
 }
-declare const DialogRoot: import('svelte').Component<Props, {}, 'open'>;
+declare const DialogRoot: import("svelte").Component<Props, {}, "open">;
 type DialogRoot = ReturnType<typeof DialogRoot>;
 export default DialogRoot;

package/dist/dialog/dialog-trigger.svelte.d.ts

@@ -1,8 +1,8 @@
 import type { Snippet } from 'svelte';
 import type { HTMLAttributes } from 'svelte/elements';
 interface Props extends HTMLAttributes<HTMLDivElement> {
-	children: Snippet;
+    children: Snippet;
 }
-declare const DialogTrigger: import('svelte').Component<Props, {}, ''>;
+declare const DialogTrigger: import("svelte").Component<Props, {}, "">;
 type DialogTrigger = ReturnType<typeof DialogTrigger>;
 export default DialogTrigger;

package/dist/displacement/displacement.svelte.d.ts

@@ -1,12 +1,11 @@
 import type { Snippet } from 'svelte';
 import type { HTMLAttributes } from 'svelte/elements';
-import { type DisplacementProps as PrimitiveDisplacementProps } from '@dryui/primitives/displacement';
 interface Props extends HTMLAttributes<HTMLDivElement> {
-	scale?: PrimitiveDisplacementProps['scale'];
-	turbulence?: PrimitiveDisplacementProps['turbulence'];
-	animated?: PrimitiveDisplacementProps['animated'];
-	children: Snippet;
+    scale?: number;
+    turbulence?: 'gentle' | 'medium' | 'rough';
+    animated?: boolean;
+    children: Snippet;
 }
-declare const Displacement: import('svelte').Component<Props, {}, ''>;
+declare const Displacement: import("svelte").Component<Props, {}, "">;
 type Displacement = ReturnType<typeof Displacement>;
 export default Displacement;

package/dist/drag-and-drop/drag-and-drop-handle.svelte.d.ts

@@ -1,9 +1,9 @@
 import type { Snippet } from 'svelte';
 import type { HTMLAttributes } from 'svelte/elements';
-interface Props extends HTMLAttributes<HTMLDivElement> {
-	index: number;
-	children?: Snippet;
+interface Props extends Omit<HTMLAttributes<HTMLDivElement>, 'children'> {
+    index: number;
+    children?: Snippet | undefined;
 }
-declare const DragAndDropHandle: import('svelte').Component<Props, {}, ''>;
+declare const DragAndDropHandle: import("svelte").Component<Props, {}, "">;
 type DragAndDropHandle = ReturnType<typeof DragAndDropHandle>;
 export default DragAndDropHandle;

package/dist/drag-and-drop/drag-and-drop-item.svelte.d.ts

@@ -1,16 +1,12 @@
 import type { Snippet } from 'svelte';
 import type { HTMLAttributes } from 'svelte/elements';
 interface Props extends Omit<HTMLAttributes<HTMLDivElement>, 'children'> {
-	index: number;
-	children: Snippet<
-		[
-			{
-				isDragging: boolean;
-				isOver: boolean;
-			}
-		]
-	>;
+    index: number;
+    children: Snippet<[{
+        isDragging: boolean;
+        isOver: boolean;
+    }]>;
 }
-declare const DragAndDropItem: import('svelte').Component<Props, {}, ''>;
+declare const DragAndDropItem: import("svelte").Component<Props, {}, "">;
 type DragAndDropItem = ReturnType<typeof DragAndDropItem>;
 export default DragAndDropItem;

package/dist/drag-and-drop/drag-and-drop-root.svelte.d.ts

@@ -1,39 +1,31 @@
 import type { Snippet } from 'svelte';
 import type { HTMLAttributes } from 'svelte/elements';
 declare function $$render<T>(): {
-	props: HTMLAttributes<HTMLDivElement> & {
-		items: T[];
-		onReorder: (items: T[]) => void;
-		orientation?: 'vertical' | 'horizontal';
-		children: Snippet;
-	};
-	exports: {};
-	bindings: '';
-	slots: {};
-	events: {};
+    props: HTMLAttributes<HTMLDivElement> & {
+        items: T[];
+        onReorder: (items: T[]) => void;
+        orientation?: "vertical" | "horizontal";
+        listId?: string;
+        children: Snippet;
+    };
+    exports: {};
+    bindings: "";
+    slots: {};
+    events: {};
 };
 declare class __sveltets_Render<T> {
-	props(): ReturnType<typeof $$render<T>>['props'];
-	events(): ReturnType<typeof $$render<T>>['events'];
-	slots(): ReturnType<typeof $$render<T>>['slots'];
-	bindings(): '';
-	exports(): {};
+    props(): ReturnType<typeof $$render<T>>['props'];
+    events(): ReturnType<typeof $$render<T>>['events'];
+    slots(): ReturnType<typeof $$render<T>>['slots'];
+    bindings(): "";
+    exports(): {};
 }
 interface $$IsomorphicComponent {
-	new <T>(
-		options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<T>['props']>>
-	): import('svelte').SvelteComponent<
-		ReturnType<__sveltets_Render<T>['props']>,
-		ReturnType<__sveltets_Render<T>['events']>,
-		ReturnType<__sveltets_Render<T>['slots']>
-	> & {
-		$$bindings?: ReturnType<__sveltets_Render<T>['bindings']>;
-	} & ReturnType<__sveltets_Render<T>['exports']>;
-	<T>(
-		internal: unknown,
-		props: ReturnType<__sveltets_Render<T>['props']> & {}
-	): ReturnType<__sveltets_Render<T>['exports']>;
-	z_$$bindings?: ReturnType<__sveltets_Render<any>['bindings']>;
+    new <T>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<T>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<T>['props']>, ReturnType<__sveltets_Render<T>['events']>, ReturnType<__sveltets_Render<T>['slots']>> & {
+        $$bindings?: ReturnType<__sveltets_Render<T>['bindings']>;
+    } & ReturnType<__sveltets_Render<T>['exports']>;
+    <T>(internal: unknown, props: ReturnType<__sveltets_Render<T>['props']> & {}): ReturnType<__sveltets_Render<T>['exports']>;
+    z_$$bindings?: ReturnType<__sveltets_Render<any>['bindings']>;
 }
 declare const DragAndDropRoot: $$IsomorphicComponent;
 type DragAndDropRoot<T> = InstanceType<typeof DragAndDropRoot<T>>;

package/dist/drawer/drawer-body.svelte.d.ts

@@ -1,9 +1,9 @@
 import type { Snippet } from 'svelte';
 import type { HTMLAttributes } from 'svelte/elements';
 interface Props extends HTMLAttributes<HTMLDivElement> {
-	children: Snippet;
-	padding?: boolean;
+    padding?: boolean;
+    children: Snippet;
 }
-declare const DrawerBody: import('svelte').Component<Props, {}, ''>;
+declare const DrawerBody: import("svelte").Component<Props, {}, "">;
 type DrawerBody = ReturnType<typeof DrawerBody>;
 export default DrawerBody;

package/dist/drawer/drawer-close.svelte.d.ts

@@ -1,8 +1,8 @@
 import type { Snippet } from 'svelte';
 import type { HTMLButtonAttributes } from 'svelte/elements';
 interface Props extends HTMLButtonAttributes {
-	children: Snippet;
+    children: Snippet;
 }
-declare const DrawerClose: import('svelte').Component<Props, {}, ''>;
+declare const DrawerClose: import("svelte").Component<Props, {}, "">;
 type DrawerClose = ReturnType<typeof DrawerClose>;
 export default DrawerClose;

package/dist/drawer/{drawer-content.svelte → drawer-dialog-content.svelte}

@@ -45,7 +45,7 @@
 
 <style>
 	[data-drawer-content] {
-		all: unset;
+		margin: 0;
 		position: fixed;
 		inset: 0;
 		height: 100vh;

package/dist/drawer/drawer-dialog-content.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { Snippet } from 'svelte';
+import type { HTMLAttributes } from 'svelte/elements';
+interface Props extends HTMLAttributes<HTMLDialogElement> {
+    children: Snippet;
+}
+declare const DrawerDialogContent: import("svelte").Component<Props, {}, "">;
+type DrawerDialogContent = ReturnType<typeof DrawerDialogContent>;
+export default DrawerDialogContent;

package/dist/drawer/drawer-footer.svelte.d.ts

@@ -1,8 +1,8 @@
 import type { Snippet } from 'svelte';
 import type { HTMLAttributes } from 'svelte/elements';
 interface Props extends HTMLAttributes<HTMLDivElement> {
-	children: Snippet;
+    children: Snippet;
 }
-declare const DrawerFooter: import('svelte').Component<Props, {}, ''>;
+declare const DrawerFooter: import("svelte").Component<Props, {}, "">;
 type DrawerFooter = ReturnType<typeof DrawerFooter>;
 export default DrawerFooter;