@soyfri/shared-library 2.0.0-beta.8 → 2.0.0-beta8
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/Autocomplete-BA-cGASd.js +316 -0
- package/Autocomplete-BA-cGASd.js.map +1 -0
- package/Autocomplete-C2x-lBvZ.cjs +315 -0
- package/Autocomplete-C2x-lBvZ.cjs.map +1 -0
- package/Avatar-9L7YMxya.cjs +162 -0
- package/Avatar-9L7YMxya.cjs.map +1 -0
- package/Avatar-BJTr-PBd.js +163 -0
- package/Avatar-BJTr-PBd.js.map +1 -0
- package/Card-DG_crfkK.cjs +185 -0
- package/Card-DG_crfkK.cjs.map +1 -0
- package/Card-Ug-ttVSh.js +186 -0
- package/Card-Ug-ttVSh.js.map +1 -0
- package/Chip-OPYQ1uQ_.js +74 -0
- package/Chip-OPYQ1uQ_.js.map +1 -0
- package/Chip-qoJLDiva.cjs +73 -0
- package/Chip-qoJLDiva.cjs.map +1 -0
- package/DatePicker-8f_9bwhS.js +202 -0
- package/DatePicker-8f_9bwhS.js.map +1 -0
- package/DatePicker-DLSfkgGA.cjs +201 -0
- package/DatePicker-DLSfkgGA.cjs.map +1 -0
- package/DateRangePicker-BVpeJCHI.js +76 -0
- package/DateRangePicker-BVpeJCHI.js.map +1 -0
- package/DateRangePicker-B_hKQhbj.cjs +75 -0
- package/DateRangePicker-B_hKQhbj.cjs.map +1 -0
- package/DateTimePicker-CWNW09-O.cjs +220 -0
- package/DateTimePicker-CWNW09-O.cjs.map +1 -0
- package/DateTimePicker-D4L9GAod.js +221 -0
- package/DateTimePicker-D4L9GAod.js.map +1 -0
- package/Input-Cp911l23.js +174 -0
- package/Input-Cp911l23.js.map +1 -0
- package/Input-DI0jfq5X.cjs +173 -0
- package/Input-DI0jfq5X.cjs.map +1 -0
- package/Modal-Bm_HH9cv.cjs +319 -0
- package/Modal-Bm_HH9cv.cjs.map +1 -0
- package/Modal-Bnz6d9m9.js +320 -0
- package/Modal-Bnz6d9m9.js.map +1 -0
- package/RadioGroup-CxqDHap1.cjs +200 -0
- package/RadioGroup-CxqDHap1.cjs.map +1 -0
- package/RadioGroup-DMi9FvMP.js +201 -0
- package/RadioGroup-DMi9FvMP.js.map +1 -0
- package/Select-3CBOfM2H.js +447 -0
- package/Select-3CBOfM2H.js.map +1 -0
- package/Select-Bku4f4f8.cjs +446 -0
- package/Select-Bku4f4f8.cjs.map +1 -0
- package/Stat-BUcFCGrz.cjs +83 -0
- package/Stat-BUcFCGrz.cjs.map +1 -0
- package/Stat-C06A_izS.js +84 -0
- package/Stat-C06A_izS.js.map +1 -0
- package/StatusMessage-C5B6oGZ_.cjs +78 -0
- package/StatusMessage-C5B6oGZ_.cjs.map +1 -0
- package/StatusMessage-D1GlfQdz.js +79 -0
- package/StatusMessage-D1GlfQdz.js.map +1 -0
- package/Step-Dq0N72YB.js +49 -0
- package/Step-Dq0N72YB.js.map +1 -0
- package/Step-a8U8O-91.cjs +48 -0
- package/Step-a8U8O-91.cjs.map +1 -0
- package/Switch-BIeobv6i.cjs +179 -0
- package/Switch-BIeobv6i.cjs.map +1 -0
- package/Switch-DQEOxM2R.js +180 -0
- package/Switch-DQEOxM2R.js.map +1 -0
- package/Tab-Co31KY2k.cjs +95 -0
- package/Tab-Co31KY2k.cjs.map +1 -0
- package/Tab-DiK62gRz.js +96 -0
- package/Tab-DiK62gRz.js.map +1 -0
- package/Table-C2LbW0B1.js +531 -0
- package/Table-C2LbW0B1.js.map +1 -0
- package/Table-C4OM6rrC.cjs +530 -0
- package/Table-C4OM6rrC.cjs.map +1 -0
- package/components/AppBar/AppBar.cjs +1 -1
- package/components/AppBar/AppBar.js +1 -1
- package/components/Autocomplete/Autocomplete.cjs +4 -311
- package/components/Autocomplete/Autocomplete.cjs.map +1 -1
- package/components/Autocomplete/Autocomplete.js +4 -311
- package/components/Autocomplete/Autocomplete.js.map +1 -1
- package/components/Avatar/Avatar.cjs +2 -160
- package/components/Avatar/Avatar.cjs.map +1 -1
- package/components/Avatar/Avatar.js +2 -160
- package/components/Avatar/Avatar.js.map +1 -1
- package/components/Card/Card.cjs +7 -184
- package/components/Card/Card.cjs.map +1 -1
- package/components/Card/Card.js +7 -184
- package/components/Card/Card.js.map +1 -1
- package/components/Chip/Chip.cjs +2 -71
- package/components/Chip/Chip.cjs.map +1 -1
- package/components/Chip/Chip.js +2 -71
- package/components/Chip/Chip.js.map +1 -1
- package/components/Column/Column.cjs +1 -1
- package/components/Column/Column.cjs.map +1 -1
- package/components/Column/Column.d.ts +1 -1
- package/components/Column/Column.js +1 -1
- package/components/Column/Column.js.map +1 -1
- package/components/Column/index.d.ts +1 -0
- package/components/DatePicker/DatePicker.cjs +3 -200
- package/components/DatePicker/DatePicker.cjs.map +1 -1
- package/components/DatePicker/DatePicker.js +3 -200
- package/components/DatePicker/DatePicker.js.map +1 -1
- package/components/DateRangePicker/DateRangePicker.cjs +2 -73
- package/components/DateRangePicker/DateRangePicker.cjs.map +1 -1
- package/components/DateRangePicker/DateRangePicker.js +2 -73
- package/components/DateRangePicker/DateRangePicker.js.map +1 -1
- package/components/DateTimePicker/DateTimePicker.cjs +3 -219
- package/components/DateTimePicker/DateTimePicker.cjs.map +1 -1
- package/components/DateTimePicker/DateTimePicker.js +3 -219
- package/components/DateTimePicker/DateTimePicker.js.map +1 -1
- package/components/Drawer/Drawer.cjs +1 -1
- package/components/Drawer/Drawer.js +1 -1
- package/components/Input/Input.cjs +3 -172
- package/components/Input/Input.cjs.map +1 -1
- package/components/Input/Input.js +3 -172
- package/components/Input/Input.js.map +1 -1
- package/components/Modal/Modal.cjs +7 -317
- package/components/Modal/Modal.cjs.map +1 -1
- package/components/Modal/Modal.js +6 -316
- package/components/Modal/Modal.js.map +1 -1
- package/components/Modal/index.d.ts +2 -1
- package/components/Modal.d.ts +4 -0
- package/components/RadioGroup/RadioGroup.cjs +3 -199
- package/components/RadioGroup/RadioGroup.cjs.map +1 -1
- package/components/RadioGroup/RadioGroup.js +3 -199
- package/components/RadioGroup/RadioGroup.js.map +1 -1
- package/components/ScrollTopButton/ScrollTopButton.cjs +1 -1
- package/components/ScrollTopButton/ScrollTopButton.js +1 -1
- package/components/Select/Select.cjs +4 -445
- package/components/Select/Select.cjs.map +1 -1
- package/components/Select/Select.js +4 -445
- package/components/Select/Select.js.map +1 -1
- package/components/Stat/Stat.cjs +2 -81
- package/components/Stat/Stat.cjs.map +1 -1
- package/components/Stat/Stat.js +2 -81
- package/components/Stat/Stat.js.map +1 -1
- package/components/StatusMessage/StatusMessage.cjs +4 -77
- package/components/StatusMessage/StatusMessage.cjs.map +1 -1
- package/components/StatusMessage/StatusMessage.d.ts +1 -1
- package/components/StatusMessage/StatusMessage.js +3 -76
- package/components/StatusMessage/StatusMessage.js.map +1 -1
- package/components/StatusMessage/index.d.ts +2 -1
- package/components/StatusMessage.d.ts +4 -0
- package/components/Stepper/Stepper.cjs +3 -46
- package/components/Stepper/Stepper.cjs.map +1 -1
- package/components/Stepper/Stepper.js +3 -46
- package/components/Stepper/Stepper.js.map +1 -1
- package/components/Switch/Switch.cjs +3 -178
- package/components/Switch/Switch.cjs.map +1 -1
- package/components/Switch/Switch.js +3 -178
- package/components/Switch/Switch.js.map +1 -1
- package/components/Table/Table.cjs +2 -528
- package/components/Table/Table.cjs.map +1 -1
- package/components/Table/Table.d.ts +1 -1
- package/components/Table/Table.js +2 -528
- package/components/Table/Table.js.map +1 -1
- package/components/Tabs/Tabs.cjs +3 -93
- package/components/Tabs/Tabs.cjs.map +1 -1
- package/components/Tabs/Tabs.js +3 -93
- package/components/Tabs/Tabs.js.map +1 -1
- package/hooks/Wizard/WizardContext.d.ts +2 -2
- package/index.cjs +46 -1
- package/index.cjs.map +1 -1
- package/index.d.ts +30 -0
- package/index.js +46 -1
- package/index.js.map +1 -1
- package/package.json +5 -3
- package/{resolvePreset-CT3kU-K2.cjs → resolvePreset-CxTI6_Ln.cjs} +3 -3
- package/{resolvePreset-CT3kU-K2.cjs.map → resolvePreset-CxTI6_Ln.cjs.map} +1 -1
- package/{resolvePreset-B-IB0ehH.js → resolvePreset-K6_BfWHD.js} +3 -3
- package/{resolvePreset-B-IB0ehH.js.map → resolvePreset-K6_BfWHD.js.map} +1 -1
- package/useWizard-CWdIxZzX.cjs.map +1 -1
- package/useWizard-CWq--C3o.js.map +1 -1
|
@@ -0,0 +1,221 @@
|
|
|
1
|
+
var __defProp = Object.defineProperty;
|
|
2
|
+
var __defProps = Object.defineProperties;
|
|
3
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
4
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
7
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
8
|
+
var __spreadValues = (a, b) => {
|
|
9
|
+
for (var prop in b || (b = {}))
|
|
10
|
+
if (__hasOwnProp.call(b, prop))
|
|
11
|
+
__defNormalProp(a, prop, b[prop]);
|
|
12
|
+
if (__getOwnPropSymbols)
|
|
13
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
14
|
+
if (__propIsEnum.call(b, prop))
|
|
15
|
+
__defNormalProp(a, prop, b[prop]);
|
|
16
|
+
}
|
|
17
|
+
return a;
|
|
18
|
+
};
|
|
19
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
20
|
+
var __objRest = (source, exclude) => {
|
|
21
|
+
var target = {};
|
|
22
|
+
for (var prop in source)
|
|
23
|
+
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
24
|
+
target[prop] = source[prop];
|
|
25
|
+
if (source != null && __getOwnPropSymbols)
|
|
26
|
+
for (var prop of __getOwnPropSymbols(source)) {
|
|
27
|
+
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
28
|
+
target[prop] = source[prop];
|
|
29
|
+
}
|
|
30
|
+
return target;
|
|
31
|
+
};
|
|
32
|
+
import { jsx } from "react/jsx-runtime";
|
|
33
|
+
import React__default, { useMemo } from "react";
|
|
34
|
+
import { useTheme } from "@mui/material/styles";
|
|
35
|
+
import { AdapterDayjs } from "@mui/x-date-pickers/AdapterDayjs";
|
|
36
|
+
import { LocalizationProvider } from "@mui/x-date-pickers/LocalizationProvider";
|
|
37
|
+
import { DateTimePicker as DateTimePicker$1 } from "@mui/x-date-pickers/DateTimePicker";
|
|
38
|
+
import { Controller } from "react-hook-form";
|
|
39
|
+
import { b as buildFormFieldSx, F as FIELD_INPUT_PADDING_Y } from "./formField.sx-DfVbMe0V.js";
|
|
40
|
+
import { r as resolvePreset } from "./resolvePreset-K6_BfWHD.js";
|
|
41
|
+
const buildDateTimePickerSx = (borderRadius, labelPosition) => buildFormFieldSx({
|
|
42
|
+
borderRadius,
|
|
43
|
+
labelPosition,
|
|
44
|
+
includePickersApi: true,
|
|
45
|
+
extraOutsideSx: {
|
|
46
|
+
"& .MuiInputBase-input": {
|
|
47
|
+
paddingTop: FIELD_INPUT_PADDING_Y,
|
|
48
|
+
paddingBottom: FIELD_INPUT_PADDING_Y
|
|
49
|
+
},
|
|
50
|
+
"& .MuiPickersInputBase-sectionsContainer": {
|
|
51
|
+
paddingTop: FIELD_INPUT_PADDING_Y,
|
|
52
|
+
paddingBottom: FIELD_INPUT_PADDING_Y
|
|
53
|
+
}
|
|
54
|
+
}
|
|
55
|
+
});
|
|
56
|
+
const getDateTimeValidationMessage = (error) => {
|
|
57
|
+
switch (error) {
|
|
58
|
+
case "minDate":
|
|
59
|
+
case "maxDate":
|
|
60
|
+
case "invalidDate":
|
|
61
|
+
return "Formato de fecha/hora inválido";
|
|
62
|
+
case "disableFuture":
|
|
63
|
+
return "No se permiten fechas/horas futuras";
|
|
64
|
+
case "disablePast":
|
|
65
|
+
return "No se permiten fechas/horas pasadas";
|
|
66
|
+
default:
|
|
67
|
+
return "";
|
|
68
|
+
}
|
|
69
|
+
};
|
|
70
|
+
const buildLocaleText = (clearButtonText, cancelButtonText, acceptButtonText) => {
|
|
71
|
+
const text = {};
|
|
72
|
+
if (clearButtonText) text.clearButtonLabel = clearButtonText;
|
|
73
|
+
if (cancelButtonText) text.cancelButtonLabel = cancelButtonText;
|
|
74
|
+
if (acceptButtonText) text.okButtonLabel = acceptButtonText;
|
|
75
|
+
return text;
|
|
76
|
+
};
|
|
77
|
+
const DateTimePicker = (props) => {
|
|
78
|
+
const _a = props, {
|
|
79
|
+
label,
|
|
80
|
+
minDateTime,
|
|
81
|
+
maxDateTime,
|
|
82
|
+
disabled,
|
|
83
|
+
readOnly,
|
|
84
|
+
inputFormat,
|
|
85
|
+
borderRadius = 10,
|
|
86
|
+
labelPosition = "outside",
|
|
87
|
+
size = "small",
|
|
88
|
+
helperText,
|
|
89
|
+
error: errorProp,
|
|
90
|
+
sx,
|
|
91
|
+
className,
|
|
92
|
+
preset,
|
|
93
|
+
adapterLocale,
|
|
94
|
+
clearButtonText,
|
|
95
|
+
cancelButtonText,
|
|
96
|
+
acceptButtonText,
|
|
97
|
+
minutesStep,
|
|
98
|
+
minTime,
|
|
99
|
+
customClass,
|
|
100
|
+
viewRenderers,
|
|
101
|
+
timeSteps,
|
|
102
|
+
ampm = false,
|
|
103
|
+
textFieldProps,
|
|
104
|
+
slotProps: slotPropsProp
|
|
105
|
+
} = _a, rest = __objRest(_a, [
|
|
106
|
+
"label",
|
|
107
|
+
"minDateTime",
|
|
108
|
+
"maxDateTime",
|
|
109
|
+
"disabled",
|
|
110
|
+
"readOnly",
|
|
111
|
+
"inputFormat",
|
|
112
|
+
"borderRadius",
|
|
113
|
+
"labelPosition",
|
|
114
|
+
"size",
|
|
115
|
+
"helperText",
|
|
116
|
+
"error",
|
|
117
|
+
"sx",
|
|
118
|
+
"className",
|
|
119
|
+
"preset",
|
|
120
|
+
"adapterLocale",
|
|
121
|
+
"clearButtonText",
|
|
122
|
+
"cancelButtonText",
|
|
123
|
+
"acceptButtonText",
|
|
124
|
+
"minutesStep",
|
|
125
|
+
"minTime",
|
|
126
|
+
"customClass",
|
|
127
|
+
"viewRenderers",
|
|
128
|
+
"timeSteps",
|
|
129
|
+
"ampm",
|
|
130
|
+
"textFieldProps",
|
|
131
|
+
"slotProps"
|
|
132
|
+
]);
|
|
133
|
+
const [validationError, setValidationError] = React__default.useState(null);
|
|
134
|
+
const validationErrorMessage = useMemo(
|
|
135
|
+
() => getDateTimeValidationMessage(validationError),
|
|
136
|
+
[validationError]
|
|
137
|
+
);
|
|
138
|
+
const customLocaleText = useMemo(
|
|
139
|
+
() => buildLocaleText(clearButtonText, cancelButtonText, acceptButtonText),
|
|
140
|
+
[clearButtonText, cancelButtonText, acceptButtonText]
|
|
141
|
+
);
|
|
142
|
+
const theme = useTheme();
|
|
143
|
+
const presetSx = resolvePreset("DateTimePicker", preset, theme);
|
|
144
|
+
const mergedSx = [
|
|
145
|
+
buildDateTimePickerSx(borderRadius, labelPosition),
|
|
146
|
+
...presetSx ? [presetSx] : [],
|
|
147
|
+
...Array.isArray(sx) ? sx : [sx]
|
|
148
|
+
];
|
|
149
|
+
const renderPicker = (value, onChange, onBlur, inputRef, rhfError, rhfHelperText) => {
|
|
150
|
+
const finalError = rhfError || !!validationErrorMessage || !!errorProp;
|
|
151
|
+
const finalHelperText = rhfHelperText || validationErrorMessage || helperText;
|
|
152
|
+
return /* @__PURE__ */ jsx(
|
|
153
|
+
LocalizationProvider,
|
|
154
|
+
__spreadProps(__spreadValues({
|
|
155
|
+
dateAdapter: AdapterDayjs
|
|
156
|
+
}, adapterLocale ? { adapterLocale } : {}), {
|
|
157
|
+
children: /* @__PURE__ */ jsx(
|
|
158
|
+
DateTimePicker$1,
|
|
159
|
+
__spreadValues({
|
|
160
|
+
className: customClass || className,
|
|
161
|
+
label,
|
|
162
|
+
value,
|
|
163
|
+
onChange,
|
|
164
|
+
onError: setValidationError,
|
|
165
|
+
minDateTime,
|
|
166
|
+
maxDateTime,
|
|
167
|
+
minutesStep,
|
|
168
|
+
disabled,
|
|
169
|
+
readOnly,
|
|
170
|
+
minTime,
|
|
171
|
+
format: inputFormat != null ? inputFormat : "DD/MM/YYYY HH:mm",
|
|
172
|
+
viewRenderers,
|
|
173
|
+
timeSteps,
|
|
174
|
+
ampm,
|
|
175
|
+
sx: mergedSx,
|
|
176
|
+
slotProps: __spreadProps(__spreadValues({}, slotPropsProp), {
|
|
177
|
+
textField: __spreadValues(__spreadValues({
|
|
178
|
+
fullWidth: true,
|
|
179
|
+
size,
|
|
180
|
+
variant: "outlined",
|
|
181
|
+
onBlur,
|
|
182
|
+
inputRef,
|
|
183
|
+
error: !!finalError,
|
|
184
|
+
helperText: finalHelperText
|
|
185
|
+
}, slotPropsProp == null ? void 0 : slotPropsProp.textField), textFieldProps)
|
|
186
|
+
}),
|
|
187
|
+
localeText: customLocaleText
|
|
188
|
+
}, rest)
|
|
189
|
+
)
|
|
190
|
+
})
|
|
191
|
+
);
|
|
192
|
+
};
|
|
193
|
+
if ("control" in props && props.control) {
|
|
194
|
+
const { name, control, validation } = props;
|
|
195
|
+
return /* @__PURE__ */ jsx(
|
|
196
|
+
Controller,
|
|
197
|
+
{
|
|
198
|
+
name,
|
|
199
|
+
control,
|
|
200
|
+
rules: validation,
|
|
201
|
+
render: ({ field, fieldState: { error: fieldError } }) => {
|
|
202
|
+
var _a2;
|
|
203
|
+
return renderPicker(
|
|
204
|
+
(_a2 = field.value) != null ? _a2 : null,
|
|
205
|
+
field.onChange,
|
|
206
|
+
field.onBlur,
|
|
207
|
+
field.ref,
|
|
208
|
+
!!fieldError,
|
|
209
|
+
fieldError == null ? void 0 : fieldError.message
|
|
210
|
+
);
|
|
211
|
+
}
|
|
212
|
+
}
|
|
213
|
+
);
|
|
214
|
+
}
|
|
215
|
+
const { selectedDateTime, onDateTimeChange } = props;
|
|
216
|
+
return renderPicker(selectedDateTime, onDateTimeChange);
|
|
217
|
+
};
|
|
218
|
+
export {
|
|
219
|
+
DateTimePicker as D
|
|
220
|
+
};
|
|
221
|
+
//# sourceMappingURL=DateTimePicker-D4L9GAod.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"DateTimePicker-D4L9GAod.js","sources":["../src/components/DateTimePicker/DateTimePicker.sx.ts","../src/components/DateTimePicker/DateTimePicker.helpers.ts","../src/components/DateTimePicker/DateTimePicker.tsx"],"sourcesContent":["import type { SxProps, Theme } from '@mui/material';\n\nimport { buildFormFieldSx } from '../_shared/formField.sx';\nimport { FIELD_INPUT_PADDING_Y } from '../../theme/tokens';\nimport type { LabelPosition } from './DateTimePicker';\n\n/**\n * Builder de sx para el DateTimePicker. Mismo patrón que DatePicker.\n * Usa `includePickersApi: true` para soportar la API nueva de MUI X v8.\n */\nexport const buildDateTimePickerSx = (\n borderRadius: number | string,\n labelPosition: LabelPosition,\n): SxProps<Theme> =>\n buildFormFieldSx({\n borderRadius,\n labelPosition,\n includePickersApi: true,\n extraOutsideSx: {\n '& .MuiInputBase-input': {\n paddingTop: FIELD_INPUT_PADDING_Y,\n paddingBottom: FIELD_INPUT_PADDING_Y,\n },\n\n '& .MuiPickersInputBase-sectionsContainer': {\n paddingTop: FIELD_INPUT_PADDING_Y,\n paddingBottom: FIELD_INPUT_PADDING_Y,\n },\n },\n });\n","import type { DateValidationError } from '@mui/x-date-pickers/models';\n\n/**\n * Traduce el error del DateTimePicker a un mensaje en español. Se usa\n * internamente para poblar `helperText` cuando hay error de validación.\n */\nexport const getDateTimeValidationMessage = (\n error: DateValidationError | null,\n): string => {\n switch (error) {\n case 'minDate':\n case 'maxDate':\n case 'invalidDate':\n return 'Formato de fecha/hora inválido';\n case 'disableFuture':\n return 'No se permiten fechas/horas futuras';\n case 'disablePast':\n return 'No se permiten fechas/horas pasadas';\n default:\n return '';\n }\n};\n\n/**\n * Construye el `localeText` que MUI acepta para overridear los labels de los\n * botones del popover (Cancel / OK / Clear).\n */\nexport const buildLocaleText = (\n clearButtonText?: string,\n cancelButtonText?: string,\n acceptButtonText?: string,\n): Record<string, string> => {\n const text: Record<string, string> = {};\n if (clearButtonText) text.clearButtonLabel = clearButtonText;\n if (cancelButtonText) text.cancelButtonLabel = cancelButtonText;\n if (acceptButtonText) text.okButtonLabel = acceptButtonText;\n return text;\n};\n","import React, { useMemo } from 'react';\nimport type { SxProps, Theme } from '@mui/material';\nimport { useTheme } from '@mui/material/styles';\nimport { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs';\nimport { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider';\nimport {\n DateTimePicker as MuiDateTimePicker,\n type DateTimePickerProps as MuiDateTimePickerProps,\n} from '@mui/x-date-pickers/DateTimePicker';\nimport { DateValidationError } from '@mui/x-date-pickers/models';\nimport { Dayjs } from 'dayjs';\nimport { Controller, type Control, type RegisterOptions } from 'react-hook-form';\n\nimport { buildDateTimePickerSx } from './DateTimePicker.sx';\nimport {\n buildLocaleText,\n getDateTimeValidationMessage,\n} from './DateTimePicker.helpers';\nimport { resolvePreset } from '../_shared/resolvePreset';\n\n// ── Tipos de dominio ─────────────────────────────────────────────────────\nexport type LabelPosition = 'outside' | 'floating';\nexport type DateTimePickerSize = 'small' | 'medium';\n\n// ── Props base ───────────────────────────────────────────────────────────\nexport interface BaseDateTimePickerProps\n extends Omit<MuiDateTimePickerProps, 'value' | 'onChange' | 'slotProps' | 'format'> {\n label?: string;\n minDateTime?: Dayjs;\n maxDateTime?: Dayjs;\n disabled?: boolean;\n readOnly?: boolean;\n /** Formato de la fecha/hora. Default: 'DD/MM/YYYY HH:mm'. */\n inputFormat?: string;\n /** Border radius del input. Default: 10. */\n borderRadius?: number | string;\n /** \"outside\" (default) o \"floating\". */\n labelPosition?: LabelPosition;\n /** Tamaño del TextField. Default: 'small'. */\n size?: DateTimePickerSize;\n helperText?: string;\n error?: boolean;\n sx?: SxProps<Theme>;\n className?: string;\n /**\n * Nombre del preset de estilo registrado en `theme.styles.DateTimePicker`.\n * - `\"default\"` (o ausente) = estilo built-in del paquete.\n * - Cualquier otro string = mergea el preset encima del estilo built-in.\n */\n preset?: string;\n /** Locale del adaptador dayjs. */\n adapterLocale?: string;\n /** Textos de los botones del popover. */\n clearButtonText?: string;\n cancelButtonText?: string;\n acceptButtonText?: string;\n minutesStep?: number;\n minTime?: Dayjs;\n customClass?: string;\n viewRenderers?: any;\n timeSteps?: any;\n /** Si es true usa formato 12h, false = 24h. Default: false. */\n ampm?: boolean;\n textFieldProps?: Record<string, any>;\n /** Passthrough completo a slotProps del MuiDateTimePicker. */\n slotProps?: MuiDateTimePickerProps['slotProps'];\n}\n\n// ── Variantes discriminadas (RHF vs controlado) ──────────────────────────\nexport interface RHFDateTimePickerProps extends BaseDateTimePickerProps {\n name: string;\n control: Control<any>;\n validation?: RegisterOptions;\n selectedDateTime?: never;\n onDateTimeChange?: never;\n}\n\nexport interface ControlledDateTimePickerProps extends BaseDateTimePickerProps {\n name?: string;\n control?: never;\n validation?: never;\n selectedDateTime: Dayjs | null;\n onDateTimeChange: (dateTime: Dayjs | null) => void;\n}\n\n// ── API pública final ────────────────────────────────────────────────────\nexport type DateTimePickerProps =\n | RHFDateTimePickerProps\n | ControlledDateTimePickerProps;\n\nexport const DateTimePicker: React.FC<DateTimePickerProps> = (props) => {\n const {\n label,\n minDateTime,\n maxDateTime,\n disabled,\n readOnly,\n inputFormat,\n borderRadius = 10,\n labelPosition = 'outside',\n size = 'small',\n helperText,\n error: errorProp,\n sx,\n className,\n preset,\n adapterLocale,\n clearButtonText,\n cancelButtonText,\n acceptButtonText,\n minutesStep,\n minTime,\n customClass,\n viewRenderers,\n timeSteps,\n ampm = false,\n textFieldProps,\n slotProps: slotPropsProp,\n ...rest\n } = props as ControlledDateTimePickerProps & {\n control?: Control<any>;\n validation?: RegisterOptions;\n };\n\n const [validationError, setValidationError] = React.useState<DateValidationError | null>(null);\n\n const validationErrorMessage = useMemo(\n () => getDateTimeValidationMessage(validationError),\n [validationError],\n );\n\n const customLocaleText = useMemo(\n () => buildLocaleText(clearButtonText, cancelButtonText, acceptButtonText),\n [clearButtonText, cancelButtonText, acceptButtonText],\n );\n\n const theme = useTheme();\n const presetSx = resolvePreset('DateTimePicker', preset, theme);\n\n const mergedSx = [\n buildDateTimePickerSx(borderRadius, labelPosition),\n ...(presetSx ? [presetSx] : []),\n ...(Array.isArray(sx) ? sx : [sx]),\n ];\n\n const renderPicker = (\n value: Dayjs | null,\n onChange: (date: Dayjs | null) => void,\n onBlur?: () => void,\n inputRef?: React.Ref<any>,\n rhfError?: boolean,\n rhfHelperText?: string,\n ) => {\n const finalError = rhfError || !!validationErrorMessage || !!errorProp;\n const finalHelperText = rhfHelperText || validationErrorMessage || helperText;\n\n return (\n <LocalizationProvider\n dateAdapter={AdapterDayjs}\n {...(adapterLocale ? { adapterLocale } : {})}\n >\n <MuiDateTimePicker\n className={customClass || className}\n label={label}\n value={value}\n onChange={onChange}\n onError={setValidationError}\n minDateTime={minDateTime}\n maxDateTime={maxDateTime}\n minutesStep={minutesStep}\n disabled={disabled}\n readOnly={readOnly}\n minTime={minTime}\n format={inputFormat ?? 'DD/MM/YYYY HH:mm'}\n viewRenderers={viewRenderers}\n timeSteps={timeSteps}\n ampm={ampm}\n sx={mergedSx}\n slotProps={{\n ...slotPropsProp,\n textField: {\n fullWidth: true,\n size,\n variant: 'outlined',\n onBlur,\n inputRef,\n error: !!finalError,\n helperText: finalHelperText,\n ...(slotPropsProp?.textField as Record<string, any> | undefined),\n ...textFieldProps,\n } as any,\n }}\n localeText={customLocaleText}\n {...(rest as any)}\n />\n </LocalizationProvider>\n );\n };\n\n if ('control' in props && props.control) {\n const { name, control, validation } = props as RHFDateTimePickerProps;\n return (\n <Controller\n name={name}\n control={control}\n rules={validation}\n render={({ field, fieldState: { error: fieldError } }) =>\n renderPicker(\n field.value ?? null,\n field.onChange,\n field.onBlur,\n field.ref,\n !!fieldError,\n fieldError?.message,\n )\n }\n />\n );\n }\n\n const { selectedDateTime, onDateTimeChange } = props as ControlledDateTimePickerProps;\n return renderPicker(selectedDateTime, onDateTimeChange);\n};\n\nexport default DateTimePicker;\n"],"names":["React","MuiDateTimePicker","_a"],"mappings":"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"}
|
|
@@ -0,0 +1,174 @@
|
|
|
1
|
+
var __defProp = Object.defineProperty;
|
|
2
|
+
var __defProps = Object.defineProperties;
|
|
3
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
4
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
7
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
8
|
+
var __spreadValues = (a, b) => {
|
|
9
|
+
for (var prop in b || (b = {}))
|
|
10
|
+
if (__hasOwnProp.call(b, prop))
|
|
11
|
+
__defNormalProp(a, prop, b[prop]);
|
|
12
|
+
if (__getOwnPropSymbols)
|
|
13
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
14
|
+
if (__propIsEnum.call(b, prop))
|
|
15
|
+
__defNormalProp(a, prop, b[prop]);
|
|
16
|
+
}
|
|
17
|
+
return a;
|
|
18
|
+
};
|
|
19
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
20
|
+
var __objRest = (source, exclude) => {
|
|
21
|
+
var target = {};
|
|
22
|
+
for (var prop in source)
|
|
23
|
+
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
24
|
+
target[prop] = source[prop];
|
|
25
|
+
if (source != null && __getOwnPropSymbols)
|
|
26
|
+
for (var prop of __getOwnPropSymbols(source)) {
|
|
27
|
+
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
28
|
+
target[prop] = source[prop];
|
|
29
|
+
}
|
|
30
|
+
return target;
|
|
31
|
+
};
|
|
32
|
+
import { jsx } from "react/jsx-runtime";
|
|
33
|
+
import { TextField } from "@mui/material";
|
|
34
|
+
import { useTheme } from "@mui/material/styles";
|
|
35
|
+
import { Controller } from "react-hook-form";
|
|
36
|
+
import { b as buildFormFieldSx, F as FIELD_INPUT_PADDING_Y } from "./formField.sx-DfVbMe0V.js";
|
|
37
|
+
import { r as resolvePreset } from "./resolvePreset-K6_BfWHD.js";
|
|
38
|
+
const parseValue = (raw, type) => {
|
|
39
|
+
if (type !== "number") return raw;
|
|
40
|
+
if (raw === "" || raw === "-") return raw;
|
|
41
|
+
const n = parseFloat(raw);
|
|
42
|
+
return isNaN(n) ? raw : n;
|
|
43
|
+
};
|
|
44
|
+
const buildSlotProps = (type, min, max, customSlotProps, customInputProps, _labelPosition, readOnly) => {
|
|
45
|
+
const numberAttrs = type === "number" ? __spreadValues({ min: min != null ? min : Number.NEGATIVE_INFINITY }, max !== void 0 && { max }) : {};
|
|
46
|
+
return __spreadProps(__spreadValues({}, customSlotProps), {
|
|
47
|
+
htmlInput: __spreadValues(__spreadValues(__spreadValues(__spreadValues({}, customInputProps), customSlotProps == null ? void 0 : customSlotProps.htmlInput), numberAttrs), readOnly && { readOnly: true }),
|
|
48
|
+
// Dejamos que MUI maneje el shrink nativamente (animación inside → up).
|
|
49
|
+
// El consumidor puede forzar shrink con slotProps.inputLabel.shrink=true si lo necesita.
|
|
50
|
+
inputLabel: __spreadValues({}, customSlotProps == null ? void 0 : customSlotProps.inputLabel)
|
|
51
|
+
});
|
|
52
|
+
};
|
|
53
|
+
const buildInputSx = (borderRadius, labelPosition) => {
|
|
54
|
+
const radius = typeof borderRadius === "number" ? `${borderRadius}px` : borderRadius;
|
|
55
|
+
return buildFormFieldSx({
|
|
56
|
+
borderRadius,
|
|
57
|
+
labelPosition,
|
|
58
|
+
extraOutsideSx: {
|
|
59
|
+
"& .MuiInputBase-input": {
|
|
60
|
+
paddingTop: FIELD_INPUT_PADDING_Y,
|
|
61
|
+
paddingBottom: FIELD_INPUT_PADDING_Y
|
|
62
|
+
},
|
|
63
|
+
// Filled: quitar el padding-top reservado para el label flotante dentro.
|
|
64
|
+
"& .MuiFilledInput-root": {
|
|
65
|
+
paddingTop: 0,
|
|
66
|
+
borderRadius: `${radius} ${radius} 0 0`
|
|
67
|
+
},
|
|
68
|
+
"& .MuiFilledInput-input": {
|
|
69
|
+
paddingTop: FIELD_INPUT_PADDING_Y
|
|
70
|
+
},
|
|
71
|
+
// Standard: quitar el margin-top reservado para el label flotante.
|
|
72
|
+
"& .MuiInput-root": {
|
|
73
|
+
marginTop: 0
|
|
74
|
+
}
|
|
75
|
+
}
|
|
76
|
+
});
|
|
77
|
+
};
|
|
78
|
+
const Input = (props) => {
|
|
79
|
+
const _a = props, {
|
|
80
|
+
type = "text",
|
|
81
|
+
variant = "outlined",
|
|
82
|
+
size = "small",
|
|
83
|
+
borderRadius = 10,
|
|
84
|
+
labelPosition = "outside",
|
|
85
|
+
preset,
|
|
86
|
+
min,
|
|
87
|
+
max,
|
|
88
|
+
readOnly,
|
|
89
|
+
inputProps,
|
|
90
|
+
slotProps,
|
|
91
|
+
sx
|
|
92
|
+
} = _a, rest = __objRest(_a, [
|
|
93
|
+
"type",
|
|
94
|
+
"variant",
|
|
95
|
+
"size",
|
|
96
|
+
"borderRadius",
|
|
97
|
+
"labelPosition",
|
|
98
|
+
"preset",
|
|
99
|
+
"min",
|
|
100
|
+
"max",
|
|
101
|
+
"readOnly",
|
|
102
|
+
"inputProps",
|
|
103
|
+
"slotProps",
|
|
104
|
+
"sx"
|
|
105
|
+
]);
|
|
106
|
+
const theme = useTheme();
|
|
107
|
+
const presetSx = resolvePreset("Input", preset, theme);
|
|
108
|
+
const finalSlotProps = buildSlotProps(
|
|
109
|
+
type,
|
|
110
|
+
min,
|
|
111
|
+
max,
|
|
112
|
+
slotProps,
|
|
113
|
+
inputProps,
|
|
114
|
+
labelPosition,
|
|
115
|
+
readOnly
|
|
116
|
+
);
|
|
117
|
+
const mergedSx = [
|
|
118
|
+
buildInputSx(borderRadius, labelPosition),
|
|
119
|
+
...presetSx ? [presetSx] : [],
|
|
120
|
+
...Array.isArray(sx) ? sx : [sx]
|
|
121
|
+
];
|
|
122
|
+
if ("control" in props && props.control) {
|
|
123
|
+
const { name, control, validation } = props;
|
|
124
|
+
return /* @__PURE__ */ jsx(
|
|
125
|
+
Controller,
|
|
126
|
+
{
|
|
127
|
+
name,
|
|
128
|
+
control,
|
|
129
|
+
rules: validation,
|
|
130
|
+
render: ({ field, fieldState: { error } }) => {
|
|
131
|
+
var _a2, _b;
|
|
132
|
+
return /* @__PURE__ */ jsx(
|
|
133
|
+
TextField,
|
|
134
|
+
__spreadProps(__spreadValues({
|
|
135
|
+
fullWidth: true
|
|
136
|
+
}, rest), {
|
|
137
|
+
name: field.name,
|
|
138
|
+
value: (_a2 = field.value) != null ? _a2 : "",
|
|
139
|
+
onChange: (e) => field.onChange(parseValue(e.target.value, type)),
|
|
140
|
+
onBlur: field.onBlur,
|
|
141
|
+
inputRef: field.ref,
|
|
142
|
+
type,
|
|
143
|
+
variant,
|
|
144
|
+
size,
|
|
145
|
+
slotProps: finalSlotProps,
|
|
146
|
+
sx: mergedSx,
|
|
147
|
+
error: !!error || rest.error,
|
|
148
|
+
helperText: (_b = error == null ? void 0 : error.message) != null ? _b : rest.helperText
|
|
149
|
+
})
|
|
150
|
+
);
|
|
151
|
+
}
|
|
152
|
+
}
|
|
153
|
+
);
|
|
154
|
+
}
|
|
155
|
+
const { value, onChange } = props;
|
|
156
|
+
return /* @__PURE__ */ jsx(
|
|
157
|
+
TextField,
|
|
158
|
+
__spreadProps(__spreadValues({
|
|
159
|
+
fullWidth: true
|
|
160
|
+
}, rest), {
|
|
161
|
+
value: value != null ? value : "",
|
|
162
|
+
onChange: (e) => onChange(parseValue(e.target.value, type)),
|
|
163
|
+
type,
|
|
164
|
+
variant,
|
|
165
|
+
size,
|
|
166
|
+
slotProps: finalSlotProps,
|
|
167
|
+
sx: mergedSx
|
|
168
|
+
})
|
|
169
|
+
);
|
|
170
|
+
};
|
|
171
|
+
export {
|
|
172
|
+
Input as I
|
|
173
|
+
};
|
|
174
|
+
//# sourceMappingURL=Input-Cp911l23.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Input-Cp911l23.js","sources":["../src/components/Input/Input.helpers.ts","../src/components/Input/Input.sx.ts","../src/components/Input/Input.tsx"],"sourcesContent":["import type { InputHTMLAttributes } from 'react';\nimport type { TextFieldProps } from '@mui/material';\nimport type { InputType, LabelPosition } from './Input';\n\n/**\n * Convierte el valor raw del evento al tipo apropiado.\n * Para type=\"number\" intenta parsear a número; si falla, devuelve el raw\n * (permite estados intermedios como \"\" o \"-\" mientras el usuario tipea).\n */\nexport const parseValue = (raw: string, type: InputType): string | number => {\n if (type !== 'number') return raw;\n if (raw === '' || raw === '-') return raw;\n const n = parseFloat(raw);\n return isNaN(n) ? raw : n;\n};\n\n/**\n * Construye los slotProps del TextField consolidando htmlInput + inputLabel.\n * Maneja los atributos min/max cuando type=\"number\" y readOnly.\n */\nexport const buildSlotProps = (\n type: InputType,\n min: number | undefined,\n max: number | undefined,\n customSlotProps: TextFieldProps['slotProps'],\n customInputProps: InputHTMLAttributes<HTMLInputElement> | undefined,\n _labelPosition: LabelPosition,\n readOnly?: boolean,\n): TextFieldProps['slotProps'] => {\n const numberAttrs =\n type === 'number'\n ? { min: min ?? Number.NEGATIVE_INFINITY, ...(max !== undefined && { max }) }\n : {};\n\n return {\n ...customSlotProps,\n htmlInput: {\n ...customInputProps,\n ...(customSlotProps as any)?.htmlInput,\n ...numberAttrs,\n ...(readOnly && { readOnly: true }),\n },\n // Dejamos que MUI maneje el shrink nativamente (animación inside → up).\n // El consumidor puede forzar shrink con slotProps.inputLabel.shrink=true si lo necesita.\n inputLabel: {\n ...(customSlotProps as any)?.inputLabel,\n },\n };\n};\n","import type { TextFieldProps } from '@mui/material';\n\nimport { buildFormFieldSx } from '../_shared/formField.sx';\nimport { FIELD_INPUT_PADDING_Y } from '../../theme/tokens';\nimport type { LabelPosition } from './Input';\n\n/**\n * Builder de sx para el Input. Usa el builder compartido\n * `buildFormFieldSx` y añade overrides específicos de TextField\n * (padding del input base, filled, standard).\n */\nexport const buildInputSx = (\n borderRadius: number | string,\n labelPosition: LabelPosition,\n): TextFieldProps['sx'] => {\n const radius = typeof borderRadius === 'number' ? `${borderRadius}px` : borderRadius;\n\n return buildFormFieldSx({\n borderRadius,\n labelPosition,\n extraOutsideSx: {\n '& .MuiInputBase-input': {\n paddingTop: FIELD_INPUT_PADDING_Y,\n paddingBottom: FIELD_INPUT_PADDING_Y,\n },\n\n // Filled: quitar el padding-top reservado para el label flotante dentro.\n '& .MuiFilledInput-root': {\n paddingTop: 0,\n borderRadius: `${radius} ${radius} 0 0`,\n },\n '& .MuiFilledInput-input': {\n paddingTop: FIELD_INPUT_PADDING_Y,\n },\n\n // Standard: quitar el margin-top reservado para el label flotante.\n '& .MuiInput-root': {\n marginTop: 0,\n },\n },\n });\n};\n","import { TextField, type TextFieldProps } from '@mui/material';\nimport { useTheme } from '@mui/material/styles';\nimport { Controller, type Control, type RegisterOptions } from 'react-hook-form';\n\nimport { parseValue, buildSlotProps } from './Input.helpers';\nimport { buildInputSx } from './Input.sx';\nimport { resolvePreset } from '../_shared/resolvePreset';\n\n// ── Tipos de dominio ─────────────────────────────────────────────────────\nexport type InputType =\n | 'text' | 'number' | 'email' | 'password' | 'tel'\n | 'url' | 'search' | 'date' | 'datetime-local'\n | 'month' | 'week' | 'time' | 'color';\n\nexport type LabelPosition = 'outside' | 'floating';\n\n// ── Props base (todo lo común entre RHF y controlado) ────────────────────\nexport interface BaseInputProps\n extends Omit<TextFieldProps, 'value' | 'onChange' | 'type'> {\n type?: InputType;\n min?: number;\n max?: number;\n /** Border radius del input. Default: 10 */\n borderRadius?: number | string;\n /** \"outside\" = label arriba del campo (default). \"floating\" = label clásico MUI dentro del borde */\n labelPosition?: LabelPosition;\n readOnly?: boolean;\n /**\n * Nombre del preset de estilo registrado en `theme.styles.Input`.\n * - `\"default\"` (o ausente) = estilo built-in del paquete.\n * - Cualquier otro string = mergea el preset encima del estilo built-in.\n */\n preset?: string;\n}\n\n// ── Variantes discriminadas (RHF vs controlado) ──────────────────────────\nexport interface RHFInputProps extends BaseInputProps {\n name: string;\n control: Control<any>;\n validation?: RegisterOptions;\n value?: never;\n onChange?: never;\n}\n\nexport interface ControlledInputProps extends BaseInputProps {\n name?: string;\n control?: never;\n validation?: never;\n value: string | number;\n onChange: (value: string | number) => void;\n}\n\n// ── API pública final ────────────────────────────────────────────────────\nexport type InputProps = RHFInputProps | ControlledInputProps;\n\nexport const Input: React.FC<InputProps> = (props) => {\n const {\n type = 'text',\n variant = 'outlined',\n size = 'small',\n borderRadius = 10,\n labelPosition = 'outside',\n preset,\n min,\n max,\n readOnly,\n inputProps,\n slotProps,\n sx,\n ...rest\n } = props as ControlledInputProps & {\n control?: Control<any>;\n validation?: RegisterOptions;\n readOnly?: boolean;\n preset?: string;\n };\n\n const theme = useTheme();\n const presetSx = resolvePreset('Input', preset, theme);\n\n const finalSlotProps = buildSlotProps(\n type,\n min,\n max,\n slotProps,\n inputProps,\n labelPosition,\n readOnly,\n );\n const mergedSx = [\n buildInputSx(borderRadius, labelPosition),\n ...(presetSx ? [presetSx] : []),\n ...(Array.isArray(sx) ? sx : [sx]),\n ];\n\n if ('control' in props && props.control) {\n const { name, control, validation } = props as RHFInputProps;\n return (\n <Controller\n name={name}\n control={control}\n rules={validation}\n render={({ field, fieldState: { error } }) => (\n <TextField\n fullWidth\n {...rest}\n name={field.name}\n value={field.value ?? ''}\n onChange={(e) => field.onChange(parseValue(e.target.value, type))}\n onBlur={field.onBlur}\n inputRef={field.ref}\n type={type}\n variant={variant}\n size={size}\n slotProps={finalSlotProps}\n sx={mergedSx}\n error={!!error || rest.error}\n helperText={error?.message ?? rest.helperText}\n />\n )}\n />\n );\n }\n\n const { value, onChange } = props as ControlledInputProps;\n return (\n <TextField\n fullWidth\n {...rest}\n value={value ?? ''}\n onChange={(e) => onChange(parseValue(e.target.value, type))}\n type={type}\n variant={variant}\n size={size}\n slotProps={finalSlotProps}\n sx={mergedSx}\n />\n );\n};\n\nexport default Input;\n"],"names":["_a"],"mappings":"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"}
|
|
@@ -0,0 +1,173 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __defProps = Object.defineProperties;
|
|
4
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
5
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
8
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
9
|
+
var __spreadValues = (a, b) => {
|
|
10
|
+
for (var prop in b || (b = {}))
|
|
11
|
+
if (__hasOwnProp.call(b, prop))
|
|
12
|
+
__defNormalProp(a, prop, b[prop]);
|
|
13
|
+
if (__getOwnPropSymbols)
|
|
14
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
15
|
+
if (__propIsEnum.call(b, prop))
|
|
16
|
+
__defNormalProp(a, prop, b[prop]);
|
|
17
|
+
}
|
|
18
|
+
return a;
|
|
19
|
+
};
|
|
20
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
21
|
+
var __objRest = (source, exclude) => {
|
|
22
|
+
var target = {};
|
|
23
|
+
for (var prop in source)
|
|
24
|
+
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
25
|
+
target[prop] = source[prop];
|
|
26
|
+
if (source != null && __getOwnPropSymbols)
|
|
27
|
+
for (var prop of __getOwnPropSymbols(source)) {
|
|
28
|
+
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
29
|
+
target[prop] = source[prop];
|
|
30
|
+
}
|
|
31
|
+
return target;
|
|
32
|
+
};
|
|
33
|
+
const jsxRuntime = require("react/jsx-runtime");
|
|
34
|
+
const material = require("@mui/material");
|
|
35
|
+
const styles = require("@mui/material/styles");
|
|
36
|
+
const reactHookForm = require("react-hook-form");
|
|
37
|
+
const formField_sx = require("./formField.sx-CQ1mbk9M.cjs");
|
|
38
|
+
const resolvePreset = require("./resolvePreset-CxTI6_Ln.cjs");
|
|
39
|
+
const parseValue = (raw, type) => {
|
|
40
|
+
if (type !== "number") return raw;
|
|
41
|
+
if (raw === "" || raw === "-") return raw;
|
|
42
|
+
const n = parseFloat(raw);
|
|
43
|
+
return isNaN(n) ? raw : n;
|
|
44
|
+
};
|
|
45
|
+
const buildSlotProps = (type, min, max, customSlotProps, customInputProps, _labelPosition, readOnly) => {
|
|
46
|
+
const numberAttrs = type === "number" ? __spreadValues({ min: min != null ? min : Number.NEGATIVE_INFINITY }, max !== void 0 && { max }) : {};
|
|
47
|
+
return __spreadProps(__spreadValues({}, customSlotProps), {
|
|
48
|
+
htmlInput: __spreadValues(__spreadValues(__spreadValues(__spreadValues({}, customInputProps), customSlotProps == null ? void 0 : customSlotProps.htmlInput), numberAttrs), readOnly && { readOnly: true }),
|
|
49
|
+
// Dejamos que MUI maneje el shrink nativamente (animación inside → up).
|
|
50
|
+
// El consumidor puede forzar shrink con slotProps.inputLabel.shrink=true si lo necesita.
|
|
51
|
+
inputLabel: __spreadValues({}, customSlotProps == null ? void 0 : customSlotProps.inputLabel)
|
|
52
|
+
});
|
|
53
|
+
};
|
|
54
|
+
const buildInputSx = (borderRadius, labelPosition) => {
|
|
55
|
+
const radius = typeof borderRadius === "number" ? `${borderRadius}px` : borderRadius;
|
|
56
|
+
return formField_sx.buildFormFieldSx({
|
|
57
|
+
borderRadius,
|
|
58
|
+
labelPosition,
|
|
59
|
+
extraOutsideSx: {
|
|
60
|
+
"& .MuiInputBase-input": {
|
|
61
|
+
paddingTop: formField_sx.FIELD_INPUT_PADDING_Y,
|
|
62
|
+
paddingBottom: formField_sx.FIELD_INPUT_PADDING_Y
|
|
63
|
+
},
|
|
64
|
+
// Filled: quitar el padding-top reservado para el label flotante dentro.
|
|
65
|
+
"& .MuiFilledInput-root": {
|
|
66
|
+
paddingTop: 0,
|
|
67
|
+
borderRadius: `${radius} ${radius} 0 0`
|
|
68
|
+
},
|
|
69
|
+
"& .MuiFilledInput-input": {
|
|
70
|
+
paddingTop: formField_sx.FIELD_INPUT_PADDING_Y
|
|
71
|
+
},
|
|
72
|
+
// Standard: quitar el margin-top reservado para el label flotante.
|
|
73
|
+
"& .MuiInput-root": {
|
|
74
|
+
marginTop: 0
|
|
75
|
+
}
|
|
76
|
+
}
|
|
77
|
+
});
|
|
78
|
+
};
|
|
79
|
+
const Input = (props) => {
|
|
80
|
+
const _a = props, {
|
|
81
|
+
type = "text",
|
|
82
|
+
variant = "outlined",
|
|
83
|
+
size = "small",
|
|
84
|
+
borderRadius = 10,
|
|
85
|
+
labelPosition = "outside",
|
|
86
|
+
preset,
|
|
87
|
+
min,
|
|
88
|
+
max,
|
|
89
|
+
readOnly,
|
|
90
|
+
inputProps,
|
|
91
|
+
slotProps,
|
|
92
|
+
sx
|
|
93
|
+
} = _a, rest = __objRest(_a, [
|
|
94
|
+
"type",
|
|
95
|
+
"variant",
|
|
96
|
+
"size",
|
|
97
|
+
"borderRadius",
|
|
98
|
+
"labelPosition",
|
|
99
|
+
"preset",
|
|
100
|
+
"min",
|
|
101
|
+
"max",
|
|
102
|
+
"readOnly",
|
|
103
|
+
"inputProps",
|
|
104
|
+
"slotProps",
|
|
105
|
+
"sx"
|
|
106
|
+
]);
|
|
107
|
+
const theme = styles.useTheme();
|
|
108
|
+
const presetSx = resolvePreset.resolvePreset("Input", preset, theme);
|
|
109
|
+
const finalSlotProps = buildSlotProps(
|
|
110
|
+
type,
|
|
111
|
+
min,
|
|
112
|
+
max,
|
|
113
|
+
slotProps,
|
|
114
|
+
inputProps,
|
|
115
|
+
labelPosition,
|
|
116
|
+
readOnly
|
|
117
|
+
);
|
|
118
|
+
const mergedSx = [
|
|
119
|
+
buildInputSx(borderRadius, labelPosition),
|
|
120
|
+
...presetSx ? [presetSx] : [],
|
|
121
|
+
...Array.isArray(sx) ? sx : [sx]
|
|
122
|
+
];
|
|
123
|
+
if ("control" in props && props.control) {
|
|
124
|
+
const { name, control, validation } = props;
|
|
125
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
126
|
+
reactHookForm.Controller,
|
|
127
|
+
{
|
|
128
|
+
name,
|
|
129
|
+
control,
|
|
130
|
+
rules: validation,
|
|
131
|
+
render: ({ field, fieldState: { error } }) => {
|
|
132
|
+
var _a2, _b;
|
|
133
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
134
|
+
material.TextField,
|
|
135
|
+
__spreadProps(__spreadValues({
|
|
136
|
+
fullWidth: true
|
|
137
|
+
}, rest), {
|
|
138
|
+
name: field.name,
|
|
139
|
+
value: (_a2 = field.value) != null ? _a2 : "",
|
|
140
|
+
onChange: (e) => field.onChange(parseValue(e.target.value, type)),
|
|
141
|
+
onBlur: field.onBlur,
|
|
142
|
+
inputRef: field.ref,
|
|
143
|
+
type,
|
|
144
|
+
variant,
|
|
145
|
+
size,
|
|
146
|
+
slotProps: finalSlotProps,
|
|
147
|
+
sx: mergedSx,
|
|
148
|
+
error: !!error || rest.error,
|
|
149
|
+
helperText: (_b = error == null ? void 0 : error.message) != null ? _b : rest.helperText
|
|
150
|
+
})
|
|
151
|
+
);
|
|
152
|
+
}
|
|
153
|
+
}
|
|
154
|
+
);
|
|
155
|
+
}
|
|
156
|
+
const { value, onChange } = props;
|
|
157
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
158
|
+
material.TextField,
|
|
159
|
+
__spreadProps(__spreadValues({
|
|
160
|
+
fullWidth: true
|
|
161
|
+
}, rest), {
|
|
162
|
+
value: value != null ? value : "",
|
|
163
|
+
onChange: (e) => onChange(parseValue(e.target.value, type)),
|
|
164
|
+
type,
|
|
165
|
+
variant,
|
|
166
|
+
size,
|
|
167
|
+
slotProps: finalSlotProps,
|
|
168
|
+
sx: mergedSx
|
|
169
|
+
})
|
|
170
|
+
);
|
|
171
|
+
};
|
|
172
|
+
exports.Input = Input;
|
|
173
|
+
//# sourceMappingURL=Input-DI0jfq5X.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Input-DI0jfq5X.cjs","sources":["../src/components/Input/Input.helpers.ts","../src/components/Input/Input.sx.ts","../src/components/Input/Input.tsx"],"sourcesContent":["import type { InputHTMLAttributes } from 'react';\nimport type { TextFieldProps } from '@mui/material';\nimport type { InputType, LabelPosition } from './Input';\n\n/**\n * Convierte el valor raw del evento al tipo apropiado.\n * Para type=\"number\" intenta parsear a número; si falla, devuelve el raw\n * (permite estados intermedios como \"\" o \"-\" mientras el usuario tipea).\n */\nexport const parseValue = (raw: string, type: InputType): string | number => {\n if (type !== 'number') return raw;\n if (raw === '' || raw === '-') return raw;\n const n = parseFloat(raw);\n return isNaN(n) ? raw : n;\n};\n\n/**\n * Construye los slotProps del TextField consolidando htmlInput + inputLabel.\n * Maneja los atributos min/max cuando type=\"number\" y readOnly.\n */\nexport const buildSlotProps = (\n type: InputType,\n min: number | undefined,\n max: number | undefined,\n customSlotProps: TextFieldProps['slotProps'],\n customInputProps: InputHTMLAttributes<HTMLInputElement> | undefined,\n _labelPosition: LabelPosition,\n readOnly?: boolean,\n): TextFieldProps['slotProps'] => {\n const numberAttrs =\n type === 'number'\n ? { min: min ?? Number.NEGATIVE_INFINITY, ...(max !== undefined && { max }) }\n : {};\n\n return {\n ...customSlotProps,\n htmlInput: {\n ...customInputProps,\n ...(customSlotProps as any)?.htmlInput,\n ...numberAttrs,\n ...(readOnly && { readOnly: true }),\n },\n // Dejamos que MUI maneje el shrink nativamente (animación inside → up).\n // El consumidor puede forzar shrink con slotProps.inputLabel.shrink=true si lo necesita.\n inputLabel: {\n ...(customSlotProps as any)?.inputLabel,\n },\n };\n};\n","import type { TextFieldProps } from '@mui/material';\n\nimport { buildFormFieldSx } from '../_shared/formField.sx';\nimport { FIELD_INPUT_PADDING_Y } from '../../theme/tokens';\nimport type { LabelPosition } from './Input';\n\n/**\n * Builder de sx para el Input. Usa el builder compartido\n * `buildFormFieldSx` y añade overrides específicos de TextField\n * (padding del input base, filled, standard).\n */\nexport const buildInputSx = (\n borderRadius: number | string,\n labelPosition: LabelPosition,\n): TextFieldProps['sx'] => {\n const radius = typeof borderRadius === 'number' ? `${borderRadius}px` : borderRadius;\n\n return buildFormFieldSx({\n borderRadius,\n labelPosition,\n extraOutsideSx: {\n '& .MuiInputBase-input': {\n paddingTop: FIELD_INPUT_PADDING_Y,\n paddingBottom: FIELD_INPUT_PADDING_Y,\n },\n\n // Filled: quitar el padding-top reservado para el label flotante dentro.\n '& .MuiFilledInput-root': {\n paddingTop: 0,\n borderRadius: `${radius} ${radius} 0 0`,\n },\n '& .MuiFilledInput-input': {\n paddingTop: FIELD_INPUT_PADDING_Y,\n },\n\n // Standard: quitar el margin-top reservado para el label flotante.\n '& .MuiInput-root': {\n marginTop: 0,\n },\n },\n });\n};\n","import { TextField, type TextFieldProps } from '@mui/material';\nimport { useTheme } from '@mui/material/styles';\nimport { Controller, type Control, type RegisterOptions } from 'react-hook-form';\n\nimport { parseValue, buildSlotProps } from './Input.helpers';\nimport { buildInputSx } from './Input.sx';\nimport { resolvePreset } from '../_shared/resolvePreset';\n\n// ── Tipos de dominio ─────────────────────────────────────────────────────\nexport type InputType =\n | 'text' | 'number' | 'email' | 'password' | 'tel'\n | 'url' | 'search' | 'date' | 'datetime-local'\n | 'month' | 'week' | 'time' | 'color';\n\nexport type LabelPosition = 'outside' | 'floating';\n\n// ── Props base (todo lo común entre RHF y controlado) ────────────────────\nexport interface BaseInputProps\n extends Omit<TextFieldProps, 'value' | 'onChange' | 'type'> {\n type?: InputType;\n min?: number;\n max?: number;\n /** Border radius del input. Default: 10 */\n borderRadius?: number | string;\n /** \"outside\" = label arriba del campo (default). \"floating\" = label clásico MUI dentro del borde */\n labelPosition?: LabelPosition;\n readOnly?: boolean;\n /**\n * Nombre del preset de estilo registrado en `theme.styles.Input`.\n * - `\"default\"` (o ausente) = estilo built-in del paquete.\n * - Cualquier otro string = mergea el preset encima del estilo built-in.\n */\n preset?: string;\n}\n\n// ── Variantes discriminadas (RHF vs controlado) ──────────────────────────\nexport interface RHFInputProps extends BaseInputProps {\n name: string;\n control: Control<any>;\n validation?: RegisterOptions;\n value?: never;\n onChange?: never;\n}\n\nexport interface ControlledInputProps extends BaseInputProps {\n name?: string;\n control?: never;\n validation?: never;\n value: string | number;\n onChange: (value: string | number) => void;\n}\n\n// ── API pública final ────────────────────────────────────────────────────\nexport type InputProps = RHFInputProps | ControlledInputProps;\n\nexport const Input: React.FC<InputProps> = (props) => {\n const {\n type = 'text',\n variant = 'outlined',\n size = 'small',\n borderRadius = 10,\n labelPosition = 'outside',\n preset,\n min,\n max,\n readOnly,\n inputProps,\n slotProps,\n sx,\n ...rest\n } = props as ControlledInputProps & {\n control?: Control<any>;\n validation?: RegisterOptions;\n readOnly?: boolean;\n preset?: string;\n };\n\n const theme = useTheme();\n const presetSx = resolvePreset('Input', preset, theme);\n\n const finalSlotProps = buildSlotProps(\n type,\n min,\n max,\n slotProps,\n inputProps,\n labelPosition,\n readOnly,\n );\n const mergedSx = [\n buildInputSx(borderRadius, labelPosition),\n ...(presetSx ? [presetSx] : []),\n ...(Array.isArray(sx) ? sx : [sx]),\n ];\n\n if ('control' in props && props.control) {\n const { name, control, validation } = props as RHFInputProps;\n return (\n <Controller\n name={name}\n control={control}\n rules={validation}\n render={({ field, fieldState: { error } }) => (\n <TextField\n fullWidth\n {...rest}\n name={field.name}\n value={field.value ?? ''}\n onChange={(e) => field.onChange(parseValue(e.target.value, type))}\n onBlur={field.onBlur}\n inputRef={field.ref}\n type={type}\n variant={variant}\n size={size}\n slotProps={finalSlotProps}\n sx={mergedSx}\n error={!!error || rest.error}\n helperText={error?.message ?? rest.helperText}\n />\n )}\n />\n );\n }\n\n const { value, onChange } = props as ControlledInputProps;\n return (\n <TextField\n fullWidth\n {...rest}\n value={value ?? ''}\n onChange={(e) => onChange(parseValue(e.target.value, type))}\n type={type}\n variant={variant}\n size={size}\n slotProps={finalSlotProps}\n sx={mergedSx}\n />\n );\n};\n\nexport default Input;\n"],"names":["buildFormFieldSx","FIELD_INPUT_PADDING_Y","useTheme","resolvePreset","jsx","Controller","TextField","_a"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASO,MAAM,aAAa,CAAC,KAAa,SAAqC;AAC3E,MAAI,SAAS,SAAU,QAAO;AAC9B,MAAI,QAAQ,MAAM,QAAQ,IAAK,QAAO;AACtC,QAAM,IAAI,WAAW,GAAG;AACxB,SAAO,MAAM,CAAC,IAAI,MAAM;AAC1B;AAMO,MAAM,iBAAiB,CAC5B,MACA,KACA,KACA,iBACA,kBACA,gBACA,aACgC;AAChC,QAAM,cACJ,SAAS,WACL,iBAAE,KAAK,oBAAO,OAAO,qBAAuB,QAAQ,UAAa,EAAE,IAAA,KACnE,CAAA;AAEN,SAAO,iCACF,kBADE;AAAA,IAEL,WAAW,gEACN,mBACC,mDAAyB,YAC1B,cACC,YAAY,EAAE,UAAU,KAAA;AAAA;AAAA;AAAA,IAI9B,YAAY,mBACN,mDAAyB;AAAA,EAC/B;AAEJ;ACrCO,MAAM,eAAe,CAC1B,cACA,kBACyB;AACzB,QAAM,SAAS,OAAO,iBAAiB,WAAW,GAAG,YAAY,OAAO;AAExE,SAAOA,8BAAiB;AAAA,IACtB;AAAA,IACA;AAAA,IACA,gBAAgB;AAAA,MACd,yBAAyB;AAAA,QACvB,YAAYC,aAAAA;AAAAA,QACZ,eAAeA,aAAAA;AAAAA,MAAA;AAAA;AAAA,MAIjB,0BAA0B;AAAA,QACxB,YAAY;AAAA,QACZ,cAAc,GAAG,MAAM,IAAI,MAAM;AAAA,MAAA;AAAA,MAEnC,2BAA2B;AAAA,QACzB,YAAYA,aAAAA;AAAAA,MAAA;AAAA;AAAA,MAId,oBAAoB;AAAA,QAClB,WAAW;AAAA,MAAA;AAAA,IACb;AAAA,EACF,CACD;AACH;ACcO,MAAM,QAA8B,CAAC,UAAU;AACpD,QAcI,YAbF;AAAA,WAAO;AAAA,IACP,UAAU;AAAA,IACV,OAAO;AAAA,IACP,eAAe;AAAA,IACf,gBAAgB;AAAA,IAChB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,MAEE,IADC,iBACD,IADC;AAAA,IAZH;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AASF,QAAM,QAAQC,OAAAA,SAAA;AACd,QAAM,WAAWC,cAAAA,cAAc,SAAS,QAAQ,KAAK;AAErD,QAAM,iBAAiB;AAAA,IACrB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAEF,QAAM,WAAW;AAAA,IACf,aAAa,cAAc,aAAa;AAAA,IACxC,GAAI,WAAW,CAAC,QAAQ,IAAI,CAAA;AAAA,IAC5B,GAAI,MAAM,QAAQ,EAAE,IAAI,KAAK,CAAC,EAAE;AAAA,EAAA;AAGlC,MAAI,aAAa,SAAS,MAAM,SAAS;AACvC,UAAM,EAAE,MAAM,SAAS,WAAA,IAAe;AACtC,WACEC,2BAAAA;AAAAA,MAACC,cAAAA;AAAAA,MAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,OAAO;AAAA,QACP,QAAQ,CAAC,EAAE,OAAO,YAAY,EAAE,MAAA;;AAC9BD,4CAAAA;AAAAA,YAACE,SAAAA;AAAAA,YAAA;AAAA,cACC,WAAS;AAAA,eACL,OAFL;AAAA,cAGC,MAAM,MAAM;AAAA,cACZ,QAAOC,MAAA,MAAM,UAAN,OAAAA,MAAe;AAAA,cACtB,UAAU,CAAC,MAAM,MAAM,SAAS,WAAW,EAAE,OAAO,OAAO,IAAI,CAAC;AAAA,cAChE,QAAQ,MAAM;AAAA,cACd,UAAU,MAAM;AAAA,cAChB;AAAA,cACA;AAAA,cACA;AAAA,cACA,WAAW;AAAA,cACX,IAAI;AAAA,cACJ,OAAO,CAAC,CAAC,SAAS,KAAK;AAAA,cACvB,aAAY,oCAAO,YAAP,YAAkB,KAAK;AAAA,YAAA;AAAA,UAAA;AAAA;AAAA,MACrC;AAAA,IAAA;AAAA,EAIR;AAEA,QAAM,EAAE,OAAO,SAAA,IAAa;AAC5B,SACEH,2BAAAA;AAAAA,IAACE,SAAAA;AAAAA,IAAA;AAAA,MACC,WAAS;AAAA,OACL,OAFL;AAAA,MAGC,OAAO,wBAAS;AAAA,MAChB,UAAU,CAAC,MAAM,SAAS,WAAW,EAAE,OAAO,OAAO,IAAI,CAAC;AAAA,MAC1D;AAAA,MACA;AAAA,MACA;AAAA,MACA,WAAW;AAAA,MACX,IAAI;AAAA,IAAA;AAAA,EAAA;AAGV;;"}
|