@companix/uikit 0.0.42 → 0.0.44

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -14,6 +14,9 @@
14
14
  @include mixins.use-styles(option);
15
15
 
16
16
  &-icon {
17
+ display: flex;
18
+ align-items: center;
19
+
17
20
  @include mixins.use-styles(option, icon);
18
21
 
19
22
  svg {
@@ -23,10 +26,10 @@
23
26
 
24
27
  &-content {
25
28
  display: flex;
26
- flex-direction: column;
27
29
  flex-grow: 1;
28
30
  min-width: 0;
29
31
  max-width: 100%;
32
+ gap: 8px;
30
33
 
31
34
  &-inner {
32
35
  @include mixins.use-styles(option, content, layout);
@@ -36,6 +36,24 @@
36
36
  }
37
37
  }
38
38
 
39
+ &-add-option {
40
+ color: #2d81e0;
41
+
42
+ &:not([data-disabled]):hover {
43
+ background-color: #2d80e02b !important;
44
+ }
45
+
46
+ &:not([data-disabled]):active {
47
+ background-color: #2d80e042 !important;
48
+ }
49
+
50
+ svg {
51
+ width: 18px;
52
+ min-width: 18px;
53
+ height: 18px;
54
+ }
55
+ }
56
+
39
57
  &-element {
40
58
  height: 100%;
41
59
  display: flex;
@@ -1,4 +1,9 @@
1
1
  import { Option } from '..';
2
+ export interface SelectAddOption {
3
+ text: string;
4
+ closeOnClick?: boolean;
5
+ onClick: () => void;
6
+ }
2
7
  interface SelectPopoverProps<T> {
3
8
  scrollboxRef?: React.RefObject<HTMLDivElement>;
4
9
  optionsWrapperRef?: React.RefObject<HTMLDivElement>;
@@ -7,6 +12,7 @@ interface SelectPopoverProps<T> {
7
12
  active?: T | null;
8
13
  onSelect?: (value: T) => void;
9
14
  onOpened?: () => void;
15
+ addOption?: SelectAddOption;
10
16
  }
11
17
  export declare const SelectOptions: <T>(props: SelectPopoverProps<T>) => import("react/jsx-runtime").JSX.Element;
12
18
  export {};
@@ -1,5 +1,6 @@
1
1
  import { Option } from '../types';
2
2
  import { SelectFormProps } from './SelectInput';
3
+ import { SelectAddOption } from './SelectOptions';
3
4
  interface Cleanable<T> {
4
5
  clearButton: true;
5
6
  onChange: (event: T | null) => void;
@@ -9,16 +10,19 @@ interface UnCleanable<T> {
9
10
  onChange: (event: T) => void;
10
11
  }
11
12
  type DependedValueType<T> = Cleanable<T> | UnCleanable<T>;
12
- export type SelectProps<T> = Omit<SelectFormProps, 'value' | 'onChange' | 'closeButton'> & DependedValueType<T> & {
13
- value: T | null;
14
- options: Option<T>[];
15
- children?: React.ReactNode;
13
+ export interface SelectParams {
16
14
  minimalOptions?: boolean;
17
15
  matchTarget?: 'width' | 'min-width';
18
16
  popoverRef?: React.Ref<HTMLDivElement>;
19
17
  scrollRef?: React.Ref<{
20
18
  scrollTo: (index: number) => void;
21
19
  }>;
20
+ addOption?: SelectAddOption;
21
+ }
22
+ export type SelectProps<T> = Omit<SelectFormProps, 'value' | 'onChange' | 'closeButton'> & DependedValueType<T> & SelectParams & {
23
+ value: T | null;
24
+ options: Option<T>[];
25
+ children?: React.ReactNode;
22
26
  };
23
27
  export declare const Select: <T>(props: SelectProps<T>) => import("react/jsx-runtime").JSX.Element;
24
28
  export {};
@@ -1,57 +1,58 @@
1
- import { jsxs as t, jsx as r } from "react/jsx-runtime";
1
+ import { jsxs as a, jsx as r } from "react/jsx-runtime";
2
2
  import * as o from "@radix-ui/react-popover";
3
3
  import { attr as B } from "@companix/utils-browser";
4
4
  import M from "classnames";
5
5
  import { forwardRef as j, useRef as k } from "react";
6
- const D = j((a, i) => {
6
+ const D = j((i, n) => {
7
7
  const {
8
- children: n,
9
- sideOffset: s,
10
- matchTarget: l,
11
- onAnimationEnd: c,
12
- onAnimationStart: m,
13
- onOpenAutoFocus: d,
8
+ children: s,
9
+ sideOffset: l,
10
+ matchTarget: c,
11
+ onAnimationEnd: m,
12
+ onAnimationStart: d,
13
+ onOpenAutoFocus: p,
14
14
  onCloseAutoFocus: f,
15
- triggerRef: p,
16
- triggerProps: h,
17
- open: g,
18
- content: u,
19
- onOpenChange: v,
20
- align: C,
21
- disabled: x,
22
- minimal: w,
23
- className: L,
24
- fitMaxHeight: N = !0,
25
- zIndex: O = 9999,
15
+ triggerRef: h,
16
+ triggerProps: g,
17
+ open: u,
18
+ content: v,
19
+ onOpenChange: C,
20
+ align: x,
21
+ disabled: w,
22
+ minimal: L,
23
+ className: N,
24
+ fitMaxHeight: O = !0,
25
+ zIndex: P = 9999,
26
26
  side: A,
27
- showArrows: P
28
- } = a, e = k(null), b = () => {
27
+ showArrows: b
28
+ } = i, e = k(null), y = () => {
29
29
  e.current && e.current.click();
30
- }, y = (R) => {
31
- x && R.preventDefault();
30
+ }, R = (t) => {
31
+ w && t.preventDefault();
32
32
  };
33
- return /* @__PURE__ */ t(o.Root, { open: g, onOpenChange: v, children: [
34
- /* @__PURE__ */ r(o.Trigger, { ref: p, ...h, onClick: y, asChild: !0, children: n }),
35
- /* @__PURE__ */ r(o.Portal, { children: /* @__PURE__ */ t(
33
+ return /* @__PURE__ */ a(o.Root, { open: u, onOpenChange: C, children: [
34
+ /* @__PURE__ */ r(o.Trigger, { ref: h, ...g, onClick: R, asChild: !0, children: s }),
35
+ /* @__PURE__ */ r(o.Portal, { children: /* @__PURE__ */ a(
36
36
  o.Content,
37
37
  {
38
- ref: i,
39
- className: M("popover", L),
38
+ ref: n,
39
+ className: M("popover", N),
40
40
  side: A,
41
- align: C,
42
- "data-appearance": w ? "minimal" : "default",
43
- "data-match-target": l,
44
- sideOffset: s ?? 6,
41
+ align: x,
42
+ "data-appearance": L ? "minimal" : "default",
43
+ "data-match-target": c,
44
+ sideOffset: l ?? 6,
45
45
  avoidCollisions: !0,
46
46
  arrowPadding: 10,
47
- style: { zIndex: O },
48
- onAnimationStart: m,
49
- onAnimationEnd: c,
50
- onOpenAutoFocus: d,
47
+ style: { zIndex: P },
48
+ onAnimationStart: d,
49
+ onAnimationEnd: m,
50
+ onOpenAutoFocus: p,
51
51
  onCloseAutoFocus: f,
52
+ onWheel: (t) => t.stopPropagation(),
52
53
  children: [
53
54
  /* @__PURE__ */ r(o.Close, { ref: e, style: { display: "none" } }),
54
- 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: [
55
+ b && /* @__PURE__ */ r(o.Arrow, { width: 30, height: 11, asChild: !0, children: /* @__PURE__ */ r("div", { className: "popover-arrow", children: /* @__PURE__ */ a("svg", { className: "popover-arrow-icon", viewBox: "0 0 30 11", width: 30, height: 11, children: [
55
56
  /* @__PURE__ */ r(
56
57
  "path",
57
58
  {
@@ -71,7 +72,7 @@ const D = j((a, i) => {
71
72
  }
72
73
  )
73
74
  ] }) }) }),
74
- /* @__PURE__ */ r("div", { className: "popover-content", "data-fit-max-height": B(N), children: u({ close: b }) })
75
+ /* @__PURE__ */ r("div", { className: "popover-content", "data-fit-max-height": B(O), children: v({ close: y }) })
75
76
  ]
76
77
  }
77
78
  ) })
@@ -1,12 +1,12 @@
1
1
  import { jsx as l } from "react/jsx-runtime";
2
- import { useMemo as F, useImperativeHandle as I } from "react";
3
- import { Popover as T } from "./bundle.es10.js";
4
- import { useFroozeClosing as b } from "./bundle.es45.js";
5
- import { SelectInput as z } from "./bundle.es46.js";
6
- import { useScrollListController as B } from "./bundle.es47.js";
7
- import { SelectOptions as D } from "./bundle.es48.js";
8
- import { mergeRefs as j } from "react-merge-refs";
9
- const G = (a) => {
2
+ import { useMemo as I, useImperativeHandle as T } from "react";
3
+ import { Popover as b } from "./bundle.es10.js";
4
+ import { useFroozeClosing as z } from "./bundle.es45.js";
5
+ import { SelectInput as B } from "./bundle.es46.js";
6
+ import { useScrollListController as D } from "./bundle.es47.js";
7
+ import { SelectOptions as j } from "./bundle.es48.js";
8
+ import { mergeRefs as w } from "react-merge-refs";
9
+ const J = (a) => {
10
10
  const {
11
11
  options: n,
12
12
  onChange: i,
@@ -18,29 +18,30 @@ const G = (a) => {
18
18
  scrollRef: d,
19
19
  popoverRef: v,
20
20
  clearButton: s,
21
- ...h
22
- } = a, t = F(() => {
21
+ addOption: h,
22
+ ...x
23
+ } = a, t = I(() => {
23
24
  const o = r === null ? -1 : n.findIndex((e) => e.value === r);
24
25
  return {
25
26
  index: o,
26
27
  option: n[o]
27
28
  };
28
- }, [n, r]), x = t.option?.value ?? null, { popoverRef: R, froozePopoverPosition: C, handleAnimationEnd: g } = b(), { scrollToElement: c, optionsWrapperRef: O, scrollBoxRef: P } = B();
29
- I(d, () => ({
29
+ }, [n, r]), R = t.option?.value ?? null, { popoverRef: C, froozePopoverPosition: O, handleAnimationEnd: g } = z(), { scrollToElement: c, optionsWrapperRef: P, scrollBoxRef: S } = D();
30
+ T(d, () => ({
30
31
  scrollTo: (o) => c(o, "top")
31
32
  }));
32
- const S = (o, e) => {
33
- C(), i(o), e();
34
- }, A = (o) => {
33
+ const A = (o, e) => {
34
+ O(), i(o), e();
35
+ }, E = (o) => {
35
36
  o.stopPropagation(), s && i(null);
36
- }, E = () => {
37
+ }, F = () => {
37
38
  t.index !== -1 && c(t.index, "center");
38
39
  };
39
40
  return /* @__PURE__ */ l(
40
- T,
41
+ b,
41
42
  {
42
43
  minimal: !0,
43
- ref: j([R, v]),
44
+ ref: w([C, v]),
44
45
  sideOffset: 0,
45
46
  matchTarget: f,
46
47
  onAnimationEnd: g,
@@ -48,30 +49,31 @@ const G = (a) => {
48
49
  onCloseAutoFocus: (o) => o.preventDefault(),
49
50
  disabled: p,
50
51
  content: ({ close: o }) => /* @__PURE__ */ l(
51
- D,
52
+ j,
52
53
  {
53
54
  options: n,
54
- active: x,
55
- scrollboxRef: P,
56
- optionsWrapperRef: O,
55
+ active: R,
56
+ scrollboxRef: S,
57
+ optionsWrapperRef: P,
57
58
  minimalOptions: m,
58
- onOpened: E,
59
- onSelect: (e) => S(e, o)
59
+ addOption: h,
60
+ onOpened: F,
61
+ onSelect: (e) => A(e, o)
60
62
  }
61
63
  ),
62
64
  children: u ?? /* @__PURE__ */ l(
63
- z,
65
+ B,
64
66
  {
65
- ...h,
67
+ ...x,
66
68
  disabled: p,
67
69
  clearButton: s,
68
70
  value: t.option?.title ?? "",
69
- onClear: A
71
+ onClear: E
70
72
  }
71
73
  )
72
74
  }
73
75
  );
74
76
  };
75
77
  export {
76
- G as Select
78
+ J as Select
77
79
  };
@@ -1,22 +1,44 @@
1
- import { jsx as o } from "react/jsx-runtime";
2
- import { useEffect as a } from "react";
3
- import { OptionItem as f } from "./bundle.es14.js";
1
+ import { jsxs as d, jsx as i } from "react/jsx-runtime";
2
+ import { useEffect as x } from "react";
3
+ import { OptionItem as e } from "./bundle.es14.js";
4
4
  import { OptionsList as O } from "./bundle.es16.js";
5
- const h = (t) => {
6
- const { active: i, onOpened: m, scrollboxRef: n, optionsWrapperRef: r, options: p, onSelect: s, minimalOptions: c } = t;
7
- return a(() => {
8
- m?.();
9
- }, []), /* @__PURE__ */ o(O, { scrollboxRef: n, optionsWrapperRef: r, maxHeight: 300, children: p.map((e, l) => /* @__PURE__ */ o(
10
- f,
11
- {
12
- active: i === e.value,
13
- onClick: () => s?.(e.value),
14
- minimal: c,
15
- ...e
16
- },
17
- `select-option-${l}`
18
- )) });
5
+ import { Icon as u } from "./bundle.es33.js";
6
+ import { faPlus as v } from "@companix/icons-solid";
7
+ const S = (n) => {
8
+ const {
9
+ active: m,
10
+ onOpened: r,
11
+ addOption: o,
12
+ scrollboxRef: c,
13
+ optionsWrapperRef: p,
14
+ options: s,
15
+ onSelect: l,
16
+ minimalOptions: a
17
+ } = n;
18
+ return x(() => {
19
+ r?.();
20
+ }, []), /* @__PURE__ */ d(O, { scrollboxRef: c, optionsWrapperRef: p, maxHeight: 300, children: [
21
+ o && /* @__PURE__ */ i(
22
+ e,
23
+ {
24
+ className: "select-add-option",
25
+ icon: /* @__PURE__ */ i(u, { icon: v }),
26
+ title: o.text,
27
+ onClick: o.onClick
28
+ }
29
+ ),
30
+ s.map((t, f) => /* @__PURE__ */ i(
31
+ e,
32
+ {
33
+ active: m === t.value,
34
+ onClick: () => l?.(t.value),
35
+ minimal: a,
36
+ ...t
37
+ },
38
+ `select-option-${f}`
39
+ ))
40
+ ] });
19
41
  };
20
42
  export {
21
- h as SelectOptions
43
+ S as SelectOptions
22
44
  };
@@ -2,7 +2,7 @@ import { jsxs as b, jsx as o } from "react/jsx-runtime";
2
2
  import h from "classnames";
3
3
  import { attr as e } from "@companix/utils-browser";
4
4
  import { forwardRef as x } from "react";
5
- import { useInputPadding as N } from "./bundle.es64.js";
5
+ import { useInputPadding as N } from "./bundle.es62.js";
6
6
  const v = x(
7
7
  ({
8
8
  required: s,
@@ -1,7 +1,7 @@
1
1
  import { jsxs as D, jsx as t } from "react/jsx-runtime";
2
2
  import { dateToFormat as $, weeks as g, createVoids as p, getDayIndex as b, getFirstDay as u, getMonthMaxDay as k } from "./bundle.es56.js";
3
- import { CalendarHeader as F } from "./bundle.es62.js";
4
- import { useCalendar as j } from "./bundle.es63.js";
3
+ import { CalendarHeader as F } from "./bundle.es63.js";
4
+ import { useCalendar as j } from "./bundle.es64.js";
5
5
  import { attr as m } from "@companix/utils-browser";
6
6
  import { isSameDate as f } from "./bundle.es55.js";
7
7
  import { useLayoutEffect as I } from "react";
@@ -1,77 +1,16 @@
1
- import { jsxs as d, jsx as o } from "react/jsx-runtime";
2
- import { useCallback as u, useMemo as h } from "react";
3
- import { Select as p } from "./bundle.es12.js";
4
- import { getMonths as k, getYears as z, DEFAULT_MAX_YEAR as f, DEFAULT_MIN_YEAR as g } from "./bundle.es56.js";
5
- import { Icon as C } from "./bundle.es33.js";
6
- import { faChevronLeft as E, faChevronRight as T } from "@companix/icons-solid";
7
- import { setMonth as _, setYear as F } from "./bundle.es55.js";
8
- const y = ({
9
- viewDate: n,
10
- onChange: c,
11
- isMonthDisabled: a,
12
- isYearDisabled: m,
13
- onNextMonth: N,
14
- onPrevMonth: v
15
- }) => {
16
- const e = n.getFullYear(), r = n.getMonth(), s = "ru", M = u(
17
- (t) => {
18
- c(_(n, t));
19
- },
20
- [c, n]
21
- ), x = u(
22
- (t) => {
23
- c(F(n, t));
24
- },
25
- [c, n]
26
- ), A = h(() => k(s).map((t) => ({
27
- ...t,
28
- className: "capitalize",
29
- disabled: a && a(t.value)
30
- })), [s, a]), Y = h(() => z(e, 100).map((t) => ({
31
- ...t,
32
- disabled: m && m(t.value)
33
- })), [e, m]);
34
- let l = r === 11 && e === f;
35
- a && !l && (l = a(
36
- r === 11 ? 0 : r + 1,
37
- r === 11 ? Math.min(e + 1, f) : e
38
- ));
39
- let i = r === 0 && e === g;
40
- return a && !i && (i = a(
41
- r === 0 ? 11 : r - 1,
42
- r === 0 ? Math.max(e - 1, g) : e
43
- )), /* @__PURE__ */ d("div", { className: "calendar-header", children: [
44
- !i && /* @__PURE__ */ o("button", { className: "calendar-navigation", "data-side": "left", onClick: v, children: /* @__PURE__ */ o(C, { icon: E }) }),
45
- /* @__PURE__ */ d("div", { className: "calendar-pickers", children: [
46
- /* @__PURE__ */ o(
47
- p,
48
- {
49
- fill: !0,
50
- options: Y,
51
- size: "sm",
52
- value: e,
53
- minimalOptions: !0,
54
- matchTarget: "min-width",
55
- onChange: (t) => x(t)
56
- }
57
- ),
58
- /* @__PURE__ */ o(
59
- p,
60
- {
61
- fill: !0,
62
- options: A,
63
- size: "sm",
64
- className: "capitalize",
65
- value: r,
66
- minimalOptions: !0,
67
- matchTarget: "min-width",
68
- onChange: (t) => M(t)
69
- }
70
- )
71
- ] }),
72
- !l && /* @__PURE__ */ o("button", { className: "calendar-navigation", "data-side": "right", onClick: N, children: /* @__PURE__ */ o(C, { icon: T }) })
73
- ] });
1
+ import { useRef as l, useCallback as p } from "react";
2
+ import { useEffectWithLayout as d } from "./bundle.es65.js";
3
+ const g = (r, f) => {
4
+ const c = l(null), i = l(null), o = { Right: c, Left: i }, u = p((t) => {
5
+ if (r.current) {
6
+ const n = r.current.style, e = o[t];
7
+ 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}`] = "");
8
+ }
9
+ }, []);
10
+ return d(() => {
11
+ u("Left"), u("Right");
12
+ }, f), { rightRef: c, leftRef: i };
74
13
  };
75
14
  export {
76
- y as CalendarHeader
15
+ g as useInputPadding
77
16
  };
@@ -1,51 +1,77 @@
1
- import { subMonths as L, addMonths as N, useDayDisableCheker as R } from "./bundle.es55.js";
2
- import { DEFAULT_MIN_YEAR as w, DEFAULT_MAX_YEAR as A } from "./bundle.es56.js";
3
- import { useState as U, useCallback as M } from "react";
4
- const X = ({
5
- value: p,
6
- disablePast: r,
7
- disableFuture: c,
8
- shouldDisableDate: E,
9
- minDateTime: l,
10
- maxDateTime: s
1
+ import { jsxs as d, jsx as o } from "react/jsx-runtime";
2
+ import { useCallback as u, useMemo as h } from "react";
3
+ import { Select as p } from "./bundle.es12.js";
4
+ import { getMonths as k, getYears as z, DEFAULT_MAX_YEAR as f, DEFAULT_MIN_YEAR as g } from "./bundle.es56.js";
5
+ import { Icon as C } from "./bundle.es33.js";
6
+ import { faChevronLeft as E, faChevronRight as T } from "@companix/icons-solid";
7
+ import { setMonth as _, setYear as F } from "./bundle.es55.js";
8
+ const y = ({
9
+ viewDate: n,
10
+ onChange: c,
11
+ isMonthDisabled: a,
12
+ isYearDisabled: m,
13
+ onNextMonth: N,
14
+ onPrevMonth: v
11
15
  }) => {
12
- const [e, u] = U(p || /* @__PURE__ */ new Date()), _ = M(() => {
13
- u(L(e));
14
- }, [e]), C = M(() => {
15
- u(N(e, 1));
16
- }, [e]), D = R({
17
- disableFuture: c,
18
- disablePast: r,
19
- shouldDisableDate: E,
20
- minDateTime: l,
21
- maxDateTime: s
22
- }), k = M(
23
- (o, t) => {
24
- const n = /* @__PURE__ */ new Date();
25
- t = t || e.getFullYear();
26
- const h = l ? l.getMonth() : 0, Y = s ? s.getMonth() : 11, F = l?.getFullYear() || w, f = s?.getFullYear() || A;
27
- let g = t >= F && t <= f ? t === F && h > o || t === f && o > Y : !0;
28
- 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;
16
+ const e = n.getFullYear(), r = n.getMonth(), s = "ru", M = u(
17
+ (t) => {
18
+ c(_(n, t));
29
19
  },
30
- [c, r, e, l, s]
31
- ), v = M(
32
- (o) => {
33
- const t = /* @__PURE__ */ new Date(), n = l?.getFullYear() || w, h = s?.getFullYear() || A;
34
- let Y = n > o || o > h;
35
- return c && (Y = Y || o > t.getFullYear()), r && (Y = Y || o < t.getFullYear()), Y;
20
+ [c, n]
21
+ ), x = u(
22
+ (t) => {
23
+ c(F(n, t));
36
24
  },
37
- [c, r, l, s]
38
- );
39
- return {
40
- viewDate: e,
41
- setViewDate: u,
42
- setPrevMonth: _,
43
- setNextMonth: C,
44
- isDayDisabled: D,
45
- isMonthDisabled: k,
46
- isYearDisabled: v
47
- };
25
+ [c, n]
26
+ ), A = h(() => k(s).map((t) => ({
27
+ ...t,
28
+ className: "capitalize",
29
+ disabled: a && a(t.value)
30
+ })), [s, a]), Y = h(() => z(e, 100).map((t) => ({
31
+ ...t,
32
+ disabled: m && m(t.value)
33
+ })), [e, m]);
34
+ let l = r === 11 && e === f;
35
+ a && !l && (l = a(
36
+ r === 11 ? 0 : r + 1,
37
+ r === 11 ? Math.min(e + 1, f) : e
38
+ ));
39
+ let i = r === 0 && e === g;
40
+ return a && !i && (i = a(
41
+ r === 0 ? 11 : r - 1,
42
+ r === 0 ? Math.max(e - 1, g) : e
43
+ )), /* @__PURE__ */ d("div", { className: "calendar-header", children: [
44
+ !i && /* @__PURE__ */ o("button", { className: "calendar-navigation", "data-side": "left", onClick: v, children: /* @__PURE__ */ o(C, { icon: E }) }),
45
+ /* @__PURE__ */ d("div", { className: "calendar-pickers", children: [
46
+ /* @__PURE__ */ o(
47
+ p,
48
+ {
49
+ fill: !0,
50
+ options: Y,
51
+ size: "sm",
52
+ value: e,
53
+ minimalOptions: !0,
54
+ matchTarget: "min-width",
55
+ onChange: (t) => x(t)
56
+ }
57
+ ),
58
+ /* @__PURE__ */ o(
59
+ p,
60
+ {
61
+ fill: !0,
62
+ options: A,
63
+ size: "sm",
64
+ className: "capitalize",
65
+ value: r,
66
+ minimalOptions: !0,
67
+ matchTarget: "min-width",
68
+ onChange: (t) => M(t)
69
+ }
70
+ )
71
+ ] }),
72
+ !l && /* @__PURE__ */ o("button", { className: "calendar-navigation", "data-side": "right", onClick: N, children: /* @__PURE__ */ o(C, { icon: T }) })
73
+ ] });
48
74
  };
49
75
  export {
50
- X as useCalendar
76
+ y as CalendarHeader
51
77
  };
@@ -1,16 +1,51 @@
1
- import { useRef as l, useCallback as p } from "react";
2
- import { useEffectWithLayout as d } from "./bundle.es65.js";
3
- const g = (r, f) => {
4
- const c = l(null), i = l(null), o = { Right: c, Left: i }, u = p((t) => {
5
- if (r.current) {
6
- const n = r.current.style, e = o[t];
7
- 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}`] = "");
8
- }
9
- }, []);
10
- return d(() => {
11
- u("Left"), u("Right");
12
- }, f), { rightRef: c, leftRef: i };
1
+ import { subMonths as L, addMonths as N, useDayDisableCheker as R } from "./bundle.es55.js";
2
+ import { DEFAULT_MIN_YEAR as w, DEFAULT_MAX_YEAR as A } from "./bundle.es56.js";
3
+ import { useState as U, useCallback as M } from "react";
4
+ const X = ({
5
+ value: p,
6
+ disablePast: r,
7
+ disableFuture: c,
8
+ shouldDisableDate: E,
9
+ minDateTime: l,
10
+ maxDateTime: s
11
+ }) => {
12
+ const [e, u] = U(p || /* @__PURE__ */ new Date()), _ = M(() => {
13
+ u(L(e));
14
+ }, [e]), C = M(() => {
15
+ u(N(e, 1));
16
+ }, [e]), D = R({
17
+ disableFuture: c,
18
+ disablePast: r,
19
+ shouldDisableDate: E,
20
+ minDateTime: l,
21
+ maxDateTime: s
22
+ }), k = M(
23
+ (o, t) => {
24
+ const n = /* @__PURE__ */ new Date();
25
+ t = t || e.getFullYear();
26
+ const h = l ? l.getMonth() : 0, Y = s ? s.getMonth() : 11, F = l?.getFullYear() || w, f = s?.getFullYear() || A;
27
+ let g = t >= F && t <= f ? t === F && h > o || t === f && o > Y : !0;
28
+ 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;
29
+ },
30
+ [c, r, e, l, s]
31
+ ), v = M(
32
+ (o) => {
33
+ const t = /* @__PURE__ */ new Date(), n = l?.getFullYear() || w, h = s?.getFullYear() || A;
34
+ let Y = n > o || o > h;
35
+ return c && (Y = Y || o > t.getFullYear()), r && (Y = Y || o < t.getFullYear()), Y;
36
+ },
37
+ [c, r, l, s]
38
+ );
39
+ return {
40
+ viewDate: e,
41
+ setViewDate: u,
42
+ setPrevMonth: _,
43
+ setNextMonth: C,
44
+ isDayDisabled: D,
45
+ isMonthDisabled: k,
46
+ isYearDisabled: v
47
+ };
13
48
  };
14
49
  export {
15
- g as useInputPadding
50
+ X as useCalendar
16
51
  };
package/dist/index.d.ts CHANGED
@@ -18,7 +18,7 @@ export type { PopoverProps } from './Popover';
18
18
  export { Tooltip } from './Tooltip';
19
19
  export type { TooltipProps } from './Tooltip';
20
20
  export { Select } from './Select';
21
- export type { SelectProps } from './Select';
21
+ export type { SelectProps, SelectParams } from './Select';
22
22
  export { Input } from './Input/Input';
23
23
  export type { InputProps } from './Input/Input';
24
24
  export { OptionItem } from './OptionItem/OptionItem';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@companix/uikit",
3
- "version": "0.0.42",
3
+ "version": "0.0.44",
4
4
  "main": "./dist/bundle.es.js",
5
5
  "module": "./dist/bundle.es.js",
6
6
  "types": "./dist/index.d.ts",