@alphakits/ui 2.3.0 → 2.3.1

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.
Files changed (4) hide show
  1. package/dist/calendar/components/days-table/component.js +41 -35
  2. package/dist/popover/component.js +76 -70
  3. package/dist/toast/component.js +65 -63
  4. package/package.json +1 -1
package/dist/calendar/components/days-table/component.js CHANGED
@@ -1,65 +1,71 @@
1
- import { jsx as n, jsxs as O } from "react/jsx-runtime";
2
- import { useRef as j, useMemo as z, useCallback as C } from "react";
1
+ import { jsx as n, jsxs as j } from "react/jsx-runtime";
2
+ import { useRef as x, useMemo as z, useCallback as C } from "react";
3
3
  import { TransitionGroup as P, CSSTransition as W } from "react-transition-group";
4
- import w from "classnames";
5
- import { weekDaysShort as q, isSameDay as c, isWithinInterval as G, isLastDayOfMonth as H, isBefore as I, endOfDay as M, isEqual as J, isToday as K, startOfMonth as Q } from "../../../utils/date/index.js";
4
+ import R from "classnames";
5
+ import { weekDaysShort as q, isSameDay as d, isWithinInterval as G, isLastDayOfMonth as H, isBefore as I, endOfDay as M, isEqual as J, isToday as K, startOfMonth as Q } from "../../../utils/date/index.js";
6
6
  import { capitalize as U } from "../../../utils/string.js";
7
7
  import { Button as V } from "../../../button/component.js";
8
8
  import { Flex as b } from "../../../flex/component.js";
9
9
  import { usePrevious as X } from "../../../hooks/usePrevious/index.js";
10
10
  import { getSelectionRange as Y } from "../../utils.js";
11
11
  import t from "./index.module.css.js";
12
- const oe = ({
13
- weeks: x = [],
12
+ const Z = ({
13
+ children: l,
14
+ ...a
15
+ }) => {
16
+ const i = x(null);
17
+ return /* @__PURE__ */ n(W, { ...a, nodeRef: i, children: /* @__PURE__ */ n("div", { ref: i, children: l }) });
18
+ }, ce = ({
19
+ weeks: l = [],
14
20
  activeMonth: a = /* @__PURE__ */ new Date(),
15
- highlighted: d,
21
+ highlighted: i,
16
22
  selectedFrom: m,
17
- selectedTo: l,
18
- getDayProps: R,
19
- locale: f
23
+ selectedTo: f,
24
+ getDayProps: N,
25
+ locale: p
20
26
  }) => {
21
- const p = j(a);
22
- p.current = a;
23
- const u = X(a), D = u && (a < u ? "right" : "left"), s = Y(m, l, d), g = z(() => q(f), [f]), N = C(
24
- () => g.map((e) => /* @__PURE__ */ n("div", { className: t.dayName, children: U(e) }, e)),
25
- [g]
26
- ), S = (e) => {
27
- const i = e.selected || m != null && c(e.date, new Date(m)) || l != null && c(e.date, new Date(l)), r = !i && s && G(e.date, s), o = e.date.getDate() === 1, v = H(e.date), T = o && r && s && e.date > s.start, k = v && r && s && e.date < s.end, y = s && c(e.date, s.start), A = s && c(e.date, s.end), h = R(e), B = I(M(new Date(e.date)), /* @__PURE__ */ new Date());
27
+ const u = x(a);
28
+ u.current = a;
29
+ const D = X(a), g = D && (a < D ? "right" : "left"), s = Y(m, f, i), v = z(() => q(p), [p]), S = C(
30
+ () => v.map((e) => /* @__PURE__ */ n("div", { className: t.dayName, children: U(e) }, e)),
31
+ [v]
32
+ ), T = (e) => {
33
+ const o = e.selected || m != null && d(e.date, new Date(m)) || f != null && d(e.date, new Date(f)), r = !o && s && G(e.date, s), c = e.date.getDate() === 1, h = H(e.date), y = c && r && s && e.date > s.start, k = h && r && s && e.date < s.end, A = s && d(e.date, s.start), B = s && d(e.date, s.end), w = N(e), L = I(M(new Date(e.date)), /* @__PURE__ */ new Date());
28
34
  return /* @__PURE__ */ n(
29
35
  V,
30
36
  {
31
- ...h,
32
- ref: (L) => {
33
- Q(e.date).getTime() === p.current.getTime() && h.ref(L);
37
+ ...w,
38
+ ref: (O) => {
39
+ Q(e.date).getTime() === u.current.getTime() && w.ref(O);
34
40
  },
35
41
  type: "button",
36
42
  view: "ghost",
37
43
  size: "xs",
38
44
  disabled: e.disabled,
39
- className: w(t.day, {
40
- [t.selected]: i,
45
+ className: R(t.day, {
46
+ [t.selected]: o,
41
47
  [t.range]: r,
42
- [t.rangeStart]: y,
43
- [t.rangeEnd]: A,
44
- [t.transitLeft]: T,
48
+ [t.rangeStart]: A,
49
+ [t.rangeEnd]: B,
50
+ [t.transitLeft]: y,
45
51
  [t.transitRight]: k,
46
52
  [t.today]: K(e.date),
47
- [t.firstDay]: o,
48
- [t.lastDay]: v,
53
+ [t.firstDay]: c,
54
+ [t.lastDay]: h,
49
55
  [t.event]: e.event,
50
- [t.prev]: B,
56
+ [t.prev]: L,
51
57
  [t.disabled]: e.disabled,
52
58
  [t.muted]: e.muted || e.disabled,
53
- [t.highlighted]: d && J(e.date, d)
59
+ [t.highlighted]: i && J(e.date, i)
54
60
  }),
55
61
  children: e.date.getDate()
56
62
  }
57
63
  );
58
- }, E = (e, i) => /* @__PURE__ */ n(b, { className: t.weekRow, children: e.map((r, o) => /* @__PURE__ */ n("div", { className: t.daysRowDay, children: r && S(r) }, r ? r.date.getTime() : o)) }, i);
59
- return /* @__PURE__ */ O("div", { className: w(t.daysTable, D && t[D]), children: [
60
- /* @__PURE__ */ n("div", { className: t.daysRow, children: /* @__PURE__ */ n(b, { children: N() }) }),
64
+ }, E = (e, o) => /* @__PURE__ */ n(b, { className: t.weekRow, children: e.map((r, c) => /* @__PURE__ */ n("div", { className: t.daysRowDay, children: r && T(r) }, r ? r.date.getTime() : c)) }, o);
65
+ return /* @__PURE__ */ j("div", { className: R(t.daysTable, g && t[g]), children: [
66
+ /* @__PURE__ */ n("div", { className: t.daysRow, children: /* @__PURE__ */ n(b, { children: S() }) }),
61
67
  /* @__PURE__ */ n(P, { component: null, children: /* @__PURE__ */ n(
62
- W,
68
+ Z,
63
69
  {
64
70
  timeout: 300,
65
71
  classNames: {
@@ -68,12 +74,12 @@ const oe = ({
68
74
  exit: t.daysExit,
69
75
  exitActive: t.daysExitActive
70
76
  },
71
- children: /* @__PURE__ */ n("div", { className: t.daysBody, children: x.map(E) })
77
+ children: /* @__PURE__ */ n("div", { className: t.daysBody, children: l.map(E) })
72
78
  },
73
79
  a.getTime()
74
80
  ) })
75
81
  ] });
76
82
  };
77
83
  export {
78
- oe as DaysTable
84
+ ce as DaysTable
79
85
  };
package/dist/popover/component.js CHANGED
@@ -1,107 +1,112 @@
1
- import { jsx as r, jsxs as _ } from "react/jsx-runtime";
2
- import { useRef as L, useLayoutEffect as $, useEffect as g, useMemo as j } from "react";
3
- import { useFloating as k, autoUpdate as D, offset as P, flip as U, shift as z, arrow as V } from "@floating-ui/react-dom";
4
- import { CSSTransition as q } from "react-transition-group";
5
- import c from "classnames";
6
- import { Portal as B } from "../portal/component.js";
7
- import { stackingOrder as G } from "../stack/context.js";
8
- import { Stack as H } from "../stack/component.js";
1
+ import { jsx as r, jsxs as $ } from "react/jsx-runtime";
2
+ import { useRef as N, useLayoutEffect as j, useEffect as R, useMemo as D, useCallback as P } from "react";
3
+ import { useFloating as U, autoUpdate as z, offset as V, flip as q, shift as B, arrow as G } from "@floating-ui/react-dom";
4
+ import { CSSTransition as H } from "react-transition-group";
5
+ import m from "classnames";
6
+ import { Portal as J } from "../portal/component.js";
7
+ import { stackingOrder as K } from "../stack/context.js";
8
+ import { Stack as Q } from "../stack/component.js";
9
9
  import e from "./index.module.css.js";
10
- const J = {
10
+ const W = {
11
11
  timeout: 150
12
- }, K = {
12
+ }, X = {
13
13
  enter: e.enter,
14
14
  enterActive: e.enterActive,
15
15
  exit: e.exit,
16
16
  exitActive: e.exitActive
17
- }, Q = {
17
+ }, Y = {
18
18
  top: "bottom",
19
19
  right: "left",
20
20
  bottom: "top",
21
21
  left: "right"
22
- }, st = ({
22
+ }, lt = ({
23
23
  children: f,
24
- getPortalContainer: N,
25
- transition: d = J,
26
- anchorElement: p,
27
- offset: n = [0, 0],
28
- withArrow: i = !1,
29
- withTransition: A = !0,
24
+ getPortalContainer: A,
25
+ transition: u = W,
26
+ anchorElement: d,
27
+ offset: a = [0, 0],
28
+ withArrow: s = !1,
29
+ withTransition: b = !0,
30
30
  position: y = "left",
31
- preventFlip: R,
32
- popperClassName: b,
33
- arrowClassName: E,
34
- className: O,
35
- open: u,
36
- dataTestId: T,
37
- update: a,
38
- transitionDuration: h = `${d.timeout}ms`,
39
- zIndex: w = G.POPOVER
31
+ preventFlip: E,
32
+ popperClassName: O,
33
+ arrowClassName: T,
34
+ className: h,
35
+ open: p,
36
+ dataTestId: C,
37
+ update: l,
38
+ transitionDuration: F = `${u.timeout}ms`,
39
+ zIndex: w = K.POPOVER
40
40
  }) => {
41
- const x = L(null), {
42
- refs: l,
43
- floatingStyles: C,
44
- middlewareData: m,
45
- placement: S,
41
+ const x = N(null), S = N(null), {
42
+ refs: i,
43
+ floatingStyles: I,
44
+ middlewareData: c,
45
+ placement: v,
46
46
  update: o
47
- } = k({
47
+ } = U({
48
48
  placement: y,
49
- whileElementsMounted: D,
49
+ whileElementsMounted: z,
50
50
  middleware: [
51
- P(
51
+ V(
52
52
  {
53
- crossAxis: n[0],
54
- mainAxis: n[1]
53
+ crossAxis: a[0],
54
+ mainAxis: a[1]
55
55
  },
56
- [n]
56
+ [a]
57
57
  ),
58
- ...R ? [] : [U()],
59
- z({ padding: 4 }),
60
- ...i ? [V({ element: x })] : []
58
+ ...E ? [] : [q()],
59
+ B({ padding: 4 }),
60
+ ...s ? [G({ element: x })] : []
61
61
  ]
62
62
  });
63
- $(() => {
64
- l.setReference(p);
65
- }, [p, l]), g(() => {
66
- a && o && (a.current = o);
67
- }, [o, a]), g(() => {
63
+ j(() => {
64
+ i.setReference(d);
65
+ }, [d, i]), R(() => {
66
+ l && o && (l.current = o);
67
+ }, [o, l]), R(() => {
68
68
  o();
69
69
  }, [o, f]);
70
- const F = j(() => {
71
- if (!i || !m.arrow)
70
+ const M = D(() => {
71
+ if (!s || !c.arrow)
72
72
  return {};
73
- const { x: t, y: s } = m.arrow, I = S.split("-")[0], M = Q[I] ?? "bottom";
73
+ const { x: t, y: n } = c.arrow, k = v.split("-")[0], L = Y[k] ?? "bottom";
74
74
  return {
75
75
  position: "absolute",
76
76
  left: t != null ? `${t}px` : void 0,
77
- top: s != null ? `${s}px` : void 0,
77
+ top: n != null ? `${n}px` : void 0,
78
78
  right: "",
79
79
  bottom: "",
80
- [M]: "-4px"
80
+ [L]: "-4px"
81
81
  };
82
- }, [i, m.arrow, S]), v = (t, s) => /* @__PURE__ */ r(
82
+ }, [s, c.arrow, v]), _ = P(
83
+ (t) => {
84
+ S.current = t, i.setFloating(t);
85
+ },
86
+ [i]
87
+ ), g = (t, n) => /* @__PURE__ */ r(
83
88
  "div",
84
89
  {
85
- ref: l.setFloating,
90
+ ref: _,
86
91
  style: {
87
92
  zIndex: t,
88
- ...C
93
+ ...I
89
94
  },
90
- className: c(e.component, O),
91
- children: /* @__PURE__ */ _(
95
+ className: m(e.component, h),
96
+ children: /* @__PURE__ */ $(
92
97
  "div",
93
98
  {
94
- "data-test-id": T,
95
- className: c(e.inner, b),
96
- style: s,
99
+ "data-test-id": C,
100
+ className: m(e.inner, O),
101
+ style: n,
97
102
  children: [
98
103
  f,
99
- i && /* @__PURE__ */ r(
104
+ s && /* @__PURE__ */ r(
100
105
  "div",
101
106
  {
102
107
  ref: x,
103
- style: F,
104
- className: c(e.arrow, E)
108
+ style: M,
109
+ className: m(e.arrow, T)
105
110
  }
106
111
  )
107
112
  ]
@@ -109,17 +114,18 @@ const J = {
109
114
  )
110
115
  }
111
116
  );
112
- return /* @__PURE__ */ r(H, { value: w, children: (t) => /* @__PURE__ */ r(B, { getPortalContainer: N, children: A ? /* @__PURE__ */ r(
113
- q,
117
+ return /* @__PURE__ */ r(Q, { value: w, children: (t) => /* @__PURE__ */ r(J, { getPortalContainer: A, children: b ? /* @__PURE__ */ r(
118
+ H,
114
119
  {
115
120
  unmountOnExit: !0,
116
- classNames: K,
117
- ...d,
118
- in: u,
119
- children: v(t, { transitionDuration: h })
121
+ classNames: X,
122
+ ...u,
123
+ in: p,
124
+ nodeRef: S,
125
+ children: g(t, { transitionDuration: F })
120
126
  }
121
- ) : u && v(t) }) });
127
+ ) : p && g(t) }) });
122
128
  };
123
129
  export {
124
- st as Popover
130
+ lt as Popover
125
131
  };
package/dist/toast/component.js CHANGED
@@ -1,99 +1,101 @@
1
1
  import { jsx as s } from "react/jsx-runtime";
2
- import { forwardRef as L, useRef as O, useCallback as i, useEffect as M } from "react";
3
- import $ from "react-merge-refs";
4
- import { CSSTransition as g } from "react-transition-group";
5
- import k from "classnames";
6
- import { useClickOutside as q } from "../hooks/useClickOutside/index.js";
7
- import { usePrevious as y } from "../hooks/usePrevious/index.js";
8
- import { Popover as z } from "../popover/component.js";
9
- import { Portal as B } from "../portal/component.js";
10
- import { ToastPlate as w } from "../toast-plate/component.js";
11
- import r from "./index.module.css.js";
12
- const F = {
13
- enter: r.enter,
14
- enterActive: r.enterActive,
15
- exit: r.exit,
16
- exitActive: r.exitActive
17
- }, D = L(
2
+ import { forwardRef as $, useRef as l, useCallback as i, useEffect as g } from "react";
3
+ import I from "react-merge-refs";
4
+ import { CSSTransition as q } from "react-transition-group";
5
+ import P from "classnames";
6
+ import { useClickOutside as y } from "../hooks/useClickOutside/index.js";
7
+ import { usePrevious as z } from "../hooks/usePrevious/index.js";
8
+ import { Popover as B } from "../popover/component.js";
9
+ import { Portal as F } from "../portal/component.js";
10
+ import { ToastPlate as _ } from "../toast-plate/component.js";
11
+ import e from "./index.module.css.js";
12
+ const G = {
13
+ enter: e.enter,
14
+ enterActive: e.enterActive,
15
+ exit: e.exit,
16
+ exitActive: e.exitActive
17
+ }, tt = $(
18
18
  ({
19
- anchorElement: a,
20
- position: I,
21
- offset: P,
22
- open: e,
23
- autoCloseDelay: l = 3e3,
24
- className: d,
25
- bottomOffset: T,
26
- style: x = {},
27
- block: v,
19
+ anchorElement: d,
20
+ position: E,
21
+ offset: b,
22
+ open: r,
23
+ autoCloseDelay: T = 3e3,
24
+ className: x,
25
+ bottomOffset: v,
26
+ style: S = {},
27
+ block: A,
28
28
  onMouseEnter: n,
29
29
  onMouseLeave: f,
30
30
  onTouchStart: u,
31
31
  onClose: o,
32
- getPortalContainer: S,
33
- ...A
34
- }, _) => {
35
- const h = O(null), p = O(0), N = y(e), c = i(() => {
36
- clearTimeout(p.current), p.current = window.setTimeout(o, l);
37
- }, [l, o]), t = i(() => {
32
+ getPortalContainer: R,
33
+ ...h
34
+ }, N) => {
35
+ const a = l(null), O = l(null), p = l(0), k = z(r), c = i(() => {
36
+ clearTimeout(p.current), p.current = window.setTimeout(o, T);
37
+ }, [T, o]), t = i(() => {
38
38
  clearTimeout(p.current);
39
- }, []), E = i(
39
+ }, []), j = i(
40
40
  (m) => {
41
41
  t(), n && n(m);
42
42
  },
43
43
  [n, t]
44
- ), b = i(
44
+ ), C = i(
45
45
  (m) => {
46
46
  c(), f && f(m);
47
47
  },
48
48
  [f, c]
49
- ), j = i(
49
+ ), L = i(
50
50
  (m) => {
51
51
  t(), u && u(m);
52
52
  },
53
53
  [u, t]
54
- ), C = i(() => {
54
+ ), M = i(() => {
55
55
  o(), t();
56
56
  }, [o, t]);
57
- q(h, C), M(() => (e !== N && e && c(), () => {
57
+ y(a, M), g(() => (r !== k && r && c(), () => {
58
58
  t();
59
- }), [e, N, c, t]);
60
- const R = {
61
- block: v,
59
+ }), [r, k, c, t]);
60
+ const w = {
61
+ block: A,
62
62
  onClose: o,
63
- onMouseEnter: E,
64
- onMouseLeave: b,
65
- onTouchStart: j,
66
- ref: $([_, h])
63
+ onMouseEnter: j,
64
+ onMouseLeave: C,
65
+ onTouchStart: L,
66
+ ref: I([N, a])
67
67
  };
68
- return a ? /* @__PURE__ */ s(
69
- z,
68
+ return d ? /* @__PURE__ */ s(
69
+ B,
70
70
  {
71
- open: e,
72
- anchorElement: a,
73
- position: I,
74
- offset: P,
75
- popperClassName: k(r.popover, { [r.block]: v }),
71
+ open: r,
72
+ anchorElement: d,
73
+ position: E,
74
+ offset: b,
75
+ popperClassName: P(e.popover, { [e.block]: A }),
76
76
  transition: { timeout: 150 },
77
- getPortalContainer: S,
78
- children: /* @__PURE__ */ s(w, { ...A, style: x, className: d, ...R })
77
+ getPortalContainer: R,
78
+ children: /* @__PURE__ */ s(_, { ...h, style: S, className: x, ...w })
79
79
  }
80
- ) : /* @__PURE__ */ s(B, { getPortalContainer: S, children: /* @__PURE__ */ s(
81
- g,
80
+ ) : /* @__PURE__ */ s(F, { getPortalContainer: R, children: /* @__PURE__ */ s(
81
+ q,
82
82
  {
83
83
  unmountOnExit: !0,
84
- in: e,
84
+ in: r,
85
85
  timeout: 150,
86
- classNames: F,
86
+ classNames: G,
87
+ nodeRef: O,
87
88
  children: /* @__PURE__ */ s(
88
- w,
89
+ _,
89
90
  {
90
- ...A,
91
- className: k(r.fixed, r.toastPlate, d),
91
+ ...h,
92
+ className: P(e.fixed, e.toastPlate, x),
92
93
  style: {
93
- ...x,
94
- bottom: T && `${T}px`
94
+ ...S,
95
+ bottom: v && `${v}px`
95
96
  },
96
- ...R
97
+ ...w,
98
+ ref: I([N, a, O])
97
99
  }
98
100
  )
99
101
  }
@@ -101,5 +103,5 @@ const F = {
101
103
  }
102
104
  );
103
105
  export {
104
- D as Toast
106
+ tt as Toast
105
107
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@alphakits/ui",
3
- "version": "2.3.0",
3
+ "version": "2.3.1",
4
4
  "files": [
5
5
  "dist"
6
6
  ],