@companix/uikit 0.1.42 → 0.1.43

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 (83) hide show
  1. package/dist/CounterInput/CounterInput.scss +29 -0
  2. package/dist/CounterInput/index.d.ts +14 -0
  3. package/dist/bundle.es.js +122 -120
  4. package/dist/bundle.es10.js +1 -1
  5. package/dist/bundle.es13.js +4 -4
  6. package/dist/bundle.es14.js +4 -4
  7. package/dist/bundle.es15.js +2 -2
  8. package/dist/bundle.es16.js +1 -1
  9. package/dist/bundle.es17.js +1 -1
  10. package/dist/bundle.es18.js +105 -19
  11. package/dist/bundle.es19.js +21 -34
  12. package/dist/bundle.es20.js +33 -24
  13. package/dist/bundle.es21.js +24 -45
  14. package/dist/bundle.es22.js +46 -26
  15. package/dist/bundle.es23.js +24 -259
  16. package/dist/bundle.es24.js +260 -13
  17. package/dist/bundle.es25.js +14 -21
  18. package/dist/bundle.es26.js +20 -37
  19. package/dist/bundle.es27.js +38 -21
  20. package/dist/bundle.es28.js +20 -18
  21. package/dist/bundle.es29.js +18 -21
  22. package/dist/bundle.es30.js +21 -43
  23. package/dist/bundle.es31.js +37 -114
  24. package/dist/bundle.es32.js +119 -72
  25. package/dist/bundle.es33.js +68 -38
  26. package/dist/bundle.es34.js +42 -10
  27. package/dist/bundle.es35.js +11 -85
  28. package/dist/bundle.es36.js +85 -19
  29. package/dist/bundle.es37.js +20 -7
  30. package/dist/bundle.es38.js +7 -3
  31. package/dist/bundle.es39.js +3 -23
  32. package/dist/bundle.es40.js +16 -45
  33. package/dist/bundle.es41.js +51 -56
  34. package/dist/bundle.es42.js +57 -162
  35. package/dist/bundle.es43.js +160 -79
  36. package/dist/bundle.es44.js +81 -7
  37. package/dist/bundle.es45.js +7 -59
  38. package/dist/bundle.es46.js +58 -33
  39. package/dist/bundle.es47.js +33 -20
  40. package/dist/bundle.es48.js +19 -47
  41. package/dist/bundle.es49.js +49 -11
  42. package/dist/bundle.es50.js +11 -13
  43. package/dist/bundle.es51.js +13 -13
  44. package/dist/bundle.es52.js +13 -30
  45. package/dist/bundle.es53.js +30 -11
  46. package/dist/bundle.es54.js +10 -25
  47. package/dist/bundle.es55.js +17 -29
  48. package/dist/bundle.es56.js +36 -48
  49. package/dist/bundle.es57.js +49 -55
  50. package/dist/bundle.es58.js +56 -8
  51. package/dist/bundle.es59.js +8 -26
  52. package/dist/bundle.es60.js +27 -5
  53. package/dist/bundle.es61.js +5 -66
  54. package/dist/bundle.es62.js +66 -23
  55. package/dist/bundle.es63.js +22 -23
  56. package/dist/bundle.es64.js +24 -90
  57. package/dist/bundle.es65.js +90 -18
  58. package/dist/bundle.es66.js +17 -93
  59. package/dist/bundle.es67.js +93 -73
  60. package/dist/bundle.es68.js +73 -23
  61. package/dist/bundle.es69.js +20 -35
  62. package/dist/bundle.es70.js +39 -24
  63. package/dist/bundle.es71.js +24 -79
  64. package/dist/bundle.es72.js +71 -85
  65. package/dist/bundle.es73.js +93 -10
  66. package/dist/bundle.es74.js +10 -6
  67. package/dist/bundle.es75.js +5 -69
  68. package/dist/bundle.es76.js +68 -10
  69. package/dist/bundle.es77.js +11 -42
  70. package/dist/bundle.es78.js +42 -32
  71. package/dist/bundle.es79.js +31 -64
  72. package/dist/bundle.es80.js +65 -40
  73. package/dist/bundle.es81.js +40 -14
  74. package/dist/bundle.es82.js +15 -32
  75. package/dist/bundle.es83.js +23 -61
  76. package/dist/bundle.es84.js +69 -13
  77. package/dist/bundle.es85.js +13 -74
  78. package/dist/bundle.es86.js +71 -45
  79. package/dist/bundle.es87.js +48 -13
  80. package/dist/bundle.es88.js +16 -0
  81. package/dist/index.d.ts +2 -0
  82. package/dist/index.scss +1 -0
  83. package/package.json +1 -1
@@ -1,7 +1,29 @@
1
- import { useEffect as r } from "react";
2
- const n = ({ callback: e }) => (r(() => () => {
3
- e?.();
4
- }, []), null);
1
+ import { jsx as u } from "react/jsx-runtime";
2
+ import { createContext as a, useContext as l, useState as i, useMemo as p } from "react";
3
+ const V = (o) => {
4
+ const e = a({
5
+ value: o,
6
+ setValue: () => {
7
+ }
8
+ }), r = { setValue: () => {
9
+ } };
10
+ return [({ initialValue: t, children: s }) => {
11
+ const [v, n] = i(t ?? o);
12
+ return p(() => {
13
+ r.setValue = n;
14
+ }, []), /* @__PURE__ */ u(e.Provider, { value: { value: v, setValue: n }, children: s });
15
+ }, () => {
16
+ const { value: t, setValue: s } = l(e);
17
+ return [t, s];
18
+ }, (t) => r.setValue(t)];
19
+ }, P = (o) => {
20
+ const e = a(o);
21
+ return [
22
+ ({ value: r, children: c }) => /* @__PURE__ */ u(e.Provider, { value: r, children: c }),
23
+ () => l(e)
24
+ ];
25
+ };
5
26
  export {
6
- n as RemoveListener
27
+ V as createScope,
28
+ P as createStaticScope
7
29
  };
@@ -1,68 +1,7 @@
1
- import { useMemo as i, useCallback as f } from "react";
2
- const D = (e, t) => e.getDate() === t.getDate() && e.getMonth() === t.getMonth() && e.getFullYear() === t.getFullYear(), l = 1, y = (e, { weekStartsOn: t = l }) => {
3
- const n = new Date(e), s = n.getDay(), r = (s < t ? 7 : 0) + s - t;
4
- return n.setDate(n.getDate() - r), n.setHours(0, 0, 0, 0), n;
5
- }, F = (e, { weekStartsOn: t = l }) => {
6
- const n = new Date(e), s = n.getDay(), r = (s < t ? -7 : 0) + 6 - (s - t);
7
- return n.setDate(n.getDate() + r), n.setHours(23, 59, 59, 999), n;
8
- }, h = (e) => {
9
- const t = new Date(e);
10
- return t.setHours(0, 0, 0, 0), t;
11
- }, M = (e) => {
12
- const t = new Date(e);
13
- return t.setHours(23, 59, 59, 999), t;
14
- };
15
- function g(e, t = {}) {
16
- const { min: n, max: s, withTime: r = !1 } = t;
17
- return !r && (n && D(e, n) || s && D(e, s)) ? !1 : !!(n && e < n || s && e > s);
18
- }
19
- const m = (e, t) => {
20
- const n = new Date(e);
21
- if (!t)
22
- return n;
23
- const s = n.getDate(), r = new Date(e);
24
- r.setMonth(n.getMonth() + t + 1, 0);
25
- const a = r.getDate();
26
- return s >= a ? r : (n.setFullYear(r.getFullYear(), r.getMonth(), s), n);
27
- }, Y = (e, t) => m(e, -t), w = (e) => {
28
- const t = new Date(e), n = new Date(t);
29
- return n.setFullYear(t.getFullYear(), t.getMonth() + 1, 0), n.setHours(0, 0, 0, 0), n.getDate();
30
- }, x = (e, t) => {
31
- const n = new Date(e);
32
- return n.setFullYear(t), n;
33
- }, H = (e, t) => {
34
- const n = new Date(e), s = n.getFullYear(), r = n.getDate(), a = new Date(e);
35
- a.setFullYear(s, t, 15), a.setHours(0, 0, 0, 0);
36
- const o = w(a);
37
- return n.setMonth(t, Math.min(r, o)), n;
38
- }, b = (e) => {
39
- const { disableFuture: t, disablePast: n, maxDateTime: s, minDateTime: r, shouldDisableDate: a } = e;
40
- return (o, c) => {
41
- const u = /* @__PURE__ */ new Date();
42
- return a ? a(o) : t ? h(o) > u : n ? M(o) < u : r || s ? g(o, { min: r, max: s, withTime: c }) : !1;
43
- };
44
- }, O = (e) => {
45
- const t = i(() => b(e), [
46
- e.disableFuture,
47
- e.disablePast,
48
- e.shouldDisableDate,
49
- e.minDateTime,
50
- e.maxDateTime
51
- ]);
52
- return f(t, [t]);
53
- };
1
+ import { useEffect as r } from "react";
2
+ const n = ({ callback: e }) => (r(() => () => {
3
+ e?.();
4
+ }, []), null);
54
5
  export {
55
- l as MONDAY,
56
- m as addMonths,
57
- b as createDayDisableChecker,
58
- M as endOfDay,
59
- F as endOfWeek,
60
- g as isDayMinMaxRestricted,
61
- D as isSameDate,
62
- H as setMonth,
63
- x as setYear,
64
- h as startOfDay,
65
- y as startOfWeek,
66
- Y as subMonths,
67
- O as useDayDisableCheker
6
+ n as RemoveListener
68
7
  };
@@ -1,25 +1,68 @@
1
- import { useState as u, useEffect as d } from "react";
2
- const v = ({ baseId: r, value: e, containerRef: o }) => {
3
- const [l, n] = u({});
4
- return d(() => {
5
- const t = { observer: null };
6
- if (o.current) {
7
- const c = `#${h(r, e)}`, s = o.current.querySelector(c);
8
- s != null ? (t.observer = new ResizeObserver(() => {
9
- const { clientHeight: i, clientWidth: a, offsetLeft: f, offsetTop: b } = s;
10
- n({
11
- width: a,
12
- height: i,
13
- transform: `translateX(${Math.floor(f)}px) translateY(${Math.floor(b)}px)`
14
- });
15
- }), t.observer.observe(s)) : n({ display: "none" });
16
- }
17
- return () => {
18
- t.observer && t.observer.disconnect();
19
- };
20
- }, [e]), l;
21
- }, h = (r, e) => `uikit-tab-${r}-trigger-${e}`;
1
+ import { useMemo as i, useCallback as f } from "react";
2
+ const D = (e, t) => e.getDate() === t.getDate() && e.getMonth() === t.getMonth() && e.getFullYear() === t.getFullYear(), l = 1, y = (e, { weekStartsOn: t = l }) => {
3
+ const n = new Date(e), s = n.getDay(), r = (s < t ? 7 : 0) + s - t;
4
+ return n.setDate(n.getDate() - r), n.setHours(0, 0, 0, 0), n;
5
+ }, F = (e, { weekStartsOn: t = l }) => {
6
+ const n = new Date(e), s = n.getDay(), r = (s < t ? -7 : 0) + 6 - (s - t);
7
+ return n.setDate(n.getDate() + r), n.setHours(23, 59, 59, 999), n;
8
+ }, h = (e) => {
9
+ const t = new Date(e);
10
+ return t.setHours(0, 0, 0, 0), t;
11
+ }, M = (e) => {
12
+ const t = new Date(e);
13
+ return t.setHours(23, 59, 59, 999), t;
14
+ };
15
+ function g(e, t = {}) {
16
+ const { min: n, max: s, withTime: r = !1 } = t;
17
+ return !r && (n && D(e, n) || s && D(e, s)) ? !1 : !!(n && e < n || s && e > s);
18
+ }
19
+ const m = (e, t) => {
20
+ const n = new Date(e);
21
+ if (!t)
22
+ return n;
23
+ const s = n.getDate(), r = new Date(e);
24
+ r.setMonth(n.getMonth() + t + 1, 0);
25
+ const a = r.getDate();
26
+ return s >= a ? r : (n.setFullYear(r.getFullYear(), r.getMonth(), s), n);
27
+ }, Y = (e, t) => m(e, -t), w = (e) => {
28
+ const t = new Date(e), n = new Date(t);
29
+ return n.setFullYear(t.getFullYear(), t.getMonth() + 1, 0), n.setHours(0, 0, 0, 0), n.getDate();
30
+ }, x = (e, t) => {
31
+ const n = new Date(e);
32
+ return n.setFullYear(t), n;
33
+ }, H = (e, t) => {
34
+ const n = new Date(e), s = n.getFullYear(), r = n.getDate(), a = new Date(e);
35
+ a.setFullYear(s, t, 15), a.setHours(0, 0, 0, 0);
36
+ const o = w(a);
37
+ return n.setMonth(t, Math.min(r, o)), n;
38
+ }, b = (e) => {
39
+ const { disableFuture: t, disablePast: n, maxDateTime: s, minDateTime: r, shouldDisableDate: a } = e;
40
+ return (o, c) => {
41
+ const u = /* @__PURE__ */ new Date();
42
+ return a ? a(o) : t ? h(o) > u : n ? M(o) < u : r || s ? g(o, { min: r, max: s, withTime: c }) : !1;
43
+ };
44
+ }, O = (e) => {
45
+ const t = i(() => b(e), [
46
+ e.disableFuture,
47
+ e.disablePast,
48
+ e.shouldDisableDate,
49
+ e.minDateTime,
50
+ e.maxDateTime
51
+ ]);
52
+ return f(t, [t]);
53
+ };
22
54
  export {
23
- h as makeTabId,
24
- v as useTabSlider
55
+ l as MONDAY,
56
+ m as addMonths,
57
+ b as createDayDisableChecker,
58
+ M as endOfDay,
59
+ F as endOfWeek,
60
+ g as isDayMinMaxRestricted,
61
+ D as isSameDate,
62
+ H as setMonth,
63
+ x as setYear,
64
+ h as startOfDay,
65
+ y as startOfWeek,
66
+ Y as subMonths,
67
+ O as useDayDisableCheker
25
68
  };
@@ -1,26 +1,25 @@
1
- import { useRef as s, useCallback as c } from "react";
2
- const p = () => {
3
- const t = s(null), r = s({ cb: null }), i = c(() => {
4
- if (t.current && t.current.parentElement) {
5
- const e = t.current.parentElement, u = e.style.getPropertyValue("--radix-popper-anchor-width"), n = e.style.getPropertyValue("transform"), o = new MutationObserver(() => {
6
- e.style.transform !== n && e.style.setProperty("transform", n);
7
- });
8
- o.observe(e, {
9
- attributes: !0,
10
- attributeFilter: ["style"]
11
- }), r.current.cb = () => {
12
- o.disconnect();
13
- }, t.current.style.setProperty("--radix-popover-trigger-width", u);
1
+ import { useState as u, useEffect as d } from "react";
2
+ const v = ({ baseId: r, value: e, containerRef: o }) => {
3
+ const [l, n] = u({});
4
+ return d(() => {
5
+ const t = { observer: null };
6
+ if (o.current) {
7
+ const c = `#${h(r, e)}`, s = o.current.querySelector(c);
8
+ s != null ? (t.observer = new ResizeObserver(() => {
9
+ const { clientHeight: i, clientWidth: a, offsetLeft: f, offsetTop: b } = s;
10
+ n({
11
+ width: a,
12
+ height: i,
13
+ transform: `translateX(${Math.floor(f)}px) translateY(${Math.floor(b)}px)`
14
+ });
15
+ }), t.observer.observe(s)) : n({ display: "none" });
14
16
  }
15
- }, []), l = c(() => {
16
- r.current.cb && (r.current.cb(), r.current.cb = null);
17
- }, []);
18
- return {
19
- popoverRef: t,
20
- handleAnimationEnd: l,
21
- froozePopoverPosition: i
22
- };
23
- };
17
+ return () => {
18
+ t.observer && t.observer.disconnect();
19
+ };
20
+ }, [e]), l;
21
+ }, h = (r, e) => `uikit-tab-${r}-trigger-${e}`;
24
22
  export {
25
- p as useFroozeClosing
23
+ h as makeTabId,
24
+ v as useTabSlider
26
25
  };
@@ -1,92 +1,26 @@
1
- import { jsxs as o, jsx as n } from "react/jsx-runtime";
2
- import y from "classnames";
3
- import { attr as s } from "@companix/utils-browser";
4
- import { forwardRef as D, useRef as S, useCallback as T } from "react";
5
- import { VisuallyHidden as j } from "@radix-ui/react-visually-hidden";
6
- import { mergeRefs as z } from "react-merge-refs";
7
- import { SelectRightElements as B } from "./bundle.es76.js";
8
- const G = D(
9
- ({
10
- required: a,
11
- size: i,
12
- fill: u,
13
- leftElement: l,
14
- className: d,
15
- value: c,
16
- clearButton: m,
17
- placeholder: p,
18
- clearButtonIcon: f,
19
- customElement: h,
20
- disabled: r,
21
- onClear: C,
22
- inputRef: I,
23
- onClick: N,
24
- ...k
25
- }, v) => {
26
- const e = S(null), F = T(
27
- (t) => {
28
- if (!e.current || !document)
29
- return;
30
- t.target !== e.current && (e.current.click(), document.activeElement !== e.current && e.current.focus());
31
- },
32
- [e]
33
- ), g = (t) => {
34
- document && document.activeElement === e.current && t.preventDefault();
35
- }, R = (t) => {
36
- r || F(t);
37
- }, x = (t) => {
38
- g(t);
39
- }, A = (t) => {
40
- e.current && e.current.focus(), C?.(t);
41
- };
42
- return /* @__PURE__ */ o(
43
- "div",
44
- {
45
- ref: v,
46
- className: y("form select", d),
47
- "data-size": i ?? "md",
48
- "data-fill": s(u),
49
- "data-required": s(a),
50
- "data-disabled": s(r),
51
- onMouseDown: x,
52
- onClick: R,
53
- ...k,
54
- children: [
55
- /* @__PURE__ */ o("div", { className: "select-layout form-input", children: [
56
- l && /* @__PURE__ */ n("div", { className: "select-element", children: l }),
57
- /* @__PURE__ */ n("div", { className: "select-content", children: /* @__PURE__ */ o("div", { className: "select-content-text", "aria-disabled": r, children: [
58
- !c && /* @__PURE__ */ n("span", { className: "select-placeholder", children: p }),
59
- c
60
- ] }) }),
61
- /* @__PURE__ */ n("div", { className: "select-element", children: /* @__PURE__ */ n(
62
- B,
63
- {
64
- customElement: h,
65
- clearButton: m,
66
- value: !!c,
67
- clearButtonIcon: f,
68
- onClear: A
69
- }
70
- ) })
71
- ] }),
72
- /* @__PURE__ */ n(j, { asChild: !0, children: /* @__PURE__ */ n(
73
- "input",
74
- {
75
- ref: z([I, e]),
76
- autoComplete: "off",
77
- autoCapitalize: "none",
78
- autoCorrect: "off",
79
- spellCheck: "false",
80
- "aria-autocomplete": "none",
81
- onClick: N,
82
- readOnly: !0
83
- }
84
- ) })
85
- ]
86
- }
87
- );
88
- }
89
- );
1
+ import { useRef as s, useCallback as c } from "react";
2
+ const p = () => {
3
+ const t = s(null), r = s({ cb: null }), i = c(() => {
4
+ if (t.current && t.current.parentElement) {
5
+ const e = t.current.parentElement, u = e.style.getPropertyValue("--radix-popper-anchor-width"), n = e.style.getPropertyValue("transform"), o = new MutationObserver(() => {
6
+ e.style.transform !== n && e.style.setProperty("transform", n);
7
+ });
8
+ o.observe(e, {
9
+ attributes: !0,
10
+ attributeFilter: ["style"]
11
+ }), r.current.cb = () => {
12
+ o.disconnect();
13
+ }, t.current.style.setProperty("--radix-popover-trigger-width", u);
14
+ }
15
+ }, []), l = c(() => {
16
+ r.current.cb && (r.current.cb(), r.current.cb = null);
17
+ }, []);
18
+ return {
19
+ popoverRef: t,
20
+ handleAnimationEnd: l,
21
+ froozePopoverPosition: i
22
+ };
23
+ };
90
24
  export {
91
- G as SelectInput
25
+ p as useFroozeClosing
92
26
  };
@@ -1,20 +1,92 @@
1
- import { useRef as u, useCallback as T } from "react";
2
- const g = () => {
3
- const l = u(null), t = u(null);
4
- return { scrollToElement: T(
5
- (r, f) => {
6
- const o = l.current, s = t.current;
7
- if (!o || !s || r < 0 || r > s.children.length)
8
- return;
9
- const c = s.children[r];
10
- if (!c)
11
- return;
12
- const n = o.offsetHeight, i = o.scrollTop, e = c.offsetTop, p = c.offsetHeight;
13
- f === "center" ? o.scrollTop = e - n / 2 + p / 2 : f === "top" ? o.scrollTop = e : e + p > n + i ? o.scrollTop = e - n + p : e < i && (o.scrollTop = e);
14
- },
15
- [t, l]
16
- ), scrollBoxRef: l, optionsWrapperRef: t };
17
- };
1
+ import { jsxs as o, jsx as n } from "react/jsx-runtime";
2
+ import y from "classnames";
3
+ import { attr as s } from "@companix/utils-browser";
4
+ import { forwardRef as D, useRef as S, useCallback as T } from "react";
5
+ import { VisuallyHidden as j } from "@radix-ui/react-visually-hidden";
6
+ import { mergeRefs as z } from "react-merge-refs";
7
+ import { SelectRightElements as B } from "./bundle.es77.js";
8
+ const G = D(
9
+ ({
10
+ required: a,
11
+ size: i,
12
+ fill: u,
13
+ leftElement: l,
14
+ className: d,
15
+ value: c,
16
+ clearButton: m,
17
+ placeholder: p,
18
+ clearButtonIcon: f,
19
+ customElement: h,
20
+ disabled: r,
21
+ onClear: C,
22
+ inputRef: I,
23
+ onClick: N,
24
+ ...k
25
+ }, v) => {
26
+ const e = S(null), F = T(
27
+ (t) => {
28
+ if (!e.current || !document)
29
+ return;
30
+ t.target !== e.current && (e.current.click(), document.activeElement !== e.current && e.current.focus());
31
+ },
32
+ [e]
33
+ ), g = (t) => {
34
+ document && document.activeElement === e.current && t.preventDefault();
35
+ }, R = (t) => {
36
+ r || F(t);
37
+ }, x = (t) => {
38
+ g(t);
39
+ }, A = (t) => {
40
+ e.current && e.current.focus(), C?.(t);
41
+ };
42
+ return /* @__PURE__ */ o(
43
+ "div",
44
+ {
45
+ ref: v,
46
+ className: y("form select", d),
47
+ "data-size": i ?? "md",
48
+ "data-fill": s(u),
49
+ "data-required": s(a),
50
+ "data-disabled": s(r),
51
+ onMouseDown: x,
52
+ onClick: R,
53
+ ...k,
54
+ children: [
55
+ /* @__PURE__ */ o("div", { className: "select-layout form-input", children: [
56
+ l && /* @__PURE__ */ n("div", { className: "select-element", children: l }),
57
+ /* @__PURE__ */ n("div", { className: "select-content", children: /* @__PURE__ */ o("div", { className: "select-content-text", "aria-disabled": r, children: [
58
+ !c && /* @__PURE__ */ n("span", { className: "select-placeholder", children: p }),
59
+ c
60
+ ] }) }),
61
+ /* @__PURE__ */ n("div", { className: "select-element", children: /* @__PURE__ */ n(
62
+ B,
63
+ {
64
+ customElement: h,
65
+ clearButton: m,
66
+ value: !!c,
67
+ clearButtonIcon: f,
68
+ onClear: A
69
+ }
70
+ ) })
71
+ ] }),
72
+ /* @__PURE__ */ n(j, { asChild: !0, children: /* @__PURE__ */ n(
73
+ "input",
74
+ {
75
+ ref: z([I, e]),
76
+ autoComplete: "off",
77
+ autoCapitalize: "none",
78
+ autoCorrect: "off",
79
+ spellCheck: "false",
80
+ "aria-autocomplete": "none",
81
+ onClick: N,
82
+ readOnly: !0
83
+ }
84
+ ) })
85
+ ]
86
+ }
87
+ );
88
+ }
89
+ );
18
90
  export {
19
- g as useScrollListController
91
+ G as SelectInput
20
92
  };
@@ -1,96 +1,20 @@
1
- import { jsx as i, jsxs as y } from "react/jsx-runtime";
2
- import { useMemo as P, useEffect as C } from "react";
3
- import { Spinner as T } from "./bundle.es7.js";
4
- import { OptionItem as L } from "./bundle.es16.js";
5
- import { OptionsList as R } from "./bundle.es18.js";
6
- import { Icon as S } from "./bundle.es36.js";
7
- import { faPlus as b } from "@companix/icons-solid";
8
- const I = () => ({ isLoading: !1, options: [] }), N = (e) => {
9
- const { onOptionsLoaded: n, useOptions: s = I, options: o } = e, t = s();
10
- return C(() => {
11
- t.options.length > 0 && n?.(t.options);
12
- }, [t.options]), o ? { options: o, isLoading: !1 } : t;
13
- }, M = (e) => {
14
- const {
15
- isActive: n,
16
- emptyText: s,
17
- isLoading: o,
18
- scrollboxRef: t,
19
- optionsWrapperRef: d,
20
- addOption: p,
21
- onOpened: f,
22
- onSelect: O,
23
- minimalOptions: u,
24
- filterOptions: r,
25
- disableFiltering: l,
26
- close: c,
27
- ...m
28
- } = e, { emptyText: x, options: a, isLoading: g } = N(m), v = P(() => r && !l ? a.filter(r) : a, [a, r, l]);
29
- return g ?? o ? /* @__PURE__ */ i("div", { className: "select-popover-loading", children: /* @__PURE__ */ i(T, { size: 24 }) }) : /* @__PURE__ */ i(
30
- j,
31
- {
32
- options: v,
33
- isActive: n,
34
- emptyText: x ?? s,
35
- scrollboxRef: t,
36
- optionsWrapperRef: d,
37
- minimalOptions: u,
38
- addOption: p,
39
- onOpened: f,
40
- onSelect: O,
41
- close: c
42
- }
43
- );
44
- }, j = (e) => {
45
- const {
46
- isActive: n,
47
- onOpened: s,
48
- addOption: o,
49
- scrollboxRef: t,
50
- optionsWrapperRef: d,
51
- options: p,
52
- onSelect: f,
53
- minimalOptions: O,
54
- emptyText: u = "Ничего не найдено",
55
- close: r
56
- } = e;
57
- C(() => {
58
- s?.(p.findIndex(({ value: c }) => n(c)));
59
- }, []);
60
- const l = o ? /* @__PURE__ */ i(
61
- L,
62
- {
63
- className: "select-add-option",
64
- icon: /* @__PURE__ */ i(S, { icon: b }),
65
- title: o.text,
66
- onClick: o.onClick,
67
- onClickCapture: () => {
68
- o.closeOnClick && r();
69
- }
70
- }
71
- ) : void 0;
72
- return /* @__PURE__ */ y(R, { scrollboxRef: t, optionsWrapperRef: d, maxHeight: 300, children: [
73
- (o?.position === void 0 || o?.position === "first") && l,
74
- p.length === 0 && !o && /* @__PURE__ */ i("div", { className: "select-tags-noneresults", children: u }),
75
- p.map(({ title: c, value: m, className: x, icon: a, disabled: g, indicator: v, label: h }, k) => /* @__PURE__ */ i(
76
- L,
77
- {
78
- active: n(m),
79
- onClick: () => f?.(m),
80
- minimal: O,
81
- disabled: g,
82
- className: x,
83
- title: c,
84
- label: h,
85
- indicator: v,
86
- icon: a
87
- },
88
- `select-option-${k}`
89
- )),
90
- o?.position === "last" && l
91
- ] });
1
+ import { useRef as u, useCallback as T } from "react";
2
+ const g = () => {
3
+ const l = u(null), t = u(null);
4
+ return { scrollToElement: T(
5
+ (r, f) => {
6
+ const o = l.current, s = t.current;
7
+ if (!o || !s || r < 0 || r > s.children.length)
8
+ return;
9
+ const c = s.children[r];
10
+ if (!c)
11
+ return;
12
+ const n = o.offsetHeight, i = o.scrollTop, e = c.offsetTop, p = c.offsetHeight;
13
+ f === "center" ? o.scrollTop = e - n / 2 + p / 2 : f === "top" ? o.scrollTop = e : e + p > n + i ? o.scrollTop = e - n + p : e < i && (o.scrollTop = e);
14
+ },
15
+ [t, l]
16
+ ), scrollBoxRef: l, optionsWrapperRef: t };
92
17
  };
93
18
  export {
94
- M as OptionsPopover,
95
- j as SelectOptionsList
19
+ g as useScrollListController
96
20
  };