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

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

@@ -1,7 +1,11 @@
-import type { Snippet } from 'svelte';
-import type { HTMLAttributes } from 'svelte/elements';
-export type IconProps = HTMLAttributes<HTMLDivElement> & {
-    class?: string;
-    element?: HTMLElement;
-    children?: Snippet<[]>;
-};
+import type { Component, Snippet } from 'svelte';
+import type { HtmlAtomProps, Base } from '../atom';
+/**
+ * Extend this interface to add custom icon properties in your application.
+ */
+export interface IconExtendProps {
+}
+export interface IconProps<Src extends Component = Component, E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base> extends HtmlAtomProps<E, B>, IconExtendProps {
+    src?: Src;
+    children?: Snippet;
+}

package/dist/components/input/atoms.d.ts

@@ -1,4 +1,8 @@
 export { default as Root } from './input-root.svelte';
-export { default as Value } from './input-value.svelte';
+/**
+ * @deprecated use Input.Control instead
+ */
+export { default as Value } from './input-control.svelte';
+export { default as Control } from './input-control.svelte';
 export { default as Icon } from './input-icon.svelte';
 export { default as Placeholder } from './input-placeholder.svelte';

package/dist/components/input/atoms.js

@@ -1,4 +1,8 @@
 export { default as Root } from './input-root.svelte';
-export { default as Value } from './input-value.svelte';
+/**
+ * @deprecated use Input.Control instead
+ */
+export { default as Value } from './input-control.svelte';
+export { default as Control } from './input-control.svelte';
 export { default as Icon } from './input-icon.svelte';
 export { default as Placeholder } from './input-placeholder.svelte';

package/dist/components/input/index.d.ts

@@ -1,2 +1,3 @@
 export * as Input from './atoms';
 export * from './bond.svelte';
+export * from './types';

package/dist/components/input/index.js

@@ -1,2 +1,3 @@
 export * as Input from './atoms';
 export * from './bond.svelte';
+export * from './types';

package/dist/components/input/{input-value.svelte → input-control.svelte}

@@ -1,27 +1,11 @@
-<script module lang="ts">
-	export type InputPortals = 'input.l0' | 'input.l1' | 'input.l2' | 'input.l3';
-
-	export type InputProps = {
-		value?: ClassValue;
-		files?: File[];
-		date?: Date | null;
-		number?: number;
-		checked?: boolean;
-		class?: string;
-		type?: HTMLInputTypeAttribute | null;
-		preset?: PresetModuleName | (string & {});
-		children?: Snippet<[]>;
-	};
-</script>
-
-<script>
-	import type { Snippet } from 'svelte';
-	import type { HTMLInputTypeAttribute } from 'svelte/elements';
+<script lang="ts" generics="B extends Base = Base">
 	import { on } from '../../attachments/event.svelte';
 	import { getPreset } from '../../context';
-	import { cn, toClassValue, type ClassValue } from '../../utils';
+	import { cn, toClassValue } from '../../utils';
 	import type { PresetModuleName } from '../../context/preset.svelte';
+	import type { Base } from '../atom';
 	import { InputBond } from './bond.svelte';
+	import type { InputControlProps } from './types';
 
 	const bond = InputBond.get();
 
@@ -33,11 +17,11 @@
 		checked = $bindable(),
 		class: klass = '',
 		type = 'text',
-		preset: presetKey = 'input.value',
+		preset: presetKey = 'input.control',
 		onchange = undefined,
 		oninput = undefined,
 		...restProps
-	}: InputProps = $props();
+	}: InputControlProps<B> = $props();
 
 	const preset = getPreset(presetKey as PresetModuleName)?.apply(bond, [bond]);
 
@@ -81,10 +65,15 @@
 			event: ev
 		});
 	}
+
+	function toFileList(files: File[]) {
+		const dataTransfer = new DataTransfer();
+		files.forEach((file) => dataTransfer.items.add(file));
+		return dataTransfer.files;
+	}
 </script>
 
 <input
-	{type}
 	bind:value={
 		() => value,
 		(v) => {
@@ -95,10 +84,11 @@
 		}
 	}
 	class={cn(
-		'h-full w-full flex-1 bg-transparent px-2 leading-1 outline-none',
+		'text-foreground placeholder:text-muted-foreground h-full w-full flex-1 bg-transparent px-2 leading-1 outline-none',
 		preset?.class,
 		toClassValue(klass, bond)
 	)}
+	type={type ?? 'text'}
 	onchange={handleChange}
 	oninput={handleInput}
 	{...valueProps}

package/dist/components/input/input-control.svelte.d.ts

@@ -0,0 +1,26 @@
+import type { Base } from '../atom';
+import type { InputControlProps } from './types';
+declare function $$render<B extends Base = Base>(): {
+    props: InputControlProps<B>;
+    exports: {};
+    bindings: "number" | "value" | "date" | "checked" | "files";
+    slots: {};
+    events: {};
+};
+declare class __sveltets_Render<B extends Base = Base> {
+    props(): ReturnType<typeof $$render<B>>['props'];
+    events(): ReturnType<typeof $$render<B>>['events'];
+    slots(): ReturnType<typeof $$render<B>>['slots'];
+    bindings(): "number" | "value" | "date" | "checked" | "files";
+    exports(): {};
+}
+interface $$IsomorphicComponent {
+    new <B extends Base = Base>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<B>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<B>['props']>, ReturnType<__sveltets_Render<B>['events']>, ReturnType<__sveltets_Render<B>['slots']>> & {
+        $$bindings?: ReturnType<__sveltets_Render<B>['bindings']>;
+    } & ReturnType<__sveltets_Render<B>['exports']>;
+    <B extends Base = Base>(internal: unknown, props: ReturnType<__sveltets_Render<B>['props']> & {}): ReturnType<__sveltets_Render<B>['exports']>;
+    z_$$bindings?: ReturnType<__sveltets_Render<any>['bindings']>;
+}
+declare const InputControl: $$IsomorphicComponent;
+type InputControl<B extends Base = Base> = InstanceType<typeof InputControl<B>>;
+export default InputControl;

package/dist/components/input/input-icon.svelte

@@ -7,7 +7,7 @@
 <Icon
 	preset="input.icon"
 	class={[
-		'flex aspect-square h-full items-center justify-center bg-transparent text-sm leading-0',
+		'border-border flex aspect-square h-full items-center justify-center bg-transparent text-sm leading-0',
 		'$preset',
 		klass
 	]}

package/dist/components/input/input-icon.svelte.d.ts

@@ -1,4 +1,4 @@
 import { type IconProps } from '../icon';
-declare const InputIcon: import("svelte").Component<IconProps, {}, "">;
+declare const InputIcon: import("svelte").Component<IconProps<import("svelte").Component<{}, {}, string>, "div", import("..").ComponentBase | import("..").SnippetBase>, {}, "">;
 type InputIcon = ReturnType<typeof InputIcon>;
 export default InputIcon;

package/dist/components/input/input-placeholder.svelte

@@ -1,56 +1,54 @@
-<script lang="ts" generics="E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base">
-	import type { HTMLAttributes } from 'svelte/elements';
-	import { InputBond } from './bond.svelte';
-	import {
-		HtmlAtom,
-		type ElementType,
-		type HtmlAtomProps,
-		type Base
-	} from '../atom';
-
-	type Element = ElementType<E>;
-
-	const bond = InputBond.get();
-
-	let {
-		class: klass = '',
-		children = undefined,
-		...restProps
-	}: HtmlAtomProps<E, B> & HTMLAttributes<Element> = $props();
-
-	const placeholderProps = $derived({
-		...bond?.placeholder(),
-		...restProps
-	});
-
-	const shouldShowPlaceholder = $derived.by(() => {
-		const type = bond?.elements?.input?.type ?? '';
-
-		if (['radio', 'checkbox'].includes(type)) {
-			return false;
-		}
-
-		if (['files'].includes(type)) {
-			return !bond?.state.props.files?.length;
-		}
-
-		console.log(!bond?.state.props.value);
-
-		return !bond?.state.props.value;
-	});
-</script>
-
-{#if shouldShowPlaceholder}
-	<HtmlAtom
-		preset="input.placeholder"
-		class={[
-			'pointer-events-none absolute inset-0 flex h-full w-full items-center px-1 leading-1 outline-none',
-			'$preset',
-			klass
-		]}
-		style="left:{bond?.elements?.input?.offsetLeft ?? 0}px"
-		{...placeholderProps}
-	>
-		{@render children?.()}
-	</HtmlAtom>
-{/if}
+<script lang="ts" generics="E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base">
+	import type { HTMLAttributes } from 'svelte/elements';
+	import { InputBond } from './bond.svelte';
+	import {
+		HtmlAtom,
+		type ElementType,
+		type HtmlAtomProps,
+		type Base
+	} from '../atom';
+
+	type Element = ElementType<E>;
+
+	const bond = InputBond.get();
+
+	let {
+		class: klass = '',
+		children = undefined,
+		...restProps
+	}: HtmlAtomProps<E, B> & HTMLAttributes<Element> = $props();
+
+	const placeholderProps = $derived({
+		...bond?.placeholder(),
+		...restProps
+	});
+
+	const shouldShowPlaceholder = $derived.by(() => {
+		const type = bond?.elements?.input?.type ?? '';
+
+		if (['radio', 'checkbox'].includes(type)) {
+			return false;
+		}
+
+		if (['files'].includes(type)) {
+			return !bond?.state.props.files?.length;
+		}
+
+		return !bond?.state.props.value;
+	});
+</script>
+
+{#if shouldShowPlaceholder}
+	<HtmlAtom
+		preset="input.placeholder"
+		class={[
+			'text-muted-foreground pointer-events-none absolute inset-0 flex h-full w-full items-center px-1 leading-1 outline-none',
+			'$preset',
+			klass
+		]}
+		style="left:{bond?.elements?.input?.offsetLeft ?? 0}px"
+		{...placeholderProps}
+	>
+		{@render children?.()}
+	</HtmlAtom>
+{/if}

package/dist/components/input/input-placeholder.svelte.d.ts

@@ -1,24 +1,7 @@
 import type { HTMLAttributes } from 'svelte/elements';
-import { type ElementType, type Base } from '../atom';
+import { type ElementType, type HtmlAtomProps, 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>);
-    } & HTMLAttributes<ElementType<E>>;
+    props: HtmlAtomProps<E, B> & HTMLAttributes<ElementType<E>>;
     exports: {};
     bindings: "";
     slots: {};

package/dist/components/input/input-root.svelte

@@ -1,15 +1,8 @@
 <script lang="ts" generics="E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base">
-	import type { HTMLAttributes } from 'svelte/elements';
 	import { InputBond, InputState, type InputStateProps } from './bond.svelte';
-	import { defineProperty, defineState, toClassValue } from '../../utils';
-	import {
-		HtmlAtom,
-		type ElementType,
-		type HtmlAtomProps,
-		type Base
-	} from '../atom';
-
-	type Element = ElementType<E>;
+	import { defineProperty, defineState } from '../../utils';
+	import { HtmlAtom, type Base } from '../atom';
+	import type { InputRootProps } from './types';
 
 	let {
 		class: klass = '',
@@ -20,7 +13,7 @@
 		children = undefined,
 		factory = _factory,
 		...restProps
-	}: HtmlAtomProps<E, B> & HTMLAttributes<Element> = $props();
+	}: InputRootProps<E, B> = $props();
 
 	const bondProps = defineState<InputStateProps>([
 		defineProperty(
@@ -68,7 +61,7 @@
 <HtmlAtom
 	{preset}
 	class={[
-		'border-border text-foreground bg-input relative flex h-10 items-center overflow-hidden rounded-md border',
+		'border-border text-foreground bg-input relative flex h-10 w-auto items-center overflow-hidden rounded-md border',
 		'$preset',
 		klass
 	]}

package/dist/components/input/input-root.svelte.d.ts

@@ -1,25 +1,8 @@
-import type { HTMLAttributes } from 'svelte/elements';
 import { InputBond } from './bond.svelte';
-import { type ElementType, type Base } from '../atom';
+import { type Base } from '../atom';
+import type { InputRootProps } from './types';
 declare function $$render<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base>(): {
-    props: Record<string, unknown> & {
-        [key: string]: unknown;
-        class?: import("../../utils").ClassValue | import("../../utils").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("../../utils").VariantDefinition<any> | ((bond: import("../..").Bond, variantProps: Record<string, any>) => Record<string, any>);
-    } & HTMLAttributes<ElementType<E>>;
+    props: InputRootProps<E, B>;
     exports: {
         getBond: () => InputBond;
     };

package/dist/components/input/input.stories.svelte

@@ -26,9 +26,9 @@
 			<Label for="price-input">Price</Label>
 			<AInput.Root>
 				<AInput.Icon class="text-foreground box-content px-0">$</AInput.Icon>
-				<AInput.Value id="price-input" class="border-border box-content border-x px-2 py-2">
+				<AInput.Control id="price-input" class="border-border box-content border-x px-2 py-2">
 					<!--  -->
-				</AInput.Value>
+				</AInput.Control>
 				<AInput.Icon class="text-foreground box-content px-2">.00</AInput.Icon>
 
 				<AInput.Placeholder class="text-foreground/20 pl-2">Hello World</AInput.Placeholder>

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

@@ -0,0 +1,33 @@
+import type { HTMLInputTypeAttribute } from 'svelte/elements';
+import type { Base, HtmlAtomProps } from '../atom';
+import type { Snippet } from 'svelte';
+import type { Override } from '../../types';
+/**
+ * Extend this interface to add custom input root properties in your application.
+ */
+export interface InputRootExtendProps {
+}
+/**
+ * Extend this interface to add custom input control properties in your application.
+ */
+export interface InputControlExtendProps {
+}
+export interface InputRootProps<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base> extends HtmlAtomProps<E, B>, InputRootExtendProps {
+    value?: string | number | string[] | null;
+    checked?: boolean;
+    files?: File[] | null;
+    children?: Snippet<[]>;
+}
+interface InputControlBaseProps {
+    value?: any;
+    files?: File[];
+    date?: Date | null;
+    number?: number;
+    checked?: boolean;
+    class?: string;
+    type?: HTMLInputTypeAttribute | null;
+    children?: Snippet<[]>;
+}
+export interface InputControlProps<B extends Base = Base> extends Override<HtmlAtomProps<'input', B>, InputControlBaseProps>, InputControlExtendProps {
+}
+export {};

package/dist/components/input/types.js

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

package/dist/components/label/index.d.ts

@@ -1 +1,2 @@
 export { default as Label } from './label.svelte';
+export * from './types';

package/dist/components/label/index.js

@@ -1 +1,2 @@
 export { default as Label } from './label.svelte';
+export * from './types';

package/dist/components/label/label.svelte

@@ -1,41 +1,25 @@
-<script module lang="ts">
-	import type { Snippet } from 'svelte';
-
-	export type LabelProps<
-		E extends keyof HTMLElementTagNameMap = 'label',
-		B extends Base = Base
-	> = HtmlAtomProps<E, B> & {
-		for?: string | null;
-		children?: Snippet<[]>;
-	};
-</script>
-
-<script lang="ts" generics="E extends keyof HTMLElementTagNameMap = 'label', B extends Base = Base">
-	import {
-		HtmlAtom,
-		type ElementType,
-		type HtmlAtomProps,
-		type Base
-	} from '../atom';
-	import type { HTMLAttributes } from 'svelte/elements';
-
-	type Element = ElementType<E>;
-
-	let {
-		class: klass = '',
-		as = 'label' as E,
-		for: labelfor = null,
-		children,
-		...restProps
-	}: LabelProps<E, B> & HTMLAttributes<Element> = $props();
-</script>
-
-<HtmlAtom
-	{as}
-	preset="label"
-	class={['font-medium', '$preset', klass]}
-	for={labelfor}
-	{...restProps}
->
-	{@render children?.()}
-</HtmlAtom>
+<script lang="ts" generics="E extends keyof HTMLElementTagNameMap = 'label', B extends Base = Base">
+	import type { HTMLAttributes } from 'svelte/elements';
+	import { HtmlAtom, type ElementType, type Base } from '../atom';
+	import type { LabelProps } from './types';
+
+	type Element = ElementType<E>;
+
+	let {
+		class: klass = '',
+		as = 'label' as E,
+		for: labelfor = null,
+		children,
+		...restProps
+	}: LabelProps<E, B> & HTMLAttributes<Element> = $props();
+</script>
+
+<HtmlAtom
+	{as}
+	preset="label"
+	class={['font-medium', '$preset', klass]}
+	for={labelfor}
+	{...restProps}
+>
+	{@render children?.()}
+</HtmlAtom>

package/dist/components/label/label.svelte.d.ts

@@ -1,32 +1,8 @@
-import type { Snippet } from 'svelte';
-export type LabelProps<E extends keyof HTMLElementTagNameMap = 'label', B extends Base = Base> = HtmlAtomProps<E, B> & {
-    for?: string | null;
-    children?: Snippet<[]>;
-};
-import { type ElementType, type HtmlAtomProps, type Base } from '../atom';
 import type { HTMLAttributes } from 'svelte/elements';
+import { type ElementType, type Base } from '../atom';
+import type { LabelProps } from './types';
 declare function $$render<E extends keyof HTMLElementTagNameMap = 'label', 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?: 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>);
-    } & {
-        for?: string | null;
-        children?: Snippet<[]>;
-    } & HTMLAttributes<ElementType<E>>;
+    props: LabelProps<E, B> & HTMLAttributes<ElementType<E>>;
     exports: {};
     bindings: "";
     slots: {};

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

@@ -0,0 +1,11 @@
+import type { Snippet } from 'svelte';
+import type { HtmlAtomProps, Base } from '../atom';
+/**
+ * Extend this interface to add custom label properties in your application.
+ */
+export interface LabelExtendProps {
+}
+export interface LabelProps<E extends keyof HTMLElementTagNameMap = 'label', B extends Base = Base> extends HtmlAtomProps<E, B>, LabelExtendProps {
+    for?: string | null;
+    children?: Snippet<[]>;
+}

package/dist/components/label/types.js

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

package/dist/components/layer/layer-inner.svelte.d.ts

@@ -1,24 +1,7 @@
 import type { HTMLAttributes } from 'svelte/elements';
-import { type ElementType, type Base } from '../atom';
+import { type ElementType, type HtmlAtomProps, 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>);
-    } & HTMLAttributes<ElementType<E>>;
+    props: HtmlAtomProps<E, B> & HTMLAttributes<ElementType<E>>;
     exports: {};
     bindings: "";
     slots: {};

package/dist/components/layer/layer-root.svelte.d.ts

@@ -1,24 +1,7 @@
 import type { HTMLAttributes } from 'svelte/elements';
-import { type ElementType, type Base } from '../atom';
+import { type ElementType, type HtmlAtomProps, 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("../../utils").ClassValue | import("../../utils").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("../../utils").VariantDefinition<any> | ((bond: import("../..").Bond, variantProps: Record<string, any>) => Record<string, any>);
-    } & HTMLAttributes<ElementType<E>>;
+    props: HtmlAtomProps<E, B> & HTMLAttributes<ElementType<E>>;
     exports: {
         getBond: () => any;
     };

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

@@ -0,0 +1,11 @@
+import type { HtmlAtomProps, Base } from '../atom';
+import type { Factory } from '../../types';
+import type { LayerBond } from './bond.svelte';
+/**
+ * Extend this interface to add custom layer properties in your application.
+ */
+export interface LayerExtendProps {
+}
+export interface LayerRootProps<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base> extends HtmlAtomProps<E, B>, LayerExtendProps {
+    factory?: Factory<LayerBond>;
+}

package/dist/components/layer/types.js

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

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

@@ -0,0 +1,8 @@
+import type { HtmlAtomProps, Base } from '../atom';
+/**
+ * Extend this interface to add custom link properties in your application.
+ */
+export interface LinkExtendProps {
+}
+export interface LinkProps<E extends keyof HTMLElementTagNameMap = 'a', B extends Base = Base> extends HtmlAtomProps<E, B>, LinkExtendProps {
+}

package/dist/components/link/types.js

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