@companix/uikit 0.0.18 → 0.0.20

package/dist/Input/Input.d.ts

@@ -1,7 +1,7 @@
 import { InputContainerProps } from './InputContainer';
 export interface InputProps extends Omit<InputContainerProps, 'inputRef' | 'children'> {
     placeholder?: string;
-    value?: string | number;
+    value?: string;
     readOnly?: boolean;
     onValueChange?: (value: string, targetElement: HTMLInputElement) => void;
     onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;

package/dist/Input/InputElement.d.ts

@@ -1,4 +1,6 @@
-interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'children'> {
+interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'children' | 'value' | 'defaultValue'> {
+    defaultValue?: string;
+    value?: string;
     mask?: string;
     maskChar?: string;
     onValueChange?: (value: string, targetElement: HTMLInputElement) => void;

package/dist/NumberInput/index.d.ts

@@ -1,6 +1,23 @@
-import { InputProps } from '../Input/Input';
-export interface NumberInputProps extends Omit<InputProps, 'value' | 'onChange'> {
-    value: number | null;
-    onChange: (value: number | null) => void;
+import { InputContainerProps } from '../Input/InputContainer';
+export interface ReactNumberFormatParams {
+    thousandSeparator?: boolean | string;
+    decimalSeparator?: string;
+    allowedDecimalSeparators?: Array<string>;
+    thousandsGroupStyle?: 'thousand' | 'lakh' | 'wan' | 'none';
+    decimalScale?: number;
+    fixedDecimalScale?: boolean;
+    allowNegative?: boolean;
+    allowLeadingZeros?: boolean;
+    suffix?: string;
+    prefix?: string;
 }
-export declare const NumberInput: ({ value, onChange, ...props }: NumberInputProps) => import("react/jsx-runtime").JSX.Element;
+export interface NumberInputProps extends Omit<InputContainerProps, 'inputRef' | 'children'>, ReactNumberFormatParams {
+    placeholder?: string;
+    value?: number | null;
+    readOnly?: boolean;
+    onValueChange?: (value: number | null) => void;
+    onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
+    inputRef?: React.Ref<HTMLInputElement>;
+    inputClassName?: string;
+}
+export declare const NumberInput: import('react').ForwardRefExoticComponent<NumberInputProps & import('react').RefAttributes<HTMLDivElement>>;

package/dist/Radio/index.d.ts

@@ -1,4 +1,4 @@
-interface RadioOption<T> {
+export interface RadioOption<T> {
     value: T;
     label: React.ReactNode;
 }

package/dist/bundle.es10.js

@@ -3,36 +3,36 @@ import N from "classnames";
 import { Icon as v } from "./bundle.es39.js";
 import { attr as t } from "@companix/utils-browser";
 import { forwardRef as k } from "react";
-import { faCheck as x } from "@fortawesome/free-solid-svg-icons";
-const O = k(
-  ({ title: d, icon: n, active: c, label: e, disabled: r, minimal: a, onClick: l, className: m, ...s }, p) => {
+import { f as x } from "./bundle.es40.js";
+const E = k(
+  ({ title: s, icon: c, active: e, label: n, disabled: a, minimal: r, onClick: d, className: l, ...m }, p) => {
     const f = (h) => {
-      r || l?.(h);
+      a || d?.(h);
     };
     return /* @__PURE__ */ i(
       "div",
       {
         ref: p,
-        ...s,
-        className: N("option", m),
-        "data-selected": t(c),
-        "data-disabled": t(r),
-        "data-minimal": t(a),
+        ...m,
+        className: N("option", l),
+        "data-selected": t(e),
+        "data-disabled": t(a),
+        "data-minimal": t(r),
         onClick: f,
         children: [
           /* @__PURE__ */ i("div", { className: "option-content", children: [
-            n && /* @__PURE__ */ o("div", { className: "option-icon", children: n }),
+            c && /* @__PURE__ */ o("div", { className: "option-icon", children: c }),
             /* @__PURE__ */ i("div", { className: "option-content-layout", children: [
-              /* @__PURE__ */ o("div", { className: "option-title", children: d }),
-              e && /* @__PURE__ */ o("div", { className: "option-label", children: e })
+              /* @__PURE__ */ o("div", { className: "option-title", children: s }),
+              n && /* @__PURE__ */ o("div", { className: "option-label", children: n })
             ] })
           ] }),
-          c && !a && /* @__PURE__ */ o("div", { className: "option-check", children: /* @__PURE__ */ o(v, { icon: x }) })
+          e && !r && /* @__PURE__ */ o("div", { className: "option-check", children: /* @__PURE__ */ o(v, { icon: x.faCheck }) })
         ]
       }
     );
   }
 );
 export {
-  O as OptionItem
+  E as OptionItem
 };

package/dist/bundle.es11.js

@@ -1,33 +1,58 @@
-import { jsx as f } from "react/jsx-runtime";
-import { useState as p, useRef as m } from "react";
-import { Input as l } from "./bundle.es9.js";
-const N = ({ value: r, onChange: u, ...e }) => {
-  const [, t] = p([]), n = m(i(r));
-  return +n.current !== r && (n.current = i(r)), /* @__PURE__ */ f(
-    l,
-    {
-      ...e,
-      value: n.current,
-      onChange: (o) => {
-        const s = o.currentTarget.value.trim();
-        if (s === "")
-          return n.current = "", u(null);
-        if (!(s.startsWith(".") || s.replace(".", "").split("").some((c) => isNaN(parseInt(c))))) {
-          if (n.current = a(s.split("")), +n.current === r)
-            return t([]);
-          u(+n.current);
-        }
+import { jsx as t } from "react/jsx-runtime";
+import C from "classnames";
+import { forwardRef as j, useRef as w } from "react";
+import { mergeRefs as y } from "react-merge-refs";
+import { InputContainer as F } from "./bundle.es38.js";
+import { NumericFormat as V } from "react-number-format";
+const D = j(
+  ({
+    onChange: m,
+    onValueChange: o,
+    readOnly: i,
+    inputClassName: f,
+    value: n,
+    placeholder: u,
+    thousandSeparator: p,
+    decimalSeparator: a,
+    allowedDecimalSeparators: l,
+    thousandsGroupStyle: d,
+    decimalScale: s,
+    fixedDecimalScale: b,
+    allowNegative: R,
+    allowLeadingZeros: c,
+    suffix: g,
+    prefix: x,
+    inputRef: I,
+    ...e
+  }, N) => {
+    const r = w(null);
+    return /* @__PURE__ */ t(F, { ref: N, inputRef: r, ...e, children: /* @__PURE__ */ t(
+      V,
+      {
+        type: "text",
+        getInputRef: y([r, I]),
+        className: C("form-input form-input-base", f),
+        "aria-disabled": e.disabled,
+        onChange: m,
+        onValueChange: ({ floatValue: h }) => o?.(h ?? null),
+        value: n,
+        placeholder: u,
+        disabled: e.disabled,
+        readOnly: i,
+        thousandSeparator: p,
+        decimalSeparator: a,
+        allowedDecimalSeparators: l,
+        thousandsGroupStyle: d,
+        decimalScale: s,
+        fixedDecimalScale: b,
+        allowNegative: R,
+        allowLeadingZeros: c,
+        suffix: g,
+        prefix: x
       }
-    }
-  );
-}, i = (r) => r === null ? "" : r.toString(), a = (r) => {
-  const u = [...r], e = [...r];
-  if (e.every((t) => t === "0"))
-    return "0";
-  for (let t = 0; t < e.length && e[t] === "0"; t++)
-    e[t] === "0" && e[t + 1] !== "." && u.shift();
-  return u.join("");
-};
+    ) });
+  }
+);
 export {
-  N as NumberInput
+  D as NumberInput
 };

package/dist/bundle.es14.js

@@ -1,35 +1,35 @@
-import { jsxs as x, jsx as o } from "react/jsx-runtime";
+import { jsxs as d, jsx as o } from "react/jsx-runtime";
 import * as t from "@radix-ui/react-checkbox";
 import { Icon as h } from "./bundle.es39.js";
-import { faCheck as l } from "@fortawesome/free-solid-svg-icons";
+import { f as l } from "./bundle.es40.js";
 import { useId as n } from "react";
 import { attr as c } from "@companix/utils-browser";
-const u = ({ checked: e, required: m, disabled: r, onCheckedChange: s, size: d, label: a }) => {
+const N = ({ checked: a, required: s, disabled: r, onCheckedChange: m, size: x, label: e }) => {
   const i = n();
-  return /* @__PURE__ */ x(
+  return /* @__PURE__ */ d(
     "div",
     {
       className: "checkbox",
-      "data-size": d ?? "md",
-      "data-required": c(m && !e),
+      "data-size": x ?? "md",
+      "data-required": c(s && !a),
       "data-disabled": c(r),
       children: [
         /* @__PURE__ */ o(
           t.Root,
           {
             className: "checkbox-box",
-            checked: e,
-            onCheckedChange: s,
+            checked: a,
+            onCheckedChange: m,
             disabled: r,
             id: i,
-            children: /* @__PURE__ */ o(t.Indicator, { className: "checkbox-icon", children: /* @__PURE__ */ o(h, { icon: l, size: "xxxs" }) })
+            children: /* @__PURE__ */ o(t.Indicator, { className: "checkbox-icon", children: /* @__PURE__ */ o(h, { icon: l.faCheck, size: "xxxs" }) })
           }
         ),
-        a && /* @__PURE__ */ o("label", { className: "checkbox-label", htmlFor: i, "data-disabled": c(r), children: a })
+        e && /* @__PURE__ */ o("label", { className: "checkbox-label", htmlFor: i, "data-disabled": c(r), children: e })
       ]
     }
   );
 };
 export {
-  u as Checkbox
+  N as Checkbox
 };

package/dist/bundle.es19.js

@@ -1,7 +1,7 @@
 import { jsxs as a, jsx as e } from "react/jsx-runtime";
 import * as r from "@radix-ui/react-alert-dialog";
 import { Button as c } from "./bundle.es2.js";
-import { RemoveListener as N } from "./bundle.es40.js";
+import { RemoveListener as N } from "./bundle.es41.js";
 import { VisuallyHidden as u } from "@radix-ui/react-visually-hidden";
 const C = ({
   open: d,

package/dist/bundle.es20.js

@@ -1,6 +1,6 @@
 import { jsx as e } from "react/jsx-runtime";
 import { Button as m } from "./bundle.es2.js";
-import { useLoading as p } from "./bundle.es41.js";
+import { useLoading as p } from "./bundle.es42.js";
 const g = ({ onClick: o, appearance: r = "primary", ...i }) => {
   const { isLoading: n, isError: t, handleClick: a } = p({ onClick: o });
   return /* @__PURE__ */ e(

package/dist/bundle.es23.js

@@ -1,5 +1,5 @@
 import { jsx as f } from "react/jsx-runtime";
-import { useResizeTextarea as x } from "./bundle.es42.js";
+import { useResizeTextarea as x } from "./bundle.es43.js";
 import { attr as e, callMultiple as u } from "@companix/utils-browser";
 import { useEffect as z } from "react";
 import { mergeRefs as R } from "react-merge-refs";

package/dist/bundle.es24.js

@@ -1,57 +1,58 @@
-import { jsx as o, jsxs as c } from "react/jsx-runtime";
+import { jsx as o, jsxs as l } from "react/jsx-runtime";
 import { useFroozeClosing as M } from "./bundle.es33.js";
 import { Popover as j } from "./bundle.es6.js";
 import { OptionItem as q } from "./bundle.es10.js";
 import { OptionsList as V } from "./bundle.es12.js";
 import { useState as B, useRef as d, useMemo as h } from "react";
 import { Icon as g } from "./bundle.es39.js";
-import { faClose as H, faChevronDown as Q } from "@fortawesome/free-solid-svg-icons";
-import { attr as v, getActiveElementByAnotherElement as G, contains as J } from "@companix/utils-browser";
+import { f as H } from "./bundle.es44.js";
+import { f as Q } from "./bundle.es45.js";
+import { attr as x, getActiveElementByAnotherElement as G, contains as J } from "@companix/utils-browser";
 import { mergeRefs as K } from "react-merge-refs";
-const re = (x) => {
+const se = (C) => {
   const {
     options: r,
-    closeAfterSelect: C,
+    closeAfterSelect: v,
     placeholder: N,
-    onChange: l,
+    onChange: c,
     emptyText: R = "Ничего не найдено",
     readOnly: m,
     size: z = "md",
     value: n,
     inputRef: A,
-    disabled: f,
-    required: y
-  } = x, [i, D] = B(""), a = d(null), b = d(null), { popoverRef: u, froozePopoverPosition: w, handleAnimationEnd: E } = M(), O = h(() => {
+    disabled: u,
+    required: D
+  } = C, [a, E] = B(""), i = d(null), w = d(null), { popoverRef: f, froozePopoverPosition: y, handleAnimationEnd: b } = M(), O = h(() => {
     const e = {};
     return r.forEach((t) => {
       e[t.value] = t;
     }), e;
   }, [r]), P = (e) => n.includes(e) ? [...n] : [...n, e], T = (e) => n.filter((t) => e !== t), k = (e, t) => {
-    C ? (w(), l(e), t()) : l(e);
-  }, p = h(() => i.trim() ? r.filter(({ title: e }) => {
-    const t = e.toLowerCase(), s = i.trim().toLowerCase();
+    v ? (y(), c(e), t()) : c(e);
+  }, p = h(() => a.trim() ? r.filter(({ title: e }) => {
+    const t = e.toLowerCase(), s = a.trim().toLowerCase();
     return t.indexOf(s) >= 0;
-  }) : r, [i, r]), I = (e) => {
-    if (f) return;
-    u.current && u.current.getAttribute("data-state") === "open" && e.preventDefault();
+  }) : r, [a, r]), I = (e) => {
+    if (u) return;
+    f.current && f.current.getAttribute("data-state") === "open" && e.preventDefault();
     const t = G(e.currentTarget);
-    e.defaultPrevented || J(e.currentTarget, t) || a.current && a.current.focus();
+    e.defaultPrevented || J(e.currentTarget, t) || i.current && i.current.focus();
   }, S = (e) => {
-    e.target !== a.current && e.preventDefault();
+    e.target !== i.current && e.preventDefault();
   }, $ = (e, t) => {
-    e.stopPropagation(), l(T(t));
+    e.stopPropagation(), c(T(t));
   };
   return /* @__PURE__ */ o(
     j,
     {
       minimal: !0,
-      ref: u,
+      ref: f,
       sideOffset: 0,
       matchTarget: "width",
-      onAnimationEnd: E,
+      onAnimationEnd: b,
       onOpenAutoFocus: (e) => e.preventDefault(),
       onCloseAutoFocus: (e) => e.preventDefault(),
-      content: ({ close: e }) => /* @__PURE__ */ c(V, { maxHeight: 300, children: [
+      content: ({ close: e }) => /* @__PURE__ */ l(V, { maxHeight: 300, children: [
         p.length === 0 && /* @__PURE__ */ o("div", { className: "select-tags-empty", children: R }),
         p.map(({ value: t, title: s, icon: F }, L) => /* @__PURE__ */ o(
           q,
@@ -71,41 +72,41 @@ const re = (x) => {
           onClick: I,
           onMouseDown: S,
           "data-size": z,
-          "data-required": v(y),
-          children: /* @__PURE__ */ c("div", { className: "select-tags-container", children: [
-            /* @__PURE__ */ c("div", { className: "select-tags", children: [
+          "data-required": x(D),
+          children: /* @__PURE__ */ l("div", { className: "select-tags-container", children: [
+            /* @__PURE__ */ l("div", { className: "select-tags", children: [
               n.length > 0 && /* @__PURE__ */ o(
                 "div",
                 {
                   className: "tag-container",
-                  ref: b,
+                  ref: w,
                   role: "listbox",
-                  "data-readonly": v(m),
-                  children: n.map((e, t) => /* @__PURE__ */ c("div", { className: "tag", children: [
+                  "data-readonly": x(m),
+                  children: n.map((e, t) => /* @__PURE__ */ l("div", { className: "tag", children: [
                     /* @__PURE__ */ o("span", { className: "tag-name", children: O[e].title }),
-                    /* @__PURE__ */ o("button", { className: "tag-close-button", onClick: (s) => $(s, e), children: /* @__PURE__ */ o(g, { className: "tag-close-icon", icon: H, size: "xxxs" }) })
+                    /* @__PURE__ */ o("button", { className: "tag-close-button", onClick: (s) => $(s, e), children: /* @__PURE__ */ o(g, { className: "tag-close-icon", icon: Q.faClose, size: "xxxs" }) })
                   ] }, `tag-option-${e}-${t}`))
                 }
               ),
               (!m || n.length === 0) && /* @__PURE__ */ o(
                 "input",
                 {
-                  ref: K([A, a]),
+                  ref: K([A, i]),
                   type: "text",
                   autoCapitalize: "none",
                   autoComplete: "off",
                   autoCorrect: "off",
                   className: "form-input",
                   spellCheck: !1,
-                  value: i,
-                  disabled: f,
+                  value: a,
+                  disabled: u,
                   readOnly: m,
                   placeholder: N,
-                  onChange: ({ target: e }) => D(e.value)
+                  onChange: ({ target: e }) => E(e.value)
                 }
               )
             ] }),
-            /* @__PURE__ */ o(g, { className: "expand-icon", icon: Q, size: "xxxs" })
+            /* @__PURE__ */ o(g, { className: "expand-icon", icon: H.faChevronDown, size: "xxxs" })
           ] })
         }
       )
@@ -113,5 +114,5 @@ const re = (x) => {
   );
 };
 export {
-  re as SelectTags
+  se as SelectTags
 };

package/dist/bundle.es25.js

@@ -2,11 +2,11 @@ import { jsx as u } from "react/jsx-runtime";
 import { Popover as x } from "./bundle.es6.js";
 import { Input as A } from "./bundle.es9.js";
 import { useState as M, useRef as j } from "react";
-import { Calendar as E } from "./bundle.es43.js";
-import { useDayDisableCheker as N } from "./bundle.es44.js";
+import { Calendar as E } from "./bundle.es46.js";
+import { useDayDisableCheker as N } from "./bundle.es47.js";
 import { getNum as f, formatTime as v } from "@companix/utils-js";
-import { removeDigits as O } from "./bundle.es45.js";
-import { SelectRightElements as Y } from "./bundle.es46.js";
+import { removeDigits as O } from "./bundle.es48.js";
+import { SelectRightElements as Y } from "./bundle.es49.js";
 const i = {
   char: "-",
   toString: (e) => {

package/dist/bundle.es26.js

@@ -1,8 +1,8 @@
 import { jsxs as D, jsx as h } from "react/jsx-runtime";
 import { useMemo as M, useEffect as C } from "react";
 import { Select as c } from "./bundle.es8.js";
-import { createDateValidation as O, getMonthMaxDay as T } from "./bundle.es45.js";
-import { defaultMin as j, defaultMax as N, useCalendarOptions as V } from "./bundle.es47.js";
+import { createDateValidation as O, getMonthMaxDay as T } from "./bundle.es48.js";
+import { defaultMin as j, defaultMax as N, useCalendarOptions as V } from "./bundle.es50.js";
 const B = ({
   min: o = j,
   max: e = N,

package/dist/bundle.es29.js

@@ -1,8 +1,8 @@
 import { jsx as g } from "react/jsx-runtime";
 import { useRef as _, useMemo as b, useState as P, useEffect as j } from "react";
 import { getNum as v } from "@companix/utils-js";
-import { getTimesOptions as D, getTimeValue as A, removeDigits as W, convertTimeToOption as q } from "./bundle.es45.js";
-import { SelectRightElements as w } from "./bundle.es46.js";
+import { getTimesOptions as D, getTimeValue as A, removeDigits as W, convertTimeToOption as q } from "./bundle.es48.js";
+import { SelectRightElements as w } from "./bundle.es49.js";
 import { Select as y } from "./bundle.es8.js";
 import { Input as z } from "./bundle.es9.js";
 const r = {

package/dist/bundle.es31.js

@@ -1,7 +1,7 @@
 import { jsx as i } from "react/jsx-runtime";
 import { hash as m } from "@companix/utils-js";
 import { useRef as n, useMemo as s } from "react";
-import { Viewport as u } from "./bundle.es48.js";
+import { Viewport as u } from "./bundle.es51.js";
 const h = (t = {}) => {
   const e = {
     emit: (r) => {

package/dist/bundle.es32.js

@@ -1,6 +1,6 @@
 import { jsx as a } from "react/jsx-runtime";
 import { hash as d } from "@companix/utils-js";
-import { Viewport as s } from "./bundle.es49.js";
+import { Viewport as s } from "./bundle.es52.js";
 import { useRef as c, useMemo as l } from "react";
 const f = (i = {}) => {
   const t = {

package/dist/bundle.es34.js

@@ -4,7 +4,7 @@ import { attr as l } from "@companix/utils-browser";
 import { forwardRef as y, useRef as S, useCallback as T } from "react";
 import { VisuallyHidden as j } from "@radix-ui/react-visually-hidden";
 import { mergeRefs as w } from "react-merge-refs";
-import { SelectRightElements as z } from "./bundle.es46.js";
+import { SelectRightElements as z } from "./bundle.es49.js";
 const V = y(
   ({
     required: a,

package/dist/bundle.es37.js

@@ -2,7 +2,7 @@ import { jsx as u } from "react/jsx-runtime";
 import { forwardRef as m, useCallback as i } from "react";
 import c from "react-input-mask";
 const I = m(
-  ({ mask: r, maskChar: f, onChange: n, onValueChange: o, ...a }, e) => {
+  ({ mask: r, maskChar: f = "_", onChange: n, onValueChange: o, ...a }, e) => {
     const p = i(
       (t) => {
         n?.(t), o?.(t.target.value, t.target);

package/dist/bundle.es38.js

@@ -2,7 +2,7 @@ import { jsxs as b, jsx as o } from "react/jsx-runtime";
 import h from "classnames";
 import { attr as e } from "@companix/utils-browser";
 import { forwardRef as x } from "react";
-import { useInputPadding as N } from "./bundle.es52.js";
+import { useInputPadding as N } from "./bundle.es61.js";
 const v = x(
   ({
     required: s,

package/dist/bundle.es40.js

@@ -1,7 +1,5 @@
-import { useEffect as r } from "react";
-const n = ({ callback: e }) => (r(() => () => {
-  e?.();
-}, []), null);
+import { __require as r } from "./bundle.es53.js";
+var a = /* @__PURE__ */ r();
 export {
-  n as RemoveListener
+  a as f
 };

package/dist/bundle.es41.js

@@ -1,16 +1,7 @@
-import { useState as e } from "react";
-const d = ({ onClick: t }) => {
-  const [a, s] = e({ isLoading: !1, isError: !1 });
-  return { ...a, handleClick: (r) => {
-    a.isLoading || t(() => {
-      s({ isLoading: !0, isError: !1 });
-    }, r).then(() => {
-      s({ isLoading: !1, isError: !1 });
-    }).catch(() => {
-      s({ isLoading: !1, isError: !0 });
-    });
-  } };
-};
+import { useEffect as r } from "react";
+const n = ({ callback: e }) => (r(() => () => {
+  e?.();
+}, []), null);
 export {
-  d as useLoading
+  n as RemoveListener
 };

package/dist/bundle.es42.js

@@ -1,16 +1,16 @@
-import { useRef as i, useCallback as o } from "react";
-const f = (e, s) => {
-  const r = i(null), c = i(void 0), n = o(
-    (t) => {
-      s && t.offsetParent && (t.style.height = "", t.style.height = `${t.scrollHeight}px`, t.scrollHeight !== c.current && e && (e(t), c.current = t.scrollHeight));
-    },
-    [s, e]
-  ), l = o(() => {
-    const t = r.current;
-    t && n(t);
-  }, [r, n]);
-  return [r, l];
+import { useState as e } from "react";
+const d = ({ onClick: t }) => {
+  const [a, s] = e({ isLoading: !1, isError: !1 });
+  return { ...a, handleClick: (r) => {
+    a.isLoading || t(() => {
+      s({ isLoading: !0, isError: !1 });
+    }, r).then(() => {
+      s({ isLoading: !1, isError: !1 });
+    }).catch(() => {
+      s({ isLoading: !1, isError: !0 });
+    });
+  } };
 };
 export {
-  f as useResizeTextarea
+  d as useLoading
 };