@companix/uikit 0.0.8 → 0.0.11

package/README.md

@@ -0,0 +1,16 @@
+# Unset browser styles
+
+If you're not using @tailwind with preflighting, you'll need to override the browser's default styles using the `modern-normalize` package.
+Tailwind's preflighting is actually built on top of the `modern-normalize` package.
+
+## Install
+
+```sh
+npm i modern-normalize
+```
+
+## Usage
+
+```css
+@import 'node_modules/modern-normalize/modern-normalize.css';
+```

package/dist/DatePicker/index.d.ts

@@ -1,4 +1,4 @@
-import { FormProps } from '../Form';
+import { FormProps } from '../Input';
 import { CalendarProps } from './Calendar';
 interface DatePickerProps extends Omit<CalendarProps, 'onChange'>, Omit<FormProps, 'value' | 'onChange' | 'rightElement'> {
     onChange?: (value: Date | null) => void;

package/dist/FormLabel/FormLabel.scss

@@ -0,0 +1,32 @@
+@use '../mixins.scss';
+
+.form-group {
+  display: flex;
+  flex-direction: column;
+
+  &[data-fill] {
+    width: 100%;
+  }
+
+  &-label {
+    @include mixins.truncate-text();
+    @include mixins.use-styles(form-group, label);
+  }
+
+  &-caption {
+    @include mixins.truncate-text();
+    @include mixins.use-styles(form-group, caption);
+
+    &[data-appearance='neutral'] {
+      @include mixins.use-styles(form-group, caption, neutral);
+    }
+
+    &[data-appearance='positive'] {
+      @include mixins.use-styles(form-group, caption, positive);
+    }
+
+    &[data-appearance='negative'] {
+      @include mixins.use-styles(form-group, caption, negative);
+    }
+  }
+}

package/dist/FormLabel/index.d.ts

@@ -0,0 +1,10 @@
+interface FormLabelProps {
+    label: React.ReactNode;
+    children: React.ReactNode;
+    caption?: React.ReactNode;
+    apperance?: 'neutral' | 'positive' | 'negative';
+    fill?: boolean;
+    className?: string;
+}
+export declare const FormGroup: (props: FormLabelProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/{Form → Input}/index.d.ts

@@ -14,4 +14,4 @@ export interface FormProps extends React.HTMLAttributes<HTMLDivElement> {
     mask?: string;
     maskChar?: string;
 }
-export declare const Form: import('react').ForwardRefExoticComponent<FormProps & import('react').RefAttributes<HTMLDivElement>>;
+export declare const Input: import('react').ForwardRefExoticComponent<FormProps & import('react').RefAttributes<HTMLDivElement>>;

package/dist/NumberInput/index.d.ts

@@ -1,4 +1,4 @@
-import { FormProps } from '../Form';
+import { FormProps } from '../Input';
 export interface NumberInputProps extends Omit<FormProps, 'value' | 'onChange'> {
     value: number | null;
     onChange: (value: number | null) => void;

package/dist/Select/index.d.ts

@@ -1,4 +1,4 @@
-import { FormProps } from '../Form';
+import { FormProps } from '../Input';
 import { Option } from '../types';
 interface SelectProps<T> extends Omit<FormProps, 'value' | 'onChange' | 'rightElement'> {
     options: Option<T>[];

package/dist/bundle.es.js

@@ -5,15 +5,15 @@ import { ImitateScroll as a } from "./bundle.es5.js";
 import { Popover as i } from "./bundle.es6.js";
 import { Tooltip as c } from "./bundle.es7.js";
 import { Select as S } from "./bundle.es8.js";
-import { Form as g } from "./bundle.es9.js";
+import { Input as g } from "./bundle.es9.js";
 import { OptionItem as b } from "./bundle.es10.js";
 import { NumberInput as D } from "./bundle.es11.js";
-import { OptionsList as w } from "./bundle.es12.js";
-import { ButtonGroup as I } from "./bundle.es13.js";
+import { OptionsList as d } from "./bundle.es12.js";
+import { ButtonGroup as B } from "./bundle.es13.js";
 import { Checkbox as O } from "./bundle.es14.js";
 import { Switch as k } from "./bundle.es15.js";
 import { Radio as C } from "./bundle.es16.js";
-import { Drawer as P } from "./bundle.es17.js";
+import { Drawer as y } from "./bundle.es17.js";
 import { Dialog as G } from "./bundle.es18.js";
 import { AlertDialog as R } from "./bundle.es19.js";
 import { LoadButton as q } from "./bundle.es20.js";
@@ -29,19 +29,19 @@ import { createToaster as eo } from "./bundle.es29.js";
 export {
   R as AlertDialog,
   e as Button,
-  I as ButtonGroup,
+  B as ButtonGroup,
   O as Checkbox,
   J as Countdown,
   W as DatePicker,
   G as Dialog,
-  P as Drawer,
+  y as Drawer,
   Y as FileOverlay,
-  g as Form,
   a as ImitateScroll,
+  g as Input,
   q as LoadButton,
   D as NumberInput,
   b as OptionItem,
-  w as OptionsList,
+  d as OptionsList,
   i as Popover,
   C as Radio,
   x as Scrollable,

package/dist/bundle.es11.js

@@ -1,15 +1,15 @@
 import { jsx as f } from "react/jsx-runtime";
-import { useState as m, useRef as p } from "react";
-import { Form as l } from "./bundle.es9.js";
+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] = m([]), n = p(o(r));
-  return +n.current !== r && (n.current = o(r)), /* @__PURE__ */ f(
+  const [, t] = p([]), n = m(i(r));
+  return +n.current !== r && (n.current = i(r)), /* @__PURE__ */ f(
     l,
     {
       ...e,
       value: n.current,
-      onChange: (i) => {
-        const s = i.currentTarget.value.trim();
+      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))))) {
@@ -20,7 +20,7 @@ const N = ({ value: r, onChange: u, ...e }) => {
       }
     }
   );
-}, o = (r) => r === null ? "" : r.toString(), a = (r) => {
+}, i = (r) => r === null ? "" : r.toString(), a = (r) => {
   const u = [...r], e = [...r];
   if (e.every((t) => t === "0"))
     return "0";

package/dist/bundle.es25.js

@@ -1,19 +1,19 @@
 import { jsx as l, jsxs as O, Fragment as R } from "react/jsx-runtime";
 import { Popover as z } from "./bundle.es6.js";
-import { Form as Y } from "./bundle.es9.js";
+import { Input as Y } from "./bundle.es9.js";
 import { faClose as E, faChevronDown as S } from "@fortawesome/free-solid-svg-icons";
-import { Icon as F } from "./bundle.es34.js";
+import { Icon as k } from "./bundle.es34.js";
 import { useState as _, useRef as q } from "react";
 import { Calendar as G } from "./bundle.es38.js";
 import { useDayDisableCheker as H } from "./bundle.es39.js";
-import { formatTime as I, getNum as d } from "@companix/utils-js";
+import { formatTime as y, getNum as d } from "@companix/utils-js";
 const h = (t, i = "-") => {
   if (t) {
-    const n = I(t.getDate()), r = I(t.getMonth() + 1), s = t.getFullYear();
+    const n = y(t.getDate()), r = y(t.getMonth() + 1), s = t.getFullYear();
     return [n, r, s].join(i);
   }
   return "";
-}, y = (t, i = "-") => {
+}, F = (t, i = "-") => {
   const n = t.split(i);
   if (n.length === 3) {
     const [r, s, a] = [d(n[0]), d(n[1]), d(n[2])];
@@ -45,7 +45,7 @@ const h = (t, i = "-") => {
     maxDateTime: x,
     // input props
     ...T
-  } = t, [m, c] = _(() => h(o ?? null)), p = q(null), k = H({
+  } = t, [m, c] = _(() => h(o ?? null)), p = q(null), I = H({
     disableFuture: C,
     disablePast: D,
     shouldDisableDate: g,
@@ -57,11 +57,11 @@ const h = (t, i = "-") => {
     e.stopPropagation(), c(""), u?.(null);
   }, V = (e) => {
     c(e);
-    const f = y(e);
-    f && !k(f) && u?.(f);
+    const f = F(e);
+    f && !I(f) && u?.(f);
   }, j = () => {
-    const e = y(m);
-    (!e || k(e)) && c(h(o ?? null));
+    const e = F(m);
+    (!e || I(e)) && c(h(o ?? null));
   }, M = (e) => {
     u?.(e), c(h(e));
   };
@@ -101,8 +101,8 @@ const h = (t, i = "-") => {
           onBlur: j,
           mask: "99-99-9999",
           rightElement: /* @__PURE__ */ O(R, { children: [
-            n && J(m) && /* @__PURE__ */ l("button", { className: "select-close-button", onClick: B, children: r ?? /* @__PURE__ */ l(F, { className: "select-close-icon", icon: E, size: "xxxs" }) }),
-            /* @__PURE__ */ l(F, { className: "expand-icon select-expand", icon: S, size: "xxxs" })
+            n && J(m) && /* @__PURE__ */ l("button", { className: "select-close-button", onClick: B, children: r ?? /* @__PURE__ */ l(k, { className: "select-close-icon", icon: E, size: "xxxs" }) }),
+            /* @__PURE__ */ l(k, { className: "expand-icon select-expand", icon: S, size: "xxxs" })
           ] })
         }
       )

package/dist/bundle.es38.js

@@ -1,7 +1,7 @@
 import { jsxs as D, jsx as t } from "react/jsx-runtime";
-import { dateToFormat as $, weeks as g, createVoids as p, getDayIndex as b, getFirstDay as u, getMonthMaxDay as k } from "./bundle.es43.js";
-import { CalendarHeader as F } from "./bundle.es44.js";
-import { useCalendar as j } from "./bundle.es45.js";
+import { dateToFormat as $, weeks as g, createVoids as p, getDayIndex as b, getFirstDay as u, getMonthMaxDay as k } from "./bundle.es42.js";
+import { CalendarHeader as F } from "./bundle.es43.js";
+import { useCalendar as j } from "./bundle.es44.js";
 import { attr as m } from "@companix/utils-browser";
 import { isSameDate as f } from "./bundle.es39.js";
 import { useLayoutEffect as I } from "react";

package/dist/bundle.es41.js

@@ -2,7 +2,7 @@ import { jsxs as T, jsx as $ } from "react/jsx-runtime";
 import { forwardRef as b, useState as I, useMemo as P, useImperativeHandle as R, useCallback as j, createElement as k } from "react";
 import * as c from "@radix-ui/react-toast";
 import { varToStyle as w } from "@companix/utils-browser";
-import { Toast as C } from "./bundle.es42.js";
+import { Toast as C } from "./bundle.es45.js";
 var g = /* @__PURE__ */ ((e) => (e["top-center"] = "up", e["top-left"] = "left", e["top-right"] = "right", e["bottom-center"] = "down", e["bottom-left"] = "left", e["bottom-right"] = "right", e))(g || {});
 const M = b((e, h) => {
   const { side: f = "top", align: i = "center", gap: m = 14, duration: u, swipeThreshold: v, closeIcon: x } = e, [l, p] = I([]), o = P(() => ({}), []);

package/dist/bundle.es42.js

@@ -1,45 +1,33 @@
-import { jsxs as n, jsx as e } from "react/jsx-runtime";
-import * as t from "@radix-ui/react-toast";
-import { attr as C } from "@companix/utils-browser";
-import { useState as h, useRef as v, useEffect as N, useLayoutEffect as x } from "react";
-import { RemoveListener as R } from "./bundle.es35.js";
-const E = (i) => {
-  const [c, l] = h(!1), o = v(null), {
-    appearance: d = "neutral",
-    icon: r,
-    title: a,
-    description: s,
-    duration: m,
-    closeIcon: u,
-    onRemoving: p,
-    onRemoved: f,
-    onInitialized: L
-  } = i;
-  return N(() => {
-    l(!0);
-  }, []), x(() => {
-    o.current && L(o.current);
-  }, []), /* @__PURE__ */ n(
-    t.Root,
-    {
-      ref: o,
-      "data-expanded": !0,
-      "data-appearance": d,
-      "data-mounted": C(c),
-      className: "toaster",
-      duration: m,
-      children: [
-        /* @__PURE__ */ e(R, { callback: f }),
-        r && /* @__PURE__ */ e("div", { className: "toaster-icon", children: r }),
-        /* @__PURE__ */ n("div", { className: "toaster-content", children: [
-          a && /* @__PURE__ */ e(t.Title, { className: "toaster-title", children: a }),
-          s && /* @__PURE__ */ e(t.Description, { className: "toaster-description", children: s })
-        ] }),
-        /* @__PURE__ */ e(t.Close, { className: "toaster-close", onClick: p, children: u ?? /* @__PURE__ */ e("svg", { viewBox: "0 0 16 16", fill: "currentColor", children: /* @__PURE__ */ e("path", { d: "M2.96967 2.96967C3.26256 2.67678 3.73744 2.67678 4.03033 2.96967L8 6.939L11.9697 2.96967C12.2626 2.67678 12.7374 2.67678 13.0303 2.96967C13.3232 3.26256 13.3232 3.73744 13.0303 4.03033L9.061 8L13.0303 11.9697C13.2966 12.2359 13.3208 12.6526 13.1029 12.9462L13.0303 13.0303C12.7374 13.3232 12.2626 13.3232 11.9697 13.0303L8 9.061L4.03033 13.0303C3.73744 13.3232 3.26256 13.3232 2.96967 13.0303C2.67678 12.7374 2.67678 12.2626 2.96967 11.9697L6.939 8L2.96967 4.03033C2.7034 3.76406 2.6792 3.3474 2.89705 3.05379L2.96967 2.96967Z" }) }) })
-      ]
-    }
-  );
+import { clamp as a } from "@companix/utils-browser";
+const D = (t, e) => new Date(e, t, 0).getDate(), g = (t, e) => new Date(e, t - 1, 1).getDay(), i = (t) => t === 0 ? 6 : t - 1, u = (t) => new Array(t).fill(0), h = (t) => ({
+  day: t.getDate(),
+  month: t.getMonth() + 1,
+  year: t.getFullYear()
+}), y = ["Пн", "Вт", "Ср", "Чт", "Пт", "Сб", "Вс"], s = 9999, c = 100, f = (t, e) => {
+  const o = [], n = a(t - e, c, s), l = a(t + e, c, s);
+  for (let r = n; r <= l; r++)
+    o.push({ title: String(r).padStart(4, "0"), value: r });
+  return o;
+}, p = (t) => {
+  const e = [], o = new Intl.DateTimeFormat(t, {
+    month: "long"
+  });
+  for (let n = 0; n < 12; n++)
+    e.push({
+      title: o.format(new Date(2023, n, 15)),
+      value: n
+    });
+  return e;
 };
 export {
-  E as Toast
+  s as DEFAULT_MAX_YEAR,
+  c as DEFAULT_MIN_YEAR,
+  u as createVoids,
+  h as dateToFormat,
+  i as getDayIndex,
+  g as getFirstDay,
+  D as getMonthMaxDay,
+  p as getMonths,
+  f as getYears,
+  y as weeks
 };

package/dist/bundle.es43.js

@@ -1,33 +1,77 @@
-import { clamp as a } from "@companix/utils-browser";
-const D = (t, e) => new Date(e, t, 0).getDate(), g = (t, e) => new Date(e, t - 1, 1).getDay(), i = (t) => t === 0 ? 6 : t - 1, u = (t) => new Array(t).fill(0), h = (t) => ({
-  day: t.getDate(),
-  month: t.getMonth() + 1,
-  year: t.getFullYear()
-}), y = ["Пн", "Вт", "Ср", "Чт", "Пт", "Сб", "Вс"], s = 9999, c = 100, f = (t, e) => {
-  const o = [], n = a(t - e, c, s), l = a(t + e, c, s);
-  for (let r = n; r <= l; r++)
-    o.push({ title: String(r).padStart(4, "0"), value: r });
-  return o;
-}, p = (t) => {
-  const e = [], o = new Intl.DateTimeFormat(t, {
-    month: "long"
-  });
-  for (let n = 0; n < 12; n++)
-    e.push({
-      title: o.format(new Date(2023, n, 15)),
-      value: n
-    });
-  return e;
+import { jsxs as d, jsx as o } from "react/jsx-runtime";
+import { useCallback as u, useMemo as h } from "react";
+import { Select as p } from "./bundle.es8.js";
+import { getMonths as k, getYears as z, DEFAULT_MAX_YEAR as f, DEFAULT_MIN_YEAR as g } from "./bundle.es42.js";
+import { Icon as C } from "./bundle.es34.js";
+import { faChevronLeft as E, faChevronRight as T } from "@fortawesome/free-solid-svg-icons";
+import { setMonth as _, setYear as F } from "./bundle.es39.js";
+const y = ({
+  viewDate: n,
+  onChange: c,
+  isMonthDisabled: a,
+  isYearDisabled: m,
+  onNextMonth: N,
+  onPrevMonth: v
+}) => {
+  const e = n.getFullYear(), r = n.getMonth(), s = "ru", M = u(
+    (t) => {
+      c(_(n, t));
+    },
+    [c, n]
+  ), x = u(
+    (t) => {
+      c(F(n, t));
+    },
+    [c, n]
+  ), A = h(() => k(s).map((t) => ({
+    ...t,
+    className: "capitalize",
+    disabled: a && a(t.value)
+  })), [s, a]), Y = h(() => z(e, 100).map((t) => ({
+    ...t,
+    disabled: m && m(t.value)
+  })), [e, m]);
+  let l = r === 11 && e === f;
+  a && !l && (l = a(
+    r === 11 ? 0 : r + 1,
+    r === 11 ? Math.min(e + 1, f) : e
+  ));
+  let i = r === 0 && e === g;
+  return a && !i && (i = a(
+    r === 0 ? 11 : r - 1,
+    r === 0 ? Math.max(e - 1, g) : e
+  )), /* @__PURE__ */ d("div", { className: "calendar-header", children: [
+    !i && /* @__PURE__ */ o("button", { className: "calendar-navigation", "data-side": "left", onClick: v, children: /* @__PURE__ */ o(C, { icon: E }) }),
+    /* @__PURE__ */ d("div", { className: "calendar-pickers", children: [
+      /* @__PURE__ */ o(
+        p,
+        {
+          fill: !0,
+          options: Y,
+          size: "sm",
+          value: e,
+          minimalOptions: !0,
+          matchTarget: "min-width",
+          onChange: (t) => x(t || 0)
+        }
+      ),
+      /* @__PURE__ */ o(
+        p,
+        {
+          fill: !0,
+          options: A,
+          size: "sm",
+          className: "capitalize",
+          value: r,
+          minimalOptions: !0,
+          matchTarget: "min-width",
+          onChange: (t) => M(t || 0)
+        }
+      )
+    ] }),
+    !l && /* @__PURE__ */ o("button", { className: "calendar-navigation", "data-side": "right", onClick: N, children: /* @__PURE__ */ o(C, { icon: T }) })
+  ] });
 };
 export {
-  s as DEFAULT_MAX_YEAR,
-  c as DEFAULT_MIN_YEAR,
-  u as createVoids,
-  h as dateToFormat,
-  i as getDayIndex,
-  g as getFirstDay,
-  D as getMonthMaxDay,
-  p as getMonths,
-  f as getYears,
-  y as weeks
+  y as CalendarHeader
 };

package/dist/bundle.es44.js

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

package/dist/bundle.es45.js

@@ -1,51 +1,45 @@
-import { subMonths as L, addMonths as N, useDayDisableCheker as R } from "./bundle.es39.js";
-import { DEFAULT_MIN_YEAR as w, DEFAULT_MAX_YEAR as A } from "./bundle.es43.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]
+import { jsxs as n, jsx as e } from "react/jsx-runtime";
+import * as t from "@radix-ui/react-toast";
+import { attr as C } from "@companix/utils-browser";
+import { useState as h, useRef as v, useEffect as N, useLayoutEffect as x } from "react";
+import { RemoveListener as R } from "./bundle.es35.js";
+const E = (i) => {
+  const [c, l] = h(!1), o = v(null), {
+    appearance: d = "neutral",
+    icon: r,
+    title: a,
+    description: s,
+    duration: m,
+    closeIcon: u,
+    onRemoving: p,
+    onRemoved: f,
+    onInitialized: L
+  } = i;
+  return N(() => {
+    l(!0);
+  }, []), x(() => {
+    o.current && L(o.current);
+  }, []), /* @__PURE__ */ n(
+    t.Root,
+    {
+      ref: o,
+      "data-expanded": !0,
+      "data-appearance": d,
+      "data-mounted": C(c),
+      className: "toaster",
+      duration: m,
+      children: [
+        /* @__PURE__ */ e(R, { callback: f }),
+        r && /* @__PURE__ */ e("div", { className: "toaster-icon", children: r }),
+        /* @__PURE__ */ n("div", { className: "toaster-content", children: [
+          a && /* @__PURE__ */ e(t.Title, { className: "toaster-title", children: a }),
+          s && /* @__PURE__ */ e(t.Description, { className: "toaster-description", children: s })
+        ] }),
+        /* @__PURE__ */ e(t.Close, { className: "toaster-close", onClick: p, children: u ?? /* @__PURE__ */ e("svg", { viewBox: "0 0 16 16", fill: "currentColor", children: /* @__PURE__ */ e("path", { d: "M2.96967 2.96967C3.26256 2.67678 3.73744 2.67678 4.03033 2.96967L8 6.939L11.9697 2.96967C12.2626 2.67678 12.7374 2.67678 13.0303 2.96967C13.3232 3.26256 13.3232 3.73744 13.0303 4.03033L9.061 8L13.0303 11.9697C13.2966 12.2359 13.3208 12.6526 13.1029 12.9462L13.0303 13.0303C12.7374 13.3232 12.2626 13.3232 11.9697 13.0303L8 9.061L4.03033 13.0303C3.73744 13.3232 3.26256 13.3232 2.96967 13.0303C2.67678 12.7374 2.67678 12.2626 2.96967 11.9697L6.939 8L2.96967 4.03033C2.7034 3.76406 2.6792 3.3474 2.89705 3.05379L2.96967 2.96967Z" }) }) })
+      ]
+    }
   );
-  return {
-    viewDate: e,
-    setViewDate: u,
-    setPrevMonth: _,
-    setNextMonth: C,
-    isDayDisabled: D,
-    isMonthDisabled: k,
-    isYearDisabled: v
-  };
 };
 export {
-  X as useCalendar
+  E as Toast
 };

package/dist/bundle.es9.js

@@ -1,21 +1,21 @@
-import { jsxs as z, jsx as r } from "react/jsx-runtime";
+import { jsxs as z, jsx as n } from "react/jsx-runtime";
 import A from "classnames";
-import F from "react-input-mask";
-import { useLayoutAndUpdate as M } from "./bundle.es33.js";
+import M from "react-input-mask";
+import { useLayoutAndUpdate as U } from "./bundle.es33.js";
 import { attr as c } from "@companix/utils-browser";
-import { forwardRef as R, useRef as m, useCallback as g } from "react";
-import { mergeRefs as U } from "react-merge-refs";
+import { forwardRef as R, useRef as l, useCallback as g } from "react";
+import { mergeRefs as v } from "react-merge-refs";
 const Q = R(
   ({
-    required: n,
-    size: f,
+    required: r,
+    size: u,
     fill: a,
     leftElement: e,
-    rightElement: u,
+    rightElement: f,
     onChange: x,
     onValueChange: $,
-    readOnly: b,
-    className: I,
+    readOnly: I,
+    className: b,
     value: N,
     placeholder: W,
     disabled: p,
@@ -24,15 +24,15 @@ const Q = R(
     inputRef: L,
     ...j
   }, k) => {
-    const s = m(null), l = m(null), d = m(null), q = { Right: l, Left: d }, h = g((t) => {
+    const s = l(null), m = l(null), d = l(null), q = { Right: m, Left: d }, h = g((t) => {
       if (s.current) {
         const i = s.current.style, o = q[t];
         o.current && o.current.clientWidth ? i[`padding${t}`] !== `${o.current.clientWidth}px` && (i[`padding${t}`] = `${o.current.clientWidth}px`) : i[`padding${t}`] && (i[`padding${t}`] = "");
       }
     }, []);
-    M(() => {
+    U(() => {
       h("Left"), h("Right");
-    }, [u, e]);
+    }, [f, e]);
     const w = g((t) => {
       x?.(t), $?.(t.target.value, t.target);
     }, []);
@@ -40,36 +40,38 @@ const Q = R(
       "div",
       {
         ref: k,
-        className: A("form", I),
-        "data-size": f ?? "md",
+        className: A("form", b),
+        "data-size": u ?? "md",
         "data-fill": c(a),
-        "data-required": c(n),
+        "data-required": c(r),
         "data-disabled": c(p),
         ...j,
         children: [
-          e && /* @__PURE__ */ r("span", { ref: d, className: "form-input-base-left-element", children: e }),
-          /* @__PURE__ */ r(
-            v,
+          e && /* @__PURE__ */ n("span", { ref: d, className: "form-input-base-left-element", children: e }),
+          /* @__PURE__ */ n(
+            B,
             {
               type: "text",
-              ref: U([s, L]),
+              ref: v([s, L]),
               className: "form-input form-input-base",
               "aria-disabled": p,
               onChange: w,
               value: N,
               placeholder: W,
               disabled: p,
-              readOnly: b,
+              readOnly: I,
               maskChar: C,
               mask: y
             }
           ),
-          u && /* @__PURE__ */ r("span", { ref: l, className: "form-input-base-right-element", children: u })
+          f && /* @__PURE__ */ n("span", { ref: m, className: "form-input-base-right-element", children: f })
         ]
       }
     );
   }
-), v = R(({ mask: n, maskChar: f, ...a }, e) => n ? /* @__PURE__ */ r(F, { inputRef: e, mask: n, maskChar: f, ...a }) : /* @__PURE__ */ r("input", { ref: e, ...a }));
+), B = R(
+  ({ mask: r, maskChar: u, ...a }, e) => r ? /* @__PURE__ */ n(M, { inputRef: e, mask: r, maskChar: u, ...a }) : /* @__PURE__ */ n("input", { ref: e, ...a })
+);
 export {
-  Q as Form
+  Q as Input
 };

package/dist/index.d.ts

@@ -5,7 +5,7 @@ export { ImitateScroll } from './Scrollable/ImitateScroll';
 export { Popover } from './Popover';
 export { Tooltip } from './Tooltip';
 export { Select } from './Select';
-export { Form } from './Form';
+export { Input } from './Input';
 export { OptionItem } from './OptionItem/OptionItem';
 export { NumberInput } from './NumberInput';
 export { OptionsList } from './OptionItem/OptionsList';

package/dist/index.scss

@@ -10,7 +10,6 @@
 @use './Dialog/Dialog.scss';
 @use './DialogAlert/Alert.scss';
 @use './Drawer/Drawer.scss';
-@use './Form/Form.scss';
 @use './Select/Select.scss';
 @use './TextArea/TextArea.scss';
 @use './SelectTags/SelectTags.scss';
@@ -18,8 +17,10 @@
 @use './DateInput/DateInput.scss';
 @use './DatePicker/DatePicker.scss';
 @use './DatePicker/Calendar.scss';
-@use './Form/Input.scss';
+@use './Input/Input.scss';
+@use './Input/Form.scss';
 @use './Switch/Switch.scss';
 @use './Spinner/Spinner.scss';
 @use './ButtonGroup/ButtonGroup.scss';
 @use './Scrollable/Scrollable.scss';
+@use './FormLabel/FormLabel.scss';

package/package.json

@@ -1,11 +1,12 @@
 {
   "name": "@companix/uikit",
-  "version": "0.0.08",
+  "version": "0.0.11",
   "module": "./dist/bundle.es.js",
   "types": "./dist/index.d.ts",
   "type": "module",
   "files": [
-    "dist"
+    "dist",
+    "README.md"
   ],
   "author": "Pavel Victorov",
   "scripts": {
@@ -65,6 +66,7 @@
     "sass-embedded": "^1.96.0",
     "vite": "^7.0.0",
     "vite-plugin-checker": "^0.9.3",
-    "vite-plugin-dts": "^4.5.4"
+    "vite-plugin-dts": "^4.5.4",
+    "vite-plugin-static-copy": "^3.1.4"
   }
 }