@plitzi/plitzi-ui 1.6.3 → 1.6.5
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/components/ContainerFloating/ContainerFloating.d.ts +2 -2
- package/dist/components/ContainerFloating/ContainerFloating.js +10 -3
- package/dist/components/ContainerFloating/ContainerFloating.styles.d.ts +3 -1
- package/dist/components/ContainerFloating/ContainerFloating.styles.js +8 -1
- package/dist/components/ContainerFloating/ContainerFloatingContent.d.ts +1 -1
- package/dist/components/ContainerFloating/ContainerFloatingContent.js +6 -3
- package/dist/components/ContainerFloating/ContainerFloatingTrigger.d.ts +1 -1
- package/dist/components/ContainerFloating/ContainerFloatingTrigger.js +7 -3
- package/dist/components/Select2/Select2.d.ts +1 -0
- package/dist/components/Select2/Select2.js +104 -104
- package/dist/components/TextArea/TextArea.d.ts +73 -2
- package/dist/components/TextArea/TextArea.js +13 -13
- package/package.json +1 -1
|
@@ -17,7 +17,7 @@ export type ContainerFloatingProps = {
|
|
|
17
17
|
} & useThemeSharedProps<typeof ContainerFloatingStyles, typeof variantKeys>;
|
|
18
18
|
declare const ContainerFloating: {
|
|
19
19
|
({ ref, children, containerTopOffset, containerLeftOffset, open: openProp, disabled, loading, closeOnClick, testId, placement, container, onOpenChange }: ContainerFloatingProps): import("react/jsx-runtime").JSX.Element;
|
|
20
|
-
Trigger: ({ children, className, testId, ref, onClick }: ContainerFloatingTriggerProps) => import("react/jsx-runtime").JSX.Element;
|
|
21
|
-
Content: ({ ref, children, className, placement, testId, ...props }: ContainerFloatingContentProps) => import("react/jsx-runtime").JSX.Element;
|
|
20
|
+
Trigger: ({ children, className, testId, ref, placement, disabled, onClick }: ContainerFloatingTriggerProps) => import("react/jsx-runtime").JSX.Element;
|
|
21
|
+
Content: ({ ref, children, className, placement, testId, disabled, ...props }: ContainerFloatingContentProps) => import("react/jsx-runtime").JSX.Element;
|
|
22
22
|
};
|
|
23
23
|
export default ContainerFloating;
|
|
@@ -23,6 +23,8 @@ var m = ({ ref: m, children: h, containerTopOffset: g = 0, containerLeftOffset:
|
|
|
23
23
|
e.trigger = o(t, {
|
|
24
24
|
testId: S ? `${S}-trigger` : void 0,
|
|
25
25
|
onClick: k,
|
|
26
|
+
disabled: y || b,
|
|
27
|
+
placement: C,
|
|
26
28
|
...n,
|
|
27
29
|
ref: A
|
|
28
30
|
});
|
|
@@ -30,6 +32,8 @@ var m = ({ ref: m, children: h, containerTopOffset: g = 0, containerLeftOffset:
|
|
|
30
32
|
let n = t.props;
|
|
31
33
|
e.content = o(t, {
|
|
32
34
|
testId: S ? `${S}-content` : void 0,
|
|
35
|
+
disabled: y || b,
|
|
36
|
+
placement: C,
|
|
33
37
|
...n,
|
|
34
38
|
onClick: j(n.onClick)
|
|
35
39
|
});
|
|
@@ -38,10 +42,13 @@ var m = ({ ref: m, children: h, containerTopOffset: g = 0, containerLeftOffset:
|
|
|
38
42
|
}), e;
|
|
39
43
|
}, [
|
|
40
44
|
h,
|
|
41
|
-
k,
|
|
42
|
-
j,
|
|
43
45
|
S,
|
|
44
|
-
|
|
46
|
+
k,
|
|
47
|
+
y,
|
|
48
|
+
b,
|
|
49
|
+
C,
|
|
50
|
+
A,
|
|
51
|
+
j
|
|
45
52
|
]);
|
|
46
53
|
return /* @__PURE__ */ p(d, { children: [M, /* @__PURE__ */ f(e, {
|
|
47
54
|
value: l(() => ({
|
|
@@ -6,7 +6,9 @@ export declare const variantKeys: {
|
|
|
6
6
|
export declare const STYLES_COMPONENT_NAME = "ContainerFloating";
|
|
7
7
|
declare const _default: {
|
|
8
8
|
root: (props?: ({} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
9
|
-
trigger: (props?:
|
|
9
|
+
trigger: (props?: ({
|
|
10
|
+
disabled?: boolean | null | undefined;
|
|
11
|
+
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
10
12
|
content: (props?: ({
|
|
11
13
|
intent?: "custom" | "dropdown" | null | undefined;
|
|
12
14
|
disabled?: boolean | null | undefined;
|
|
@@ -5,7 +5,14 @@ var t = {
|
|
|
5
5
|
compoundVariants: [],
|
|
6
6
|
defaultVariants: {}
|
|
7
7
|
}),
|
|
8
|
-
trigger: e("
|
|
8
|
+
trigger: e("", {
|
|
9
|
+
variants: { disabled: {
|
|
10
|
+
true: "cursor-not-allowed",
|
|
11
|
+
false: "cursor-pointer"
|
|
12
|
+
} },
|
|
13
|
+
compoundVariants: [],
|
|
14
|
+
defaultVariants: { disabled: !1 }
|
|
15
|
+
}),
|
|
9
16
|
content: e("flex w-full h-full", {
|
|
10
17
|
variants: {
|
|
11
18
|
intent: {
|
|
@@ -7,5 +7,5 @@ export type ContainerFloatingContentProps = {
|
|
|
7
7
|
className?: string;
|
|
8
8
|
testId?: string;
|
|
9
9
|
} & HTMLAttributes<HTMLDivElement> & useThemeSharedProps<typeof ContainerFloatingStyles, typeof variantKeys>;
|
|
10
|
-
declare const ContainerFloatingContent: ({ ref, children, className, placement, testId, ...props }: ContainerFloatingContentProps) => import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
declare const ContainerFloatingContent: ({ ref, children, className, placement, testId, disabled, ...props }: ContainerFloatingContentProps) => import("react/jsx-runtime").JSX.Element;
|
|
11
11
|
export default ContainerFloatingContent;
|
|
@@ -1,12 +1,15 @@
|
|
|
1
1
|
import e from "../../hooks/useTheme/index.js";
|
|
2
2
|
import { jsx as t } from "react/jsx-runtime";
|
|
3
3
|
//#region src/components/ContainerFloating/ContainerFloatingContent.tsx
|
|
4
|
-
var n = ({ ref: n, children: r, className: i, placement: a, testId: o,
|
|
4
|
+
var n = ({ ref: n, children: r, className: i, placement: a, testId: o, disabled: s, ...c }) => (i = e("ContainerFloating", {
|
|
5
5
|
className: i,
|
|
6
6
|
componentKey: "content",
|
|
7
|
-
variants: {
|
|
7
|
+
variants: {
|
|
8
|
+
placement: a,
|
|
9
|
+
disabled: s
|
|
10
|
+
}
|
|
8
11
|
}), /* @__PURE__ */ t("div", {
|
|
9
|
-
...
|
|
12
|
+
...c,
|
|
10
13
|
ref: n,
|
|
11
14
|
className: i,
|
|
12
15
|
"data-testid": o,
|
|
@@ -7,5 +7,5 @@ export type ContainerFloatingTriggerProps = {
|
|
|
7
7
|
testId?: string;
|
|
8
8
|
onClick?: (e: MouseEvent<HTMLDivElement>) => void;
|
|
9
9
|
} & useThemeSharedProps<typeof ContainerFloatingStyles, typeof variantKeys>;
|
|
10
|
-
declare const ContainerFloatingTrigger: ({ children, className, testId, ref, onClick }: ContainerFloatingTriggerProps) => import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
declare const ContainerFloatingTrigger: ({ children, className, testId, ref, placement, disabled, onClick }: ContainerFloatingTriggerProps) => import("react/jsx-runtime").JSX.Element;
|
|
11
11
|
export default ContainerFloatingTrigger;
|
|
@@ -1,13 +1,17 @@
|
|
|
1
1
|
import e from "../../hooks/useTheme/index.js";
|
|
2
2
|
import { jsx as t } from "react/jsx-runtime";
|
|
3
3
|
//#region src/components/ContainerFloating/ContainerFloatingTrigger.tsx
|
|
4
|
-
var n = ({ children: n, className: r, testId: i, ref: a,
|
|
4
|
+
var n = ({ children: n, className: r, testId: i, ref: a, placement: o, disabled: s, onClick: c }) => (r = e("ContainerFloating", {
|
|
5
5
|
className: r,
|
|
6
|
-
componentKey: "trigger"
|
|
6
|
+
componentKey: "trigger",
|
|
7
|
+
variants: {
|
|
8
|
+
placement: o,
|
|
9
|
+
disabled: s
|
|
10
|
+
}
|
|
7
11
|
}), /* @__PURE__ */ t("div", {
|
|
8
12
|
ref: a,
|
|
9
13
|
className: r,
|
|
10
|
-
onClick:
|
|
14
|
+
onClick: c,
|
|
11
15
|
"data-testid": i,
|
|
12
16
|
children: n
|
|
13
17
|
}));
|
|
@@ -1,19 +1,19 @@
|
|
|
1
1
|
import e from "../../hooks/useTheme/index.js";
|
|
2
2
|
import t from "../Flex/index.js";
|
|
3
3
|
import n from "../Icon/index.js";
|
|
4
|
-
import
|
|
5
|
-
import
|
|
6
|
-
import { isOptionGroup as
|
|
7
|
-
import
|
|
8
|
-
import
|
|
9
|
-
import
|
|
10
|
-
import { memo as
|
|
11
|
-
import { jsx as
|
|
12
|
-
import
|
|
4
|
+
import r from "../Input/InputContainer.js";
|
|
5
|
+
import i from "../ContainerFloating/index.js";
|
|
6
|
+
import { isOptionGroup as a } from "./helpers/utils.js";
|
|
7
|
+
import o from "./ListItem.js";
|
|
8
|
+
import s from "./SelectInput.js";
|
|
9
|
+
import ee from "./SelectList.js";
|
|
10
|
+
import { memo as c, useCallback as l, useEffect as u, useImperativeHandle as d, useMemo as f, useRef as p, useState as m } from "react";
|
|
11
|
+
import { jsx as h, jsxs as g } from "react/jsx-runtime";
|
|
12
|
+
import _ from "clsx";
|
|
13
13
|
//#region src/components/Select2/Select2.tsx
|
|
14
|
-
var
|
|
15
|
-
let { ref:
|
|
16
|
-
className:
|
|
14
|
+
var v = [], y = c((c) => {
|
|
15
|
+
let { ref: y, className: b = "", id: te, name: ne, value: x, options: S = v, placeholder: C = "Select...", label: w = "", size: T, disabled: E = !1, error: D = !1, allowCreateOptions: O = !1, isSearchable: k = !0, clearable: A = !0, allowRemoveOptions: j = !1, open: M, searchAutoFocus: re = !0, autoClose: N = !0, loading: ie = !1, onChange: P } = c, [F, ae] = m(M), [I, L] = m(S instanceof Promise), R = I || ie, z = e("Select2", {
|
|
16
|
+
className: b,
|
|
17
17
|
componentKey: [
|
|
18
18
|
"root",
|
|
19
19
|
"listPopup",
|
|
@@ -25,12 +25,12 @@ var g = [], _ = s((s) => {
|
|
|
25
25
|
"value"
|
|
26
26
|
],
|
|
27
27
|
variants: { size: T }
|
|
28
|
-
}),
|
|
29
|
-
|
|
30
|
-
let
|
|
28
|
+
}), B = p(null), [V, H] = m(), [U, W] = m(() => !I && Array.isArray(S) ? S : []), [G, K] = m([]);
|
|
29
|
+
d(y, () => B.current, [B]);
|
|
30
|
+
let q = f(() => {
|
|
31
31
|
if (typeof x == "string") {
|
|
32
|
-
let e =
|
|
33
|
-
return
|
|
32
|
+
let e = U.find((e) => a(e) ? e.options.find((e) => e.value === x) : e.value === x);
|
|
33
|
+
return a(e) ? e.options.find((e) => e.value === x) : !e && x && O ? {
|
|
34
34
|
label: x,
|
|
35
35
|
value: x
|
|
36
36
|
} : e;
|
|
@@ -38,151 +38,151 @@ var g = [], _ = s((s) => {
|
|
|
38
38
|
return x;
|
|
39
39
|
}, [
|
|
40
40
|
O,
|
|
41
|
-
|
|
41
|
+
U,
|
|
42
42
|
x
|
|
43
|
-
]), [
|
|
44
|
-
!
|
|
43
|
+
]), [J, Y] = m(""), oe = l((e) => {
|
|
44
|
+
!F && B.current && B.current.click(), Y(e);
|
|
45
45
|
}, [
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
]),
|
|
50
|
-
|
|
51
|
-
}, []),
|
|
52
|
-
E || (
|
|
46
|
+
Y,
|
|
47
|
+
F,
|
|
48
|
+
B
|
|
49
|
+
]), se = l((e) => {
|
|
50
|
+
ae(e), e || Y("");
|
|
51
|
+
}, []), X = l((e) => {
|
|
52
|
+
E || (c.valueAsString ? c.onChange?.(e?.value) : c.onChange?.(e), Y(""), N && B.current && B.current.click());
|
|
53
53
|
}, [
|
|
54
54
|
E,
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
]),
|
|
59
|
-
j && (e.value === x &&
|
|
55
|
+
c.valueAsString,
|
|
56
|
+
c.onChange,
|
|
57
|
+
N
|
|
58
|
+
]), ce = l((e) => {
|
|
59
|
+
j && (e.value === x && P?.(void 0), c.valueAsString ? c.onRemove?.(e.value) : c.onRemove?.(e));
|
|
60
60
|
}, [
|
|
61
61
|
j,
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
]),
|
|
62
|
+
c.valueAsString,
|
|
63
|
+
c.onRemove
|
|
64
|
+
]), Z = l(async () => {
|
|
65
65
|
let e = S;
|
|
66
|
-
e instanceof Promise && (
|
|
66
|
+
e instanceof Promise && (L(!0), W([]), e = await e, L(!1)), W(e);
|
|
67
67
|
}, [S]);
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
}, [S,
|
|
71
|
-
|
|
72
|
-
}, [
|
|
73
|
-
if (!(!O || !
|
|
74
|
-
if (e.find((e) => "value" in e && e.value ===
|
|
68
|
+
u(() => {
|
|
69
|
+
Z();
|
|
70
|
+
}, [S, Z]), u(() => {
|
|
71
|
+
H(F ? B.current?.getBoundingClientRect() : void 0);
|
|
72
|
+
}, [F]), u(() => {
|
|
73
|
+
if (!(!O || !q || a(q))) return q.value && !U.find((e) => "value" in e && e.value === q.value) && K((e) => {
|
|
74
|
+
if (e.find((e) => "value" in e && e.value === q.value)) return e;
|
|
75
75
|
let t = [...e];
|
|
76
76
|
return t.push({
|
|
77
|
-
label:
|
|
78
|
-
value:
|
|
77
|
+
label: q.label,
|
|
78
|
+
value: q.value
|
|
79
79
|
}), t;
|
|
80
80
|
}), () => {
|
|
81
|
-
|
|
81
|
+
q.value && !U.find((e) => "value" in e && e.value === q.value) && K([]);
|
|
82
82
|
};
|
|
83
83
|
}, [
|
|
84
84
|
O,
|
|
85
|
-
|
|
86
|
-
|
|
85
|
+
q,
|
|
86
|
+
U,
|
|
87
87
|
x
|
|
88
88
|
]);
|
|
89
|
-
let
|
|
90
|
-
let e = (e) => (e.label ? e.label : "").toLowerCase().indexOf(
|
|
89
|
+
let Q = f(() => {
|
|
90
|
+
let e = (e) => (e.label ? e.label : "").toLowerCase().indexOf(J.toLowerCase()) > -1, t = [...G, ...U].map((t) => a(t) ? {
|
|
91
91
|
icon: t.icon,
|
|
92
92
|
label: t.label,
|
|
93
93
|
options: t.options.filter(e)
|
|
94
94
|
} : t);
|
|
95
|
-
return t = t.filter((t) =>
|
|
95
|
+
return t = t.filter((t) => a(t) ? t.options.length > 0 : e(t)), t;
|
|
96
96
|
}, [
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
]),
|
|
101
|
-
e.stopPropagation(),
|
|
102
|
-
}, [
|
|
103
|
-
return /* @__PURE__ */
|
|
104
|
-
ref:
|
|
97
|
+
U,
|
|
98
|
+
G,
|
|
99
|
+
J
|
|
100
|
+
]), le = l((e) => {
|
|
101
|
+
e.stopPropagation(), P?.(void 0);
|
|
102
|
+
}, [P]), $ = f(() => ({ width: V?.width }), [V]);
|
|
103
|
+
return /* @__PURE__ */ g(i, {
|
|
104
|
+
ref: B,
|
|
105
105
|
containerTopOffset: D ? -26 : 4,
|
|
106
106
|
containerLeftOffset: 0,
|
|
107
|
-
onOpenChange:
|
|
107
|
+
onOpenChange: se,
|
|
108
108
|
open: M,
|
|
109
|
-
loading:
|
|
109
|
+
loading: R,
|
|
110
110
|
disabled: E,
|
|
111
|
-
children: [/* @__PURE__ */
|
|
112
|
-
className:
|
|
113
|
-
children: /* @__PURE__ */
|
|
114
|
-
id:
|
|
111
|
+
children: [/* @__PURE__ */ h(i.Trigger, {
|
|
112
|
+
className: z.trigger,
|
|
113
|
+
children: /* @__PURE__ */ g(r, {
|
|
114
|
+
id: te,
|
|
115
115
|
size: T,
|
|
116
116
|
clearable: A,
|
|
117
117
|
disabled: E,
|
|
118
118
|
label: w,
|
|
119
119
|
error: D,
|
|
120
|
-
loading:
|
|
121
|
-
onClear:
|
|
122
|
-
className: { iconFloatingContainer:
|
|
120
|
+
loading: R,
|
|
121
|
+
onClear: le,
|
|
122
|
+
className: { iconFloatingContainer: z.inputContainer },
|
|
123
123
|
value: x,
|
|
124
|
-
children: [/* @__PURE__ */
|
|
124
|
+
children: [/* @__PURE__ */ h("input", {
|
|
125
125
|
type: "hidden",
|
|
126
|
-
name:
|
|
126
|
+
name: ne,
|
|
127
127
|
className: "hidden invisible"
|
|
128
|
-
}), /* @__PURE__ */
|
|
128
|
+
}), /* @__PURE__ */ g(t, {
|
|
129
129
|
justify: "between",
|
|
130
130
|
items: "center",
|
|
131
131
|
className: "min-w-0",
|
|
132
132
|
grow: !0,
|
|
133
133
|
children: [
|
|
134
|
-
/* @__PURE__ */
|
|
135
|
-
className:
|
|
136
|
-
"mr-8": !!D ||
|
|
137
|
-
[
|
|
138
|
-
[
|
|
134
|
+
/* @__PURE__ */ h("div", {
|
|
135
|
+
className: _("truncate select-none", {
|
|
136
|
+
"mr-8": !!D || R,
|
|
137
|
+
[z.placeholder]: !q?.label,
|
|
138
|
+
[z.value]: !!q?.label
|
|
139
139
|
}),
|
|
140
|
-
title:
|
|
141
|
-
children:
|
|
140
|
+
title: q?.label ?? C,
|
|
141
|
+
children: q?.label ?? C
|
|
142
142
|
}),
|
|
143
|
-
!
|
|
144
|
-
|
|
143
|
+
!F && /* @__PURE__ */ h(n, { icon: "fa-solid fa-chevron-down" }),
|
|
144
|
+
F && /* @__PURE__ */ h(n, { icon: "fa-solid fa-chevron-up" })
|
|
145
145
|
]
|
|
146
146
|
})]
|
|
147
147
|
})
|
|
148
|
-
}),
|
|
149
|
-
className:
|
|
150
|
-
style:
|
|
148
|
+
}), V && /* @__PURE__ */ g(i.Content, {
|
|
149
|
+
className: z.listPopup,
|
|
150
|
+
style: $,
|
|
151
151
|
children: [
|
|
152
|
-
!
|
|
153
|
-
className:
|
|
154
|
-
children: [k &&
|
|
152
|
+
!R && /* @__PURE__ */ g("div", {
|
|
153
|
+
className: z.listPopupInner,
|
|
154
|
+
children: [k && F && /* @__PURE__ */ h(s, {
|
|
155
155
|
size: T,
|
|
156
|
-
value:
|
|
156
|
+
value: J,
|
|
157
157
|
placeholder: "Search...",
|
|
158
158
|
disabled: E,
|
|
159
|
-
autoFocus:
|
|
159
|
+
autoFocus: re,
|
|
160
160
|
allowCreateOptions: O,
|
|
161
|
-
onChange:
|
|
162
|
-
onSelect:
|
|
163
|
-
}),
|
|
164
|
-
value:
|
|
165
|
-
options:
|
|
161
|
+
onChange: oe,
|
|
162
|
+
onSelect: X
|
|
163
|
+
}), Q.length > 0 && /* @__PURE__ */ h(ee, {
|
|
164
|
+
value: q?.value,
|
|
165
|
+
options: Q,
|
|
166
166
|
size: T,
|
|
167
167
|
allowRemoveOptions: j,
|
|
168
|
-
onChange:
|
|
169
|
-
onRemove:
|
|
168
|
+
onChange: X,
|
|
169
|
+
onRemove: ce
|
|
170
170
|
})]
|
|
171
171
|
}),
|
|
172
|
-
!
|
|
172
|
+
!R && O && J && /* @__PURE__ */ h(o, {
|
|
173
173
|
className: "bg-slate-100 text-blue-500 dark:bg-zinc-700 dark:text-blue-400",
|
|
174
174
|
prefix: "Create:",
|
|
175
175
|
size: T,
|
|
176
|
-
label:
|
|
177
|
-
value:
|
|
178
|
-
onChange:
|
|
176
|
+
label: J,
|
|
177
|
+
value: J,
|
|
178
|
+
onChange: X
|
|
179
179
|
}),
|
|
180
|
-
|
|
181
|
-
className:
|
|
180
|
+
R && /* @__PURE__ */ h("div", {
|
|
181
|
+
className: z.listMessage,
|
|
182
182
|
children: "Loading..."
|
|
183
183
|
}),
|
|
184
|
-
!
|
|
185
|
-
className:
|
|
184
|
+
!R && Q.length === 0 && /* @__PURE__ */ h("div", {
|
|
185
|
+
className: z.listMessage,
|
|
186
186
|
children: "No Options"
|
|
187
187
|
})
|
|
188
188
|
]
|
|
@@ -190,4 +190,4 @@ var g = [], _ = s((s) => {
|
|
|
190
190
|
});
|
|
191
191
|
});
|
|
192
192
|
//#endregion
|
|
193
|
-
export {
|
|
193
|
+
export { y as default };
|
|
@@ -4,7 +4,7 @@ import { default as InputStyles } from '../Input/Input.styles';
|
|
|
4
4
|
import { useThemeSharedProps } from '../../hooks/useTheme';
|
|
5
5
|
import { ReactNode, RefObject, TextareaHTMLAttributes } from 'react';
|
|
6
6
|
export type TextAreaProps = {
|
|
7
|
-
ref?: RefObject<HTMLTextAreaElement>;
|
|
7
|
+
ref?: RefObject<HTMLTextAreaElement | null>;
|
|
8
8
|
label?: ReactNode;
|
|
9
9
|
placeholder?: string;
|
|
10
10
|
loading?: boolean;
|
|
@@ -14,5 +14,76 @@ export type TextAreaProps = {
|
|
|
14
14
|
error?: ErrorMessageProps['message'] | ErrorMessageProps['error'];
|
|
15
15
|
onChange?: (value: string) => void;
|
|
16
16
|
} & Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, 'className' | 'onChange' | 'size'> & Omit<useThemeSharedProps<typeof TextAreaStyles & typeof InputStyles, typeof variantKeys>, 'error'>;
|
|
17
|
-
declare const TextArea:
|
|
17
|
+
declare const TextArea: import('react').NamedExoticComponent<{
|
|
18
|
+
ref?: RefObject<HTMLTextAreaElement | null>;
|
|
19
|
+
label?: ReactNode;
|
|
20
|
+
placeholder?: string;
|
|
21
|
+
loading?: boolean;
|
|
22
|
+
disabled?: boolean;
|
|
23
|
+
clearable?: boolean;
|
|
24
|
+
value?: string;
|
|
25
|
+
error?: ErrorMessageProps["message"] | ErrorMessageProps["error"];
|
|
26
|
+
onChange?: (value: string) => void;
|
|
27
|
+
} & Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, "className" | "onChange" | "size"> & Omit<useThemeSharedProps<{
|
|
28
|
+
input: (props?: ({
|
|
29
|
+
intent?: "custom" | "primary" | null | undefined;
|
|
30
|
+
disabled?: boolean | null | undefined;
|
|
31
|
+
error?: boolean | null | undefined;
|
|
32
|
+
size?: "xs" | "md" | "sm" | "custom" | null | undefined;
|
|
33
|
+
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
34
|
+
iconFloatingContainer: (props?: ({
|
|
35
|
+
error?: boolean | null | undefined;
|
|
36
|
+
size?: "xs" | "md" | "sm" | "custom" | null | undefined;
|
|
37
|
+
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
38
|
+
inputContainer: (props?: ({
|
|
39
|
+
error?: boolean | null | undefined;
|
|
40
|
+
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
41
|
+
} & {
|
|
42
|
+
root: (props?: ({
|
|
43
|
+
intent?: "custom" | "primary" | null | undefined;
|
|
44
|
+
disabled?: boolean | null | undefined;
|
|
45
|
+
size?: "xs" | "md" | "sm" | "custom" | null | undefined;
|
|
46
|
+
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
47
|
+
inputContainer: (props?: ({
|
|
48
|
+
intent?: "custom" | "primary" | null | undefined;
|
|
49
|
+
error?: boolean | null | undefined;
|
|
50
|
+
disabled?: boolean | null | undefined;
|
|
51
|
+
size?: "xs" | "md" | "sm" | "custom" | null | undefined;
|
|
52
|
+
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
53
|
+
input: (props?: ({
|
|
54
|
+
intent?: "primary" | null | undefined;
|
|
55
|
+
error?: boolean | null | undefined;
|
|
56
|
+
disabled?: boolean | null | undefined;
|
|
57
|
+
size?: "xs" | "md" | "sm" | "custom" | null | undefined;
|
|
58
|
+
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
59
|
+
label: (props?: ({
|
|
60
|
+
inline?: boolean | null | undefined;
|
|
61
|
+
disabled?: boolean | null | undefined;
|
|
62
|
+
size?: "xs" | "md" | "sm" | "custom" | null | undefined;
|
|
63
|
+
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
64
|
+
iconFloatingContainer: (props?: ({
|
|
65
|
+
intent?: "primary" | null | undefined;
|
|
66
|
+
size?: "xs" | "md" | "sm" | "custom" | null | undefined;
|
|
67
|
+
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
68
|
+
icon: (props?: ({
|
|
69
|
+
intent?: "primary" | null | undefined;
|
|
70
|
+
error?: boolean | null | undefined;
|
|
71
|
+
size?: "xs" | "md" | "sm" | "custom" | null | undefined;
|
|
72
|
+
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
73
|
+
iconError: (props?: ({
|
|
74
|
+
intent?: "primary" | null | undefined;
|
|
75
|
+
error?: boolean | null | undefined;
|
|
76
|
+
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
77
|
+
iconClear: (props?: import('class-variance-authority/types').ClassProp | undefined) => string;
|
|
78
|
+
iconLoading: (props?: import('class-variance-authority/types').ClassProp | undefined) => string;
|
|
79
|
+
}, {
|
|
80
|
+
readonly intent: readonly ["primary", "custom"];
|
|
81
|
+
readonly size: readonly ["xs", "sm", "md", "custom"];
|
|
82
|
+
readonly disabled: readonly [true, false];
|
|
83
|
+
readonly error: readonly [true, false];
|
|
84
|
+
}>, "error">> & {
|
|
85
|
+
readonly type: ({ ref, className, id, children, label, placeholder, loading, disabled, clearable, size, intent, value, error, onChange, ...textareaProps }: TextAreaProps) => import("react/jsx-runtime").JSX.Element;
|
|
86
|
+
} & {
|
|
87
|
+
Icon: ({ className, children, icon, active, disabled, testId, intent, size, cursor, title, ...props }: import('../Icon').IconProps) => string | number | bigint | true | Iterable<ReactNode> | Promise<string | number | bigint | boolean | import('react').ReactPortal | import('react').ReactElement<unknown, string | import('react').JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | import("react/jsx-runtime").JSX.Element;
|
|
88
|
+
};
|
|
18
89
|
export default TextArea;
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import { omit as e } from "../../helpers/lodash/omit.js";
|
|
2
2
|
import t from "../../hooks/useTheme/index.js";
|
|
3
|
-
import n from "../
|
|
4
|
-
import
|
|
5
|
-
import {
|
|
6
|
-
|
|
7
|
-
var
|
|
3
|
+
import n from "../Icon/index.js";
|
|
4
|
+
import r from "../Input/InputContainer.js";
|
|
5
|
+
import { memo as i, useCallback as a, useMemo as o } from "react";
|
|
6
|
+
import { jsx as s, jsxs as c } from "react/jsx-runtime";
|
|
7
|
+
var l = Object.assign(i(({ ref: n, className: i = "", id: l, children: u, label: d = "", placeholder: f = "", loading: p = !1, disabled: m = !1, clearable: h = !1, size: g, intent: _, value: v = "", error: y = "", onChange: b, ...x }) => {
|
|
8
8
|
let S = t("TextArea", {
|
|
9
|
-
className:
|
|
9
|
+
className: i,
|
|
10
10
|
componentKey: [
|
|
11
11
|
"root",
|
|
12
12
|
"inputContainer",
|
|
@@ -22,10 +22,10 @@ var s = ({ ref: s, className: c = "", id: l, children: u, label: d = "", placeho
|
|
|
22
22
|
disabled: m,
|
|
23
23
|
error: !!y
|
|
24
24
|
}
|
|
25
|
-
}), C =
|
|
25
|
+
}), C = o(() => e(S, ["input"]), [S]), w = a((e) => {
|
|
26
26
|
b?.(e.target.value);
|
|
27
27
|
}, [b]);
|
|
28
|
-
return /* @__PURE__ */
|
|
28
|
+
return /* @__PURE__ */ c(r, {
|
|
29
29
|
className: C,
|
|
30
30
|
id: l,
|
|
31
31
|
label: d,
|
|
@@ -36,9 +36,9 @@ var s = ({ ref: s, className: c = "", id: l, children: u, label: d = "", placeho
|
|
|
36
36
|
loading: p,
|
|
37
37
|
clearable: h,
|
|
38
38
|
value: v,
|
|
39
|
-
onClear:
|
|
40
|
-
children: [u, /* @__PURE__ */
|
|
41
|
-
ref:
|
|
39
|
+
onClear: a(() => b?.(""), [b]),
|
|
40
|
+
children: [u, /* @__PURE__ */ s("textarea", {
|
|
41
|
+
ref: n,
|
|
42
42
|
id: l,
|
|
43
43
|
placeholder: f,
|
|
44
44
|
className: S.input,
|
|
@@ -48,6 +48,6 @@ var s = ({ ref: s, className: c = "", id: l, children: u, label: d = "", placeho
|
|
|
48
48
|
...x
|
|
49
49
|
})]
|
|
50
50
|
});
|
|
51
|
-
};
|
|
51
|
+
}), { Icon: n });
|
|
52
52
|
//#endregion
|
|
53
|
-
export {
|
|
53
|
+
export { l as default };
|