@companix/uikit 0.0.36 → 0.0.37

package/dist/__hooks/useCalendarOptions.d.ts

@@ -0,0 +1,31 @@
+import { DateFormat } from '..';
+export declare const defaultMax: {
+    day: number;
+    month: number;
+    year: number;
+};
+export declare const defaultMin: {
+    day: number;
+    month: number;
+    year: number;
+};
+interface Options {
+    min?: DateFormat;
+    max?: DateFormat;
+    now: DateFormat;
+}
+export declare const useCalendarOptions: ({ min, max, now }: Options) => {
+    years: {
+        title: string;
+        value: number;
+    }[];
+    months: {
+        title: string;
+        value: number;
+    }[];
+    days: {
+        title: string;
+        value: number;
+    }[];
+};
+export {};

package/dist/__libs/calendar.d.ts

@@ -0,0 +1,25 @@
+import { CalendarProps } from '../Calendar/Calendar';
+export declare function isSameDate(d1: Date, d2: Date): boolean;
+export declare const MONDAY = 1;
+export declare function startOfWeek(date: Date, { weekStartsOn }: {
+    weekStartsOn?: number | undefined;
+}): Date;
+export declare function endOfWeek(date: Date, { weekStartsOn }: {
+    weekStartsOn?: number | undefined;
+}): Date;
+export declare function startOfDay(date: Date): Date;
+export declare function endOfDay(date: Date): Date;
+export declare function isDayMinMaxRestricted(day: Date, options?: {
+    min?: Date;
+    max?: Date;
+    withTime?: boolean;
+}): boolean;
+export declare function addMonths(date: Date, amount: number): Date;
+export declare function subMonths(date: Date, amount: number): Date;
+export declare function setYear(date: Date, year: number): Date;
+export declare function setMonth(date: Date, month: number): Date;
+interface DisableOptions extends Pick<CalendarProps, 'disableFuture' | 'disablePast' | 'maxDateTime' | 'minDateTime' | 'shouldDisableDate'> {
+}
+export declare const createDayDisableChecker: (options: DisableOptions) => (day: Date, withTime?: boolean) => boolean;
+export declare const useDayDisableCheker: (options: DisableOptions) => (day: Date, withTime?: boolean) => boolean;
+export {};

package/dist/__utils/RemoveListener.d.ts

@@ -0,0 +1,3 @@
+export declare const RemoveListener: ({ callback }: {
+    callback?: () => void;
+}) => null;

package/dist/__utils/utils.d.ts

@@ -0,0 +1,39 @@
+import { DateFormat, Option, TimeFormat } from '..';
+export declare const getMonthMaxDay: (month: number, year: number) => number;
+export declare const getFirstDay: (month: number, year: number) => number;
+export declare const getDayIndex: (day: number) => number;
+export declare const createVoids: (length: number) => any[];
+export declare const dateToFormat: (date: Date) => DateFormat;
+export declare const createDateValidation: ({ min, max }: {
+    min: DateFormat;
+    max: DateFormat;
+}) => (value: DateFormat) => DateFormat | undefined;
+export declare const createRangeValidation: ({ min, max }: {
+    min?: DateFormat;
+    max?: DateFormat;
+}) => {
+    isDateMinValid: (value: DateFormat) => boolean;
+    isDateMaxValid: (value: DateFormat) => boolean;
+    isDateInRange: (value: DateFormat) => boolean;
+};
+export declare const formatToDate: (format: DateFormat) => Date;
+export declare const weeks: string[];
+export declare const DefaultMonths: string[];
+export declare const DEFAULT_MAX_YEAR = 9999;
+export declare const DEFAULT_MIN_YEAR = 100;
+export declare const getYears: (currentYear: number, range: number) => Option<number>[];
+export declare const getMonths: (locale?: string) => Option<number>[];
+export declare const removeDigits: (value: string, signs: string[]) => string;
+export declare const convertTimeToOption: ({ hours, minutes }: TimeFormat, char?: string) => string;
+interface TimeOption extends Option<string> {
+    hours: string;
+    minutes: string;
+}
+export declare const getTimeValue: (time: TimeFormat, char?: string) => {
+    title: string;
+    value: string;
+    hours: string;
+    minutes: string;
+};
+export declare const getTimesOptions: (step: number, char?: string) => TimeOption[];
+export {};

package/dist/bundle.es.js

@@ -0,0 +1,88 @@
+import { Avatar as e } from "./bundle.es2.js";
+import { avatarSizes as p } from "./bundle.es3.js";
+import { Button as x } from "./bundle.es4.js";
+import { ButtonGroup as a } from "./bundle.es5.js";
+import { Spinner as l } from "./bundle.es6.js";
+import { Scrollable as n } from "./bundle.es7.js";
+import { ImitateScroll as S } from "./bundle.es8.js";
+import { Segments as g } from "./bundle.es9.js";
+import { Popover as h } from "./bundle.es10.js";
+import { Tooltip as v } from "./bundle.es11.js";
+import { Select as P } from "./bundle.es12.js";
+import { Input as A } from "./bundle.es13.js";
+import { OptionItem as B } from "./bundle.es14.js";
+import { NumberInput as k } from "./bundle.es15.js";
+import { OptionsList as y } from "./bundle.es16.js";
+import { Checkbox as G } from "./bundle.es17.js";
+import { Switch as O } from "./bundle.es18.js";
+import { Radio as z, RadioGroup as N } from "./bundle.es19.js";
+import { Drawer as q } from "./bundle.es20.js";
+import { Dialog as H } from "./bundle.es21.js";
+import { AlertDialog as K } from "./bundle.es22.js";
+import { LoadingButton as Q } from "./bundle.es23.js";
+import { Tabs as V } from "./bundle.es24.js";
+import { Countdown as X } from "./bundle.es25.js";
+import { TextArea as Z } from "./bundle.es26.js";
+import { SelectTags as $ } from "./bundle.es27.js";
+import { DatePicker as ro } from "./bundle.es28.js";
+import { DateInput as to } from "./bundle.es29.js";
+import { FileOverlay as mo } from "./bundle.es30.js";
+import { FormGroup as fo } from "./bundle.es31.js";
+import { TimePicker as io } from "./bundle.es32.js";
+import { Icon as co } from "./bundle.es33.js";
+import { ProgressBar as so } from "./bundle.es34.js";
+import { ThemeProvider as uo, useTheme as go } from "./bundle.es35.js";
+import { ColorSchemeScript as ho, colorSchemeScript as Do } from "./bundle.es36.js";
+import { useLocalStorage as Io } from "./bundle.es37.js";
+import { createAlertAgent as Ao } from "./bundle.es38.js";
+import { createToaster as Bo } from "./bundle.es39.js";
+import { Toast as ko } from "./bundle.es40.js";
+import { DialogShell as yo, createDialogsRegistry as Co } from "./bundle.es41.js";
+import { createPopoversRegistry as Lo } from "./bundle.es42.js";
+export {
+  K as AlertDialog,
+  e as Avatar,
+  x as Button,
+  a as ButtonGroup,
+  G as Checkbox,
+  ho as ColorSchemeScript,
+  X as Countdown,
+  to as DateInput,
+  ro as DatePicker,
+  H as Dialog,
+  yo as DialogShell,
+  q as Drawer,
+  mo as FileOverlay,
+  fo as FormGroup,
+  co as Icon,
+  S as ImitateScroll,
+  A as Input,
+  Q as LoadingButton,
+  k as NumberInput,
+  B as OptionItem,
+  y as OptionsList,
+  h as Popover,
+  so as ProgressBar,
+  z as Radio,
+  N as RadioGroup,
+  n as Scrollable,
+  g as Segments,
+  P as Select,
+  $ as SelectTags,
+  l as Spinner,
+  O as Switch,
+  V as Tabs,
+  Z as TextArea,
+  uo as ThemeProvider,
+  io as TimePicker,
+  ko as Toast,
+  v as Tooltip,
+  p as avatarSizes,
+  Do as colorSchemeScript,
+  Ao as createAlertAgent,
+  Co as createDialogsRegistry,
+  Lo as createPopoversRegistry,
+  Bo as createToaster,
+  Io as useLocalStorage,
+  go as useTheme
+};

package/dist/bundle.es10.js

@@ -0,0 +1,82 @@
+import { jsxs as t, jsx as r } from "react/jsx-runtime";
+import * as o from "@radix-ui/react-popover";
+import { attr as B } from "@companix/utils-browser";
+import M from "classnames";
+import { forwardRef as j, useRef as k } from "react";
+const D = j((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: x,
+    minimal: w,
+    className: L,
+    fitMaxHeight: N = !0,
+    zIndex: O = 100,
+    side: A,
+    showArrows: P
+  } = a, e = k(null), b = () => {
+    e.current && e.current.click();
+  }, y = (R) => {
+    x && R.preventDefault();
+  };
+  return /* @__PURE__ */ t(o.Root, { open: g, onOpenChange: v, children: [
+    /* @__PURE__ */ r(o.Trigger, { ref: p, ...h, onClick: y, asChild: !0, children: n }),
+    /* @__PURE__ */ r(o.Portal, { children: /* @__PURE__ */ t(
+      o.Content,
+      {
+        ref: i,
+        className: M("popover", L),
+        side: A,
+        align: C,
+        "data-appearance": w ? "minimal" : "default",
+        "data-match-target": l,
+        sideOffset: s ?? 6,
+        avoidCollisions: !0,
+        arrowPadding: 10,
+        style: { zIndex: O },
+        onAnimationStart: m,
+        onAnimationEnd: c,
+        onOpenAutoFocus: d,
+        onCloseAutoFocus: f,
+        children: [
+          /* @__PURE__ */ r(o.Close, { ref: e, style: { display: "none" } }),
+          P && /* @__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": B(N), children: u({ close: b }) })
+        ]
+      }
+    ) })
+  ] });
+});
+export {
+  D as Popover
+};

package/dist/bundle.es11.js

@@ -0,0 +1,28 @@
+import { jsx as n } from "react/jsx-runtime";
+import { useState as p } from "react";
+import { Popover as m } from "./bundle.es10.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
+    }
+  );
+};
+export {
+  f as Tooltip
+};

package/dist/bundle.es12.js

@@ -0,0 +1,77 @@
+import { jsx as l } from "react/jsx-runtime";
+import { useMemo as F, useImperativeHandle as I } from "react";
+import { Popover as T } from "./bundle.es10.js";
+import { useFroozeClosing as b } from "./bundle.es44.js";
+import { SelectInput as z } from "./bundle.es45.js";
+import { useScrollListController as B } from "./bundle.es46.js";
+import { SelectOptions as D } from "./bundle.es47.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 {
+  G as Select
+};

package/dist/bundle.es13.js

@@ -0,0 +1,43 @@
+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.es48.js";
+import { InputContainer as I } from "./bundle.es49.js";
+import g from "classnames";
+const N = b(
+  ({
+    onChange: m,
+    onValueChange: f,
+    readOnly: i,
+    inputClassName: o,
+    value: p,
+    placeholder: n,
+    mask: d,
+    inputType: 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: p,
+        placeholder: n,
+        disabled: e.disabled,
+        readOnly: i,
+        maskChar: u,
+        mask: d
+      }
+    ) });
+  }
+);
+export {
+  N as Input
+};

package/dist/bundle.es14.js

@@ -0,0 +1,38 @@
+import { jsxs as i, jsx as o } from "react/jsx-runtime";
+import N from "classnames";
+import { Icon as v } from "./bundle.es33.js";
+import { attr as t } from "@companix/utils-browser";
+import { forwardRef as k } from "react";
+import { faCheck as x } from "@companix/icons-solid";
+const O = k(
+  ({ title: d, icon: n, active: c, label: e, disabled: r, minimal: a, onClick: l, className: m, ...s }, p) => {
+    const f = (h) => {
+      r || l?.(h);
+    };
+    return /* @__PURE__ */ i(
+      "div",
+      {
+        ref: p,
+        ...s,
+        className: N("option", m),
+        "data-selected": t(c),
+        "data-disabled": t(r),
+        "data-minimal": t(a),
+        onClick: f,
+        children: [
+          /* @__PURE__ */ i("div", { className: "option-content", children: [
+            n && /* @__PURE__ */ o("div", { className: "option-icon", children: n }),
+            /* @__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 })
+            ] })
+          ] }),
+          c && !a && /* @__PURE__ */ o("div", { className: "option-check", children: /* @__PURE__ */ o(v, { icon: x }) })
+        ]
+      }
+    );
+  }
+);
+export {
+  O as OptionItem
+};

package/dist/bundle.es15.js

@@ -0,0 +1,58 @@
+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.es49.js";
+import { NumericFormat as V } from "react-number-format";
+const D = j(
+  ({
+    onChange: m,
+    onValueChange: o,
+    readOnly: f,
+    inputClassName: i,
+    value: n,
+    placeholder: u,
+    thousandSeparator: a,
+    decimalSeparator: p,
+    allowedDecimalSeparators: l,
+    thousandsGroupStyle: s,
+    decimalScale: d,
+    fixedDecimalScale: b,
+    allowNegative: R = !1,
+    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", i),
+        "aria-disabled": e.disabled,
+        onChange: m,
+        onValueChange: ({ floatValue: h }) => o?.(h ?? null),
+        value: n,
+        placeholder: u,
+        disabled: e.disabled,
+        readOnly: f,
+        thousandSeparator: a,
+        decimalSeparator: p,
+        allowedDecimalSeparators: l,
+        thousandsGroupStyle: s,
+        decimalScale: d,
+        fixedDecimalScale: b,
+        allowNegative: R,
+        allowLeadingZeros: c,
+        suffix: g,
+        prefix: x
+      }
+    ) });
+  }
+);
+export {
+  D as NumberInput
+};

package/dist/bundle.es16.js

@@ -0,0 +1,23 @@
+import { jsx as r } from "react/jsx-runtime";
+import { Scrollable as n } from "./bundle.es7.js";
+const s = ({
+  children: o,
+  maxHeight: t,
+  scrollboxRef: i,
+  optionsWrapperRef: e
+}) => /* @__PURE__ */ r(
+  n,
+  {
+    ref: i,
+    implementation: "inner",
+    padding: 10,
+    thumbPadding: 3,
+    thumbColor: "#0000002b",
+    maxHeight: t,
+    scrollY: !0,
+    children: /* @__PURE__ */ r("div", { className: "option-list", ref: e, children: o })
+  }
+);
+export {
+  s as OptionsList
+};

package/dist/bundle.es17.js

@@ -0,0 +1,35 @@
+import { jsxs as x, jsx as o } from "react/jsx-runtime";
+import * as t from "@radix-ui/react-checkbox";
+import { Icon as h } from "./bundle.es33.js";
+import { faCheck as l } from "@companix/icons-solid";
+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 i = n();
+  return /* @__PURE__ */ x(
+    "div",
+    {
+      className: "checkbox",
+      "data-size": d ?? "md",
+      "data-required": c(m && !e),
+      "data-disabled": c(r),
+      children: [
+        /* @__PURE__ */ o(
+          t.Root,
+          {
+            className: "checkbox-box",
+            checked: e,
+            onCheckedChange: s,
+            disabled: r,
+            id: i,
+            children: /* @__PURE__ */ o(t.Indicator, { className: "checkbox-icon", children: /* @__PURE__ */ o(h, { icon: l, size: "xxxs" }) })
+          }
+        ),
+        a && /* @__PURE__ */ o("label", { className: "checkbox-label", htmlFor: i, "data-disabled": c(r), children: a })
+      ]
+    }
+  );
+};
+export {
+  u as Checkbox
+};

package/dist/bundle.es18.js

@@ -0,0 +1,27 @@
+import { jsxs as d, jsx as c } from "react/jsx-runtime";
+import * as r from "@radix-ui/react-switch";
+import { attr as a } from "@companix/utils-browser";
+import { useId as n } from "react";
+const u = (m) => {
+  const { checked: e, disabled: s, onCheckedChange: o, uncheckedIcon: i, checkedIcon: t, label: h } = m, l = n();
+  return /* @__PURE__ */ d("div", { className: "switch", "data-disabled": a(s), children: [
+    /* @__PURE__ */ c(
+      r.Root,
+      {
+        className: "switch-track",
+        checked: e,
+        onCheckedChange: o,
+        disabled: s,
+        id: l,
+        children: /* @__PURE__ */ d(r.Thumb, { className: "switch-thumb", children: [
+          i && /* @__PURE__ */ c("span", { className: "switch-thumb-icon", "data-visible": a(!e), children: i }),
+          t && /* @__PURE__ */ c("span", { className: "switch-thumb-icon", "data-visible": a(e), children: t })
+        ] })
+      }
+    ),
+    h && /* @__PURE__ */ c("label", { className: "switch-label", htmlFor: l, "data-disabled": s, children: h })
+  ] });
+};
+export {
+  u as Switch
+};

package/dist/bundle.es19.js

@@ -0,0 +1,47 @@
+import { jsxs as u, jsx as o } from "react/jsx-runtime";
+import { useId as p } from "react";
+import * as l from "@radix-ui/react-radio-group";
+import { attr as s } from "@companix/utils-browser";
+const q = (t) => {
+  const { options: m, value: a, onChange: r, disabled: d, required: e, size: n } = t;
+  return /* @__PURE__ */ o(
+    l.Root,
+    {
+      className: "radio-group",
+      disabled: d,
+      "data-required": s(e && !a),
+      "data-v": a,
+      value: a,
+      onValueChange: (i) => r(i),
+      children: m.map((i, c) => /* @__PURE__ */ o(
+        h,
+        {
+          ...i,
+          size: n,
+          disabled: d,
+          required: e && !a
+        },
+        `radio-${i.value}-${c}`
+      ))
+    }
+  );
+}, h = ({ value: t, label: m, size: a = "md", disabled: r, required: d }) => {
+  const e = p();
+  return /* @__PURE__ */ u(
+    "span",
+    {
+      className: "radio",
+      "data-disabled": s(r),
+      "data-size": a,
+      "data-required": s(d),
+      children: [
+        /* @__PURE__ */ o(l.Item, { className: "radio-box", value: t, disabled: r, id: e, children: /* @__PURE__ */ o(l.Indicator, { className: "radio-mark" }) }),
+        /* @__PURE__ */ o("label", { className: "radio-label", htmlFor: e, "data-disabled": s(r), children: m })
+      ]
+    }
+  );
+};
+export {
+  h as Radio,
+  q as RadioGroup
+};