@danalazar/metro-ui 0.0.2 → 0.0.4

package/README.md

@@ -0,0 +1,33 @@
+# Metro UI Library
+
+## Descriere
+
+`metro-ui` este o librărie de componente React reutilizabile, construită cu TypeScript și SASS modules. Librăria oferă componente UI modulare, tipate și gata de folosit în orice aplicație React.
+
+Componente incluse în prezent in metro-calc:
+
+- `Button` – suportă variante, dimensiuni, states (disabled, loading)
+- `Input` – suportă variante, dimensiuni, states (disabled)
+- `Modal` – generic, utilizabil pentru conținut custom
+- `Keypad` – tastatură numerică + operații
+- Alte componente: Select, InputWithActions, Form Field, Spinner
+
+Scop: oferirea unui set de componente reutilizabile pentru aplicații multiple.
+
+---
+
+## Instalare
+
+```
+git clone https://github.com/DanaLazar/metro-ui.git
+cd metro-ui
+npm install
+npm run storybook
+
+## Decizii arhitecturale
+- TypeScript pentru tipare stricte și siguranță în folosirea componentelor
+- SASS modules pentru styling customizabil și consistent
+- Stories cu Storybook pentru vizualizare și test manual
+- Componente independente, fără dependențe inutile
+- States suportate: disabled, loading, error (unde este relevant)
+```

package/dist/assets/button.css

@@ -1 +1 @@
-._button_6di44_1{color:#fff;background-color:#00f}
+._button_1wl47_1{cursor:pointer;border:none;border-radius:4px;justify-content:center;align-items:center;height:32px;padding:0 16px;font-weight:500;transition:all .2s;display:flex;position:relative;box-shadow:0 2px 4px #0000001a}._button_1wl47_1:hover{transform:translateY(-1px);box-shadow:0 4px 8px #00000026}._button_1wl47_1:active{transform:scale(.95)}._button--primary_1wl47_22{color:#fff;background:#0077a6}._button--primary_1wl47_22:hover{background:#00668f}._button--secondary_1wl47_29{color:#111827;background:0 0;border:2px solid #e5e7eb}._button--secondary_1wl47_29:hover{background:#f9fafb}._button--danger_1wl47_37{color:#fff;background:#d9482f}._button--danger_1wl47_37:hover{background:#b93e28}._button--dark_1wl47_44{color:#fff;background:#003d7a}._button--dark_1wl47_44:hover{background:#002d5a}._button--ghost_1wl47_51{color:#fff;background:0 0;border:2px solid #ffffff4d}._button--ghost_1wl47_51:hover{background:#ffffff1a}._button--sm_1wl47_59{height:32px;padding:0 12px;font-size:.875rem}._button--md_1wl47_64{height:40px;padding:0 16px;font-size:1rem}._button--lg_1wl47_69{height:48px;padding:0 20px;font-size:1.125rem}._button--disabled_1wl47_74{opacity:.5;cursor:not-allowed}._button--loading_1wl47_78{pointer-events:none}._hidden_1wl47_82{visibility:hidden}._spinnerWrapper_1wl47_86{justify-content:center;align-items:center;display:flex;position:absolute;inset:0}._spinner_1wl47_86{border:2px solid #0000;border-top-color:currentColor;border-radius:50%;animation:.8s linear infinite _spin_1wl47_86}._loadingContent_1wl47_101{align-items:center;gap:8px;display:flex}

package/dist/assets/formField.css

@@ -0,0 +1 @@
+._wrapper_10d1v_1{flex-direction:column;align-items:stretch;gap:4px;display:flex}._wrapper_10d1v_1 input{flex:1}._label_10d1v_11{color:#374151;font-size:.875rem;font-weight:500}._control_10d1v_17{align-items:stretch;display:flex}._control_10d1v_17>*{align-items:center;display:flex}._control--error_10d1v_25 input{border-color:#d9482f}._message_10d1v_29{color:#374151;font-size:.75rem}._error_10d1v_34{color:#d9482f}

package/dist/assets/input.css

@@ -0,0 +1 @@
+._input_1838g_1{border:2px solid #e5e7eb;border-radius:4px;outline:none;padding:0 1rem;font-size:1rem;transition:all .2s}._input_1838g_1:focus{border-color:#0077a6;box-shadow:0 0 0 2px #0077a633}._input--disabled_1838g_13{opacity:.6;cursor:not-allowed}._input--sm_1838g_17{height:32px}._input--md_1838g_20{height:40px}._input--lg_1838g_23{height:48px}

package/dist/assets/inputWithAction.css

@@ -0,0 +1 @@
+._wrapper_kdbo2_1{align-items:center;gap:8px;width:100%;display:flex}._wrapper_kdbo2_1>*{flex-shrink:0}._wrapper_kdbo2_1 input{flex:1}

package/dist/assets/keypad.css

@@ -0,0 +1 @@
+._keypad_1d13x_1{grid-template-columns:repeat(4,1fr);gap:8px;display:grid}._keypad__btn_1d13x_6{font-size:1.125rem}._keypad_1d13x_1 ._col-span-2_1d13x_9{grid-column:span 2}

package/dist/assets/modal.css

@@ -0,0 +1 @@
+._metro-modal-overlay_1s4mh_1{z-index:9999;background-color:#0009;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}._metro-modal_1s4mh_1{background-color:#fff;border-radius:4px;flex-direction:column;width:100%;max-width:520px;display:flex;overflow:hidden;box-shadow:0 10px 25px #0003}._metro-modal-header_1s4mh_22{color:#fff;background-color:#003d7a;justify-content:space-between;align-items:center;padding:16px 24px;display:flex}._metro-modal-header_1s4mh_22 h2{margin:0;font-size:1.25rem;font-weight:600}._metro-modal-header_1s4mh_22 button{cursor:pointer;color:#fff;background:0 0;border:none;justify-content:center;align-items:center;font-size:1.25rem;display:flex}._metro-modal-header_1s4mh_22 button:hover{opacity:.8}._metro-modal-content_1s4mh_49{flex-direction:column;gap:20px;padding:24px;display:flex}._expression-box_1s4mh_56{background-color:#f9fafb;border:1px solid #e5e7eb;border-radius:2px;padding:16px}._expression-box_1s4mh_56 p{color:#374151;margin:0}._expression-box_1s4mh_56 strong{color:#111827;margin-top:8px;font-size:1.125rem;display:block}._input-label_1s4mh_73{color:#374151;margin-bottom:6px;font-size:.875rem}._metro-modal-buttons_1s4mh_79{justify-content:space-between;gap:12px;padding:16px 24px;display:flex}._metro-modal-buttons_1s4mh_79 button{flex:1}

package/dist/assets/select.css

@@ -0,0 +1 @@
+._select_1azes_1{appearance:none;cursor:pointer;background-color:#fff;border:1px solid #e5e7eb;border-radius:4px;height:32px;padding:0 16px;font-size:.875rem;transition:all .2s}._select_1azes_1:focus{outline:none;box-shadow:0 0 0 2px #0077a633}._select--primary_1azes_16{border-color:#0077a6}._select--secondary_1azes_19{background:#f9fafb;border-color:#e5e7eb}._select--ghost_1azes_23{color:#fff;background:0 0;border:1px solid #ffffff4d}._select--disabled_1azes_28{opacity:.5;cursor:not-allowed}._select--sm_1azes_32{height:32px}._select--md_1azes_35{height:40px}._select--lg_1azes_38{height:48px}

package/dist/assets/spinner.css

@@ -0,0 +1 @@
+._spinner_wbe75_1{border:3px solid #0000;border-top-color:currentColor;border-radius:50%;animation:.8s linear infinite _spin_wbe75_1}._spinner--primary_wbe75_7{color:#0077a6}._spinner--secondary_wbe75_10{color:#111827}._spinner--white_wbe75_13{color:#fff}._spinner--sm_wbe75_16{width:16px;height:16px}._spinner--md_wbe75_20{width:24px;height:24px}._spinner--lg_wbe75_24{width:32px;height:32px}@keyframes _spin_wbe75_1{0%{transform:rotate(0)}to{transform:rotate(360deg)}}

package/dist/button-D2IRRUFN.js

@@ -0,0 +1,44 @@
+import { t as e } from "./clsx-CVy0r8TU.js";
+import { t } from "./spinner-BThkQA3X.js";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+import './assets/button.css';//#region src/components/button/button.module.sass
+var i = "_button_1wl47_1", a = "_hidden_1wl47_82", o = "_spinnerWrapper_1wl47_86", s = "_spinner_1wl47_86", c = "_spin_1wl47_86", l = "_loadingContent_1wl47_101", u = {
+	button: i,
+	"button--primary": "_button--primary_1wl47_22",
+	"button--secondary": "_button--secondary_1wl47_29",
+	"button--danger": "_button--danger_1wl47_37",
+	"button--dark": "_button--dark_1wl47_44",
+	"button--ghost": "_button--ghost_1wl47_51",
+	"button--sm": "_button--sm_1wl47_59",
+	"button--md": "_button--md_1wl47_64",
+	"button--lg": "_button--lg_1wl47_69",
+	"button--disabled": "_button--disabled_1wl47_74",
+	"button--loading": "_button--loading_1wl47_78",
+	hidden: a,
+	spinnerWrapper: o,
+	spinner: s,
+	spin: c,
+	loadingContent: l
+}, d = ({ children: i, variant: a = "primary", disabled: o, size: s = "md", isLoading: c = !1, loadingText: l, className: d, onClick: f, ...p }) => {
+	let m = o || c, h = () => a === "dark" ? "white" : a === "ghost" ? "primary" : "white";
+	return /* @__PURE__ */ n("button", {
+		"data-variant": a,
+		"data-size": s,
+		className: e(u.button, u[`button--${a}`], u[`button--${s}`], {
+			[u["button--disabled"]]: m,
+			[u["button--loading"]]: c
+		}, d),
+		disabled: m,
+		onClick: f,
+		...p,
+		children: c ? /* @__PURE__ */ r("span", {
+			className: u.loadingContent,
+			children: [/* @__PURE__ */ n(t, {
+				size: "sm",
+				variant: h()
+			}), /* @__PURE__ */ n("span", { children: l || i })]
+		}) : i
+	});
+};
+//#endregion
+export { d as t };

package/dist/clsx-CVy0r8TU.js

@@ -0,0 +1,16 @@
+//#region node_modules/clsx/dist/clsx.mjs
+function e(t) {
+	var n, r, i = "";
+	if (typeof t == "string" || typeof t == "number") i += t;
+	else if (typeof t == "object") if (Array.isArray(t)) {
+		var a = t.length;
+		for (n = 0; n < a; n++) t[n] && (r = e(t[n])) && (i && (i += " "), i += r);
+	} else for (r in t) t[r] && (i && (i += " "), i += r);
+	return i;
+}
+function t() {
+	for (var t, n, r = 0, i = "", a = arguments.length; r < a; r++) (t = arguments[r]) && (n = e(t)) && (i && (i += " "), i += n);
+	return i;
+}
+//#endregion
+export { t };

package/dist/components/button/button.d.ts

@@ -1,5 +1,10 @@
-type ButtonProps = Readonly<{
-    children: string;
-}>;
-export declare const Button: (props: ButtonProps) => import("react/jsx-runtime").JSX.Element;
-export {};
+export type ButtonVariant = "primary" | "secondary" | "danger" | "dark" | "ghost";
+export interface ButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "children"> {
+    children?: React.ReactNode;
+    variant?: ButtonVariant;
+    size?: "sm" | "md" | "lg";
+    isLoading?: boolean;
+    loadingText?: string;
+    onClick?: React.MouseEventHandler<HTMLButtonElement>;
+}
+export declare const Button: ({ children, variant, disabled, size, isLoading, loadingText, className, onClick, ...props }: ButtonProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/button/button.js

@@ -1,2 +1,3 @@
-import { t as e } from "../../button-CzP3GJ3Q.js";
+import { t as e } from "../../button-D2IRRUFN.js";
+import "../../spinner-BThkQA3X.js";
 export { e as Button };

package/dist/components/formField/formField.d.ts

@@ -0,0 +1,13 @@
+import { default as React } from 'react';
+type InputLikeProps = React.InputHTMLAttributes<HTMLInputElement> & {
+    error?: boolean;
+};
+export interface FormFieldProps {
+    label?: string;
+    error?: string;
+    helperText?: string;
+    children?: React.ReactElement<InputLikeProps>;
+    id: string;
+}
+export declare const FormField: ({ label, error, helperText, children, id, }: FormFieldProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/formField/formField.js

@@ -0,0 +1,2 @@
+import { t as e } from "../../formField-CYd3ghXm.js";
+export { e as FormField };

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

@@ -0,0 +1,5 @@
+export interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "size"> {
+    size?: "sm" | "md" | "lg";
+    error?: boolean;
+}
+export declare const Input: import('react').ForwardRefExoticComponent<InputProps & import('react').RefAttributes<HTMLInputElement>>;

package/dist/components/input/input.js

@@ -0,0 +1,2 @@
+import { t as e } from "../../input-B4hjpmbq.js";
+export { e as Input };

package/dist/components/inputWithActions/inputWithAction.d.ts

@@ -0,0 +1,5 @@
+export interface InputWithActionProps {
+    children: React.ReactNode;
+    className?: string;
+}
+export declare const InputWithAction: ({ children, className, }: InputWithActionProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/inputWithActions/inputWithAction.js

@@ -0,0 +1,2 @@
+import { t as e } from "../../inputWithAction-DrO4FktP.js";
+export { e as InputWithAction };

package/dist/components/keypad/keypad.d.ts

@@ -0,0 +1,11 @@
+export type KeypadButton = {
+    label: string;
+    type: "number" | "operation" | "clear" | "decimal" | "equals" | "backspace";
+    value?: string;
+    span?: number;
+};
+type KeypadProps = {
+    onKeyPress: (key: KeypadButton) => void;
+};
+export declare const Keypad: ({ onKeyPress }: KeypadProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/keypad/keypad.js

@@ -0,0 +1,4 @@
+import "../../button-D2IRRUFN.js";
+import "../../spinner-BThkQA3X.js";
+import { t as e } from "../../keypad-CrTKdzrB.js";
+export { e as Keypad };

package/dist/components/modal/modal.d.ts

@@ -0,0 +1,9 @@
+import { default as React } from 'react';
+export interface ModalProps {
+    isOpen: boolean;
+    title: string;
+    onClose: () => void;
+    children: React.ReactNode;
+    actions?: React.ReactNode;
+}
+export declare const Modal: React.FC<ModalProps>;

package/dist/components/modal/modal.js

@@ -0,0 +1,4 @@
+import "../../button-D2IRRUFN.js";
+import "../../spinner-BThkQA3X.js";
+import { t as e } from "../../modal-BcJDY1O7.js";
+export { e as Modal };

package/dist/components/select/select.d.ts

@@ -0,0 +1,16 @@
+export type SelectVariant = "primary" | "secondary" | "ghost";
+export interface SelectOption {
+    label: string;
+    value: string;
+}
+export interface SelectProps {
+    options: SelectOption[];
+    value?: string;
+    onChange?: (value: string) => void;
+    ariaLabel?: string;
+    variant?: SelectVariant;
+    size?: "sm" | "md" | "lg";
+    disabled?: boolean;
+    className?: string;
+}
+export declare const Select: ({ options, value, onChange, ariaLabel, variant, size, disabled, className, }: SelectProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/select/select.js

@@ -0,0 +1,2 @@
+import { t as e } from "../../select-DmezR35h.js";
+export { e as Select };

package/dist/components/spinner/spinner.d.ts

@@ -0,0 +1,6 @@
+export interface SpinnerProps {
+    size?: "sm" | "md" | "lg";
+    variant?: "primary" | "secondary" | "white";
+    className?: string;
+}
+export declare const Spinner: ({ size, variant, className, }: SpinnerProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/spinner/spinner.js

@@ -0,0 +1,2 @@
+import { t as e } from "../../spinner-BThkQA3X.js";
+export { e as Spinner };

package/dist/formField-CYd3ghXm.js

@@ -0,0 +1,39 @@
+import { t as e } from "./clsx-CVy0r8TU.js";
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
+import r from "react";
+import './assets/formField.css';//#region src/components/formField/formField.module.sass
+var i = "_wrapper_10d1v_1", a = "_label_10d1v_11", o = "_control_10d1v_17", s = "_message_10d1v_29", c = "_error_10d1v_34", l = {
+	wrapper: i,
+	label: a,
+	control: o,
+	"control--error": "_control--error_10d1v_25",
+	message: s,
+	error: c
+}, u = ({ label: i, error: a, helperText: o, children: s, id: c }) => {
+	let u = `${c}-message`;
+	return /* @__PURE__ */ n("div", {
+		className: l.wrapper,
+		children: [
+			i && /* @__PURE__ */ t("label", {
+				htmlFor: c,
+				className: l.label,
+				children: i
+			}),
+			/* @__PURE__ */ t("div", {
+				className: e(l.control, { [l["control--error"]]: a }),
+				children: s && r.cloneElement(s, {
+					id: c,
+					error: !!a,
+					"aria-describedby": a || o ? u : void 0
+				})
+			}),
+			(a || o) && /* @__PURE__ */ t("span", {
+				id: u,
+				className: e(l.message, { [l.error]: a }),
+				children: a || o
+			})
+		]
+	});
+};
+//#endregion
+export { u as t };

package/dist/input-B4hjpmbq.js

@@ -0,0 +1,20 @@
+import { t as e } from "./clsx-CVy0r8TU.js";
+import { jsx as t } from "react/jsx-runtime";
+import { forwardRef as n } from "react";
+import './assets/input.css';var r = {
+	input: "_input_1838g_1",
+	"input--disabled": "_input--disabled_1838g_13",
+	"input--sm": "_input--sm_1838g_17",
+	"input--md": "_input--md_1838g_20",
+	"input--lg": "_input--lg_1838g_23"
+}, i = n(({ size: n = "md", className: i, disabled: a, error: o, value: s, onChange: c, ...l }, u) => /* @__PURE__ */ t("input", {
+	ref: u,
+	value: s,
+	onChange: c,
+	"data-size": n,
+	"aria-invalid": o || void 0,
+	className: e(r.input, r[`input--${n}`], { [r["input--disabled"]]: a }, i),
+	...l
+}));
+//#endregion
+export { i as t };

package/dist/inputWithAction-DrO4FktP.js

@@ -0,0 +1,8 @@
+import { t as e } from "./clsx-CVy0r8TU.js";
+import { jsx as t } from "react/jsx-runtime";
+import './assets/inputWithAction.css';var n = { wrapper: "_wrapper_kdbo2_1" }, r = ({ children: r, className: i }) => /* @__PURE__ */ t("div", {
+	className: e(n.wrapper, i),
+	children: r
+});
+//#endregion
+export { r as t };

package/dist/keypad-CrTKdzrB.js

@@ -0,0 +1,111 @@
+import { t as e } from "./button-D2IRRUFN.js";
+import { jsx as t } from "react/jsx-runtime";
+import './assets/keypad.css';var n = {
+	keypad: "_keypad_1d13x_1",
+	keypad__btn: "_keypad__btn_1d13x_6",
+	"col-span-2": "_col-span-2_1d13x_9"
+}, r = [
+	{
+		label: "C",
+		type: "clear",
+		span: 2
+	},
+	{
+		label: "⌫",
+		type: "backspace"
+	},
+	{
+		label: "÷",
+		type: "operation"
+	},
+	{
+		label: "7",
+		type: "number",
+		value: "7"
+	},
+	{
+		label: "8",
+		type: "number",
+		value: "8"
+	},
+	{
+		label: "9",
+		type: "number",
+		value: "9"
+	},
+	{
+		label: "×",
+		type: "operation"
+	},
+	{
+		label: "4",
+		type: "number",
+		value: "4"
+	},
+	{
+		label: "5",
+		type: "number",
+		value: "5"
+	},
+	{
+		label: "6",
+		type: "number",
+		value: "6"
+	},
+	{
+		label: "-",
+		type: "operation"
+	},
+	{
+		label: "1",
+		type: "number",
+		value: "1"
+	},
+	{
+		label: "2",
+		type: "number",
+		value: "2"
+	},
+	{
+		label: "3",
+		type: "number",
+		value: "3"
+	},
+	{
+		label: "+",
+		type: "operation"
+	},
+	{
+		label: "0",
+		type: "number",
+		value: "0",
+		span: 2
+	},
+	{
+		label: ".",
+		type: "decimal"
+	},
+	{
+		label: "=",
+		type: "equals"
+	}
+], i = (e) => {
+	switch (e) {
+		case "operation": return "primary";
+		case "equals": return "dark";
+		case "clear":
+		case "backspace": return "danger";
+		default: return "secondary";
+	}
+}, a = ({ onKeyPress: a }) => /* @__PURE__ */ t("div", {
+	className: n.keypad,
+	children: r.map((r) => /* @__PURE__ */ t(e, {
+		variant: i(r.type),
+		size: "md",
+		className: r.span === 2 ? n["col-span-2"] : "",
+		onClick: () => a(r),
+		children: r.label
+	}, r.label))
+});
+//#endregion
+export { a as t };

package/dist/main.d.ts

@@ -1 +1,8 @@
 export { Button } from './components/button/button';
+export { InputWithAction } from './components/inputWithActions/inputWithAction';
+export { Modal } from './components/modal/modal';
+export { Spinner } from './components/spinner/spinner';
+export { Select } from './components/select/select';
+export { Input } from './components/input/input';
+export { FormField } from './components/formField/formField';
+export { Keypad } from './components/keypad/keypad';

package/dist/main.js

@@ -1,2 +1,9 @@
-import { t as e } from "./button-CzP3GJ3Q.js";
-export { e as Button };
+import { t as e } from "./button-D2IRRUFN.js";
+import { t } from "./spinner-BThkQA3X.js";
+import { t as n } from "./inputWithAction-DrO4FktP.js";
+import { t as r } from "./modal-BcJDY1O7.js";
+import { t as i } from "./select-DmezR35h.js";
+import { t as a } from "./input-B4hjpmbq.js";
+import { t as o } from "./formField-CYd3ghXm.js";
+import { t as s } from "./keypad-CrTKdzrB.js";
+export { e as Button, o as FormField, a as Input, n as InputWithAction, s as Keypad, r as Modal, i as Select, t as Spinner };

package/dist/modal-BcJDY1O7.js

@@ -0,0 +1,48 @@
+import { t as e } from "./button-D2IRRUFN.js";
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
+import r from "react";
+import './assets/modal.css';//#region src/components/modal/modal.module.sass
+var i = {
+	"metro-modal-overlay": "_metro-modal-overlay_1s4mh_1",
+	"metro-modal": "_metro-modal_1s4mh_1",
+	"metro-modal-header": "_metro-modal-header_1s4mh_22",
+	"metro-modal-content": "_metro-modal-content_1s4mh_49",
+	"expression-box": "_expression-box_1s4mh_56",
+	"input-label": "_input-label_1s4mh_73",
+	"metro-modal-buttons": "_metro-modal-buttons_1s4mh_79"
+}, a = ({ isOpen: a, title: o, onClose: s, children: c, actions: l }) => {
+	let u = r.useId();
+	return a ? /* @__PURE__ */ t("div", {
+		className: i["metro-modal-overlay"],
+		children: /* @__PURE__ */ n("div", {
+			className: i["metro-modal"],
+			role: "dialog",
+			"aria-modal": "true",
+			"aria-labelledby": u,
+			children: [
+				/* @__PURE__ */ n("div", {
+					className: i["metro-modal-header"],
+					children: [/* @__PURE__ */ t("h2", {
+						id: u,
+						children: o
+					}), /* @__PURE__ */ t(e, {
+						variant: "ghost",
+						onClick: s,
+						"aria-label": "Close dialog",
+						children: "✕"
+					})]
+				}),
+				/* @__PURE__ */ t("div", {
+					className: i["metro-modal-content"],
+					children: c
+				}),
+				l && /* @__PURE__ */ t("div", {
+					className: i["metro-modal-buttons"],
+					children: l
+				})
+			]
+		})
+	}) : null;
+};
+//#endregion
+export { a as t };

package/dist/select-DmezR35h.js

@@ -0,0 +1,26 @@
+import { t as e } from "./clsx-CVy0r8TU.js";
+import { jsx as t } from "react/jsx-runtime";
+import './assets/select.css';var n = {
+	select: "_select_1azes_1",
+	"select--primary": "_select--primary_1azes_16",
+	"select--secondary": "_select--secondary_1azes_19",
+	"select--ghost": "_select--ghost_1azes_23",
+	"select--disabled": "_select--disabled_1azes_28",
+	"select--sm": "_select--sm_1azes_32",
+	"select--md": "_select--md_1azes_35",
+	"select--lg": "_select--lg_1azes_38"
+}, r = ({ options: r, value: i, onChange: a, ariaLabel: o, variant: s = "primary", size: c = "md", disabled: l, className: u }) => /* @__PURE__ */ t("select", {
+	"aria-label": o ?? "Select",
+	"data-variant": s,
+	"data-size": c,
+	className: e(n.select, n[`select--${s}`], n[`select--${c}`], { [n["select--disabled"]]: l }, u),
+	value: i,
+	disabled: l,
+	onChange: (e) => a?.(e.target.value),
+	children: r.map((e) => /* @__PURE__ */ t("option", {
+		value: e.value,
+		children: e.label
+	}, e.value))
+});
+//#endregion
+export { r as t };

package/dist/spinner-BThkQA3X.js

@@ -0,0 +1,19 @@
+import { t as e } from "./clsx-CVy0r8TU.js";
+import { jsx as t } from "react/jsx-runtime";
+import './assets/spinner.css';var n = {
+	spinner: "_spinner_wbe75_1",
+	spin: "_spin_wbe75_1",
+	"spinner--primary": "_spinner--primary_wbe75_7",
+	"spinner--secondary": "_spinner--secondary_wbe75_10",
+	"spinner--white": "_spinner--white_wbe75_13",
+	"spinner--sm": "_spinner--sm_wbe75_16",
+	"spinner--md": "_spinner--md_wbe75_20",
+	"spinner--lg": "_spinner--lg_wbe75_24"
+}, r = ({ size: r = "md", variant: i = "primary", className: a }) => /* @__PURE__ */ t("div", {
+	"data-testid": "spinner",
+	"data-size": r,
+	"data-variant": i,
+	className: e(n.spinner, n[`spinner--${r}`], n[`spinner--${i}`], a)
+});
+//#endregion
+export { r as t };