@versini/ui-textarea 1.1.1 → 1.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import * as _versini_ui_private_dist_utilities from '@versini/ui-private/dist/utilities';
1
+ import * as _versini_ui_spacing_types from '@versini/ui-spacing-types';
2
2
  import React from 'react';
3
3
 
4
4
  declare const TEXT_AREA_CLASSNAME = "av-text-area";
@@ -19,6 +19,6 @@ declare const TextArea: React.ForwardRefExoticComponent<{
19
19
  raw?: boolean;
20
20
  rightElement?: React.ReactElement;
21
21
  textAreaClassName?: string;
22
- } & _versini_ui_private_dist_utilities.SpacingProps & React.TextareaHTMLAttributes<HTMLTextAreaElement> & React.RefAttributes<HTMLTextAreaElement>>;
22
+ } & _versini_ui_spacing_types.SpacingTypes.Props & React.TextareaHTMLAttributes<HTMLTextAreaElement> & React.RefAttributes<HTMLTextAreaElement>>;
23
23
 
24
24
  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,31 +1,31 @@
1
1
  import { jsx as g, jsxs as se } from "react/jsx-runtime";
2
- import le, { useRef as f, useEffect as C, useCallback as ie, useMemo as j, useState as _, useId as ue, useReducer as de, useLayoutEffect as N } from "react";
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
3
  import l from "clsx";
4
4
  /*!
5
- @versini/ui-textarea v1.1.1
5
+ @versini/ui-textarea v1.3.0
6
6
  © 2024 gizmette.com
7
7
  */
8
8
  try {
9
9
  window.__VERSINI_UI_TEXTAREA__ || (window.__VERSINI_UI_TEXTAREA__ = {
10
- version: "1.1.1",
11
- buildTime: "12/18/2024 01:22 PM EST",
10
+ version: "1.3.0",
11
+ buildTime: "12/25/2024 10:51 AM EST",
12
12
  homepage: "https://github.com/aversini/ui-components",
13
13
  license: "MIT"
14
14
  });
15
15
  } catch {
16
16
  }
17
- const z = "av-text-area", fe = "av-text-area-wrapper", H = "av-text-area-helper-text", pe = "av-text-area__control--right";
17
+ const j = "av-text-area", fe = "av-text-area-wrapper", M = "av-text-area-helper-text", pe = "av-text-area__control--right";
18
18
  function me() {
19
19
  const e = f(!1);
20
- return C(() => (e.current = !0, () => {
20
+ return I(() => (e.current = !0, () => {
21
21
  e.current = !1;
22
22
  }), []), ie(() => e.current, []);
23
23
  }
24
24
  function ye(e) {
25
- return j(() => e.every((r) => r == null) ? () => {
26
- } : (r) => {
25
+ return X(() => e.every((n) => n == null) ? () => {
26
+ } : (n) => {
27
27
  e.forEach((t) => {
28
- typeof t == "function" ? t(r) : t != null && (t.current = r);
28
+ typeof t == "function" ? t(n) : t != null && (t.current = n);
29
29
  });
30
30
  }, e);
31
31
  }
@@ -40,47 +40,47 @@ const he = {
40
40
  right: 0
41
41
  };
42
42
  function xe(e) {
43
- const r = me(), t = f(0), n = f(null), [o, c] = _(he), a = j(() => typeof ResizeObserver > "u" ? null : new ResizeObserver((u) => {
43
+ const n = me(), t = f(0), r = f(null), [o, c] = k(he), a = X(() => typeof ResizeObserver > "u" ? null : new ResizeObserver((u) => {
44
44
  const s = u[0];
45
45
  s && (cancelAnimationFrame(t.current), t.current = requestAnimationFrame(() => {
46
- n.current && r() && c(s.contentRect);
46
+ r.current && n() && c(s.contentRect);
47
47
  }));
48
- }), [r]);
49
- return C(() => (n.current && (a == null || a.observe(n.current, e)), () => {
48
+ }), [n]);
49
+ return I(() => (r.current && (a == null || a.observe(r.current, e)), () => {
50
50
  a == null || a.disconnect(), t.current && cancelAnimationFrame(t.current);
51
- }), [a, e]), [n, o];
51
+ }), [a, e]), [r, o];
52
52
  }
53
53
  function Ae({
54
54
  value: e,
55
- defaultValue: r,
55
+ defaultValue: n,
56
56
  finalValue: t,
57
- onChange: n = () => {
57
+ onChange: r = () => {
58
58
  },
59
59
  initialControlledDelay: o = 0
60
60
  }) {
61
- const [c, a] = _(!1), [u, s] = _(
62
- r !== void 0 ? r : t
61
+ const [c, a] = k(!1), [u, s] = k(
62
+ n !== void 0 ? n : t
63
63
  ), p = (m) => {
64
- s(m), n == null || n(m);
64
+ s(m), r == null || r(m);
65
65
  };
66
- return C(() => {
66
+ return I(() => {
67
67
  (async () => e !== void 0 && !c && o > 0 && (await new Promise(
68
68
  (m) => setTimeout(m, o)
69
69
  ), a(!0)))();
70
- }, [e, o, c]), e !== void 0 ? !c && o > 0 ? ["", n, !0] : [e, n, !0] : [u, p, !1];
70
+ }, [e, o, c]), e !== void 0 ? !c && o > 0 ? ["", r, !0] : [e, r, !0] : [u, p, !1];
71
71
  }
72
72
  function ge(e) {
73
- const r = ue();
73
+ const n = ue();
74
74
  if (!e)
75
- return r;
75
+ return n;
76
76
  if (typeof e == "number" || typeof e == "string")
77
- return `${e}${r}`;
77
+ return `${e}${n}`;
78
78
  if (typeof e == "object") {
79
- const { id: t, prefix: n = "" } = e;
80
- return typeof t == "number" || typeof t == "string" ? `${n}${t}` : `${n}${r}`;
79
+ const { id: t, prefix: r = "" } = e;
80
+ return typeof t == "number" || typeof t == "string" ? `${r}${t}` : `${r}${n}`;
81
81
  }
82
82
  }
83
- const G = "SET_ANNOUNCEMENT", W = "CLEAR_ANNOUNCEMENT", Te = {
83
+ const z = "SET_ANNOUNCEMENT", W = "CLEAR_ANNOUNCEMENT", Te = {
84
84
  alert: null,
85
85
  alertdialog: null,
86
86
  log: "polite",
@@ -88,12 +88,12 @@ const G = "SET_ANNOUNCEMENT", W = "CLEAR_ANNOUNCEMENT", Te = {
88
88
  progressbar: null,
89
89
  status: "polite",
90
90
  timer: "assertive"
91
- }, be = (e, r) => {
92
- switch (r == null ? void 0 : r.type) {
93
- case G:
91
+ }, _e = (e, n) => {
92
+ switch (n == null ? void 0 : n.type) {
93
+ case z:
94
94
  return {
95
95
  ...e,
96
- announcement: r.payload
96
+ announcement: n.payload
97
97
  };
98
98
  case W:
99
99
  return {
@@ -103,77 +103,77 @@ const G = "SET_ANNOUNCEMENT", W = "CLEAR_ANNOUNCEMENT", Te = {
103
103
  default:
104
104
  return e;
105
105
  }
106
- }, ve = ({
106
+ }, be = ({
107
107
  onAnnouncementClear: e,
108
- dispatch: r
108
+ dispatch: n
109
109
  }) => {
110
- r({
110
+ n({
111
111
  type: W
112
112
  }), typeof e == "function" && e();
113
- }, X = ({
113
+ }, G = ({
114
114
  children: e,
115
- clearAnnouncementDelay: r,
115
+ clearAnnouncementDelay: n,
116
116
  clearAnnouncementTimeoutRef: t,
117
- onAnnouncementClear: n,
117
+ onAnnouncementClear: r,
118
118
  dispatch: o
119
119
  }) => {
120
120
  clearTimeout(t.current), e !== null && o({
121
- type: G,
121
+ type: z,
122
122
  payload: e
123
- }), r && (t.current = setTimeout(
124
- () => ve({
125
- onAnnouncementClear: n,
123
+ }), n && (t.current = setTimeout(
124
+ () => be({
125
+ onAnnouncementClear: r,
126
126
  dispatch: o
127
127
  }),
128
- r
128
+ n
129
129
  ));
130
- }, ke = ({
130
+ }, ve = ({
131
131
  children: e,
132
- announcementTimeoutRef: r,
132
+ announcementTimeoutRef: n,
133
133
  announcementDelay: t,
134
- clearAnnouncementDelay: n,
134
+ clearAnnouncementDelay: r,
135
135
  clearAnnouncementTimeoutRef: o,
136
136
  onAnnouncementClear: c,
137
137
  dispatch: a
138
138
  }) => {
139
- clearTimeout(r.current), t ? r.current = setTimeout(X, t, {
139
+ clearTimeout(n.current), t ? n.current = setTimeout(G, t, {
140
140
  children: e,
141
- clearAnnouncementDelay: n,
141
+ clearAnnouncementDelay: r,
142
142
  clearAnnouncementTimeoutRef: o,
143
143
  onAnnouncementClear: c,
144
144
  dispatch: a
145
- }) : X({
145
+ }) : G({
146
146
  children: e,
147
- clearAnnouncementDelay: n,
147
+ clearAnnouncementDelay: r,
148
148
  clearAnnouncementTimeoutRef: o,
149
149
  onAnnouncementClear: c,
150
150
  dispatch: a
151
151
  });
152
152
  };
153
- function _e({
153
+ function ke({
154
154
  children: e,
155
- className: r,
155
+ className: n,
156
156
  politeness: t,
157
- role: n = null,
157
+ role: r = null,
158
158
  announcementDelay: o,
159
159
  clearAnnouncementDelay: c,
160
160
  onAnnouncementClear: a,
161
161
  visible: u,
162
162
  ...s
163
163
  }) {
164
- const p = f(null), m = f(null), [T, v] = de(be, {
164
+ const p = f(null), m = f(null), [T, b] = de(_e, {
165
165
  announcement: null
166
166
  });
167
167
  let x = t;
168
- typeof x > "u" && (x = n ? Te[n] : "assertive"), C(() => {
169
- ke({
168
+ typeof x > "u" && (x = r ? Te[r] : "assertive"), I(() => {
169
+ ve({
170
170
  announcementTimeoutRef: p,
171
171
  announcementDelay: o,
172
172
  children: e,
173
173
  clearAnnouncementDelay: c,
174
174
  clearAnnouncementTimeoutRef: m,
175
175
  onAnnouncementClear: a,
176
- dispatch: v
176
+ dispatch: b
177
177
  });
178
178
  }, [
179
179
  e,
@@ -181,121 +181,133 @@ function _e({
181
181
  c,
182
182
  a
183
183
  ]);
184
- const d = l(r, {
184
+ const d = l(n, {
185
185
  "sr-only": !u
186
186
  });
187
187
  return /* @__PURE__ */ g(
188
188
  "div",
189
189
  {
190
190
  "aria-live": x,
191
- ...n && { role: n },
191
+ ...r && { role: r },
192
192
  className: d,
193
193
  ...s,
194
194
  children: T.announcement
195
195
  }
196
196
  );
197
197
  }
198
- const Ee = (e) => {
199
- let r = "";
200
- if (typeof e == "number" || typeof e == "string")
201
- r = "m-" + e;
202
- else {
203
- const t = [];
204
- (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}`), r = t.join(" ");
205
- }
206
- return r;
207
- };
208
198
  /*!
209
- @versini/ui-private v1.5.1
199
+ @versini/ui-liveregion v1.0.0
200
+ © 2024 gizmette.com
201
+ */
202
+ try {
203
+ window.__VERSINI_UI_LIVEREGION__ || (window.__VERSINI_UI_LIVEREGION__ = {
204
+ version: "1.0.0",
205
+ buildTime: "12/25/2024 10:51 AM EST",
206
+ homepage: "https://github.com/aversini/ui-components",
207
+ license: "MIT"
208
+ });
209
+ } catch {
210
+ }
211
+ /*!
212
+ @versini/ui-spacing v1.0.0
210
213
  © 2024 gizmette.com
211
214
  */
212
215
  try {
213
- window.__VERSINI_UI_PRIVATE__ || (window.__VERSINI_UI_PRIVATE__ = {
214
- version: "1.5.1",
215
- buildTime: "12/18/2024 01:22 PM EST",
216
+ window.__VERSINI_UI_SPACING__ || (window.__VERSINI_UI_SPACING__ = {
217
+ version: "1.0.0",
218
+ buildTime: "12/25/2024 10:51 AM EST",
216
219
  homepage: "https://github.com/aversini/ui-components",
217
220
  license: "MIT"
218
221
  });
219
222
  } catch {
220
223
  }
221
- const Re = () => "rounded-md text-base h-20 min-h-[80px] resize-none overflow-hidden px-4 py-7", Ne = ({
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 = ({
222
234
  mode: e
223
235
  }) => l({
224
236
  "bg-surface-darker text-copy-lighter caret-copy-light": e === "dark",
225
237
  "bg-surface-lighter text-copy-dark caret-copy-dark": e === "light",
226
238
  "bg-surface-lighter text-copy-dark caret-copy-dark dark:bg-surface-darker dark:text-copy-lighter dark:caret-copy-light": e === "system",
227
239
  "bg-surface-darker text-copy-lighter caret-copy-light dark:bg-surface-lighter dark:text-copy-dark dark:caret-copy-dark": e === "alt-system"
228
- }), Ce = ({
240
+ }), Ie = ({
229
241
  focusMode: e
230
242
  }) => l("focus:outline focus:outline-2 focus:outline-offset-2", {
231
243
  "focus:outline-focus-dark": e === "dark",
232
244
  "focus:outline-focus-light": e === "light",
233
245
  "focus:outline-focus-light dark:focus:outline-focus-dark": e === "alt-system",
234
246
  "focus:outline-focus-dark dark:focus:outline-focus-light": e === "system"
235
- }), Ie = ({
247
+ }), Ce = ({
236
248
  noBorder: e,
237
- error: r
249
+ error: n
238
250
  }) => l("border-2", {
239
- "border-border-dark": !e && !r,
240
- "focus:border-border-dark": !e && r,
241
- "border-border-error-dark": !e && r,
251
+ "border-border-dark": !e && !n,
252
+ "focus:border-border-dark": !e && n,
253
+ "border-border-error-dark": !e && n,
242
254
  "border-transparent": e
243
255
  }), Se = ({
244
256
  disabled: e,
245
- raw: r,
257
+ raw: n,
246
258
  error: t,
247
- mode: n
259
+ mode: r
248
260
  }) => {
249
- if (r)
261
+ if (n)
250
262
  return "";
251
263
  if (e)
252
264
  return l("absolute px-2 cursor-not-allowed opacity-50 font-medium");
253
265
  if (!t)
254
266
  return l("absolute px-2 cursor-text font-medium", {
255
- "text-copy-medium": n === "dark",
256
- "text-copy-dark": n === "light",
257
- "text-copy-dark dark:text-copy-medium": n === "system",
258
- "text-copy-medium dark:text-copy-dark": n === "alt-system"
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"
259
271
  });
260
272
  if (t)
261
273
  return l("absolute px-2 cursor-text font-medium", {
262
- "text-copy-medium": n === "dark",
263
- "text-copy-error-dark": n === "light",
264
- "text-copy-error-dark dark:text-copy-error-light": n === "system",
265
- "text-copy-medium dark:text-copy-error-dark": n === "alt-system"
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"
266
278
  });
267
279
  }, Oe = ({
268
280
  error: e,
269
- raw: r,
281
+ raw: n,
270
282
  mode: t,
271
- disabled: n
283
+ disabled: r
272
284
  }) => {
273
- if (r)
274
- return "";
275
285
  if (n)
286
+ return "";
287
+ if (r)
276
288
  return l(
277
- H,
289
+ M,
278
290
  "absolute px-2 cursor-not-allowed opacity-50 font-medium"
279
291
  );
280
292
  if (!e)
281
- return l(H, "absolute px-2 font-medium", {
293
+ return l(M, "absolute px-2 font-medium", {
282
294
  "text-copy-medium": t === "dark",
283
295
  "text-copy-dark": t === "light",
284
296
  "text-copy-dark dark:text-copy-medium": t === "system",
285
297
  "text-copy-medium dark:text-copy-dark": t === "alt-system"
286
298
  });
287
299
  if (e)
288
- return l(H, "absolute px-2 font-medium", {
300
+ return l(M, "absolute px-2 font-medium", {
289
301
  "text-copy-error-light": t === "dark",
290
302
  "text-copy-error-dark": t === "light",
291
303
  "text-copy-error-dark dark:text-copy-error-light": t === "system",
292
304
  "dark:text-copy-error-dark text-copy-error-light": t === "alt-system"
293
305
  });
294
- }, $e = ({
306
+ }, we = ({
295
307
  className: e,
296
- textAreaClassName: r,
308
+ textAreaClassName: n,
297
309
  raw: t,
298
- focusMode: n,
310
+ focusMode: r,
299
311
  disabled: o,
300
312
  noBorder: c,
301
313
  error: a,
@@ -307,20 +319,20 @@ const Re = () => "rounded-md text-base h-20 min-h-[80px] resize-none overflow-hi
307
319
  fe,
308
320
  e,
309
321
  Ee(u)
310
- ), m = t ? l(r) : l(
311
- z,
312
- r,
322
+ ), m = t ? l(n) : l(
323
+ j,
324
+ n,
313
325
  Re(),
314
326
  Ne({ mode: s }),
315
- Ce({ focusMode: n }),
316
- Ie({
327
+ Ie({ focusMode: r }),
328
+ Ce({
317
329
  noBorder: c,
318
330
  error: a
319
331
  }),
320
332
  {
321
333
  "disabled:cursor-not-allowed disabled:opacity-50": o
322
334
  }
323
- ), T = t ? void 0 : "sr-only", v = Se({
335
+ ), T = t ? void 0 : "sr-only", b = Se({
324
336
  disabled: o,
325
337
  raw: t,
326
338
  error: a,
@@ -335,32 +347,32 @@ const Re = () => "rounded-md text-base h-20 min-h-[80px] resize-none overflow-hi
335
347
  wrapper: p,
336
348
  textArea: m,
337
349
  accessibleLabel: T,
338
- visibleLabel: v,
350
+ visibleLabel: b,
339
351
  helperText: x,
340
352
  rightElement: d
341
353
  };
342
354
  }, Le = ({
343
355
  scrollHeight: e,
344
- currentHeight: r,
356
+ currentHeight: n,
345
357
  currentLabelOffset: t = 0,
346
- currentHelperTextOffset: n = 0
358
+ currentHelperTextOffset: r = 0
347
359
  }) => {
348
360
  let a, u;
349
- if (e > 0 && e !== r) {
350
- const s = e - r, p = Math.abs(s / 24);
351
- a = t + -1 * Math.sign(s) * (12 * p), u = n + Math.sign(s) * (12 * p);
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);
352
364
  }
353
365
  return {
354
366
  labelOffset: a,
355
367
  helperTextOffset: u,
356
368
  scrollHeight: e
357
369
  };
358
- }, we = le.forwardRef(
370
+ }, $e = le.forwardRef(
359
371
  ({
360
372
  id: e,
361
- name: r,
373
+ name: n,
362
374
  label: t,
363
- error: n = !1,
375
+ error: r = !1,
364
376
  raw: o = !1,
365
377
  className: c,
366
378
  textAreaClassName: a,
@@ -369,46 +381,46 @@ const Re = () => "rounded-md text-base h-20 min-h-[80px] resize-none overflow-hi
369
381
  value: p,
370
382
  defaultValue: m,
371
383
  disabled: T = !1,
372
- noBorder: v = !1,
384
+ noBorder: b = !1,
373
385
  labelId: x,
374
386
  helperText: d = "",
375
- helperTextOnFocus: I = !1,
387
+ helperTextOnFocus: C = !1,
376
388
  rightElement: S,
377
- onChange: P,
389
+ onChange: H,
378
390
  onFocus: D,
379
- onBlur: M,
391
+ onBlur: F,
380
392
  spacing: q,
381
393
  ...B
382
394
  }, J) => {
383
- 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), k = ge({ id: e, prefix: `${z}-` }), [Y, Z] = _(0), [ee, V] = _(
384
- !!(!I && d)
385
- ), te = `${r} error, ${d}`, b = $e({
395
+ const y = f(null), K = ye([J, y]), [Q, E] = xe(), O = f(80), P = 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({
386
398
  className: c,
387
399
  textAreaClassName: a,
388
- error: n,
400
+ error: r,
389
401
  raw: o,
390
402
  focusMode: s,
391
403
  disabled: T,
392
- noBorder: v,
404
+ noBorder: b,
393
405
  spacing: q,
394
406
  mode: u
395
- }), [h, re] = Ae({
407
+ }), [h, ne] = Ae({
396
408
  value: p,
397
409
  initialControlledDelay: 20,
398
410
  defaultValue: m,
399
411
  onChange: (i) => {
400
- P && P({
412
+ H && H({
401
413
  target: {
402
414
  value: i
403
415
  }
404
416
  });
405
417
  }
406
- }), ne = (i) => {
407
- re(i.target.value);
418
+ }), re = (i) => {
419
+ ne(i.target.value);
408
420
  }, oe = (i) => {
409
- I && d && V(!0), D && D(i);
421
+ C && d && V(!0), D && D(i);
410
422
  }, ae = (i) => {
411
- I && d && !h && V(!1), M && M(i);
423
+ C && d && !h && V(!1), F && F(i);
412
424
  };
413
425
  return N(() => {
414
426
  E && E.width && Z(E.width + 18 + 10);
@@ -423,29 +435,29 @@ const Re = () => "rounded-md text-base h-20 min-h-[80px] resize-none overflow-hi
423
435
  );
424
436
  }, 0);
425
437
  }, [h, o]), N(() => {
426
- var i, $;
438
+ var i, w;
427
439
  if (!o && y && y.current && h !== void 0) {
428
- const { labelOffset: L, helperTextOffset: w, scrollHeight: ce } = Le({
440
+ const { labelOffset: L, helperTextOffset: $, scrollHeight: ce } = Le({
429
441
  scrollHeight: y.current.scrollHeight,
430
442
  currentHeight: O.current,
431
- currentLabelOffset: F.current,
443
+ currentLabelOffset: P.current,
432
444
  currentHelperTextOffset: U.current
433
445
  });
434
- L && (F.current = L, (i = A == null ? void 0 : A.current) == null || i.style.setProperty(
446
+ L && (P.current = L, (i = A == null ? void 0 : A.current) == null || i.style.setProperty(
435
447
  "--av-text-area-label",
436
448
  `${L}px`
437
- )), w && (U.current = w, ($ = R == null ? void 0 : R.current) == null || $.style.setProperty(
449
+ )), $ && (U.current = $, (w = R == null ? void 0 : R.current) == null || w.style.setProperty(
438
450
  "--av-text-area-helper-text",
439
- `${w}px`
451
+ `${$}px`
440
452
  )), O.current = ce || O.current;
441
453
  }
442
- }, [h, o]), /* @__PURE__ */ se("div", { className: b.wrapper, children: [
454
+ }, [h, o]), /* @__PURE__ */ se("div", { className: _.wrapper, children: [
443
455
  /* @__PURE__ */ g(
444
456
  "label",
445
457
  {
446
- htmlFor: k,
458
+ htmlFor: v,
447
459
  id: x,
448
- className: b.accessibleLabel,
460
+ className: _.accessibleLabel,
449
461
  children: t
450
462
  }
451
463
  ),
@@ -453,17 +465,17 @@ const Re = () => "rounded-md text-base h-20 min-h-[80px] resize-none overflow-hi
453
465
  "textarea",
454
466
  {
455
467
  ref: K,
456
- id: k,
457
- name: r,
468
+ id: v,
469
+ name: n,
458
470
  disabled: T,
459
471
  placeholder: o ? void 0 : " ",
460
- className: b.textArea,
472
+ className: _.textArea,
461
473
  rows: 1,
462
- ...d && { "aria-describedby": `${k}-helper` },
463
- ...n && { "aria-invalid": "true" },
474
+ ...d && { "aria-describedby": `${v}-helper` },
475
+ ...r && { "aria-invalid": "true" },
464
476
  ...S && !o && { style: { paddingRight: Y } },
465
477
  value: h,
466
- onChange: ne,
478
+ onChange: re,
467
479
  onFocus: oe,
468
480
  onBlur: ae,
469
481
  ...B
@@ -474,8 +486,8 @@ const Re = () => "rounded-md text-base h-20 min-h-[80px] resize-none overflow-hi
474
486
  {
475
487
  ref: A,
476
488
  "aria-hidden": !0,
477
- htmlFor: k,
478
- className: b.visibleLabel,
489
+ htmlFor: v,
490
+ className: _.visibleLabel,
479
491
  children: t
480
492
  }
481
493
  ),
@@ -483,8 +495,8 @@ const Re = () => "rounded-md text-base h-20 min-h-[80px] resize-none overflow-hi
483
495
  "div",
484
496
  {
485
497
  ref: R,
486
- id: `${k}-helper`,
487
- className: b.helperText,
498
+ id: `${v}-helper`,
499
+ className: _.helperText,
488
500
  children: d
489
501
  }
490
502
  ),
@@ -492,19 +504,19 @@ const Re = () => "rounded-md text-base h-20 min-h-[80px] resize-none overflow-hi
492
504
  "div",
493
505
  {
494
506
  ref: Q,
495
- className: b.rightElement,
507
+ className: _.rightElement,
496
508
  children: S
497
509
  }
498
510
  ),
499
- n && d && /* @__PURE__ */ g(_e, { politeness: "polite", clearAnnouncementDelay: 500, children: te })
511
+ r && d && /* @__PURE__ */ g(ke, { politeness: "polite", clearAnnouncementDelay: 500, children: te })
500
512
  ] });
501
513
  }
502
514
  );
503
- we.displayName = "TextArea";
515
+ $e.displayName = "TextArea";
504
516
  export {
505
- z as TEXT_AREA_CLASSNAME,
517
+ j as TEXT_AREA_CLASSNAME,
506
518
  pe as TEXT_AREA_CONTROL_RIGHT_CLASSNAME,
507
- H as TEXT_AREA_HELPER_TEXT_CLASSNAME,
519
+ M as TEXT_AREA_HELPER_TEXT_CLASSNAME,
508
520
  fe as TEXT_AREA_WRAPPER_CLASSNAME,
509
- we as TextArea
521
+ $e as TextArea
510
522
  };
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}.container{width:100%}@media (min-width: 640px){.container{max-width:640px}}@media (min-width: 768px){.container{max-width:768px}}@media (min-width: 1024px){.container{max-width:1024px}}@media (min-width: 1280px){.container{max-width:1280px}}@media (min-width: 1536px){.container{max-width:1536px}}.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}.grid{display:grid}.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}.place-items-center{place-items:center}.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-black{--tw-bg-opacity: 1;background-color:rgb(0 0 0 / var(--tw-bg-opacity, 1))}.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 (min-width: 640px){.sm\:bg-black\/\[\.8\]{background-color:#000c}}@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}.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))}}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@versini/ui-textarea",
3
- "version": "1.1.1",
3
+ "version": "1.3.0",
4
4
  "license": "MIT",
5
5
  "author": "Arno Versini",
6
6
  "publishConfig": {
@@ -40,12 +40,14 @@
40
40
  "dependencies": {
41
41
  "@tailwindcss/typography": "0.5.15",
42
42
  "@versini/ui-hooks": "4.3.0",
43
- "@versini/ui-private": "1.5.1",
43
+ "@versini/ui-liveregion": "1.0.0",
44
+ "@versini/ui-spacing": "1.0.0",
45
+ "@versini/ui-spacing-types": "1.0.0",
44
46
  "clsx": "2.1.1",
45
47
  "tailwindcss": "3.4.17"
46
48
  },
47
49
  "sideEffects": [
48
50
  "**/*.css"
49
51
  ],
50
- "gitHead": "123c2555b25210da73697c4fdd3b6a5f67a3b993"
52
+ "gitHead": "a15d974fcc1a098a9f35a80ff37b1b0901278d96"
51
53
  }