@versini/ui-textarea 1.4.1 → 2.0.1

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 (4) hide show
  1. package/dist/index.d.ts +1 -2
  2. package/dist/index.js +254 -280
  3. package/dist/style.css +1 -1
  4. package/package.json +4 -5
package/dist/index.d.ts CHANGED
@@ -1,4 +1,3 @@
1
- import * as _versini_ui_types from '@versini/ui-types';
2
1
  import React from 'react';
3
2
 
4
3
  declare const TEXT_AREA_CLASSNAME = "av-text-area";
@@ -19,6 +18,6 @@ declare const TextArea: React.ForwardRefExoticComponent<{
19
18
  raw?: boolean;
20
19
  rightElement?: React.ReactElement;
21
20
  textAreaClassName?: string;
22
- } & _versini_ui_types.SpacingTypes.Props & React.TextareaHTMLAttributes<HTMLTextAreaElement> & React.RefAttributes<HTMLTextAreaElement>>;
21
+ } & React.TextareaHTMLAttributes<HTMLTextAreaElement> & React.RefAttributes<HTMLTextAreaElement>>;
23
22
 
24
23
  export { TEXT_AREA_CLASSNAME, TEXT_AREA_CONTROL_RIGHT_CLASSNAME, TEXT_AREA_HELPER_TEXT_CLASSNAME, TEXT_AREA_WRAPPER_CLASSNAME, TextArea };
package/dist/index.js CHANGED
@@ -1,35 +1,35 @@
1
- import { jsx as g, jsxs as se } from "react/jsx-runtime";
2
- import le, { useRef as f, useEffect as I, useCallback as ie, useMemo as X, useState as k, useId as ue, useReducer as de, useLayoutEffect as N } from "react";
3
- import l from "clsx";
1
+ import { jsx as g, jsxs as ce } from "react/jsx-runtime";
2
+ import se, { useRef as d, useEffect as C, useCallback as le, useMemo as j, useState as _, useId as ie, useReducer as ue, useLayoutEffect as N } from "react";
3
+ import i from "clsx";
4
4
  /*!
5
- @versini/ui-textarea v1.4.1
5
+ @versini/ui-textarea v2.0.1
6
6
  © 2024 gizmette.com
7
7
  */
8
8
  try {
9
9
  window.__VERSINI_UI_TEXTAREA__ || (window.__VERSINI_UI_TEXTAREA__ = {
10
- version: "1.4.1",
11
- buildTime: "12/28/2024 05:53 PM EST",
10
+ version: "2.0.1",
11
+ buildTime: "12/30/2024 11:40 AM EST",
12
12
  homepage: "https://github.com/aversini/ui-components",
13
13
  license: "MIT"
14
14
  });
15
15
  } catch {
16
16
  }
17
- const j = "av-text-area", fe = "av-text-area-wrapper", M = "av-text-area-helper-text", pe = "av-text-area__control--right";
18
- function me() {
19
- const e = f(!1);
20
- return I(() => (e.current = !0, () => {
17
+ const G = "av-text-area", de = "av-text-area-wrapper", H = "av-text-area-helper-text", fe = "av-text-area__control--right";
18
+ function pe() {
19
+ const e = d(!1);
20
+ return C(() => (e.current = !0, () => {
21
21
  e.current = !1;
22
- }), []), ie(() => e.current, []);
22
+ }), []), le(() => e.current, []);
23
23
  }
24
- function ye(e) {
25
- return X(() => e.every((n) => n == null) ? () => {
26
- } : (n) => {
24
+ function me(e) {
25
+ return j(() => e.every((r) => r == null) ? () => {
26
+ } : (r) => {
27
27
  e.forEach((t) => {
28
- typeof t == "function" ? t(n) : t != null && (t.current = n);
28
+ typeof t == "function" ? t(r) : t != null && (t.current = r);
29
29
  });
30
30
  }, e);
31
31
  }
32
- const he = {
32
+ const ye = {
33
33
  x: 0,
34
34
  y: 0,
35
35
  width: 0,
@@ -39,48 +39,48 @@ const he = {
39
39
  bottom: 0,
40
40
  right: 0
41
41
  };
42
- function xe(e) {
43
- const n = me(), t = f(0), r = f(null), [o, c] = k(he), a = X(() => typeof ResizeObserver > "u" ? null : new ResizeObserver((u) => {
44
- const s = u[0];
45
- s && (cancelAnimationFrame(t.current), t.current = requestAnimationFrame(() => {
46
- r.current && n() && c(s.contentRect);
42
+ function he(e) {
43
+ const r = pe(), t = d(0), n = d(null), [a, c] = _(ye), o = j(() => typeof ResizeObserver > "u" ? null : new ResizeObserver((s) => {
44
+ const l = s[0];
45
+ l && (cancelAnimationFrame(t.current), t.current = requestAnimationFrame(() => {
46
+ n.current && r() && c(l.contentRect);
47
47
  }));
48
- }), [n]);
49
- return I(() => (r.current && (a == null || a.observe(r.current, e)), () => {
50
- a == null || a.disconnect(), t.current && cancelAnimationFrame(t.current);
51
- }), [a, e]), [r, o];
48
+ }), [r]);
49
+ return C(() => (n.current && (o == null || o.observe(n.current, e)), () => {
50
+ o == null || o.disconnect(), t.current && cancelAnimationFrame(t.current);
51
+ }), [o, e]), [n, a];
52
52
  }
53
- function Ae({
53
+ function xe({
54
54
  value: e,
55
- defaultValue: n,
55
+ defaultValue: r,
56
56
  finalValue: t,
57
- onChange: r = () => {
57
+ onChange: n = () => {
58
58
  },
59
- initialControlledDelay: o = 0
59
+ initialControlledDelay: a = 0
60
60
  }) {
61
- const [c, a] = k(!1), [u, s] = k(
62
- n !== void 0 ? n : t
63
- ), p = (m) => {
64
- s(m), r == null || r(m);
61
+ const [c, o] = _(!1), [s, l] = _(
62
+ r !== void 0 ? r : t
63
+ ), f = (p) => {
64
+ l(p), n == null || n(p);
65
65
  };
66
- return I(() => {
67
- (async () => e !== void 0 && !c && o > 0 && (await new Promise(
68
- (m) => setTimeout(m, o)
69
- ), a(!0)))();
70
- }, [e, o, c]), e !== void 0 ? !c && o > 0 ? ["", r, !0] : [e, r, !0] : [u, p, !1];
66
+ return C(() => {
67
+ (async () => e !== void 0 && !c && a > 0 && (await new Promise(
68
+ (p) => setTimeout(p, a)
69
+ ), o(!0)))();
70
+ }, [e, a, c]), e !== void 0 ? !c && a > 0 ? ["", n, !0] : [e, n, !0] : [s, f, !1];
71
71
  }
72
- function ge(e) {
73
- const n = ue();
72
+ function Ae(e) {
73
+ const r = ie();
74
74
  if (!e)
75
- return n;
75
+ return r;
76
76
  if (typeof e == "number" || typeof e == "string")
77
- return `${e}${n}`;
77
+ return `${e}${r}`;
78
78
  if (typeof e == "object") {
79
- const { id: t, prefix: r = "" } = e;
80
- return typeof t == "number" || typeof t == "string" ? `${r}${t}` : `${r}${n}`;
79
+ const { id: t, prefix: n = "" } = e;
80
+ return typeof t == "number" || typeof t == "string" ? `${n}${t}` : `${n}${r}`;
81
81
  }
82
82
  }
83
- const z = "SET_ANNOUNCEMENT", W = "CLEAR_ANNOUNCEMENT", Te = {
83
+ const z = "SET_ANNOUNCEMENT", W = "CLEAR_ANNOUNCEMENT", ge = {
84
84
  alert: null,
85
85
  alertdialog: null,
86
86
  log: "polite",
@@ -88,12 +88,12 @@ const z = "SET_ANNOUNCEMENT", W = "CLEAR_ANNOUNCEMENT", Te = {
88
88
  progressbar: null,
89
89
  status: "polite",
90
90
  timer: "assertive"
91
- }, _e = (e, n) => {
92
- switch (n == null ? void 0 : n.type) {
91
+ }, Te = (e, r) => {
92
+ switch (r == null ? void 0 : r.type) {
93
93
  case z:
94
94
  return {
95
95
  ...e,
96
- announcement: n.payload
96
+ announcement: r.payload
97
97
  };
98
98
  case W:
99
99
  return {
@@ -105,418 +105,392 @@ const z = "SET_ANNOUNCEMENT", W = "CLEAR_ANNOUNCEMENT", Te = {
105
105
  }
106
106
  }, be = ({
107
107
  onAnnouncementClear: e,
108
- dispatch: n
108
+ dispatch: r
109
109
  }) => {
110
- n({
110
+ r({
111
111
  type: W
112
112
  }), typeof e == "function" && e();
113
- }, G = ({
113
+ }, X = ({
114
114
  children: e,
115
- clearAnnouncementDelay: n,
115
+ clearAnnouncementDelay: r,
116
116
  clearAnnouncementTimeoutRef: t,
117
- onAnnouncementClear: r,
118
- dispatch: o
117
+ onAnnouncementClear: n,
118
+ dispatch: a
119
119
  }) => {
120
- clearTimeout(t.current), e !== null && o({
120
+ clearTimeout(t.current), e !== null && a({
121
121
  type: z,
122
122
  payload: e
123
- }), n && (t.current = setTimeout(
123
+ }), r && (t.current = setTimeout(
124
124
  () => be({
125
- onAnnouncementClear: r,
126
- dispatch: o
125
+ onAnnouncementClear: n,
126
+ dispatch: a
127
127
  }),
128
- n
128
+ r
129
129
  ));
130
- }, ve = ({
130
+ }, ke = ({
131
131
  children: e,
132
- announcementTimeoutRef: n,
132
+ announcementTimeoutRef: r,
133
133
  announcementDelay: t,
134
- clearAnnouncementDelay: r,
135
- clearAnnouncementTimeoutRef: o,
134
+ clearAnnouncementDelay: n,
135
+ clearAnnouncementTimeoutRef: a,
136
136
  onAnnouncementClear: c,
137
- dispatch: a
137
+ dispatch: o
138
138
  }) => {
139
- clearTimeout(n.current), t ? n.current = setTimeout(G, t, {
139
+ clearTimeout(r.current), t ? r.current = setTimeout(X, t, {
140
140
  children: e,
141
- clearAnnouncementDelay: r,
142
- clearAnnouncementTimeoutRef: o,
141
+ clearAnnouncementDelay: n,
142
+ clearAnnouncementTimeoutRef: a,
143
143
  onAnnouncementClear: c,
144
- dispatch: a
145
- }) : G({
144
+ dispatch: o
145
+ }) : X({
146
146
  children: e,
147
- clearAnnouncementDelay: r,
148
- clearAnnouncementTimeoutRef: o,
147
+ clearAnnouncementDelay: n,
148
+ clearAnnouncementTimeoutRef: a,
149
149
  onAnnouncementClear: c,
150
- dispatch: a
150
+ dispatch: o
151
151
  });
152
152
  };
153
- function ke({
153
+ function Ee({
154
154
  children: e,
155
- className: n,
155
+ className: r,
156
156
  politeness: t,
157
- role: r = null,
158
- announcementDelay: o,
157
+ role: n = null,
158
+ announcementDelay: a,
159
159
  clearAnnouncementDelay: c,
160
- onAnnouncementClear: a,
161
- visible: u,
162
- ...s
160
+ onAnnouncementClear: o,
161
+ visible: s,
162
+ ...l
163
163
  }) {
164
- const p = f(null), m = f(null), [T, b] = de(_e, {
164
+ const f = d(null), p = d(null), [T, k] = ue(Te, {
165
165
  announcement: null
166
166
  });
167
167
  let x = t;
168
- typeof x > "u" && (x = r ? Te[r] : "assertive"), I(() => {
169
- ve({
170
- announcementTimeoutRef: p,
171
- announcementDelay: o,
168
+ typeof x > "u" && (x = n ? ge[n] : "assertive"), C(() => {
169
+ ke({
170
+ announcementTimeoutRef: f,
171
+ announcementDelay: a,
172
172
  children: e,
173
173
  clearAnnouncementDelay: c,
174
- clearAnnouncementTimeoutRef: m,
175
- onAnnouncementClear: a,
176
- dispatch: b
174
+ clearAnnouncementTimeoutRef: p,
175
+ onAnnouncementClear: o,
176
+ dispatch: k
177
177
  });
178
178
  }, [
179
179
  e,
180
- o,
180
+ a,
181
181
  c,
182
- a
182
+ o
183
183
  ]);
184
- const d = l(n, {
185
- "sr-only": !u
184
+ const m = i(r, {
185
+ "sr-only": !s
186
186
  });
187
187
  return /* @__PURE__ */ g(
188
188
  "div",
189
189
  {
190
190
  "aria-live": x,
191
- ...r && { role: r },
192
- className: d,
193
- ...s,
191
+ ...n && { role: n },
192
+ className: m,
193
+ ...l,
194
194
  children: T.announcement
195
195
  }
196
196
  );
197
197
  }
198
198
  /*!
199
- @versini/ui-liveregion v1.2.1
199
+ @versini/ui-liveregion v1.2.3
200
200
  © 2024 gizmette.com
201
201
  */
202
202
  try {
203
203
  window.__VERSINI_UI_LIVEREGION__ || (window.__VERSINI_UI_LIVEREGION__ = {
204
- version: "1.2.1",
205
- buildTime: "12/28/2024 05:53 PM EST",
206
- homepage: "https://github.com/aversini/ui-components",
207
- license: "MIT"
208
- });
209
- } catch {
210
- }
211
- /*!
212
- @versini/ui-spacing v1.1.1
213
- © 2024 gizmette.com
214
- */
215
- try {
216
- window.__VERSINI_UI_SPACING__ || (window.__VERSINI_UI_SPACING__ = {
217
- version: "1.1.1",
218
- buildTime: "12/28/2024 05:53 PM EST",
204
+ version: "1.2.3",
205
+ buildTime: "12/30/2024 11:40 AM EST",
219
206
  homepage: "https://github.com/aversini/ui-components",
220
207
  license: "MIT"
221
208
  });
222
209
  } catch {
223
210
  }
224
- const Ee = (e) => {
225
- let n = "";
226
- if (typeof e == "number" || typeof e == "string")
227
- n = "m-" + e;
228
- else {
229
- const t = [];
230
- (e == null ? void 0 : e.t) !== void 0 && t.push(`mt-${e.t}`), (e == null ? void 0 : e.r) !== void 0 && t.push(`mr-${e.r}`), (e == null ? void 0 : e.b) !== void 0 && t.push(`mb-${e.b}`), (e == null ? void 0 : e.l) !== void 0 && t.push(`ml-${e.l}`), n = t.join(" ");
231
- }
232
- return n;
233
- }, Re = () => "rounded-md text-base h-20 min-h-[80px] resize-none overflow-hidden px-4 py-7", Ne = ({
211
+ const _e = () => "rounded-md text-base h-20 min-h-[80px] resize-none overflow-hidden px-4 py-7", Re = ({
234
212
  mode: e
235
- }) => l({
213
+ }) => i({
236
214
  "bg-surface-darker text-copy-lighter caret-copy-light": e === "dark",
237
215
  "bg-surface-lighter text-copy-dark caret-copy-dark": e === "light",
238
216
  "bg-surface-lighter text-copy-dark caret-copy-dark dark:bg-surface-darker dark:text-copy-lighter dark:caret-copy-light": e === "system",
239
217
  "bg-surface-darker text-copy-lighter caret-copy-light dark:bg-surface-lighter dark:text-copy-dark dark:caret-copy-dark": e === "alt-system"
240
- }), Ie = ({
218
+ }), ve = ({
241
219
  focusMode: e
242
- }) => l("focus:outline focus:outline-2 focus:outline-offset-2", {
220
+ }) => i("focus:outline focus:outline-2 focus:outline-offset-2", {
243
221
  "focus:outline-focus-dark": e === "dark",
244
222
  "focus:outline-focus-light": e === "light",
245
223
  "focus:outline-focus-light dark:focus:outline-focus-dark": e === "alt-system",
246
224
  "focus:outline-focus-dark dark:focus:outline-focus-light": e === "system"
247
- }), Ce = ({
225
+ }), Ne = ({
248
226
  noBorder: e,
249
- error: n
250
- }) => l("border-2", {
251
- "border-border-dark": !e && !n,
252
- "focus:border-border-dark": !e && n,
253
- "border-border-error-dark": !e && n,
227
+ error: r
228
+ }) => i("border-2", {
229
+ "border-border-dark": !e && !r,
230
+ "focus:border-border-dark": !e && r,
231
+ "border-border-error-dark": !e && r,
254
232
  "border-transparent": e
255
- }), Se = ({
233
+ }), Ce = ({
256
234
  disabled: e,
257
- raw: n,
235
+ raw: r,
258
236
  error: t,
259
- mode: r
237
+ mode: n
260
238
  }) => {
261
- if (n)
239
+ if (r)
262
240
  return "";
263
241
  if (e)
264
- return l("absolute px-2 cursor-not-allowed opacity-50 font-medium");
242
+ return i("absolute px-2 cursor-not-allowed opacity-50 font-medium");
265
243
  if (!t)
266
- return l("absolute px-2 cursor-text font-medium", {
267
- "text-copy-medium": r === "dark",
268
- "text-copy-dark": r === "light",
269
- "text-copy-dark dark:text-copy-medium": r === "system",
270
- "text-copy-medium dark:text-copy-dark": r === "alt-system"
244
+ return i("absolute px-2 cursor-text font-medium", {
245
+ "text-copy-medium": n === "dark",
246
+ "text-copy-dark": n === "light",
247
+ "text-copy-dark dark:text-copy-medium": n === "system",
248
+ "text-copy-medium dark:text-copy-dark": n === "alt-system"
271
249
  });
272
250
  if (t)
273
- return l("absolute px-2 cursor-text font-medium", {
274
- "text-copy-medium": r === "dark",
275
- "text-copy-error-dark": r === "light",
276
- "text-copy-error-dark dark:text-copy-error-light": r === "system",
277
- "text-copy-medium dark:text-copy-error-dark": r === "alt-system"
251
+ return i("absolute px-2 cursor-text font-medium", {
252
+ "text-copy-medium": n === "dark",
253
+ "text-copy-error-dark": n === "light",
254
+ "text-copy-error-dark dark:text-copy-error-light": n === "system",
255
+ "text-copy-medium dark:text-copy-error-dark": n === "alt-system"
278
256
  });
279
- }, Oe = ({
257
+ }, Ie = ({
280
258
  error: e,
281
- raw: n,
259
+ raw: r,
282
260
  mode: t,
283
- disabled: r
261
+ disabled: n
284
262
  }) => {
285
- if (n)
286
- return "";
287
263
  if (r)
288
- return l(
289
- M,
264
+ return "";
265
+ if (n)
266
+ return i(
267
+ H,
290
268
  "absolute px-2 cursor-not-allowed opacity-50 font-medium"
291
269
  );
292
270
  if (!e)
293
- return l(M, "absolute px-2 font-medium", {
271
+ return i(H, "absolute px-2 font-medium", {
294
272
  "text-copy-medium": t === "dark",
295
273
  "text-copy-dark": t === "light",
296
274
  "text-copy-dark dark:text-copy-medium": t === "system",
297
275
  "text-copy-medium dark:text-copy-dark": t === "alt-system"
298
276
  });
299
277
  if (e)
300
- return l(M, "absolute px-2 font-medium", {
278
+ return i(H, "absolute px-2 font-medium", {
301
279
  "text-copy-error-light": t === "dark",
302
280
  "text-copy-error-dark": t === "light",
303
281
  "text-copy-error-dark dark:text-copy-error-light": t === "system",
304
282
  "dark:text-copy-error-dark text-copy-error-light": t === "alt-system"
305
283
  });
306
- }, we = ({
284
+ }, Se = ({
307
285
  className: e,
308
- textAreaClassName: n,
286
+ textAreaClassName: r,
309
287
  raw: t,
310
- focusMode: r,
311
- disabled: o,
288
+ focusMode: n,
289
+ disabled: a,
312
290
  noBorder: c,
313
- error: a,
314
- spacing: u,
291
+ error: o,
315
292
  mode: s
316
293
  }) => {
317
- const p = t ? e : l(
294
+ const l = t ? e : i(
318
295
  "relative flex w-full flex-col justify-center",
319
- fe,
320
- e,
321
- Ee(u)
322
- ), m = t ? l(n) : l(
323
- j,
324
- n,
325
- Re(),
326
- Ne({ mode: s }),
327
- Ie({ focusMode: r }),
328
- Ce({
296
+ de,
297
+ e
298
+ ), f = t ? i(r) : i(
299
+ G,
300
+ r,
301
+ _e(),
302
+ Re({ mode: s }),
303
+ ve({ focusMode: n }),
304
+ Ne({
329
305
  noBorder: c,
330
- error: a
306
+ error: o
331
307
  }),
332
308
  {
333
- "disabled:cursor-not-allowed disabled:opacity-50": o
309
+ "disabled:cursor-not-allowed disabled:opacity-50": a
334
310
  }
335
- ), T = t ? void 0 : "sr-only", b = Se({
336
- disabled: o,
311
+ ), p = t ? void 0 : "sr-only", T = Ce({
312
+ disabled: a,
337
313
  raw: t,
338
- error: a,
314
+ error: o,
339
315
  mode: s
340
- }), x = Oe({
341
- error: a,
316
+ }), k = Ie({
317
+ error: o,
342
318
  raw: t,
343
319
  mode: s,
344
- disabled: o
345
- }), d = t ? void 0 : l(pe, "absolute");
320
+ disabled: a
321
+ }), x = t ? void 0 : i(fe, "absolute");
346
322
  return {
347
- wrapper: p,
348
- textArea: m,
349
- accessibleLabel: T,
350
- visibleLabel: b,
351
- helperText: x,
352
- rightElement: d
323
+ wrapper: l,
324
+ textArea: f,
325
+ accessibleLabel: p,
326
+ visibleLabel: T,
327
+ helperText: k,
328
+ rightElement: x
353
329
  };
354
- }, Le = ({
330
+ }, Oe = ({
355
331
  scrollHeight: e,
356
- currentHeight: n,
332
+ currentHeight: r,
357
333
  currentLabelOffset: t = 0,
358
- currentHelperTextOffset: r = 0
334
+ currentHelperTextOffset: n = 0
359
335
  }) => {
360
- let a, u;
361
- if (e > 0 && e !== n) {
362
- const s = e - n, p = Math.abs(s / 24);
363
- a = t + -1 * Math.sign(s) * (12 * p), u = r + Math.sign(s) * (12 * p);
336
+ let o, s;
337
+ if (e > 0 && e !== r) {
338
+ const l = e - r, f = Math.abs(l / 24);
339
+ o = t + -1 * Math.sign(l) * (12 * f), s = n + Math.sign(l) * (12 * f);
364
340
  }
365
341
  return {
366
- labelOffset: a,
367
- helperTextOffset: u,
342
+ labelOffset: o,
343
+ helperTextOffset: s,
368
344
  scrollHeight: e
369
345
  };
370
- }, $e = le.forwardRef(
346
+ }, Le = se.forwardRef(
371
347
  ({
372
348
  id: e,
373
- name: n,
349
+ name: r,
374
350
  label: t,
375
- error: r = !1,
376
- raw: o = !1,
351
+ error: n = !1,
352
+ raw: a = !1,
377
353
  className: c,
378
- textAreaClassName: a,
379
- mode: u = "system",
380
- focusMode: s = "system",
381
- value: p,
382
- defaultValue: m,
354
+ textAreaClassName: o,
355
+ mode: s = "system",
356
+ focusMode: l = "system",
357
+ value: f,
358
+ defaultValue: p,
383
359
  disabled: T = !1,
384
- noBorder: b = !1,
360
+ noBorder: k = !1,
385
361
  labelId: x,
386
- helperText: d = "",
387
- helperTextOnFocus: C = !1,
362
+ helperText: m = "",
363
+ helperTextOnFocus: I = !1,
388
364
  rightElement: S,
389
- onChange: P,
390
- onFocus: H,
391
- onBlur: D,
392
- spacing: q,
393
- ...B
394
- }, J) => {
395
- const y = f(null), K = ye([J, y]), [Q, E] = xe(), O = f(80), F = f(-25), A = f(null), U = f(30), R = f(null), v = ge({ id: e, prefix: `${j}-` }), [Y, Z] = k(0), [ee, V] = k(
396
- !!(!C && d)
397
- ), te = `${n} error, ${d}`, _ = we({
365
+ onChange: D,
366
+ onFocus: M,
367
+ onBlur: F,
368
+ ...q
369
+ }, B) => {
370
+ const y = d(null), J = me([B, y]), [K, R] = he(), O = d(80), P = d(-25), A = d(null), U = d(30), v = d(null), E = Ae({ id: e, prefix: `${G}-` }), [Q, Y] = _(0), [Z, V] = _(
371
+ !!(!I && m)
372
+ ), ee = `${r} error, ${m}`, b = Se({
398
373
  className: c,
399
- textAreaClassName: a,
400
- error: r,
401
- raw: o,
402
- focusMode: s,
374
+ textAreaClassName: o,
375
+ error: n,
376
+ raw: a,
377
+ focusMode: l,
403
378
  disabled: T,
404
- noBorder: b,
405
- spacing: q,
406
- mode: u
407
- }), [h, ne] = Ae({
408
- value: p,
379
+ noBorder: k,
380
+ mode: s
381
+ }), [h, te] = xe({
382
+ value: f,
409
383
  initialControlledDelay: 20,
410
- defaultValue: m,
411
- onChange: (i) => {
412
- P && P({
384
+ defaultValue: p,
385
+ onChange: (u) => {
386
+ D && D({
413
387
  target: {
414
- value: i
388
+ value: u
415
389
  }
416
390
  });
417
391
  }
418
- }), re = (i) => {
419
- ne(i.target.value);
420
- }, oe = (i) => {
421
- C && d && V(!0), H && H(i);
422
- }, ae = (i) => {
423
- C && d && !h && V(!1), D && D(i);
392
+ }), re = (u) => {
393
+ te(u.target.value);
394
+ }, ne = (u) => {
395
+ I && m && V(!0), M && M(u);
396
+ }, ae = (u) => {
397
+ I && m && !h && V(!1), F && F(u);
424
398
  };
425
399
  return N(() => {
426
- E && E.width && Z(E.width + 18 + 10);
427
- }, [E]), N(() => {
428
- o || y && y.current && h !== void 0 && (y.current.style.height = "inherit", y.current.style.height = y.current.scrollHeight + "px");
429
- }, [h, o]), N(() => {
430
- o || setTimeout(() => {
431
- var i;
432
- (i = A == null ? void 0 : A.current) == null || i.style.setProperty(
400
+ R && R.width && Y(R.width + 18 + 10);
401
+ }, [R]), N(() => {
402
+ a || y && y.current && h !== void 0 && (y.current.style.height = "inherit", y.current.style.height = y.current.scrollHeight + "px");
403
+ }, [h, a]), N(() => {
404
+ a || setTimeout(() => {
405
+ var u;
406
+ (u = A == null ? void 0 : A.current) == null || u.style.setProperty(
433
407
  "--av-text-area-wrapper-transition",
434
408
  h ? "none" : "all 0.2s ease-out"
435
409
  );
436
410
  }, 0);
437
- }, [h, o]), N(() => {
438
- var i, w;
439
- if (!o && y && y.current && h !== void 0) {
440
- const { labelOffset: L, helperTextOffset: $, scrollHeight: ce } = Le({
411
+ }, [h, a]), N(() => {
412
+ var u, L;
413
+ if (!a && y && y.current && h !== void 0) {
414
+ const { labelOffset: w, helperTextOffset: $, scrollHeight: oe } = Oe({
441
415
  scrollHeight: y.current.scrollHeight,
442
416
  currentHeight: O.current,
443
- currentLabelOffset: F.current,
417
+ currentLabelOffset: P.current,
444
418
  currentHelperTextOffset: U.current
445
419
  });
446
- L && (F.current = L, (i = A == null ? void 0 : A.current) == null || i.style.setProperty(
420
+ w && (P.current = w, (u = A == null ? void 0 : A.current) == null || u.style.setProperty(
447
421
  "--av-text-area-label",
448
- `${L}px`
449
- )), $ && (U.current = $, (w = R == null ? void 0 : R.current) == null || w.style.setProperty(
422
+ `${w}px`
423
+ )), $ && (U.current = $, (L = v == null ? void 0 : v.current) == null || L.style.setProperty(
450
424
  "--av-text-area-helper-text",
451
425
  `${$}px`
452
- )), O.current = ce || O.current;
426
+ )), O.current = oe || O.current;
453
427
  }
454
- }, [h, o]), /* @__PURE__ */ se("div", { className: _.wrapper, children: [
428
+ }, [h, a]), /* @__PURE__ */ ce("div", { className: b.wrapper, children: [
455
429
  /* @__PURE__ */ g(
456
430
  "label",
457
431
  {
458
- htmlFor: v,
432
+ htmlFor: E,
459
433
  id: x,
460
- className: _.accessibleLabel,
434
+ className: b.accessibleLabel,
461
435
  children: t
462
436
  }
463
437
  ),
464
438
  /* @__PURE__ */ g(
465
439
  "textarea",
466
440
  {
467
- ref: K,
468
- id: v,
469
- name: n,
441
+ ref: J,
442
+ id: E,
443
+ name: r,
470
444
  disabled: T,
471
- placeholder: o ? void 0 : " ",
472
- className: _.textArea,
445
+ placeholder: a ? void 0 : " ",
446
+ className: b.textArea,
473
447
  rows: 1,
474
- ...d && { "aria-describedby": `${v}-helper` },
475
- ...r && { "aria-invalid": "true" },
476
- ...S && !o && { style: { paddingRight: Y } },
448
+ ...m && { "aria-describedby": `${E}-helper` },
449
+ ...n && { "aria-invalid": "true" },
450
+ ...S && !a && { style: { paddingRight: Q } },
477
451
  value: h,
478
452
  onChange: re,
479
- onFocus: oe,
453
+ onFocus: ne,
480
454
  onBlur: ae,
481
- ...B
455
+ ...q
482
456
  }
483
457
  ),
484
- !o && /* @__PURE__ */ g(
458
+ !a && /* @__PURE__ */ g(
485
459
  "label",
486
460
  {
487
461
  ref: A,
488
462
  "aria-hidden": !0,
489
- htmlFor: v,
490
- className: _.visibleLabel,
463
+ htmlFor: E,
464
+ className: b.visibleLabel,
491
465
  children: t
492
466
  }
493
467
  ),
494
- ee && /* @__PURE__ */ g(
468
+ Z && /* @__PURE__ */ g(
495
469
  "div",
496
470
  {
497
- ref: R,
498
- id: `${v}-helper`,
499
- className: _.helperText,
500
- children: d
471
+ ref: v,
472
+ id: `${E}-helper`,
473
+ className: b.helperText,
474
+ children: m
501
475
  }
502
476
  ),
503
477
  S && /* @__PURE__ */ g(
504
478
  "div",
505
479
  {
506
- ref: Q,
507
- className: _.rightElement,
480
+ ref: K,
481
+ className: b.rightElement,
508
482
  children: S
509
483
  }
510
484
  ),
511
- r && d && /* @__PURE__ */ g(ke, { politeness: "polite", clearAnnouncementDelay: 500, children: te })
485
+ n && m && /* @__PURE__ */ g(Ee, { politeness: "polite", clearAnnouncementDelay: 500, children: ee })
512
486
  ] });
513
487
  }
514
488
  );
515
- $e.displayName = "TextArea";
489
+ Le.displayName = "TextArea";
516
490
  export {
517
- j as TEXT_AREA_CLASSNAME,
518
- pe as TEXT_AREA_CONTROL_RIGHT_CLASSNAME,
519
- M as TEXT_AREA_HELPER_TEXT_CLASSNAME,
520
- fe as TEXT_AREA_WRAPPER_CLASSNAME,
521
- $e as TextArea
491
+ G as TEXT_AREA_CLASSNAME,
492
+ fe as TEXT_AREA_CONTROL_RIGHT_CLASSNAME,
493
+ H as TEXT_AREA_HELPER_TEXT_CLASSNAME,
494
+ de as TEXT_AREA_WRAPPER_CLASSNAME,
495
+ Le as TextArea
522
496
  };
package/dist/style.css CHANGED
@@ -1 +1 @@
1
- *,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::-ms-backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-ms-input-placeholder,textarea::-ms-input-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}.av-text-area-wrapper label[aria-hidden=true]{transform:translate(12px) scale(1);transform-origin:top left;transition:var(--av-text-area-wrapper-transition, all .2s ease-out)}.av-text-area:focus+label[aria-hidden=true],.av-text-area:not(:placeholder-shown)+label[aria-hidden=true]{transform:translate(12px,var(--av-text-area-label, -25px)) scale(.75)}.av-text-area-helper-text{transform:translate(12px,var(--av-text-area-helper-text, 32px)) scale(.75);transform-origin:top left}.av-text-area__control--right{right:18px}@keyframes blink{50%{fill:transparent}}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.visible{visibility:visible}.absolute{position:absolute}.relative{position:relative}.m-0{margin:0}.m-1{margin:.25rem}.m-10{margin:2.5rem}.m-11{margin:2.75rem}.m-12{margin:3rem}.m-14{margin:3.5rem}.m-16{margin:4rem}.m-2{margin:.5rem}.m-20{margin:5rem}.m-24{margin:6rem}.m-28{margin:7rem}.m-3{margin:.75rem}.m-32{margin:8rem}.m-36{margin:9rem}.m-4{margin:1rem}.m-44{margin:11rem}.m-48{margin:12rem}.m-5{margin:1.25rem}.m-52{margin:13rem}.m-56{margin:14rem}.m-6{margin:1.5rem}.m-60{margin:15rem}.m-64{margin:16rem}.m-7{margin:1.75rem}.m-72{margin:18rem}.m-8{margin:2rem}.m-80{margin:20rem}.m-9{margin:2.25rem}.m-96{margin:24rem}.mb-0{margin-bottom:0}.mb-1{margin-bottom:.25rem}.mb-10{margin-bottom:2.5rem}.mb-11{margin-bottom:2.75rem}.mb-12{margin-bottom:3rem}.mb-14{margin-bottom:3.5rem}.mb-16{margin-bottom:4rem}.mb-2{margin-bottom:.5rem}.mb-20{margin-bottom:5rem}.mb-24{margin-bottom:6rem}.mb-28{margin-bottom:7rem}.mb-3{margin-bottom:.75rem}.mb-32{margin-bottom:8rem}.mb-36{margin-bottom:9rem}.mb-4{margin-bottom:1rem}.mb-44{margin-bottom:11rem}.mb-48{margin-bottom:12rem}.mb-5{margin-bottom:1.25rem}.mb-52{margin-bottom:13rem}.mb-56{margin-bottom:14rem}.mb-6{margin-bottom:1.5rem}.mb-60{margin-bottom:15rem}.mb-64{margin-bottom:16rem}.mb-7{margin-bottom:1.75rem}.mb-72{margin-bottom:18rem}.mb-8{margin-bottom:2rem}.mb-80{margin-bottom:20rem}.mb-9{margin-bottom:2.25rem}.mb-96{margin-bottom:24rem}.ml-0{margin-left:0}.ml-1{margin-left:.25rem}.ml-10{margin-left:2.5rem}.ml-11{margin-left:2.75rem}.ml-12{margin-left:3rem}.ml-14{margin-left:3.5rem}.ml-16{margin-left:4rem}.ml-2{margin-left:.5rem}.ml-20{margin-left:5rem}.ml-24{margin-left:6rem}.ml-28{margin-left:7rem}.ml-3{margin-left:.75rem}.ml-32{margin-left:8rem}.ml-36{margin-left:9rem}.ml-4{margin-left:1rem}.ml-44{margin-left:11rem}.ml-48{margin-left:12rem}.ml-5{margin-left:1.25rem}.ml-52{margin-left:13rem}.ml-56{margin-left:14rem}.ml-6{margin-left:1.5rem}.ml-60{margin-left:15rem}.ml-64{margin-left:16rem}.ml-7{margin-left:1.75rem}.ml-72{margin-left:18rem}.ml-8{margin-left:2rem}.ml-80{margin-left:20rem}.ml-9{margin-left:2.25rem}.ml-96{margin-left:24rem}.mr-0{margin-right:0}.mr-1{margin-right:.25rem}.mr-10{margin-right:2.5rem}.mr-11{margin-right:2.75rem}.mr-12{margin-right:3rem}.mr-14{margin-right:3.5rem}.mr-16{margin-right:4rem}.mr-2{margin-right:.5rem}.mr-20{margin-right:5rem}.mr-24{margin-right:6rem}.mr-28{margin-right:7rem}.mr-3{margin-right:.75rem}.mr-32{margin-right:8rem}.mr-36{margin-right:9rem}.mr-4{margin-right:1rem}.mr-44{margin-right:11rem}.mr-48{margin-right:12rem}.mr-5{margin-right:1.25rem}.mr-52{margin-right:13rem}.mr-56{margin-right:14rem}.mr-6{margin-right:1.5rem}.mr-60{margin-right:15rem}.mr-64{margin-right:16rem}.mr-7{margin-right:1.75rem}.mr-72{margin-right:18rem}.mr-8{margin-right:2rem}.mr-80{margin-right:20rem}.mr-9{margin-right:2.25rem}.mr-96{margin-right:24rem}.mt-0{margin-top:0}.mt-1{margin-top:.25rem}.mt-10{margin-top:2.5rem}.mt-11{margin-top:2.75rem}.mt-12{margin-top:3rem}.mt-14{margin-top:3.5rem}.mt-16{margin-top:4rem}.mt-2{margin-top:.5rem}.mt-20{margin-top:5rem}.mt-24{margin-top:6rem}.mt-28{margin-top:7rem}.mt-3{margin-top:.75rem}.mt-32{margin-top:8rem}.mt-36{margin-top:9rem}.mt-4{margin-top:1rem}.mt-44{margin-top:11rem}.mt-48{margin-top:12rem}.mt-5{margin-top:1.25rem}.mt-52{margin-top:13rem}.mt-56{margin-top:14rem}.mt-6{margin-top:1.5rem}.mt-60{margin-top:15rem}.mt-64{margin-top:16rem}.mt-7{margin-top:1.75rem}.mt-72{margin-top:18rem}.mt-8{margin-top:2rem}.mt-80{margin-top:20rem}.mt-9{margin-top:2.25rem}.mt-96{margin-top:24rem}.flex{display:flex}.h-20{height:5rem}.min-h-\[80px\]{min-height:80px}.w-full{width:100%}.cursor-not-allowed{cursor:not-allowed}.cursor-text{cursor:text}.resize-none{resize:none}.resize{resize:both}.flex-col{flex-direction:column}.justify-center{justify-content:center}.overflow-hidden{overflow:hidden}.rounded-md{border-radius:.375rem}.border{border-width:1px}.border-2{border-width:2px}.border-border-dark{--tw-border-opacity: 1;border-color:var(--av-border-dark, rgb(15 23 42 / var(--tw-border-opacity, 1)))}.border-border-error-dark{--tw-border-opacity: 1;border-color:var(--av-border-error-dark, rgb(185 28 28 / var(--tw-border-opacity, 1)))}.border-transparent{border-color:transparent}.bg-surface-darker{--tw-bg-opacity: 1;background-color:var(--av-surface-darker, rgb(15 23 42 / var(--tw-bg-opacity, 1)))}.bg-surface-lighter{--tw-bg-opacity: 1;background-color:var(--av-surface-lighter, rgb(226 232 240 / var(--tw-bg-opacity, 1)))}.px-2{padding-left:.5rem;padding-right:.5rem}.px-4{padding-left:1rem;padding-right:1rem}.py-7{padding-top:1.75rem;padding-bottom:1.75rem}.text-base{font-size:1rem;line-height:1.5rem}.font-medium{font-weight:500}.text-copy-dark{--tw-text-opacity: 1;color:var(--av-copy-dark, rgb(15 23 42 / var(--tw-text-opacity, 1)))}.text-copy-error-dark{--tw-text-opacity: 1;color:var(--av-copy-error-dark, rgb(185 28 28 / var(--tw-text-opacity, 1)))}.text-copy-error-light{--tw-text-opacity: 1;color:var(--av-copy-error-light, rgb(239 68 68 / var(--tw-text-opacity, 1)))}.text-copy-lighter{--tw-text-opacity: 1;color:var(--av-copy-lighter, rgb(255 255 255 / var(--tw-text-opacity, 1)))}.text-copy-medium{--tw-text-opacity: 1;color:var(--av-copy-medium, rgb(148 163 184 / var(--tw-text-opacity, 1)))}.caret-copy-dark{caret-color:var(--av-copy-dark, rgb(15 23 42 / 1))}.caret-copy-light{caret-color:var(--av-copy-light, rgb(226 232 240 / 1))}.opacity-50{opacity:.5}.outline-focus-dark{outline-color:var(--av-focus-dark, rgb(21 128 61 / 1))}.outline-focus-light{outline-color:var(--av-focus-light, rgb(134 239 172 / 1))}.ring{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}.ease-out{transition-timing-function:cubic-bezier(0,0,.2,1)}.focus\:border-border-dark:focus{--tw-border-opacity: 1;border-color:var(--av-border-dark, rgb(15 23 42 / var(--tw-border-opacity, 1)))}.focus\:outline:focus{outline-style:solid}.focus\:outline-2:focus{outline-width:2px}.focus\:outline-offset-2:focus{outline-offset:2px}.focus\:outline-focus-dark:focus{outline-color:var(--av-focus-dark, rgb(21 128 61 / 1))}.focus\:outline-focus-light:focus{outline-color:var(--av-focus-light, rgb(134 239 172 / 1))}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:opacity-50:disabled{opacity:.5}@media (prefers-color-scheme: dark){.dark\:bg-surface-darker{--tw-bg-opacity: 1;background-color:var(--av-surface-darker, rgb(15 23 42 / var(--tw-bg-opacity, 1)))}.dark\:bg-surface-lighter{--tw-bg-opacity: 1;background-color:var(--av-surface-lighter, rgb(226 232 240 / var(--tw-bg-opacity, 1)))}.dark\:text-copy-dark{--tw-text-opacity: 1;color:var(--av-copy-dark, rgb(15 23 42 / var(--tw-text-opacity, 1)))}.dark\:text-copy-error-dark{--tw-text-opacity: 1;color:var(--av-copy-error-dark, rgb(185 28 28 / var(--tw-text-opacity, 1)))}.dark\:text-copy-error-light{--tw-text-opacity: 1;color:var(--av-copy-error-light, rgb(239 68 68 / var(--tw-text-opacity, 1)))}.dark\:text-copy-lighter{--tw-text-opacity: 1;color:var(--av-copy-lighter, rgb(255 255 255 / var(--tw-text-opacity, 1)))}.dark\:text-copy-medium{--tw-text-opacity: 1;color:var(--av-copy-medium, rgb(148 163 184 / var(--tw-text-opacity, 1)))}.dark\:caret-copy-dark{caret-color:var(--av-copy-dark, rgb(15 23 42 / 1))}.dark\:caret-copy-light{caret-color:var(--av-copy-light, rgb(226 232 240 / 1))}.dark\:focus\:outline-focus-dark:focus{outline-color:var(--av-focus-dark, rgb(21 128 61 / 1))}.dark\:focus\:outline-focus-light:focus{outline-color:var(--av-focus-light, rgb(134 239 172 / 1))}}
1
+ *,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::-ms-backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-ms-input-placeholder,textarea::-ms-input-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}.av-text-area-wrapper label[aria-hidden=true]{transform:translate(12px) scale(1);transform-origin:top left;transition:var(--av-text-area-wrapper-transition, all .2s ease-out)}.av-text-area:focus+label[aria-hidden=true],.av-text-area:not(:placeholder-shown)+label[aria-hidden=true]{transform:translate(12px,var(--av-text-area-label, -25px)) scale(.75)}.av-text-area-helper-text{transform:translate(12px,var(--av-text-area-helper-text, 32px)) scale(.75);transform-origin:top left}.av-text-area__control--right{right:18px}@keyframes blink{50%{fill:transparent}}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.visible{visibility:visible}.absolute{position:absolute}.relative{position:relative}.mr-2{margin-right:.5rem}.flex{display:flex}.h-20{height:5rem}.min-h-\[80px\]{min-height:80px}.w-full{width:100%}.cursor-not-allowed{cursor:not-allowed}.cursor-text{cursor:text}.resize-none{resize:none}.resize{resize:both}.flex-col{flex-direction:column}.justify-center{justify-content:center}.overflow-hidden{overflow:hidden}.rounded-md{border-radius:.375rem}.border{border-width:1px}.border-2{border-width:2px}.border-border-dark{--tw-border-opacity: 1;border-color:var(--av-border-dark, rgb(15 23 42 / var(--tw-border-opacity, 1)))}.border-border-error-dark{--tw-border-opacity: 1;border-color:var(--av-border-error-dark, rgb(185 28 28 / var(--tw-border-opacity, 1)))}.border-transparent{border-color:transparent}.bg-surface-darker{--tw-bg-opacity: 1;background-color:var(--av-surface-darker, rgb(15 23 42 / var(--tw-bg-opacity, 1)))}.bg-surface-lighter{--tw-bg-opacity: 1;background-color:var(--av-surface-lighter, rgb(226 232 240 / var(--tw-bg-opacity, 1)))}.px-2{padding-left:.5rem;padding-right:.5rem}.px-4{padding-left:1rem;padding-right:1rem}.py-7{padding-top:1.75rem;padding-bottom:1.75rem}.text-base{font-size:1rem;line-height:1.5rem}.font-medium{font-weight:500}.text-copy-dark{--tw-text-opacity: 1;color:var(--av-copy-dark, rgb(15 23 42 / var(--tw-text-opacity, 1)))}.text-copy-error-dark{--tw-text-opacity: 1;color:var(--av-copy-error-dark, rgb(185 28 28 / var(--tw-text-opacity, 1)))}.text-copy-error-light{--tw-text-opacity: 1;color:var(--av-copy-error-light, rgb(239 68 68 / var(--tw-text-opacity, 1)))}.text-copy-lighter{--tw-text-opacity: 1;color:var(--av-copy-lighter, rgb(255 255 255 / var(--tw-text-opacity, 1)))}.text-copy-medium{--tw-text-opacity: 1;color:var(--av-copy-medium, rgb(148 163 184 / var(--tw-text-opacity, 1)))}.caret-copy-dark{caret-color:var(--av-copy-dark, rgb(15 23 42 / 1))}.caret-copy-light{caret-color:var(--av-copy-light, rgb(226 232 240 / 1))}.opacity-50{opacity:.5}.outline-focus-dark{outline-color:var(--av-focus-dark, rgb(21 128 61 / 1))}.outline-focus-light{outline-color:var(--av-focus-light, rgb(134 239 172 / 1))}.ring{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}.ease-out{transition-timing-function:cubic-bezier(0,0,.2,1)}.focus\:border-border-dark:focus{--tw-border-opacity: 1;border-color:var(--av-border-dark, rgb(15 23 42 / var(--tw-border-opacity, 1)))}.focus\:outline:focus{outline-style:solid}.focus\:outline-2:focus{outline-width:2px}.focus\:outline-offset-2:focus{outline-offset:2px}.focus\:outline-focus-dark:focus{outline-color:var(--av-focus-dark, rgb(21 128 61 / 1))}.focus\:outline-focus-light:focus{outline-color:var(--av-focus-light, rgb(134 239 172 / 1))}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:opacity-50:disabled{opacity:.5}@media (prefers-color-scheme: dark){.dark\:bg-surface-darker{--tw-bg-opacity: 1;background-color:var(--av-surface-darker, rgb(15 23 42 / var(--tw-bg-opacity, 1)))}.dark\:bg-surface-lighter{--tw-bg-opacity: 1;background-color:var(--av-surface-lighter, rgb(226 232 240 / var(--tw-bg-opacity, 1)))}.dark\:text-copy-dark{--tw-text-opacity: 1;color:var(--av-copy-dark, rgb(15 23 42 / var(--tw-text-opacity, 1)))}.dark\:text-copy-error-dark{--tw-text-opacity: 1;color:var(--av-copy-error-dark, rgb(185 28 28 / var(--tw-text-opacity, 1)))}.dark\:text-copy-error-light{--tw-text-opacity: 1;color:var(--av-copy-error-light, rgb(239 68 68 / var(--tw-text-opacity, 1)))}.dark\:text-copy-lighter{--tw-text-opacity: 1;color:var(--av-copy-lighter, rgb(255 255 255 / var(--tw-text-opacity, 1)))}.dark\:text-copy-medium{--tw-text-opacity: 1;color:var(--av-copy-medium, rgb(148 163 184 / var(--tw-text-opacity, 1)))}.dark\:caret-copy-dark{caret-color:var(--av-copy-dark, rgb(15 23 42 / 1))}.dark\:caret-copy-light{caret-color:var(--av-copy-light, rgb(226 232 240 / 1))}.dark\:focus\:outline-focus-dark:focus{outline-color:var(--av-focus-dark, rgb(21 128 61 / 1))}.dark\:focus\:outline-focus-light:focus{outline-color:var(--av-focus-light, rgb(134 239 172 / 1))}}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@versini/ui-textarea",
3
- "version": "1.4.1",
3
+ "version": "2.0.1",
4
4
  "license": "MIT",
5
5
  "author": "Arno Versini",
6
6
  "publishConfig": {
@@ -40,14 +40,13 @@
40
40
  "dependencies": {
41
41
  "@tailwindcss/typography": "0.5.15",
42
42
  "@versini/ui-hooks": "4.3.0",
43
- "@versini/ui-liveregion": "1.2.1",
44
- "@versini/ui-spacing": "1.1.1",
45
- "@versini/ui-types": "1.1.0",
43
+ "@versini/ui-liveregion": "1.2.3",
44
+ "@versini/ui-types": "2.1.0",
46
45
  "clsx": "2.1.1",
47
46
  "tailwindcss": "3.4.17"
48
47
  },
49
48
  "sideEffects": [
50
49
  "**/*.css"
51
50
  ],
52
- "gitHead": "900bc75dfbd7b5635476cfd59ba97711ce7be2fc"
51
+ "gitHead": "1221c66705bd1e8a31981a21a9566c8db647ab5c"
53
52
  }