@vkzstudio/muza-ui 1.0.17 → 1.0.19

package/dist/components/FormField/FormField.js

@@ -0,0 +1,56 @@
+import { jsxs as f, jsx as m } from "react/jsx-runtime";
+import { forwardRef as g } from "react";
+import { InputHint as h } from "./InputHint.js";
+import { InputLabel as e } from "./InputLabel.js";
+import { cn as F } from "../../utils/cn.js";
+const N = g(
+  ({
+    children: t,
+    label: i,
+    hint: o,
+    error: s,
+    required: r,
+    disableRequiredAsterisk: p,
+    htmlFor: c,
+    labelId: n,
+    hintId: x,
+    labelExtra: d,
+    className: a
+  }, l) => /* @__PURE__ */ f(
+    "div",
+    {
+      ref: l,
+      className: F("flex flex-col gap-comp-input-gap", a),
+      children: [
+        i && (d ? /* @__PURE__ */ f("div", { className: "flex items-center gap-2xs", children: [
+          /* @__PURE__ */ m(
+            e,
+            {
+              htmlFor: c,
+              id: n,
+              required: r,
+              disableRequiredAsterisk: p,
+              children: i
+            }
+          ),
+          d
+        ] }) : /* @__PURE__ */ m(
+          e,
+          {
+            htmlFor: c,
+            id: n,
+            required: r,
+            disableRequiredAsterisk: p,
+            children: i
+          }
+        )),
+        t,
+        o && /* @__PURE__ */ m(h, { error: s, id: x, children: o })
+      ]
+    }
+  )
+);
+N.displayName = "FormField";
+export {
+  N as FormField
+};

package/dist/components/FormField/InputHint.d.ts

@@ -0,0 +1,13 @@
+import { ReactNode } from 'react';
+export interface InputHintProps {
+    /** Hint or error message content. */
+    children: ReactNode;
+    /** When true, renders the hint in an error color. */
+    error?: boolean;
+    /** ID for the hint element (used with `aria-describedby`). */
+    id?: string;
+    /** Additional CSS classes for the hint element. */
+    className?: string;
+}
+export declare const InputHint: ({ children, error, id, className, }: InputHintProps) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=InputHint.d.ts.map

package/dist/components/FormField/InputHint.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"InputHint.d.ts","sourceRoot":"","sources":["../../../src/components/FormField/InputHint.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAItC,MAAM,WAAW,cAAc;IAC7B,qCAAqC;IACrC,QAAQ,EAAE,SAAS,CAAA;IACnB,qDAAqD;IACrD,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,8DAA8D;IAC9D,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,mDAAmD;IACnD,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,eAAO,MAAM,SAAS,GAAI,qCAKvB,cAAc,4CAchB,CAAA"}

package/dist/components/FormField/InputHint.js

@@ -0,0 +1,26 @@
+import { jsx as e } from "react/jsx-runtime";
+import { Typography as m } from "../Typography/Typography.js";
+import { cn as n } from "../../utils/cn.js";
+const a = ({
+  children: t,
+  error: o,
+  id: r,
+  className: p
+}) => /* @__PURE__ */ e(
+  m,
+  {
+    component: "span",
+    size: "sm",
+    weight: "regular",
+    className: n(
+      "text-comp-input-text-secondary",
+      { "text-comp-input-text-error": o },
+      p
+    ),
+    id: r,
+    children: t
+  }
+);
+export {
+  a as InputHint
+};

package/dist/components/FormField/InputLabel.d.ts

@@ -0,0 +1,20 @@
+import { ReactNode } from 'react';
+export interface InputLabelProps {
+    /** Label text content. */
+    children: ReactNode;
+    /** Associates the label with a form element by ID. */
+    htmlFor?: string;
+    /** ID for the label element itself (used with `aria-labelledby`). */
+    id?: string;
+    /** When true, displays a red asterisk after the label text. */
+    required?: boolean;
+    /**
+     * Hides the required asterisk (*) even when `required` is true.
+     * @default false
+     */
+    disableRequiredAsterisk?: boolean;
+    /** Additional CSS classes for the label element. */
+    className?: string;
+}
+export declare const InputLabel: ({ children, htmlFor, id, required, disableRequiredAsterisk, className, }: InputLabelProps) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=InputLabel.d.ts.map

package/dist/components/FormField/InputLabel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"InputLabel.d.ts","sourceRoot":"","sources":["../../../src/components/FormField/InputLabel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAGtC,MAAM,WAAW,eAAe;IAC9B,0BAA0B;IAC1B,QAAQ,EAAE,SAAS,CAAA;IACnB,sDAAsD;IACtD,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,qEAAqE;IACrE,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,+DAA+D;IAC/D,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;;OAGG;IACH,uBAAuB,CAAC,EAAE,OAAO,CAAA;IACjC,oDAAoD;IACpD,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,eAAO,MAAM,UAAU,GAAI,0EAOxB,eAAe,4CAcjB,CAAA"}

package/dist/components/FormField/InputLabel.js

@@ -0,0 +1,27 @@
+import { jsxs as m, jsx as n } from "react/jsx-runtime";
+import { Typography as a } from "../Typography/Typography.js";
+const c = ({
+  children: e,
+  htmlFor: r,
+  id: t,
+  required: o,
+  disableRequiredAsterisk: p,
+  className: s
+}) => /* @__PURE__ */ m(
+  a,
+  {
+    component: "label",
+    weight: "regular",
+    size: "sm",
+    htmlFor: r,
+    id: t,
+    className: s,
+    children: [
+      e,
+      o && !p && /* @__PURE__ */ n("span", { className: "text-comp-input-text-error", children: " *" })
+    ]
+  }
+);
+export {
+  c as InputLabel
+};

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

@@ -0,0 +1,4 @@
+export { FormField, type FormFieldProps } from './FormField';
+export { InputLabel, type InputLabelProps } from './InputLabel';
+export { InputHint, type InputHintProps } from './InputHint';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/FormField/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/FormField/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,cAAc,EAAE,MAAM,aAAa,CAAA;AAC5D,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,cAAc,CAAA;AAC/D,OAAO,EAAE,SAAS,EAAE,KAAK,cAAc,EAAE,MAAM,aAAa,CAAA"}

package/dist/components/Input/Input.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../src/components/Input/Input.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,cAAc,EACnB,KAAK,SAAS,EAKf,MAAM,OAAO,CAAA;AACd,OAAO,EAAE,KAAK,YAAY,EAAO,MAAM,0BAA0B,CAAA;AAKjE,QAAA,MAAM,oBAAoB;;;8EAyBzB,CAAA;AAgBD;;;;;GAKG;AACH,MAAM,WAAW,UACf,SAAQ,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,QAAQ,GAAG,MAAM,CAAC,EAC1E,YAAY,CAAC,OAAO,oBAAoB,CAAC;IAC3C,iDAAiD;IACjD,KAAK,CAAC,EAAE,MAAM,CAAA;IACd;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,UAAU,GAAG,QAAQ,GAAG,MAAM,CAAA;IACxD;;;OAGG;IACH,IAAI,CAAC,EAAE,IAAI,GAAG,MAAM,GAAG,IAAI,CAAA;IAC3B;;;OAGG;IACH,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,uEAAuE;IACvE,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,wEAAwE;IACxE,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB;;;OAGG;IACH,uBAAuB,CAAC,EAAE,OAAO,CAAA;IACjC,qDAAqD;IACrD,IAAI,CAAC,EAAE,MAAM,CAAA;IACb;;;;;;;;;;;;;;;;;;;;OAoBG;IACH,IAAI,CAAC,EAAE,MAAM,CAAA;CACd;AAED,eAAO,MAAM,KAAK,sHA4JjB,CAAA"}
+{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../src/components/Input/Input.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,cAAc,EACnB,KAAK,SAAS,EAKf,MAAM,OAAO,CAAA;AACd,OAAO,EAAE,KAAK,YAAY,EAAO,MAAM,0BAA0B,CAAA;AAMjE,QAAA,MAAM,oBAAoB;;;8EAyBzB,CAAA;AAgBD;;;;;GAKG;AACH,MAAM,WAAW,UACf,SAAQ,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,QAAQ,GAAG,MAAM,CAAC,EAC1E,YAAY,CAAC,OAAO,oBAAoB,CAAC;IAC3C,iDAAiD;IACjD,KAAK,CAAC,EAAE,MAAM,CAAA;IACd;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,UAAU,GAAG,QAAQ,GAAG,MAAM,CAAA;IACxD;;;OAGG;IACH,IAAI,CAAC,EAAE,IAAI,GAAG,MAAM,GAAG,IAAI,CAAA;IAC3B;;;OAGG;IACH,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,uEAAuE;IACvE,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,wEAAwE;IACxE,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB;;;OAGG;IACH,uBAAuB,CAAC,EAAE,OAAO,CAAA;IACjC,qDAAqD;IACrD,IAAI,CAAC,EAAE,MAAM,CAAA;IACb;;;;;;;;;;;;;;;;;;;;OAoBG;IACH,IAAI,CAAC,EAAE,MAAM,CAAA;CACd;AAED,eAAO,MAAM,KAAK,sHA0IjB,CAAA"}

package/dist/components/Input/Input.js

@@ -1,6 +1,6 @@
-import { jsxs as h, jsx as a } from "react/jsx-runtime";
-import { forwardRef as W, useId as $, useRef as A, useEffect as w } from "react";
-import { cva as C } from "class-variance-authority";
+import { jsx as c, jsxs as j } from "react/jsx-runtime";
+import { forwardRef as z, useId as W, useRef as $, useEffect as y } from "react";
+import { cva as A } from "class-variance-authority";
 import "../../node_modules/imask/esm/index.js";
 import "../../node_modules/imask/esm/controls/input.js";
 import "../../node_modules/imask/esm/masked/factory.js";
@@ -10,11 +10,12 @@ import "../../node_modules/imask/esm/controls/html-mask-element.js";
 import "../../node_modules/imask/esm/controls/html-contenteditable-mask-element.js";
 import "../../node_modules/imask/esm/controls/input-history.js";
 import "../../node_modules/react-imask/esm/input.js";
-import E from "../../node_modules/react-imask/esm/hook.js";
+import C from "../../node_modules/react-imask/esm/hook.js";
 import "../../node_modules/react-imask/esm/mixin.js";
-import { Typography as I, typographyVariants as F } from "../Typography/Typography.js";
-import { cn as s } from "../../utils/cn.js";
-const M = C(
+import { FormField as E } from "../FormField/FormField.js";
+import { cn as u } from "../../utils/cn.js";
+import { typographyVariants as M } from "../Typography/Typography.js";
+const T = A(
   [
     "rounded-full border border-comp-input-stroke-def",
     "bg-comp-input-fill-def transition-colors",
@@ -39,8 +40,8 @@ const M = C(
       error: !1
     }
   }
-), U = (d) => s(
-  F({
+), U = (d) => u(
+  M({
     size: d === "sm" ? "input" : "base",
     weight: "medium",
     fixY: !0
@@ -50,24 +51,24 @@ const M = C(
   "placeholder:font-regular",
   "disabled:cursor-not-allowed",
   "w-full"
-), Y = W(
+), Y = z(
   ({
     className: d,
-    type: N = "text",
-    prefix: b,
-    suffix: x,
-    label: l,
-    hint: u,
-    size: g,
-    error: m,
+    type: w = "text",
+    prefix: m,
+    suffix: f,
+    label: b,
+    hint: h,
+    size: x,
+    error: s,
     mask: i,
-    onChange: p,
-    id: z,
-    required: f,
-    disableRequiredAsterisk: R,
+    onChange: a,
+    id: I,
+    required: l,
+    disableRequiredAsterisk: N,
     ...v
   }, o) => {
-    const V = $(), c = z ?? V, y = u ? `${c}-hint` : void 0, k = l ? `${c}-label` : void 0, e = A(null), r = E(
+    const R = W(), p = I ?? R, g = h ? `${p}-hint` : void 0, k = b ? `${p}-label` : void 0, e = $(null), r = C(
       {
         mask: i || "",
         // Pattern like 'aaaaa-aaaaa' where 'a' = alphanumeric, '0' = digit
@@ -78,92 +79,76 @@ const M = C(
         ref: e
       }
     );
-    w(() => {
-      if (i && (r != null && r.maskRef.current) && p) {
+    y(() => {
+      if (i && (r != null && r.maskRef.current) && a) {
         const t = r.maskRef.current, n = () => {
-          const T = {
+          const F = {
             target: { value: t.value }
           };
-          p(T);
+          a(F);
         };
         return t.on("accept", n), () => {
           t.off("accept", n);
         };
       }
-    }, [i, r, p]), w(() => {
+    }, [i, r, a]), y(() => {
       o && (typeof o == "function" ? o(e.current) : o.current = e.current);
     }, [e, o]);
-    const j = (t) => {
+    const V = (t) => {
       var n;
       v.disabled || t.target !== e.current && ((n = e.current) == null || n.focus());
     };
-    return /* @__PURE__ */ h("div", { className: "flex flex-col gap-comp-input-gap", children: [
-      l && /* @__PURE__ */ h(
-        I,
-        {
-          component: "label",
-          weight: "regular",
-          size: "sm",
-          htmlFor: c,
-          id: k,
-          children: [
-            l,
-            f && !R && /* @__PURE__ */ a("span", { className: "text-comp-input-text-error", children: " *" })
-          ]
-        }
-      ),
-      /* @__PURE__ */ h(
-        "div",
-        {
-          className: s(
-            M({
-              size: g,
-              error: m
-            }),
-            d
-          ),
-          onClick: j,
-          children: [
-            b && /* @__PURE__ */ a("div", { className: "flex items-center text-icon-dark-secondary-def", children: b }),
-            /* @__PURE__ */ a(
-              "input",
-              {
-                type: N,
-                "data-slot": "input",
-                className: s(
-                  U(g),
-                  "[&::-webkit-calendar-picker-indicator]:hidden [&::-webkit-clear-button]:hidden [&::-webkit-inner-spin-button]:hidden",
-                  "[&::-webkit-datetime-edit-text]:px-3xs"
-                ),
-                ref: i ? r.ref : e,
-                onChange: i ? void 0 : p,
-                id: c,
-                "aria-describedby": y,
-                "aria-labelledby": k,
-                "aria-invalid": m,
-                "aria-required": f,
-                required: f,
-                ...v
-              }
+    return /* @__PURE__ */ c(
+      E,
+      {
+        label: b,
+        hint: h,
+        error: s,
+        required: l,
+        disableRequiredAsterisk: N,
+        htmlFor: p,
+        labelId: k,
+        hintId: g,
+        children: /* @__PURE__ */ j(
+          "div",
+          {
+            className: u(
+              T({
+                size: x,
+                error: s
+              }),
+              d
             ),
-            x && /* @__PURE__ */ a("div", { className: "flex items-center text-icon-dark-secondary-def", children: x })
-          ]
-        }
-      ),
-      u && /* @__PURE__ */ a(
-        I,
-        {
-          component: "span",
-          size: "sm",
-          weight: "regular",
-          className: s("text-comp-input-text-secondary", {
-            "text-comp-input-text-error": m
-          }),
-          id: y,
-          children: u
-        }
-      )
-    ] });
+            onClick: V,
+            children: [
+              m && /* @__PURE__ */ c("div", { className: "flex items-center text-icon-dark-secondary-def", children: m }),
+              /* @__PURE__ */ c(
+                "input",
+                {
+                  type: w,
+                  "data-slot": "input",
+                  className: u(
+                    U(x),
+                    "[&::-webkit-calendar-picker-indicator]:hidden [&::-webkit-clear-button]:hidden [&::-webkit-inner-spin-button]:hidden",
+                    "[&::-webkit-datetime-edit-text]:px-3xs"
+                  ),
+                  ref: i ? r.ref : e,
+                  onChange: i ? void 0 : a,
+                  id: p,
+                  "aria-describedby": g,
+                  "aria-labelledby": k,
+                  "aria-invalid": s,
+                  "aria-required": l,
+                  required: l,
+                  ...v
+                }
+              ),
+              f && /* @__PURE__ */ c("div", { className: "flex items-center text-icon-dark-secondary-def", children: f })
+            ]
+          }
+        )
+      }
+    );
   }
 );
 Y.displayName = "Input";

package/dist/components/MultiSelect/MultiSelect.d.ts

@@ -11,6 +11,8 @@ export interface IMultiSelectProps {
     error?: boolean;
     /** Marks the field as required (visual indicator only). */
     required?: boolean;
+    /** Hides the required asterisk even when `required` is true. @default false */
+    disableRequiredAsterisk?: boolean;
     /** Element displayed after the selected values (not currently implemented). */
     suffix?: ReactNode;
     /** Icon or element displayed before the selected values. */

package/dist/components/MultiSelect/MultiSelect.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MultiSelect.d.ts","sourceRoot":"","sources":["../../../src/components/MultiSelect/MultiSelect.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EACZ,KAAK,SAAS,EAKf,MAAM,OAAO,CAAA;AAcd;;GAEG;AACH,MAAM,WAAW,iBAAiB;IAChC,6CAA6C;IAC7C,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,yFAAyF;IACzF,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,yDAAyD;IACzD,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,+EAA+E;IAC/E,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,4DAA4D;IAC5D,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,oGAAoG;IACpG,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,mDAAmD;IACnD,IAAI,CAAC,EAAE,IAAI,GAAG,MAAM,GAAG,IAAI,CAAA;IAC3B;;;;;;;;;OASG;IACH,OAAO,EAAE,KAAK,CAAC;QACb,KAAK,EAAE,MAAM,CAAA;QACb,KAAK,EAAE,SAAS,CAAA;QAChB,QAAQ,CAAC,EAAE,OAAO,CAAA;QAClB,IAAI,CAAC,EAAE,SAAS,CAAA;KACjB,CAAC,CAAA;IACF,yDAAyD;IACzD,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,kGAAkG;IAClG,sBAAsB,CAAC,EAAE,MAAM,CAAA;IAC/B,8DAA8D;IAC9D,KAAK,CAAC,EAAE,MAAM,EAAE,CAAA;IAChB,uFAAuF;IACvF,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAA;CACrC;AAED,eAAO,MAAM,WAAW,6FAwMvB,CAAA"}
+{"version":3,"file":"MultiSelect.d.ts","sourceRoot":"","sources":["../../../src/components/MultiSelect/MultiSelect.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EACZ,KAAK,SAAS,EAMf,MAAM,OAAO,CAAA;AAed;;GAEG;AACH,MAAM,WAAW,iBAAiB;IAChC,6CAA6C;IAC7C,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,yFAAyF;IACzF,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,yDAAyD;IACzD,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,+EAA+E;IAC/E,uBAAuB,CAAC,EAAE,OAAO,CAAA;IACjC,+EAA+E;IAC/E,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,4DAA4D;IAC5D,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,oGAAoG;IACpG,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,mDAAmD;IACnD,IAAI,CAAC,EAAE,IAAI,GAAG,MAAM,GAAG,IAAI,CAAA;IAC3B;;;;;;;;;OASG;IACH,OAAO,EAAE,KAAK,CAAC;QACb,KAAK,EAAE,MAAM,CAAA;QACb,KAAK,EAAE,SAAS,CAAA;QAChB,QAAQ,CAAC,EAAE,OAAO,CAAA;QAClB,IAAI,CAAC,EAAE,SAAS,CAAA;KACjB,CAAC,CAAA;IACF,yDAAyD;IACzD,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,kGAAkG;IAClG,sBAAsB,CAAC,EAAE,MAAM,CAAA;IAC/B,8DAA8D;IAC9D,KAAK,CAAC,EAAE,MAAM,EAAE,CAAA;IAChB,uFAAuF;IACvF,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAA;CACrC;AAED,eAAO,MAAM,WAAW,6FA+LvB,CAAA"}