@companix/uikit 0.0.29 → 0.0.31

package/dist/bundle.es63.js

@@ -1,78 +1,51 @@
-import { jsxs as f, jsx as o } from "react/jsx-runtime";
-import { useCallback as h, useMemo as d } from "react";
-import { Select as p } from "./bundle.es8.js";
-import { getMonths as Y, getYears as k, DEFAULT_MAX_YEAR as u, DEFAULT_MIN_YEAR as g } from "./bundle.es53.js";
-import { Icon as C } from "./bundle.es30.js";
-import { f as z } from "./bundle.es72.js";
-import { f as L } from "./bundle.es73.js";
-import { setMonth as R, setYear as T } from "./bundle.es52.js";
-const S = ({
-  viewDate: n,
-  onChange: m,
-  isMonthDisabled: a,
-  isYearDisabled: c,
-  onNextMonth: v,
-  onPrevMonth: x
+import { subMonths as L, addMonths as N, useDayDisableCheker as R } from "./bundle.es52.js";
+import { DEFAULT_MIN_YEAR as w, DEFAULT_MAX_YEAR as A } from "./bundle.es53.js";
+import { useState as U, useCallback as M } from "react";
+const X = ({
+  value: p,
+  disablePast: r,
+  disableFuture: c,
+  shouldDisableDate: E,
+  minDateTime: l,
+  maxDateTime: s
 }) => {
-  const r = n.getFullYear(), e = n.getMonth(), i = "ru", N = h(
-    (t) => {
-      m(R(n, t));
+  const [e, u] = U(p || /* @__PURE__ */ new Date()), _ = M(() => {
+    u(L(e));
+  }, [e]), C = M(() => {
+    u(N(e, 1));
+  }, [e]), D = R({
+    disableFuture: c,
+    disablePast: r,
+    shouldDisableDate: E,
+    minDateTime: l,
+    maxDateTime: s
+  }), k = M(
+    (o, t) => {
+      const n = /* @__PURE__ */ new Date();
+      t = t || e.getFullYear();
+      const h = l ? l.getMonth() : 0, Y = s ? s.getMonth() : 11, F = l?.getFullYear() || w, f = s?.getFullYear() || A;
+      let g = t >= F && t <= f ? t === F && h > o || t === f && o > Y : !0;
+      return c && (g = g || (t === n.getFullYear() ? o > n.getMonth() : t > n.getFullYear())), r && (g = g || (t === n.getFullYear() ? o < n.getMonth() : t < n.getFullYear())), g;
     },
-    [m, n]
-  ), E = h(
-    (t) => {
-      m(T(n, t));
+    [c, r, e, l, s]
+  ), v = M(
+    (o) => {
+      const t = /* @__PURE__ */ new Date(), n = l?.getFullYear() || w, h = s?.getFullYear() || A;
+      let Y = n > o || o > h;
+      return c && (Y = Y || o > t.getFullYear()), r && (Y = Y || o < t.getFullYear()), Y;
     },
-    [m, n]
-  ), M = d(() => Y(i).map((t) => ({
-    ...t,
-    className: "capitalize",
-    disabled: a && a(t.value)
-  })), [i, a]), A = d(() => k(r, 100).map((t) => ({
-    ...t,
-    disabled: c && c(t.value)
-  })), [r, c]);
-  let l = e === 11 && r === u;
-  a && !l && (l = a(
-    e === 11 ? 0 : e + 1,
-    e === 11 ? Math.min(r + 1, u) : r
-  ));
-  let s = e === 0 && r === g;
-  return a && !s && (s = a(
-    e === 0 ? 11 : e - 1,
-    e === 0 ? Math.max(r - 1, g) : r
-  )), /* @__PURE__ */ f("div", { className: "calendar-header", children: [
-    !s && /* @__PURE__ */ o("button", { className: "calendar-navigation", "data-side": "left", onClick: x, children: /* @__PURE__ */ o(C, { icon: L.faChevronLeft }) }),
-    /* @__PURE__ */ f("div", { className: "calendar-pickers", children: [
-      /* @__PURE__ */ o(
-        p,
-        {
-          fill: !0,
-          options: A,
-          size: "sm",
-          value: r,
-          minimalOptions: !0,
-          matchTarget: "min-width",
-          onChange: (t) => E(t)
-        }
-      ),
-      /* @__PURE__ */ o(
-        p,
-        {
-          fill: !0,
-          options: M,
-          size: "sm",
-          className: "capitalize",
-          value: e,
-          minimalOptions: !0,
-          matchTarget: "min-width",
-          onChange: (t) => N(t)
-        }
-      )
-    ] }),
-    !l && /* @__PURE__ */ o("button", { className: "calendar-navigation", "data-side": "right", onClick: v, children: /* @__PURE__ */ o(C, { icon: z.faChevronRight }) })
-  ] });
+    [c, r, l, s]
+  );
+  return {
+    viewDate: e,
+    setViewDate: u,
+    setPrevMonth: _,
+    setNextMonth: C,
+    isDayDisabled: D,
+    isMonthDisabled: k,
+    isYearDisabled: v
+  };
 };
 export {
-  S as CalendarHeader
+  X as useCalendar
 };

package/dist/bundle.es64.js

@@ -1,51 +1,16 @@
-import { subMonths as L, addMonths as N, useDayDisableCheker as R } from "./bundle.es52.js";
-import { DEFAULT_MIN_YEAR as w, DEFAULT_MAX_YEAR as A } from "./bundle.es53.js";
-import { useState as U, useCallback as M } from "react";
-const X = ({
-  value: p,
-  disablePast: r,
-  disableFuture: c,
-  shouldDisableDate: E,
-  minDateTime: l,
-  maxDateTime: s
-}) => {
-  const [e, u] = U(p || /* @__PURE__ */ new Date()), _ = M(() => {
-    u(L(e));
-  }, [e]), C = M(() => {
-    u(N(e, 1));
-  }, [e]), D = R({
-    disableFuture: c,
-    disablePast: r,
-    shouldDisableDate: E,
-    minDateTime: l,
-    maxDateTime: s
-  }), k = M(
-    (o, t) => {
-      const n = /* @__PURE__ */ new Date();
-      t = t || e.getFullYear();
-      const h = l ? l.getMonth() : 0, Y = s ? s.getMonth() : 11, F = l?.getFullYear() || w, f = s?.getFullYear() || A;
-      let g = t >= F && t <= f ? t === F && h > o || t === f && o > Y : !0;
-      return c && (g = g || (t === n.getFullYear() ? o > n.getMonth() : t > n.getFullYear())), r && (g = g || (t === n.getFullYear() ? o < n.getMonth() : t < n.getFullYear())), g;
-    },
-    [c, r, e, l, s]
-  ), v = M(
-    (o) => {
-      const t = /* @__PURE__ */ new Date(), n = l?.getFullYear() || w, h = s?.getFullYear() || A;
-      let Y = n > o || o > h;
-      return c && (Y = Y || o > t.getFullYear()), r && (Y = Y || o < t.getFullYear()), Y;
-    },
-    [c, r, l, s]
-  );
-  return {
-    viewDate: e,
-    setViewDate: u,
-    setPrevMonth: _,
-    setNextMonth: C,
-    isDayDisabled: D,
-    isMonthDisabled: k,
-    isYearDisabled: v
-  };
+import { useRef as l, useCallback as p } from "react";
+import { useEffectWithLayout as d } from "./bundle.es73.js";
+const g = (r, f) => {
+  const c = l(null), i = l(null), o = { Right: c, Left: i }, u = p((t) => {
+    if (r.current) {
+      const n = r.current.style, e = o[t];
+      e.current && e.current.clientWidth ? n[`padding${t}`] !== `${e.current.clientWidth}px` && (n[`padding${t}`] = `${e.current.clientWidth}px`) : n[`padding${t}`] && (n[`padding${t}`] = "");
+    }
+  }, []);
+  return d(() => {
+    u("Left"), u("Right");
+  }, f), { rightRef: c, leftRef: i };
 };
 export {
-  X as useCalendar
+  g as useInputPadding
 };

package/dist/bundle.es7.js

@@ -1,28 +1,80 @@
-import { jsx as n } from "react/jsx-runtime";
-import { useState as p } from "react";
-import { Popover as m } from "./bundle.es6.js";
-const f = ({ children: e, content: t, side: r }) => {
-  const [s, o] = p(!1);
-  return /* @__PURE__ */ n(
-    m,
-    {
-      showArrows: !0,
-      className: "tooltip",
-      open: s,
-      side: r,
-      content: () => t,
-      triggerProps: {
-        onMouseEnter: () => {
-          o(!0);
-        },
-        onMouseLeave: () => {
-          o(!1);
-        }
-      },
-      children: e
-    }
-  );
-};
+import { jsxs as t, jsx as r } from "react/jsx-runtime";
+import * as o from "@radix-ui/react-popover";
+import { attr as y } from "@companix/utils-browser";
+import B from "classnames";
+import { forwardRef as M, useRef as j } from "react";
+const D = M((a, i) => {
+  const {
+    children: n,
+    sideOffset: s,
+    matchTarget: l,
+    onAnimationEnd: c,
+    onAnimationStart: m,
+    onOpenAutoFocus: d,
+    onCloseAutoFocus: f,
+    triggerRef: p,
+    triggerProps: h,
+    open: g,
+    content: u,
+    onOpenChange: v,
+    align: C,
+    disabled: w,
+    minimal: x,
+    className: L,
+    fitMaxHeight: N = !0,
+    side: O,
+    showArrows: A
+  } = a, e = j(null), P = () => {
+    e.current && e.current.click();
+  }, b = (R) => {
+    w && R.preventDefault();
+  };
+  return /* @__PURE__ */ t(o.Root, { open: g, onOpenChange: v, children: [
+    /* @__PURE__ */ r(o.Trigger, { ref: p, ...h, onClick: b, asChild: !0, children: n }),
+    /* @__PURE__ */ r(o.Portal, { children: /* @__PURE__ */ t(
+      o.Content,
+      {
+        ref: i,
+        className: B("popover", L),
+        side: O,
+        align: C,
+        "data-appearance": x ? "minimal" : "default",
+        "data-match-target": l,
+        sideOffset: s ?? 6,
+        avoidCollisions: !0,
+        arrowPadding: 10,
+        onAnimationStart: m,
+        onAnimationEnd: c,
+        onOpenAutoFocus: d,
+        onCloseAutoFocus: f,
+        children: [
+          /* @__PURE__ */ r(o.Close, { ref: e, style: { display: "none" } }),
+          A && /* @__PURE__ */ r(o.Arrow, { width: 30, height: 11, asChild: !0, children: /* @__PURE__ */ r("div", { className: "popover-arrow", children: /* @__PURE__ */ t("svg", { className: "popover-arrow-icon", viewBox: "0 0 30 11", width: 30, height: 11, children: [
+            /* @__PURE__ */ r(
+              "path",
+              {
+                className: "popover-arrow-border",
+                d: "M 18.112 -2.704 C 19.127 -3.64 19.999 -5.626 19.999 -7.001 L 19.999 18.999 C 19.999 17.621 19.131 15.642 18.111 14.702 L 10.927 8.084 C 9.69 6.944 9.694 5.05 10.927 3.914 L 18.112 -2.704 Z",
+                style: { transformBox: "fill-box", transformOrigin: "50% 50%" },
+                transform: "matrix(0, -1, 1, 0, 0.000001, 0)"
+              }
+            ),
+            /* @__PURE__ */ r(
+              "path",
+              {
+                className: "popover-arrow-fill",
+                d: "M 17.789 -2.965 C 19.009 -4.09 19.999 -6.341 19.999 -7.995 L 19.999 -10.001 L 19.999 19.999 L 19.999 17.994 C 19.999 16.34 19.016 14.094 17.789 12.964 L 10.606 6.348 C 9.796 5.602 9.804 4.388 10.606 3.648 L 17.789 -2.966 L 17.789 -2.965 Z",
+                style: { transformBox: "fill-box", transformOrigin: "50% 50%" },
+                transform: "matrix(0, -1, 1, 0, 0, 0)"
+              }
+            )
+          ] }) }) }),
+          /* @__PURE__ */ r("div", { className: "popover-content", "data-fit-max-height": y(N), children: u({ close: P }) })
+        ]
+      }
+    ) })
+  ] });
+});
 export {
-  f as Tooltip
+  D as Popover
 };

package/dist/bundle.es71.js

@@ -1,16 +1,5 @@
-import { useRef as f, useLayoutEffect as u, useEffect as s } from "react";
-const o = (t, r) => {
-  const e = f(!1);
-  u(() => {
-    e.current = !0, t();
-  }, []), s(() => {
-    if (e.current) {
-      e.current = !1;
-      return;
-    }
-    t();
-  }, r);
-};
+import { __require as r } from "./bundle.es74.js";
+var o = /* @__PURE__ */ r();
 export {
-  o as useEffectWithLayout
+  o as f
 };

package/dist/bundle.es72.js

@@ -1,4 +1,4 @@
-import { __require as r } from "./bundle.es74.js";
+import { __require as r } from "./bundle.es76.js";
 var o = /* @__PURE__ */ r();
 export {
   o as f

package/dist/bundle.es73.js

@@ -1,5 +1,16 @@
-import { __require as r } from "./bundle.es76.js";
-var o = /* @__PURE__ */ r();
+import { useRef as f, useLayoutEffect as u, useEffect as s } from "react";
+const o = (t, r) => {
+  const e = f(!1);
+  u(() => {
+    e.current = !0, t();
+  }, []), s(() => {
+    if (e.current) {
+      e.current = !1;
+      return;
+    }
+    t();
+  }, r);
+};
 export {
-  o as f
+  o as useEffectWithLayout
 };

package/dist/bundle.es8.js

@@ -1,77 +1,28 @@
-import { jsx as l } from "react/jsx-runtime";
-import { useMemo as F, useImperativeHandle as I } from "react";
-import { Popover as T } from "./bundle.es6.js";
-import { useFroozeClosing as b } from "./bundle.es39.js";
-import { SelectInput as z } from "./bundle.es40.js";
-import { useScrollListController as B } from "./bundle.es41.js";
-import { SelectOptions as D } from "./bundle.es42.js";
-import { mergeRefs as j } from "react-merge-refs";
-const G = (a) => {
-  const {
-    options: n,
-    onChange: i,
-    value: r,
-    minimalOptions: m,
-    matchTarget: f = "width",
-    children: u,
-    disabled: p,
-    scrollRef: d,
-    popoverRef: v,
-    clearButton: s,
-    ...h
-  } = a, t = F(() => {
-    const o = r === null ? -1 : n.findIndex((e) => e.value === r);
-    return {
-      index: o,
-      option: n[o]
-    };
-  }, [n, r]), x = t.option?.value ?? null, { popoverRef: R, froozePopoverPosition: C, handleAnimationEnd: g } = b(), { scrollToElement: c, optionsWrapperRef: O, scrollBoxRef: P } = B();
-  I(d, () => ({
-    scrollTo: (o) => c(o, "top")
-  }));
-  const S = (o, e) => {
-    C(), i(o), e();
-  }, A = (o) => {
-    o.stopPropagation(), s && i(null);
-  }, E = () => {
-    t.index !== -1 && c(t.index, "center");
-  };
-  return /* @__PURE__ */ l(
-    T,
+import { jsx as n } from "react/jsx-runtime";
+import { useState as p } from "react";
+import { Popover as m } from "./bundle.es7.js";
+const f = ({ children: e, content: t, side: r }) => {
+  const [s, o] = p(!1);
+  return /* @__PURE__ */ n(
+    m,
     {
-      minimal: !0,
-      ref: j([R, v]),
-      sideOffset: 0,
-      matchTarget: f,
-      onAnimationEnd: g,
-      onOpenAutoFocus: (o) => o.preventDefault(),
-      onCloseAutoFocus: (o) => o.preventDefault(),
-      disabled: p,
-      content: ({ close: o }) => /* @__PURE__ */ l(
-        D,
-        {
-          options: n,
-          active: x,
-          scrollboxRef: P,
-          optionsWrapperRef: O,
-          minimalOptions: m,
-          onOpened: E,
-          onSelect: (e) => S(e, o)
+      showArrows: !0,
+      className: "tooltip",
+      open: s,
+      side: r,
+      content: () => t,
+      triggerProps: {
+        onMouseEnter: () => {
+          o(!0);
+        },
+        onMouseLeave: () => {
+          o(!1);
         }
-      ),
-      children: u ?? /* @__PURE__ */ l(
-        z,
-        {
-          ...h,
-          disabled: p,
-          clearButton: s,
-          value: t.option?.title ?? "",
-          onClear: A
-        }
-      )
+      },
+      children: e
     }
   );
 };
 export {
-  G as Select
+  f as Tooltip
 };

package/dist/bundle.es9.js

@@ -1,43 +1,77 @@
-import { jsx as t } from "react/jsx-runtime";
-import { forwardRef as b, useRef as R } from "react";
-import { mergeRefs as c } from "react-merge-refs";
-import { InputElement as x } from "./bundle.es43.js";
-import { InputContainer as I } from "./bundle.es44.js";
-import g from "classnames";
-const k = b(
-  ({
-    onChange: m,
-    onValueChange: f,
-    readOnly: i,
-    inputClassName: o,
-    value: n,
-    placeholder: p,
-    mask: d,
-    type: s = "text",
-    maskChar: u,
-    inputRef: a,
-    ...e
-  }, l) => {
-    const r = R(null);
-    return /* @__PURE__ */ t(I, { ref: l, inputRef: r, ...e, children: /* @__PURE__ */ t(
-      x,
-      {
-        type: s,
-        ref: c([r, a]),
-        className: g("form-input form-input-base", o),
-        "aria-disabled": e.disabled,
-        onChange: m,
-        onValueChange: f,
-        value: n,
-        placeholder: p,
-        disabled: e.disabled,
-        readOnly: i,
-        maskChar: u,
-        mask: d
-      }
-    ) });
-  }
-);
+import { jsx as l } from "react/jsx-runtime";
+import { useMemo as F, useImperativeHandle as I } from "react";
+import { Popover as T } from "./bundle.es7.js";
+import { useFroozeClosing as b } from "./bundle.es39.js";
+import { SelectInput as z } from "./bundle.es40.js";
+import { useScrollListController as B } from "./bundle.es41.js";
+import { SelectOptions as D } from "./bundle.es42.js";
+import { mergeRefs as j } from "react-merge-refs";
+const G = (a) => {
+  const {
+    options: n,
+    onChange: i,
+    value: r,
+    minimalOptions: m,
+    matchTarget: f = "width",
+    children: u,
+    disabled: p,
+    scrollRef: d,
+    popoverRef: v,
+    clearButton: s,
+    ...h
+  } = a, t = F(() => {
+    const o = r === null ? -1 : n.findIndex((e) => e.value === r);
+    return {
+      index: o,
+      option: n[o]
+    };
+  }, [n, r]), x = t.option?.value ?? null, { popoverRef: R, froozePopoverPosition: C, handleAnimationEnd: g } = b(), { scrollToElement: c, optionsWrapperRef: O, scrollBoxRef: P } = B();
+  I(d, () => ({
+    scrollTo: (o) => c(o, "top")
+  }));
+  const S = (o, e) => {
+    C(), i(o), e();
+  }, A = (o) => {
+    o.stopPropagation(), s && i(null);
+  }, E = () => {
+    t.index !== -1 && c(t.index, "center");
+  };
+  return /* @__PURE__ */ l(
+    T,
+    {
+      minimal: !0,
+      ref: j([R, v]),
+      sideOffset: 0,
+      matchTarget: f,
+      onAnimationEnd: g,
+      onOpenAutoFocus: (o) => o.preventDefault(),
+      onCloseAutoFocus: (o) => o.preventDefault(),
+      disabled: p,
+      content: ({ close: o }) => /* @__PURE__ */ l(
+        D,
+        {
+          options: n,
+          active: x,
+          scrollboxRef: P,
+          optionsWrapperRef: O,
+          minimalOptions: m,
+          onOpened: E,
+          onSelect: (e) => S(e, o)
+        }
+      ),
+      children: u ?? /* @__PURE__ */ l(
+        z,
+        {
+          ...h,
+          disabled: p,
+          clearButton: s,
+          value: t.option?.title ?? "",
+          onClear: A
+        }
+      )
+    }
+  );
+};
 export {
-  k as Input
+  G as Select
 };

package/dist/index.d.ts

@@ -1,42 +1,68 @@
 export { Button } from './Button';
+export type { ButtonProps, Appearance, Mode, Size } from './Button';
+export { ButtonGroup } from './ButtonGroup';
+export type { ButtonGroupProps } from './ButtonGroup';
 export { Spinner } from './Spinner';
+export type { SpinnerProps } from './Spinner';
 export { Scrollable } from './Scrollable';
 export { ImitateScroll } from './Scrollable/ImitateScroll';
+export type { ImitateScrollProps } from './Scrollable/ImitateScroll';
 export { Popover } from './Popover';
+export type { PopoverProps } from './Popover';
 export { Tooltip } from './Tooltip';
+export type { TooltipProps } from './Tooltip';
 export { Select } from './Select';
+export type { SelectProps } from './Select';
 export { Input } from './Input/Input';
+export type { InputProps } from './Input/Input';
 export { OptionItem } from './OptionItem/OptionItem';
+export type { OptionProps } from './OptionItem/OptionItem';
 export { NumberInput } from './NumberInput';
+export type { NumberInputProps, ReactNumberFormatParams } from './NumberInput';
 export { OptionsList } from './OptionItem/OptionsList';
-export { ButtonGroup } from './ButtonGroup';
+export type { OptionsListProps } from './OptionItem/OptionsList';
 export { Checkbox } from './Checkbox';
+export type { CheckboxProps } from './Checkbox';
 export { Switch } from './Switch';
+export type { SwitchProps } from './Switch';
 export { Radio, RadioGroup } from './Radio';
+export type { RadioOption, RadioGroupProps } from './Radio';
 export { Drawer } from './Drawer';
+export type { DrawerProps } from './Drawer';
 export { Dialog } from './Dialog';
+export type { DialogProps, DialogSize } from './Dialog';
 export { AlertDialog } from './DialogAlert/Alert';
-export { LoadButton } from './LoadButton';
+export type { AlertDialogProps } from './DialogAlert/Alert';
+export { LoadingButton } from './LoadingButton';
+export type { LoadingButtonProps } from './LoadingButton';
 export { Tabs } from './Tabs';
+export type { TabsProps } from './Tabs';
 export { Countdown } from './Countdown';
+export type { CountDownProps } from './Countdown';
 export { TextArea } from './TextArea';
+export type { TextAreaProps } from './TextArea';
 export { SelectTags } from './SelectTags';
+export type { SelectTagsProps } from './SelectTags';
 export { DatePicker } from './DatePicker';
+export type { DatePickerProps } from './DatePicker';
 export { DateInput } from './DateInput';
+export type { DateInputProps } from './DateInput';
 export { FileOverlay } from './File';
+export type { FileOverlayProps } from './File';
 export { FormGroup } from './FormGroup';
+export type { FormGroupProps } from './FormGroup';
 export { TimePicker } from './TimePicker';
+export type { TimePickerProps } from './TimePicker';
 export { Icon } from './Icon';
+export type { IconProps } from './Icon';
 export { ProgressBar } from './Progress';
+export type { ProgressBarProps } from './Progress';
 export { ThemeProvider, useTheme } from './ThemeProvider';
 export { useLocalStorage } from './__hooks/use-local-storage';
 export { createAlertAgent } from './DialogAlert';
 export { createToaster } from './Toaster';
 export { Toast } from './Toaster/Toast';
 export * from './types';
-export type { Appearance } from './Button';
-export type { RadioOption } from './Radio';
-export type { NumberInputProps, ReactNumberFormatParams } from './NumberInput';
 export type { CalendarProps } from './DatePicker/Calendar';
 export { createDialogsRegistry, DialogShell } from './__helpers/createDialogRegistry';
 export { createPopoversRegistry } from './__helpers/createPopoversRegistry';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@companix/uikit",
-  "version": "0.0.29",
+  "version": "0.0.31",
   "module": "./dist/bundle.es.js",
   "types": "./dist/index.d.ts",
   "type": "module",

package/dist/LoadButton/index.d.ts

@@ -1,5 +0,0 @@
-import { ButtonProps } from '../Button';
-import { UseLoadingProps } from '../__hooks/use-loading';
-export interface LoadButtonProps extends UseLoadingProps, Omit<ButtonProps, 'onClick'> {
-}
-export declare const LoadButton: ({ onClick, appearance, ...rest }: LoadButtonProps) => import("react/jsx-runtime").JSX.Element;