softable-pixels-web 1.1.8 → 1.1.10

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 (98) hide show
  1. package/dist/{Button-BrV5pWD2.js → Button-DCVmSier.js} +9 -9
  2. package/dist/Button-DCVmSier.js.map +1 -0
  3. package/dist/{CheckItem-DEUwzhbF.js → CheckItem-itm2oIeW.js} +4 -4
  4. package/dist/{CheckItem-DEUwzhbF.js.map → CheckItem-itm2oIeW.js.map} +1 -1
  5. package/dist/{Checkbox-CA11dJ4h.js → Checkbox-ly07FlTH.js} +5 -5
  6. package/dist/Checkbox-ly07FlTH.js.map +1 -0
  7. package/dist/ContextMenu-fSz83oSd.js +304 -0
  8. package/dist/ContextMenu-fSz83oSd.js.map +1 -0
  9. package/dist/{Icon-D40nGMJM.js → Icon-61UaAUrM.js} +2 -2
  10. package/dist/{Icon-D40nGMJM.js.map → Icon-61UaAUrM.js.map} +1 -1
  11. package/dist/{IconButton-BBdkzg3b.js → IconButton-CsHFWO8K.js} +2 -2
  12. package/dist/IconButton-CsHFWO8K.js.map +1 -0
  13. package/dist/{InfoSummary-Cft-E1GO.js → InfoSummary-DcupqKIy.js} +3 -3
  14. package/dist/{InfoSummary-Cft-E1GO.js.map → InfoSummary-DcupqKIy.js.map} +1 -1
  15. package/dist/Input-BFQKSMEQ.js +174 -0
  16. package/dist/Input-BFQKSMEQ.js.map +1 -0
  17. package/dist/Label-BhqH21lT.js +25 -0
  18. package/dist/Label-BhqH21lT.js.map +1 -0
  19. package/dist/Popover-BsDGCJ-f.js +81 -0
  20. package/dist/Popover-BsDGCJ-f.js.map +1 -0
  21. package/dist/Switch-B4e9qBOu.js +49 -0
  22. package/dist/Switch-B4e9qBOu.js.map +1 -0
  23. package/dist/{TabSwitch-D6WJc7Bf.js → TabSwitch-CvnlK0NZ.js} +4 -4
  24. package/dist/TabSwitch-CvnlK0NZ.js.map +1 -0
  25. package/dist/{TextArea-DY9c18r6.js → TextArea-CUrG_9je.js} +5 -5
  26. package/dist/TextArea-CUrG_9je.js.map +1 -0
  27. package/dist/{ThemeContext-0pOYSNvl.js → ThemeContext-CesN6Ejm.js} +22 -8
  28. package/dist/ThemeContext-CesN6Ejm.js.map +1 -0
  29. package/dist/{Typography-XA7uwbWe.js → Typography-j84zoCoZ.js} +2 -2
  30. package/dist/{Typography-XA7uwbWe.js.map → Typography-j84zoCoZ.js.map} +1 -1
  31. package/dist/button.d.ts +2 -2
  32. package/dist/button.js +3 -3
  33. package/dist/check-item.d.ts +1 -1
  34. package/dist/check-item.js +4 -4
  35. package/dist/checkbox.d.ts +2 -2
  36. package/dist/checkbox.js +4 -4
  37. package/dist/context-menu.d.ts +2 -0
  38. package/dist/context-menu.js +9 -0
  39. package/dist/icon-button.d.ts +1 -1
  40. package/dist/icon-button.js +2 -2
  41. package/dist/{index-DZqSyBAN.d.ts → index-2WYvBk8I.d.ts} +18 -4
  42. package/dist/{index-RcFYZiMi.d.ts → index-8GUY3yRY.d.ts} +1 -1
  43. package/dist/index-BANOx3xI.d.ts +44 -0
  44. package/dist/{index-CyvtOmP2.d.ts → index-BHhl7wD8.d.ts} +4 -3
  45. package/dist/index-BglHC9EI.d.ts +61 -0
  46. package/dist/{index-Cg3ejKX9.d.ts → index-CCiP7SPG.d.ts} +8 -4
  47. package/dist/{index-DQMtfFqC.d.ts → index-Cmj1xJBu.d.ts} +2 -2
  48. package/dist/{index-vtqd-Akd.d.ts → index-CyntoY7A.d.ts} +33 -4
  49. package/dist/index-DM5Wxo_Y.d.ts +104 -0
  50. package/dist/index-DewFmT68.d.ts +15 -0
  51. package/dist/{index-B9MqmTLB.d.ts → index-YYjoEwNX.d.ts} +39 -5
  52. package/dist/index.d.ts +16 -10
  53. package/dist/index.js +20 -14
  54. package/dist/info-summary.js +3 -3
  55. package/dist/input.d.ts +1 -2
  56. package/dist/input.js +5 -5
  57. package/dist/popover.d.ts +2 -0
  58. package/dist/popover.js +6 -0
  59. package/dist/{styleProps-D405c8KF.d.ts → styleProps-5iqKZpC1.d.ts} +1 -1
  60. package/dist/switch.d.ts +2 -0
  61. package/dist/switch.js +4 -0
  62. package/dist/tab-switch.d.ts +1 -1
  63. package/dist/tab-switch.js +3 -3
  64. package/dist/text-area.d.ts +2 -2
  65. package/dist/text-area.js +5 -5
  66. package/dist/theme-context.d.ts +1 -1
  67. package/dist/theme-context.js +1 -1
  68. package/dist/types-Dsf33Reg.d.ts +15 -0
  69. package/dist/{types-ESf1Pmhi.d.ts → types-ubME1KhJ.d.ts} +3 -3
  70. package/dist/typography.d.ts +3 -3
  71. package/dist/typography.js +2 -2
  72. package/dist/use-dismiss.d.ts +20 -0
  73. package/dist/use-dismiss.js +3 -0
  74. package/dist/use-floating.d.ts +15 -0
  75. package/dist/use-floating.js +3 -0
  76. package/dist/use-virtual-anchor.d.ts +12 -0
  77. package/dist/use-virtual-anchor.js +40 -0
  78. package/dist/use-virtual-anchor.js.map +1 -0
  79. package/dist/useDismiss-DJ1mh-X3.js +35 -0
  80. package/dist/useDismiss-DJ1mh-X3.js.map +1 -0
  81. package/dist/useFloating--PcINgSt.js +295 -0
  82. package/dist/useFloating--PcINgSt.js.map +1 -0
  83. package/dist/{useThemedStyles-B7irjShy.d.ts → useThemedStyles-C6dNoaRC.d.ts} +25 -6
  84. package/dist/{useThemedStyles-3rUXJYgS.js → useThemedStyles-MLtE91hE.js} +1 -1
  85. package/dist/useThemedStyles-MLtE91hE.js.map +1 -0
  86. package/package.json +46 -1
  87. package/dist/Button-BrV5pWD2.js.map +0 -1
  88. package/dist/Checkbox-CA11dJ4h.js.map +0 -1
  89. package/dist/IconButton-BBdkzg3b.js.map +0 -1
  90. package/dist/Input-BcDV2JOa.js +0 -327
  91. package/dist/Input-BcDV2JOa.js.map +0 -1
  92. package/dist/Label-DXpBz2AN.js +0 -79
  93. package/dist/Label-DXpBz2AN.js.map +0 -1
  94. package/dist/TabSwitch-D6WJc7Bf.js.map +0 -1
  95. package/dist/TextArea-DY9c18r6.js.map +0 -1
  96. package/dist/ThemeContext-0pOYSNvl.js.map +0 -1
  97. package/dist/index-De1q2lSW.d.ts +0 -49
  98. package/dist/useThemedStyles-3rUXJYgS.js.map +0 -1
@@ -1,327 +0,0 @@
1
- import { t as Icon } from "./Icon-D40nGMJM.js";
2
- import { n as styled, t as useThemedStyles } from "./useThemedStyles-3rUXJYgS.js";
3
- import { t as Label } from "./Label-DXpBz2AN.js";
4
- import { useCallback, useId, useMemo, useRef, useState } from "react";
5
- import { Fragment, jsx, jsxs } from "react/jsx-runtime";
6
-
7
- //#region src/components/commons/inputs/Input/hooks/useInput/index.ts
8
- const useInput = ({ value: controlledValue, defaultValue = "", onChange }) => {
9
- const inputRef = useRef(null);
10
- const [internalValue, setInternalValue] = useState(defaultValue);
11
- const [showPassword, setShowPassword] = useState(false);
12
- const isControlled = controlledValue !== void 0;
13
- const currentValue = isControlled ? controlledValue : internalValue;
14
- const handleChange = useCallback((e) => {
15
- const value = e.target.value;
16
- if (!isControlled) setInternalValue(value);
17
- onChange?.(value);
18
- }, [isControlled, onChange]);
19
- const togglePasswordVisibility = useCallback(() => {
20
- setShowPassword((prev) => !prev);
21
- }, []);
22
- return {
23
- inputRef,
24
- focusInput: useCallback(() => {
25
- inputRef.current?.focus();
26
- }, []),
27
- isControlled,
28
- currentValue,
29
- showPassword,
30
- handleChange,
31
- togglePasswordVisibility
32
- };
33
- };
34
-
35
- //#endregion
36
- //#region src/components/commons/inputs/Input/styles.ts
37
- const INPUT_STYLES = {
38
- width: {
39
- auto: { width: "auto" },
40
- full: { width: "100%" },
41
- md: { width: "12rem" },
42
- lg: { width: "16rem" },
43
- xl: { width: "20rem" },
44
- "2xl": { width: "24rem" }
45
- },
46
- radius: {
47
- none: { borderRadius: "0px" },
48
- sm: { borderRadius: "0.125rem" },
49
- md: { borderRadius: "0.375rem" },
50
- lg: { borderRadius: "0.5rem" },
51
- full: { borderRadius: "9999px" }
52
- },
53
- size: {
54
- sm: {
55
- wrapper: { minHeight: "2rem" },
56
- input: {
57
- padding: "0.5rem 0.75rem",
58
- lineHeight: "1rem",
59
- fontSize: "0.75rem"
60
- },
61
- label: {
62
- fontSize: "0.75rem",
63
- lineHeight: "1rem",
64
- marginBottom: "0.25rem"
65
- },
66
- description: {
67
- fontSize: "0.75rem",
68
- lineHeight: "1rem",
69
- marginTop: "0.25rem"
70
- },
71
- error: {
72
- fontSize: "0.75rem",
73
- lineHeight: "1rem",
74
- marginTop: "0.25rem"
75
- }
76
- },
77
- md: {
78
- wrapper: { minHeight: "2.5rem" },
79
- input: {
80
- padding: "0.5rem 0.75rem",
81
- lineHeight: "1.25rem",
82
- fontSize: "0.875rem"
83
- },
84
- label: {
85
- fontSize: "0.875rem",
86
- lineHeight: "1.25rem",
87
- marginBottom: "0.375rem"
88
- },
89
- description: {
90
- fontSize: "0.75rem",
91
- lineHeight: "1rem",
92
- marginTop: "0.375rem"
93
- },
94
- error: {
95
- fontSize: "0.75rem",
96
- lineHeight: "1rem",
97
- marginTop: "0.375rem"
98
- }
99
- },
100
- lg: {
101
- wrapper: { minHeight: "3rem" },
102
- input: {
103
- padding: "0.75rem 1rem",
104
- lineHeight: "1.5rem",
105
- fontSize: "1rem",
106
- width: "16rem"
107
- },
108
- label: {
109
- fontSize: "0.875rem",
110
- lineHeight: "1.25rem",
111
- marginBottom: "0.5rem"
112
- },
113
- description: {
114
- fontSize: "0.875rem",
115
- lineHeight: "1.25rem",
116
- marginTop: "0.5rem"
117
- },
118
- error: {
119
- fontSize: "0.875rem",
120
- lineHeight: "1.25rem",
121
- marginTop: "0.5rem"
122
- }
123
- }
124
- },
125
- variant: { bordered: {
126
- wrapper: { border: "1px solid var(--px-border-primary)" },
127
- input: {
128
- backgroundColor: "transparent",
129
- color: "var(--px-text-primary)",
130
- "::placeholder": { color: "var(--px-text-secondary)" }
131
- },
132
- label: { color: "var(--px-text-primary)" },
133
- button: {
134
- color: "var(--px-text-secondary)",
135
- ":hover": { color: "var(--px-text-primary)" }
136
- }
137
- } },
138
- state: {
139
- default: {
140
- input: {},
141
- ring: { boxShadow: "0 0 0 2px var(--px-color-info)" }
142
- },
143
- invalid: {
144
- wrapper: {
145
- borderColor: "var(--px-color-invalid)",
146
- __rules: { "&:focus-within": { boxShadow: "0 0 0 1px var(--px-background), 0 0 0 3px var(--px-color-invalid)" } }
147
- },
148
- input: { color: "var(--px-color-invalid)" },
149
- error: { color: "var(--px-color-invalid)" }
150
- },
151
- disabled: {
152
- wrapper: {
153
- opacity: .6,
154
- cursor: "not-allowed",
155
- backgroundColor: "#f9fafb"
156
- },
157
- input: { cursor: "not-allowed" },
158
- label: { cursor: "not-allowed" }
159
- }
160
- }
161
- };
162
- function createInputStyles(props) {
163
- const { size = "md", variant = "bordered", radius = "md", isDisabled = false, isInvalid = false, focusedRingColor } = props;
164
- const focusRingColor = focusedRingColor || "var(--px-color-info)";
165
- return styled({
166
- wrapper: {
167
- position: "relative",
168
- display: "flex",
169
- alignItems: "center",
170
- ...INPUT_STYLES.size[size]?.wrapper ?? {},
171
- ...INPUT_STYLES.variant[variant]?.wrapper ?? {},
172
- ...INPUT_STYLES.radius[radius] ?? {},
173
- __rules: { "&:focus-within": { boxShadow: `0 0 0 1px var(--px-background), 0 0 0 3px ${focusRingColor}` } },
174
- ...isDisabled ? INPUT_STYLES.state.disabled.wrapper : {},
175
- ...isInvalid ? INPUT_STYLES.state.invalid.wrapper : {}
176
- },
177
- input: {
178
- flex: 1,
179
- backgroundColor: "transparent",
180
- outline: "none",
181
- width: "100%",
182
- ...INPUT_STYLES.size[size]?.input ?? {},
183
- ...INPUT_STYLES.variant[variant]?.input ?? {},
184
- ...INPUT_STYLES.state.default.input ?? {},
185
- ...isDisabled ? INPUT_STYLES.state.disabled.input : {},
186
- ...isInvalid ? INPUT_STYLES.state.invalid.input : {}
187
- },
188
- label: {
189
- ...INPUT_STYLES.size[size]?.label ?? {},
190
- ...INPUT_STYLES.variant[variant]?.label ?? {},
191
- ...isDisabled ? INPUT_STYLES.state.disabled.label : {}
192
- },
193
- error: {
194
- display: "block",
195
- ...INPUT_STYLES.size[size]?.error ?? {},
196
- ...INPUT_STYLES.state.invalid.error ?? {}
197
- },
198
- button: {
199
- display: "flex",
200
- alignItems: "center",
201
- justifyContent: "center",
202
- padding: "0.25rem",
203
- cursor: "pointer",
204
- ...INPUT_STYLES.variant[variant]?.button ?? {},
205
- ...INPUT_STYLES.radius[radius] ?? {},
206
- ...isDisabled ? {
207
- cursor: "not-allowed",
208
- opacity: .5
209
- } : {}
210
- },
211
- startContent: {
212
- display: "flex",
213
- alignItems: "center",
214
- padding: "0.25rem"
215
- }
216
- });
217
- }
218
-
219
- //#endregion
220
- //#region src/components/commons/inputs/Input/index.tsx
221
- const Input = (props) => {
222
- const { id, type, label, width, fullWidth, required, isDisabled, minLength, maxLength, placeholder, requiredColor, labelColor, labelWeight, labelVariant, startContent, endContent, errorMessage, onChange, value, defaultValue, size, radius, variant, isInvalid, ...nativeInputProps } = props;
223
- const { inputRef, currentValue, showPassword, handleChange, togglePasswordVisibility } = useInput({
224
- size,
225
- value,
226
- radius,
227
- variant,
228
- isInvalid,
229
- fullWidth,
230
- isDisabled,
231
- defaultValue,
232
- onChange
233
- });
234
- const reactId = useId();
235
- const inputId = useMemo(() => {
236
- return id || `input-${reactId}`;
237
- }, [id, reactId]);
238
- const containerWidth = getWidth();
239
- const { styles, classes } = useThemedStyles(props, createInputStyles, {
240
- pick: (p) => [
241
- p.size,
242
- p.variant,
243
- p.radius,
244
- p.isDisabled,
245
- p.isInvalid,
246
- p.focusedRingColor
247
- ],
248
- override: props.styles,
249
- applyCommonProps: true,
250
- commonSlot: "input"
251
- });
252
- function getType() {
253
- if (type === "password" && showPassword) return "text";
254
- return type;
255
- }
256
- function getWidth() {
257
- if (fullWidth) return { width: "100%" };
258
- if (width) return INPUT_STYLES.width[width] || { width: "auto" };
259
- return { width: "auto" };
260
- }
261
- function renderLabel() {
262
- if (!label) return null;
263
- return /* @__PURE__ */ jsx("div", {
264
- className: "flex items-center gap-3",
265
- children: /* @__PURE__ */ jsx(Label, {
266
- htmlFor: inputId,
267
- label,
268
- required,
269
- styles: { label: styles.label },
270
- requiredColor,
271
- labelColor,
272
- labelWeight,
273
- labelVariant
274
- })
275
- });
276
- }
277
- function renderEndContent() {
278
- return /* @__PURE__ */ jsx(Fragment, { children: type === "password" ? /* @__PURE__ */ jsx("button", {
279
- type: "button",
280
- style: styles.button,
281
- onClick: togglePasswordVisibility,
282
- children: showPassword ? /* @__PURE__ */ jsx(Icon, { name: "general-eye-off" }) : /* @__PURE__ */ jsx(Icon, { name: "general-eye" })
283
- }) : endContent });
284
- }
285
- return /* @__PURE__ */ jsxs("div", {
286
- style: containerWidth,
287
- children: [
288
- renderLabel(),
289
- /* @__PURE__ */ jsxs("div", {
290
- style: styles.wrapper,
291
- className: classes.wrapper,
292
- children: [
293
- startContent && /* @__PURE__ */ jsx("div", {
294
- style: styles.startContent,
295
- children: startContent
296
- }),
297
- /* @__PURE__ */ jsx("div", {
298
- style: { flex: 1 },
299
- children: /* @__PURE__ */ jsx("input", {
300
- ref: inputRef,
301
- id: inputId,
302
- type: getType(),
303
- value: currentValue,
304
- style: styles.input,
305
- className: classes.input,
306
- disabled: isDisabled,
307
- minLength,
308
- maxLength,
309
- placeholder: placeholder ?? "Digite aqui...",
310
- onChange: handleChange,
311
- ...nativeInputProps
312
- })
313
- }),
314
- renderEndContent() && /* @__PURE__ */ jsx("div", { children: renderEndContent() })
315
- ]
316
- }),
317
- errorMessage ? /* @__PURE__ */ jsx("div", {
318
- style: styles.error,
319
- children: errorMessage
320
- }) : null
321
- ]
322
- });
323
- };
324
-
325
- //#endregion
326
- export { Input as t };
327
- //# sourceMappingURL=Input-BcDV2JOa.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Input-BcDV2JOa.js","names":["Input: React.FC<InputProps>"],"sources":["../src/components/commons/inputs/Input/hooks/useInput/index.ts","../src/components/commons/inputs/Input/styles.ts","../src/components/commons/inputs/Input/index.tsx"],"sourcesContent":["// External Libraries\nimport { useState, useRef, useCallback } from 'react'\n\n// Types\nimport type { InputProps } from '../../types'\n\nexport const useInput = ({\n value: controlledValue,\n defaultValue = '',\n onChange,\n}: Partial<InputProps>) => {\n // Refs\n const inputRef = useRef<HTMLInputElement>(null)\n\n // States\n const [internalValue, setInternalValue] = useState(defaultValue)\n const [showPassword, setShowPassword] = useState(false)\n\n // Constants\n const isControlled = controlledValue !== undefined\n const currentValue = isControlled ? controlledValue : internalValue\n\n // Functions\n const handleChange = useCallback(\n (e: React.ChangeEvent<HTMLInputElement>) => {\n const value = e.target.value\n\n if (!isControlled) setInternalValue(value)\n onChange?.(value)\n },\n [isControlled, onChange],\n )\n\n const togglePasswordVisibility = useCallback(() => {\n setShowPassword(prev => !prev)\n }, [])\n\n const focusInput = useCallback(() => {\n inputRef.current?.focus()\n }, [])\n\n return {\n inputRef,\n focusInput,\n isControlled,\n currentValue,\n showPassword,\n handleChange,\n togglePasswordVisibility,\n }\n}\n","// External libraries\nimport type { CSSProperties } from 'react'\n\n// Types\nimport { styled, type StyleMap } from '@hooks/useThemedStyles/types'\nimport type { InputProps } from './types'\n\nexport const INPUT_STYLES = {\n width: {\n auto: { width: 'auto' },\n full: { width: '100%' },\n md: { width: '12rem' },\n lg: { width: '16rem' },\n xl: { width: '20rem' },\n '2xl': { width: '24rem' }\n } as Record<string, CSSProperties>,\n radius: {\n none: { borderRadius: '0px' },\n sm: { borderRadius: '0.125rem' },\n md: { borderRadius: '0.375rem' },\n lg: { borderRadius: '0.5rem' },\n full: { borderRadius: '9999px' }\n } as Record<string, CSSProperties>,\n size: {\n sm: {\n wrapper: { minHeight: '2rem' },\n input: {\n padding: '0.5rem 0.75rem',\n lineHeight: '1rem',\n fontSize: '0.75rem'\n },\n label: {\n fontSize: '0.75rem',\n lineHeight: '1rem',\n marginBottom: '0.25rem'\n },\n description: {\n fontSize: '0.75rem',\n lineHeight: '1rem',\n marginTop: '0.25rem'\n },\n error: {\n fontSize: '0.75rem',\n lineHeight: '1rem',\n marginTop: '0.25rem'\n }\n } as Record<string, CSSProperties>,\n md: {\n wrapper: { minHeight: '2.5rem' },\n input: {\n padding: '0.5rem 0.75rem',\n lineHeight: '1.25rem',\n fontSize: '0.875rem'\n },\n label: {\n fontSize: '0.875rem',\n lineHeight: '1.25rem',\n marginBottom: '0.375rem'\n },\n description: {\n fontSize: '0.75rem',\n lineHeight: '1rem',\n marginTop: '0.375rem'\n },\n error: {\n fontSize: '0.75rem',\n lineHeight: '1rem',\n marginTop: '0.375rem'\n }\n } as Record<string, CSSProperties>,\n lg: {\n wrapper: { minHeight: '3rem' },\n input: {\n padding: '0.75rem 1rem',\n lineHeight: '1.5rem',\n fontSize: '1rem',\n width: '16rem'\n },\n label: {\n fontSize: '0.875rem',\n lineHeight: '1.25rem',\n marginBottom: '0.5rem'\n },\n description: {\n fontSize: '0.875rem',\n lineHeight: '1.25rem',\n marginTop: '0.5rem'\n },\n error: {\n fontSize: '0.875rem',\n lineHeight: '1.25rem',\n marginTop: '0.5rem'\n }\n } as Record<string, CSSProperties>\n },\n variant: {\n bordered: {\n wrapper: { border: '1px solid var(--px-border-primary)' },\n input: {\n backgroundColor: 'transparent',\n color: 'var(--px-text-primary)',\n '::placeholder': {\n color: 'var(--px-text-secondary)'\n }\n },\n label: { color: 'var(--px-text-primary)' },\n button: {\n color: 'var(--px-text-secondary)',\n ':hover': { color: 'var(--px-text-primary)' }\n }\n } as Record<string, CSSProperties>\n },\n state: {\n default: {\n input: {},\n ring: {\n boxShadow: '0 0 0 2px var(--px-color-info)'\n }\n },\n invalid: {\n wrapper: {\n borderColor: 'var(--px-color-invalid)',\n __rules: {\n '&:focus-within': {\n boxShadow:\n '0 0 0 1px var(--px-background), 0 0 0 3px var(--px-color-invalid)'\n }\n }\n },\n input: {\n color: 'var(--px-color-invalid)'\n },\n error: {\n color: 'var(--px-color-invalid)'\n }\n },\n\n disabled: {\n wrapper: {\n opacity: 0.6,\n cursor: 'not-allowed',\n backgroundColor: '#f9fafb'\n },\n input: {\n cursor: 'not-allowed'\n },\n label: {\n cursor: 'not-allowed'\n }\n }\n } as Record<string, Partial<StyleMap>>\n}\n\nexport function createInputStyles(props: InputProps): StyleMap {\n const {\n size = 'md',\n variant = 'bordered',\n radius = 'md',\n isDisabled = false,\n isInvalid = false,\n focusedRingColor\n } = props\n\n const focusRingColor = focusedRingColor || 'var(--px-color-info)'\n\n return styled({\n wrapper: {\n position: 'relative',\n display: 'flex',\n alignItems: 'center',\n\n ...(INPUT_STYLES.size[size]?.wrapper ?? {}),\n ...(INPUT_STYLES.variant[variant]?.wrapper ?? {}),\n ...(INPUT_STYLES.radius[radius] ?? {}),\n\n __rules: {\n '&:focus-within': {\n boxShadow: `0 0 0 1px var(--px-background), 0 0 0 3px ${focusRingColor}`\n }\n },\n\n ...(isDisabled ? INPUT_STYLES.state.disabled.wrapper : {}),\n ...(isInvalid ? INPUT_STYLES.state.invalid.wrapper : {})\n },\n\n input: {\n flex: 1,\n backgroundColor: 'transparent',\n outline: 'none',\n width: '100%',\n\n ...(INPUT_STYLES.size[size]?.input ?? {}),\n\n ...(INPUT_STYLES.variant[variant]?.input ?? {}),\n ...(INPUT_STYLES.state.default.input ?? {}),\n\n ...(isDisabled ? INPUT_STYLES.state.disabled.input : {}),\n ...(isInvalid ? INPUT_STYLES.state.invalid.input : {})\n },\n\n label: {\n ...(INPUT_STYLES.size[size]?.label ?? {}),\n ...(INPUT_STYLES.variant[variant]?.label ?? {}),\n\n ...(isDisabled ? INPUT_STYLES.state.disabled.label : {})\n },\n\n error: {\n display: 'block',\n\n ...(INPUT_STYLES.size[size]?.error ?? {}),\n ...(INPUT_STYLES.state.invalid.error ?? {})\n },\n\n button: {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n padding: '0.25rem',\n cursor: 'pointer',\n\n ...(INPUT_STYLES.variant[variant]?.button ?? {}),\n ...(INPUT_STYLES.radius[radius] ?? {}),\n\n ...(isDisabled ? { cursor: 'not-allowed', opacity: 0.5 } : {})\n },\n\n startContent: {\n display: 'flex',\n alignItems: 'center',\n padding: '0.25rem'\n }\n })\n}\n","// External Libraries\nimport type React from 'react'\nimport { useId, useMemo } from 'react'\n\n// Components\nimport { Label } from '../../Label'\nimport { Icon } from '@components/commons/toolkit/Icon'\n\n// Types\nimport type { InputProps } from './types'\n\n// Hooks\nimport { useInput } from './hooks/useInput'\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Styles\nimport { createInputStyles, INPUT_STYLES } from './styles'\n\nexport const Input: React.FC<InputProps> = props => {\n // Hooks\n const {\n id,\n type,\n label,\n width,\n fullWidth,\n required,\n isDisabled,\n minLength,\n maxLength,\n placeholder,\n requiredColor,\n labelColor,\n labelWeight,\n labelVariant,\n startContent,\n endContent,\n errorMessage,\n onChange,\n value,\n defaultValue,\n size,\n radius,\n variant,\n isInvalid,\n ...nativeInputProps\n } = props\n\n const {\n inputRef,\n currentValue,\n showPassword,\n handleChange,\n togglePasswordVisibility\n } = useInput({\n size,\n value,\n radius,\n variant,\n isInvalid,\n fullWidth,\n isDisabled,\n defaultValue,\n onChange\n })\n\n // Constants\n const reactId = useId()\n const inputId = useMemo(() => {\n return id || `input-${reactId}`\n }, [id, reactId])\n const containerWidth = getWidth()\n\n // Hooks\n const { styles, classes } = useThemedStyles(props, createInputStyles, {\n pick: p => [\n p.size,\n p.variant,\n p.radius,\n p.isDisabled,\n p.isInvalid,\n p.focusedRingColor\n ],\n override: props.styles,\n applyCommonProps: true,\n commonSlot: 'input'\n })\n\n // Functions\n function getType() {\n if (type === 'password' && showPassword) return 'text'\n return type\n }\n\n function getWidth() {\n if (fullWidth) return { width: '100%' }\n if (width) return INPUT_STYLES.width[width] || { width: 'auto' }\n return { width: 'auto' }\n }\n\n function renderLabel() {\n if (!label) return null\n\n return (\n <div className=\"flex items-center gap-3\">\n <Label\n htmlFor={inputId}\n label={label}\n required={required}\n styles={{ label: styles.label }}\n requiredColor={requiredColor}\n labelColor={labelColor}\n labelWeight={labelWeight}\n labelVariant={labelVariant}\n />\n </div>\n )\n }\n\n function renderEndContent() {\n return (\n <>\n {type === 'password' ? (\n <button\n type=\"button\"\n style={styles.button}\n onClick={togglePasswordVisibility}\n >\n {showPassword ? (\n <Icon name={'general-eye-off'} />\n ) : (\n <Icon name={'general-eye'} />\n )}\n </button>\n ) : (\n endContent\n )}\n </>\n )\n }\n\n return (\n <div style={containerWidth}>\n {renderLabel()}\n <div style={styles.wrapper} className={classes.wrapper}>\n {startContent && <div style={styles.startContent}>{startContent}</div>}\n <div style={{ flex: 1 }}>\n <input\n ref={inputRef}\n id={inputId}\n type={getType()}\n value={currentValue}\n style={styles.input}\n className={classes.input}\n disabled={isDisabled}\n minLength={minLength}\n maxLength={maxLength}\n placeholder={placeholder ?? 'Digite aqui...'}\n onChange={handleChange}\n {...nativeInputProps}\n />\n </div>\n {renderEndContent() && <div>{renderEndContent()}</div>}\n </div>\n\n {errorMessage ? <div style={styles.error}>{errorMessage}</div> : null}\n </div>\n )\n}\n"],"mappings":"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"}
@@ -1,79 +0,0 @@
1
- import { n as styled, t as useThemedStyles } from "./useThemedStyles-3rUXJYgS.js";
2
- import { t as Typography } from "./Typography-XA7uwbWe.js";
3
- import { jsx, jsxs } from "react/jsx-runtime";
4
-
5
- //#region src/components/commons/Label/style.ts
6
- const LABEL_VARIANTS = {
7
- b1: {
8
- fontSize: "1rem",
9
- lineHeight: "1.5rem"
10
- },
11
- b2: {
12
- fontSize: "0.875rem",
13
- lineHeight: "1.25rem"
14
- },
15
- b3: {
16
- fontSize: "0.75rem",
17
- lineHeight: "1rem"
18
- }
19
- };
20
- function createLabelStyles(props) {
21
- const { labelColor, labelWeight, labelVariant = "b2", requiredColor } = props;
22
- return styled({
23
- label: {
24
- display: "inline-flex",
25
- alignItems: "center",
26
- gap: "0.25rem",
27
- fontWeight: labelWeight,
28
- ...LABEL_VARIANTS[labelVariant] ?? {},
29
- ...labelColor ? { color: labelColor } : {}
30
- },
31
- required: {
32
- color: requiredColor,
33
- lineHeight: "inherit",
34
- fontSize: "inherit",
35
- fontWeight: "inherit"
36
- }
37
- });
38
- }
39
-
40
- //#endregion
41
- //#region src/components/commons/Label/index.tsx
42
- const Label = (props) => {
43
- const { htmlFor, label, required, requiredColor, labelColor, labelWeight, labelVariant = "b2" } = props;
44
- const { styles } = useThemedStyles(props, createLabelStyles, {
45
- pick: (p) => [
46
- p.labelColor,
47
- p.labelWeight,
48
- p.labelVariant,
49
- p.requiredColor
50
- ],
51
- override: props.styles,
52
- applyCommonProps: true
53
- });
54
- return /* @__PURE__ */ jsx("label", {
55
- htmlFor,
56
- style: styles.label,
57
- children: /* @__PURE__ */ jsxs(Typography, {
58
- variant: labelVariant,
59
- styles: { text: {
60
- minWidth: "fit-content",
61
- color: labelColor,
62
- fontWeight: labelWeight
63
- } },
64
- children: [label, required ? /* @__PURE__ */ jsx(Typography, {
65
- as: "span",
66
- variant: "b2",
67
- styles: { text: {
68
- color: requiredColor,
69
- marginLeft: "0.125rem"
70
- } },
71
- children: "*"
72
- }) : null]
73
- })
74
- });
75
- };
76
-
77
- //#endregion
78
- export { Label as t };
79
- //# sourceMappingURL=Label-DXpBz2AN.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Label-DXpBz2AN.js","names":["LABEL_VARIANTS: Record<string, CSSProperties>"],"sources":["../src/components/commons/Label/style.ts","../src/components/commons/Label/index.tsx"],"sourcesContent":["// External libraries\nimport type { CSSProperties } from 'react'\n\n// Types\nimport type { LabelProps } from './types'\nimport { styled, type StyleMap } from '@hooks/useThemedStyles/types'\n\nconst LABEL_VARIANTS: Record<string, CSSProperties> = {\n b1: {\n fontSize: '1rem',\n lineHeight: '1.5rem'\n },\n b2: {\n fontSize: '0.875rem',\n lineHeight: '1.25rem'\n },\n b3: {\n fontSize: '0.75rem',\n lineHeight: '1rem'\n }\n}\n\nexport function createLabelStyles(props: LabelProps): StyleMap {\n const { labelColor, labelWeight, labelVariant = 'b2', requiredColor } = props\n\n return styled({\n label: {\n display: 'inline-flex',\n alignItems: 'center',\n gap: '0.25rem',\n fontWeight: labelWeight,\n\n ...(LABEL_VARIANTS[labelVariant] ?? {}),\n\n ...(labelColor ? { color: labelColor } : {})\n },\n\n required: {\n color: requiredColor,\n lineHeight: 'inherit',\n fontSize: 'inherit',\n fontWeight: 'inherit'\n }\n })\n}\n","// Components\nimport { Typography } from '@components/commons/toolkit/Typography'\n\n// Types\nimport type { LabelProps } from './types'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Styles\nimport { createLabelStyles } from './style'\n\nexport const Label = (props: LabelProps) => {\n const {\n htmlFor,\n label,\n required,\n requiredColor,\n labelColor,\n labelWeight,\n labelVariant = 'b2'\n } = props\n\n const { styles } = useThemedStyles(props, createLabelStyles, {\n pick: p => [p.labelColor, p.labelWeight, p.labelVariant, p.requiredColor],\n override: props.styles,\n applyCommonProps: true\n })\n\n return (\n <label htmlFor={htmlFor} style={styles.label}>\n <Typography\n variant={labelVariant}\n styles={{\n text: {\n minWidth: 'fit-content',\n color: labelColor,\n fontWeight: labelWeight\n }\n }}\n >\n {label}\n\n {required ? (\n <Typography\n as=\"span\"\n variant=\"b2\"\n styles={{ text: { color: requiredColor, marginLeft: '0.125rem' } }}\n >\n *\n </Typography>\n ) : null}\n </Typography>\n </label>\n )\n}\n"],"mappings":";;;;;AAOA,MAAMA,iBAAgD;CACpD,IAAI;EACF,UAAU;EACV,YAAY;EACb;CACD,IAAI;EACF,UAAU;EACV,YAAY;EACb;CACD,IAAI;EACF,UAAU;EACV,YAAY;EACb;CACF;AAED,SAAgB,kBAAkB,OAA6B;CAC7D,MAAM,EAAE,YAAY,aAAa,eAAe,MAAM,kBAAkB;AAExE,QAAO,OAAO;EACZ,OAAO;GACL,SAAS;GACT,YAAY;GACZ,KAAK;GACL,YAAY;GAEZ,GAAI,eAAe,iBAAiB,EAAE;GAEtC,GAAI,aAAa,EAAE,OAAO,YAAY,GAAG,EAAE;GAC5C;EAED,UAAU;GACR,OAAO;GACP,YAAY;GACZ,UAAU;GACV,YAAY;GACb;EACF,CAAC;;;;;AC/BJ,MAAa,SAAS,UAAsB;CAC1C,MAAM,EACJ,SACA,OACA,UACA,eACA,YACA,aACA,eAAe,SACb;CAEJ,MAAM,EAAE,WAAW,gBAAgB,OAAO,mBAAmB;EAC3D,OAAM,MAAK;GAAC,EAAE;GAAY,EAAE;GAAa,EAAE;GAAc,EAAE;GAAc;EACzE,UAAU,MAAM;EAChB,kBAAkB;EACnB,CAAC;AAEF,QACE,oBAAC;EAAe;EAAS,OAAO,OAAO;YACrC,qBAAC;GACC,SAAS;GACT,QAAQ,EACN,MAAM;IACJ,UAAU;IACV,OAAO;IACP,YAAY;IACb,EACF;cAEA,OAEA,WACC,oBAAC;IACC,IAAG;IACH,SAAQ;IACR,QAAQ,EAAE,MAAM;KAAE,OAAO;KAAe,YAAY;KAAY,EAAE;cACnE;KAEY,GACX;IACO;GACP"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"TabSwitch-D6WJc7Bf.js","names":[],"sources":["../src/components/commons/toolkit/TabSwitch/components/TabSwitchItem/styles.ts","../src/components/commons/toolkit/TabSwitch/components/TabSwitchItem/index.tsx","../src/components/commons/toolkit/TabSwitch/styles.ts","../src/components/commons/toolkit/TabSwitch/index.tsx"],"sourcesContent":["// External Libraries\nimport { styled, type StyleMap } from '@hooks/useThemedStyles/types'\n\ninterface Params {\n disabled?: boolean\n selected?: boolean\n selectedColor?: string\n variant: 'default' | 'underline'\n}\n\nexport function createTabSwitchItemStyles({\n variant,\n disabled,\n selected,\n selectedColor\n}: Params): StyleMap {\n const accent = selectedColor ?? 'var(--px-color-primary)'\n\n return styled({\n item: {\n minHeight: '1.25rem',\n position: 'relative',\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center',\n gap: 4,\n background: 'transparent',\n border: 0,\n padding: '8px 10px',\n cursor: disabled ? 'not-allowed' : 'pointer',\n opacity: disabled ? 0.5 : 1,\n userSelect: 'none',\n whiteSpace: 'nowrap',\n __rules: { '& > p': { zIndex: 1 } }\n },\n\n selectedBg:\n variant === 'default'\n ? {\n position: 'absolute',\n inset: 0,\n borderRadius: 6,\n border: '1px solid var(--px-border-primary)',\n background: selected ? accent : 'transparent'\n }\n : {\n position: 'absolute',\n left: 0,\n right: 0,\n bottom: -2,\n height: 2,\n background: selected ? accent : 'transparent'\n }\n })\n}\n","// External Libraries\nimport { motion } from 'framer-motion'\n\n// Components\nimport { Typography } from '@components/commons/toolkit/Typography'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Types\nimport type { SwitchOption } from '../../types'\n\n// Styles\nimport { createTabSwitchItemStyles } from './styles'\n\ntype Props<T> = {\n option: SwitchOption<T>\n selected: boolean\n layoutId?: string\n disabled?: boolean\n selectedColor?: string\n selectedLabelColor?: string\n variant: 'default' | 'underline'\n onClick: (value: T) => void\n}\n\nexport const SwitchItem = <T,>(props: Props<T>) => {\n const { option, disabled, selected, layoutId, onClick } = props\n\n const { styles, classes } = useThemedStyles(\n props,\n createTabSwitchItemStyles,\n {\n pick: p => [p.variant, p.selectedColor, p.selectedLabelColor, p.selected]\n }\n )\n\n const isDisabled = disabled || option.disabled\n\n return (\n <button\n type=\"button\"\n style={styles.item}\n className={classes.item}\n tabIndex={isDisabled ? -1 : 0}\n onClick={() => !isDisabled && onClick(option.value)}\n >\n {selected ? (\n <motion.div\n layoutId={layoutId || 'pixel-tabswitch-selected'}\n style={styles.selectedBg}\n />\n ) : null}\n\n {option.icon ? (\n <span style={{ display: 'inline-flex' }}>{option.icon}</span>\n ) : null}\n\n <Typography variant=\"b1\" fontWeight=\"bold\">\n {option.label}\n </Typography>\n </button>\n )\n}\n","// Types\nimport type { TabSwitchProps } from './types'\nimport { styled, type StyleMap } from '@hooks/useThemedStyles/types'\n\nexport function createTabSwitchStyles<T>(props: TabSwitchProps<T>): StyleMap {\n const { fitContent } = props\n\n return styled({\n container: {\n display: 'flex',\n flexDirection: 'row',\n alignItems: 'center',\n color: 'var(--px-text-primary, #4b5563)',\n width: fitContent ? 'fit-content' : '100%',\n borderBottom: '1px solid var(--px-border-primaryder, #e5e7eb)',\n gap: 0,\n __rules: { '& svg': { zIndex: 1 } }\n }\n })\n}\n","// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Components\nimport { SwitchItem } from './components/TabSwitchItem'\n\n// Types\nimport type { TabSwitchProps } from './types'\n\n// Styles\nimport { createTabSwitchStyles } from './styles'\n\nexport * from './types'\n\nexport const TabSwitch = <T,>(props: TabSwitchProps<T>) => {\n {\n const {\n options,\n disabled,\n layoutId,\n currentValue,\n variant = 'default',\n onChange\n } = props\n\n const { styles, classes } = useThemedStyles(props, createTabSwitchStyles, {\n pick: p => [p.disabled, p.currentValue],\n override: props.styles,\n applyCommonProps: true\n })\n\n return (\n <div style={styles.container} className={classes.container}>\n {options.map(opt => (\n <SwitchItem\n key={String(opt.value)}\n option={opt}\n variant={variant}\n layoutId={layoutId}\n disabled={disabled}\n selectedColor={props.selectedColor}\n selected={currentValue === opt.value}\n selectedLabelColor={props.selectedLabelColor}\n onClick={onChange}\n />\n ))}\n </div>\n )\n }\n}\n"],"mappings":";;;;;;AAUA,SAAgB,0BAA0B,EACxC,SACA,UACA,UACA,iBACmB;CACnB,MAAM,SAAS,iBAAiB;AAEhC,QAAO,OAAO;EACZ,MAAM;GACJ,WAAW;GACX,UAAU;GACV,SAAS;GACT,YAAY;GACZ,gBAAgB;GAChB,KAAK;GACL,YAAY;GACZ,QAAQ;GACR,SAAS;GACT,QAAQ,WAAW,gBAAgB;GACnC,SAAS,WAAW,KAAM;GAC1B,YAAY;GACZ,YAAY;GACZ,SAAS,EAAE,SAAS,EAAE,QAAQ,GAAG,EAAE;GACpC;EAED,YACE,YAAY,YACR;GACE,UAAU;GACV,OAAO;GACP,cAAc;GACd,QAAQ;GACR,YAAY,WAAW,SAAS;GACjC,GACD;GACE,UAAU;GACV,MAAM;GACN,OAAO;GACP,QAAQ;GACR,QAAQ;GACR,YAAY,WAAW,SAAS;GACjC;EACR,CAAC;;;;;AC3BJ,MAAa,cAAkB,UAAoB;CACjD,MAAM,EAAE,QAAQ,UAAU,UAAU,UAAU,YAAY;CAE1D,MAAM,EAAE,QAAQ,YAAY,gBAC1B,OACA,2BACA,EACE,OAAM,MAAK;EAAC,EAAE;EAAS,EAAE;EAAe,EAAE;EAAoB,EAAE;EAAS,EAC1E,CACF;CAED,MAAM,aAAa,YAAY,OAAO;AAEtC,QACE,qBAAC;EACC,MAAK;EACL,OAAO,OAAO;EACd,WAAW,QAAQ;EACnB,UAAU,aAAa,KAAK;EAC5B,eAAe,CAAC,cAAc,QAAQ,OAAO,MAAM;;GAElD,WACC,oBAAC,OAAO;IACN,UAAU,YAAY;IACtB,OAAO,OAAO;KACd,GACA;GAEH,OAAO,OACN,oBAAC;IAAK,OAAO,EAAE,SAAS,eAAe;cAAG,OAAO;KAAY,GAC3D;GAEJ,oBAAC;IAAW,SAAQ;IAAK,YAAW;cACjC,OAAO;KACG;;GACN;;;;;ACzDb,SAAgB,sBAAyB,OAAoC;CAC3E,MAAM,EAAE,eAAe;AAEvB,QAAO,OAAO,EACZ,WAAW;EACT,SAAS;EACT,eAAe;EACf,YAAY;EACZ,OAAO;EACP,OAAO,aAAa,gBAAgB;EACpC,cAAc;EACd,KAAK;EACL,SAAS,EAAE,SAAS,EAAE,QAAQ,GAAG,EAAE;EACpC,EACF,CAAC;;;;;ACJJ,MAAa,aAAiB,UAA6B;CACzD;EACE,MAAM,EACJ,SACA,UACA,UACA,cACA,UAAU,WACV,aACE;EAEJ,MAAM,EAAE,QAAQ,YAAY,gBAAgB,OAAO,uBAAuB;GACxE,OAAM,MAAK,CAAC,EAAE,UAAU,EAAE,aAAa;GACvC,UAAU,MAAM;GAChB,kBAAkB;GACnB,CAAC;AAEF,SACE,oBAAC;GAAI,OAAO,OAAO;GAAW,WAAW,QAAQ;aAC9C,QAAQ,KAAI,QACX,oBAAC;IAEC,QAAQ;IACC;IACC;IACA;IACV,eAAe,MAAM;IACrB,UAAU,iBAAiB,IAAI;IAC/B,oBAAoB,MAAM;IAC1B,SAAS;MARJ,OAAO,IAAI,MAAM,CAStB,CACF;IACE"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"TextArea-DY9c18r6.js","names":[],"sources":["../src/components/commons/inputs/TextArea/styles.ts","../src/components/commons/inputs/TextArea/index.tsx"],"sourcesContent":["// Types\nimport { styled, type StyleMap } from '@hooks/useThemedStyles/types'\nimport type { TextAreaProps } from './types'\n\nexport function createTextAreaStyles(props: TextAreaProps): StyleMap {\n const { height = '8rem', readOnly, startIcon } = props\n\n const focusRingColor = props.focusedRingColor || 'var(--px-color-info)'\n const placeHolderColor =\n props.placeholderColor || 'var(--px-text-placeholder)'\n\n return styled({\n iconContainer: {\n position: 'absolute',\n left: '0.75rem',\n top: '1.375rem',\n transform: 'translateY(-50%)'\n },\n textArea: {\n height,\n width: '100%',\n paddingBlock: '0.75rem',\n paddingInline: '0.875rem',\n borderRadius: '0.5rem',\n resize: 'none',\n\n fontWeight: '400',\n fontSize: '1rem',\n color: 'var(--px-text-primary)',\n\n border: '1px solid red',\n outlineOffset: '-1px',\n\n cursor: readOnly ? 'default' : undefined,\n paddingLeft: startIcon ? '2.5rem' : undefined,\n\n __rules: {\n '&::placeholder': {\n color: `${placeHolderColor}`\n },\n '&:focus': readOnly\n ? { outline: 'none' }\n : { outline: `2px solid ${focusRingColor}` }\n }\n }\n })\n}\n","// External Libraries\nimport { useId } from 'react'\n\n// Types\nimport type { TextAreaProps } from './types'\n\n// Components\nimport { Label } from '@components/commons/Label'\nimport { Icon } from '@components/commons/toolkit/Icon'\nimport { Typography } from '@components/commons/toolkit/Typography'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Styles\nimport { createTextAreaStyles } from './styles'\n\nexport const TextArea = (props: TextAreaProps) => {\n const {\n value,\n disabled,\n readOnly,\n maxLength,\n hideMaxLength,\n textMaxLength,\n placeholder,\n\n label,\n required,\n requiredColor,\n labelColor,\n labelWeight,\n labelVariant,\n\n startIcon,\n iconColor\n } = props\n\n // Hooks\n const inputId = useId()\n\n const { styles, classes } = useThemedStyles(props, createTextAreaStyles, {\n pick: p => [\n p.height,\n p.readOnly,\n p.startIcon,\n p.placeholderColor,\n p.focusedRingColor\n ],\n override: props.styles,\n applyCommonProps: true\n })\n\n // Functions\n function handleChange(e: React.ChangeEvent<HTMLTextAreaElement>) {\n if (disabled || readOnly) return\n props.onChange?.(e.target.value)\n }\n\n function renderLabel() {\n if (!label) return null\n\n return (\n <div className=\"flex items-center gap-3\">\n <Label\n htmlFor={inputId}\n label={label}\n required={required}\n requiredColor={requiredColor}\n labelColor={labelColor}\n labelWeight={labelWeight}\n labelVariant={labelVariant}\n />\n </div>\n )\n }\n\n return (\n <div>\n {renderLabel()}\n\n <div style={{ position: 'relative' }}>\n {startIcon && (\n <div style={styles.iconContainer}>\n <Icon\n name={startIcon}\n color={iconColor ? iconColor : 'var(--px-text-primary)'}\n />\n </div>\n )}\n\n <textarea\n value={value}\n disabled={disabled}\n readOnly={readOnly}\n maxLength={maxLength}\n placeholder={placeholder}\n style={styles.textArea}\n className={classes.textArea}\n onChange={handleChange}\n />\n </div>\n\n {maxLength && !hideMaxLength ? (\n <Typography variant=\"b2\" styles={{ text: { marginLeft: 'auto' } }}>\n {value.length}/{maxLength} {textMaxLength}\n </Typography>\n ) : null}\n </div>\n )\n}\n"],"mappings":";;;;;;;;AAIA,SAAgB,qBAAqB,OAAgC;CACnE,MAAM,EAAE,SAAS,QAAQ,UAAU,cAAc;CAEjD,MAAM,iBAAiB,MAAM,oBAAoB;CACjD,MAAM,mBACJ,MAAM,oBAAoB;AAE5B,QAAO,OAAO;EACZ,eAAe;GACb,UAAU;GACV,MAAM;GACN,KAAK;GACL,WAAW;GACZ;EACD,UAAU;GACR;GACA,OAAO;GACP,cAAc;GACd,eAAe;GACf,cAAc;GACd,QAAQ;GAER,YAAY;GACZ,UAAU;GACV,OAAO;GAEP,QAAQ;GACR,eAAe;GAEf,QAAQ,WAAW,YAAY;GAC/B,aAAa,YAAY,WAAW;GAEpC,SAAS;IACP,kBAAkB,EAChB,OAAO,GAAG,oBACX;IACD,WAAW,WACP,EAAE,SAAS,QAAQ,GACnB,EAAE,SAAS,aAAa,kBAAkB;IAC/C;GACF;EACF,CAAC;;;;;AC5BJ,MAAa,YAAY,UAAyB;CAChD,MAAM,EACJ,OACA,UACA,UACA,WACA,eACA,eACA,aAEA,OACA,UACA,eACA,YACA,aACA,cAEA,WACA,cACE;CAGJ,MAAM,UAAU,OAAO;CAEvB,MAAM,EAAE,QAAQ,YAAY,gBAAgB,OAAO,sBAAsB;EACvE,OAAM,MAAK;GACT,EAAE;GACF,EAAE;GACF,EAAE;GACF,EAAE;GACF,EAAE;GACH;EACD,UAAU,MAAM;EAChB,kBAAkB;EACnB,CAAC;CAGF,SAAS,aAAa,GAA2C;AAC/D,MAAI,YAAY,SAAU;AAC1B,QAAM,WAAW,EAAE,OAAO,MAAM;;CAGlC,SAAS,cAAc;AACrB,MAAI,CAAC,MAAO,QAAO;AAEnB,SACE,oBAAC;GAAI,WAAU;aACb,oBAAC;IACC,SAAS;IACF;IACG;IACK;IACH;IACC;IACC;KACd;IACE;;AAIV,QACE,qBAAC;EACE,aAAa;EAEd,qBAAC;GAAI,OAAO,EAAE,UAAU,YAAY;cACjC,aACC,oBAAC;IAAI,OAAO,OAAO;cACjB,oBAAC;KACC,MAAM;KACN,OAAO,YAAY,YAAY;MAC/B;KACE,EAGR,oBAAC;IACQ;IACG;IACA;IACC;IACE;IACb,OAAO,OAAO;IACd,WAAW,QAAQ;IACnB,UAAU;KACV;IACE;EAEL,aAAa,CAAC,gBACb,qBAAC;GAAW,SAAQ;GAAK,QAAQ,EAAE,MAAM,EAAE,YAAY,QAAQ,EAAE;;IAC9D,MAAM;IAAO;IAAE;IAAU;IAAE;;IACjB,GACX;KACA"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"ThemeContext-0pOYSNvl.js","names":["result: any","out: any","defaultThemes: ThemeRegistry","ThemeProvider: React.FC<ThemeProviderProps>"],"sources":["../src/utils/functions/deepMerge.ts","../src/contexts/ThemeContext/constants.ts","../src/contexts/ThemeContext/utils/general.ts","../src/contexts/ThemeContext/utils/themeToCSSVars.ts","../src/contexts/ThemeContext/index.tsx"],"sourcesContent":["/** biome-ignore-all lint/suspicious/noExplicitAny: <Not needed> */\nexport type DeepPartial<T> = {\n [P in keyof T]?: T[P] extends Array<infer U>\n ? Array<DeepPartial<U>>\n : T[P] extends object\n ? DeepPartial<T[P]>\n : T[P]\n}\n\nexport function deepMerge<T>(base: T, override?: DeepPartial<T>): T {\n if (override === undefined) return clone(base)\n\n if (!isPlainObject(base) || !isPlainObject(override)) {\n return clone(override as T)\n }\n\n const result: any = Array.isArray(base) ? [] : {}\n\n const baseKeys = Object.keys(base as any) as (keyof T)[]\n const overrideKeys = Object.keys(override as any) as (keyof T)[]\n\n const allKeys = Array.from(new Set([...baseKeys, ...overrideKeys]))\n\n for (const k of allKeys) {\n const baseVal = (base as any)[k]\n const overrideVal = (override as any)[k]\n\n if (overrideVal === undefined) {\n result[k] = clone(baseVal)\n continue\n }\n\n if (isPlainObject(baseVal) && isPlainObject(overrideVal)) {\n result[k] = deepMerge(baseVal, overrideVal)\n continue\n }\n\n result[k] = clone(overrideVal)\n }\n\n return result as T\n}\n\nfunction isPlainObject(x: any): x is Record<string, any> {\n return !!x && typeof x === 'object' && !Array.isArray(x)\n}\n\nfunction clone<T>(v: T): T {\n if (v === undefined || v === null) return v\n if (Array.isArray(v)) return v.map(item => clone(item)) as unknown as T\n if (isPlainObject(v)) {\n const out: any = {}\n for (const k of Object.keys(v)) out[k] = clone((v as any)[k])\n return out\n }\n return v\n}\n","// theme/defaultThemes.ts\nimport type { ThemeRegistry } from './types'\n\nconst COMMON_MAP = {\n spacing: {\n xs: '0.25rem', // 4px\n sm: '0.5rem', // 8px\n md: '1rem', // 16px\n lg: '1.5rem', // 24px\n xl: '2rem', // 32px\n '2xl': '3rem' // 48px\n },\n borderRadius: {\n none: '0rem', // 0px\n sm: '0.25rem', // 4px\n md: '0.375rem', // 6px\n lg: '0.5rem', // 8px\n full: '9999rem' // \"infinite\" radius equivalent\n },\n fontSize: {\n xs: '0.75rem', // 12px\n sm: '0.875rem', // 14px\n md: '1rem', // 16px\n lg: '1.125rem', // 18px\n xl: '1.25rem', // 20px\n '2xl': '1.5rem' // 24px\n },\n fontWeight: { normal: 400, medium: 500, semibold: 600, bold: 700 }\n} as const\n\nexport const defaultThemes: ThemeRegistry = {\n light: {\n colors: {\n scrollbar: '#0000001a',\n disabled: '#D5D7DA',\n\n primary: '#0EB24C',\n secondary: '#6C6C6C',\n success: '#0EB24C',\n warning: '#f59e0b',\n error: '#ef4444',\n invalid: '#f87171',\n info: '#06b6d4',\n\n background: {\n primary: '#FFFFFF',\n card: {\n primary: '#F4F4F4',\n secondary: '#F3F6F9'\n }\n },\n button: {\n filled: {\n label: '#FFFFFF',\n background: '#0EB24C'\n },\n\n outlined: {\n label: '#222222',\n borderColor: '#DDDDDD'\n },\n\n ghost: {\n label: '#6C6C6C'\n }\n },\n\n surface: '#FBFBFB',\n border: {\n primary: '#E8E8E9',\n secondary: '#E8E8E9'\n },\n\n text: {\n primary: '#222222',\n secondary: '#6C6C6C',\n disabled: '#A0A0A0',\n inverse: '#FFFFFF'\n }\n },\n\n ...COMMON_MAP,\n\n shadows: {\n xs: '0px -1px 0px #0A0D120D inset, 0px 1px 2px #0A0D120D',\n sm: '0 1px 2px 0 rgba(0, 0, 0, 0.05)',\n md: '0 4px 6px -1px rgba(0, 0, 0, 0.10)',\n lg: '0 10px 15px -3px rgba(0, 0, 0, 0.10)',\n xl: '0 20px 25px -5px rgba(0, 0, 0, 0.10)',\n '2xl': '0 25px 50px -12px rgba(0, 0, 0, 0.25)'\n }\n },\n\n dark: {\n colors: {\n scrollbar: '#858585',\n disabled: '#D5D7DA',\n\n primary: '#0EB24C',\n secondary: '#C7CFD8',\n success: '#0EB24C',\n warning: '#f59e0b',\n error: '#ef4444',\n invalid: '#f87171',\n info: '#06b6d4',\n\n background: {\n primary: '#090909',\n card: {\n primary: '#F4F4F4',\n secondary: '#202020'\n }\n },\n button: {\n filled: {\n label: '#FFFFFF',\n background: '#0EB24C'\n },\n\n outlined: {\n label: '#ECECEC',\n borderColor: '#DDDDDD'\n },\n\n ghost: {\n label: '#6C6C6C'\n }\n },\n\n surface: '#090909',\n\n border: {\n primary: '#27282D',\n secondary: '#27282D'\n },\n\n text: {\n primary: '#ECECEC',\n secondary: '#C7CFD8',\n disabled: '#8B93A0',\n inverse: '#090909'\n }\n },\n\n ...COMMON_MAP,\n\n shadows: {\n xs: '0px -1px 0px #0A0D120D inset, 0px 1px 2px #0A0D120D',\n sm: '0 1px 2px 0 rgba(0, 0, 0, 0.35)',\n md: '0 4px 6px -1px rgba(0, 0, 0, 0.45)',\n lg: '0 10px 15px -3px rgba(0, 0, 0, 0.50)',\n xl: '0 20px 25px -5px rgba(0, 0, 0, 0.55)',\n '2xl': '0 25px 50px -12px rgba(0, 0, 0, 0.65)'\n }\n }\n}\n","// Utils\n/** biome-ignore-all lint/suspicious/noExplicitAny: <Not needed> */\nimport { deepMerge } from '@utils/functions'\nimport { defaultThemes } from '../constants'\n\n// Types\nimport type { ThemeMode, ThemeRegistry, ThemeTokens } from '../types'\n\n/**\n * Theme Utilities\n * ===============\n * Small DOM utilities used by the ThemeProvider to:\n * - toggle dark mode class for Tailwind compatibility\n * - inject CSS variables (`--px-*`) into the document root\n * - read/watch the OS/browser theme preference (`prefers-color-scheme`)\n *\n * These helpers are:\n * - **client-safe** (guarded for SSR)\n * - **framework-agnostic** (only touch `documentElement`)\n * - **tiny** (no dependencies)\n */\n\n/**\n * CSSVarMap\n * ---------\n * A map of CSS custom properties to be applied on the document root.\n *\n * Notes:\n * - Keys must be valid CSS variable names (e.g. `\"--px-bg\"`, `\"--px-text-primary\"`).\n * - Values can be strings or numbers.\n * - If you store numbers (e.g. 16), you decide at consumption time whether it means px.\n *\n * You can keep it generic:\n * Record<`--${string}`, string | number>\n *\n * Or restrict to your library prefix:\n * Record<`--px-${string}`, string | number>\n */\nexport type CSSVarMap = Partial<Record<`--${string}`, string | number>>\n\n/**\n * applyThemeClass(themeName)\n * -------------------------\n * Applies the light/dark mode class to the `<html>` element.\n *\n * Tailwind’s dark mode (in the common \"class\" strategy) typically relies on a\n * `.dark` class. This function toggles ONLY the `dark` class:\n *\n * - themeName `\"dark\"` => adds `.dark`\n * - themeName `\"light\"` => removes `.dark`\n *\n * SSR:\n * - No-op on the server (when `document` is undefined).\n */\nexport function applyThemeClass(themeName: 'light' | 'dark') {\n if (typeof document === 'undefined') return\n const root = document.documentElement\n root.classList.toggle('dark', themeName === 'dark')\n}\n\n/**\n * applyCssVars(vars)\n * ------------------\n * Injects CSS variables into the document root (`<html>`).\n *\n * This is how the library exposes theme tokens as CSS variables.\n * Components can then use `var(--px-...)` in styles.\n *\n * Example:\n * ```ts\n * applyCssVars({ '--px-bg': '#fff', '--px-text-primary': '#111' })\n * ```\n *\n * Behavior:\n * - Ignores `null` / `undefined` values.\n * - Converts all values to string before applying.\n *\n * SSR:\n * - No-op on the server (when `document` is undefined).\n */\nexport function applyCssVars(vars: CSSVarMap) {\n if (typeof document === 'undefined') return\n const root = document.documentElement\n\n for (const [key, value] of Object.entries(vars)) {\n if (value == null) continue\n root.style.setProperty(key, String(value))\n }\n}\n\n/**\n * getSystemThemeName()\n * --------------------\n * Returns the current OS/browser color scheme preference.\n *\n * It reads `prefers-color-scheme: dark` using `window.matchMedia`.\n *\n * Returns:\n * - `\"dark\"` if the user prefers dark mode\n * - `\"light\"` otherwise\n *\n * SSR:\n * - Returns `\"light\"` on the server (safe default).\n */\nexport function getSystemThemeName(): 'light' | 'dark' {\n if (typeof window === 'undefined') return 'light'\n const prefersDark =\n window.matchMedia?.('(prefers-color-scheme: dark)').matches ?? false\n return prefersDark ? 'dark' : 'light'\n}\n\n/**\n * watchSystemTheme(onChange)\n * --------------------------\n * Subscribes to changes in OS/browser theme preference.\n *\n * Use this when your selected mode is `\"system\"` so the app immediately reacts\n * when the user changes their OS theme.\n *\n * - Calls `onChange('light' | 'dark')` whenever the preference changes.\n * - Returns an `unsubscribe()` function.\n *\n * Implementation details:\n * - Uses `matchMedia('(prefers-color-scheme: dark)')`.\n * - Supports both modern `addEventListener('change', ...)` and legacy Safari\n * `addListener(...)` APIs.\n *\n * SSR:\n * - Returns a no-op unsubscribe function on the server.\n */\nexport function watchSystemTheme(onChange: (name: 'light' | 'dark') => void) {\n if (typeof window === 'undefined') return () => {}\n\n const mq = window.matchMedia('(prefers-color-scheme: dark)')\n\n const handler = () => onChange(mq.matches ? 'dark' : 'light')\n\n handler()\n\n if (mq.addEventListener) {\n mq.addEventListener('change', handler)\n return () => mq.removeEventListener('change', handler)\n }\n\n mq.addListener(handler as any)\n return () => mq.removeListener(handler as any)\n}\n\n/**\n * Resolves an effective theme name from a mode.\n */\nexport function resolveName(mode: ThemeMode): string {\n if (mode !== 'system') return mode\n return getSystemThemeName()\n}\n\n/**\n * Builds a registry of user theme patches.\n */\nexport function buildRegistry(\n userThemes?: Partial<ThemeRegistry>\n): ThemeRegistry {\n return {\n light: {},\n dark: {},\n ...(userThemes ?? {})\n } as ThemeRegistry\n}\n\n/**\n * Builds the final resolved theme tokens.\n */\nexport function buildTheme(\n registry: ThemeRegistry,\n resolvedName: string,\n override?: Partial<ThemeTokens>\n): ThemeTokens {\n const base: ThemeTokens =\n resolvedName === 'dark'\n ? (defaultThemes.dark as ThemeTokens)\n : (defaultThemes.light as ThemeTokens)\n\n const selectedPatch = (registry[resolvedName] ?? registry.light) as any\n\n const merged = deepMerge(base, selectedPatch)\n return deepMerge(merged, override)\n}\n\nexport function isThemeMode(value: unknown): value is ThemeMode {\n return typeof value === 'string' && value.length > 0\n}\n\nexport function getLocalStorageSafe(): Storage | null {\n if (typeof window === 'undefined') return null\n try {\n return window.localStorage\n } catch {\n return null\n }\n}\n","// Types\nimport type { CSSVarMap } from './general'\nimport type { ThemeTokens } from '../types'\n\n/**\n * themeToCssVars(theme)\n * ---------------------\n * Converts a resolved `ThemeTokens` object into a CSS variable map (`CSSVarMap`).\n *\n * The ThemeProvider uses this function to inject `--px-*` variables into the\n * document root (`<html>`). Components can then rely on stable CSS variables,\n * making them framework-agnostic and compatible with Tailwind (via `.dark`).\n *\n * Why CSS variables?\n * - They are fast (native to the browser)\n * - They work across any styling strategy (inline styles, CSS modules, Tailwind, etc.)\n * - They enable dynamic theme switching without rerendering every component\n *\n * Requirements / Assumptions:\n * - The input `theme` must be **fully resolved** (i.e. complete `ThemeTokens`).\n * The ThemeProvider is responsible for merging partial theme patches on top\n * of a complete base theme (light/dark defaults).\n *\n * Variable naming:\n * - All variables are prefixed with `--px-` to avoid collisions.\n * - Tokens are grouped by category (colors, surfaces, borders, text, spacing, radius, typography, shadows).\n *\n * Notes:\n * - Spacing/radius/fontSize tokens are stored as numbers (e.g. `16`), which is valid\n * for CSS variables. When consuming them, you can:\n * - append `px` in JS (`${var}px`), or\n * - store them as strings here (e.g. `\"16px\"`) if you prefer.\n *\n * Example usage (component styles):\n * ```ts\n * const styles = {\n * background: 'var(--px-bg)',\n * color: 'var(--px-text-primary)',\n * borderColor: 'var(--px-border-primary)',\n * }\n * ```\n *\n * Example usage (Tailwind config / CSS):\n * ```css\n * .card {\n * background: var(--px-surface);\n * color: var(--px-text-primary);\n * border: 1px solid var(--px-border-primary);\n * }\n * ```\n */\nexport function themeToCssVars(theme: ThemeTokens): CSSVarMap {\n return {\n /**\n * Brand & intent colors\n */\n '--px-color-primary': theme.colors.primary,\n '--px-color-secondary': theme.colors.secondary,\n '--px-color-success': theme.colors.success,\n '--px-color-warning': theme.colors.warning,\n '--px-color-error': theme.colors.error,\n '--px-color-invalid': theme.colors.invalid,\n '--px-color-info': theme.colors.info,\n '--px-color-disabled': theme.colors.disabled,\n\n /**\n * Scrollbar\n */\n '--px-scrollbar': theme.colors.scrollbar,\n\n /**\n * Surfaces / backgrounds\n */\n '--px-bg': theme.colors.background.primary,\n '--px-surface': theme.colors.surface,\n '--px-background-card-primary': theme.colors.background.card.primary,\n '--px-background-card-secondary': theme.colors.background.card.secondary,\n\n /**\n * Borders\n * -------\n * Divider and outline colors.\n */\n '--px-border-primary': theme.colors.border.primary,\n '--px-border-secondary': theme.colors.border.secondary,\n\n /**\n * Text\n * ----\n * Text colors for different emphasis levels.\n */\n '--px-text-primary': theme.colors.text.primary,\n '--px-text-secondary': theme.colors.text.secondary,\n '--px-text-disabled': theme.colors.text.disabled,\n '--px-text-inverse': theme.colors.text.inverse,\n\n /**\n * Buttons – Filled\n * ----------------\n * Filled button colors\n */\n '--px-btn-filled-bg': theme.colors.button.filled.background,\n '--px-btn-filled-label': theme.colors.button.filled.label,\n\n /**\n * Buttons – Outlined\n * ------------------\n * Outlined button colors\n */\n '--px-btn-outlined-border': theme.colors.button.outlined.borderColor,\n '--px-btn-outlined-label': theme.colors.button.outlined.label,\n\n /**\n * Buttons – Ghost\n * --------------\n * Ghost button colors\n */\n '--px-btn-ghost-label': theme.colors.button.ghost.label,\n /**\n * Spacing\n * -------------\n * Numeric spacing tokens (commonly used as px).\n */\n '--px-space-xs': theme.spacing.xs,\n '--px-space-sm': theme.spacing.sm,\n '--px-space-md': theme.spacing.md,\n '--px-space-lg': theme.spacing.lg,\n '--px-space-xl': theme.spacing.xl,\n '--px-space-2xl': theme.spacing['2xl'],\n\n /**\n * Border radius scale\n * -------------------\n * Numeric radius tokens (commonly used as px).\n */\n '--px-radius-none': theme.borderRadius.none,\n '--px-radius-sm': theme.borderRadius.sm,\n '--px-radius-md': theme.borderRadius.md,\n '--px-radius-lg': theme.borderRadius.lg,\n '--px-radius-full': theme.borderRadius.full,\n\n /**\n * Typography scale\n * ----------------\n * Font sizes and font weights.\n */\n '--px-fs-xs': theme.fontSize.xs,\n '--px-fs-sm': theme.fontSize.sm,\n '--px-fs-md': theme.fontSize.md,\n '--px-fs-lg': theme.fontSize.lg,\n '--px-fs-xl': theme.fontSize.xl,\n '--px-fs-2xl': theme.fontSize['2xl'],\n\n '--px-fw-normal': theme.fontWeight.normal,\n '--px-fw-medium': theme.fontWeight.medium,\n '--px-fw-semibold': theme.fontWeight.semibold,\n '--px-fw-bold': theme.fontWeight.bold,\n\n /**\n * Shadows\n * -------\n * CSS shadow strings for elevation.\n */\n '--px-shadow-xs': theme.shadows.xs,\n '--px-shadow-sm': theme.shadows.sm,\n '--px-shadow-md': theme.shadows.md,\n '--px-shadow-lg': theme.shadows.lg,\n '--px-shadow-xl': theme.shadows.xl,\n '--px-shadow-2xl': theme.shadows['2xl']\n }\n}\n","/** biome-ignore-all lint/suspicious/noExplicitAny: <Not needed> */\n\n'use client'\n\n// External Libraries\nimport {\n useMemo,\n useState,\n useEffect,\n useContext,\n createContext,\n useLayoutEffect\n} from 'react'\n\n// Utils\nimport {\n buildTheme,\n isThemeMode,\n resolveName,\n applyCssVars,\n buildRegistry,\n themeToCssVars,\n applyThemeClass,\n watchSystemTheme,\n getLocalStorageSafe\n} from './utils'\n\n// Types\nimport type { ThemeMode, ThemeContextData, ThemeProviderProps } from './types'\n\nexport * from './types'\n\nconst ThemeContext = createContext<ThemeContextData | null>(null)\n\n/**\n * useIsomorphicLayoutEffect\n * - On client: runs before paint (layout effect)\n * - On server: falls back to useEffect (no warnings)\n */\nconst useIsomorphicLayoutEffect =\n typeof window !== 'undefined' ? useLayoutEffect : useEffect\n\nexport const ThemeProvider: React.FC<ThemeProviderProps> = ({\n themes,\n children,\n override,\n persistence,\n persist = false,\n defaultMode = 'system',\n storageKey = 'px-theme',\n fallback = null\n}) => {\n const registry = useMemo(() => buildRegistry(themes), [themes])\n\n function makeInitialMode(): ThemeMode {\n if (persistence) {\n try {\n const saved = persistence.get()\n return (saved ?? defaultMode) as ThemeMode\n } catch {\n return defaultMode\n }\n }\n\n const ls = getLocalStorageSafe()\n if (!ls) return defaultMode\n const raw = ls.getItem(storageKey)?.replaceAll('\"', '')\n return isThemeMode(raw) ? raw : defaultMode\n }\n\n const [mode, setMode] = useState<ThemeMode>(makeInitialMode)\n\n /**\n * Gate: only render children after we applied class + vars at least once.\n * This prevents \"unstyled flash\" for your components.\n */\n const [isReady, setReady] = useState(false)\n\n const resolvedName = useMemo(() => {\n if (typeof window === 'undefined') return mode === 'system' ? 'light' : mode\n return resolveName(mode)\n }, [mode])\n\n const theme = useMemo(\n () => buildTheme(registry, resolvedName, override),\n [registry, resolvedName, override]\n )\n\n // keep in sync with OS when mode === \"system\"\n useEffect(() => {\n if (typeof window === 'undefined') return\n if (mode !== 'system') return\n\n return watchSystemTheme(() => {\n setMode('system')\n })\n }, [mode])\n\n /**\n * Apply theme BEFORE paint (client) and then unlock rendering.\n */\n useIsomorphicLayoutEffect(() => {\n if (typeof window === 'undefined') return\n\n applyThemeClass(resolvedName === 'dark' ? 'dark' : 'light')\n applyCssVars(themeToCssVars(theme))\n\n // unlock after first successful application\n setReady(true)\n }, [resolvedName, theme])\n\n /**\n * Persist mode changes (optional).\n */\n useEffect(() => {\n if (persistence) {\n try {\n persistence.set(mode)\n } catch {}\n return\n }\n\n if (!persist) return\n const ls = getLocalStorageSafe()\n if (!ls) return\n\n try {\n ls.setItem(storageKey, mode)\n } catch {}\n }, [mode, persist, storageKey, persistence])\n\n function setTheme(next: ThemeMode) {\n setMode(next)\n }\n\n function toggleTheme(a: string = 'light', b: string = 'dark') {\n setMode(resolvedName === a ? b : a)\n }\n\n // biome-ignore lint/correctness/useExhaustiveDependencies: <Not needed>\n const ctxValue = useMemo(\n () => ({\n mode,\n resolvedName,\n theme,\n isLoading: !isReady,\n setTheme,\n toggleTheme\n }),\n [mode, resolvedName, theme, isReady]\n )\n\n return (\n <ThemeContext.Provider value={ctxValue}>\n {isReady ? children : fallback}\n </ThemeContext.Provider>\n )\n}\n\nexport function useTheme(): ThemeContextData {\n const ctx = useContext(ThemeContext)\n if (!ctx) throw new Error('useTheme must be used within a ThemeProvider')\n return ctx\n}\n"],"mappings":"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"}
@@ -1,49 +0,0 @@
1
- import { i as PaddingProps, n as LayoutProps } from "./styleProps-D405c8KF.js";
2
- import { n as StyleMap } from "./useThemedStyles-B7irjShy.js";
3
- import { n as TypographyVariant } from "./types-ESf1Pmhi.js";
4
- import React, { ReactNode } from "react";
5
-
6
- //#region src/components/commons/inputs/Input/styles.d.ts
7
-
8
- declare function createInputStyles(props: InputProps): StyleMap;
9
- //#endregion
10
- //#region src/components/commons/inputs/Input/types.d.ts
11
- type InputVariant = 'bordered';
12
- type InputSize = 'sm' | 'md' | 'lg';
13
- type InputRadius = 'none' | 'sm' | 'md' | 'lg' | 'full';
14
- type InputType = 'text' | 'email' | 'url' | 'password' | 'tel' | 'search';
15
- type InputWidth = 'auto' | 'full' | 'md' | 'lg' | 'xl' | '2xl';
16
- interface InputProps extends LayoutProps, PaddingProps {
17
- id?: string;
18
- label?: string;
19
- value?: string;
20
- size?: InputSize;
21
- type?: InputType;
22
- minLength?: number;
23
- maxLength?: number;
24
- width?: InputWidth;
25
- required?: boolean;
26
- placeholder?: string;
27
- radius?: InputRadius;
28
- variant?: InputVariant;
29
- isInvalid?: boolean;
30
- fullWidth?: boolean;
31
- endContent?: ReactNode;
32
- requiredColor?: string;
33
- focusedRingColor?: string;
34
- labelColor?: string;
35
- styles?: Partial<ReturnType<typeof createInputStyles>>;
36
- isDisabled?: boolean;
37
- labelWeight?: string;
38
- labelVariant?: TypographyVariant;
39
- defaultValue?: string;
40
- errorMessage?: string;
41
- startContent?: ReactNode;
42
- onChange: (value: string) => void;
43
- }
44
- //#endregion
45
- //#region src/components/commons/inputs/Input/index.d.ts
46
- declare const Input: React.FC<InputProps>;
47
- //#endregion
48
- export { Input as t };
49
- //# sourceMappingURL=index-De1q2lSW.d.ts.map