@vkzstudio/muza-ui 1.0.20 → 1.0.22
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/Dialog/Dialog.js +8 -8
- package/dist/components/FileUpload/FileItem.js +1 -1
- package/dist/components/FileUpload/FileUpload.d.ts +9 -1
- package/dist/components/FileUpload/FileUpload.d.ts.map +1 -1
- package/dist/components/FileUpload/FileUpload.js +152 -117
- package/dist/components/FileUpload/FileUpload.stories.d.ts +2 -0
- package/dist/components/FileUpload/FileUpload.stories.d.ts.map +1 -1
- package/dist/components/FormField/FormField.d.ts +4 -0
- package/dist/components/FormField/FormField.d.ts.map +1 -1
- package/dist/components/FormField/FormField.js +62 -49
- package/dist/components/Input/Input.d.ts +4 -0
- package/dist/components/Input/Input.d.ts.map +1 -1
- package/dist/components/Input/Input.js +25 -21
- package/dist/components/Input/Input.stories.d.ts.map +1 -1
- package/dist/components/MultiSelect/MultiSelect.d.ts +4 -0
- package/dist/components/MultiSelect/MultiSelect.d.ts.map +1 -1
- package/dist/components/MultiSelect/MultiSelect.js +42 -38
- package/dist/components/MultiSelect/MultiSelect.stories.d.ts.map +1 -1
- package/dist/components/Select/Select.d.ts +4 -0
- package/dist/components/Select/Select.d.ts.map +1 -1
- package/dist/components/Select/Select.js +36 -32
- package/dist/components/Select/Select.stories.d.ts.map +1 -1
- package/dist/components/TextEditor/TextEditor.d.ts.map +1 -1
- package/dist/components/TextEditor/TextEditor.js +66 -71
- package/dist/components/TextEditor/ToolbarButton.js +6 -6
- package/dist/components/Textarea/Textarea.d.ts +7 -1
- package/dist/components/Textarea/Textarea.d.ts.map +1 -1
- package/dist/components/Textarea/Textarea.js +106 -53
- package/dist/components/Textarea/Textarea.stories.d.ts +1 -0
- package/dist/components/Textarea/Textarea.stories.d.ts.map +1 -1
- package/dist/muza-ui.css +1 -1
- package/dist/translations/locales/cs.d.ts.map +1 -1
- package/dist/translations/locales/cs.js +1 -0
- package/dist/translations/locales/en.d.ts.map +1 -1
- package/dist/translations/locales/en.js +1 -0
- package/dist/translations/locales/sk.d.ts.map +1 -1
- package/dist/translations/locales/sk.js +1 -0
- package/dist/translations/types.d.ts +2 -0
- package/dist/translations/types.d.ts.map +1 -1
- package/package.json +1 -1
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { jsx as
|
|
2
|
-
import { forwardRef as
|
|
1
|
+
import { jsx as s, jsxs as k } from "react/jsx-runtime";
|
|
2
|
+
import { forwardRef as O, useEffect as _, useImperativeHandle as $, useRef as I } from "react";
|
|
3
3
|
import { Link as K } from "../../node_modules/@tiptap/extension-link/dist/index.js";
|
|
4
4
|
import { Placeholder as W } from "../../node_modules/@tiptap/extension-placeholder/dist/index.js";
|
|
5
5
|
import { useEditor as q, EditorContent as D } from "../../node_modules/@tiptap/react/dist/index.js";
|
|
@@ -10,10 +10,8 @@ import { LinkBubbleMenu as X } from "./LinkBubbleMenu.js";
|
|
|
10
10
|
import { useLinkEditor as Y } from "./useLinkEditor.js";
|
|
11
11
|
import { useMuzaTranslations as Z } from "../../translations/TranslationContext.js";
|
|
12
12
|
import { FormField as tt } from "../FormField/FormField.js";
|
|
13
|
-
import { cn as
|
|
14
|
-
|
|
15
|
-
import { InfoCircleBold as nt } from "@solar-icons/react-perf";
|
|
16
|
-
const lt = J(
|
|
13
|
+
import { cn as b } from "../../utils/cn.js";
|
|
14
|
+
const et = J(
|
|
17
15
|
[
|
|
18
16
|
"overflow-hidden rounded-xl border bg-surface-base-secondary transition-colors",
|
|
19
17
|
"focus-within:border-comp-texteditor-stroke-focused",
|
|
@@ -32,41 +30,41 @@ const lt = J(
|
|
|
32
30
|
state: "default"
|
|
33
31
|
}
|
|
34
32
|
}
|
|
35
|
-
),
|
|
33
|
+
), rt = O(
|
|
36
34
|
({
|
|
37
|
-
value:
|
|
38
|
-
defaultValue:
|
|
35
|
+
value: i,
|
|
36
|
+
defaultValue: g,
|
|
39
37
|
onChange: d,
|
|
40
|
-
onBlur:
|
|
41
|
-
onFocus:
|
|
42
|
-
placeholder:
|
|
38
|
+
onBlur: y,
|
|
39
|
+
onFocus: v,
|
|
40
|
+
placeholder: L = "",
|
|
43
41
|
label: E,
|
|
44
|
-
hint:
|
|
45
|
-
infoTooltip:
|
|
46
|
-
disabled:
|
|
42
|
+
hint: T,
|
|
43
|
+
infoTooltip: C,
|
|
44
|
+
disabled: o = !1,
|
|
47
45
|
readOnly: c = !1,
|
|
48
46
|
required: M,
|
|
49
47
|
disableRequiredAsterisk: H,
|
|
50
|
-
error:
|
|
48
|
+
error: l,
|
|
51
49
|
toolbar: n = {},
|
|
52
|
-
toolbarExtra:
|
|
50
|
+
toolbarExtra: f,
|
|
53
51
|
extensions: w = [],
|
|
54
52
|
minHeight: z = 200,
|
|
55
53
|
maxHeight: a,
|
|
56
54
|
resizable: P = !0,
|
|
57
|
-
className:
|
|
58
|
-
contentClassName:
|
|
59
|
-
unstyled:
|
|
60
|
-
editorClassName:
|
|
55
|
+
className: R,
|
|
56
|
+
contentClassName: U,
|
|
57
|
+
unstyled: F = !1,
|
|
58
|
+
editorClassName: N
|
|
61
59
|
}, S) => {
|
|
62
|
-
const
|
|
60
|
+
const p = Z(), m = {
|
|
63
61
|
history: n.history ?? !0,
|
|
64
62
|
headings: n.headings ?? !0,
|
|
65
63
|
formatting: n.formatting ?? !0,
|
|
66
64
|
lists: n.lists ?? !0,
|
|
67
65
|
link: n.link ?? !0,
|
|
68
66
|
clearFormatting: n.clearFormatting ?? !0
|
|
69
|
-
}, V = !!
|
|
67
|
+
}, V = !!f || Object.values(m).some((e) => e !== !1), t = q({
|
|
70
68
|
extensions: [
|
|
71
69
|
G.configure({
|
|
72
70
|
heading: { levels: [1, 2, 3] },
|
|
@@ -89,23 +87,23 @@ const lt = J(
|
|
|
89
87
|
})
|
|
90
88
|
] : [],
|
|
91
89
|
W.configure({
|
|
92
|
-
placeholder: ({ editor: e }) => e.state.doc.textContent.length === 0 ?
|
|
90
|
+
placeholder: ({ editor: e }) => e.state.doc.textContent.length === 0 ? L : ""
|
|
93
91
|
}),
|
|
94
92
|
...w
|
|
95
93
|
],
|
|
96
|
-
content:
|
|
97
|
-
editable: !
|
|
94
|
+
content: i ?? g ?? "",
|
|
95
|
+
editable: !o && !c,
|
|
98
96
|
onUpdate: ({ editor: e }) => {
|
|
99
|
-
const
|
|
100
|
-
d == null || d(
|
|
97
|
+
const x = e.getText().trim(), h = e.getHTML();
|
|
98
|
+
d == null || d(x.length === 0 ? "" : h);
|
|
101
99
|
},
|
|
102
|
-
onBlur:
|
|
103
|
-
onFocus:
|
|
100
|
+
onBlur: y,
|
|
101
|
+
onFocus: v,
|
|
104
102
|
editorProps: {
|
|
105
103
|
attributes: {
|
|
106
|
-
class:
|
|
104
|
+
class: b(
|
|
107
105
|
"outline-none text-sm",
|
|
108
|
-
!
|
|
106
|
+
!F && [
|
|
109
107
|
// Headings
|
|
110
108
|
"[&_h1]:text-3xl [&_h1]:font-semibold [&_h1]:text-text-dark-primary-def [&_h1]:my-3",
|
|
111
109
|
"[&_h2]:text-2xl [&_h2]:font-semibold [&_h2]:text-text-dark-primary-def [&_h2]:my-3",
|
|
@@ -125,7 +123,7 @@ const lt = J(
|
|
|
125
123
|
],
|
|
126
124
|
// Placeholder (only when the entire editor is empty — controlled via placeholder function)
|
|
127
125
|
"[&_.is-empty]:before:content-[attr(data-placeholder)] [&_.is-empty]:before:text-comp-input-text-placeholder [&_.is-empty]:before:float-left [&_.is-empty]:before:h-0 [&_.is-empty]:before:pointer-events-none",
|
|
128
|
-
|
|
126
|
+
N
|
|
129
127
|
),
|
|
130
128
|
// Inline styles needed because Tailwind CSS 4 JIT doesn't apply to dynamically created elements
|
|
131
129
|
style: "width: 100%; min-height: 100%; max-width: none;",
|
|
@@ -134,14 +132,14 @@ const lt = J(
|
|
|
134
132
|
}
|
|
135
133
|
}
|
|
136
134
|
});
|
|
137
|
-
|
|
138
|
-
if (t &&
|
|
135
|
+
_(() => {
|
|
136
|
+
if (t && i !== void 0) {
|
|
139
137
|
const e = t.getHTML();
|
|
140
|
-
(
|
|
138
|
+
(i || "<p></p>") !== (e || "<p></p>") && t.commands.setContent(i, !1);
|
|
141
139
|
}
|
|
142
|
-
}, [t,
|
|
143
|
-
t && t.setEditable(!
|
|
144
|
-
}, [t,
|
|
140
|
+
}, [t, i]), _(() => {
|
|
141
|
+
t && t.setEditable(!o && !c);
|
|
142
|
+
}, [t, o, c]), $(
|
|
145
143
|
S,
|
|
146
144
|
() => ({
|
|
147
145
|
editor: t,
|
|
@@ -154,62 +152,59 @@ const lt = J(
|
|
|
154
152
|
}),
|
|
155
153
|
[t]
|
|
156
154
|
);
|
|
157
|
-
const
|
|
155
|
+
const r = Y(t), u = I(null), j = o ? "disabled" : l ? "error" : "default", A = typeof l == "string" ? l : void 0, B = {
|
|
158
156
|
minHeight: `${Math.max(z, 200)}px`,
|
|
159
157
|
maxHeight: a ? typeof a == "number" ? `${a}px` : a : void 0,
|
|
160
|
-
resize: P && !
|
|
158
|
+
resize: P && !o ? "vertical" : "none"
|
|
161
159
|
};
|
|
162
|
-
return /* @__PURE__ */
|
|
160
|
+
return /* @__PURE__ */ s("div", { ref: u, children: /* @__PURE__ */ s(
|
|
163
161
|
tt,
|
|
164
162
|
{
|
|
165
163
|
label: E,
|
|
166
|
-
hint: A ||
|
|
167
|
-
error: !!
|
|
164
|
+
hint: A || T,
|
|
165
|
+
error: !!l,
|
|
168
166
|
required: M,
|
|
169
167
|
disableRequiredAsterisk: H,
|
|
170
|
-
className:
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
/* @__PURE__ */
|
|
174
|
-
] }) }) : void 0,
|
|
175
|
-
children: /* @__PURE__ */ f("div", { className: lt({ state: j }), children: [
|
|
176
|
-
V && /* @__PURE__ */ r(
|
|
168
|
+
className: R,
|
|
169
|
+
infoTooltip: C,
|
|
170
|
+
children: /* @__PURE__ */ k("div", { className: et({ state: j }), children: [
|
|
171
|
+
V && /* @__PURE__ */ s(
|
|
177
172
|
Q,
|
|
178
173
|
{
|
|
179
174
|
editor: t,
|
|
180
175
|
toolbarConfig: m,
|
|
181
|
-
disabled:
|
|
182
|
-
translations:
|
|
183
|
-
onLinkClick:
|
|
184
|
-
toolbarExtra:
|
|
176
|
+
disabled: o,
|
|
177
|
+
translations: p.textEditor,
|
|
178
|
+
onLinkClick: r.handleLinkToolbarClick,
|
|
179
|
+
toolbarExtra: f
|
|
185
180
|
}
|
|
186
181
|
),
|
|
187
|
-
/* @__PURE__ */
|
|
182
|
+
/* @__PURE__ */ k(
|
|
188
183
|
"div",
|
|
189
184
|
{
|
|
190
|
-
className:
|
|
185
|
+
className: b(
|
|
191
186
|
"relative overflow-auto px-2xl py-xl",
|
|
192
187
|
"mr-[calc(var(--spacing-xl)/2)]",
|
|
193
188
|
"pr-[calc(var(--spacing-2xl)-var(--spacing-xl)/2)]",
|
|
194
189
|
// Compensate for scrollbar offset
|
|
195
|
-
|
|
190
|
+
U
|
|
196
191
|
),
|
|
197
192
|
style: B,
|
|
198
193
|
children: [
|
|
199
|
-
/* @__PURE__ */
|
|
200
|
-
t && m.link && /* @__PURE__ */
|
|
194
|
+
/* @__PURE__ */ s(D, { editor: t, className: "h-full w-full" }),
|
|
195
|
+
t && m.link && /* @__PURE__ */ s(
|
|
201
196
|
X,
|
|
202
197
|
{
|
|
203
198
|
editor: t,
|
|
204
|
-
containerRef:
|
|
205
|
-
linkUrl:
|
|
206
|
-
isEditingLink:
|
|
207
|
-
onUrlChange:
|
|
208
|
-
onEdit:
|
|
209
|
-
onSave:
|
|
210
|
-
onRemove:
|
|
211
|
-
onCancel:
|
|
212
|
-
translations:
|
|
199
|
+
containerRef: u,
|
|
200
|
+
linkUrl: r.linkUrl,
|
|
201
|
+
isEditingLink: r.isEditingLink,
|
|
202
|
+
onUrlChange: r.setLinkUrl,
|
|
203
|
+
onEdit: r.handleOpenLinkEdit,
|
|
204
|
+
onSave: r.handleSaveLink,
|
|
205
|
+
onRemove: r.handleRemoveLink,
|
|
206
|
+
onCancel: r.handleCancelEdit,
|
|
207
|
+
translations: p.textEditor
|
|
213
208
|
}
|
|
214
209
|
)
|
|
215
210
|
]
|
|
@@ -220,7 +215,7 @@ const lt = J(
|
|
|
220
215
|
) });
|
|
221
216
|
}
|
|
222
217
|
);
|
|
223
|
-
|
|
218
|
+
rt.displayName = "TextEditor";
|
|
224
219
|
export {
|
|
225
|
-
|
|
220
|
+
rt as TextEditor
|
|
226
221
|
};
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { jsx as t, jsxs as m } from "react/jsx-runtime";
|
|
2
2
|
import { forwardRef as p } from "react";
|
|
3
3
|
import { cva as u } from "class-variance-authority";
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
4
|
+
import { cn as b } from "../../utils/cn.js";
|
|
5
|
+
import { TooltipProvider as f, Tooltip as x, TooltipTrigger as g, TooltipContent as h } from "../Tooltip/Tooltip.js";
|
|
6
6
|
const v = u(
|
|
7
7
|
[
|
|
8
8
|
"flex shrink-0 items-center justify-center",
|
|
@@ -46,7 +46,7 @@ const v = u(
|
|
|
46
46
|
{
|
|
47
47
|
type: "button",
|
|
48
48
|
ref: l,
|
|
49
|
-
className:
|
|
49
|
+
className: b(v({ state: o ? "disabled" : e ? "active" : "default", className: s })),
|
|
50
50
|
disabled: o,
|
|
51
51
|
"aria-label": r,
|
|
52
52
|
"aria-pressed": e,
|
|
@@ -55,9 +55,9 @@ const v = u(
|
|
|
55
55
|
children: a
|
|
56
56
|
}
|
|
57
57
|
);
|
|
58
|
-
return c ? /* @__PURE__ */ t(
|
|
59
|
-
/* @__PURE__ */ t(
|
|
60
|
-
/* @__PURE__ */ t(
|
|
58
|
+
return c ? /* @__PURE__ */ t(f, { children: /* @__PURE__ */ m(x, { children: [
|
|
59
|
+
/* @__PURE__ */ t(g, { asChild: !0, children: i }),
|
|
60
|
+
/* @__PURE__ */ t(h, { children: d ?? r })
|
|
61
61
|
] }) }) : i;
|
|
62
62
|
}
|
|
63
63
|
);
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { ComponentProps } from 'react';
|
|
1
|
+
import { ComponentProps, ReactNode } from 'react';
|
|
2
2
|
/** Props for the Textarea component. */
|
|
3
3
|
export interface TextareaProps extends ComponentProps<'textarea'> {
|
|
4
4
|
/** Controls manual resize behavior via drag handle. @default 'none' */
|
|
@@ -19,6 +19,12 @@ export interface TextareaProps extends ComponentProps<'textarea'> {
|
|
|
19
19
|
name?: string;
|
|
20
20
|
/** Automatically grows textarea height to fit content. @default false */
|
|
21
21
|
autoResize?: boolean;
|
|
22
|
+
/** Extra content rendered inline next to the label (e.g. a tooltip icon). */
|
|
23
|
+
labelExtra?: ReactNode;
|
|
24
|
+
/** Tooltip content shown in an info icon next to the label. Overridden by `labelExtra` if both are provided. */
|
|
25
|
+
infoTooltip?: string;
|
|
26
|
+
/** Displays a character counter (currentCount/maxLength) in the label row. Requires `maxLength` to be set. @default false */
|
|
27
|
+
showCharacterCount?: boolean;
|
|
22
28
|
}
|
|
23
29
|
export declare const Textarea: import('react').ForwardRefExoticComponent<Omit<TextareaProps, "ref"> & import('react').RefAttributes<HTMLTextAreaElement>>;
|
|
24
30
|
//# sourceMappingURL=Textarea.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Textarea.d.ts","sourceRoot":"","sources":["../../../src/components/Textarea/Textarea.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"Textarea.d.ts","sourceRoot":"","sources":["../../../src/components/Textarea/Textarea.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,cAAc,EACnB,KAAK,SAAS,EAKf,MAAM,OAAO,CAAA;AA+Dd,wCAAwC;AACxC,MAAM,WAAW,aAAc,SAAQ,cAAc,CAAC,UAAU,CAAC;IAC/D,uEAAuE;IACvE,MAAM,CAAC,EAAE,MAAM,GAAG,UAAU,GAAG,YAAY,GAAG,MAAM,CAAA;IACpD,+CAA+C;IAC/C,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,6FAA6F;IAC7F,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,mDAAmD;IACnD,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,sFAAsF;IACtF,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,gGAAgG;IAChG,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,+EAA+E;IAC/E,uBAAuB,CAAC,EAAE,OAAO,CAAA;IACjC,0CAA0C;IAC1C,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,yEAAyE;IACzE,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,6EAA6E;IAC7E,UAAU,CAAC,EAAE,SAAS,CAAA;IACtB,gHAAgH;IAChH,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,6HAA6H;IAC7H,kBAAkB,CAAC,EAAE,OAAO,CAAA;CAC7B;AAED,eAAO,MAAM,QAAQ,4HA0GpB,CAAA"}
|
|
@@ -1,22 +1,20 @@
|
|
|
1
|
-
import { jsx as
|
|
2
|
-
import { forwardRef as
|
|
3
|
-
import { cva as
|
|
4
|
-
import { FormField as
|
|
5
|
-
import { cn as
|
|
6
|
-
import { typographyVariants as
|
|
7
|
-
const
|
|
1
|
+
import { jsxs as G, jsx as l } from "react/jsx-runtime";
|
|
2
|
+
import { forwardRef as H, useId as U, useRef as W, useState as B } from "react";
|
|
3
|
+
import { cva as h } from "class-variance-authority";
|
|
4
|
+
import { FormField as D } from "../FormField/FormField.js";
|
|
5
|
+
import { cn as x } from "../../utils/cn.js";
|
|
6
|
+
import { typographyVariants as b } from "../Typography/Typography.js";
|
|
7
|
+
const E = h(
|
|
8
8
|
[
|
|
9
|
-
|
|
9
|
+
b({
|
|
10
10
|
variant: "body",
|
|
11
11
|
weight: "medium",
|
|
12
12
|
size: "base"
|
|
13
13
|
}),
|
|
14
|
-
"w-full
|
|
14
|
+
"w-full font-text text-comp-input-text-primary transition-colors outline-none",
|
|
15
15
|
"placeholder:font-regular placeholder:text-comp-input-text-placeholder",
|
|
16
|
-
"
|
|
17
|
-
"
|
|
18
|
-
"disabled:cursor-not-allowed disabled:border-comp-input-stroke-disabled disabled:bg-comp-input-fill-disabled",
|
|
19
|
-
"outline-none focus:border-comp-input-stroke-focused"
|
|
16
|
+
"mr-[calc(var(--spacing-xl)/2)] pt-xl pr-[calc(var(--spacing-comp-input-p-hor)-var(--spacing-xl)/2)] pb-[calc(var(--spacing-xl)/2)] pl-comp-input-p-hor",
|
|
17
|
+
"disabled:cursor-not-allowed"
|
|
20
18
|
],
|
|
21
19
|
{
|
|
22
20
|
variants: {
|
|
@@ -38,56 +36,111 @@ const $ = k(
|
|
|
38
36
|
resize: "none"
|
|
39
37
|
}
|
|
40
38
|
}
|
|
41
|
-
),
|
|
39
|
+
), J = h(
|
|
40
|
+
[
|
|
41
|
+
"overflow-hidden rounded-xl border border-comp-input-stroke-def bg-comp-input-fill-def transition-colors",
|
|
42
|
+
"focus-within:border-comp-texteditor-stroke-focused",
|
|
43
|
+
"pb-[calc(var(--spacing-xl)/2)]",
|
|
44
|
+
// Offset scrollbar to make resize handle visible
|
|
45
|
+
"flex"
|
|
46
|
+
],
|
|
47
|
+
{
|
|
48
|
+
variants: {
|
|
49
|
+
state: {
|
|
50
|
+
default: "border-comp-texteditor-stroke-def hover:border-comp-texteditor-stroke-hover",
|
|
51
|
+
disabled: "cursor-not-allowed border-comp-input-stroke-disabled bg-comp-input-fill-disabled",
|
|
52
|
+
error: "border-comp-texteditor-stroke-error"
|
|
53
|
+
}
|
|
54
|
+
},
|
|
55
|
+
defaultVariants: {
|
|
56
|
+
state: "default"
|
|
57
|
+
}
|
|
58
|
+
}
|
|
59
|
+
), K = H(
|
|
42
60
|
({
|
|
43
|
-
className:
|
|
44
|
-
label:
|
|
45
|
-
hint:
|
|
46
|
-
id:
|
|
47
|
-
error:
|
|
48
|
-
resize:
|
|
49
|
-
autoResize:
|
|
50
|
-
errorMessage:
|
|
51
|
-
required:
|
|
52
|
-
disableRequiredAsterisk:
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
+
className: g,
|
|
62
|
+
label: v,
|
|
63
|
+
hint: y,
|
|
64
|
+
id: w,
|
|
65
|
+
error: e,
|
|
66
|
+
resize: z,
|
|
67
|
+
autoResize: s,
|
|
68
|
+
errorMessage: c,
|
|
69
|
+
required: o,
|
|
70
|
+
disableRequiredAsterisk: k,
|
|
71
|
+
labelExtra: I,
|
|
72
|
+
infoTooltip: N,
|
|
73
|
+
showCharacterCount: R,
|
|
74
|
+
value: a,
|
|
75
|
+
defaultValue: d,
|
|
76
|
+
onChange: n,
|
|
77
|
+
disabled: p,
|
|
78
|
+
...i
|
|
79
|
+
}, u) => {
|
|
80
|
+
const V = U(), r = w ?? V, F = `${r}-hint`, S = `${r}-label`, $ = W(null), m = (typeof u == "function" ? null : u) ?? $, f = a !== void 0, [j, A] = B(
|
|
81
|
+
() => String(d ?? "").length
|
|
82
|
+
), L = f ? String(a).length : j, T = () => {
|
|
83
|
+
const t = m.current;
|
|
84
|
+
t && (t.style.height = "auto", t.style.height = `${t.scrollHeight}px`);
|
|
85
|
+
}, C = R && i.maxLength != null ? /* @__PURE__ */ G(
|
|
86
|
+
"span",
|
|
87
|
+
{
|
|
88
|
+
className: x(
|
|
89
|
+
b({
|
|
90
|
+
variant: "body",
|
|
91
|
+
weight: "regular",
|
|
92
|
+
size: "sm"
|
|
93
|
+
}),
|
|
94
|
+
"text-comp-input-text-secondary"
|
|
95
|
+
),
|
|
96
|
+
children: [
|
|
97
|
+
L,
|
|
98
|
+
"/",
|
|
99
|
+
i.maxLength
|
|
100
|
+
]
|
|
101
|
+
}
|
|
102
|
+
) : void 0;
|
|
103
|
+
return /* @__PURE__ */ l(
|
|
104
|
+
D,
|
|
61
105
|
{
|
|
62
|
-
label:
|
|
63
|
-
hint:
|
|
64
|
-
error:
|
|
65
|
-
required:
|
|
66
|
-
disableRequiredAsterisk:
|
|
67
|
-
htmlFor:
|
|
68
|
-
labelId:
|
|
69
|
-
hintId:
|
|
70
|
-
|
|
106
|
+
label: v,
|
|
107
|
+
hint: e && c ? c : y,
|
|
108
|
+
error: e,
|
|
109
|
+
required: o,
|
|
110
|
+
disableRequiredAsterisk: k,
|
|
111
|
+
htmlFor: r,
|
|
112
|
+
labelId: S,
|
|
113
|
+
hintId: F,
|
|
114
|
+
labelExtra: I,
|
|
115
|
+
infoTooltip: N,
|
|
116
|
+
labelRight: C,
|
|
117
|
+
children: /* @__PURE__ */ l("div", { className: J({ state: p ? "disabled" : e ? "error" : "default" }), children: /* @__PURE__ */ l(
|
|
71
118
|
"textarea",
|
|
72
119
|
{
|
|
73
120
|
"data-slot": "textarea",
|
|
74
|
-
ref:
|
|
75
|
-
id:
|
|
76
|
-
required:
|
|
77
|
-
"aria-required":
|
|
78
|
-
className:
|
|
79
|
-
|
|
80
|
-
|
|
121
|
+
ref: m,
|
|
122
|
+
id: r,
|
|
123
|
+
required: o,
|
|
124
|
+
"aria-required": o,
|
|
125
|
+
className: x(
|
|
126
|
+
E({ error: e, resize: z, autoResize: s }),
|
|
127
|
+
g
|
|
81
128
|
),
|
|
82
|
-
|
|
83
|
-
|
|
129
|
+
value: a,
|
|
130
|
+
defaultValue: d,
|
|
131
|
+
onChange: (t) => {
|
|
132
|
+
f || A(t.target.value.length), n == null || n(t);
|
|
133
|
+
},
|
|
134
|
+
disabled: p,
|
|
135
|
+
...i,
|
|
136
|
+
onInput: s ? T : void 0
|
|
84
137
|
}
|
|
85
|
-
)
|
|
138
|
+
) })
|
|
86
139
|
}
|
|
87
140
|
);
|
|
88
141
|
}
|
|
89
142
|
);
|
|
90
|
-
|
|
143
|
+
K.displayName = "Textarea";
|
|
91
144
|
export {
|
|
92
|
-
|
|
145
|
+
K as Textarea
|
|
93
146
|
};
|
|
@@ -10,5 +10,6 @@ export declare const Error: Story;
|
|
|
10
10
|
export declare const Disabled: Story;
|
|
11
11
|
export declare const Required: Story;
|
|
12
12
|
export declare const AutoResize: Story;
|
|
13
|
+
export declare const WithCharacterCounter: Story;
|
|
13
14
|
export declare const ResizableHandles: Story;
|
|
14
15
|
//# sourceMappingURL=Textarea.stories.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Textarea.stories.d.ts","sourceRoot":"","sources":["../../../src/components/Textarea/Textarea.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAC3D,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,QAAQ,
|
|
1
|
+
{"version":3,"file":"Textarea.stories.d.ts","sourceRoot":"","sources":["../../../src/components/Textarea/Textarea.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAC3D,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,QAAQ,CAyG/B,CAAA;AAED,eAAe,IAAI,CAAA;AACnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,QAAQ,CAAC,CAAA;AAEtC,eAAO,MAAM,OAAO,EAAE,KAcrB,CAAA;AAED,eAAO,MAAM,gBAAgB,EAAE,KAgB9B,CAAA;AAED,eAAO,MAAM,MAAM,EAAE,KAgBpB,CAAA;AAED,eAAO,MAAM,KAAK,EAAE,KAiBnB,CAAA;AAED,eAAO,MAAM,QAAQ,EAAE,KAgBtB,CAAA;AAED,eAAO,MAAM,QAAQ,EAAE,KAgBtB,CAAA;AAED,eAAO,MAAM,UAAU,EAAE,KAiBxB,CAAA;AAED,eAAO,MAAM,oBAAoB,EAAE,KAiBlC,CAAA;AAED,eAAO,MAAM,gBAAgB,EAAE,KAiB9B,CAAA"}
|