@kolking/react-ui 1.4.0 → 1.6.0
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-DE1QkW7S.js → Input-D46mAsdt.js} +39 -29
- package/dist/ValidationTooltip-D8d9O6Re.js +31 -0
- package/dist/components/Breadcrumbs/Breadcrumbs.d.ts +11 -0
- package/dist/components/Breadcrumbs/Breadcrumbs.js +40 -0
- package/dist/components/Breadcrumbs/index.d.ts +1 -0
- package/dist/components/Breadcrumbs/index.js +4 -0
- package/dist/components/Button/Button.js +1 -1
- package/dist/components/Dialog/Dialog.d.ts +14 -5
- package/dist/components/Dialog/Dialog.js +67 -49
- package/dist/components/Dialog/useDialog.d.ts +2 -1
- package/dist/components/Dialog/useDialog.js +29 -42
- package/dist/components/Dialog/withDialog.d.ts +1 -1
- package/dist/components/Fields/Checkbox.js +1 -1
- package/dist/components/Fields/Field.d.ts +1 -1
- package/dist/components/Fields/Field.js +28 -27
- package/dist/components/Fields/Input.d.ts +2 -0
- package/dist/components/Fields/Input.js +2 -2
- package/dist/components/Fields/Numeric.d.ts +4 -0
- package/dist/components/Fields/Numeric.js +62 -0
- package/dist/components/Fields/Radio.js +1 -1
- package/dist/components/Fields/Range.d.ts +20 -0
- package/dist/components/Fields/Range.js +54 -0
- package/dist/components/Fields/Select.js +1 -1
- package/dist/components/Fields/Switch.d.ts +13 -0
- package/dist/components/Fields/Switch.js +36 -0
- package/dist/components/Fields/Textarea.js +1 -1
- package/dist/components/Fields/ValidationTooltip.d.ts +1 -1
- package/dist/components/Fields/ValidationTooltip.js +3 -2
- package/dist/components/Fields/index.d.ts +3 -1
- package/dist/components/Fields/index.js +20 -16
- package/dist/components/Flex/Flex.d.ts +1 -1
- package/dist/components/Flex/Flex.js +24 -23
- package/dist/components/Menu/Menu.d.ts +6 -2
- package/dist/components/Menu/Menu.js +57 -51
- package/dist/components/Menu/MenuContext.d.ts +1 -0
- package/dist/components/Menu/MenuItem.d.ts +2 -3
- package/dist/components/Menu/MenuItem.js +23 -29
- package/dist/components/Segmented/Segmented.js +22 -19
- package/dist/components/ToggleButton/ToggleButton.d.ts +5 -0
- package/dist/components/ToggleButton/ToggleButton.js +16 -0
- package/dist/components/ToggleButton/ToggleGroup.d.ts +12 -0
- package/dist/components/ToggleButton/ToggleGroup.js +43 -0
- package/dist/components/ToggleButton/index.d.ts +2 -0
- package/dist/components/ToggleButton/index.js +6 -0
- package/dist/components/Tooltip/Tooltip.d.ts +2 -1
- package/dist/components/Tooltip/Tooltip.js +59 -56
- package/dist/index.d.ts +2 -0
- package/dist/index.js +62 -52
- package/dist/styles/_theme-default.scss +23 -21
- package/dist/styles/style.css +1 -1
- package/dist/styles.module-D1F3R7Vi.js +11 -0
- package/dist/utils/helpers.d.ts +2 -3
- package/dist/utils/helpers.js +20 -22
- package/package.json +2 -1
- package/dist/ValidationTooltip-BgSwl0hJ.js +0 -30
- package/dist/components/Dialog/DialogFocusTrap.d.ts +0 -2
- package/dist/components/Dialog/DialogFocusTrap.js +0 -17
- package/dist/components/Fields/Quantity.d.ts +0 -7
- package/dist/components/Fields/Quantity.js +0 -61
- package/dist/styles.module-CUhWny5T.js +0 -11
|
@@ -1,15 +1,15 @@
|
|
|
1
|
-
import { jsxs as
|
|
1
|
+
import { jsxs as _, jsx as s } from "react/jsx-runtime";
|
|
2
2
|
import u from "classnames";
|
|
3
|
-
import
|
|
3
|
+
import h from "react";
|
|
4
4
|
import { cssProps as m } from "./utils/helpers.js";
|
|
5
|
-
import { s as t, V as
|
|
6
|
-
const
|
|
7
|
-
checkbox:
|
|
8
|
-
radio:
|
|
9
|
-
label:
|
|
10
|
-
input:
|
|
5
|
+
import { s as t, V as x } from "./ValidationTooltip-D8d9O6Re.js";
|
|
6
|
+
const w = "styles_checkbox_pxrU4", v = "styles_radio_0QV8R", k = "styles_label_K65D1", g = "styles_input_j6Qji", N = {
|
|
7
|
+
checkbox: w,
|
|
8
|
+
radio: v,
|
|
9
|
+
label: k,
|
|
10
|
+
input: g
|
|
11
11
|
};
|
|
12
|
-
function
|
|
12
|
+
function j(e) {
|
|
13
13
|
return ![
|
|
14
14
|
"button",
|
|
15
15
|
"checkbox",
|
|
@@ -21,13 +21,13 @@ function N(a) {
|
|
|
21
21
|
"range",
|
|
22
22
|
"reset",
|
|
23
23
|
"submit"
|
|
24
|
-
].includes(
|
|
24
|
+
].includes(e);
|
|
25
25
|
}
|
|
26
|
-
function p(
|
|
27
|
-
switch (
|
|
26
|
+
function p(e) {
|
|
27
|
+
switch (e) {
|
|
28
28
|
case "checkbox":
|
|
29
29
|
case "radio":
|
|
30
|
-
return
|
|
30
|
+
return N.input;
|
|
31
31
|
case "date":
|
|
32
32
|
case "datetime":
|
|
33
33
|
case "datetime-local":
|
|
@@ -45,21 +45,31 @@ function p(a) {
|
|
|
45
45
|
case "image":
|
|
46
46
|
case "color":
|
|
47
47
|
case "file":
|
|
48
|
-
return t[
|
|
48
|
+
return t[e];
|
|
49
49
|
default:
|
|
50
50
|
return t.input;
|
|
51
51
|
}
|
|
52
52
|
}
|
|
53
|
-
const
|
|
54
|
-
({
|
|
55
|
-
|
|
53
|
+
const C = h.forwardRef(
|
|
54
|
+
({
|
|
55
|
+
size: e,
|
|
56
|
+
error: c,
|
|
57
|
+
type: a = "text",
|
|
58
|
+
wrapperType: b = a,
|
|
59
|
+
prefix: i,
|
|
60
|
+
className: o,
|
|
61
|
+
style: d,
|
|
62
|
+
children: n,
|
|
63
|
+
...r
|
|
64
|
+
}, l) => {
|
|
65
|
+
const f = j(a) && (i || n) ? /* @__PURE__ */ _(
|
|
56
66
|
"div",
|
|
57
67
|
{
|
|
58
|
-
"data-input-wrapper":
|
|
68
|
+
"data-input-wrapper": b,
|
|
59
69
|
"data-disabled": r.disabled,
|
|
60
70
|
"data-invalid": c ? !0 : void 0,
|
|
61
71
|
className: u(t.wrapper, o),
|
|
62
|
-
style: { ...d, ...m({ size:
|
|
72
|
+
style: { ...d, ...m({ size: e }) },
|
|
63
73
|
children: [
|
|
64
74
|
i && /* @__PURE__ */ s("div", { "data-input-prefix": !0, className: t.wrapper_prefix, children: i }),
|
|
65
75
|
/* @__PURE__ */ s(
|
|
@@ -67,9 +77,9 @@ const Q = _.forwardRef(
|
|
|
67
77
|
{
|
|
68
78
|
...r,
|
|
69
79
|
ref: l,
|
|
70
|
-
type:
|
|
71
|
-
"data-input":
|
|
72
|
-
className: p(
|
|
80
|
+
type: a,
|
|
81
|
+
"data-input": a,
|
|
82
|
+
className: p(a)
|
|
73
83
|
}
|
|
74
84
|
),
|
|
75
85
|
n && /* @__PURE__ */ s("div", { "data-input-accessory": !0, className: t.wrapper_accessory, children: n })
|
|
@@ -80,17 +90,17 @@ const Q = _.forwardRef(
|
|
|
80
90
|
{
|
|
81
91
|
...r,
|
|
82
92
|
ref: l,
|
|
83
|
-
type:
|
|
84
|
-
"data-input":
|
|
93
|
+
type: a,
|
|
94
|
+
"data-input": a,
|
|
85
95
|
"data-invalid": c ? !0 : void 0,
|
|
86
|
-
className: u(p(
|
|
87
|
-
style: { ...d, ...m({ size:
|
|
96
|
+
className: u(p(a), o),
|
|
97
|
+
style: { ...d, ...m({ size: e }) }
|
|
88
98
|
}
|
|
89
99
|
);
|
|
90
|
-
return /* @__PURE__ */ s(
|
|
100
|
+
return /* @__PURE__ */ s(x, { content: c, children: f });
|
|
91
101
|
}
|
|
92
102
|
);
|
|
93
103
|
export {
|
|
94
|
-
|
|
95
|
-
|
|
104
|
+
C as I,
|
|
105
|
+
N as s
|
|
96
106
|
};
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
import { jsx as s } from "react/jsx-runtime";
|
|
2
|
+
import r from "classnames";
|
|
3
|
+
import { Tooltip as o } from "./components/Tooltip/Tooltip.js";
|
|
4
|
+
const a = "styles_input_a-JHN", p = "styles_wrapper_b3-VW", c = "styles_date_S0YpO", l = "styles_time_3ywit", _ = "styles_search_y6sAm", n = "styles_number_auDA-", i = "styles_textarea_KRYGO", y = "styles_select_qhElj", m = "styles_tooltip_tBrt4", w = "styles_range_tSqtV", u = "styles_wrapper_prefix_KI25W", d = "styles_wrapper_accessory_yZjv0", x = {
|
|
5
|
+
input: a,
|
|
6
|
+
wrapper: p,
|
|
7
|
+
date: c,
|
|
8
|
+
time: l,
|
|
9
|
+
search: _,
|
|
10
|
+
number: n,
|
|
11
|
+
textarea: i,
|
|
12
|
+
select: y,
|
|
13
|
+
tooltip: m,
|
|
14
|
+
range: w,
|
|
15
|
+
wrapper_prefix: u,
|
|
16
|
+
wrapper_accessory: d
|
|
17
|
+
}, h = ({ className: e, ...t }) => /* @__PURE__ */ s(
|
|
18
|
+
o,
|
|
19
|
+
{
|
|
20
|
+
placement: "top-start",
|
|
21
|
+
trigger: "hover focus click",
|
|
22
|
+
...t,
|
|
23
|
+
"data-tooltip-validation": !0,
|
|
24
|
+
disabled: !t.content,
|
|
25
|
+
className: r(x.tooltip, e)
|
|
26
|
+
}
|
|
27
|
+
);
|
|
28
|
+
export {
|
|
29
|
+
h as V,
|
|
30
|
+
x as s
|
|
31
|
+
};
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
export type Breadcrumb = React.AnchorHTMLAttributes<HTMLAnchorElement> & {
|
|
3
|
+
label: React.ReactNode;
|
|
4
|
+
};
|
|
5
|
+
export type BreadcrumbsProps = React.HTMLAttributes<HTMLOListElement> & {
|
|
6
|
+
size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
|
|
7
|
+
items: Breadcrumb[];
|
|
8
|
+
separator?: React.ReactNode;
|
|
9
|
+
margin?: React.CSSProperties['margin'];
|
|
10
|
+
};
|
|
11
|
+
export declare const Breadcrumbs: ({ size, items, separator, margin, style, className, ...props }: BreadcrumbsProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
import { jsx as a, jsxs as i } from "react/jsx-runtime";
|
|
2
|
+
import p from "classnames";
|
|
3
|
+
import { cssProps as h } from "../../utils/helpers.js";
|
|
4
|
+
const f = "Breadcrumbs_breadcrumbs_a3ubb", g = {
|
|
5
|
+
breadcrumbs: f
|
|
6
|
+
}, _ = ({
|
|
7
|
+
size: t,
|
|
8
|
+
items: s = [],
|
|
9
|
+
separator: b = "›",
|
|
10
|
+
margin: d,
|
|
11
|
+
style: m,
|
|
12
|
+
className: o,
|
|
13
|
+
...n
|
|
14
|
+
}) => /* @__PURE__ */ a(
|
|
15
|
+
"ol",
|
|
16
|
+
{
|
|
17
|
+
...n,
|
|
18
|
+
"data-breadcrumbs": !0,
|
|
19
|
+
className: p(g.breadcrumbs, o),
|
|
20
|
+
style: { ...m, ...h({ size: t, margin: d }) },
|
|
21
|
+
children: s.map(({ label: u, ...e }, r) => {
|
|
22
|
+
const c = r === s.length - 1, l = e.href ? "a" : "span";
|
|
23
|
+
return /* @__PURE__ */ i("li", { children: [
|
|
24
|
+
/* @__PURE__ */ a(
|
|
25
|
+
l,
|
|
26
|
+
{
|
|
27
|
+
...e,
|
|
28
|
+
"data-breadcrumbs-item": r,
|
|
29
|
+
"aria-current": c ? "page" : void 0,
|
|
30
|
+
children: u
|
|
31
|
+
}
|
|
32
|
+
),
|
|
33
|
+
!c && /* @__PURE__ */ a("span", { "aria-hidden": !0, "data-breadcrumbs-separator": !0, children: b })
|
|
34
|
+
] }, r);
|
|
35
|
+
})
|
|
36
|
+
}
|
|
37
|
+
);
|
|
38
|
+
export {
|
|
39
|
+
_ as Breadcrumbs
|
|
40
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './Breadcrumbs';
|
|
@@ -1,10 +1,19 @@
|
|
|
1
1
|
import { default as React } from 'react';
|
|
2
2
|
import { ButtonProps } from '../Button';
|
|
3
|
-
|
|
3
|
+
import { HeadingProps } from '../Heading';
|
|
4
|
+
export type DialogProps = React.HTMLAttributes<HTMLDivElement> & {
|
|
5
|
+
open?: boolean;
|
|
6
|
+
size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
|
|
4
7
|
width?: React.CSSProperties['width'];
|
|
8
|
+
requestClose: () => void;
|
|
5
9
|
};
|
|
6
|
-
export declare const Dialog: React.ForwardRefExoticComponent<
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
+
export declare const Dialog: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {
|
|
11
|
+
open?: boolean;
|
|
12
|
+
size?: "xs" | "sm" | "md" | "lg" | "xl";
|
|
13
|
+
width?: React.CSSProperties["width"];
|
|
14
|
+
requestClose: () => void;
|
|
15
|
+
} & React.RefAttributes<HTMLDivElement>>;
|
|
16
|
+
export declare const DialogTitle: ({ className, children, ...props }: Omit<HeadingProps, "title">) => import("react/jsx-runtime").JSX.Element;
|
|
17
|
+
export declare const DialogContent: (props: React.HTMLAttributes<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element;
|
|
18
|
+
export declare const DialogFooter: ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element;
|
|
10
19
|
export declare const DialogClose: ({ className, ...props }: ButtonProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,58 +1,76 @@
|
|
|
1
|
-
import { jsx as
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import {
|
|
5
|
-
import
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
footer:
|
|
14
|
-
close:
|
|
15
|
-
},
|
|
16
|
-
({ open:
|
|
17
|
-
|
|
18
|
-
{
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
1
|
+
import { jsx as o } from "react/jsx-runtime";
|
|
2
|
+
import y, { useRef as D, useImperativeHandle as _, useEffect as E } from "react";
|
|
3
|
+
import { createPortal as k } from "react-dom";
|
|
4
|
+
import { FocusTrap as h } from "focus-trap-react";
|
|
5
|
+
import s from "classnames";
|
|
6
|
+
import { Icon as L } from "../Icon/Icon.js";
|
|
7
|
+
import { Button as N } from "../Button/Button.js";
|
|
8
|
+
import { Heading as b } from "../Heading/Heading.js";
|
|
9
|
+
import { cssProps as w } from "../../utils/helpers.js";
|
|
10
|
+
const x = "Dialog_overlay_C98Qt", R = "Dialog_dialog_G3gxL", T = "Dialog_footer_N-aEV", I = "Dialog_close_JSEkn", i = {
|
|
11
|
+
overlay: x,
|
|
12
|
+
dialog: R,
|
|
13
|
+
footer: T,
|
|
14
|
+
close: I
|
|
15
|
+
}, P = { escapeDeactivates: !1 }, Q = y.forwardRef(
|
|
16
|
+
({ open: t = !1, size: e, width: l, style: m, className: g, children: u, requestClose: n, ...p }, v) => {
|
|
17
|
+
const c = D(null);
|
|
18
|
+
return _(v, () => c.current), E(() => {
|
|
19
|
+
const r = c.current;
|
|
20
|
+
if (r && t) {
|
|
21
|
+
let d = function(a) {
|
|
22
|
+
a.target === a.currentTarget && n();
|
|
23
|
+
}, f = function(a) {
|
|
24
|
+
a.key === "Escape" && (a.stopPropagation(), a.preventDefault(), n());
|
|
25
|
+
};
|
|
26
|
+
return r.addEventListener("click", d), r.addEventListener("keydown", f), () => {
|
|
27
|
+
r.removeEventListener("click", d), r.removeEventListener("keydown", f);
|
|
28
|
+
};
|
|
29
|
+
}
|
|
30
|
+
}, [t, n]), t ? k(
|
|
31
|
+
/* @__PURE__ */ o(h, { active: t, focusTrapOptions: P, children: /* @__PURE__ */ o(
|
|
32
|
+
"div",
|
|
33
|
+
{
|
|
34
|
+
...p,
|
|
35
|
+
ref: c,
|
|
36
|
+
tabIndex: 0,
|
|
37
|
+
"data-dialog": !0,
|
|
38
|
+
"data-open": t,
|
|
39
|
+
"data-floating-root": !0,
|
|
40
|
+
className: i.overlay,
|
|
41
|
+
children: /* @__PURE__ */ o(
|
|
42
|
+
"div",
|
|
43
|
+
{
|
|
44
|
+
role: "alertdialog",
|
|
45
|
+
"aria-modal": "true",
|
|
46
|
+
"data-dialog-wrapper": !0,
|
|
47
|
+
className: s(i.dialog, g),
|
|
48
|
+
style: { ...m, ...w({ size: e, width: l }) },
|
|
49
|
+
children: u
|
|
50
|
+
}
|
|
51
|
+
)
|
|
52
|
+
}
|
|
53
|
+
) }),
|
|
54
|
+
// Append to an element with data-floating-root attribute
|
|
55
|
+
document.querySelector("[data-floating-root]") ?? document.body
|
|
56
|
+
) : null;
|
|
57
|
+
}
|
|
58
|
+
), V = ({ className: t, children: e, ...l }) => /* @__PURE__ */ o(b, { as: "h4", ...l, "data-dialog-title": !0, title: e, className: t }), z = (t) => /* @__PURE__ */ o("div", { ...t, "data-dialog-content": !0 }), A = ({ className: t, ...e }) => /* @__PURE__ */ o("div", { ...e, "data-dialog-footer": !0, className: s(i.footer, t) }), K = ({ className: t, ...e }) => /* @__PURE__ */ o(
|
|
59
|
+
N,
|
|
42
60
|
{
|
|
43
|
-
...
|
|
61
|
+
...e,
|
|
44
62
|
type: "button",
|
|
45
63
|
variant: "tertiary",
|
|
46
64
|
"data-dialog-close": !0,
|
|
47
65
|
"aria-label": "dismiss dialog",
|
|
48
|
-
icon: /* @__PURE__ */
|
|
49
|
-
className: i
|
|
66
|
+
icon: /* @__PURE__ */ o(L, { name: "close" }),
|
|
67
|
+
className: s(i.close, t)
|
|
50
68
|
}
|
|
51
69
|
);
|
|
52
70
|
export {
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
71
|
+
Q as Dialog,
|
|
72
|
+
K as DialogClose,
|
|
73
|
+
z as DialogContent,
|
|
74
|
+
A as DialogFooter,
|
|
75
|
+
V as DialogTitle
|
|
58
76
|
};
|
|
@@ -7,8 +7,9 @@ export type DialogOptions<T, R> = {
|
|
|
7
7
|
export type DialogType<T, R> = ReturnType<typeof useDialog<T, R>>;
|
|
8
8
|
export declare function useDialog<T, R>(options?: DialogOptions<T, R>): {
|
|
9
9
|
props: {
|
|
10
|
-
ref: import('react').RefObject<
|
|
10
|
+
ref: import('react').RefObject<HTMLDivElement>;
|
|
11
11
|
open: boolean;
|
|
12
|
+
requestClose: () => void;
|
|
12
13
|
};
|
|
13
14
|
data: T | undefined;
|
|
14
15
|
show: (values: T) => void;
|
|
@@ -1,52 +1,39 @@
|
|
|
1
|
-
import { useRef as
|
|
2
|
-
function
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
}, [
|
|
21
|
-
|
|
22
|
-
if (e) {
|
|
23
|
-
let n = function(r) {
|
|
24
|
-
r.target === r.currentTarget && c();
|
|
25
|
-
}, t = function(r) {
|
|
26
|
-
r.key === "Escape" && (r.stopPropagation(), r.preventDefault(), c());
|
|
27
|
-
};
|
|
28
|
-
return e.addEventListener("click", n), e.addEventListener("keydown", t), () => {
|
|
29
|
-
e.removeEventListener("click", n), e.removeEventListener("keydown", t);
|
|
30
|
-
};
|
|
31
|
-
}
|
|
32
|
-
}, [c]);
|
|
33
|
-
const L = u(() => c(), [c]), C = u((e) => c(e), [c]), D = u(async (e) => {
|
|
34
|
-
s.current = !0;
|
|
1
|
+
import { useRef as l, useState as y, useCallback as a } from "react";
|
|
2
|
+
function g(t, u) {
|
|
3
|
+
setTimeout(
|
|
4
|
+
u,
|
|
5
|
+
t ? parseFloat(getComputedStyle(t).transitionDuration) * 1e3 : 0
|
|
6
|
+
);
|
|
7
|
+
}
|
|
8
|
+
function v(t) {
|
|
9
|
+
const u = l(null), s = l(t), c = l(!1), [D, i] = y((t == null ? void 0 : t.defaultOpen) ?? !1), [b, d] = y();
|
|
10
|
+
s.current = t;
|
|
11
|
+
const w = a((e) => {
|
|
12
|
+
var r, n;
|
|
13
|
+
c.current || (i(!0), d(e), (n = (r = s.current) == null ? void 0 : r.onShow) == null || n.call(r, e));
|
|
14
|
+
}, []), o = a((e) => {
|
|
15
|
+
var r;
|
|
16
|
+
c.current || (c.current = !0, (r = u.current) == null || r.setAttribute("data-open", "false"), g(u.current, () => {
|
|
17
|
+
var n, C, f, m;
|
|
18
|
+
e !== void 0 ? (C = (n = s.current) == null ? void 0 : n.onConfirm) == null || C.call(n, e) : (m = (f = s.current) == null ? void 0 : f.onCancel) == null || m.call(f), i(!1), d(void 0), c.current = !1;
|
|
19
|
+
}));
|
|
20
|
+
}, []), p = a(() => o(), [o]), O = a((e) => o(e), [o]), S = a(async (e) => {
|
|
21
|
+
c.current = !0;
|
|
35
22
|
try {
|
|
36
23
|
return await e;
|
|
37
24
|
} finally {
|
|
38
|
-
|
|
25
|
+
c.current = !1;
|
|
39
26
|
}
|
|
40
27
|
}, []);
|
|
41
28
|
return {
|
|
42
|
-
props: { ref:
|
|
43
|
-
data:
|
|
44
|
-
show:
|
|
45
|
-
cancel:
|
|
46
|
-
confirm:
|
|
47
|
-
preventClose:
|
|
29
|
+
props: { ref: u, open: D, requestClose: p },
|
|
30
|
+
data: b,
|
|
31
|
+
show: w,
|
|
32
|
+
cancel: p,
|
|
33
|
+
confirm: O,
|
|
34
|
+
preventClose: S
|
|
48
35
|
};
|
|
49
36
|
}
|
|
50
37
|
export {
|
|
51
|
-
|
|
38
|
+
v as useDialog
|
|
52
39
|
};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { default as React } from 'react';
|
|
2
2
|
import { DialogProps } from './Dialog';
|
|
3
3
|
import { DialogOptions, DialogType } from './useDialog';
|
|
4
|
-
type ComponentProps<T, R> = Omit<DialogProps, 'children'> & DialogOptions<T, R> & {
|
|
4
|
+
type ComponentProps<T, R> = Omit<DialogProps, 'children' | 'ref' | 'requestClose'> & DialogOptions<T, R> & {
|
|
5
5
|
children: (dialog: DialogType<T, R>) => React.ReactNode;
|
|
6
6
|
};
|
|
7
7
|
export type WithDialogProps<T extends object, R> = T & {
|
|
@@ -2,7 +2,7 @@ import { jsxs as i, jsx as l } from "react/jsx-runtime";
|
|
|
2
2
|
import p from "classnames";
|
|
3
3
|
import h, { useRef as x, useImperativeHandle as k, useEffect as b } from "react";
|
|
4
4
|
import { cssProps as R } from "../../utils/helpers.js";
|
|
5
|
-
import { I as y, s as n } from "../../Input-
|
|
5
|
+
import { I as y, s as n } from "../../Input-D46mAsdt.js";
|
|
6
6
|
const q = h.forwardRef(
|
|
7
7
|
({ size: c, error: a, label: t, className: f, style: u, required: m, indeterminate: r, ...s }, d) => {
|
|
8
8
|
const o = s.checked, e = x(null);
|
|
@@ -17,4 +17,4 @@ export declare const FieldLabel: ({ label, required, className, children, ...pro
|
|
|
17
17
|
export type FieldDescriptionProps = React.HTMLAttributes<HTMLDivElement>;
|
|
18
18
|
export declare const FieldDescription: ({ className, children, ...props }: FieldDescriptionProps) => import("react/jsx-runtime").JSX.Element;
|
|
19
19
|
export type FieldProps = React.HTMLAttributes<HTMLDivElement> & FieldConfig;
|
|
20
|
-
export declare const Field: ({ id, label, labelAccessory, help, required, minWidth, maxWidth, className, children, ...props }: FieldProps) => import("react/jsx-runtime").JSX.Element;
|
|
20
|
+
export declare const Field: ({ id, label, labelAccessory, help, required, minWidth, maxWidth, className, children, style, ...props }: FieldProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,14 +1,14 @@
|
|
|
1
|
-
import { jsxs as
|
|
1
|
+
import { jsxs as i, jsx as r } from "react/jsx-runtime";
|
|
2
2
|
import d from "classnames";
|
|
3
|
-
import
|
|
4
|
-
import { cssProps as
|
|
5
|
-
const
|
|
6
|
-
field:
|
|
7
|
-
header:
|
|
8
|
-
label:
|
|
9
|
-
accessory:
|
|
10
|
-
description:
|
|
11
|
-
},
|
|
3
|
+
import _ from "react";
|
|
4
|
+
import { cssProps as p } from "../../utils/helpers.js";
|
|
5
|
+
const u = "styles_field_hqzKT", b = "styles_header_Iwsz6", N = "styles_label_zRVTS", F = "styles_accessory_S4ccn", v = "styles_description_fZnNW", a = {
|
|
6
|
+
field: u,
|
|
7
|
+
header: b,
|
|
8
|
+
label: N,
|
|
9
|
+
accessory: F,
|
|
10
|
+
description: v
|
|
11
|
+
}, x = ({ label: e, required: s, className: l, children: t, ...c }) => /* @__PURE__ */ i("div", { "data-field-header": !0, className: a.header, children: [
|
|
12
12
|
/* @__PURE__ */ r(
|
|
13
13
|
"label",
|
|
14
14
|
{
|
|
@@ -19,34 +19,35 @@ const p = "styles_field_hqzKT", u = "styles_header_Iwsz6", b = "styles_label_zRV
|
|
|
19
19
|
children: e
|
|
20
20
|
}
|
|
21
21
|
),
|
|
22
|
-
|
|
23
|
-
] }),
|
|
22
|
+
_.Children.toArray(t).length > 0 && /* @__PURE__ */ r("div", { "data-field-accessory": !0, className: a.accessory, children: t })
|
|
23
|
+
] }), z = ({ className: e, children: s, ...l }) => /* @__PURE__ */ r("small", { ...l, "data-field-description": !0, className: d(a.description, e), children: s }), T = ({
|
|
24
24
|
id: e,
|
|
25
25
|
label: s,
|
|
26
26
|
labelAccessory: l,
|
|
27
27
|
help: t,
|
|
28
28
|
required: c,
|
|
29
|
-
minWidth:
|
|
30
|
-
maxWidth:
|
|
31
|
-
className:
|
|
32
|
-
children:
|
|
33
|
-
|
|
34
|
-
|
|
29
|
+
minWidth: o,
|
|
30
|
+
maxWidth: n,
|
|
31
|
+
className: f,
|
|
32
|
+
children: m,
|
|
33
|
+
style: y,
|
|
34
|
+
...h
|
|
35
|
+
}) => /* @__PURE__ */ i(
|
|
35
36
|
"div",
|
|
36
37
|
{
|
|
37
|
-
...
|
|
38
|
+
...h,
|
|
38
39
|
"data-field": e || !0,
|
|
39
|
-
className: d(a.field,
|
|
40
|
-
style: { ...
|
|
40
|
+
className: d(a.field, f),
|
|
41
|
+
style: { ...y, ...p({ minWidth: o, maxWidth: n }) },
|
|
41
42
|
children: [
|
|
42
|
-
s && /* @__PURE__ */ r(
|
|
43
|
-
|
|
44
|
-
t && /* @__PURE__ */ r(
|
|
43
|
+
s && /* @__PURE__ */ r(x, { htmlFor: e, label: s, required: c, children: l }),
|
|
44
|
+
m,
|
|
45
|
+
t && /* @__PURE__ */ r(z, { children: t })
|
|
45
46
|
]
|
|
46
47
|
}
|
|
47
48
|
);
|
|
48
49
|
export {
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
50
|
+
T as Field,
|
|
51
|
+
z as FieldDescription,
|
|
52
|
+
x as FieldLabel
|
|
52
53
|
};
|
|
@@ -4,8 +4,10 @@ export type BaseInputProps<T = React.InputHTMLAttributes<HTMLInputElement>> = Om
|
|
|
4
4
|
error?: string;
|
|
5
5
|
};
|
|
6
6
|
export type InputProps = Omit<BaseInputProps, 'prefix'> & {
|
|
7
|
+
wrapperType?: string;
|
|
7
8
|
prefix?: React.ReactNode;
|
|
8
9
|
};
|
|
9
10
|
export declare const Input: React.ForwardRefExoticComponent<Omit<BaseInputProps<React.InputHTMLAttributes<HTMLInputElement>>, "prefix"> & {
|
|
11
|
+
wrapperType?: string;
|
|
10
12
|
prefix?: React.ReactNode;
|
|
11
13
|
} & React.RefAttributes<HTMLInputElement>>;
|
|
@@ -2,8 +2,8 @@ import "react/jsx-runtime";
|
|
|
2
2
|
import "classnames";
|
|
3
3
|
import "react";
|
|
4
4
|
import "../../utils/helpers.js";
|
|
5
|
-
import "../../ValidationTooltip-
|
|
6
|
-
import { I as a } from "../../Input-
|
|
5
|
+
import "../../ValidationTooltip-D8d9O6Re.js";
|
|
6
|
+
import { I as a } from "../../Input-D46mAsdt.js";
|
|
7
7
|
export {
|
|
8
8
|
a as Input
|
|
9
9
|
};
|