@soyfri/shared-library 2.0.0-beta8 → 2.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/Button-C17mExpd.cjs.map +1 -1
- package/Button-UkkP-bNw.js.map +1 -1
- package/README.md +182 -150
- package/components/ActionMenu/ActionMenu.cjs +52 -52
- package/components/ActionMenu/ActionMenu.cjs.map +1 -1
- package/components/ActionMenu/ActionMenu.d.ts +20 -36
- package/components/ActionMenu/ActionMenu.js +55 -55
- package/components/ActionMenu/ActionMenu.js.map +1 -1
- package/components/ActionMenu/index.d.ts +2 -2
- package/components/AppBar/AppBar.cjs +3 -220
- package/components/AppBar/AppBar.cjs.map +1 -1
- package/components/AppBar/AppBar.d.ts +6 -6
- package/components/AppBar/AppBar.js +6 -223
- package/components/AppBar/AppBar.js.map +1 -1
- package/components/AppBar/index.d.ts +0 -6
- package/components/Autocomplete/Autocomplete.cjs +310 -4
- package/components/Autocomplete/Autocomplete.cjs.map +1 -1
- package/components/Autocomplete/Autocomplete.d.ts +29 -26
- package/components/Autocomplete/Autocomplete.definitions.d.ts +2 -1
- package/components/Autocomplete/Autocomplete.helpers.d.ts +12 -8
- package/components/Autocomplete/Autocomplete.js +310 -4
- package/components/Autocomplete/Autocomplete.js.map +1 -1
- package/components/Autocomplete/_parts/AutocompleteChips.d.ts +7 -6
- package/components/Autocomplete/_parts/AutocompleteOption.d.ts +10 -13
- package/components/Autocomplete/index.d.ts +1 -1
- package/components/Avatar/Avatar.cjs +159 -2
- package/components/Avatar/Avatar.cjs.map +1 -1
- package/components/Avatar/Avatar.js +159 -2
- package/components/Avatar/Avatar.js.map +1 -1
- package/components/Avatar/index.d.ts +1 -0
- package/components/Button/Button.d.ts +5 -5
- package/components/Button/index.d.ts +1 -0
- package/components/Card/Card.cjs +95 -7
- package/components/Card/Card.cjs.map +1 -1
- package/components/Card/Card.d.ts +3 -50
- package/components/Card/Card.js +95 -7
- package/components/Card/Card.js.map +1 -1
- package/components/Card/Card.sx.d.ts +3 -6
- package/components/Card/index.d.ts +1 -1
- package/{Switch-BIeobv6i.cjs → components/Checkbox/Checkbox.cjs} +30 -20
- package/components/Checkbox/Checkbox.cjs.map +1 -0
- package/components/Checkbox/Checkbox.d.ts +55 -0
- package/{Switch-DQEOxM2R.js → components/Checkbox/Checkbox.js} +29 -20
- package/components/Checkbox/Checkbox.js.map +1 -0
- package/components/Checkbox/Checkbox.sx.d.ts +13 -0
- package/components/Checkbox/index.d.ts +2 -0
- package/components/Checkbox.d.ts +6 -0
- package/components/Chip/Chip.cjs +73 -3
- package/components/Chip/Chip.cjs.map +1 -1
- package/components/Chip/Chip.js +72 -2
- package/components/Chip/Chip.js.map +1 -1
- package/components/Chip/index.d.ts +2 -1
- package/components/Chip.d.ts +4 -0
- 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 +0 -1
- package/components/DatePicker/DatePicker.cjs +177 -3
- package/components/DatePicker/DatePicker.cjs.map +1 -1
- package/components/DatePicker/DatePicker.d.ts +1 -13
- package/components/DatePicker/DatePicker.js +177 -3
- package/components/DatePicker/DatePicker.js.map +1 -1
- package/components/DatePicker/index.d.ts +1 -1
- package/components/DateRangePicker/DateRangePicker.cjs +73 -2
- package/components/DateRangePicker/DateRangePicker.cjs.map +1 -1
- package/components/DateRangePicker/DateRangePicker.js +73 -2
- package/components/DateRangePicker/DateRangePicker.js.map +1 -1
- package/components/DateTimePicker/DateTimePicker.cjs +195 -3
- package/components/DateTimePicker/DateTimePicker.cjs.map +1 -1
- package/components/DateTimePicker/DateTimePicker.d.ts +9 -17
- package/components/DateTimePicker/DateTimePicker.definitions.d.ts +2 -0
- package/components/DateTimePicker/DateTimePicker.helpers.d.ts +4 -2
- package/components/DateTimePicker/DateTimePicker.js +195 -3
- package/components/DateTimePicker/DateTimePicker.js.map +1 -1
- package/components/DateTimePicker/index.d.ts +1 -1
- package/components/Drawer/Drawer.cjs +13 -7
- package/components/Drawer/Drawer.cjs.map +1 -1
- package/components/Drawer/Drawer.d.ts +3 -1
- package/components/Drawer/Drawer.js +14 -8
- package/components/Drawer/Drawer.js.map +1 -1
- package/components/Drawer/DrawerItem.d.ts +6 -1
- package/components/Gallery/Gallery.cjs +154 -79
- package/components/Gallery/Gallery.cjs.map +1 -1
- package/components/Gallery/Gallery.d.ts +25 -9
- package/components/Gallery/Gallery.js +154 -79
- package/components/Gallery/Gallery.js.map +1 -1
- package/components/Gallery/GalleryLightbox.d.ts +6 -10
- package/components/Gallery/GalleryMain.d.ts +3 -7
- package/components/Gallery/GalleryThumbnails.d.ts +7 -11
- package/components/Gallery/index.d.ts +2 -1
- package/components/Gallery.d.ts +4 -0
- package/components/Icon/Icon.cjs +6 -8
- package/components/Icon/Icon.cjs.map +1 -1
- package/components/Icon/Icon.d.ts +11 -17
- package/components/Icon/Icon.js +6 -8
- package/components/Icon/Icon.js.map +1 -1
- package/components/Icon/index.d.ts +2 -1
- package/components/Icon.d.ts +4 -0
- package/components/Input/Input.cjs +185 -3
- package/components/Input/Input.cjs.map +1 -1
- package/components/Input/Input.d.ts +9 -2
- package/components/Input/Input.helpers.d.ts +3 -3
- package/components/Input/Input.js +185 -3
- package/components/Input/Input.js.map +1 -1
- package/components/Input/index.d.ts +1 -1
- package/components/InputGroup/InputGroup.cjs +23 -22
- package/components/InputGroup/InputGroup.cjs.map +1 -1
- package/components/InputGroup/InputGroup.d.ts +4 -4
- package/components/InputGroup/InputGroup.js +22 -21
- package/components/InputGroup/InputGroup.js.map +1 -1
- package/components/InputGroup/index.d.ts +2 -1
- package/components/InputGroup.d.ts +4 -0
- package/components/Modal/Modal.cjs +345 -6
- package/components/Modal/Modal.cjs.map +1 -1
- package/components/Modal/Modal.d.ts +20 -5
- package/components/Modal/Modal.js +345 -6
- package/components/Modal/Modal.js.map +1 -1
- package/components/Modal/ModalBody.d.ts +6 -1
- package/components/Modal/ModalFooter.d.ts +4 -4
- package/components/Modal/ModalHeader.d.ts +6 -1
- package/components/Modal/index.d.ts +4 -3
- package/components/RadioGroup/RadioGroup.cjs +201 -3
- package/components/RadioGroup/RadioGroup.cjs.map +1 -1
- package/components/RadioGroup/RadioGroup.d.ts +9 -3
- package/components/RadioGroup/RadioGroup.js +201 -3
- package/components/RadioGroup/RadioGroup.js.map +1 -1
- package/components/RadioGroup/index.d.ts +1 -1
- package/components/Select/Select.cjs +310 -4
- package/components/Select/Select.cjs.map +1 -1
- package/components/Select/Select.d.ts +35 -20
- package/components/Select/Select.helpers.d.ts +6 -19
- package/components/Select/Select.js +310 -4
- package/components/Select/Select.js.map +1 -1
- package/components/Select/index.d.ts +1 -1
- package/components/Stat/Stat.cjs +83 -4
- package/components/Stat/Stat.cjs.map +1 -1
- package/components/Stat/Stat.js +82 -3
- package/components/Stat/Stat.js.map +1 -1
- package/components/Stat/index.d.ts +2 -1
- package/components/Stat.d.ts +4 -0
- package/components/StatusMessage/StatusMessage.cjs +105 -3
- package/components/StatusMessage/StatusMessage.cjs.map +1 -1
- package/components/StatusMessage/StatusMessage.d.ts +20 -36
- package/components/StatusMessage/StatusMessage.js +105 -3
- package/components/StatusMessage/StatusMessage.js.map +1 -1
- package/components/StatusMessage/StatusMessageContext.d.ts +16 -0
- package/components/StatusMessage/index.d.ts +2 -0
- package/components/Stepper/Stepper.cjs +324 -4
- package/components/Stepper/Stepper.cjs.map +1 -1
- package/components/Stepper/Stepper.d.ts +9 -8
- package/components/Stepper/Stepper.js +323 -3
- package/components/Stepper/Stepper.js.map +1 -1
- package/{hooks/Wizard/WizardContext.d.ts → components/Stepper/StepperContext.d.ts} +28 -22
- package/components/Stepper/_hooks/useHorizontalScroll.d.ts +19 -0
- package/components/Stepper/_parts/StepperScrollArrow.d.ts +19 -0
- package/components/Stepper/index.d.ts +6 -2
- package/components/Stepper.d.ts +4 -0
- package/components/Switch/Switch.cjs +181 -3
- package/components/Switch/Switch.cjs.map +1 -1
- package/components/Switch/Switch.d.ts +7 -2
- package/components/Switch/Switch.js +181 -3
- package/components/Switch/Switch.js.map +1 -1
- package/components/Table/Table.cjs +528 -2
- package/components/Table/Table.cjs.map +1 -1
- package/components/Table/Table.d.ts +1 -1
- package/components/Table/Table.js +528 -2
- package/components/Table/Table.js.map +1 -1
- package/components/Tabs/Tabs.cjs +110 -4
- package/components/Tabs/Tabs.cjs.map +1 -1
- package/components/Tabs/Tabs.d.ts +21 -16
- package/components/Tabs/Tabs.js +109 -3
- package/components/Tabs/Tabs.js.map +1 -1
- package/components/Tabs/index.d.ts +4 -2
- package/components/Tabs.d.ts +4 -0
- package/components/Timeline/Timeline.cjs +3 -2
- package/components/Timeline/Timeline.cjs.map +1 -1
- package/components/Timeline/Timeline.d.ts +4 -8
- package/components/Timeline/Timeline.js +3 -2
- package/components/Timeline/Timeline.js.map +1 -1
- package/components/Timeline/index.d.ts +4 -2
- package/components/Timeline.d.ts +4 -0
- package/components/_shared/mergeSx.d.ts +7 -0
- package/{formField.sx-DfVbMe0V.js → formField.sx-8_QRnKxv.js} +2 -11
- package/formField.sx-8_QRnKxv.js.map +1 -0
- package/{formField.sx-CQ1mbk9M.cjs → formField.sx-BAX7KwMR.cjs} +10 -19
- package/formField.sx-BAX7KwMR.cjs.map +1 -0
- package/index.cjs +63 -47
- package/index.cjs.map +1 -1
- package/index.d.ts +1 -30
- package/index.js +25 -48
- package/index.js.map +1 -1
- package/mergeSx-BXoNZjB_.js +10 -0
- package/mergeSx-BXoNZjB_.js.map +1 -0
- package/mergeSx-Dbccoo_H.cjs +9 -0
- package/mergeSx-Dbccoo_H.cjs.map +1 -0
- package/mui.d.ts +4 -2
- package/package.json +8 -20
- package/{resolvePreset-K6_BfWHD.js → resolvePreset-B-IB0ehH.js} +3 -3
- package/{resolvePreset-K6_BfWHD.js.map → resolvePreset-B-IB0ehH.js.map} +1 -1
- package/{resolvePreset-CxTI6_Ln.cjs → resolvePreset-CT3kU-K2.cjs} +3 -3
- package/{resolvePreset-CxTI6_Ln.cjs.map → resolvePreset-CT3kU-K2.cjs.map} +1 -1
- package/theme/componentStyles.d.ts +1 -1
- package/tokens-BRrcP_p_.js +21 -0
- package/tokens-BRrcP_p_.js.map +1 -0
- package/tokens-jaWWNk39.cjs +20 -0
- package/tokens-jaWWNk39.cjs.map +1 -0
- package/utils/index.d.ts +2 -0
- package/{components/ScrollTopButton → utils}/scrollToTop.d.ts +6 -7
- package/Autocomplete-BA-cGASd.js +0 -316
- package/Autocomplete-BA-cGASd.js.map +0 -1
- package/Autocomplete-C2x-lBvZ.cjs +0 -315
- package/Autocomplete-C2x-lBvZ.cjs.map +0 -1
- package/Avatar-9L7YMxya.cjs +0 -162
- package/Avatar-9L7YMxya.cjs.map +0 -1
- package/Avatar-BJTr-PBd.js +0 -163
- package/Avatar-BJTr-PBd.js.map +0 -1
- package/Card-DG_crfkK.cjs +0 -185
- package/Card-DG_crfkK.cjs.map +0 -1
- package/Card-Ug-ttVSh.js +0 -186
- package/Card-Ug-ttVSh.js.map +0 -1
- package/Chip-OPYQ1uQ_.js +0 -74
- package/Chip-OPYQ1uQ_.js.map +0 -1
- package/Chip-qoJLDiva.cjs +0 -73
- package/Chip-qoJLDiva.cjs.map +0 -1
- package/DatePicker-8f_9bwhS.js +0 -202
- package/DatePicker-8f_9bwhS.js.map +0 -1
- package/DatePicker-DLSfkgGA.cjs +0 -201
- package/DatePicker-DLSfkgGA.cjs.map +0 -1
- package/DateRangePicker-BVpeJCHI.js +0 -76
- package/DateRangePicker-BVpeJCHI.js.map +0 -1
- package/DateRangePicker-B_hKQhbj.cjs +0 -75
- package/DateRangePicker-B_hKQhbj.cjs.map +0 -1
- package/DateTimePicker-CWNW09-O.cjs +0 -220
- package/DateTimePicker-CWNW09-O.cjs.map +0 -1
- package/DateTimePicker-D4L9GAod.js +0 -221
- package/DateTimePicker-D4L9GAod.js.map +0 -1
- package/Input-Cp911l23.js +0 -174
- package/Input-Cp911l23.js.map +0 -1
- package/Input-DI0jfq5X.cjs +0 -173
- package/Input-DI0jfq5X.cjs.map +0 -1
- package/Modal-Bm_HH9cv.cjs +0 -319
- package/Modal-Bm_HH9cv.cjs.map +0 -1
- package/Modal-Bnz6d9m9.js +0 -320
- package/Modal-Bnz6d9m9.js.map +0 -1
- package/RadioGroup-CxqDHap1.cjs +0 -200
- package/RadioGroup-CxqDHap1.cjs.map +0 -1
- package/RadioGroup-DMi9FvMP.js +0 -201
- package/RadioGroup-DMi9FvMP.js.map +0 -1
- package/Select-3CBOfM2H.js +0 -447
- package/Select-3CBOfM2H.js.map +0 -1
- package/Select-Bku4f4f8.cjs +0 -446
- package/Select-Bku4f4f8.cjs.map +0 -1
- package/Stat-BUcFCGrz.cjs +0 -83
- package/Stat-BUcFCGrz.cjs.map +0 -1
- package/Stat-C06A_izS.js +0 -84
- package/Stat-C06A_izS.js.map +0 -1
- package/StatusMessage-C5B6oGZ_.cjs +0 -78
- package/StatusMessage-C5B6oGZ_.cjs.map +0 -1
- package/StatusMessage-D1GlfQdz.js +0 -79
- package/StatusMessage-D1GlfQdz.js.map +0 -1
- package/Step-Dq0N72YB.js +0 -49
- package/Step-Dq0N72YB.js.map +0 -1
- package/Step-a8U8O-91.cjs +0 -48
- package/Step-a8U8O-91.cjs.map +0 -1
- package/Switch-BIeobv6i.cjs.map +0 -1
- package/Switch-DQEOxM2R.js.map +0 -1
- package/Tab-Co31KY2k.cjs +0 -95
- package/Tab-Co31KY2k.cjs.map +0 -1
- package/Tab-DiK62gRz.js +0 -96
- package/Tab-DiK62gRz.js.map +0 -1
- package/Table-C2LbW0B1.js +0 -531
- package/Table-C2LbW0B1.js.map +0 -1
- package/Table-C4OM6rrC.cjs +0 -530
- package/Table-C4OM6rrC.cjs.map +0 -1
- package/components/AppBar/AppBarBrand.d.ts +0 -31
- package/components/AppBar/AppBarUserMenu.d.ts +0 -65
- package/components/Autocomplete/Autocomplete.types.d.ts +0 -1
- package/components/DatePicker/DatePicker.types.d.ts +0 -1
- package/components/DateTimePicker/DateTimePicker.types.d.ts +0 -1
- package/components/Input/Input.types.d.ts +0 -1
- package/components/PageLoader/PageLoader.cjs +0 -61
- package/components/PageLoader/PageLoader.cjs.map +0 -1
- package/components/PageLoader/PageLoader.d.ts +0 -38
- package/components/PageLoader/PageLoader.js +0 -61
- package/components/PageLoader/PageLoader.js.map +0 -1
- package/components/PageLoader/index.d.ts +0 -2
- package/components/PageLoader.d.ts +0 -6
- package/components/RadioGroup/RadioGroup.types.d.ts +0 -1
- package/components/ScrollTopButton/ScrollTopButton.cjs +0 -79
- package/components/ScrollTopButton/ScrollTopButton.cjs.map +0 -1
- package/components/ScrollTopButton/ScrollTopButton.d.ts +0 -48
- package/components/ScrollTopButton/ScrollTopButton.js +0 -79
- package/components/ScrollTopButton/ScrollTopButton.js.map +0 -1
- package/components/ScrollTopButton/index.d.ts +0 -4
- package/components/ScrollTopButton.d.ts +0 -6
- package/components/Select/Select.definitions.d.ts +0 -17
- package/components/Select/Select.types.d.ts +0 -1
- package/components/Select/_parts/SelectSearchHeader.d.ts +0 -15
- package/components/Select/_parts/SelectValue.d.ts +0 -22
- package/formField.sx-CQ1mbk9M.cjs.map +0 -1
- package/formField.sx-DfVbMe0V.js.map +0 -1
- package/hooks/Wizard/Wizard.cjs +0 -7
- package/hooks/Wizard/Wizard.cjs.map +0 -1
- package/hooks/Wizard/Wizard.js +0 -7
- package/hooks/Wizard/Wizard.js.map +0 -1
- package/hooks/Wizard/index.d.ts +0 -3
- package/hooks/Wizard/useWizard.d.ts +0 -9
- package/hooks/Wizard.d.ts +0 -2
- package/useWizard-CWdIxZzX.cjs +0 -94
- package/useWizard-CWdIxZzX.cjs.map +0 -1
- package/useWizard-CWq--C3o.js +0 -95
- package/useWizard-CWq--C3o.js.map +0 -1
- /package/{styles.css → index.css} +0 -0
|
@@ -1,6 +1,198 @@
|
|
|
1
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
|
+
};
|
|
2
33
|
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
|
|
3
|
-
const
|
|
4
|
-
|
|
5
|
-
|
|
34
|
+
const jsxRuntime = require("react/jsx-runtime");
|
|
35
|
+
const React = require("react");
|
|
36
|
+
const styles = require("@mui/material/styles");
|
|
37
|
+
const AdapterDayjs = require("@mui/x-date-pickers/AdapterDayjs");
|
|
38
|
+
const LocalizationProvider = require("@mui/x-date-pickers/LocalizationProvider");
|
|
39
|
+
const DateTimePicker$1 = require("@mui/x-date-pickers/DateTimePicker");
|
|
40
|
+
const formField_sx = require("../../formField.sx-BAX7KwMR.cjs");
|
|
41
|
+
const tokens = require("../../tokens-jaWWNk39.cjs");
|
|
42
|
+
const resolvePreset = require("../../resolvePreset-CT3kU-K2.cjs");
|
|
43
|
+
const buildDateTimePickerSx = (borderRadius, labelPosition) => formField_sx.buildFormFieldSx({
|
|
44
|
+
borderRadius,
|
|
45
|
+
labelPosition,
|
|
46
|
+
includePickersApi: true,
|
|
47
|
+
extraOutsideSx: {
|
|
48
|
+
"& .MuiInputBase-input": {
|
|
49
|
+
paddingTop: tokens.FIELD_INPUT_PADDING_Y,
|
|
50
|
+
paddingBottom: tokens.FIELD_INPUT_PADDING_Y
|
|
51
|
+
},
|
|
52
|
+
"& .MuiPickersInputBase-sectionsContainer": {
|
|
53
|
+
paddingTop: tokens.FIELD_INPUT_PADDING_Y,
|
|
54
|
+
paddingBottom: tokens.FIELD_INPUT_PADDING_Y
|
|
55
|
+
}
|
|
56
|
+
}
|
|
57
|
+
});
|
|
58
|
+
const getDateTimeValidationMessage = (error) => {
|
|
59
|
+
switch (error) {
|
|
60
|
+
case "minDate":
|
|
61
|
+
case "maxDate":
|
|
62
|
+
case "minTime":
|
|
63
|
+
case "maxTime":
|
|
64
|
+
return "Fecha/hora fuera del rango permitido";
|
|
65
|
+
case "invalidDate":
|
|
66
|
+
return "Formato de fecha/hora inválido";
|
|
67
|
+
case "disableFuture":
|
|
68
|
+
return "No se permiten fechas/horas futuras";
|
|
69
|
+
case "disablePast":
|
|
70
|
+
return "No se permiten fechas/horas pasadas";
|
|
71
|
+
case "minutesStep":
|
|
72
|
+
return "Minutos no válidos para el paso configurado";
|
|
73
|
+
default:
|
|
74
|
+
return "";
|
|
75
|
+
}
|
|
76
|
+
};
|
|
77
|
+
const buildLocaleText = (clearButtonText, cancelButtonText, acceptButtonText) => {
|
|
78
|
+
const text = {};
|
|
79
|
+
if (clearButtonText) text.clearButtonLabel = clearButtonText;
|
|
80
|
+
if (cancelButtonText) text.cancelButtonLabel = cancelButtonText;
|
|
81
|
+
if (acceptButtonText) text.okButtonLabel = acceptButtonText;
|
|
82
|
+
return text;
|
|
83
|
+
};
|
|
84
|
+
const DateTimePicker = (_a) => {
|
|
85
|
+
var _b = _a, {
|
|
86
|
+
label,
|
|
87
|
+
selectedDateTime,
|
|
88
|
+
onDateTimeChange,
|
|
89
|
+
minDateTime,
|
|
90
|
+
maxDateTime,
|
|
91
|
+
disabled,
|
|
92
|
+
readOnly,
|
|
93
|
+
inputFormat,
|
|
94
|
+
borderRadius = 10,
|
|
95
|
+
labelPosition = "outside",
|
|
96
|
+
size = "small",
|
|
97
|
+
helperText,
|
|
98
|
+
error: errorProp,
|
|
99
|
+
sx,
|
|
100
|
+
className,
|
|
101
|
+
preset,
|
|
102
|
+
adapterLocale,
|
|
103
|
+
clearButtonText,
|
|
104
|
+
cancelButtonText,
|
|
105
|
+
acceptButtonText,
|
|
106
|
+
minutesStep,
|
|
107
|
+
minTime,
|
|
108
|
+
ampm = false,
|
|
109
|
+
viewRenderers,
|
|
110
|
+
timeSteps,
|
|
111
|
+
views,
|
|
112
|
+
textFieldProps,
|
|
113
|
+
slotProps: slotPropsProp
|
|
114
|
+
} = _b, rest = __objRest(_b, [
|
|
115
|
+
"label",
|
|
116
|
+
"selectedDateTime",
|
|
117
|
+
"onDateTimeChange",
|
|
118
|
+
"minDateTime",
|
|
119
|
+
"maxDateTime",
|
|
120
|
+
"disabled",
|
|
121
|
+
"readOnly",
|
|
122
|
+
"inputFormat",
|
|
123
|
+
"borderRadius",
|
|
124
|
+
"labelPosition",
|
|
125
|
+
"size",
|
|
126
|
+
"helperText",
|
|
127
|
+
"error",
|
|
128
|
+
"sx",
|
|
129
|
+
"className",
|
|
130
|
+
"preset",
|
|
131
|
+
"adapterLocale",
|
|
132
|
+
"clearButtonText",
|
|
133
|
+
"cancelButtonText",
|
|
134
|
+
"acceptButtonText",
|
|
135
|
+
"minutesStep",
|
|
136
|
+
"minTime",
|
|
137
|
+
"ampm",
|
|
138
|
+
"viewRenderers",
|
|
139
|
+
"timeSteps",
|
|
140
|
+
"views",
|
|
141
|
+
"textFieldProps",
|
|
142
|
+
"slotProps"
|
|
143
|
+
]);
|
|
144
|
+
const [validationError, setValidationError] = React.useState(null);
|
|
145
|
+
const validationErrorMessage = React.useMemo(
|
|
146
|
+
() => getDateTimeValidationMessage(validationError),
|
|
147
|
+
[validationError]
|
|
148
|
+
);
|
|
149
|
+
const customLocaleText = React.useMemo(
|
|
150
|
+
() => buildLocaleText(clearButtonText, cancelButtonText, acceptButtonText),
|
|
151
|
+
[clearButtonText, cancelButtonText, acceptButtonText]
|
|
152
|
+
);
|
|
153
|
+
const theme = styles.useTheme();
|
|
154
|
+
const presetSx = resolvePreset.resolvePreset("DateTimePicker", preset, theme);
|
|
155
|
+
const mergedSx = [
|
|
156
|
+
buildDateTimePickerSx(borderRadius, labelPosition),
|
|
157
|
+
...presetSx ? [presetSx] : [],
|
|
158
|
+
...Array.isArray(sx) ? sx : sx ? [sx] : []
|
|
159
|
+
];
|
|
160
|
+
const finalError = !!validationErrorMessage || !!errorProp;
|
|
161
|
+
const finalHelperText = validationErrorMessage || helperText;
|
|
162
|
+
return /* @__PURE__ */ jsxRuntime.jsx(LocalizationProvider.LocalizationProvider, { dateAdapter: AdapterDayjs.AdapterDayjs, adapterLocale, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
163
|
+
DateTimePicker$1.DateTimePicker,
|
|
164
|
+
__spreadValues({
|
|
165
|
+
className,
|
|
166
|
+
label,
|
|
167
|
+
value: selectedDateTime,
|
|
168
|
+
onChange: onDateTimeChange,
|
|
169
|
+
onError: setValidationError,
|
|
170
|
+
minDateTime,
|
|
171
|
+
maxDateTime,
|
|
172
|
+
minutesStep,
|
|
173
|
+
disabled,
|
|
174
|
+
readOnly,
|
|
175
|
+
minTime,
|
|
176
|
+
format: inputFormat != null ? inputFormat : "DD/MM/YYYY HH:mm",
|
|
177
|
+
ampm,
|
|
178
|
+
viewRenderers,
|
|
179
|
+
timeSteps,
|
|
180
|
+
views,
|
|
181
|
+
sx: mergedSx,
|
|
182
|
+
slotProps: __spreadProps(__spreadValues({}, slotPropsProp), {
|
|
183
|
+
textField: __spreadProps(__spreadValues(__spreadValues({
|
|
184
|
+
fullWidth: true,
|
|
185
|
+
size,
|
|
186
|
+
variant: "outlined"
|
|
187
|
+
}, slotPropsProp == null ? void 0 : slotPropsProp.textField), textFieldProps), {
|
|
188
|
+
error: !!finalError,
|
|
189
|
+
helperText: finalHelperText
|
|
190
|
+
})
|
|
191
|
+
}),
|
|
192
|
+
localeText: customLocaleText
|
|
193
|
+
}, rest)
|
|
194
|
+
) });
|
|
195
|
+
};
|
|
196
|
+
exports.DateTimePicker = DateTimePicker;
|
|
197
|
+
exports.default = DateTimePicker;
|
|
6
198
|
//# sourceMappingURL=DateTimePicker.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DateTimePicker.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;"}
|
|
1
|
+
{"version":3,"file":"DateTimePicker.cjs","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 { DateTimeValidationError } 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 * Cubre tanto errores de fecha (`minDate`, `maxDate`, etc.) como de hora\n * (`minTime`, `maxTime`, `minutesStep`, etc.).\n */\nexport const getDateTimeValidationMessage = (\n error: DateTimeValidationError | null,\n): string => {\n switch (error) {\n case 'minDate':\n case 'maxDate':\n case 'minTime':\n case 'maxTime':\n return 'Fecha/hora fuera del rango permitido';\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 case 'minutesStep':\n return 'Minutos no válidos para el paso configurado';\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 type { DateTimeValidationError } from '@mui/x-date-pickers/models';\nimport { Dayjs } from 'dayjs';\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 /** Si es true usa formato 12h (AM/PM), false = 24h. Default: false. */\n ampm?: boolean;\n viewRenderers?: MuiDateTimePickerProps['viewRenderers'];\n timeSteps?: MuiDateTimePickerProps['timeSteps'];\n /**\n * Vistas a mostrar en el popover. Default: todas (year, month, day, hours, minutes).\n * Ej: `['hours']` solo permite elegir la hora. `['hours','minutes']` oculta el calendar.\n */\n views?: MuiDateTimePickerProps['views'];\n textFieldProps?: Record<string, any>;\n /** Passthrough completo a slotProps del MuiDateTimePicker. */\n slotProps?: MuiDateTimePickerProps['slotProps'];\n}\n\n// ── API pública ──────────────────────────────────────────────────────────\nexport interface DateTimePickerProps extends BaseDateTimePickerProps {\n selectedDateTime: Dayjs | null;\n onDateTimeChange: (dateTime: Dayjs | null) => void;\n}\n\nexport const DateTimePicker: React.FC<DateTimePickerProps> = ({\n label,\n selectedDateTime,\n onDateTimeChange,\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 ampm = false,\n viewRenderers,\n timeSteps,\n views,\n textFieldProps,\n slotProps: slotPropsProp,\n ...rest\n}) => {\n const [validationError, setValidationError] = React.useState<DateTimeValidationError | 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 ? [sx] : []),\n ];\n\n const finalError = !!validationErrorMessage || !!errorProp;\n const finalHelperText = validationErrorMessage || helperText;\n\n return (\n <LocalizationProvider dateAdapter={AdapterDayjs} adapterLocale={adapterLocale}>\n <MuiDateTimePicker\n className={className}\n label={label}\n value={selectedDateTime}\n onChange={onDateTimeChange}\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 ampm={ampm}\n viewRenderers={viewRenderers}\n timeSteps={timeSteps}\n views={views}\n sx={mergedSx}\n slotProps={{\n ...slotPropsProp,\n textField: {\n fullWidth: true,\n size,\n variant: 'outlined',\n ...(slotPropsProp?.textField as Record<string, any> | undefined),\n ...textFieldProps,\n error: !!finalError,\n helperText: finalHelperText,\n } as any,\n }}\n localeText={customLocaleText}\n {...rest}\n />\n </LocalizationProvider>\n );\n};\n\nexport default DateTimePicker;\n"],"names":["buildFormFieldSx","FIELD_INPUT_PADDING_Y","useMemo","useTheme","resolvePreset","jsx","LocalizationProvider","AdapterDayjs","MuiDateTimePicker"],"mappings":"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"}
|
|
@@ -2,7 +2,6 @@ import { default as React } from 'react';
|
|
|
2
2
|
import { SxProps, Theme } from '@mui/material';
|
|
3
3
|
import { DateTimePickerProps as MuiDateTimePickerProps } from '@mui/x-date-pickers/DateTimePicker';
|
|
4
4
|
import { Dayjs } from 'dayjs';
|
|
5
|
-
import { Control, RegisterOptions } from 'react-hook-form';
|
|
6
5
|
export type LabelPosition = 'outside' | 'floating';
|
|
7
6
|
export type DateTimePickerSize = 'small' | 'medium';
|
|
8
7
|
export interface BaseDateTimePickerProps extends Omit<MuiDateTimePickerProps, 'value' | 'onChange' | 'slotProps' | 'format'> {
|
|
@@ -37,29 +36,22 @@ export interface BaseDateTimePickerProps extends Omit<MuiDateTimePickerProps, 'v
|
|
|
37
36
|
acceptButtonText?: string;
|
|
38
37
|
minutesStep?: number;
|
|
39
38
|
minTime?: Dayjs;
|
|
40
|
-
|
|
41
|
-
viewRenderers?: any;
|
|
42
|
-
timeSteps?: any;
|
|
43
|
-
/** Si es true usa formato 12h, false = 24h. Default: false. */
|
|
39
|
+
/** Si es true usa formato 12h (AM/PM), false = 24h. Default: false. */
|
|
44
40
|
ampm?: boolean;
|
|
41
|
+
viewRenderers?: MuiDateTimePickerProps['viewRenderers'];
|
|
42
|
+
timeSteps?: MuiDateTimePickerProps['timeSteps'];
|
|
43
|
+
/**
|
|
44
|
+
* Vistas a mostrar en el popover. Default: todas (year, month, day, hours, minutes).
|
|
45
|
+
* Ej: `['hours']` solo permite elegir la hora. `['hours','minutes']` oculta el calendar.
|
|
46
|
+
*/
|
|
47
|
+
views?: MuiDateTimePickerProps['views'];
|
|
45
48
|
textFieldProps?: Record<string, any>;
|
|
46
49
|
/** Passthrough completo a slotProps del MuiDateTimePicker. */
|
|
47
50
|
slotProps?: MuiDateTimePickerProps['slotProps'];
|
|
48
51
|
}
|
|
49
|
-
export interface
|
|
50
|
-
name: string;
|
|
51
|
-
control: Control<any>;
|
|
52
|
-
validation?: RegisterOptions;
|
|
53
|
-
selectedDateTime?: never;
|
|
54
|
-
onDateTimeChange?: never;
|
|
55
|
-
}
|
|
56
|
-
export interface ControlledDateTimePickerProps extends BaseDateTimePickerProps {
|
|
57
|
-
name?: string;
|
|
58
|
-
control?: never;
|
|
59
|
-
validation?: never;
|
|
52
|
+
export interface DateTimePickerProps extends BaseDateTimePickerProps {
|
|
60
53
|
selectedDateTime: Dayjs | null;
|
|
61
54
|
onDateTimeChange: (dateTime: Dayjs | null) => void;
|
|
62
55
|
}
|
|
63
|
-
export type DateTimePickerProps = RHFDateTimePickerProps | ControlledDateTimePickerProps;
|
|
64
56
|
export declare const DateTimePicker: React.FC<DateTimePickerProps>;
|
|
65
57
|
export default DateTimePicker;
|
|
@@ -7,4 +7,6 @@ export declare const DateTimePickerSmallSizeDefinition = "\nimport React, { useS
|
|
|
7
7
|
export declare const DateTimePickerWithButtonsDefinition = "\nimport React, { useState } => from 'react';\nimport { DateTimePicker } from './DateTimePicker'; // Ajusta la ruta si es necesario\nimport dayjs from 'dayjs';\nimport { Box, Typography } from '@mui/material';\n\nexport const DateTimePickerWithButtonsExample = () => {\n const [selectedDateTime, setSelectedDateTime] = useState(dayjs());\n return (\n <Box sx={{ width: 300 }}>\n <DateTimePicker\n label=\"Fecha y Hora (Con Botones por Defecto)\"\n selectedDateTime={selectedDateTime}\n onDateTimeChange={setSelectedDateTime}\n slotProps={{\n actionBar: {\n actions: ['clear', 'cancel', 'accept'],\n },\n }}\n />\n <Typography sx={{ mt: 2 }}>\n Seleccionado: ${selectedDateTime ? selectedDateTime.format('YYYY-MM-DD HH:mm') : 'Ninguna'}\n </Typography>\n </Box>\n );\n};\n";
|
|
8
8
|
export declare const DateTimePickerWithCustomButtonTextDefinition = "\nimport React, { useState } from 'react';\nimport { DateTimePicker } from './DateTimePicker'; // Ajusta la ruta si es necesario\nimport dayjs from 'dayjs';\nimport { Box, Typography } from '@mui/material';\n\nexport const DateTimePickerWithCustomButtonTextExample = () => {\n const [selectedDateTime, setSelectedDateTime] = useState(dayjs());\n return (\n <Box sx={{ width: 300 }}>\n <DateTimePicker\n label=\"Fecha y Hora (Botones Personalizados)\"\n selectedDateTime={selectedDateTime}\n onDateTimeChange={setSelectedDateTime}\n clearButtonText=\"Limpiar Todo\"\n cancelButtonText=\"Descartar\"\n acceptButtonText=\"Confirmar Selecci\u00F3n\"\n slotProps={{\n actionBar: {\n actions: ['clear', 'cancel', 'accept'],\n },\n }}\n />\n <Typography sx={{ mt: 2 }}>\n Seleccionado: ${selectedDateTime ? selectedDateTime.format('YYYY-MM-DD HH:mm') : 'Ninguna'}\n </Typography>\n </Box>\n );\n};\n";
|
|
9
9
|
export declare const DateTimePickerEmptyWithMaskDefinition = "\nimport React, { useState } from 'react';\nimport { DateTimePicker } from './DateTimePicker'; // Ajusta la ruta si es necesario\nimport { Dayjs } from 'dayjs';\nimport { Box, Typography } from '@mui/material';\n\nexport const DateTimePickerEmptyWithMaskExample = () => {\n const [selectedDateTime, setSelectedDateTime] = useState<Dayjs | null>(null);\n return (\n <Box sx={{ width: 300 }}>\n <DateTimePicker\n label=\"Fecha y Hora\"\n selectedDateTime={selectedDateTime}\n onDateTimeChange={setSelectedDateTime}\n inputFormat=\"DD/MM/YY HH:mm\"\n />\n <Typography sx={{ mt: 2 }} variant=\"caption\" color=\"text.secondary\">\n Al estar vac\u00EDo, el campo muestra la m\u00E1scara del formato (DD/MM/AA HH:MM).\n </Typography>\n </Box>\n );\n};\n";
|
|
10
|
+
export declare const DateTimePickerWithAllMinutesDefinition = "\nimport React, { useState } from 'react';\nimport { DateTimePicker } from './DateTimePicker'; // Ajusta la ruta si es necesario\nimport dayjs from 'dayjs';\nimport { renderMultiSectionDigitalClockTimeView } from '@mui/x-date-pickers/timeViewRenderers';\nimport { Box, Typography } from '@mui/material';\n\nexport const DateTimePickerWithAllMinutesExample = () => {\n const [selectedDateTime, setSelectedDateTime] = useState(dayjs('2023-06-15T10:00'));\n return (\n <Box sx={{ width: 300 }}>\n <DateTimePicker\n label=\"Fecha y Hora (Todos los minutos)\"\n selectedDateTime={selectedDateTime}\n onDateTimeChange={setSelectedDateTime}\n viewRenderers={{\n hours: renderMultiSectionDigitalClockTimeView,\n minutes: renderMultiSectionDigitalClockTimeView,\n }}\n minutesStep={1}\n timeSteps={{ minutes: 1 }}\n />\n <Typography sx={{ mt: 2 }}>\n Seleccionado: ${selectedDateTime ? selectedDateTime.format('YYYY-MM-DD HH:mm') : 'Ninguna'}\n </Typography>\n </Box>\n );\n};\n";
|
|
11
|
+
export declare const DateTimePicker24hDefinition = "\nimport React, { useState } from 'react';\nimport { DateTimePicker } from './DateTimePicker'; // Ajusta la ruta si es necesario\nimport dayjs from 'dayjs';\nimport { renderMultiSectionDigitalClockTimeView } from '@mui/x-date-pickers/timeViewRenderers';\nimport { Box, Typography } from '@mui/material';\n\nexport const DateTimePicker24hExample = () => {\n const [selectedDateTime, setSelectedDateTime] = useState(dayjs('2023-06-15T10:00'));\n return (\n <Box sx={{ width: 300 }}>\n <DateTimePicker\n label=\"Fecha y Hora (Formato 24h)\"\n selectedDateTime={selectedDateTime}\n onDateTimeChange={setSelectedDateTime}\n viewRenderers={{\n hours: renderMultiSectionDigitalClockTimeView,\n minutes: renderMultiSectionDigitalClockTimeView,\n }}\n minutesStep={1}\n timeSteps={{ minutes: 1 }}\n ampm={false}\n />\n <Typography sx={{ mt: 2 }}>\n Seleccionado: ${selectedDateTime ? selectedDateTime.format('YYYY-MM-DD HH:mm') : 'Ninguna'}\n </Typography>\n </Box>\n );\n};\n";
|
|
10
12
|
export declare const DateTimePickerWithCustomInputFormatDefinition = "\nimport React, { useState } from 'react';\nimport { DateTimePicker } from './DateTimePicker'; // Ajusta la ruta si es necesario\nimport dayjs from 'dayjs';\nimport { Box, Typography } from '@mui/material';\n\nexport const DateTimePickerWithCustomInputFormatExample = () => {\n const [selectedDateTime, setSelectedDateTime] = useState(dayjs());\n return (\n <Box sx={{ width: 300 }}>\n <DateTimePicker\n label=\"Fecha y Hora (Formato dd/MM/YYYY)\"\n selectedDateTime={selectedDateTime}\n onDateTimeChange={setSelectedDateTime}\n inputFormat=\"DD/MM/YYYY HH:mm\" // Formato de fecha personalizado\n />\n <Typography sx={{ mt: 2 }}>\n Seleccionado: ${selectedDateTime ? selectedDateTime.format('YYYY-MM-DD HH:mm') : 'Ninguna'}\n </Typography>\n </Box>\n );\n};\n";
|
|
@@ -1,9 +1,11 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { DateTimeValidationError } from '@mui/x-date-pickers/models';
|
|
2
2
|
/**
|
|
3
3
|
* Traduce el error del DateTimePicker a un mensaje en español. Se usa
|
|
4
4
|
* internamente para poblar `helperText` cuando hay error de validación.
|
|
5
|
+
* Cubre tanto errores de fecha (`minDate`, `maxDate`, etc.) como de hora
|
|
6
|
+
* (`minTime`, `maxTime`, `minutesStep`, etc.).
|
|
5
7
|
*/
|
|
6
|
-
export declare const getDateTimeValidationMessage: (error:
|
|
8
|
+
export declare const getDateTimeValidationMessage: (error: DateTimeValidationError | null) => string;
|
|
7
9
|
/**
|
|
8
10
|
* Construye el `localeText` que MUI acepta para overridear los labels de los
|
|
9
11
|
* botones del popover (Cancel / OK / Clear).
|
|
@@ -1,6 +1,198 @@
|
|
|
1
|
-
|
|
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 { b as buildFormFieldSx } from "../../formField.sx-8_QRnKxv.js";
|
|
39
|
+
import { F as FIELD_INPUT_PADDING_Y } from "../../tokens-BRrcP_p_.js";
|
|
40
|
+
import { r as resolvePreset } from "../../resolvePreset-B-IB0ehH.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 "minTime":
|
|
61
|
+
case "maxTime":
|
|
62
|
+
return "Fecha/hora fuera del rango permitido";
|
|
63
|
+
case "invalidDate":
|
|
64
|
+
return "Formato de fecha/hora inválido";
|
|
65
|
+
case "disableFuture":
|
|
66
|
+
return "No se permiten fechas/horas futuras";
|
|
67
|
+
case "disablePast":
|
|
68
|
+
return "No se permiten fechas/horas pasadas";
|
|
69
|
+
case "minutesStep":
|
|
70
|
+
return "Minutos no válidos para el paso configurado";
|
|
71
|
+
default:
|
|
72
|
+
return "";
|
|
73
|
+
}
|
|
74
|
+
};
|
|
75
|
+
const buildLocaleText = (clearButtonText, cancelButtonText, acceptButtonText) => {
|
|
76
|
+
const text = {};
|
|
77
|
+
if (clearButtonText) text.clearButtonLabel = clearButtonText;
|
|
78
|
+
if (cancelButtonText) text.cancelButtonLabel = cancelButtonText;
|
|
79
|
+
if (acceptButtonText) text.okButtonLabel = acceptButtonText;
|
|
80
|
+
return text;
|
|
81
|
+
};
|
|
82
|
+
const DateTimePicker = (_a) => {
|
|
83
|
+
var _b = _a, {
|
|
84
|
+
label,
|
|
85
|
+
selectedDateTime,
|
|
86
|
+
onDateTimeChange,
|
|
87
|
+
minDateTime,
|
|
88
|
+
maxDateTime,
|
|
89
|
+
disabled,
|
|
90
|
+
readOnly,
|
|
91
|
+
inputFormat,
|
|
92
|
+
borderRadius = 10,
|
|
93
|
+
labelPosition = "outside",
|
|
94
|
+
size = "small",
|
|
95
|
+
helperText,
|
|
96
|
+
error: errorProp,
|
|
97
|
+
sx,
|
|
98
|
+
className,
|
|
99
|
+
preset,
|
|
100
|
+
adapterLocale,
|
|
101
|
+
clearButtonText,
|
|
102
|
+
cancelButtonText,
|
|
103
|
+
acceptButtonText,
|
|
104
|
+
minutesStep,
|
|
105
|
+
minTime,
|
|
106
|
+
ampm = false,
|
|
107
|
+
viewRenderers,
|
|
108
|
+
timeSteps,
|
|
109
|
+
views,
|
|
110
|
+
textFieldProps,
|
|
111
|
+
slotProps: slotPropsProp
|
|
112
|
+
} = _b, rest = __objRest(_b, [
|
|
113
|
+
"label",
|
|
114
|
+
"selectedDateTime",
|
|
115
|
+
"onDateTimeChange",
|
|
116
|
+
"minDateTime",
|
|
117
|
+
"maxDateTime",
|
|
118
|
+
"disabled",
|
|
119
|
+
"readOnly",
|
|
120
|
+
"inputFormat",
|
|
121
|
+
"borderRadius",
|
|
122
|
+
"labelPosition",
|
|
123
|
+
"size",
|
|
124
|
+
"helperText",
|
|
125
|
+
"error",
|
|
126
|
+
"sx",
|
|
127
|
+
"className",
|
|
128
|
+
"preset",
|
|
129
|
+
"adapterLocale",
|
|
130
|
+
"clearButtonText",
|
|
131
|
+
"cancelButtonText",
|
|
132
|
+
"acceptButtonText",
|
|
133
|
+
"minutesStep",
|
|
134
|
+
"minTime",
|
|
135
|
+
"ampm",
|
|
136
|
+
"viewRenderers",
|
|
137
|
+
"timeSteps",
|
|
138
|
+
"views",
|
|
139
|
+
"textFieldProps",
|
|
140
|
+
"slotProps"
|
|
141
|
+
]);
|
|
142
|
+
const [validationError, setValidationError] = React__default.useState(null);
|
|
143
|
+
const validationErrorMessage = useMemo(
|
|
144
|
+
() => getDateTimeValidationMessage(validationError),
|
|
145
|
+
[validationError]
|
|
146
|
+
);
|
|
147
|
+
const customLocaleText = useMemo(
|
|
148
|
+
() => buildLocaleText(clearButtonText, cancelButtonText, acceptButtonText),
|
|
149
|
+
[clearButtonText, cancelButtonText, acceptButtonText]
|
|
150
|
+
);
|
|
151
|
+
const theme = useTheme();
|
|
152
|
+
const presetSx = resolvePreset("DateTimePicker", preset, theme);
|
|
153
|
+
const mergedSx = [
|
|
154
|
+
buildDateTimePickerSx(borderRadius, labelPosition),
|
|
155
|
+
...presetSx ? [presetSx] : [],
|
|
156
|
+
...Array.isArray(sx) ? sx : sx ? [sx] : []
|
|
157
|
+
];
|
|
158
|
+
const finalError = !!validationErrorMessage || !!errorProp;
|
|
159
|
+
const finalHelperText = validationErrorMessage || helperText;
|
|
160
|
+
return /* @__PURE__ */ jsx(LocalizationProvider, { dateAdapter: AdapterDayjs, adapterLocale, children: /* @__PURE__ */ jsx(
|
|
161
|
+
DateTimePicker$1,
|
|
162
|
+
__spreadValues({
|
|
163
|
+
className,
|
|
164
|
+
label,
|
|
165
|
+
value: selectedDateTime,
|
|
166
|
+
onChange: onDateTimeChange,
|
|
167
|
+
onError: setValidationError,
|
|
168
|
+
minDateTime,
|
|
169
|
+
maxDateTime,
|
|
170
|
+
minutesStep,
|
|
171
|
+
disabled,
|
|
172
|
+
readOnly,
|
|
173
|
+
minTime,
|
|
174
|
+
format: inputFormat != null ? inputFormat : "DD/MM/YYYY HH:mm",
|
|
175
|
+
ampm,
|
|
176
|
+
viewRenderers,
|
|
177
|
+
timeSteps,
|
|
178
|
+
views,
|
|
179
|
+
sx: mergedSx,
|
|
180
|
+
slotProps: __spreadProps(__spreadValues({}, slotPropsProp), {
|
|
181
|
+
textField: __spreadProps(__spreadValues(__spreadValues({
|
|
182
|
+
fullWidth: true,
|
|
183
|
+
size,
|
|
184
|
+
variant: "outlined"
|
|
185
|
+
}, slotPropsProp == null ? void 0 : slotPropsProp.textField), textFieldProps), {
|
|
186
|
+
error: !!finalError,
|
|
187
|
+
helperText: finalHelperText
|
|
188
|
+
})
|
|
189
|
+
}),
|
|
190
|
+
localeText: customLocaleText
|
|
191
|
+
}, rest)
|
|
192
|
+
) });
|
|
193
|
+
};
|
|
2
194
|
export {
|
|
3
|
-
|
|
4
|
-
|
|
195
|
+
DateTimePicker,
|
|
196
|
+
DateTimePicker as default
|
|
5
197
|
};
|
|
6
198
|
//# sourceMappingURL=DateTimePicker.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DateTimePicker.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
|
|
1
|
+
{"version":3,"file":"DateTimePicker.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 { DateTimeValidationError } 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 * Cubre tanto errores de fecha (`minDate`, `maxDate`, etc.) como de hora\n * (`minTime`, `maxTime`, `minutesStep`, etc.).\n */\nexport const getDateTimeValidationMessage = (\n error: DateTimeValidationError | null,\n): string => {\n switch (error) {\n case 'minDate':\n case 'maxDate':\n case 'minTime':\n case 'maxTime':\n return 'Fecha/hora fuera del rango permitido';\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 case 'minutesStep':\n return 'Minutos no válidos para el paso configurado';\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 type { DateTimeValidationError } from '@mui/x-date-pickers/models';\nimport { Dayjs } from 'dayjs';\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 /** Si es true usa formato 12h (AM/PM), false = 24h. Default: false. */\n ampm?: boolean;\n viewRenderers?: MuiDateTimePickerProps['viewRenderers'];\n timeSteps?: MuiDateTimePickerProps['timeSteps'];\n /**\n * Vistas a mostrar en el popover. Default: todas (year, month, day, hours, minutes).\n * Ej: `['hours']` solo permite elegir la hora. `['hours','minutes']` oculta el calendar.\n */\n views?: MuiDateTimePickerProps['views'];\n textFieldProps?: Record<string, any>;\n /** Passthrough completo a slotProps del MuiDateTimePicker. */\n slotProps?: MuiDateTimePickerProps['slotProps'];\n}\n\n// ── API pública ──────────────────────────────────────────────────────────\nexport interface DateTimePickerProps extends BaseDateTimePickerProps {\n selectedDateTime: Dayjs | null;\n onDateTimeChange: (dateTime: Dayjs | null) => void;\n}\n\nexport const DateTimePicker: React.FC<DateTimePickerProps> = ({\n label,\n selectedDateTime,\n onDateTimeChange,\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 ampm = false,\n viewRenderers,\n timeSteps,\n views,\n textFieldProps,\n slotProps: slotPropsProp,\n ...rest\n}) => {\n const [validationError, setValidationError] = React.useState<DateTimeValidationError | 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 ? [sx] : []),\n ];\n\n const finalError = !!validationErrorMessage || !!errorProp;\n const finalHelperText = validationErrorMessage || helperText;\n\n return (\n <LocalizationProvider dateAdapter={AdapterDayjs} adapterLocale={adapterLocale}>\n <MuiDateTimePicker\n className={className}\n label={label}\n value={selectedDateTime}\n onChange={onDateTimeChange}\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 ampm={ampm}\n viewRenderers={viewRenderers}\n timeSteps={timeSteps}\n views={views}\n sx={mergedSx}\n slotProps={{\n ...slotPropsProp,\n textField: {\n fullWidth: true,\n size,\n variant: 'outlined',\n ...(slotPropsProp?.textField as Record<string, any> | undefined),\n ...textFieldProps,\n error: !!finalError,\n helperText: finalHelperText,\n } as any,\n }}\n localeText={customLocaleText}\n {...rest}\n />\n </LocalizationProvider>\n );\n};\n\nexport default DateTimePicker;\n"],"names":["React","MuiDateTimePicker"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
export { DateTimePicker, default } from './DateTimePicker';
|
|
2
|
-
export type { DateTimePickerProps, BaseDateTimePickerProps,
|
|
2
|
+
export type { DateTimePickerProps, BaseDateTimePickerProps, LabelPosition, DateTimePickerSize, } from './DateTimePicker';
|
|
@@ -6,7 +6,7 @@ const material = require("@mui/material");
|
|
|
6
6
|
const styles = require("@mui/material/styles");
|
|
7
7
|
const ChevronLeftIcon = require("@mui/icons-material/ChevronLeft");
|
|
8
8
|
const ChevronRightIcon = require("@mui/icons-material/ChevronRight");
|
|
9
|
-
const resolvePreset = require("../../resolvePreset-
|
|
9
|
+
const resolvePreset = require("../../resolvePreset-CT3kU-K2.cjs");
|
|
10
10
|
const DrawerContext = React.createContext(null);
|
|
11
11
|
function useDrawerContext() {
|
|
12
12
|
const ctx = React.useContext(DrawerContext);
|
|
@@ -61,7 +61,7 @@ function buildDrawerItemSx({
|
|
|
61
61
|
{ duration: 150 }
|
|
62
62
|
),
|
|
63
63
|
"&:hover": {
|
|
64
|
-
backgroundColor: danger ? theme.palette.error.
|
|
64
|
+
backgroundColor: danger ? styles.alpha(theme.palette.error.main, 0.08) : theme.palette.action.hover
|
|
65
65
|
},
|
|
66
66
|
"& .drawer-item__icon": {
|
|
67
67
|
display: "flex",
|
|
@@ -94,6 +94,7 @@ function Drawer({
|
|
|
94
94
|
onClose,
|
|
95
95
|
expandedWidth = 260,
|
|
96
96
|
collapsedWidth = 72,
|
|
97
|
+
elevation,
|
|
97
98
|
showCollapseButton,
|
|
98
99
|
header,
|
|
99
100
|
logo,
|
|
@@ -128,10 +129,13 @@ function Drawer({
|
|
|
128
129
|
anchor,
|
|
129
130
|
open: openProp,
|
|
130
131
|
onClose,
|
|
132
|
+
elevation,
|
|
131
133
|
className,
|
|
132
134
|
sx: rootSx,
|
|
133
|
-
|
|
134
|
-
|
|
135
|
+
slotProps: {
|
|
136
|
+
paper: {
|
|
137
|
+
sx: paperSx
|
|
138
|
+
}
|
|
135
139
|
},
|
|
136
140
|
children: [
|
|
137
141
|
(logo || shouldShowToggle) && /* @__PURE__ */ jsxRuntime.jsxs(
|
|
@@ -209,6 +213,7 @@ function Drawer({
|
|
|
209
213
|
function DrawerItem({
|
|
210
214
|
icon,
|
|
211
215
|
label,
|
|
216
|
+
tooltipText,
|
|
212
217
|
onClick,
|
|
213
218
|
active = false,
|
|
214
219
|
danger = false,
|
|
@@ -241,7 +246,7 @@ function DrawerItem({
|
|
|
241
246
|
className,
|
|
242
247
|
sx: mergedSx,
|
|
243
248
|
children: [
|
|
244
|
-
icon
|
|
249
|
+
icon && /* @__PURE__ */ jsxRuntime.jsx(material.Box, { className: "drawer-item__icon", component: "span", children: icon }),
|
|
245
250
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
246
251
|
material.Typography,
|
|
247
252
|
{
|
|
@@ -256,8 +261,9 @@ function DrawerItem({
|
|
|
256
261
|
]
|
|
257
262
|
}
|
|
258
263
|
);
|
|
259
|
-
|
|
260
|
-
|
|
264
|
+
const resolvedTooltip = tooltipText != null ? tooltipText : typeof label === "string" ? label : void 0;
|
|
265
|
+
if (collapsed && resolvedTooltip) {
|
|
266
|
+
return /* @__PURE__ */ jsxRuntime.jsx(material.Tooltip, { title: resolvedTooltip, placement: "right", arrow: true, children: content });
|
|
261
267
|
}
|
|
262
268
|
return content;
|
|
263
269
|
}
|