@companix/uikit 0.0.67 → 0.0.69
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.
- package/dist/Input/Input.d.ts +1 -1
- package/dist/Input/InputElement.d.ts +1 -1
- package/dist/Select/OptionsPopover.d.ts +1 -0
- package/dist/bundle.es12.js +6 -5
- package/dist/bundle.es13.js +1 -0
- package/dist/bundle.es48.js +24 -22
- package/dist/bundle.es50.js +56 -50
- package/package.json +1 -1
package/dist/Input/Input.d.ts
CHANGED
|
@@ -9,6 +9,6 @@ export interface InputProps extends Omit<InputContainerProps, 'inputRef' | 'chil
|
|
|
9
9
|
inputClassName?: string;
|
|
10
10
|
inputType?: React.HTMLInputTypeAttribute;
|
|
11
11
|
mask?: string;
|
|
12
|
-
maskChar?: string;
|
|
12
|
+
maskChar?: string | null;
|
|
13
13
|
}
|
|
14
14
|
export declare const Input: import('react').ForwardRefExoticComponent<InputProps & import('react').RefAttributes<HTMLDivElement>>;
|
|
@@ -2,7 +2,7 @@ interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, '
|
|
|
2
2
|
defaultValue?: string;
|
|
3
3
|
value?: string;
|
|
4
4
|
mask?: string;
|
|
5
|
-
maskChar?: string;
|
|
5
|
+
maskChar?: string | null;
|
|
6
6
|
onValueChange?: (value: string, targetElement: HTMLInputElement) => void;
|
|
7
7
|
}
|
|
8
8
|
export declare const InputElement: import('react').ForwardRefExoticComponent<InputProps & import('react').RefAttributes<HTMLInputElement>>;
|
|
@@ -31,6 +31,7 @@ interface InternalListProps<T> extends SelectOptionsPopoverParams {
|
|
|
31
31
|
options: Option<T>[];
|
|
32
32
|
scrollboxRef?: React.RefObject<HTMLDivElement>;
|
|
33
33
|
optionsWrapperRef?: React.RefObject<HTMLDivElement>;
|
|
34
|
+
close: () => void;
|
|
34
35
|
isActive: (value: T) => boolean;
|
|
35
36
|
onSelect?: (value: T) => void;
|
|
36
37
|
onOpened?: (activeIndex: number) => void;
|
package/dist/bundle.es12.js
CHANGED
|
@@ -35,9 +35,9 @@ const Z = (t) => {
|
|
|
35
35
|
r.current[e.value] = e;
|
|
36
36
|
});
|
|
37
37
|
}, [t.options, t.defaultOptions]);
|
|
38
|
-
const x = n === null ? null : r.current[n] ?? null, { popoverRef: z, froozePopoverPosition: B, handleAnimationEnd: F } = w(), { scrollToElement:
|
|
38
|
+
const x = n === null ? null : r.current[n] ?? null, { popoverRef: z, froozePopoverPosition: B, handleAnimationEnd: F } = w(), { scrollToElement: p, optionsWrapperRef: I, scrollBoxRef: T } = M();
|
|
39
39
|
k(m, () => ({
|
|
40
|
-
scrollTo: (o) =>
|
|
40
|
+
scrollTo: (o) => p(o, "top")
|
|
41
41
|
}));
|
|
42
42
|
const b = (o, e) => {
|
|
43
43
|
B(), i(o), e();
|
|
@@ -59,14 +59,15 @@ const Z = (t) => {
|
|
|
59
59
|
N,
|
|
60
60
|
{
|
|
61
61
|
...S,
|
|
62
|
+
close: o,
|
|
62
63
|
isActive: (e) => e === n,
|
|
63
64
|
onSelect: (e) => b(e, o),
|
|
64
65
|
scrollboxRef: T,
|
|
65
66
|
optionsWrapperRef: I,
|
|
66
|
-
onOpened: (e) =>
|
|
67
|
+
onOpened: (e) => p(e, "center"),
|
|
67
68
|
onOptionsLoaded: (e) => {
|
|
68
|
-
e.forEach((
|
|
69
|
-
r.current[
|
|
69
|
+
e.forEach((c) => {
|
|
70
|
+
r.current[c.value] = c;
|
|
70
71
|
});
|
|
71
72
|
}
|
|
72
73
|
}
|
package/dist/bundle.es13.js
CHANGED
package/dist/bundle.es48.js
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import { jsxs as o, jsx as n } from "react/jsx-runtime";
|
|
2
|
-
import
|
|
2
|
+
import w from "classnames";
|
|
3
3
|
import { attr as s } from "@companix/utils-browser";
|
|
4
|
-
import { forwardRef as
|
|
5
|
-
import { VisuallyHidden as
|
|
6
|
-
import { mergeRefs as
|
|
7
|
-
import { SelectRightElements as
|
|
8
|
-
const
|
|
4
|
+
import { forwardRef as y, useRef as D, useCallback as S } from "react";
|
|
5
|
+
import { VisuallyHidden as T } from "@radix-ui/react-visually-hidden";
|
|
6
|
+
import { mergeRefs as j } from "react-merge-refs";
|
|
7
|
+
import { SelectRightElements as z } from "./bundle.es59.js";
|
|
8
|
+
const W = y(
|
|
9
9
|
({
|
|
10
10
|
required: a,
|
|
11
11
|
size: i,
|
|
@@ -19,35 +19,37 @@ const V = w(
|
|
|
19
19
|
disabled: r,
|
|
20
20
|
onClear: h,
|
|
21
21
|
inputRef: C,
|
|
22
|
-
onClick: I
|
|
23
|
-
|
|
24
|
-
|
|
22
|
+
onClick: I,
|
|
23
|
+
...N
|
|
24
|
+
}, k) => {
|
|
25
|
+
const e = D(null), v = S(
|
|
25
26
|
(t) => {
|
|
26
27
|
if (!e.current || !document)
|
|
27
28
|
return;
|
|
28
29
|
t.target !== e.current && (e.current.click(), document.activeElement !== e.current && e.current.focus());
|
|
29
30
|
},
|
|
30
31
|
[e]
|
|
31
|
-
),
|
|
32
|
+
), F = (t) => {
|
|
32
33
|
document && document.activeElement === e.current && t.preventDefault();
|
|
33
|
-
}, F = (t) => {
|
|
34
|
-
r || k(t);
|
|
35
34
|
}, g = (t) => {
|
|
36
|
-
v(t);
|
|
35
|
+
r || v(t);
|
|
37
36
|
}, R = (t) => {
|
|
37
|
+
F(t);
|
|
38
|
+
}, x = (t) => {
|
|
38
39
|
e.current && e.current.focus(), h?.(t);
|
|
39
40
|
};
|
|
40
41
|
return /* @__PURE__ */ o(
|
|
41
42
|
"div",
|
|
42
43
|
{
|
|
43
|
-
ref:
|
|
44
|
-
className:
|
|
44
|
+
ref: k,
|
|
45
|
+
className: w("form select", d),
|
|
45
46
|
"data-size": i ?? "md",
|
|
46
47
|
"data-fill": s(u),
|
|
47
48
|
"data-required": s(a),
|
|
48
49
|
"data-disabled": s(r),
|
|
49
|
-
onMouseDown:
|
|
50
|
-
onClick:
|
|
50
|
+
onMouseDown: R,
|
|
51
|
+
onClick: g,
|
|
52
|
+
...N,
|
|
51
53
|
children: [
|
|
52
54
|
/* @__PURE__ */ o("div", { className: "select-layout form-input", children: [
|
|
53
55
|
l && /* @__PURE__ */ n("div", { className: "select-element", children: l }),
|
|
@@ -56,19 +58,19 @@ const V = w(
|
|
|
56
58
|
c
|
|
57
59
|
] }) }),
|
|
58
60
|
/* @__PURE__ */ n("div", { className: "select-element", children: /* @__PURE__ */ n(
|
|
59
|
-
|
|
61
|
+
z,
|
|
60
62
|
{
|
|
61
63
|
clearButton: m,
|
|
62
64
|
value: !!c,
|
|
63
65
|
clearButtonIcon: f,
|
|
64
|
-
onClear:
|
|
66
|
+
onClear: x
|
|
65
67
|
}
|
|
66
68
|
) })
|
|
67
69
|
] }),
|
|
68
|
-
/* @__PURE__ */ n(
|
|
70
|
+
/* @__PURE__ */ n(T, { asChild: !0, children: /* @__PURE__ */ n(
|
|
69
71
|
"input",
|
|
70
72
|
{
|
|
71
|
-
ref:
|
|
73
|
+
ref: j([C, e]),
|
|
72
74
|
autoComplete: "off",
|
|
73
75
|
autoCapitalize: "none",
|
|
74
76
|
autoCorrect: "off",
|
|
@@ -84,5 +86,5 @@ const V = w(
|
|
|
84
86
|
}
|
|
85
87
|
);
|
|
86
88
|
export {
|
|
87
|
-
|
|
89
|
+
W as SelectInput
|
|
88
90
|
};
|
package/dist/bundle.es50.js
CHANGED
|
@@ -1,85 +1,91 @@
|
|
|
1
1
|
import { jsx as i, jsxs as L } from "react/jsx-runtime";
|
|
2
|
-
import { useMemo as
|
|
2
|
+
import { useMemo as k, useEffect as v } from "react";
|
|
3
3
|
import { Spinner as R } from "./bundle.es6.js";
|
|
4
|
-
import { OptionItem as
|
|
4
|
+
import { OptionItem as g } from "./bundle.es15.js";
|
|
5
5
|
import { OptionsList as S } from "./bundle.es17.js";
|
|
6
6
|
import { Icon as b } from "./bundle.es33.js";
|
|
7
|
-
import { faPlus as
|
|
8
|
-
const
|
|
9
|
-
const { onOptionsLoaded: n, useOptions:
|
|
10
|
-
return
|
|
7
|
+
import { faPlus as y } 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 v(() => {
|
|
11
11
|
t.options.length > 0 && n?.(t.options);
|
|
12
12
|
}, [t.options]), o ? { options: o, isLoading: void 0 } : t;
|
|
13
|
-
},
|
|
13
|
+
}, F = (e) => {
|
|
14
14
|
const {
|
|
15
15
|
isActive: n,
|
|
16
|
-
emptyText:
|
|
16
|
+
emptyText: s,
|
|
17
17
|
scrollboxRef: o,
|
|
18
18
|
optionsWrapperRef: t,
|
|
19
|
-
addOption:
|
|
20
|
-
onOpened:
|
|
21
|
-
onSelect:
|
|
22
|
-
minimalOptions:
|
|
23
|
-
filterOptions:
|
|
24
|
-
disableFiltering:
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
19
|
+
addOption: d,
|
|
20
|
+
onOpened: r,
|
|
21
|
+
onSelect: f,
|
|
22
|
+
minimalOptions: O,
|
|
23
|
+
filterOptions: p,
|
|
24
|
+
disableFiltering: m,
|
|
25
|
+
close: c,
|
|
26
|
+
...a
|
|
27
|
+
} = e, { options: l, isLoading: u } = N(a), x = k(() => p && !m ? l.filter(p) : l, [l, p, m]);
|
|
28
|
+
return u ? /* @__PURE__ */ i("div", { className: "select-popover-loading", children: /* @__PURE__ */ i(R, { size: 24 }) }) : /* @__PURE__ */ i(
|
|
29
|
+
P,
|
|
29
30
|
{
|
|
30
|
-
options:
|
|
31
|
+
options: x,
|
|
31
32
|
isActive: n,
|
|
32
|
-
emptyText:
|
|
33
|
+
emptyText: s,
|
|
33
34
|
scrollboxRef: o,
|
|
34
35
|
optionsWrapperRef: t,
|
|
35
|
-
minimalOptions:
|
|
36
|
-
addOption:
|
|
37
|
-
onOpened:
|
|
38
|
-
onSelect:
|
|
36
|
+
minimalOptions: O,
|
|
37
|
+
addOption: d,
|
|
38
|
+
onOpened: r,
|
|
39
|
+
onSelect: f,
|
|
40
|
+
close: c
|
|
39
41
|
}
|
|
40
42
|
);
|
|
41
|
-
},
|
|
43
|
+
}, P = (e) => {
|
|
42
44
|
const {
|
|
43
45
|
isActive: n,
|
|
44
|
-
onOpened:
|
|
46
|
+
onOpened: s,
|
|
45
47
|
addOption: o,
|
|
46
48
|
scrollboxRef: t,
|
|
47
|
-
optionsWrapperRef:
|
|
48
|
-
options:
|
|
49
|
-
onSelect:
|
|
50
|
-
minimalOptions:
|
|
51
|
-
emptyText:
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
49
|
+
optionsWrapperRef: d,
|
|
50
|
+
options: r,
|
|
51
|
+
onSelect: f,
|
|
52
|
+
minimalOptions: O,
|
|
53
|
+
emptyText: p = "Ничего не найдено",
|
|
54
|
+
close: m
|
|
55
|
+
} = e;
|
|
56
|
+
return v(() => {
|
|
57
|
+
s?.(r.findIndex(({ value: c }) => n(c)));
|
|
58
|
+
}, []), /* @__PURE__ */ L(S, { scrollboxRef: t, optionsWrapperRef: d, maxHeight: 300, children: [
|
|
56
59
|
o && /* @__PURE__ */ i(
|
|
57
|
-
|
|
60
|
+
g,
|
|
58
61
|
{
|
|
59
62
|
className: "select-add-option",
|
|
60
|
-
icon: /* @__PURE__ */ i(b, { icon:
|
|
63
|
+
icon: /* @__PURE__ */ i(b, { icon: y }),
|
|
61
64
|
title: o.text,
|
|
62
|
-
onClick: o.onClick
|
|
65
|
+
onClick: o.onClick,
|
|
66
|
+
onClickCapture: () => {
|
|
67
|
+
o.closeOnClick && m();
|
|
68
|
+
}
|
|
63
69
|
}
|
|
64
70
|
),
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
71
|
+
r.length === 0 && !o && /* @__PURE__ */ i("div", { className: "select-tags-empty", children: p }),
|
|
72
|
+
r.map(({ title: c, value: a, className: l, icon: u, disabled: x, label: C }, h) => /* @__PURE__ */ i(
|
|
73
|
+
g,
|
|
68
74
|
{
|
|
69
|
-
active: n(
|
|
70
|
-
onClick: () =>
|
|
71
|
-
minimal:
|
|
72
|
-
disabled:
|
|
75
|
+
active: n(a),
|
|
76
|
+
onClick: () => f?.(a),
|
|
77
|
+
minimal: O,
|
|
78
|
+
disabled: x,
|
|
73
79
|
className: l,
|
|
74
|
-
title:
|
|
75
|
-
label:
|
|
76
|
-
icon:
|
|
80
|
+
title: c,
|
|
81
|
+
label: C,
|
|
82
|
+
icon: u
|
|
77
83
|
},
|
|
78
84
|
`select-option-${h}`
|
|
79
85
|
))
|
|
80
86
|
] });
|
|
81
87
|
};
|
|
82
88
|
export {
|
|
83
|
-
|
|
84
|
-
|
|
89
|
+
F as OptionsPopover,
|
|
90
|
+
P as SelectOptionsList
|
|
85
91
|
};
|