@svelte-atoms/core 1.0.0-alpha.14

package/dist/components/tabs/tab/atoms.d.ts

@@ -0,0 +1,4 @@
+export { default as Root } from './tab-root.svelte';
+export { default as Header } from './tab-header.svelte';
+export { default as Body } from './tab-body.svelte';
+export { default as Description } from './tab-description.svelte';

package/dist/components/tabs/tab/atoms.js

@@ -0,0 +1,4 @@
+export { default as Root } from './tab-root.svelte';
+export { default as Header } from './tab-header.svelte';
+export { default as Body } from './tab-body.svelte';
+export { default as Description } from './tab-description.svelte';

package/dist/components/tabs/tab/attachments.svelte.d.ts

@@ -0,0 +1,3 @@
+import { TabsBond } from '../bond.svelte';
+import type { TabBond } from './bond.svelte';
+export declare function tab(callback: (node: HTMLElement, tab?: TabBond, tabs?: TabsBond) => any): (node: HTMLElement) => any;

package/dist/components/tabs/tab/attachments.svelte.js

@@ -0,0 +1,6 @@
+import { TabsBond } from '../bond.svelte';
+export function tab(callback) {
+    const bond = TabsBond.get();
+    const tabs = bond.tabs;
+    return (node) => callback(node, bond, tabs);
+}

package/dist/components/tabs/tab/bond.svelte.d.ts

@@ -0,0 +1,53 @@
+import { Bond, BondState, type BondStateProps } from '../../../shared/bond.svelte';
+export type TabBondProps<T, S extends Record<string, unknown> = Record<string, unknown>> = BondStateProps & {
+    value: string;
+    disabled?: boolean;
+    data: T;
+    extend: S;
+};
+export type TabBondElement = {
+    header: HTMLElement;
+    body: HTMLElement;
+    description: HTMLElement;
+};
+export declare class TabBond<T = unknown> extends Bond<TabBondProps<T>, TabBondState<T>, TabBondElement> {
+    #private;
+    static CONTEXT_KEY: string;
+    constructor(state: TabBondState<T>);
+    get text(): string;
+    mount(): (() => void) | undefined;
+    unmount(): void;
+    share(): this;
+    root(props?: Record<string, unknown>): {};
+    header(props?: Record<string, unknown>): {
+        id: string;
+        role: string;
+        'aria-controls': string;
+        'aria-disabled': boolean;
+        'data-controler-id': string | undefined;
+        'data-active': boolean;
+        'data-kind': string;
+    };
+    body(props?: Record<string, unknown>): {
+        id: string;
+        role: string;
+        'aria-labeledby': string;
+        'aria-describedby': string;
+        'aria-controledby': string;
+        'data-active': boolean;
+        'data-kind': string;
+    };
+    description(props?: Record<string, unknown>): {
+        id: string;
+        'data-kind': string;
+    };
+    static get(): TabBond | undefined;
+    static set(bond: TabBond): TabBond;
+}
+export declare class TabBondState<T> extends BondState<TabBondProps<T>> {
+    #private;
+    constructor(props: () => TabBondProps<T>);
+    get isActive(): boolean;
+    select(): void;
+    unselect(): void;
+}

package/dist/components/tabs/tab/bond.svelte.js

@@ -0,0 +1,110 @@
+import { getContext, setContext } from 'svelte';
+import { createAttachmentKey } from 'svelte/attachments';
+import { TabsBond, TabsBondState } from '../bond.svelte';
+import { getElementId } from '../../../utils/dom.svelte';
+import { portal } from '../../../attachments/portal.svelte';
+import { Bond, BondState } from '../../../shared/bond.svelte';
+const TAB_ELEMENTS_KIND = {
+    root: 'tab-root',
+    header: 'tab-header',
+    body: 'tab-body',
+    description: 'tab-description'
+};
+export class TabBond extends Bond {
+    static CONTEXT_KEY = '@atoms/bonds/tabs/tab';
+    #tabs;
+    constructor(state) {
+        super(state);
+        this.#tabs = TabsBond.get();
+    }
+    get text() {
+        return this.elements?.header?.innerText ?? '';
+    }
+    mount() {
+        return this.#tabs?.state.mountItem(this.id, this);
+    }
+    unmount() {
+        this.#tabs?.state.unmountItem(this.id);
+    }
+    share() {
+        return TabBond.set(this);
+    }
+    root(props) {
+        return {};
+    }
+    header(props) {
+        const id = getElementId(this.id, TAB_ELEMENTS_KIND.header);
+        const tabBodyId = getElementId(this.id, TAB_ELEMENTS_KIND.body);
+        return {
+            id,
+            role: 'tab',
+            'aria-controls': tabBodyId,
+            'aria-disabled': this.state.props.disabled ?? false,
+            'data-controler-id': this.#tabs?.id,
+            'data-active': this.state.isActive,
+            'data-kind': 'tab-header',
+            ...props,
+            [createAttachmentKey()]: (node) => {
+                this.elements.header = node;
+                if (!this.#tabs?.elements.header) {
+                    node.hidden = true;
+                    return;
+                }
+                const unport = portal(this.#tabs.elements.header)(node);
+                return unport;
+            }
+        };
+    }
+    body(props) {
+        const id = getElementId(this.id, TAB_ELEMENTS_KIND.body);
+        const tabHeaderId = getElementId(this.id, TAB_ELEMENTS_KIND.header);
+        const descriptionId = getElementId(this.id, TAB_ELEMENTS_KIND.description);
+        const isActive = this.state.isActive;
+        return {
+            id,
+            role: 'tabpanel',
+            'aria-labeledby': tabHeaderId,
+            'aria-describedby': descriptionId,
+            'aria-controledby': tabHeaderId,
+            'data-active': isActive,
+            'data-kind': 'tab-body',
+            ...props,
+            [createAttachmentKey()]: (node) => {
+                this.elements.body = node;
+            }
+        };
+    }
+    description(props) {
+        const id = getElementId(this.id, TAB_ELEMENTS_KIND.description);
+        return {
+            id,
+            'data-kind': 'tab-description',
+            ...props,
+            [createAttachmentKey()]: (node) => {
+                this.elements.description = node;
+            }
+        };
+    }
+    static get() {
+        return getContext(TabBond.CONTEXT_KEY);
+    }
+    static set(bond) {
+        return setContext(TabBond.CONTEXT_KEY, bond);
+    }
+}
+export class TabBondState extends BondState {
+    #tabsState;
+    constructor(props) {
+        super(props);
+        this.#tabsState = TabsBond.get()?.state;
+    }
+    get isActive() {
+        return this.#tabsState?.props.value === this.props.value;
+    }
+    select() {
+        this.#tabsState?.select(this.props.value);
+    }
+    unselect() {
+        this.#tabsState?.unselect();
+    }
+}

package/dist/components/tabs/tab/index.d.ts

@@ -0,0 +1 @@
+export * as Tab from './atoms';

package/dist/components/tabs/tab/index.js

@@ -0,0 +1 @@
+export * as Tab from './atoms';

package/dist/components/tabs/tab/tab-body.svelte

@@ -0,0 +1,68 @@
+<script module lang="ts">
+	export type TabBodyProps<
+		E extends keyof HTMLElementTagNameMap = 'div',
+		B extends Base = Base
+	> = HtmlAtomProps<E, B> & {
+		children?: Snippet<[{ tab?: TabBond<unknown> }]>;
+	};
+</script>
+
+<script lang="ts" generics="E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base">
+	import type { Snippet } from 'svelte';
+	import { TabBond } from './bond.svelte';
+	import { toClassValue } from '../../../utils';
+	import { getPreset } from '../../../context';
+	import { HtmlAtom, type HtmlAtomProps, type Base } from '../../atom';
+
+	const bond = TabBond.get();
+
+	if (!bond) {
+		throw new Error('TabBody must be used within a Tab');
+	}
+
+	const preset = getPreset('tab.body');
+
+	let {
+		class: klass = '',
+		as = preset?.as ?? 'div',
+		base = preset?.base as B,
+		children,
+		onmount = undefined,
+		ondestroy = undefined,
+		animate = undefined,
+		enter = undefined,
+		exit = undefined,
+		initial = undefined,
+		...restProps
+	}: TabBodyProps<E, B> = $props();
+
+	let mounted = $state(false);
+
+	const bodyProps = $derived({
+		...bond?.body(),
+		...restProps
+	});
+
+	$effect(() => {
+		mounted = true;
+	});
+</script>
+
+<HtmlAtom
+	class={[
+		'tab-body pointer-events-auto flex h-auto w-full min-w-full flex-1 flex-col',
+		toClassValue.apply(bond, [preset?.class, { bond: bond }]),
+		toClassValue.apply(bond, [klass, { bond: 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)}
+	{as}
+	{base}
+	{...bodyProps}
+>
+	{@render children?.({ tab: bond })}
+</HtmlAtom>

package/dist/components/tabs/tab/tab-body.svelte.d.ts

@@ -0,0 +1,32 @@
+export type TabBodyProps<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base> = HtmlAtomProps<E, B> & {
+    children?: Snippet<[{
+        tab?: TabBond<unknown>;
+    }]>;
+};
+import type { Snippet } from 'svelte';
+import { TabBond } from './bond.svelte';
+import { type HtmlAtomProps, type Base } from '../../atom';
+declare function $$render<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base>(): {
+    props: TabBodyProps<E, B>;
+    exports: {};
+    bindings: "";
+    slots: {};
+    events: {};
+};
+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(): {};
+}
+interface $$IsomorphicComponent {
+    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 = '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 TabBody: $$IsomorphicComponent;
+type TabBody<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base> = InstanceType<typeof TabBody<E, B>>;
+export default TabBody;

package/dist/components/tabs/tab/tab-description.svelte

@@ -0,0 +1,53 @@
+<script module lang="ts">
+	export type TabDescriptionProps<
+		E extends keyof HTMLElementTagNameMap = 'p',
+		B extends Base = Base
+	> = HtmlAtomProps<E, B> & {
+		children?: Snippet<[{ tab?: TabBond<unknown> }]>;
+	};
+</script>
+
+<script lang="ts" generics="E extends keyof HTMLElementTagNameMap = 'p', B extends Base = Base">
+	import type { Snippet } from 'svelte';
+	import { TabBond } from './bond.svelte';
+	import { HtmlAtom, type HtmlAtomProps, type Base } from '../../atom';
+	import { getPreset } from '../../../context';
+	import { toClassValue } from '../../../utils';
+
+	const bond = TabBond.get();
+	const preset = getPreset('tab.description');
+
+	let {
+		class: klass = '',
+		as = preset?.as ?? ('p' as E),
+		base = preset?.base as B,
+		children,
+		onmount = undefined,
+		ondestroy = undefined,
+		animate = undefined,
+		enter = undefined,
+		exit = undefined,
+		initial = undefined,
+		...restProps
+	}: TabDescriptionProps<E, B> = $props();
+
+	const descriptionProps = $derived({
+		...bond?.description(),
+		...restProps
+	});
+</script>
+
+<HtmlAtom
+	class={[toClassValue.apply(bond, [preset?.class]), toClassValue.apply(bond, [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)}
+	{as}
+	{base}
+	{...descriptionProps}
+>
+	{@render children?.({ tab: bond })}
+</HtmlAtom>

package/dist/components/tabs/tab/tab-description.svelte.d.ts

@@ -0,0 +1,32 @@
+export type TabDescriptionProps<E extends keyof HTMLElementTagNameMap = 'p', B extends Base = Base> = HtmlAtomProps<E, B> & {
+    children?: Snippet<[{
+        tab?: TabBond<unknown>;
+    }]>;
+};
+import type { Snippet } from 'svelte';
+import { TabBond } from './bond.svelte';
+import { type HtmlAtomProps, type Base } from '../../atom';
+declare function $$render<E extends keyof HTMLElementTagNameMap = 'p', B extends Base = Base>(): {
+    props: TabDescriptionProps<E, B>;
+    exports: {};
+    bindings: "";
+    slots: {};
+    events: {};
+};
+declare class __sveltets_Render<E extends keyof HTMLElementTagNameMap = 'p', 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(): {};
+}
+interface $$IsomorphicComponent {
+    new <E extends keyof HTMLElementTagNameMap = 'p', 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 = 'p', 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 TabDescription: $$IsomorphicComponent;
+type TabDescription<E extends keyof HTMLElementTagNameMap = 'p', B extends Base = Base> = InstanceType<typeof TabDescription<E, B>>;
+export default TabDescription;

package/dist/components/tabs/tab/tab-header.svelte

@@ -0,0 +1,84 @@
+<script module lang="ts">
+	export type TabHeaderProps<
+		E extends keyof HTMLElementTagNameMap = 'button',
+		B extends Base = Base
+	> = HtmlAtomProps<E, B> & {
+		children?: Snippet<[{ tab?: TabBond<unknown> }]>;
+		onpointerdown?: (ev: PointerEvent, context: { tab?: TabBond<unknown> }) => void;
+	};
+</script>
+
+<script
+	lang="ts"
+	generics="E extends keyof HTMLElementTagNameMap = 'button', B extends Base = Base"
+>
+	import type { Snippet } from 'svelte';
+	import { TabBond } from './bond.svelte';
+	import { toClassValue } from '../../../utils';
+	import { HtmlAtom, type HtmlAtomProps, type Base } from '../../atom';
+	import { getPreset } from '../../../context';
+
+	const bond = TabBond.get();
+
+	const isActive = $derived(bond?.state.isActive);
+	const isDisabled = $derived(bond?.state.props.disabled);
+
+	const preset = getPreset('tab.header');
+
+	let {
+		class: klass = '',
+		as = preset?.as ?? 'button',
+		base = preset?.base as B,
+		children,
+		onpointerdown,
+		onmount = undefined,
+		ondestroy = undefined,
+		animate = undefined,
+		enter = undefined,
+		exit = undefined,
+		initial = undefined,
+		...restProps
+	}: TabHeaderProps = $props();
+
+	const headerProps = $derived({
+		...bond?.header(),
+		...restProps
+	});
+
+	function handlePointerDown(ev: PointerEvent) {
+		if (isDisabled) return;
+
+		onpointerdown?.(ev, { tab: bond });
+
+		if (ev.defaultPrevented) {
+			return;
+		}
+
+		bond?.state.select();
+	}
+</script>
+
+<HtmlAtom
+	as="button"
+	class={[
+		'text-foreground/60 hover:text-foreground/80 active:text-foreground/100 flex cursor-pointer items-center px-2 py-2 text-sm font-medium transition-colors duration-100',
+		isActive && 'text-primary',
+		isDisabled && 'opacity-50',
+		toClassValue.apply(bond, [preset?.class]),
+		toClassValue.apply(bond, [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)}
+	type="button"
+	disabled={isDisabled}
+	onpointerdown={handlePointerDown}
+	{...headerProps}
+>
+	{@render children?.({
+		tab: bond
+	})}
+</HtmlAtom>

package/dist/components/tabs/tab/tab-header.svelte.d.ts

@@ -0,0 +1,35 @@
+export type TabHeaderProps<E extends keyof HTMLElementTagNameMap = 'button', B extends Base = Base> = HtmlAtomProps<E, B> & {
+    children?: Snippet<[{
+        tab?: TabBond<unknown>;
+    }]>;
+    onpointerdown?: (ev: PointerEvent, context: {
+        tab?: TabBond<unknown>;
+    }) => void;
+};
+import type { Snippet } from 'svelte';
+import { TabBond } from './bond.svelte';
+import { type HtmlAtomProps, type Base } from '../../atom';
+declare function $$render<E extends keyof HTMLElementTagNameMap = 'button', B extends Base = Base>(): {
+    props: TabHeaderProps;
+    exports: {};
+    bindings: "";
+    slots: {};
+    events: {};
+};
+declare class __sveltets_Render<E extends keyof HTMLElementTagNameMap = 'button', 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(): {};
+}
+interface $$IsomorphicComponent {
+    new <E extends keyof HTMLElementTagNameMap = 'button', 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 = 'button', 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 TabHeader: $$IsomorphicComponent;
+type TabHeader<E extends keyof HTMLElementTagNameMap = 'button', B extends Base = Base> = InstanceType<typeof TabHeader<E, B>>;
+export default TabHeader;

package/dist/components/tabs/tab/tab-root.svelte

@@ -0,0 +1,91 @@
+<script
+	lang="ts"
+	generics="D, E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base"
+>
+	import { nanoid } from 'nanoid';
+	import { animate as motion } from 'motion';
+	import { TabBond, TabBondState, type TabBondProps } from './bond.svelte';
+	import { defineProperty, defineState, toClassValue } from '../../../utils';
+	import { TabsBond } from '../bond.svelte';
+	import { type Base } from '../../atom';
+	import { getPreset } from '../../../context';
+	import { Stack } from '../../stack';
+
+	const tabsBond = TabsBond.get<D>();
+
+	const headerElement = $derived(tabsBond?.elements.header);
+
+	const preset = getPreset('tab');
+
+	let {
+		class: klass = '',
+		as = preset?.as ?? ('div' as E),
+		base = preset?.base as B,
+		value = nanoid(),
+		disabled = false,
+		data = undefined,
+		factory = _factory,
+		children,
+		onmount = undefined,
+		ondestroy = undefined,
+		animate = _animate,
+		enter = undefined,
+		exit = undefined,
+		initial = undefined,
+		...restProps
+	} = $props();
+
+	const bondProps = defineState<TabBondProps<D>>([
+		defineProperty('value', () => value),
+		defineProperty('disabled', () => disabled),
+		defineProperty('data', () => data)
+	]);
+
+	const bond = factory(bondProps).share();
+
+	const rootProps = $derived({
+		...bond?.root(),
+		...restProps
+	});
+
+	const isActive = $derived(bond.state.isActive ?? false);
+
+	const unmount = bond.mount();
+	$effect(() => unmount);
+
+	function _factory(props: typeof bondProps) {
+		const bondState = new TabBondState(() => props);
+
+		return new TabBond(bondState);
+	}
+
+	function _animate(node: HTMLElement) {
+		motion(node, { opacity: +isActive }, { duration: 0 });
+	}
+
+	export function getBond() {
+		return bond;
+	}
+</script>
+
+{#if headerElement && children}
+	<Stack.Item
+		class={[
+			'tab-root flex flex-col',
+			!isActive && 'pointer-events-none',
+			toClassValue.apply(bond, [preset?.class]),
+			toClassValue.apply(bond, [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)}
+		{as}
+		{base}
+		{...rootProps}
+	>
+		{@render children?.({ tab: bond })}
+	</Stack.Item>
+{/if}

package/dist/components/tabs/tab/tab-root.svelte.d.ts

@@ -0,0 +1,45 @@
+import { TabBond, type TabBondProps } from './bond.svelte';
+import { type Base } from '../../atom';
+declare function $$render<D, E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base>(): {
+    props: {
+        class?: string;
+        as?: any;
+        base?: B;
+        value?: any;
+        disabled?: boolean;
+        data?: any;
+        factory?: (props: TabBondProps<D>) => TabBond<D>;
+        children: any;
+        onmount?: any;
+        ondestroy?: any;
+        animate?: (node: HTMLElement) => void;
+        enter?: any;
+        exit?: any;
+        initial?: any;
+    } & Record<string, any>;
+    exports: {
+        getBond: () => TabBond<D>;
+    };
+    bindings: "";
+    slots: {};
+    events: {};
+};
+declare class __sveltets_Render<D, E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base> {
+    props(): ReturnType<typeof $$render<D, E, B>>['props'];
+    events(): ReturnType<typeof $$render<D, E, B>>['events'];
+    slots(): ReturnType<typeof $$render<D, E, B>>['slots'];
+    bindings(): "";
+    exports(): {
+        getBond: () => TabBond<D>;
+    };
+}
+interface $$IsomorphicComponent {
+    new <D, E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<D, E, B>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<D, E, B>['props']>, ReturnType<__sveltets_Render<D, E, B>['events']>, ReturnType<__sveltets_Render<D, E, B>['slots']>> & {
+        $$bindings?: ReturnType<__sveltets_Render<D, E, B>['bindings']>;
+    } & ReturnType<__sveltets_Render<D, E, B>['exports']>;
+    <D, E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base>(internal: unknown, props: ReturnType<__sveltets_Render<D, E, B>['props']> & {}): ReturnType<__sveltets_Render<D, E, B>['exports']>;
+    z_$$bindings?: ReturnType<__sveltets_Render<any, any, any>['bindings']>;
+}
+declare const TabRoot: $$IsomorphicComponent;
+type TabRoot<D, E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base> = InstanceType<typeof TabRoot<D, E, B>>;
+export default TabRoot;