@pittorica/text-area-react 0.23.2 → 0.25.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.
Files changed (4) hide show
  1. package/dist/TextArea.d.ts +9 -5
  2. package/dist/TextArea.d.ts.map +1 -1
  3. package/dist/index.js +214 -231
  4. package/package.json +6 -7
package/dist/TextArea.d.ts CHANGED
@@ -1,8 +1,11 @@
1
- import { type ReactNode } from 'react';
1
+ import React, { type ElementType, type ReactNode } from 'react';
2
2
  import { type BoxProps } from '@pittorica/box-react';
3
3
  import type { PittoricaColor } from '@pittorica/text-react';
4
4
  type TextAreaSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
5
- export interface TextAreaRootProps extends BoxProps {
5
+ /**
6
+ * Fix TS2314 & TS2312: Use 'type' alias for intersection with polymorphic BoxProps<E>.
7
+ */
8
+ export type TextAreaRootProps<E extends ElementType = 'div'> = BoxProps<E> & {
6
9
  label?: ReactNode;
7
10
  helperText?: ReactNode;
8
11
  error?: boolean;
@@ -11,11 +14,12 @@ export interface TextAreaRootProps extends BoxProps {
11
14
  name?: string;
12
15
  /** @default 'sm' */
13
16
  size?: TextAreaSize;
14
- }
17
+ };
15
18
  /**
16
19
  * Radix-like Outlined TextArea Root with support for multiple sizes.
20
+ * Polymorphic and agnostic implementation.
17
21
  */
18
- export declare const TextAreaRoot: ({ children, label, helperText, error, color, disabled, name, size, className, style, ...props }: TextAreaRootProps) => import("react/jsx-runtime").JSX.Element;
22
+ export declare const TextAreaRoot: <E extends ElementType = "div">({ children, label, helperText, error, color, disabled, name, size, className, style, as, ...props }: TextAreaRootProps<E>) => import("react/jsx-runtime").JSX.Element;
19
23
  export interface TextAreaContentProps extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {
20
24
  /** Enables automatic vertical resizing based on content */
21
25
  autoResize?: boolean;
@@ -25,7 +29,7 @@ export interface TextAreaContentProps extends React.TextareaHTMLAttributes<HTMLT
25
29
  */
26
30
  export declare const TextAreaContent: ({ className, autoResize, onChange, value, defaultValue, name: propsName, ...props }: TextAreaContentProps) => import("react/jsx-runtime").JSX.Element;
27
31
  export declare const TextArea: {
28
- Root: ({ children, label, helperText, error, color, disabled, name, size, className, style, ...props }: TextAreaRootProps) => import("react/jsx-runtime").JSX.Element;
32
+ Root: <E extends ElementType = "div">({ children, label, helperText, error, color, disabled, name, size, className, style, as, ...props }: TextAreaRootProps<E>) => import("react/jsx-runtime").JSX.Element;
29
33
  Content: ({ className, autoResize, onChange, value, defaultValue, name: propsName, ...props }: TextAreaContentProps) => import("react/jsx-runtime").JSX.Element;
30
34
  };
31
35
  export {};
package/dist/TextArea.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"TextArea.d.ts","sourceRoot":"","sources":["../src/TextArea.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,SAAS,EAKf,MAAM,OAAO,CAAC;AAIf,OAAO,EAAO,KAAK,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAG5D,KAAK,YAAY,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAoBrD,MAAM,WAAW,iBAAkB,SAAQ,QAAQ;IACjD,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,KAAK,CAAC,EAAE,cAAc,CAAC;IACvB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,oBAAoB;IACpB,IAAI,CAAC,EAAE,YAAY,CAAC;CACrB;AAED;;GAEG;AACH,eAAO,MAAM,YAAY,GAAI,iGAY1B,iBAAiB,4CAwDnB,CAAC;AAGF,MAAM,WAAW,oBAAqB,SAAQ,KAAK,CAAC,sBAAsB,CAAC,mBAAmB,CAAC;IAC7F,2DAA2D;IAC3D,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED;;GAEG;AACH,eAAO,MAAM,eAAe,GAAI,qFAQ7B,oBAAoB,4CAkDtB,CAAC;AAEF,eAAO,MAAM,QAAQ;4GA/HlB,iBAAiB;mGA2EjB,oBAAoB;CAuDtB,CAAC"}
1
+ {"version":3,"file":"TextArea.d.ts","sourceRoot":"","sources":["../src/TextArea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAEZ,KAAK,WAAW,EAChB,KAAK,SAAS,EAKf,MAAM,OAAO,CAAC;AAIf,OAAO,EAAO,KAAK,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAG5D,KAAK,YAAY,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAqBrD;;GAEG;AACH,MAAM,MAAM,iBAAiB,CAAC,CAAC,SAAS,WAAW,GAAG,KAAK,IAAI,QAAQ,CAAC,CAAC,CAAC,GAAG;IAC3E,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,KAAK,CAAC,EAAE,cAAc,CAAC;IACvB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,oBAAoB;IACpB,IAAI,CAAC,EAAE,YAAY,CAAC;CACrB,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,YAAY,GAAI,CAAC,SAAS,WAAW,GAAG,KAAK,EAAE,qGAazD,iBAAiB,CAAC,CAAC,CAAC,4CA2DtB,CAAC;AAIF,MAAM,WAAW,oBAAqB,SAAQ,KAAK,CAAC,sBAAsB,CAAC,mBAAmB,CAAC;IAC7F,2DAA2D;IAC3D,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED;;GAEG;AACH,eAAO,MAAM,eAAe,GAAI,qFAQ7B,oBAAoB,4CAkDtB,CAAC;AAEF,eAAO,MAAM,QAAQ;WAhJQ,CAAC,SAAS,WAAW,+GAa/C,iBAAiB,CAAC,CAAC,CAAC;mGA+EpB,oBAAoB;CAuDtB,CAAC"}
package/dist/index.js CHANGED
@@ -1,182 +1,158 @@
1
- import { jsx as u, jsxs as D } from "react/jsx-runtime";
2
- import { createContext as G, useRef as J, useEffect as K, useId as C, use as M } from "react";
3
- function I(t) {
4
- var i, r, e = "";
5
- if (typeof t == "string" || typeof t == "number") e += t;
1
+ import { jsx as x, jsxs as q } from "react/jsx-runtime";
2
+ import { createContext as D, useRef as G, useEffect as J, useId as R, use as K } from "react";
3
+ function W(t) {
4
+ var a, i, r = "";
5
+ if (typeof t == "string" || typeof t == "number") r += t;
6
6
  else if (typeof t == "object") if (Array.isArray(t)) {
7
- var a = t.length;
8
- for (i = 0; i < a; i++) t[i] && (r = I(t[i])) && (e && (e += " "), e += r);
9
- } else for (r in t) t[r] && (e && (e += " "), e += r);
10
- return e;
7
+ var n = t.length;
8
+ for (a = 0; a < n; a++) t[a] && (i = W(t[a])) && (r && (r += " "), r += i);
9
+ } else for (i in t) t[i] && (r && (r += " "), r += i);
10
+ return r;
11
11
  }
12
- function L() {
13
- for (var t, i, r = 0, e = "", a = arguments.length; r < a; r++) (t = arguments[r]) && (i = I(t)) && (e && (e += " "), e += i);
14
- return e;
12
+ function z() {
13
+ for (var t, a, i = 0, r = "", n = arguments.length; i < n; i++) (t = arguments[i]) && (a = W(t)) && (r && (r += " "), r += a);
14
+ return r;
15
15
  }
16
- function S(t) {
17
- var i, r, e = "";
18
- if (typeof t == "string" || typeof t == "number") e += t;
16
+ function C(t) {
17
+ var a, i, r = "";
18
+ if (typeof t == "string" || typeof t == "number") r += t;
19
19
  else if (typeof t == "object") if (Array.isArray(t)) {
20
- var a = t.length;
21
- for (i = 0; i < a; i++) t[i] && (r = S(t[i])) && (e && (e += " "), e += r);
22
- } else for (r in t) t[r] && (e && (e += " "), e += r);
23
- return e;
20
+ var n = t.length;
21
+ for (a = 0; a < n; a++) t[a] && (i = C(t[a])) && (r && (r += " "), r += i);
22
+ } else for (i in t) t[i] && (r && (r += " "), r += i);
23
+ return r;
24
24
  }
25
- function O() {
26
- for (var t, i, r = 0, e = "", a = arguments.length; r < a; r++) (t = arguments[r]) && (i = S(t)) && (e && (e += " "), e += i);
27
- return e;
25
+ function M() {
26
+ for (var t, a, i = 0, r = "", n = arguments.length; i < n; i++) (t = arguments[i]) && (a = C(t)) && (r && (r += " "), r += a);
27
+ return r;
28
28
  }
29
- const W = ({
30
- ref: t,
31
- as: i = "div",
32
- children: r,
33
- display: e,
34
- m: a,
35
- mt: s,
29
+ const I = ({
30
+ as: t,
31
+ children: a,
32
+ display: i,
33
+ m: r,
34
+ mt: n,
36
35
  mr: l,
37
- mb: d,
38
- ml: m,
36
+ mb: o,
37
+ ml: g,
38
+ mx: p,
39
+ my: c,
39
40
  p: f,
40
- pt: h,
41
- pr: p,
42
- pb: c,
43
- pl: g,
44
- width: o,
45
- height: v,
46
- position: y,
47
- style: x,
48
- className: b,
49
- href: $,
50
- target: w,
51
- rel: A,
52
- htmlFor: N,
53
- type: T,
54
- name: j,
55
- disabled: B,
56
- ...F
41
+ pt: m,
42
+ pr: d,
43
+ pb: h,
44
+ pl: s,
45
+ px: v,
46
+ py: u,
47
+ width: $,
48
+ height: y,
49
+ position: b,
50
+ style: T,
51
+ className: A,
52
+ disabled: w,
53
+ ...N
57
54
  }) => {
58
- const n = {};
59
- e && (n.display = e), o && (n.width = o), v && (n.height = v), y && (n.position = y), a && (n.margin = `var(--pittorica-space-${a})`), s && (n.marginTop = `var(--pittorica-space-${s})`), l && (n.marginRight = `var(--pittorica-space-${l})`), d && (n.marginBottom = `var(--pittorica-space-${d})`), m && (n.marginLeft = `var(--pittorica-space-${m})`), f && (n.padding = `var(--pittorica-space-${f})`), h && (n.paddingTop = `var(--pittorica-space-${h})`), p && (n.paddingRight = `var(--pittorica-space-${p})`), c && (n.paddingBottom = `var(--pittorica-space-${c})`), g && (n.paddingLeft = `var(--pittorica-space-${g})`);
60
- const R = {
61
- ...x,
62
- ...n
55
+ const B = t || "div", e = {};
56
+ i && (e.display = i), $ && (e.width = $), y && (e.height = y), b && (e.position = b), r && (e.margin = `var(--pittorica-space-${r})`), n && (e.marginTop = `var(--pittorica-space-${n})`), l && (e.marginRight = `var(--pittorica-space-${l})`), o && (e.marginBottom = `var(--pittorica-space-${o})`), g && (e.marginLeft = `var(--pittorica-space-${g})`), p && (e.marginLeft = `var(--pittorica-space-${p})`, e.marginRight = `var(--pittorica-space-${p})`), c && (e.marginTop = `var(--pittorica-space-${c})`, e.marginBottom = `var(--pittorica-space-${c})`), f && (e.padding = `var(--pittorica-space-${f})`), m && (e.paddingTop = `var(--pittorica-space-${m})`), d && (e.paddingRight = `var(--pittorica-space-${d})`), h && (e.paddingBottom = `var(--pittorica-space-${h})`), s && (e.paddingLeft = `var(--pittorica-space-${s})`), v && (e.paddingLeft = `var(--pittorica-space-${v})`, e.paddingRight = `var(--pittorica-space-${v})`), u && (e.paddingTop = `var(--pittorica-space-${u})`, e.paddingBottom = `var(--pittorica-space-${u})`);
57
+ const L = {
58
+ ...T,
59
+ ...e
63
60
  };
64
- return /* @__PURE__ */ u(
65
- i,
61
+ return /* @__PURE__ */ x(
62
+ B,
66
63
  {
67
- ref: t,
68
- className: O("pittorica-box", b),
69
- style: R,
70
- href: $,
71
- target: w,
72
- rel: A,
73
- htmlFor: N,
74
- type: T,
75
- name: j,
76
- disabled: B,
77
- ...F,
78
- children: r
64
+ className: M("pittorica-box", A),
65
+ style: L,
66
+ disabled: w,
67
+ ...N,
68
+ children: a
79
69
  }
80
70
  );
81
71
  };
82
- W.displayName = "Box";
83
- function k(t) {
84
- var i, r, e = "";
85
- if (typeof t == "string" || typeof t == "number") e += t;
72
+ I.displayName = "Box";
73
+ function S(t) {
74
+ var a, i, r = "";
75
+ if (typeof t == "string" || typeof t == "number") r += t;
86
76
  else if (typeof t == "object") if (Array.isArray(t)) {
87
- var a = t.length;
88
- for (i = 0; i < a; i++) t[i] && (r = k(t[i])) && (e && (e += " "), e += r);
89
- } else for (r in t) t[r] && (e && (e += " "), e += r);
90
- return e;
77
+ var n = t.length;
78
+ for (a = 0; a < n; a++) t[a] && (i = S(t[a])) && (r && (r += " "), r += i);
79
+ } else for (i in t) t[i] && (r && (r += " "), r += i);
80
+ return r;
91
81
  }
92
- function P() {
93
- for (var t, i, r = 0, e = "", a = arguments.length; r < a; r++) (t = arguments[r]) && (i = k(t)) && (e && (e += " "), e += i);
94
- return e;
82
+ function j() {
83
+ for (var t, a, i = 0, r = "", n = arguments.length; i < n; i++) (t = arguments[i]) && (a = S(t)) && (r && (r += " "), r += a);
84
+ return r;
95
85
  }
96
- function q(t) {
97
- var i, r, e = "";
98
- if (typeof t == "string" || typeof t == "number") e += t;
86
+ function k(t) {
87
+ var a, i, r = "";
88
+ if (typeof t == "string" || typeof t == "number") r += t;
99
89
  else if (typeof t == "object") if (Array.isArray(t)) {
100
- var a = t.length;
101
- for (i = 0; i < a; i++) t[i] && (r = q(t[i])) && (e && (e += " "), e += r);
102
- } else for (r in t) t[r] && (e && (e += " "), e += r);
103
- return e;
90
+ var n = t.length;
91
+ for (a = 0; a < n; a++) t[a] && (i = k(t[a])) && (r && (r += " "), r += i);
92
+ } else for (i in t) t[i] && (r && (r += " "), r += i);
93
+ return r;
104
94
  }
105
- function Q() {
106
- for (var t, i, r = 0, e = "", a = arguments.length; r < a; r++) (t = arguments[r]) && (i = q(t)) && (e && (e += " "), e += i);
107
- return e;
95
+ function O() {
96
+ for (var t, a, i = 0, r = "", n = arguments.length; i < n; i++) (t = arguments[i]) && (a = k(t)) && (r && (r += " "), r += a);
97
+ return r;
108
98
  }
109
99
  const E = ({
110
- ref: t,
111
- as: i = "div",
112
- children: r,
113
- display: e,
114
- m: a,
115
- mt: s,
100
+ as: t,
101
+ children: a,
102
+ display: i,
103
+ m: r,
104
+ mt: n,
116
105
  mr: l,
117
- mb: d,
118
- ml: m,
106
+ mb: o,
107
+ ml: g,
108
+ mx: p,
109
+ my: c,
119
110
  p: f,
120
- pt: h,
121
- pr: p,
122
- pb: c,
123
- pl: g,
124
- width: o,
125
- height: v,
126
- position: y,
127
- style: x,
128
- className: b,
129
- href: $,
130
- target: w,
131
- rel: A,
132
- htmlFor: N,
133
- type: T,
134
- name: j,
135
- disabled: B,
136
- ...F
111
+ pt: m,
112
+ pr: d,
113
+ pb: h,
114
+ pl: s,
115
+ px: v,
116
+ py: u,
117
+ width: $,
118
+ height: y,
119
+ position: b,
120
+ style: T,
121
+ className: A,
122
+ disabled: w,
123
+ ...N
137
124
  }) => {
138
- const n = {};
139
- e && (n.display = e), o && (n.width = o), v && (n.height = v), y && (n.position = y), a && (n.margin = `var(--pittorica-space-${a})`), s && (n.marginTop = `var(--pittorica-space-${s})`), l && (n.marginRight = `var(--pittorica-space-${l})`), d && (n.marginBottom = `var(--pittorica-space-${d})`), m && (n.marginLeft = `var(--pittorica-space-${m})`), f && (n.padding = `var(--pittorica-space-${f})`), h && (n.paddingTop = `var(--pittorica-space-${h})`), p && (n.paddingRight = `var(--pittorica-space-${p})`), c && (n.paddingBottom = `var(--pittorica-space-${c})`), g && (n.paddingLeft = `var(--pittorica-space-${g})`);
140
- const R = {
141
- ...x,
142
- ...n
125
+ const B = t || "div", e = {};
126
+ i && (e.display = i), $ && (e.width = $), y && (e.height = y), b && (e.position = b), r && (e.margin = `var(--pittorica-space-${r})`), n && (e.marginTop = `var(--pittorica-space-${n})`), l && (e.marginRight = `var(--pittorica-space-${l})`), o && (e.marginBottom = `var(--pittorica-space-${o})`), g && (e.marginLeft = `var(--pittorica-space-${g})`), p && (e.marginLeft = `var(--pittorica-space-${p})`, e.marginRight = `var(--pittorica-space-${p})`), c && (e.marginTop = `var(--pittorica-space-${c})`, e.marginBottom = `var(--pittorica-space-${c})`), f && (e.padding = `var(--pittorica-space-${f})`), m && (e.paddingTop = `var(--pittorica-space-${m})`), d && (e.paddingRight = `var(--pittorica-space-${d})`), h && (e.paddingBottom = `var(--pittorica-space-${h})`), s && (e.paddingLeft = `var(--pittorica-space-${s})`), v && (e.paddingLeft = `var(--pittorica-space-${v})`, e.paddingRight = `var(--pittorica-space-${v})`), u && (e.paddingTop = `var(--pittorica-space-${u})`, e.paddingBottom = `var(--pittorica-space-${u})`);
127
+ const L = {
128
+ ...T,
129
+ ...e
143
130
  };
144
- return /* @__PURE__ */ u(
145
- i,
131
+ return /* @__PURE__ */ x(
132
+ B,
146
133
  {
147
- ref: t,
148
- className: Q("pittorica-box", b),
149
- style: R,
150
- href: $,
151
- target: w,
152
- rel: A,
153
- htmlFor: N,
154
- type: T,
155
- name: j,
156
- disabled: B,
157
- ...F,
158
- children: r
134
+ className: O("pittorica-box", A),
135
+ style: L,
136
+ disabled: w,
137
+ ...N,
138
+ children: a
159
139
  }
160
140
  );
161
141
  };
162
142
  E.displayName = "Box";
163
- const U = ({
143
+ const H = ({
164
144
  children: t,
165
- as: i = "span",
145
+ as: a,
146
+ size: i,
166
147
  weight: r = "regular",
167
- align: e,
168
- truncate: a = !1,
169
- color: s,
170
- className: l,
171
- style: d,
172
- href: m,
173
- target: f,
174
- rel: h,
175
- htmlFor: p,
176
- name: c,
177
- ...g
148
+ align: n,
149
+ truncate: l = !1,
150
+ color: o,
151
+ className: g,
152
+ style: p,
153
+ ...c
178
154
  }) => {
179
- const o = (s == null ? void 0 : s.startsWith("#")) || (s == null ? void 0 : s.startsWith("rgb")) || (s == null ? void 0 : s.startsWith("hsl")), v = /* @__PURE__ */ new Set([
155
+ const f = a || "span", m = (o == null ? void 0 : o.startsWith("#")) || (o == null ? void 0 : o.startsWith("rgb")) || (o == null ? void 0 : o.startsWith("hsl")), d = /* @__PURE__ */ new Set([
180
156
  "danger",
181
157
  "success",
182
158
  "error",
@@ -188,69 +164,76 @@ const U = ({
188
164
  "slate",
189
165
  "blue",
190
166
  "red"
191
- ]), y = (() => {
192
- if (s)
193
- return s === "inherit" ? "inherit" : o ? s : v.has(s) ? `var(--pittorica-${s}-9)` : s;
194
- })(), x = {
195
- ...d,
196
- textAlign: e,
197
- color: y
167
+ ]), h = (() => {
168
+ if (o)
169
+ return o === "inherit" ? "inherit" : m ? o : d.has(o) ? `var(--pittorica-${o}-9)` : o;
170
+ })(), s = i ? typeof i == "string" ? `pittorica-text--size-${i}` : j({
171
+ [`pittorica-text--size-${i.initial}`]: i.initial,
172
+ [`pittorica-text--xs-size-${i.xs}`]: i.xs,
173
+ [`pittorica-text--sm-size-${i.sm}`]: i.sm,
174
+ [`pittorica-text--md-size-${i.md}`]: i.md,
175
+ [`pittorica-text--lg-size-${i.lg}`]: i.lg,
176
+ [`pittorica-text--xl-size-${i.xl}`]: i.xl
177
+ }) : null, v = {
178
+ ...p,
179
+ textAlign: n,
180
+ color: h
198
181
  };
199
- return /* @__PURE__ */ u(
182
+ return /* @__PURE__ */ x(
200
183
  E,
201
184
  {
202
- as: i,
203
- className: P(
185
+ as: f,
186
+ className: j(
204
187
  "pittorica-text",
205
- { "pittorica-text--truncate": a },
206
- l
188
+ s,
189
+ { "pittorica-text--truncate": l },
190
+ g
207
191
  ),
208
192
  "data-weight": r,
209
- style: x,
210
- href: m,
211
- target: f,
212
- rel: h,
213
- htmlFor: p,
214
- name: c,
215
- ...g,
193
+ style: v,
194
+ ...c,
216
195
  children: t
217
196
  }
218
197
  );
219
- }, H = G(null), X = () => {
220
- const t = M(H);
198
+ };
199
+ H.displayName = "Text";
200
+ const F = D(null), P = () => {
201
+ const t = K(F);
221
202
  if (!t)
222
203
  throw new Error("TextArea components must be wrapped in <TextArea.Root />");
223
204
  return t;
224
- }, Y = ({
205
+ }, Q = ({
225
206
  children: t,
226
- label: i,
227
- helperText: r,
228
- error: e,
229
- color: a = "indigo",
230
- disabled: s,
231
- name: l,
232
- size: d = "sm",
233
- className: m,
234
- style: f,
235
- ...h
207
+ label: a,
208
+ helperText: i,
209
+ error: r,
210
+ color: n = "indigo",
211
+ disabled: l,
212
+ name: o,
213
+ size: g = "sm",
214
+ className: p,
215
+ style: c,
216
+ as: f,
217
+ ...m
236
218
  }) => {
237
- const p = C(), c = C(), o = a !== "inherit" && !(a != null && a.startsWith("#")) && !(a != null && a.startsWith("rgb")) ? `var(--pittorica-${a}-9)` : a;
238
- return /* @__PURE__ */ u(H, { value: { inputId: p, helperId: c, disabled: s, size: d, name: l }, children: /* @__PURE__ */ D(
239
- W,
219
+ const d = R(), h = R(), v = n !== "inherit" && !(n != null && n.startsWith("#")) && !(n != null && n.startsWith("rgb")) ? `var(--pittorica-${n}-9)` : n;
220
+ return /* @__PURE__ */ x(F, { value: { inputId: d, helperId: h, disabled: l, size: g, name: o }, children: /* @__PURE__ */ q(
221
+ I,
240
222
  {
241
- ...h,
242
- className: L(
223
+ as: f || "div",
224
+ className: z(
243
225
  "pittorica-textarea-root",
244
- `pittorica-textarea--${d}`,
245
- m
226
+ `pittorica-textarea--${g}`,
227
+ p
246
228
  ),
247
- "data-error": e,
229
+ "data-error": r,
230
+ ...m,
248
231
  children: [
249
- i && /* @__PURE__ */ u(
250
- U,
232
+ a && /* @__PURE__ */ x(
233
+ H,
251
234
  {
252
235
  as: "label",
253
- htmlFor: p,
236
+ htmlFor: d,
254
237
  weight: "medium",
255
238
  style: {
256
239
  paddingLeft: "4px",
@@ -258,73 +241,73 @@ const U = ({
258
241
  marginBottom: "4px",
259
242
  display: "inline-block"
260
243
  },
261
- children: i
244
+ children: a
262
245
  }
263
246
  ),
264
- /* @__PURE__ */ u(
247
+ /* @__PURE__ */ x(
265
248
  "div",
266
249
  {
267
250
  className: "pittorica-textarea-wrapper",
268
- "data-disabled": s,
251
+ "data-disabled": l,
269
252
  style: {
270
- "--pittorica-source-color": o,
271
- ...f
253
+ "--pittorica-source-color": v,
254
+ ...c
272
255
  },
273
256
  children: t
274
257
  }
275
258
  ),
276
- r && /* @__PURE__ */ u("div", { id: c, className: "pittorica-textarea-helper", children: r })
259
+ i && /* @__PURE__ */ x("div", { id: h, className: "pittorica-textarea-helper", children: i })
277
260
  ]
278
261
  }
279
262
  ) });
280
- }, Z = ({
263
+ }, U = ({
281
264
  className: t,
282
- autoResize: i = !1,
283
- onChange: r,
284
- value: e,
285
- defaultValue: a,
286
- name: s,
287
- ...l
265
+ autoResize: a = !1,
266
+ onChange: i,
267
+ value: r,
268
+ defaultValue: n,
269
+ name: l,
270
+ ...o
288
271
  }) => {
289
272
  const {
290
- inputId: d,
291
- helperId: m,
292
- disabled: f,
293
- name: h
294
- } = X(), p = J(null), c = () => {
273
+ inputId: g,
274
+ helperId: p,
275
+ disabled: c,
276
+ name: f
277
+ } = P(), m = G(null), d = () => {
295
278
  if (globalThis.window === void 0) return;
296
- const o = p.current;
297
- !o || !i || (o.style.height = "auto", o.style.height = `${o.scrollHeight}px`);
279
+ const s = m.current;
280
+ !s || !a || (s.style.height = "auto", s.style.height = `${s.scrollHeight}px`);
298
281
  };
299
- return K(() => {
300
- i && c();
301
- }, [e, a, i]), /* @__PURE__ */ u(
282
+ return J(() => {
283
+ a && d();
284
+ }, [r, n, a]), /* @__PURE__ */ x(
302
285
  "textarea",
303
286
  {
304
- name: s ?? h,
305
- ...l,
306
- id: d,
307
- ref: p,
308
- value: e,
309
- defaultValue: a,
310
- disabled: f,
311
- "aria-describedby": m,
312
- onChange: (o) => {
313
- i && c(), r == null || r(o);
287
+ name: l ?? f,
288
+ ...o,
289
+ id: g,
290
+ ref: m,
291
+ value: r,
292
+ defaultValue: n,
293
+ disabled: c,
294
+ "aria-describedby": p,
295
+ onChange: (s) => {
296
+ a && d(), i == null || i(s);
314
297
  },
315
- className: L("pittorica-textarea-input", t),
298
+ className: z("pittorica-textarea-input", t),
316
299
  style: {
317
- overflow: i ? "hidden" : void 0,
318
- ...l.style
300
+ overflow: a ? "hidden" : void 0,
301
+ ...o.style
319
302
  }
320
303
  }
321
304
  );
322
- }, z = {
323
- Root: Y,
324
- Content: Z
305
+ }, Z = {
306
+ Root: Q,
307
+ Content: U
325
308
  };
326
309
  export {
327
- z as TextArea,
328
- Z as TextAreaContent,
329
- Y as TextAreaRoot
310
+ Z as TextArea,
311
+ U as TextAreaContent,
312
+ Q as TextAreaRoot
330
313
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pittorica/text-area-react",
3
- "version": "0.23.2",
3
+ "version": "0.25.0",
4
4
  "type": "module",
5
5
  "main": "./dist/index.js",
6
6
  "module": "./dist/index.js",
@@ -10,8 +10,8 @@
10
10
  ],
11
11
  "dependencies": {
12
12
  "clsx": "^2.1.1",
13
- "@pittorica/box-react": "0.23.2",
14
- "@pittorica/text-react": "0.23.2"
13
+ "@pittorica/text-react": "0.25.0",
14
+ "@pittorica/box-react": "0.25.0"
15
15
  },
16
16
  "devDependencies": {
17
17
  "@testing-library/jest-dom": "^6.9.1",
@@ -23,9 +23,9 @@
23
23
  "typescript": "^5.0.0",
24
24
  "vite": "^5.0.0",
25
25
  "vitest": "^2.1.9",
26
- "@pittorica/flex-react": "0.23.2",
27
- "@pittorica/theme-react": "0.23.2",
28
- "pittorica": "0.23.2"
26
+ "@pittorica/theme-react": "0.25.0",
27
+ "@pittorica/flex-react": "0.25.0",
28
+ "pittorica": "0.25.0"
29
29
  },
30
30
  "peerDependencies": {
31
31
  "react": ">=19",
@@ -36,7 +36,6 @@
36
36
  "build:js": "vite build",
37
37
  "build:types": "tsc -p tsconfig.json",
38
38
  "clean": "rm -rf dist",
39
- "dev": "vite",
40
39
  "test": "vitest run",
41
40
  "test:watch": "vitest"
42
41
  }