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

package/dist/components/card/card-title.svelte.d.ts

@@ -1,26 +1,29 @@
-export type CardTitleProps<E extends keyof HTMLElementTagNameMap = 'h3', B extends Base = Base> = HtmlAtomProps<E, B>;
-import { type HtmlAtomProps, type Base } from '../atom';
-declare function $$render<E extends keyof HTMLElementTagNameMap = 'h3', B extends Base = Base>(): {
+import { type Base } from '../atom';
+declare function $$render<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base>(): {
     props: CardTitleProps<E, B>;
-    exports: {};
+    exports: {
+        CardTitleProps: typeof CardTitleProps;
+    };
     bindings: "";
     slots: {};
     events: {};
 };
-declare class __sveltets_Render<E extends keyof HTMLElementTagNameMap = 'h3', B extends Base = Base> {
+declare class __sveltets_Render<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base> {
     props(): ReturnType<typeof $$render<E, B>>['props'];
     events(): ReturnType<typeof $$render<E, B>>['events'];
     slots(): ReturnType<typeof $$render<E, B>>['slots'];
     bindings(): "";
-    exports(): {};
+    exports(): {
+        CardTitleProps: typeof CardTitleProps;
+    };
 }
 interface $$IsomorphicComponent {
-    new <E extends keyof HTMLElementTagNameMap = 'h3', B extends Base = Base>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<E, B>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<E, B>['props']>, ReturnType<__sveltets_Render<E, B>['events']>, ReturnType<__sveltets_Render<E, B>['slots']>> & {
+    new <E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<E, B>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<E, B>['props']>, ReturnType<__sveltets_Render<E, B>['events']>, ReturnType<__sveltets_Render<E, B>['slots']>> & {
         $$bindings?: ReturnType<__sveltets_Render<E, B>['bindings']>;
     } & ReturnType<__sveltets_Render<E, B>['exports']>;
-    <E extends keyof HTMLElementTagNameMap = 'h3', B extends Base = Base>(internal: unknown, props: ReturnType<__sveltets_Render<E, B>['props']> & {}): ReturnType<__sveltets_Render<E, B>['exports']>;
+    <E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base>(internal: unknown, props: ReturnType<__sveltets_Render<E, B>['props']> & {}): ReturnType<__sveltets_Render<E, B>['exports']>;
     z_$$bindings?: ReturnType<__sveltets_Render<any, any>['bindings']>;
 }
 declare const CardTitle: $$IsomorphicComponent;
-type CardTitle<E extends keyof HTMLElementTagNameMap = 'h3', B extends Base = Base> = InstanceType<typeof CardTitle<E, B>>;
+type CardTitle<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base> = InstanceType<typeof CardTitle<E, B>>;
 export default CardTitle;

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

@@ -1 +1,2 @@
 export * as Card from './atoms';
+export * from './types';

package/dist/components/card/index.js

@@ -1 +1,2 @@
 export * as Card from './atoms';
+export * from './types';

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

@@ -2,7 +2,47 @@ import type { Snippet } from 'svelte';
 import type { CardBond } from './bond.svelte';
 import type { HtmlAtomProps, Base } from '../atom';
 import type { Factory } from '../../types';
-export type CardRootProps<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base> = HtmlAtomProps<E, B> & {
+/**
+ * Extend this interface to add custom card root properties in your application.
+ */
+export interface CardExtendProps {
+}
+/**
+ * Extend this interface to add custom card header properties in your application.
+ */
+export interface CardHeaderExtendProps {
+}
+/**
+ * Extend this interface to add custom card body/content properties in your application.
+ */
+export interface CardBodyExtendProps {
+}
+/**
+ * Extend this interface to add custom card footer properties in your application.
+ */
+export interface CardFooterExtendProps {
+}
+/**
+ * Extend this interface to add custom card title properties in your application.
+ */
+export interface CardTitleExtendProps {
+}
+/**
+ * Extend this interface to add custom card subtitle properties in your application.
+ */
+export interface CardSubtitleExtendProps {
+}
+/**
+ * Extend this interface to add custom card description properties in your application.
+ */
+export interface CardDescriptionExtendProps {
+}
+/**
+ * Extend this interface to add custom card media properties in your application.
+ */
+export interface CardMediaExtendProps {
+}
+export interface CardRootProps<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base> extends Omit<HtmlAtomProps<E, B>, 'children'>, CardExtendProps {
     disabled?: boolean;
     factory?: Factory<CardBond>;
     children?: Snippet<[{
@@ -10,4 +50,19 @@ export type CardRootProps<E extends keyof HTMLElementTagNameMap = 'div', B exten
     }]>;
     onclick?: (event: MouseEvent) => void;
     onkeydown?: (event: KeyboardEvent) => void;
-};
+}
+export interface CardHeaderProps<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base> extends HtmlAtomProps<E, B>, CardHeaderExtendProps {
+}
+export interface CardBodyProps<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base> extends HtmlAtomProps<E, B>, CardBodyExtendProps {
+}
+export interface CardFooterProps<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base> extends HtmlAtomProps<E, B>, CardFooterExtendProps {
+}
+export interface CardTitleProps<E extends keyof HTMLElementTagNameMap = 'h3', B extends Base = Base> extends HtmlAtomProps<E, B>, CardTitleExtendProps {
+}
+export interface CardSubtitleProps<E extends keyof HTMLElementTagNameMap = 'p', B extends Base = Base> extends HtmlAtomProps<E, B>, CardSubtitleExtendProps {
+}
+export interface CardDescriptionProps<E extends keyof HTMLElementTagNameMap = 'p', B extends Base = Base> extends HtmlAtomProps<E, B>, CardDescriptionExtendProps {
+}
+export interface CardMediaProps<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base> extends HtmlAtomProps<E, B>, CardMediaExtendProps {
+}
+export type CardContentProps<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base> = CardBodyProps<E, B>;

package/dist/components/checkbox/checkbox.svelte

@@ -1,21 +1,22 @@
 <script lang="ts">
+	import { circOut } from 'svelte/easing';
 	import type { HTMLInputAttributes } from 'svelte/elements';
 	import { scale } from 'svelte/transition';
-	import type { CheckboxProps } from './types';
 	import { Icon } from '../icon';
 	import { HtmlAtom } from '../atom';
 	import CheckmarkRegularIcon from '../../icons/icon-checkmark.svelte';
-	import './checkbox.css';
 	import { DURATION } from '../../shared';
-	import { circOut } from 'svelte/easing';
+	import type { CheckboxProps } from './types';
+	import './checkbox.css';
 
 	let {
 		class: klass = '',
 		checked = $bindable(false),
-		indeterminate = $bindable(),
+		indeterminate = $bindable(false),
 		value = $bindable(undefined),
 		group = $bindable([]),
 		id,
+		name,
 		checkedContent,
 		indeterminateContent,
 		enter,
@@ -31,29 +32,25 @@
 
 	let checkboxElement: HTMLInputElement | undefined = $state();
 
-	function handleChange(ev: Event) {
-		const checked = (ev.currentTarget as HTMLInputElement)?.checked ?? false;
+	// Computed state for visual representation
+	const isChecked = $derived(checked === true);
+	const isIndeterminate = $derived(indeterminate === true);
+	const showCheckmark = $derived(isChecked && !isIndeterminate);
 
+	function handleChange(ev: Event) {
 		onchange?.(ev, {
-			checked,
+			checked: checked,
 			value: checked,
 			type: 'boolean'
 		});
 	}
 
 	function handleInput(ev: Event) {
-		const currentTarget = ev.currentTarget as HTMLInputElement;
-		const _checked = currentTarget?.checked ?? false;
-
 		oninput?.(ev, {
-			checked: _checked,
-			value: _checked,
+			checked: checked,
+			value: checked,
 			type: 'boolean'
 		});
-
-		if (ev.defaultPrevented) {
-			return;
-		}
 	}
 
 	function handleClick(ev: MouseEvent) {
@@ -63,7 +60,18 @@
 			return;
 		}
 
-		checkboxElement?.click();
+		// Handle indeterminate → checked → unchecked cycle
+		if (indeterminate) {
+			// Indeterminate → checked
+			indeterminate = false;
+			checked = true;
+		} else {
+			// Toggle checked state
+			checked = !checked;
+		}
+
+		// Trigger input event manually if needed
+		handleInput(ev);
 	}
 </script>
 
@@ -71,15 +79,16 @@
 <!-- svelte-ignore a11y_no_noninteractive_element_interactions -->
 <HtmlAtom
 	preset="checkbox"
-	as="button"
+	as="div"
 	class={[
-		'checkbox-root border-border outline-primary bg-foreground/5 aspect-square h-5 w-fit cursor-pointer rounded-sm border outline-0 outline-offset-2 transition-colors duration-100',
-		checked && 'bg-foreground',
-		!checked && '',
+		'checkbox-root border-border outline-primary bg-input text-foreground aspect-square h-5 w-fit cursor-pointer rounded-sm border outline-0 outline-offset-2 transition-colors duration-100',
+		isChecked && 'bg-foreground',
 		'$preset',
 		klass,
 		'relative'
 	]}
+	role="checkbox"
+	aria-checked={isIndeterminate ? 'mixed' : isChecked}
 	{enter}
 	{exit}
 	{initial}
@@ -87,6 +96,7 @@
 	{...restProps}
 >
 	<input
+		bind:this={checkboxElement}
 		bind:checked
 		bind:group
 		bind:indeterminate
@@ -94,34 +104,35 @@
 		class="checkbox-input pointer-events-none"
 		{value}
 		{id}
+		{name}
 		onchange={handleChange}
 		oninput={handleInput}
 		{onblur}
 		{onfocus}
 		hidden
-		{@attach (node) => {
-			checkboxElement = node;
-		}}
+		tabindex="-1"
 	/>
 
-	{#if indeterminate}
+	{#if isIndeterminate}
 		{#if indeterminateContent}
 			<HtmlAtom
 				preset="checkbox.indeterminate"
-				class={['checkbox-indeterminate flex size-full items-center justify-center p-1']}
+				class={[
+					'checkbox-indeterminate pointer-events-none flex size-full items-center justify-center p-1'
+				]}
 				base={indeterminateContent}
 			/>
 		{:else}
 			<HtmlAtom
 				preset="checkbox.indeterminate"
 				class={[
-					'checkbox-indeterminate text-foreground flex size-full items-center justify-center p-1'
+					'checkbox-indeterminate text-foreground pointer-events-none flex size-full items-center justify-center  p-1'
 				]}
 			>
 				<div class={['size-full rounded-xs bg-current']}></div>
 			</HtmlAtom>
 		{/if}
-	{:else if checked === true}
+	{:else if showCheckmark}
 		{#if checkedContent}
 			<HtmlAtom
 				preset="checkbox.checkmark"

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

@@ -1,6 +1,11 @@
 import { type Component, type Snippet } from 'svelte';
 import { type HtmlAtomProps } from '../atom';
-export type CheckboxProps = HtmlAtomProps<'button'> & {
+/**
+ * Extend this interface to add custom checkbox properties in your application.
+ */
+export interface CheckboxExtendProps {
+}
+export interface CheckboxProps extends HtmlAtomProps<'button'>, CheckboxExtendProps {
     value?: string;
     group?: string[];
     checked?: boolean;
@@ -12,4 +17,4 @@ export type CheckboxProps = HtmlAtomProps<'button'> & {
     onchange?: (ev?: Event, options?: {
         checked: boolean;
     }) => void;
-};
+}

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

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

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

@@ -1,12 +1,5 @@
-export type CollapsibleBodyProps<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base> = Override<HtmlAtomProps<E, B>, {
-    children?: Snippet<[{
-        collapsible?: CollapsibleBond;
-    }]>;
-}>;
-import type { Snippet } from 'svelte';
-import { CollapsibleBond } from './bond.svelte';
-import type { Override } from '../../types';
-import { type HtmlAtomProps, type Base } from '../atom';
+import { type Base } from '../atom';
+import type { CollapsibleBodyProps } from './types';
 declare function $$render<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base>(): {
     props: CollapsibleBodyProps<E, B>;
     exports: {};

package/dist/components/collapsible/collapsible-header.svelte

@@ -1,52 +1,39 @@
-<script module lang="ts">
-	export type CollapsibleHeaderProps<
-		E extends keyof HTMLElementTagNameMap = 'div',
-		B extends Base = Base
-	> = Override<
-		HtmlAtomProps<E, B>,
-		{
-			children?: Snippet<[{ collapsible?: CollapsibleBond }]>;
-		}
-	>;
-</script>
-
-<script lang="ts" generics="E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base">
-	import type { Snippet } from 'svelte';
-	import { CollapsibleBond } from './bond.svelte';
-	import type { Override } from '../../types';
-	import { HtmlAtom, type HtmlAtomProps, type Base } from '../atom';
-
-	const bond = CollapsibleBond.get();
-
-	let {
-		class: klass = '',
-		children = undefined,
-		onmount = undefined,
-		ondestroy = undefined,
-		animate = undefined,
-		enter = undefined,
-		exit = undefined,
-		initial = undefined,
-		...restProps
-	}: CollapsibleHeaderProps<E, B> = $props();
-
-	const collapsibleProps = $derived({
-		...bond?.header(),
-		...restProps
-	});
-</script>
-
-<HtmlAtom
-	{bond}
-	preset="collapsible.header"
-	class={['flex cursor-pointer items-center gap-2', '$preset', klass]}
-	onmount={onmount?.bind(bond.state)}
-	ondestroy={ondestroy?.bind(bond.state)}
-	animate={animate?.bind(bond.state)}
-	enter={enter?.bind(bond.state)}
-	exit={exit?.bind(bond.state)}
-	initial={initial?.bind(bond.state)}
-	{...collapsibleProps}
->
-	{@render children?.({ collapsible: bond })}
-</HtmlAtom>
+<script lang="ts" generics="E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base">
+	import { HtmlAtom, type Base } from '../atom';
+	import type { CollapsibleHeaderProps } from './types';
+	import { CollapsibleBond } from './bond.svelte';
+
+	const bond = CollapsibleBond.get();
+
+	let {
+		class: klass = '',
+		children = undefined,
+		onmount = undefined,
+		ondestroy = undefined,
+		animate = undefined,
+		enter = undefined,
+		exit = undefined,
+		initial = undefined,
+		...restProps
+	}: CollapsibleHeaderProps<E, B> = $props();
+
+	const collapsibleProps = $derived({
+		...bond?.header(),
+		...restProps
+	});
+</script>
+
+<HtmlAtom
+	{bond}
+	preset="collapsible.header"
+	class={['border-border flex cursor-pointer items-center gap-2', '$preset', klass]}
+	onmount={onmount?.bind(bond.state)}
+	ondestroy={ondestroy?.bind(bond.state)}
+	animate={animate?.bind(bond.state)}
+	enter={enter?.bind(bond.state)}
+	exit={exit?.bind(bond.state)}
+	initial={initial?.bind(bond.state)}
+	{...collapsibleProps}
+>
+	{@render children?.({ collapsible: bond })}
+</HtmlAtom>

package/dist/components/collapsible/collapsible-header.svelte.d.ts

@@ -1,12 +1,5 @@
-export type CollapsibleHeaderProps<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base> = Override<HtmlAtomProps<E, B>, {
-    children?: Snippet<[{
-        collapsible?: CollapsibleBond;
-    }]>;
-}>;
-import type { Snippet } from 'svelte';
-import { CollapsibleBond } from './bond.svelte';
-import type { Override } from '../../types';
-import { type HtmlAtomProps, type Base } from '../atom';
+import { type Base } from '../atom';
+import type { CollapsibleHeaderProps } from './types';
 declare function $$render<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base>(): {
     props: CollapsibleHeaderProps<E, B>;
     exports: {};

package/dist/components/collapsible/collapsible-indicator.svelte

@@ -1,65 +1,50 @@
-<script module lang="ts">
-	export type CollapsibleHeaderProps<
-		E extends keyof HTMLElementTagNameMap = 'div',
-		B extends Base = Base
-	> = Override<
-		HtmlAtomProps<E, B>,
-		{
-			children?: Snippet<[{ collapsible?: CollapsibleBond }]>;
-		}
-	>;
-</script>
-
-<script lang="ts" generics="E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base">
-	import type { Snippet } from 'svelte';
-	import { animate as motion } from 'motion';
-	import { CollapsibleBond } from './bond.svelte';
-	import { Icon } from '../icon';
-
-	import type { Override } from '../../types';
-	import { HtmlAtom, type HtmlAtomProps, type Base } from '../atom';
-	import IconArrowDown from '../../icons/icon-arrow-down.svelte';
-
-	const bond = CollapsibleBond.get();
-	const isOpen = $derived(bond?.state.props.open ?? false);
-
-	let {
-		class: klass = '',
-		children = undefined,
-		onmount = undefined,
-		ondestroy = undefined,
-		animate = _animate,
-		enter = undefined,
-		exit = undefined,
-		initial = undefined,
-		...restProps
-	}: CollapsibleHeaderProps<E, B> = $props();
-
-	const indicatorProps = $derived({
-		...bond?.indicator(),
-		...restProps
-	});
-
-	function _animate(node: HTMLElement) {
-		motion(node, { rotate: 180 * +isOpen }, { duration: 0.3, ease: 'anticipate' });
-	}
-</script>
-
-<HtmlAtom
-	{bond}
-	preset="collapsible.indicator"
-	class={['flex size-4 items-center justify-center', '$preset', klass]}
-	onmount={onmount?.bind(bond.state)}
-	ondestroy={ondestroy?.bind(bond.state)}
-	animate={animate?.bind(bond.state)}
-	enter={enter?.bind(bond.state)}
-	exit={exit?.bind(bond.state)}
-	initial={initial?.bind(bond.state)}
-	{...indicatorProps}
->
-	{#if children}
-		{@render children?.({ collapsible: bond })}
-	{:else}
-		<Icon src={IconArrowDown} />
-	{/if}
-</HtmlAtom>
+<script lang="ts" generics="E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base">
+	import { animate as motion } from 'motion';
+	import { Icon } from '../icon';
+	import { HtmlAtom, type Base } from '../atom';
+	import IconArrowDown from '../../icons/icon-arrow-down.svelte';
+	import { CollapsibleBond } from './bond.svelte';
+	import type { CollapsibleIndicatorProps } from './types';
+
+	const bond = CollapsibleBond.get();
+	const isOpen = $derived(bond?.state.props.open ?? false);
+
+	let {
+		class: klass = '',
+		children = undefined,
+		onmount = undefined,
+		ondestroy = undefined,
+		animate = _animate,
+		enter = undefined,
+		exit = undefined,
+		initial = undefined,
+		...restProps
+	}: CollapsibleIndicatorProps<E, B> = $props();
+	const indicatorProps = $derived({
+		...bond?.indicator(),
+		...restProps
+	});
+
+	function _animate(node: HTMLElement) {
+		motion(node, { rotate: 180 * +isOpen }, { duration: 0.3, ease: 'anticipate' });
+	}
+</script>
+
+<HtmlAtom
+	{bond}
+	preset="collapsible.indicator"
+	class={['border-border flex size-4 items-center justify-center', '$preset', klass]}
+	onmount={onmount?.bind(bond.state)}
+	ondestroy={ondestroy?.bind(bond.state)}
+	animate={animate?.bind(bond.state)}
+	enter={enter?.bind(bond.state)}
+	exit={exit?.bind(bond.state)}
+	initial={initial?.bind(bond.state)}
+	{...indicatorProps}
+>
+	{#if children}
+		{@render children?.({ collapsible: bond })}
+	{:else}
+		<Icon src={IconArrowDown} />
+	{/if}
+</HtmlAtom>

package/dist/components/collapsible/collapsible-indicator.svelte.d.ts

@@ -1,14 +1,7 @@
-export type CollapsibleHeaderProps<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base> = Override<HtmlAtomProps<E, B>, {
-    children?: Snippet<[{
-        collapsible?: CollapsibleBond;
-    }]>;
-}>;
-import type { Snippet } from 'svelte';
-import { CollapsibleBond } from './bond.svelte';
-import type { Override } from '../../types';
-import { type HtmlAtomProps, type Base } from '../atom';
+import { type Base } from '../atom';
+import type { CollapsibleIndicatorProps } from './types';
 declare function $$render<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base>(): {
-    props: CollapsibleHeaderProps<E, B>;
+    props: CollapsibleIndicatorProps<E, B>;
     exports: {};
     bindings: "";
     slots: {};