@svelte-atoms/core 1.0.0-alpha.26 → 1.0.0-alpha.27

package/dist/components/dialog/types.d.ts

@@ -0,0 +1,67 @@
+import type { Snippet } from 'svelte';
+import type { HtmlAtomProps, Base } from '../atom';
+import type { PortalBond } from '../portal';
+import type { DialogBond, DialogBondProps } from './bond.svelte';
+/**
+ * Extend this interface to add custom dialog root properties in your application.
+ */
+export interface DialogExtendProps {
+}
+/**
+ * Extend this interface to add custom dialog content properties in your application.
+ */
+export interface DialogContentExtendProps {
+}
+/**
+ * Extend this interface to add custom dialog header properties in your application.
+ */
+export interface DialogHeaderExtendProps {
+}
+/**
+ * Extend this interface to add custom dialog body properties in your application.
+ */
+export interface DialogBodyExtendProps {
+}
+/**
+ * Extend this interface to add custom dialog footer properties in your application.
+ */
+export interface DialogFooterExtendProps {
+}
+/**
+ * Extend this interface to add custom dialog title properties in your application.
+ */
+export interface DialogTitleExtendProps {
+}
+/**
+ * Extend this interface to add custom dialog description properties in your application.
+ */
+export interface DialogDescriptionExtendProps {
+}
+/**
+ * Extend this interface to add custom dialog close button properties in your application.
+ */
+export interface DialogCloseButtonExtendProps {
+}
+export interface DialogProps<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base> extends Omit<HtmlAtomProps<E, B>, 'children'>, DialogExtendProps {
+    open?: boolean;
+    disabled?: boolean;
+    portal?: string | PortalBond;
+    factory?: (props: DialogBondProps) => DialogBond;
+    children?: Snippet<[{
+        dialog: DialogBond;
+    }]>;
+}
+export interface DialogContentProps<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base> extends HtmlAtomProps<E, B>, DialogContentExtendProps {
+}
+export interface DialogHeaderProps<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base> extends HtmlAtomProps<E, B>, DialogHeaderExtendProps {
+}
+export interface DialogBodyProps<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base> extends HtmlAtomProps<E, B>, DialogBodyExtendProps {
+}
+export interface DialogFooterProps<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base> extends HtmlAtomProps<E, B>, DialogFooterExtendProps {
+}
+export interface DialogTitleProps<E extends keyof HTMLElementTagNameMap = 'h2', B extends Base = Base> extends HtmlAtomProps<E, B>, DialogTitleExtendProps {
+}
+export interface DialogDescriptionProps<E extends keyof HTMLElementTagNameMap = 'p', B extends Base = Base> extends HtmlAtomProps<E, B>, DialogDescriptionExtendProps {
+}
+export interface DialogCloseButtonProps<E extends keyof HTMLElementTagNameMap = 'button', B extends Base = Base> extends HtmlAtomProps<E, B>, DialogCloseButtonExtendProps {
+}

package/dist/components/dialog/types.js

@@ -0,0 +1 @@
+export {};

package/dist/components/divider/types.d.ts

@@ -0,0 +1,10 @@
+import type { HtmlAtomProps, Base } from '../atom';
+/**
+ * Extend this interface to add custom divider properties in your application.
+ */
+export interface DividerExtendProps {
+}
+export interface DividerProps<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base> extends HtmlAtomProps<E, B>, DividerExtendProps {
+    vertical?: boolean;
+    transparent?: boolean;
+}

package/dist/components/divider/types.js

@@ -0,0 +1 @@
+export {};

package/dist/components/drawer/drawer-backdrop.svelte

@@ -1,47 +1,38 @@
-<script module lang="ts">
-	export type SlideoverBackdropProps<
-		E extends keyof HTMLElementTagNameMap,
-		B extends Base = Base
-	> = HtmlAtomProps<E, B> & {
-		as?: E;
-		class?: string;
-	};
-</script>
-
-<script lang="ts" generics="E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base">
-	import type { HTMLAttributes } from 'svelte/elements';
-	import { HtmlAtom, type HtmlAtomProps, type Base } from '../atom';
-	import { DrawerBond } from './bond.svelte';
-
-	type Element = HTMLElementTagNameMap[E];
-
-	const bond = DrawerBond.get();
-
-	let {
-		class: klass = '',
-		onmount = undefined,
-		ondestroy = undefined,
-		animate = undefined,
-		enter = undefined,
-		exit = undefined,
-		initial = undefined,
-		...restProps
-	}: SlideoverBackdropProps<E, B> & HTMLAttributes<Element> = $props();
-
-	const backdropProps = $derived({
-		...restProps
-	});
-</script>
-
-<HtmlAtom
-	{bond}
-	preset="drawer.backdrop"
-	class={['border-border absolute inset-0 z-0 bg-black/30', '$preset', klass]}
-	onmount={onmount?.bind(bond.state)}
-	ondestroy={ondestroy?.bind(bond.state)}
-	enter={enter?.bind(bond.state)}
-	exit={exit?.bind(bond.state)}
-	initial={initial?.bind(bond.state)}
-	animate={animate?.bind(bond.state)}
-	{...backdropProps}
-/>
+<script lang="ts" generics="E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base">
+	import type { HTMLAttributes } from 'svelte/elements';
+	import type { SlideoverBackdropProps } from './types';
+	import { HtmlAtom, type Base } from '../atom';
+	import { DrawerBond } from './bond.svelte';
+
+	type Element = HTMLElementTagNameMap[E];
+
+	const bond = DrawerBond.get();
+
+	let {
+		class: klass = '',
+		onmount = undefined,
+		ondestroy = undefined,
+		animate = undefined,
+		enter = undefined,
+		exit = undefined,
+		initial = undefined,
+		...restProps
+	}: SlideoverBackdropProps<E, B> & HTMLAttributes<Element> = $props();
+
+	const backdropProps = $derived({
+		...restProps
+	});
+</script>
+
+<HtmlAtom
+	{bond}
+	preset="drawer.backdrop"
+	class={['border-border absolute inset-0 z-0 bg-black/30', '$preset', klass]}
+	onmount={onmount?.bind(bond.state)}
+	ondestroy={ondestroy?.bind(bond.state)}
+	enter={enter?.bind(bond.state)}
+	exit={exit?.bind(bond.state)}
+	initial={initial?.bind(bond.state)}
+	animate={animate?.bind(bond.state)}
+	{...backdropProps}
+/>

package/dist/components/drawer/drawer-backdrop.svelte.d.ts

@@ -1,31 +1,8 @@
-export type SlideoverBackdropProps<E extends keyof HTMLElementTagNameMap, B extends Base = Base> = HtmlAtomProps<E, B> & {
-    as?: E;
-    class?: string;
-};
 import type { HTMLAttributes } from 'svelte/elements';
-import { type HtmlAtomProps, type Base } from '../atom';
+import type { SlideoverBackdropProps } from './types';
+import { type Base } from '../atom';
 declare function $$render<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base>(): {
-    props: Record<string, unknown> & {
-        [key: string]: unknown;
-        class?: import("../..").ClassValue | import("../..").ClassValue[];
-        as?: (string & {}) | E | undefined;
-        global?: boolean;
-        initial?: import("..").NodeFunction<E> | undefined;
-        enter?: import("..").TransitionFunction<E> | undefined;
-        exit?: import("..").TransitionFunction<E> | undefined;
-        animate?: import("..").NodeFunction<E> | undefined;
-        onmount?: import("..").NodeFunction<E> | undefined;
-        ondestroy?: import("..").NodeFunction<E> | undefined;
-        children?: import("svelte").Snippet;
-    } & {
-        bond?: import("../..").Bond;
-        base?: B | undefined;
-        preset?: import("../..").ModuleName | (string & {});
-        variants?: import("../..").VariantDefinition<any> | ((bond: import("../..").Bond, variantProps: Record<string, any>) => Record<string, any>);
-    } & {
-        as?: E | undefined;
-        class?: string;
-    } & HTMLAttributes<HTMLElementTagNameMap[E]>;
+    props: SlideoverBackdropProps<E, B> & HTMLAttributes<HTMLElementTagNameMap[E]>;
     exports: {};
     bindings: "";
     slots: {};

package/dist/components/drawer/drawer-body.svelte

@@ -1,56 +1,42 @@
-<script module lang="ts">
-	export type DrawerBodyProps<
-		E extends keyof HTMLElementTagNameMap,
-		B extends Base = Base
-	> = Override<
-		HtmlAtomProps<E, B>,
-		{
-			as?: E;
-			children?: Snippet<[{ drawer?: DrawerBond }]>;
-		}
-	>;
-</script>
-
-<script lang="ts" generics="E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base">
-	import type { Snippet } from 'svelte';
-	import type { HTMLAttributes } from 'svelte/elements';
-	import type { Override } from '../../types';
-	import { DrawerBond } from './bond.svelte';
-	import { HtmlAtom, type HtmlAtomProps, type Base } from '../atom';
-
-	type Element = HTMLElementTagNameMap[E];
-
-	let {
-		class: klass = '',
-		children = undefined,
-		onmount = undefined,
-		ondestroy = undefined,
-		animate = undefined,
-		enter = undefined,
-		exit = undefined,
-		initial = undefined,
-		...restProps
-	}: DrawerBodyProps<E, B> & HTMLAttributes<Element> = $props();
-
-	const bond = DrawerBond.get();
-
-	const bodyProps = $derived({
-		...bond?.body(),
-		...restProps
-	});
-</script>
-
-<HtmlAtom
-	{bond}
-	preset="drawer.body"
-	class={['border-border', '$preset', klass]}
-	onmount={onmount?.bind(bond.state)}
-	ondestroy={ondestroy?.bind(bond.state)}
-	enter={enter?.bind(bond.state)}
-	exit={exit?.bind(bond.state)}
-	initial={initial?.bind(bond.state)}
-	animate={animate?.bind(bond.state)}
-	{...bodyProps}
->
-	{@render children?.({ drawer: bond })}
-</HtmlAtom>
+<script lang="ts" generics="E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base">
+	import type { HTMLAttributes } from 'svelte/elements';
+	import type { DrawerBodyProps } from './types';
+	import { DrawerBond } from './bond.svelte';
+	import { HtmlAtom, type Base } from '../atom';
+
+	type Element = HTMLElementTagNameMap[E];
+
+	let {
+		class: klass = '',
+		children = undefined,
+		onmount = undefined,
+		ondestroy = undefined,
+		animate = undefined,
+		enter = undefined,
+		exit = undefined,
+		initial = undefined,
+		...restProps
+	}: DrawerBodyProps<E, B> & HTMLAttributes<Element> = $props();
+
+	const bond = DrawerBond.get();
+
+	const bodyProps = $derived({
+		...bond?.body(),
+		...restProps
+	});
+</script>
+
+<HtmlAtom
+	{bond}
+	preset="drawer.body"
+	class={['border-border', '$preset', klass]}
+	onmount={onmount?.bind(bond.state)}
+	ondestroy={ondestroy?.bind(bond.state)}
+	enter={enter?.bind(bond.state)}
+	exit={exit?.bind(bond.state)}
+	initial={initial?.bind(bond.state)}
+	animate={animate?.bind(bond.state)}
+	{...bodyProps}
+>
+	{@render children?.({ drawer: bond })}
+</HtmlAtom>

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

@@ -1,21 +1,8 @@
-export type DrawerBodyProps<E extends keyof HTMLElementTagNameMap, B extends Base = Base> = Override<HtmlAtomProps<E, B>, {
-    as?: E;
-    children?: Snippet<[{
-        drawer?: DrawerBond;
-    }]>;
-}>;
-import type { Snippet } from 'svelte';
 import type { HTMLAttributes } from 'svelte/elements';
-import type { Override } from '../../types';
-import { DrawerBond } from './bond.svelte';
-import { type HtmlAtomProps, type Base } from '../atom';
+import type { DrawerBodyProps } from './types';
+import { type Base } from '../atom';
 declare function $$render<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base>(): {
-    props: Omit<HtmlAtomProps<E, B>, "as" | "children"> & {
-        as?: E | undefined;
-        children?: Snippet<[{
-            drawer?: DrawerBond;
-        }]>;
-    } & HTMLAttributes<HTMLElementTagNameMap[E]>;
+    props: DrawerBodyProps<E, B> & HTMLAttributes<HTMLElementTagNameMap[E]>;
     exports: {};
     bindings: "";
     slots: {};

package/dist/components/drawer/drawer-content.svelte

@@ -1,55 +1,42 @@
-<script module lang="ts">
-	export type SlideoverContentProps<
-		E extends keyof HTMLElementTagNameMap,
-		B extends Base = Base
-	> = Override<
-		HtmlAtomProps<E, B>,
-		{
-			children?: Snippet<[{ drawer?: DrawerBond }]>;
-		}
-	>;
-</script>
-
-<script lang="ts" generics="E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base">
-	import type { Snippet } from 'svelte';
-	import type { HTMLAttributes } from 'svelte/elements';
-	import { DrawerBond } from './bond.svelte';
-	import type { Override } from '../../types';
-	import { HtmlAtom, type HtmlAtomProps, type Base } from '../atom';
-
-	type Element = HTMLElementTagNameMap[E];
-
-	const bond = DrawerBond.get();
-
-	let {
-		class: klass = '',
-		children = undefined,
-		onmount = undefined,
-		ondestroy = undefined,
-		animate = undefined,
-		enter = undefined,
-		exit = undefined,
-		initial = undefined,
-		...restProps
-	}: SlideoverContentProps<E, B> & HTMLAttributes<Element> = $props();
-
-	const contentProps = $derived({
-		...bond?.content(),
-		...restProps
-	});
-</script>
-
-<HtmlAtom
-	preset="drawer.content"
-	class={['bg-card text-foreground border-border absolute', '$preset', klass]}
-	{bond}
-	onmount={onmount?.bind(bond.state)}
-	ondestroy={ondestroy?.bind(bond.state)}
-	enter={enter?.bind(bond.state)}
-	exit={exit?.bind(bond.state)}
-	initial={initial?.bind(bond.state)}
-	animate={animate?.bind(bond.state)}
-	{...contentProps}
->
-	{@render children?.({ drawer: bond })}
-</HtmlAtom>
+<script lang="ts" generics="E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base">
+	import type { HTMLAttributes } from 'svelte/elements';
+	import { HtmlAtom, type Base } from '../atom';
+	import type { SlideoverContentProps } from './types';
+	import { DrawerBond } from './bond.svelte';
+
+	type Element = HTMLElementTagNameMap[E];
+
+	const bond = DrawerBond.get();
+
+	let {
+		class: klass = '',
+		children = undefined,
+		onmount = undefined,
+		ondestroy = undefined,
+		animate = undefined,
+		enter = undefined,
+		exit = undefined,
+		initial = undefined,
+		...restProps
+	}: SlideoverContentProps<E, B> & HTMLAttributes<Element> = $props();
+
+	const contentProps = $derived({
+		...bond?.content(),
+		...restProps
+	});
+</script>
+
+<HtmlAtom
+	preset="drawer.content"
+	class={['bg-card text-foreground border-border absolute', '$preset', klass]}
+	{bond}
+	onmount={onmount?.bind(bond.state)}
+	ondestroy={ondestroy?.bind(bond.state)}
+	enter={enter?.bind(bond.state)}
+	exit={exit?.bind(bond.state)}
+	initial={initial?.bind(bond.state)}
+	animate={animate?.bind(bond.state)}
+	{...contentProps}
+>
+	{@render children?.({ drawer: bond })}
+</HtmlAtom>

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

@@ -1,19 +1,8 @@
-export type SlideoverContentProps<E extends keyof HTMLElementTagNameMap, B extends Base = Base> = Override<HtmlAtomProps<E, B>, {
-    children?: Snippet<[{
-        drawer?: DrawerBond;
-    }]>;
-}>;
-import type { Snippet } from 'svelte';
 import type { HTMLAttributes } from 'svelte/elements';
-import { DrawerBond } from './bond.svelte';
-import type { Override } from '../../types';
-import { type HtmlAtomProps, type Base } from '../atom';
+import { type Base } from '../atom';
+import type { SlideoverContentProps } from './types';
 declare function $$render<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base>(): {
-    props: Omit<HtmlAtomProps<E, B>, "children"> & {
-        children?: Snippet<[{
-            drawer?: DrawerBond;
-        }]>;
-    } & HTMLAttributes<HTMLElementTagNameMap[E]>;
+    props: SlideoverContentProps<E, B> & HTMLAttributes<HTMLElementTagNameMap[E]>;
     exports: {};
     bindings: "";
     slots: {};

package/dist/components/drawer/drawer-description.svelte

@@ -1,57 +1,44 @@
-<script module lang="ts">
-	export type SlideoverDescriptionProps<
-		E extends keyof HTMLElementTagNameMap,
-		B extends Base = Base
-	> = Override<
-		HtmlAtomProps<E, B>,
-		{
-			children?: Snippet<[{ drawer?: DrawerBond }]>;
-		}
-	>;
-</script>
-
-<script lang="ts" generics="E extends keyof HTMLElementTagNameMap = 'p', B extends Base = Base">
-	import type { Snippet } from 'svelte';
-	import type { HTMLAttributes } from 'svelte/elements';
-	import { DrawerBond } from './bond.svelte';
-	import type { Override } from '../../types';
-	import { HtmlAtom, type HtmlAtomProps, type Base } from '../atom';
-
-	type Element = HTMLElementTagNameMap[E];
-
-	const bond = DrawerBond.get();
-
-	let {
-		class: klass = '',
-		as = 'p' as E,
-		children,
-		onmount = undefined,
-		ondestroy = undefined,
-		animate = undefined,
-		enter = undefined,
-		exit = undefined,
-		initial = undefined,
-		...restProps
-	}: SlideoverDescriptionProps<E, B> & HTMLAttributes<Element> = $props();
-
-	const descriptionProps = $derived({
-		...bond?.description(),
-		...restProps
-	});
-</script>
-
-<HtmlAtom
-	{as}
-	{bond}
-	preset="drawer.description"
-	class={['border-border', '$preset', klass]}
-	onmount={onmount?.bind(bond.state)}
-	ondestroy={ondestroy?.bind(bond.state)}
-	enter={enter?.bind(bond.state)}
-	exit={exit?.bind(bond.state)}
-	initial={initial?.bind(bond.state)}
-	animate={animate?.bind(bond.state)}
-	{...descriptionProps}
->
-	{@render children?.({ drawer: bond })}
-</HtmlAtom>
+<script lang="ts" generics="E extends keyof HTMLElementTagNameMap = 'p', B extends Base = Base">
+	import type { HTMLAttributes } from 'svelte/elements';
+	import type { SlideoverDescriptionProps } from './types';
+	import { DrawerBond } from './bond.svelte';
+	import { HtmlAtom, type Base } from '../atom';
+
+	type Element = HTMLElementTagNameMap[E];
+
+	const bond = DrawerBond.get();
+
+	let {
+		class: klass = '',
+		as = 'p' as E,
+		children,
+		onmount = undefined,
+		ondestroy = undefined,
+		animate = undefined,
+		enter = undefined,
+		exit = undefined,
+		initial = undefined,
+		...restProps
+	}: SlideoverDescriptionProps<E, B> & HTMLAttributes<Element> = $props();
+
+	const descriptionProps = $derived({
+		...bond?.description(),
+		...restProps
+	});
+</script>
+
+<HtmlAtom
+	{as}
+	{bond}
+	preset="drawer.description"
+	class={['border-border', '$preset', klass]}
+	onmount={onmount?.bind(bond.state)}
+	ondestroy={ondestroy?.bind(bond.state)}
+	enter={enter?.bind(bond.state)}
+	exit={exit?.bind(bond.state)}
+	initial={initial?.bind(bond.state)}
+	animate={animate?.bind(bond.state)}
+	{...descriptionProps}
+>
+	{@render children?.({ drawer: bond })}
+</HtmlAtom>

package/dist/components/drawer/drawer-description.svelte.d.ts

@@ -1,19 +1,8 @@
-export type SlideoverDescriptionProps<E extends keyof HTMLElementTagNameMap, B extends Base = Base> = Override<HtmlAtomProps<E, B>, {
-    children?: Snippet<[{
-        drawer?: DrawerBond;
-    }]>;
-}>;
-import type { Snippet } from 'svelte';
 import type { HTMLAttributes } from 'svelte/elements';
-import { DrawerBond } from './bond.svelte';
-import type { Override } from '../../types';
-import { type HtmlAtomProps, type Base } from '../atom';
+import type { SlideoverDescriptionProps } from './types';
+import { type Base } from '../atom';
 declare function $$render<E extends keyof HTMLElementTagNameMap = 'p', B extends Base = Base>(): {
-    props: Omit<HtmlAtomProps<E, B>, "children"> & {
-        children?: Snippet<[{
-            drawer?: DrawerBond;
-        }]>;
-    } & HTMLAttributes<HTMLElementTagNameMap[E]>;
+    props: SlideoverDescriptionProps<E, B> & HTMLAttributes<HTMLElementTagNameMap[E]>;
     exports: {};
     bindings: "";
     slots: {};