alif-ui 2.0.0-alpha.2 → 2.0.0-alpha.21

package/dist/components/Drawer/Drawer.js

@@ -1,96 +1,48 @@
-import { jsx as o, jsxs as B } from "react/jsx-runtime";
-import { classNames as m } from "../../utils/class-names.js";
-import { c as r } from "../../Drawer.module-Bxp60Xmp.js";
-import { DrawerHeader as L } from "./DrawerHeader/DrawerHeader.js";
-import { DrawerContent as R } from "./DrawerContent/DrawerContent.js";
-import { DrawerActions as S } from "./DrawerActions/DrawerActions.js";
-import { positionToTransitionName as T, getDrawerStyle as j, ARIA_CLOSE_LABEL as k } from "./Drawer.utils.js";
-import { useFocusTrapAndRestore as v } from "../../hooks/useFocusTrapAndRestore/useFocusTrapAndRestore.js";
-import { useLocale as E } from "../../providers/hooks/useLocale/useLocale.js";
-import { Backdrop as H } from "../Backdrop/Backdrop.js";
-import { Button as I } from "../Button/Button.js";
-import { OutlineSystemClose as _ } from "../../icons/components/OutlineSystemClose.js";
-const e = ({
-  isOpen: a,
-  onClose: s,
-  children: i,
-  withCloseButton: l = !0,
-  closeOnClickOutside: n = !0,
-  scrollable: c = !0,
-  width: d,
-  height: f,
-  maxWidth: p,
-  maxHeight: u,
-  variant: w = "default",
-  position: t = "right",
-  zIndex: A,
-  className: C,
-  style: g,
-  ref: h,
-  ...D
-}) => {
-  const { locale: N } = E(), b = v(a), x = m(
-    r.root,
-    w === "floating" && r.rounded,
-    r[t]
-  ), y = m(
-    r.drawer,
-    (c || t === "bottom" || t === "top") && r.scrollable,
-    C
-  );
-  return /* @__PURE__ */ o(
-    H,
-    {
-      ref: h,
-      isOpen: a,
-      onClose: s,
-      closeOnClickOutside: n,
-      className: x,
-      "data-testid": "container",
-      zIndex: A,
-      transitionProps: {
-        transition: T[t]
-      },
-      children: /* @__PURE__ */ B(
-        "div",
-        {
-          ref: b,
-          role: "dialog",
-          tabIndex: -1,
-          "data-testid": "drawer",
-          "aria-modal": "true",
-          className: y,
-          style: j(
-            t,
-            d,
-            f,
-            p,
-            u,
-            g
-          ),
-          ...D,
-          children: [
-            i,
-            l && /* @__PURE__ */ o(
-              I,
-              {
-                className: r.closeButton,
-                variant: "ghost",
-                color: "tertiary",
-                "aria-label": k[N],
-                onClick: s,
-                children: /* @__PURE__ */ o(_, {})
-              }
-            )
-          ]
-        }
-      )
-    }
-  );
-};
-e.Header = L;
-e.Content = R;
-e.Actions = S;
-export {
-  e as Drawer
+"use client";
+import { classNames as e } from "../../utils/class-names.js";
+import { OutlineSystemClose as t } from "../../icons/components/OutlineSystemClose.js";
+import { Backdrop as n } from "../Backdrop/Backdrop.js";
+import { useLocale as r } from "../../providers/hooks/useLocale/useLocale.js";
+import { Button as i } from "../Button/Button.js";
+import a from "../../lib/components/Drawer/Drawer.module.js";
+import { DrawerHeader as o } from "./DrawerHeader/DrawerHeader.js";
+import { DrawerContent as s } from "./DrawerContent/DrawerContent.js";
+import { DrawerActions as c } from "./DrawerActions/DrawerActions.js";
+import { ARIA_CLOSE_LABEL as l, getDrawerStyle as u, positionToTransitionName as d } from "./Drawer.utils.js";
+import { useFocusTrapAndRestore as f } from "../../hooks/useFocusTrapAndRestore/useFocusTrapAndRestore.js";
+import { jsx as p, jsxs as m } from "react/jsx-runtime";
+//#region src/lib/components/Drawer/Drawer.tsx
+var h = ({ isOpen: o, onClose: s, children: c, withCloseButton: h = !0, closeOnClickOutside: g = !0, scrollable: _ = !0, width: v, height: y, maxWidth: b, maxHeight: x, variant: S = "default", position: C = "right", zIndex: w, className: T, style: E, ref: D, ...O }) => {
+	let { locale: k } = r(), A = f(o), j = e(a.root, S === "floating" && a.rounded, a[C]), M = e(a.drawer, (_ || C === "bottom" || C === "top") && a.scrollable, T);
+	return /* @__PURE__ */ p(n, {
+		ref: D,
+		isOpen: o,
+		onClose: s,
+		closeOnClickOutside: g,
+		className: j,
+		"data-testid": "container",
+		zIndex: w,
+		transitionProps: { transition: d[C] },
+		children: /* @__PURE__ */ m("div", {
+			ref: A,
+			role: "dialog",
+			tabIndex: -1,
+			"data-testid": "drawer",
+			"aria-modal": "true",
+			className: M,
+			style: u(C, v, y, b, x, E),
+			...O,
+			children: [c, h && /* @__PURE__ */ p(i, {
+				className: a.closeButton,
+				variant: "ghost",
+				color: "tertiary",
+				"aria-label": l[k],
+				onClick: s,
+				children: /* @__PURE__ */ p(t, {})
+			})]
+		})
+	});
 };
+h.Header = o, h.Content = s, h.Actions = c;
+//#endregion
+export { h as Drawer };

package/dist/components/Drawer/Drawer.types.js

@@ -1 +0,0 @@
-

package/dist/components/Drawer/Drawer.utils.js

@@ -1,24 +1,22 @@
-const l = {
-  left: "slide-right",
-  right: "slide-left",
-  top: "slide-down",
-  bottom: "slide-up"
-}, d = (t, e, o, r, n, i) => t === "left" || t === "right" ? {
-  maxWidth: r || "500px",
-  width: e || "100%",
-  ...i
+//#region src/lib/components/Drawer/Drawer.utils.ts
+var e = {
+	left: "slide-right",
+	right: "slide-left",
+	top: "slide-down",
+	bottom: "slide-up"
+}, t = (e, t, n, r, i, a) => e === "left" || e === "right" ? {
+	maxWidth: r || "500px",
+	width: t || "100%",
+	...a
 } : {
-  maxHeight: n || "500px",
-  height: o || "100%",
-  width: "100%",
-  ...i
-}, h = {
-  en: "Close drawer",
-  ru: "Закрыть панель",
-  tj: "Пӯшидани панел"
-};
-export {
-  h as ARIA_CLOSE_LABEL,
-  d as getDrawerStyle,
-  l as positionToTransitionName
+	maxHeight: i || "500px",
+	height: n || "100%",
+	width: "100%",
+	...a
+}, n = {
+	en: "Close drawer",
+	ru: "Закрыть панель",
+	tj: "Пӯшидани панел"
 };
+//#endregion
+export { n as ARIA_CLOSE_LABEL, t as getDrawerStyle, e as positionToTransitionName };

package/dist/components/Drawer/DrawerActions/DrawerActions.js

@@ -1,5 +1,5 @@
-import { jsx as o } from "react/jsx-runtime";
-const e = ({ ...r }) => /* @__PURE__ */ o("div", { ...r });
-export {
-  e as DrawerActions
-};
+import { jsx as e } from "react/jsx-runtime";
+//#region src/lib/components/Drawer/DrawerActions/DrawerActions.tsx
+var t = ({ ...t }) => /* @__PURE__ */ e("div", { ...t });
+//#endregion
+export { t as DrawerActions };

package/dist/components/Drawer/DrawerContent/DrawerContent.js

@@ -1,10 +1,10 @@
-import { jsx as o } from "react/jsx-runtime";
-import { classNames as t } from "../../../utils/class-names.js";
-import { c as e } from "../../../Drawer.module-Bxp60Xmp.js";
-const n = ({
-  className: r,
-  ...s
-}) => /* @__PURE__ */ o("div", { className: t(e.content, r), ...s });
-export {
-  n as DrawerContent
-};
+import { classNames as e } from "../../../utils/class-names.js";
+import t from "../../../lib/components/Drawer/Drawer.module.js";
+import { jsx as n } from "react/jsx-runtime";
+//#region src/lib/components/Drawer/DrawerContent/DrawerContent.tsx
+var r = ({ className: r, ...i }) => /* @__PURE__ */ n("div", {
+	className: e(t.content, r),
+	...i
+});
+//#endregion
+export { r as DrawerContent };

package/dist/components/Drawer/DrawerHeader/DrawerHeader.js

@@ -1,18 +1,27 @@
-import { jsxs as l, jsx as e } from "react/jsx-runtime";
-import { classNames as d } from "../../../utils/class-names.js";
-import { c as a } from "../../../Drawer.module-Bxp60Xmp.js";
-import { Typography as i } from "../../Typography/Typography.js";
-const f = ({
-  title: r,
-  description: s,
-  className: m,
-  children: o,
-  ...c
-}) => /* @__PURE__ */ l("div", { className: d(a.header, m), ...c, children: [
-  r && /* @__PURE__ */ e(i, { className: a.title, variant: "heading", size: "h4", children: r }),
-  s && /* @__PURE__ */ e(i, { className: a.description, variant: "body", size: "l", children: s }),
-  o
-] });
-export {
-  f as DrawerHeader
-};
+import { classNames as e } from "../../../utils/class-names.js";
+import { Typography as t } from "../../Typography/Typography.js";
+import n from "../../../lib/components/Drawer/Drawer.module.js";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+//#region src/lib/components/Drawer/DrawerHeader/DrawerHeader.tsx
+var a = ({ title: a, description: o, className: s, children: c, ...l }) => /* @__PURE__ */ i("div", {
+	className: e(n.header, s),
+	...l,
+	children: [
+		a && /* @__PURE__ */ r(t, {
+			className: n.title,
+			variant: "heading",
+			size: "h4",
+			children: a
+		}),
+		o && /* @__PURE__ */ r(t, {
+			element: "div",
+			className: n.description,
+			variant: "body",
+			size: "l",
+			children: o
+		}),
+		c
+	]
+});
+//#endregion
+export { a as DrawerHeader };

package/dist/components/Field/Field.js

@@ -1,73 +1,44 @@
-import { jsx as n } from "react/jsx-runtime";
-import { useRef as g } from "react";
-import { syncRefs as q } from "../../utils/sync-refs.js";
-import { InputBaseWrapper as w } from "./InputBaseWrapper/InputBaseWrapper.js";
-import { InputBase as z } from "./InputBase/InputBase.js";
-import { useComponentId as A } from "../../hooks/useComponentId/useComponentId.js";
-const L = ({
-  id: m,
-  label: p,
-  placeholder: i,
-  onClear: f,
-  leftSection: s,
-  leftIcon: u,
-  rightIcon: c,
-  hasError: d,
-  value: r,
-  inputRegExp: l,
-  className: I,
-  disabled: o,
-  keepLabel: R = !0,
-  keepLabelFixed: a = !1,
-  style: x,
-  fullWidth: B = !0,
-  bordered: C = !0,
-  size: h = "m",
-  onFieldClick: j,
-  ref: k,
-  hintLeftSection: y,
-  hintRightSection: F,
-  ...W
-}) => {
-  const t = g(null), e = A(m);
-  return /* @__PURE__ */ n(
-    w,
-    {
-      label: p,
-      onClear: f,
-      leftSection: s,
-      leftIcon: u,
-      rightIcon: c,
-      id: e,
-      size: h,
-      keepLabel: R,
-      keepLabelFixed: a,
-      bordered: C,
-      inputRef: t,
-      hasError: d,
-      disabled: o,
-      value: r,
-      fullWidth: B,
-      className: I,
-      style: x,
-      onClick: j,
-      hintLeftSection: y,
-      hintRightSection: F,
-      children: /* @__PURE__ */ n(
-        z,
-        {
-          id: e,
-          ref: q(t, k),
-          value: r,
-          placeholder: i,
-          inputRegExp: l,
-          disabled: o,
-          ...W
-        }
-      )
-    }
-  );
-};
-export {
-  L as Field
+"use client";
+import { syncRefs as e } from "../../utils/sync-refs.js";
+import { useComponentId as t } from "../../hooks/useComponentId/useComponentId.js";
+import { InputBaseWrapper as n } from "./InputBaseWrapper/InputBaseWrapper.js";
+import { InputBase as r } from "./InputBase/InputBase.js";
+import { useRef as i } from "react";
+import { jsx as a } from "react/jsx-runtime";
+//#region src/lib/components/Field/Field.tsx
+var o = ({ id: o, label: s, placeholder: c, onClear: l, leftSection: u, leftIcon: d, rightIcon: f, hasError: p, value: m, inputRegExp: h, className: g, disabled: _, keepLabel: v = !0, keepLabelFixed: y = !1, style: b, fullWidth: x = !0, bordered: S = !0, size: C = "m", onFieldClick: w, ref: T, hintLeftSection: E, hintRightSection: D, ...O }) => {
+	let k = i(null), A = t(o);
+	return /* @__PURE__ */ a(n, {
+		label: s,
+		onClear: l,
+		leftSection: u,
+		leftIcon: d,
+		rightIcon: f,
+		id: A,
+		size: C,
+		keepLabel: v,
+		keepLabelFixed: y,
+		bordered: S,
+		inputRef: k,
+		hasError: p,
+		disabled: _,
+		value: m,
+		fullWidth: x,
+		className: g,
+		style: b,
+		onClick: w,
+		hintLeftSection: E,
+		hintRightSection: D,
+		children: /* @__PURE__ */ a(r, {
+			id: A,
+			ref: e(k, T),
+			value: m,
+			placeholder: c,
+			inputRegExp: h,
+			disabled: _,
+			...O
+		})
+	});
 };
+//#endregion
+export { o as Field };

package/dist/components/Field/Field.types.js

@@ -1 +0,0 @@
-

package/dist/components/Field/InputBase/InputBase.js

@@ -1,40 +1,25 @@
-import { jsx as i } from "react/jsx-runtime";
-import { resolveTypography as u } from "../../../utils/typography.js";
-import { classNames as y } from "../../../utils/class-names.js";
-const a = "_root_ctofg_1", m = {
-  root: a
-}, x = ({
-  inputRegExp: r,
-  onChange: t,
-  className: c,
-  autoComplete: e = "off",
-  ref: f,
-  ...l
-}) => {
-  const o = typeof r == "string" ? new RegExp(r) : r, p = (s) => {
-    if (!o) {
-      t == null || t(s);
-      return;
-    }
-    o.test(s.target.value) && (t == null || t(s));
-  };
-  return /* @__PURE__ */ i(
-    "input",
-    {
-      ref: f,
-      className: y(
-        "uiFont",
-        m.root,
-        c,
-        m.maskedInput
-      ),
-      style: u("body", "m"),
-      onChange: p,
-      autoComplete: e,
-      ...l
-    }
-  );
-};
-export {
-  x as InputBase
+import { resolveTypography as e } from "../../../utils/typography.js";
+import { classNames as t } from "../../../utils/class-names.js";
+import n from "../../../lib/components/Field/InputBase/InputBase.module.js";
+import { jsx as r } from "react/jsx-runtime";
+//#region src/lib/components/Field/InputBase/InputBase.tsx
+var i = ({ inputRegExp: i, onChange: a, className: o, autoComplete: s = "off", placeholder: c, ref: l, ...u }) => {
+	let d = typeof i == "string" ? new RegExp(i) : i;
+	return /* @__PURE__ */ r("input", {
+		ref: l,
+		className: t("uiFont", n.root, o, n.maskedInput),
+		style: e("body", "m"),
+		onChange: (e) => {
+			if (!d) {
+				a?.(e);
+				return;
+			}
+			d.test(e.target.value) && a?.(e);
+		},
+		autoComplete: s,
+		placeholder: c ?? " ",
+		...u
+	});
 };
+//#endregion
+export { i as InputBase };

package/dist/components/Field/InputBase/InputBase.types.js

@@ -1 +0,0 @@
-

package/dist/components/Field/InputBaseWrapper/InputBaseWrapper.constants.js

@@ -1,14 +1,8 @@
-const e = {
-  ru: {
-    clearText: "Очистить текст"
-  },
-  en: {
-    clearText: "Clear text"
-  },
-  tj: {
-    clearText: "Матнро пок кардан"
-  }
-};
-export {
-  e as INPUT_BASE_WRAPPER_LOCALES
+//#region src/lib/components/Field/InputBaseWrapper/InputBaseWrapper.constants.ts
+var e = {
+	ru: { clearText: "Очистить текст" },
+	en: { clearText: "Clear text" },
+	tj: { clearText: "Матнро пок кардан" }
 };
+//#endregion
+export { e as INPUT_BASE_WRAPPER_LOCALES };