@plitzi/plitzi-ui 1.6.2

package/dist/components/ContainerResizable/ContainerResizable.styles.d.ts

@@ -0,0 +1,20 @@
+export declare const variantKeys: {
+    readonly position: readonly ["s", "w", "e", "n", "sw", "nw", "se", "ne"];
+    readonly hover: readonly [true, false];
+};
+export declare const STYLES_COMPONENT_NAME = "ContainerResizable";
+declare const _default: {
+    root: (props?: import('class-variance-authority/types').ClassProp | undefined) => string;
+    rootInternal: (props?: import('class-variance-authority/types').ClassProp | undefined) => string;
+    handlerContainer: (props?: ({
+        intent?: null | undefined;
+        position?: "s" | "w" | "e" | "n" | "sw" | "nw" | "se" | "ne" | null | undefined;
+        hover?: boolean | null | undefined;
+    } & import('class-variance-authority/types').ClassProp) | undefined) => string;
+    handler: (props?: ({
+        intent?: null | undefined;
+        position?: "s" | "w" | "e" | "n" | "sw" | "nw" | "se" | "ne" | null | undefined;
+        hover?: boolean | null | undefined;
+    } & import('class-variance-authority/types').ClassProp) | undefined) => string;
+};
+export default _default;

package/dist/components/ContainerResizable/ContainerResizable.styles.js

@@ -0,0 +1,55 @@
+import e from "../../helpers/cvaWrapper.js";
+var t = {
+	root: e("relative flex flex-col"),
+	rootInternal: e("flex flex-col grow overflow-auto"),
+	handlerContainer: e("absolute flex justify-center items-center z-40", {
+		variants: {
+			intent: {},
+			position: {
+				n: "w-auto h-1 left-0 right-0 top-0 bg-gray-200 dark:bg-zinc-800",
+				s: "w-auto h-1 left-0 right-0 bottom-0 bg-gray-200 dark:bg-zinc-800",
+				e: "h-auto w-1 top-0 bottom-0 right-0 bg-gray-200 dark:bg-zinc-800",
+				w: "h-auto w-1 top-0 left-0 bottom-0 bg-gray-200 dark:bg-zinc-800",
+				sw: "",
+				nw: "",
+				se: "right-0 bottom-0",
+				ne: ""
+			},
+			hover: {
+				true: "hidden group-5-hover:flex",
+				false: ""
+			}
+		},
+		compoundVariants: [],
+		defaultVariants: {
+			hover: !1,
+			position: "se"
+		}
+	}),
+	handler: e("transition-[width,background-color] duration-500", {
+		variants: {
+			intent: {},
+			position: {
+				n: "h-0.5 hover:h-1 w-full bg-gray-300 dark:bg-zinc-700 hover:bg-primary-500 cursor-ns-resize",
+				s: "h-0.5 hover:h-1 w-full bg-gray-300 dark:bg-zinc-700 hover:bg-primary-500 cursor-ns-resize",
+				e: "h-full w-0.5 hover:w-1 bg-gray-300 dark:bg-zinc-700 hover:bg-primary-500 cursor-ew-resize",
+				w: "h-full w-0.5 hover:w-1 bg-gray-300 dark:bg-zinc-700 hover:bg-primary-ui cursor-ew-resize",
+				sw: "",
+				nw: "",
+				se: "h-3 w-3 cursor-se-resize border-b-4 border-r-4 border-gray-300 dark:border-zinc-700 hover:border-primary-ui active:pointer-events-none rounded-br-lg",
+				ne: ""
+			},
+			hover: {
+				true: "",
+				false: ""
+			}
+		},
+		compoundVariants: [],
+		defaultVariants: {
+			hover: !1,
+			position: "se"
+		}
+	})
+};
+//#endregion
+export { t as default };

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

@@ -0,0 +1,5 @@
+import { default as ContainerResizable } from './ContainerResizable';
+import { default as containerResizableTheme } from './ContainerResizable.styles';
+export * from './ContainerResizable';
+export { containerResizableTheme };
+export default ContainerResizable;

package/dist/components/ContainerResizable/index.js

@@ -0,0 +1,6 @@
+import e from "./ContainerResizable.styles.js";
+import t from "./ContainerResizable.js";
+//#region src/components/ContainerResizable/index.ts
+var n = t;
+//#endregion
+export { e as containerResizableTheme, n as default };

package/dist/components/ContainerResizable/utils.d.ts

@@ -0,0 +1,2 @@
+declare const snapToGrid: (pendingX: number, pendingY: number, grid: number[]) => number[];
+export { snapToGrid };

package/dist/components/ContainerResizable/utils.js

@@ -0,0 +1,4 @@
+//#region src/components/ContainerResizable/utils.ts
+var e = (e, t, n) => [Math.round(e / n[0]) * n[0], Math.round(t / n[1]) * n[1]];
+//#endregion
+export { e as snapToGrid };

package/dist/components/ContainerRoot/ContainerRoot.d.ts

@@ -0,0 +1,8 @@
+import { ReactNode } from 'react';
+export type ContainerRootProps = {
+    className?: string;
+    children?: ReactNode;
+    ssrMode?: boolean;
+};
+declare const ContainerRoot: ({ className, children, ...otherProps }: ContainerRootProps) => import("react/jsx-runtime").JSX.Element;
+export default ContainerRoot;

package/dist/components/ContainerRoot/ContainerRoot.js

@@ -0,0 +1,26 @@
+import e from "./ContainerRootContext.js";
+import { useCallback as t, useMemo as n, useRef as r } from "react";
+import { jsx as i } from "react/jsx-runtime";
+//#region src/components/ContainerRoot/ContainerRoot.tsx
+var a = ({ className: a = "", children: o, ...s }) => {
+	let c = r(null), l = t(() => c.current instanceof HTMLElement ? c.current.getRootNode() : void 0, [c]), u = t(() => l() instanceof ShadowRoot, [l]), d = n(() => ({
+		getHost: l,
+		rootRef: c,
+		isRootShadow: u
+	}), [
+		l,
+		c,
+		u
+	]);
+	return /* @__PURE__ */ i("div", {
+		...s,
+		ref: c,
+		className: a,
+		children: /* @__PURE__ */ i(e, {
+			value: d,
+			children: o
+		})
+	});
+};
+//#endregion
+export { a as default };

package/dist/components/ContainerRoot/ContainerRootContext.d.ts

@@ -0,0 +1,8 @@
+import { RefObject } from 'react';
+export type ContainerRootContextValue = {
+    rootRef: RefObject<HTMLDivElement | null>;
+    getHost: () => Node | undefined;
+    isRootShadow: () => boolean;
+};
+declare const ContainerRootContext: import('react').Context<ContainerRootContextValue>;
+export default ContainerRootContext;

package/dist/components/ContainerRoot/ContainerRootContext.js

@@ -0,0 +1,6 @@
+import { createContext as e } from "react";
+//#region src/components/ContainerRoot/ContainerRootContext.ts
+var t = e({});
+t.displayName = "ContainerRootContext";
+//#endregion
+export { t as default };

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

@@ -0,0 +1,6 @@
+import { default as ContainerRoot } from './ContainerRoot';
+import { default as ContainerRootContext } from './ContainerRootContext';
+export * from './ContainerRoot';
+export * from './ContainerRootContext';
+export { ContainerRootContext };
+export default ContainerRoot;

package/dist/components/ContainerRoot/index.js

@@ -0,0 +1,6 @@
+import e from "./ContainerRootContext.js";
+import t from "./ContainerRoot.js";
+//#region src/components/ContainerRoot/index.ts
+var n = t;
+//#endregion
+export { e as ContainerRootContext, n as default };

package/dist/components/ContainerRoot/useContainerRoot.d.ts

@@ -0,0 +1,2 @@
+declare const useContainerRoot: () => import('./ContainerRootContext').ContainerRootContextValue;
+export default useContainerRoot;

package/dist/components/ContainerRoot/useContainerRoot.js

@@ -0,0 +1,10 @@
+import e from "./ContainerRootContext.js";
+import { use as t } from "react";
+//#region src/components/ContainerRoot/useContainerRoot.ts
+var n = () => {
+	let n = t(e);
+	if (n === void 0) throw Error("ContainerRootContext value is undefined. Make sure you use the ContainerRootProvider before using the context.");
+	return n;
+};
+//#endregion
+export { n as default };

package/dist/components/ContainerShadow/ContainerShadow.d.ts

@@ -0,0 +1,20 @@
+import { ContainerShadowContentProps } from './ContainerShadowContent';
+import { ContainerShadowLinkProps } from './ContainerShadowLink';
+import { ContainerShadowStyleProps } from './ContainerShadowStyle';
+import { ReactNode, RefObject } from 'react';
+export type ContainerShadowProps = {
+    ref?: RefObject<HTMLDivElement>;
+    className?: string;
+    children?: ReactNode;
+    mode?: 'open' | 'closed';
+    delegatesFocus?: boolean;
+    stylesheets?: CSSStyleSheet[];
+    fallback?: ReactNode;
+};
+declare const ContainerShadow: {
+    ({ ref, className, children, mode, delegatesFocus, stylesheets, fallback }: ContainerShadowProps): import("react/jsx-runtime").JSX.Element;
+    Content: ({ children, contentDidMount, contentDidDismount }: ContainerShadowContentProps) => ReactNode;
+    Link: ({ href, onLoad, onError, onRegister, onUnregister, ...otherProps }: ContainerShadowLinkProps) => import("react/jsx-runtime").JSX.Element;
+    Style: ({ children, ...otherProps }: ContainerShadowStyleProps) => import("react/jsx-runtime").JSX.Element;
+};
+export default ContainerShadow;

package/dist/components/ContainerShadow/ContainerShadow.js

@@ -0,0 +1,98 @@
+import e from "./ContainerShadowContent.js";
+import t from "./ContainerShadowContext.js";
+import n from "./ContainerShadowLink.js";
+import r from "./ContainerShadowStyle.js";
+import { Children as i, cloneElement as a, isValidElement as o, useEffect as s, useImperativeHandle as c, useMemo as l, useRef as u, useState as d } from "react";
+import { jsx as f, jsxs as p } from "react/jsx-runtime";
+import { createPortal as m } from "react-dom";
+//#region src/components/ContainerShadow/ContainerShadow.tsx
+var h = ({ ref: h, className: g = "", children: _, mode: v = "open", delegatesFocus: y = !1, stylesheets: b, fallback: x }) => {
+	let S = u(null);
+	c(h, () => S.current, [S]);
+	let [C, w] = d(null), [T, E] = d(!1), D = (e) => {
+		I((t) => {
+			if (!e.current) return t;
+			let n = [...t.pending, e.current];
+			return {
+				isLoading: n.length > 0,
+				pending: n
+			};
+		});
+	}, O = (e) => {
+		I((t) => {
+			let n = t.pending.filter((t) => t !== e.current);
+			return {
+				isLoading: n.length > 0,
+				pending: n
+			};
+		});
+	}, k = (e) => {
+		I((t) => {
+			let n = t.pending.filter((t) => t !== e.target);
+			return {
+				isLoading: n.length > 0,
+				pending: n
+			};
+		});
+	}, A = (e) => {
+		I((t) => {
+			let n = t.pending.filter((t) => t !== e.target);
+			return {
+				isLoading: n.length > 0,
+				pending: n
+			};
+		});
+	}, j = () => {}, { content: M, links: N, styles: P } = l(() => {
+		let t = {
+			content: /* @__PURE__ */ f(e, {}, "shadow-content"),
+			links: [],
+			styles: []
+		};
+		return i.forEach(_, (i, s) => {
+			o(i) && (i.type === e ? t.content = a(i, {
+				...i.props,
+				key: "shadow-content",
+				contentDidMount: j
+			}) : i.type === n ? t.links.push(a(i, {
+				...i.props,
+				key: s,
+				onRegister: D,
+				onUnregister: O,
+				onLoad: k,
+				onError: A
+			})) : i.type === r && (t.content = a(i, {
+				...i.props,
+				key: s
+			})));
+		}), t;
+	}, [_]), [F, I] = d({
+		isLoading: N.length !== 0,
+		pending: []
+	});
+	s(() => {
+		if (S.current) {
+			let e = S.current.attachShadow({
+				mode: v,
+				delegatesFocus: y
+			});
+			b && (e.adoptedStyleSheets = b), w(e), E(!0);
+		}
+	}, []);
+	let L = l(() => ({ shadowRoot: C }), [C]), { isLoading: R } = F;
+	return /* @__PURE__ */ f("div", {
+		ref: S,
+		className: g,
+		children: T && C && m(/* @__PURE__ */ p(t, {
+			value: L,
+			children: [
+				N,
+				P,
+				!R && M,
+				R && x
+			]
+		}), C)
+	});
+};
+h.Content = e, h.Link = n, h.Style = r;
+//#endregion
+export { h as default };

package/dist/components/ContainerShadow/ContainerShadowContent.d.ts

@@ -0,0 +1,8 @@
+import { ReactNode } from 'react';
+export type ContainerShadowContentProps = {
+    children?: ReactNode;
+    contentDidMount?: () => void;
+    contentDidDismount?: () => void;
+};
+declare const ContainerShadowContent: ({ children, contentDidMount, contentDidDismount }: ContainerShadowContentProps) => ReactNode;
+export default ContainerShadowContent;

package/dist/components/ContainerShadow/ContainerShadowContent.js

@@ -0,0 +1,7 @@
+import { useEffect as e } from "react";
+//#region src/components/ContainerShadow/ContainerShadowContent.tsx
+var t = ({ children: t, contentDidMount: n, contentDidDismount: r }) => (e(() => (n?.(), () => {
+	r?.();
+}), []), t);
+//#endregion
+export { t as default };

package/dist/components/ContainerShadow/ContainerShadowContext.d.ts

@@ -0,0 +1,5 @@
+export type ContainerShadowContextValue = {
+    shadowRoot: ShadowRoot | null;
+};
+declare const ContainerShadowContext: import('react').Context<ContainerShadowContextValue>;
+export default ContainerShadowContext;

package/dist/components/ContainerShadow/ContainerShadowContext.js

@@ -0,0 +1,5 @@
+import { createContext as e } from "react";
+var t = e({ shadowRoot: null });
+t.displayName = "ContainerShadowContext";
+//#endregion
+export { t as default };

package/dist/components/ContainerShadow/ContainerShadowLink.d.ts

@@ -0,0 +1,10 @@
+import { LinkHTMLAttributes, RefObject, SyntheticEvent } from 'react';
+export type ContainerShadowLinkProps = {
+    href: string;
+    onLoad?: (e: SyntheticEvent) => void;
+    onError?: (e: SyntheticEvent) => void;
+    onRegister?: (ref: RefObject<HTMLLinkElement | null>) => void;
+    onUnregister?: (ref: RefObject<HTMLLinkElement | null>) => void;
+} & LinkHTMLAttributes<HTMLLinkElement>;
+declare const ContainerShadowLink: ({ href, onLoad, onError, onRegister, onUnregister, ...otherProps }: ContainerShadowLinkProps) => import("react/jsx-runtime").JSX.Element;
+export default ContainerShadowLink;

package/dist/components/ContainerShadow/ContainerShadowLink.js

@@ -0,0 +1,22 @@
+import { useEffect as e, useRef as t, useState as n } from "react";
+import { jsx as r } from "react/jsx-runtime";
+//#region src/components/ContainerShadow/ContainerShadowLink.tsx
+var i = ({ href: i, onLoad: a, onError: o, onRegister: s, onUnregister: c, ...l }) => {
+	let [u, d] = n(!1), f = t(null);
+	return e(() => (s?.(f), d(!0), () => {
+		c?.(f);
+	}), []), u ? /* @__PURE__ */ r("link", {
+		ref: f,
+		href: i,
+		onLoad: a,
+		onError: o,
+		rel: "stylesheet",
+		...l
+	}) : /* @__PURE__ */ r("link", {
+		ref: f,
+		rel: "stylesheet",
+		...l
+	});
+};
+//#endregion
+export { i as default };

package/dist/components/ContainerShadow/ContainerShadowStyle.d.ts

@@ -0,0 +1,6 @@
+import { StyleHTMLAttributes } from 'react';
+export type ContainerShadowStyleProps = {
+    children: string;
+} & StyleHTMLAttributes<HTMLLinkElement>;
+declare const ContainerShadowStyle: ({ children, ...otherProps }: ContainerShadowStyleProps) => import("react/jsx-runtime").JSX.Element;
+export default ContainerShadowStyle;

package/dist/components/ContainerShadow/ContainerShadowStyle.js

@@ -0,0 +1,10 @@
+import { useRef as e } from "react";
+import { jsx as t } from "react/jsx-runtime";
+//#region src/components/ContainerShadow/ContainerShadowStyle.tsx
+var n = ({ children: n, ...r }) => /* @__PURE__ */ t("style", {
+	ref: e(null),
+	...r,
+	children: n
+});
+//#endregion
+export { n as default };

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

@@ -0,0 +1,3 @@
+import { default as ContainerShadow } from './ContainerShadow';
+export * from './ContainerShadow';
+export default ContainerShadow;

package/dist/components/ContainerShadow/index.js

@@ -0,0 +1,5 @@
+import e from "./ContainerShadow.js";
+//#region src/components/ContainerShadow/index.ts
+var t = e;
+//#endregion
+export { t as default };

package/dist/components/ContainerTabs/ContainerTabs.d.ts

@@ -0,0 +1,13 @@
+import { default as ContainerTabsStyles, variantKeys } from './ContainerTabs.styles';
+import { TabContentProps } from './TabContent';
+import { TabsProps } from './Tabs';
+import { useThemeSharedProps } from '../../hooks/useTheme';
+export type ContainerTabsProps = {
+    children?: React.ReactNode;
+} & useThemeSharedProps<typeof ContainerTabsStyles, typeof variantKeys>;
+declare const ContainerTabs: {
+    ({ children, className, size }: ContainerTabsProps): import("react/jsx-runtime").JSX.Element;
+    Tabs: ({ className, items, tabSelected, size, onSelect }: TabsProps) => import("react/jsx-runtime").JSX.Element;
+    TabContent: ({ children, className, size }: TabContentProps) => import("react/jsx-runtime").JSX.Element;
+};
+export default ContainerTabs;

package/dist/components/ContainerTabs/ContainerTabs.js

@@ -0,0 +1,56 @@
+import e from "../../hooks/useTheme/index.js";
+import t from "./TabContent.js";
+import n from "./Tabs.js";
+import { Children as r, cloneElement as i, isValidElement as a, useCallback as o, useMemo as s, useState as c } from "react";
+import { jsx as l, jsxs as u } from "react/jsx-runtime";
+//#region src/components/ContainerTabs/ContainerTabs.tsx
+var d = ({ children: d, className: f, size: p }) => {
+	f = e("ContainerTabs", {
+		className: f,
+		componentKey: "root",
+		variants: { size: p }
+	});
+	let [m, h] = c(0), g = o((e) => h(e), []), { tabs: _, content: v } = s(() => {
+		let e = {
+			tabs: /* @__PURE__ */ l(n, {
+				tabSelected: m,
+				size: p,
+				onSelect: g
+			}),
+			content: /* @__PURE__ */ l(t, {})
+		}, o = 0;
+		return r.forEach(d, (r) => {
+			if (a(r)) {
+				if (r.type === n) {
+					let t = r.props;
+					e.tabs = i(r, {
+						...t,
+						key: "tabs",
+						tabSelected: m,
+						size: p,
+						onSelect: g
+					});
+				} else if (r.type === t && o++ === m) {
+					let t = r.props;
+					e.content = i(r, {
+						...t,
+						key: `content-${m}`,
+						size: p
+					});
+				}
+			}
+		}), e;
+	}, [
+		m,
+		g,
+		d,
+		p
+	]);
+	return /* @__PURE__ */ u("div", {
+		className: f,
+		children: [_, v]
+	});
+};
+d.Tabs = n, d.TabContent = t;
+//#endregion
+export { d as default };

package/dist/components/ContainerTabs/ContainerTabs.styles.d.ts

@@ -0,0 +1,15 @@
+export declare const variantKeys: {
+    readonly active: readonly [true, false];
+    readonly size: readonly ["xs", "sm", "md", "custom"];
+};
+export declare const STYLES_COMPONENT_NAME = "ContainerTabs";
+declare const _default: {
+    root: (props?: import('class-variance-authority/types').ClassProp | undefined) => string;
+    content: (props?: import('class-variance-authority/types').ClassProp | undefined) => string;
+    tabs: (props?: import('class-variance-authority/types').ClassProp | undefined) => string;
+    tab: (props?: ({
+        active?: boolean | null | undefined;
+        size?: "xs" | "md" | "sm" | "custom" | null | undefined;
+    } & import('class-variance-authority/types').ClassProp) | undefined) => string;
+};
+export default _default;

package/dist/components/ContainerTabs/ContainerTabs.styles.js

@@ -0,0 +1,27 @@
+import e from "../../helpers/cvaWrapper.js";
+var t = {
+	root: e("flex flex-col"),
+	content: e("flex"),
+	tabs: e("flex bg-gray-100 dark:bg-zinc-800 border border-gray-200 dark:border-zinc-700 rounded-lg p-1 select-none gap-0.5"),
+	tab: e("flex items-center justify-center rounded  basis-0 grow cursor-pointer py-1 px-3 text-sm font-medium transition-colors duration-150 select-none", {
+		variants: {
+			active: {
+				true: "bg-white dark:bg-zinc-700 text-zinc-900 dark:text-zinc-100 shadow-sm",
+				false: "text-zinc-500 dark:text-zinc-400 hover:text-zinc-700 dark:hover:text-zinc-200"
+			},
+			size: {
+				md: "",
+				sm: "text-sm",
+				xs: "text-xs",
+				custom: ""
+			}
+		},
+		compoundVariants: [],
+		defaultVariants: {
+			active: !1,
+			size: "md"
+		}
+	})
+};
+//#endregion
+export { t as default };

package/dist/components/ContainerTabs/Tab.d.ts

@@ -0,0 +1,11 @@
+import { default as ContainerTabsStyles, variantKeys } from './ContainerTabs.styles';
+import { useThemeSharedProps } from '../../hooks/useTheme';
+import { ReactNode } from 'react';
+export type TabProps = {
+    label?: ReactNode;
+    active?: boolean;
+    index?: number;
+    onSelect?: (index: number) => void;
+} & useThemeSharedProps<typeof ContainerTabsStyles, typeof variantKeys>;
+declare const Tab: ({ className, label, active, index, size, onSelect }: TabProps) => import("react/jsx-runtime").JSX.Element;
+export default Tab;

package/dist/components/ContainerTabs/Tab.js

@@ -0,0 +1,22 @@
+import e from "../../hooks/useTheme/index.js";
+import { useCallback as t } from "react";
+import { jsx as n } from "react/jsx-runtime";
+//#region src/components/ContainerTabs/Tab.tsx
+var r = ({ className: r, label: i = "Tab Name", active: a, index: o = 0, size: s, onSelect: c }) => {
+	r = e("ContainerTabs", {
+		className: r,
+		componentKey: "tab",
+		variants: {
+			active: a,
+			size: s
+		}
+	});
+	let l = t(() => c?.(o), [o, c]);
+	return /* @__PURE__ */ n("div", {
+		className: r,
+		onClick: l,
+		children: i
+	});
+};
+//#endregion
+export { r as default };

package/dist/components/ContainerTabs/TabContent.d.ts

@@ -0,0 +1,8 @@
+import { default as ContainerTabsStyles, variantKeys } from './ContainerTabs.styles';
+import { useThemeSharedProps } from '../../hooks/useTheme';
+import { ReactNode } from 'react';
+export type TabContentProps = {
+    children?: ReactNode;
+} & useThemeSharedProps<typeof ContainerTabsStyles, typeof variantKeys>;
+declare const TabContent: ({ children, className, size }: TabContentProps) => import("react/jsx-runtime").JSX.Element;
+export default TabContent;

package/dist/components/ContainerTabs/TabContent.js

@@ -0,0 +1,13 @@
+import e from "../../hooks/useTheme/index.js";
+import { jsx as t } from "react/jsx-runtime";
+//#region src/components/ContainerTabs/TabContent.tsx
+var n = ({ children: n, className: r, size: i }) => (r = e("ContainerTabs", {
+	className: r,
+	componentKey: "content",
+	variants: { size: i }
+}), /* @__PURE__ */ t("div", {
+	className: r,
+	children: n
+}));
+//#endregion
+export { n as default };

package/dist/components/ContainerTabs/Tabs.d.ts

@@ -0,0 +1,12 @@
+import { default as ContainerTabsStyles, variantKeys } from './ContainerTabs.styles';
+import { useThemeSharedProps } from '../../hooks/useTheme';
+export type TabItem = {
+    label: string;
+};
+export type TabsProps = {
+    items?: TabItem[];
+    tabSelected?: number;
+    onSelect?: (index: number) => void;
+} & useThemeSharedProps<typeof ContainerTabsStyles, typeof variantKeys>;
+declare const Tabs: ({ className, items, tabSelected, size, onSelect }: TabsProps) => import("react/jsx-runtime").JSX.Element;
+export default Tabs;

package/dist/components/ContainerTabs/Tabs.js

@@ -0,0 +1,20 @@
+import e from "../../hooks/useTheme/index.js";
+import t from "./Tab.js";
+import { jsx as n } from "react/jsx-runtime";
+//#region src/components/ContainerTabs/Tabs.tsx
+var r = ({ className: r, items: i = [], tabSelected: a = 0, size: o, onSelect: s }) => (r = e("ContainerTabs", {
+	className: r,
+	componentKey: "tabs",
+	variants: { size: o }
+}), /* @__PURE__ */ n("div", {
+	className: r,
+	children: i.map((e, r) => /* @__PURE__ */ n(t, {
+		label: e.label,
+		active: a === r,
+		index: r,
+		size: o,
+		onSelect: s
+	}, r))
+}));
+//#endregion
+export { r as default };

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

@@ -0,0 +1,11 @@
+import { default as ContainerTabs } from './ContainerTabs';
+import { default as containerTabsTheme } from './ContainerTabs.styles';
+import { default as Tab } from './Tab';
+import { default as TabContent } from './TabContent';
+import { default as Tabs } from './Tabs';
+export * from './ContainerTabs';
+export * from './Tabs';
+export * from './Tab';
+export * from './TabContent';
+export { Tabs, Tab, TabContent, containerTabsTheme };
+export default ContainerTabs;

package/dist/components/ContainerTabs/index.js

@@ -0,0 +1,9 @@
+import e from "./TabContent.js";
+import t from "./Tab.js";
+import n from "./Tabs.js";
+import r from "./ContainerTabs.js";
+import i from "./ContainerTabs.styles.js";
+//#region src/components/ContainerTabs/index.ts
+var a = r;
+//#endregion
+export { t as Tab, e as TabContent, n as Tabs, i as containerTabsTheme, a as default };