@plitzi/plitzi-ui 1.6.2

package/dist/components/Form/fields/FormSelect2.js

@@ -0,0 +1,27 @@
+import e from "../../Select2/index.js";
+import { useCallback as t, useMemo as n } from "react";
+import { jsx as r } from "react/jsx-runtime";
+import { Controller as i, useFormContext as a } from "react-hook-form";
+//#region src/components/Form/fields/FormSelect2.tsx
+var o = (o) => {
+	let { control: s } = a(), { valueAsString: c, onChange: l } = o, u = t((e) => (t) => {
+		e(t), l?.(t);
+	}, [c, l]), d = n(() => function({ field: { ref: t, value: i, onChange: a, name: s }, fieldState: { error: c } }) {
+		let l = n(() => u(a), [a, u]);
+		return /* @__PURE__ */ r(e, {
+			...o,
+			ref: t,
+			value: i,
+			name: s,
+			error: c?.message,
+			onChange: l
+		});
+	}, [o, u]);
+	return /* @__PURE__ */ r(i, {
+		control: o.control ?? s,
+		name: o.name,
+		render: d
+	});
+};
+//#endregion
+export { o as default };

package/dist/components/Form/fields/FormSwitch.d.ts

@@ -0,0 +1,6 @@
+import { BaseFormFieldType } from '../Form';
+import { SwitchProps } from '../../Switch';
+import { FieldValues, FieldPath } from 'react-hook-form';
+export type FormSwitchProps<T extends FieldValues, TName extends FieldPath<T>> = SwitchProps & BaseFormFieldType<T, TName>;
+declare const FormSwitch: <T extends FieldValues, TName extends FieldPath<T>>(props: FormSwitchProps<T, TName>) => import("react/jsx-runtime").JSX.Element;
+export default FormSwitch;

package/dist/components/Form/fields/FormSwitch.js

@@ -0,0 +1,27 @@
+import e from "../../Switch/index.js";
+import { useCallback as t, useMemo as n } from "react";
+import { jsx as r } from "react/jsx-runtime";
+import { Controller as i, useFormContext as a } from "react-hook-form";
+//#region src/components/Form/fields/FormSwitch.tsx
+var o = (o) => {
+	let { control: s } = a(), { onChange: c } = o, l = t((e) => (t) => {
+		e(t.target.checked), c?.(t);
+	}, [c]), u = n(() => function({ field: { ref: t, value: i, onChange: a, name: s }, fieldState: { error: c } }) {
+		let u = n(() => l(a), [a, l]);
+		return /* @__PURE__ */ r(e, {
+			...o,
+			ref: t,
+			value: i,
+			name: s,
+			error: c?.message,
+			onChange: u
+		});
+	}, [o, l]);
+	return /* @__PURE__ */ r(i, {
+		control: o.control ?? s,
+		name: o.name,
+		render: u
+	});
+};
+//#endregion
+export { o as default };

package/dist/components/Form/fields/FormTextArea.d.ts

@@ -0,0 +1,6 @@
+import { BaseFormFieldType } from '../Form';
+import { TextAreaProps } from '../../TextArea';
+import { FieldValues, FieldPath } from 'react-hook-form';
+export type FormTextAreaProps<T extends FieldValues, TName extends FieldPath<T>> = TextAreaProps & BaseFormFieldType<T, TName>;
+declare const FormTextArea: <T extends FieldValues, TName extends FieldPath<T>>(props: FormTextAreaProps<T, TName>) => import("react/jsx-runtime").JSX.Element;
+export default FormTextArea;

package/dist/components/Form/fields/FormTextArea.js

@@ -0,0 +1,27 @@
+import e from "../../TextArea/index.js";
+import { useCallback as t, useMemo as n } from "react";
+import { jsx as r } from "react/jsx-runtime";
+import { Controller as i, useFormContext as a } from "react-hook-form";
+//#region src/components/Form/fields/FormTextArea.tsx
+var o = (o) => {
+	let { control: s } = a(), { onChange: c } = o, l = t((e) => (t) => {
+		e(t), c?.(t);
+	}, [c]), u = n(() => function({ field: { ref: t, value: i, onChange: a, name: s }, fieldState: { error: c } }) {
+		let u = n(() => l(a), [a, l]);
+		return /* @__PURE__ */ r(e, {
+			...o,
+			ref: t,
+			value: i,
+			name: s,
+			error: c?.message,
+			onChange: u
+		});
+	}, [o, l]);
+	return /* @__PURE__ */ r(i, {
+		control: o.control ?? s,
+		name: o.name,
+		render: u
+	});
+};
+//#endregion
+export { o as default };

package/dist/components/Form/fields/index.d.ts

@@ -0,0 +1,21 @@
+import { default as FormCheckbox } from './FormCheckbox';
+import { default as FormColor } from './FormColor';
+import { default as FormConditional } from './FormConditional';
+import { default as FormFieldCustom } from './FormFieldCustom';
+import { default as FormFileUpload } from './FormFileUpload';
+import { default as FormInput } from './FormInput';
+import { default as FormSelect } from './FormSelect';
+import { default as FormSelect2 } from './FormSelect2';
+import { default as FormSwitch } from './FormSwitch';
+import { default as FormTextArea } from './FormTextArea';
+export * from './FormConditional';
+export * from './FormFileUpload';
+export * from './FormColor';
+export * from './FormCheckbox';
+export * from './FormSwitch';
+export * from './FormSelect2';
+export * from './FormFieldCustom';
+export * from './FormInput';
+export * from './FormSelect';
+export * from './FormTextArea';
+export { FormConditional as Conditional, FormFileUpload as FileUpload, FormInput as Input, FormTextArea as TextArea, FormSelect as Select, FormSelect2 as Select2, FormFieldCustom as Custom, FormSwitch as Switch, FormCheckbox as Checkbox, FormColor as Color };

package/dist/components/Form/fields/index.js

@@ -0,0 +1,26 @@
+import { __exportAll as e } from "../../../_virtual/_rolldown/runtime.js";
+import t from "./FormCheckbox.js";
+import n from "./FormColor.js";
+import r from "./FormConditional.js";
+import i from "./FormFieldCustom.js";
+import a from "./FormFileUpload.js";
+import o from "./FormInput.js";
+import s from "./FormSelect.js";
+import c from "./FormSelect2.js";
+import l from "./FormSwitch.js";
+import u from "./FormTextArea.js";
+//#region src/components/Form/fields/index.ts
+var d = /* @__PURE__ */ e({
+	Checkbox: () => t,
+	Color: () => n,
+	Conditional: () => r,
+	Custom: () => i,
+	FileUpload: () => a,
+	Input: () => o,
+	Select: () => s,
+	Select2: () => c,
+	Switch: () => l,
+	TextArea: () => u
+});
+//#endregion
+export { t as Checkbox, n as Color, r as Conditional, i as Custom, a as FileUpload, o as Input, s as Select, c as Select2, l as Switch, u as TextArea, d as fields_exports };

package/dist/components/Form/hooks/index.d.ts

@@ -0,0 +1,5 @@
+import { default as useForm } from './useForm';
+import { default as useFormWatch } from './useFormWatch';
+export * from './useForm';
+export * from './useFormWatch';
+export { useFormWatch, useForm };

package/dist/components/Form/hooks/index.js

@@ -0,0 +1,3 @@
+import e from "./useForm.js";
+import t from "./useFormWatch.js";
+export { e as useForm, t as useFormWatch };

package/dist/components/Form/hooks/useForm.d.ts

@@ -0,0 +1,18 @@
+import { FieldErrors, UseFormProps as UseReactHookFormProps, UseFormReturn as UseFormReturnReactHookForm, DefaultValues } from 'react-hook-form';
+import { z } from 'zod';
+export type ZodFormSchema = z.ZodObject | z.ZodDiscriminatedUnion<z.ZodObject[]> | z.ZodDiscriminatedUnion<readonly z.ZodObject[]>;
+export type UseFormProps<T extends ZodFormSchema> = Omit<UseReactHookFormProps<z.input<T>>, 'errors' | 'values' | 'formControl' | 'defaultValues'> & {
+    defaultValues?: DefaultValues<z.input<T>>;
+    errors?: FieldErrors<z.input<T>>;
+    config: {
+        schema: T;
+    };
+};
+export type UseFormReturn<T extends ZodFormSchema> = {
+    formMethods: UseFormReturnReactHookForm<z.input<T>, unknown, z.output<T>>;
+    config: {
+        schema: T;
+    };
+};
+declare const useForm: <T extends ZodFormSchema>({ defaultValues: defaultValuesProp, config: configProp, errors, ...props }: UseFormProps<T>) => UseFormReturn<T>;
+export default useForm;

package/dist/components/Form/hooks/useForm.js

@@ -0,0 +1,20 @@
+import e from "../../../hooks/useValueMemo/index.js";
+import { useMemo as t } from "react";
+import { useForm as n } from "react-hook-form";
+import { zodResolver as r } from "@hookform/resolvers/zod";
+//#region src/components/Form/hooks/useForm.ts
+var i = ({ defaultValues: i, config: a, errors: o, ...s }) => {
+	let c = e(i), l = e(a, "hard", { skipFunctions: !0 }), u = t(() => r(l.schema), [l.schema]);
+	return {
+		formMethods: n({
+			...s,
+			defaultValues: c,
+			context: void 0,
+			errors: o,
+			resolver: u
+		}),
+		config: l
+	};
+};
+//#endregion
+export { i as default };

package/dist/components/Form/hooks/useFormWatch.d.ts

@@ -0,0 +1,4 @@
+import { FieldPathValue, FieldPathValues, FieldValues, Path, UseFormReturn } from 'react-hook-form';
+declare function useFormWatch<T extends FieldValues, K extends Path<T>>(form: UseFormReturn<T>, names: K): FieldPathValue<T, K>;
+declare function useFormWatch<T extends FieldValues, K extends Path<T>[]>(form: UseFormReturn<T>, names?: [...K]): [...FieldPathValues<T, K>];
+export default useFormWatch;

package/dist/components/Form/hooks/useFormWatch.js

@@ -0,0 +1,24 @@
+import { get as e } from "../../../helpers/lodash/get.js";
+import t from "../../../hooks/useDidUpdateEffect/index.js";
+import { useEffect as n, useMemo as r, useState as i } from "react";
+//#region src/components/Form/hooks/useFormWatch.ts
+function a(a, o) {
+	let [s, c] = i(!1), l = r(() => o ?? Object.keys(a.formState.defaultValues ?? {}), [a.formState.defaultValues, o]), [u, d] = i(() => {
+		let t = a.getValues();
+		return Array.isArray(l) ? l.map((n) => e(t, n)) : t[l];
+	});
+	return n(() => {
+		let e = a.watch((e, { name: t }) => {
+			(typeof l == "string" || t && l.includes(t)) && d(a.getValues(l));
+		});
+		return s || (d(a.getValues(l)), c(!0)), () => e.unsubscribe();
+	}, [
+		a,
+		s,
+		l
+	]), t(() => {
+		d(a.getValues(l));
+	}, [a.formState.defaultValues]), u;
+}
+//#endregion
+export { a as default };

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

@@ -0,0 +1,10 @@
+import { useFormContext, useFieldArray } from 'react-hook-form';
+import { default as Form } from './Form';
+import { default as formTheme } from './Form.styles';
+import { useForm, useFormWatch } from './hooks';
+import * as fields from './fields';
+export * from './Form';
+export * from './fields';
+export * from './hooks';
+export default Form;
+export { fields, useForm, useFormWatch, useFormContext, useFieldArray, formTheme };

package/dist/components/Form/index.js

@@ -0,0 +1,20 @@
+import e from "./fields/FormCheckbox.js";
+import t from "./fields/FormColor.js";
+import n from "./fields/FormConditional.js";
+import r from "./fields/FormFieldCustom.js";
+import i from "./fields/FormFileUpload.js";
+import a from "./fields/FormInput.js";
+import o from "./fields/FormSelect.js";
+import s from "./fields/FormSelect2.js";
+import c from "./fields/FormSwitch.js";
+import l from "./fields/FormTextArea.js";
+import { fields_exports as u } from "./fields/index.js";
+import d from "./Form.js";
+import f from "./Form.styles.js";
+import p from "./hooks/useForm.js";
+import m from "./hooks/useFormWatch.js";
+import { useFieldArray as h, useFormContext as g } from "react-hook-form";
+//#region src/components/Form/index.ts
+var _ = d;
+//#endregion
+export { e as Checkbox, t as Color, n as Conditional, r as Custom, i as FileUpload, a as Input, o as Select, s as Select2, c as Switch, l as TextArea, _ as default, u as fields, f as formTheme, h as useFieldArray, p as useForm, g as useFormContext, m as useFormWatch };

package/dist/components/Heading/Heading.d.ts

@@ -0,0 +1,9 @@
+import { default as HeadingStyles, variantKeys } from './Heading.styles';
+import { useThemeSharedProps } from '../../hooks/useTheme';
+import { ReactNode } from 'react';
+export type HeadingProps = {
+    children?: ReactNode;
+    testId?: string;
+} & useThemeSharedProps<typeof HeadingStyles, typeof variantKeys>;
+declare const Heading: ({ as, className, children, testId, ...props }: HeadingProps) => import("react/jsx-runtime").JSX.Element;
+export default Heading;

package/dist/components/Heading/Heading.js

@@ -0,0 +1,17 @@
+import e from "../../hooks/useTheme/index.js";
+import t from "../../helpers/DynamicComponent.js";
+import { jsx as n } from "react/jsx-runtime";
+//#region src/components/Heading/Heading.tsx
+var r = ({ as: r = "h1", className: i = "", children: a = "Heading", testId: o, ...s }) => (i = e("Heading", {
+	className: i,
+	componentKey: "root",
+	variants: { as: r }
+}), /* @__PURE__ */ n(t, {
+	...s,
+	tag: r,
+	"data-testid": o,
+	className: i,
+	children: a
+}));
+//#endregion
+export { r as default };

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

@@ -0,0 +1,10 @@
+export declare const variantKeys: {
+    readonly as: readonly ["h1", "h2", "h3", "h4", "h5", "h6"];
+};
+export declare const STYLES_COMPONENT_NAME = "Heading";
+declare const _default: {
+    root: (props?: ({
+        as?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | null | undefined;
+    } & import('class-variance-authority/types').ClassProp) | undefined) => string;
+};
+export default _default;

package/dist/components/Heading/Heading.styles.js

@@ -0,0 +1,15 @@
+import e from "../../helpers/cvaWrapper.js";
+var t = { root: e("text-zinc-900 dark:text-zinc-100", {
+	variants: { as: {
+		h1: "text-5xl font-extrabold",
+		h2: "text-4xl font-extrabold",
+		h3: "text-3xl font-bold",
+		h4: "text-2xl font-bold",
+		h5: "text-xl font-bold",
+		h6: "text-lg font-bold"
+	} },
+	compoundVariants: [],
+	defaultVariants: { as: "h1" }
+}) };
+//#endregion
+export { t as default };

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

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

package/dist/components/Heading/index.js

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

package/dist/components/Icon/Icon.d.ts

@@ -0,0 +1,13 @@
+import { default as IconStyles, variantKeys } from './Icon.styles';
+import { useThemeSharedProps } from '../../hooks/useTheme';
+import { HTMLAttributes, ReactElement, ReactNode } from 'react';
+export type IconProps = {
+    children?: ReactNode;
+    icon?: string;
+    active?: boolean;
+    disabled?: boolean;
+    title?: string;
+    testId?: string;
+} & HTMLAttributes<HTMLElement> & useThemeSharedProps<typeof IconStyles, typeof variantKeys>;
+declare const Icon: ({ className, children, icon, active, disabled, testId, intent, size, cursor, title, ...props }: IconProps) => string | number | bigint | true | Iterable<ReactNode> | Promise<string | number | bigint | boolean | import('react').ReactPortal | ReactElement<unknown, string | import('react').JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | import("react/jsx-runtime").JSX.Element;
+export default Icon;

package/dist/components/Icon/Icon.js

@@ -0,0 +1,40 @@
+import e from "../../hooks/useTheme/index.js";
+import { getIntent as t } from "./utils.js";
+import { Children as n, cloneElement as r, isValidElement as i, useMemo as a } from "react";
+import { jsx as o } from "react/jsx-runtime";
+import s from "clsx";
+//#region src/components/Icon/Icon.tsx
+var c = ({ className: c, children: l, icon: u, active: d = !1, disabled: f = !1, testId: p, intent: m, size: h, cursor: g, title: _, ...v }) => {
+	let y = e("Icon", {
+		className: c,
+		componentKey: "root",
+		variants: {
+			intent: t(f, d, m),
+			size: h,
+			cursor: f ? "disabled" : g
+		}
+	}), { iconChildren: b } = a(() => {
+		let e = { iconChildren: void 0 };
+		return n.forEach(l, (t) => {
+			i(t) && (e.iconChildren = r(t, {
+				...v,
+				className: s({ "h-[1em] w-[1em]": h !== "custom" }, y, t.props.className),
+				title: _
+			}));
+		}), e;
+	}, [
+		l,
+		y,
+		v,
+		h,
+		_
+	]);
+	return b || /* @__PURE__ */ o("i", {
+		...v,
+		title: _,
+		"data-testid": p,
+		className: s(u, y)
+	});
+};
+//#endregion
+export { c as default };

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

@@ -0,0 +1,14 @@
+export declare const variantKeys: {
+    readonly intent: readonly ["primary", "primaryActive", "secondary", "secondaryActive", "tertiary", "tertiaryActive", "disabled", "danger", "success", "custom"];
+    readonly cursor: readonly ["pointer", "disabled", "custom"];
+    readonly size: readonly ["xs", "sm", "md", "lg", "xl", "2xl", "3xl", "4xl", "5xl", "6xl", "7xl", "8xl", "9xl", "custom"];
+};
+export declare const STYLES_COMPONENT_NAME = "Icon";
+declare const _default: {
+    root: (props?: ({
+        intent?: "custom" | "primary" | "primaryActive" | "secondary" | "secondaryActive" | "tertiary" | "tertiaryActive" | "disabled" | "danger" | "success" | null | undefined;
+        cursor?: "custom" | "disabled" | "pointer" | null | undefined;
+        size?: "xs" | "md" | "sm" | "lg" | "custom" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl" | null | undefined;
+    } & import('class-variance-authority/types').ClassProp) | undefined) => string;
+};
+export default _default;

package/dist/components/Icon/Icon.styles.js

@@ -0,0 +1,45 @@
+import e from "../../helpers/cvaWrapper.js";
+var t = { root: e("flex items-center justify-center", {
+	variants: {
+		intent: {
+			primary: "text-zinc-700 dark:text-zinc-300 hover:text-primary-ui",
+			primaryActive: "text-primary-ui",
+			secondary: "text-zinc-700 dark:text-zinc-300 hover:text-secondary-500 dark:hover:text-secondary-400",
+			secondaryActive: "text-secondary-500 dark:text-secondary-400",
+			tertiary: "hover:bg-grayviolet-200 dark:hover:bg-zinc-700 text-gray-500 dark:text-zinc-400",
+			tertiaryActive: "text-black dark:text-white",
+			disabled: "text-gray-400 dark:text-zinc-500",
+			danger: "text-red-500 hover:text-red-400",
+			success: "text-green-500 hover:text-green-400",
+			custom: ""
+		},
+		cursor: {
+			pointer: "cursor-pointer",
+			disabled: "cursor-not-allowed",
+			custom: ""
+		},
+		size: {
+			xs: "text-xs",
+			sm: "text-sm",
+			md: "",
+			lg: "text-lg",
+			xl: "text-xl",
+			"2xl": "text-2xl",
+			"3xl": "text-3xl",
+			"4xl": "text-4xl",
+			"5xl": "text-5xl",
+			"6xl": "text-6xl",
+			"7xl": "text-7xl",
+			"8xl": "text-8xl",
+			"9xl": "text-9xl",
+			custom: ""
+		}
+	},
+	compoundVariants: [],
+	defaultVariants: {
+		intent: "primary",
+		size: "md"
+	}
+}) };
+//#endregion
+export { t as default };

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

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

package/dist/components/Icon/index.js

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

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

@@ -0,0 +1,3 @@
+import { IconProps } from './Icon';
+declare const getIntent: (disabled: boolean, active: boolean, intent?: IconProps["intent"]) => IconProps["intent"];
+export { getIntent };

package/dist/components/Icon/utils.js

@@ -0,0 +1,4 @@
+//#region src/components/Icon/utils.tsx
+var e = (e, t, n = "primary") => e ? "disabled" : t && n === "primary" ? "primaryActive" : t && n === "secondary" ? "secondaryActive" : t && n === "tertiary" ? "tertiaryActive" : n;
+//#endregion
+export { e as getIntent };

package/dist/components/IconGroup/IconGroup.d.ts

@@ -0,0 +1,16 @@
+import { default as IconGroupStyles, variantKeys } from './IconGroup.styles';
+import { IconSeparatorProps } from './IconSeparator';
+import { variantKeys as variantKeysFlex } from '../Flex/Flex.styles';
+import { IconProps } from '../Icon';
+import { variantKeys as variantKeysIcon } from '../Icon/Icon.styles';
+import { useThemeSharedProps } from '../../hooks/useTheme';
+import { ReactElement, ReactNode } from 'react';
+export type IconGroupProps = {
+    children?: ReactNode;
+} & useThemeSharedProps<typeof IconGroupStyles, typeof variantKeys & typeof variantKeysFlex & typeof variantKeysIcon>;
+declare const IconGroup: {
+    ({ className, children, intent, size, direction, wrap, items, justify, gap }: IconGroupProps): import("react/jsx-runtime").JSX.Element;
+    Separator: ({ className, intent, size, direction }: IconSeparatorProps) => import("react/jsx-runtime").JSX.Element;
+    Icon: ({ className, children, icon, active, disabled, testId, intent, size, cursor, title, ...props }: IconProps) => string | number | bigint | true | Iterable<ReactNode> | Promise<string | number | bigint | boolean | import('react').ReactPortal | ReactElement<unknown, string | import('react').JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | import("react/jsx-runtime").JSX.Element;
+};
+export default IconGroup;

package/dist/components/IconGroup/IconGroup.js

@@ -0,0 +1,55 @@
+import e from "../../hooks/useTheme/index.js";
+import t from "../Flex/index.js";
+import n from "../Icon/index.js";
+import r from "./IconSeparator.js";
+import { Children as i, cloneElement as a, isValidElement as o, useMemo as s } from "react";
+import { jsx as c } from "react/jsx-runtime";
+//#region src/components/IconGroup/IconGroup.tsx
+var l = ({ className: l, children: u, intent: d, size: f, direction: p, wrap: m, items: h = "center", justify: g = "between", gap: _ = 2 }) => {
+	let v = e("IconGroup", {
+		className: l,
+		componentKey: [
+			"root",
+			"icon",
+			"separator"
+		],
+		variants: {
+			intent: d,
+			size: f,
+			direction: p
+		}
+	}), { icons: y } = s(() => {
+		let e = { icons: [] };
+		return i.forEach(u, (t, i) => {
+			o(t) && (t.type === n ? e.icons.push(a(t, {
+				key: i,
+				className: v.icon,
+				size: f,
+				intent: d,
+				...t.props
+			})) : t.type === r && e.icons.push(a(t, {
+				key: i,
+				size: f,
+				intent: d,
+				...t.props
+			})));
+		}), e;
+	}, [
+		u,
+		v,
+		f,
+		d
+	]);
+	return /* @__PURE__ */ c(t, {
+		className: v.root,
+		direction: p,
+		wrap: m,
+		items: h,
+		gap: _,
+		justify: g,
+		children: y
+	});
+};
+l.Separator = r, l.Icon = n;
+//#endregion
+export { l as default };

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

@@ -0,0 +1,18 @@
+export declare const variantKeys: {
+    readonly intent: readonly ["primary", "active", "disabled", "custom"];
+    readonly size: readonly ["xs", "sm", "md", "lg", "xl", "2xl", "3xl", "4xl", "5xl", "6xl", "7xl", "8xl", "9xl", "custom"];
+    readonly direction: readonly ["column", "row", "row-reverse", "col-reverse"];
+};
+export declare const STYLES_COMPONENT_NAME = "IconGroup";
+declare const _default: {
+    root: (props?: ({
+        intent?: "custom" | "primary" | "disabled" | "active" | null | undefined;
+        size?: "xs" | "md" | "sm" | "lg" | "custom" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl" | null | undefined;
+    } & import('class-variance-authority/types').ClassProp) | undefined) => string;
+    separator: (props?: ({
+        intent?: "default" | null | undefined;
+        direction?: "column" | "row" | "row-reverse" | "col-reverse" | null | undefined;
+    } & import('class-variance-authority/types').ClassProp) | undefined) => string;
+    icon: (props?: import('class-variance-authority/types').ClassProp | undefined) => string;
+};
+export default _default;

package/dist/components/IconGroup/IconGroup.styles.js

@@ -0,0 +1,70 @@
+import e from "../../helpers/cvaWrapper.js";
+var t = {
+	root: e("bg-grayviolet-200 dark:bg-zinc-700 text-zinc-700 dark:text-zinc-200", {
+		variants: {
+			intent: {
+				primary: "",
+				active: "",
+				disabled: "",
+				custom: ""
+			},
+			size: {
+				xs: "px-1.5 py-1 rounded-sm",
+				sm: "px-2 py-1.5 rounded",
+				md: "px-2.5 py-2 rounded-lg",
+				lg: "px-2.5 py-2 rounded-lg",
+				xl: "px-2.5 py-2 rounded-lg",
+				"2xl": "px-3 py-2 rounded-lg",
+				"3xl": "px-3 py-2 rounded-lg",
+				"4xl": "px-3 py-2 rounded-lg",
+				"5xl": "px-3 py-2 rounded-lg",
+				"6xl": "px-3 py-2 rounded-lg",
+				"7xl": "px-3 py-2 rounded-lg",
+				"8xl": "px-3 py-2 rounded-lg",
+				"9xl": "px-3 py-2 rounded-lg",
+				custom: ""
+			}
+		},
+		compoundVariants: [],
+		defaultVariants: {
+			intent: "primary",
+			size: "md"
+		}
+	}),
+	separator: e("bg-gray-500 dark:bg-zinc-500", {
+		variants: {
+			intent: { default: "" },
+			direction: {
+				column: "w-full",
+				row: "h-full",
+				"row-reverse": "h-full",
+				"col-reverse": "w-full"
+			}
+		},
+		compoundVariants: [
+			{
+				direction: "column",
+				className: "h-px"
+			},
+			{
+				direction: "col-reverse",
+				className: "h-px"
+			},
+			{
+				direction: "row",
+				className: "w-px"
+			},
+			{
+				direction: "row-reverse",
+				className: "w-px"
+			}
+		],
+		defaultVariants: {
+			intent: "default",
+			direction: "row"
+		}
+	}),
+	icon: e("")
+};
+//#endregion
+export { t as default };