@soyfri/shared-library 2.0.0-beta.3 → 2.0.0-beta.31
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/Alert-B3SMPD1s.cjs +31 -0
- package/Alert-B3SMPD1s.cjs.map +1 -0
- package/Alert-YsPScpSE.js +32 -0
- package/Alert-YsPScpSE.js.map +1 -0
- package/Autocomplete-C_lW1VER.js +337 -0
- package/Autocomplete-C_lW1VER.js.map +1 -0
- package/Autocomplete-CejWztBY.cjs +336 -0
- package/Autocomplete-CejWztBY.cjs.map +1 -0
- package/Avatar-Dw5rzayR.cjs +166 -0
- package/Avatar-Dw5rzayR.cjs.map +1 -0
- package/Avatar-H8akSege.js +167 -0
- package/Avatar-H8akSege.js.map +1 -0
- package/Button-C17mExpd.cjs.map +1 -1
- package/Button-UkkP-bNw.js.map +1 -1
- package/Card-DYKGY-NG.js +116 -0
- package/Card-DYKGY-NG.js.map +1 -0
- package/Card-Dr1-ATRY.cjs +115 -0
- package/Card-Dr1-ATRY.cjs.map +1 -0
- package/Checkbox-BCqMFWt4.cjs +187 -0
- package/Checkbox-BCqMFWt4.cjs.map +1 -0
- package/Checkbox-gB5YKkVo.js +188 -0
- package/Checkbox-gB5YKkVo.js.map +1 -0
- package/{components/DateRangePicker/DateRangePicker.js → Chip-OPYQ1uQ_.js} +33 -35
- package/Chip-OPYQ1uQ_.js.map +1 -0
- package/{components/DateRangePicker/DateRangePicker.cjs → Chip-qoJLDiva.cjs} +33 -36
- package/Chip-qoJLDiva.cjs.map +1 -0
- package/DatePicker-_IGWc3I5.js +178 -0
- package/DatePicker-_IGWc3I5.js.map +1 -0
- package/DatePicker-t7uDTZMl.cjs +177 -0
- package/DatePicker-t7uDTZMl.cjs.map +1 -0
- package/DateTimePicker-BxQyjTCY.cjs +229 -0
- package/DateTimePicker-BxQyjTCY.cjs.map +1 -0
- package/DateTimePicker-CrmWav_j.js +230 -0
- package/DateTimePicker-CrmWav_j.js.map +1 -0
- package/Input-CScC87J5.cjs +185 -0
- package/Input-CScC87J5.cjs.map +1 -0
- package/Input-DP_fKl38.js +186 -0
- package/Input-DP_fKl38.js.map +1 -0
- package/Modal-BFpX5AFV.js +347 -0
- package/Modal-BFpX5AFV.js.map +1 -0
- package/Modal-CkpuI8ns.cjs +346 -0
- package/Modal-CkpuI8ns.cjs.map +1 -0
- package/RadioGroup-Dd0rHXSX.cjs +202 -0
- package/RadioGroup-Dd0rHXSX.cjs.map +1 -0
- package/RadioGroup-bO-ahP9T.js +203 -0
- package/RadioGroup-bO-ahP9T.js.map +1 -0
- package/Select-BY5Y0qZ1.js +376 -0
- package/Select-BY5Y0qZ1.js.map +1 -0
- package/Select-CURrHSyl.cjs +375 -0
- package/Select-CURrHSyl.cjs.map +1 -0
- package/Spinner-B6sThC1p.js +74 -0
- package/Spinner-B6sThC1p.js.map +1 -0
- package/Spinner-D7qRmNS9.cjs +73 -0
- package/Spinner-D7qRmNS9.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-B3nXpuRl.cjs +88 -0
- package/StatusMessage-B3nXpuRl.cjs.map +1 -0
- package/StatusMessage-D0WgSBx7.js +89 -0
- package/StatusMessage-D0WgSBx7.js.map +1 -0
- package/Step-BArsou1V.js +301 -0
- package/Step-BArsou1V.js.map +1 -0
- package/Step-Nd7SJbRZ.cjs +300 -0
- package/Step-Nd7SJbRZ.cjs.map +1 -0
- package/Switch-CQFOopYy.cjs +182 -0
- package/Switch-CQFOopYy.cjs.map +1 -0
- package/Switch-D72dpkH2.js +183 -0
- package/Switch-D72dpkH2.js.map +1 -0
- package/Tab-BbP8jBcK.cjs +110 -0
- package/Tab-BbP8jBcK.cjs.map +1 -0
- package/Tab-BxSxKJsP.js +111 -0
- package/Tab-BxSxKJsP.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/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/Alert/Alert.cjs +6 -0
- package/components/Alert/Alert.cjs.map +1 -0
- package/components/Alert/Alert.d.ts +31 -0
- package/components/Alert/Alert.js +6 -0
- package/components/Alert/Alert.js.map +1 -0
- package/components/Alert/index.d.ts +2 -0
- package/components/Alert.d.ts +6 -0
- 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 +4 -311
- package/components/Autocomplete/Autocomplete.cjs.map +1 -1
- package/components/Autocomplete/Autocomplete.d.ts +8 -6
- package/components/Autocomplete/Autocomplete.helpers.d.ts +8 -4
- package/components/Autocomplete/Autocomplete.js +4 -311
- package/components/Autocomplete/Autocomplete.js.map +1 -1
- package/components/Autocomplete/_parts/AutocompleteOption.d.ts +5 -8
- package/components/Autocomplete/index.d.ts +1 -1
- package/components/Avatar/Avatar.cjs +2 -160
- package/components/Avatar/Avatar.cjs.map +1 -1
- package/components/Avatar/Avatar.d.ts +16 -1
- package/components/Avatar/Avatar.js +2 -160
- 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 +4 -184
- package/components/Card/Card.cjs.map +1 -1
- package/components/Card/Card.d.ts +21 -50
- package/components/Card/Card.js +4 -184
- 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/components/Checkbox/Checkbox.cjs +6 -0
- package/components/Checkbox/Checkbox.cjs.map +1 -0
- package/components/Checkbox/Checkbox.d.ts +55 -0
- package/components/Checkbox/Checkbox.js +6 -0
- 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 +4 -72
- package/components/Chip/Chip.cjs.map +1 -1
- package/components/Chip/Chip.js +3 -71
- 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 +1 -0
- package/components/DatePicker/DatePicker.cjs +3 -200
- package/components/DatePicker/DatePicker.cjs.map +1 -1
- package/components/DatePicker/DatePicker.d.ts +1 -13
- package/components/DatePicker/DatePicker.js +3 -200
- package/components/DatePicker/DatePicker.js.map +1 -1
- package/components/DatePicker/index.d.ts +1 -1
- package/components/DateTimePicker/DateTimePicker.cjs +3 -219
- package/components/DateTimePicker/DateTimePicker.cjs.map +1 -1
- package/components/DateTimePicker/DateTimePicker.d.ts +10 -6
- package/components/DateTimePicker/DateTimePicker.definitions.d.ts +2 -0
- package/components/DateTimePicker/DateTimePicker.helpers.d.ts +4 -2
- package/components/DateTimePicker/DateTimePicker.js +3 -219
- package/components/DateTimePicker/DateTimePicker.js.map +1 -1
- package/components/DateTimePicker/index.d.ts +1 -1
- package/components/Drawer/Drawer.cjs +25 -24
- package/components/Drawer/Drawer.cjs.map +1 -1
- package/components/Drawer/Drawer.d.ts +8 -1
- package/components/Drawer/Drawer.js +26 -25
- 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 +3 -172
- package/components/Input/Input.cjs.map +1 -1
- package/components/Input/Input.d.ts +9 -2
- package/components/Input/Input.definitions.d.ts +1 -0
- package/components/Input/Input.helpers.d.ts +3 -3
- package/components/Input/Input.js +3 -172
- 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 +7 -317
- package/components/Modal/Modal.cjs.map +1 -1
- package/components/Modal/Modal.d.ts +20 -5
- package/components/Modal/Modal.js +6 -316
- 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 +3 -1
- package/components/Modal.d.ts +4 -0
- package/components/RadioGroup/RadioGroup.cjs +6 -0
- package/components/RadioGroup/RadioGroup.cjs.map +1 -0
- package/components/RadioGroup/RadioGroup.d.ts +59 -0
- package/components/RadioGroup/RadioGroup.definitions.d.ts +6 -0
- package/components/RadioGroup/RadioGroup.js +6 -0
- package/components/RadioGroup/RadioGroup.js.map +1 -0
- package/components/RadioGroup/RadioGroup.sx.d.ts +20 -0
- package/components/RadioGroup/index.d.ts +2 -0
- package/components/RadioGroup.d.ts +6 -0
- package/components/Select/Select.cjs +4 -445
- package/components/Select/Select.cjs.map +1 -1
- package/components/Select/Select.d.ts +37 -18
- package/components/Select/Select.helpers.d.ts +5 -19
- package/components/Select/Select.js +4 -445
- package/components/Select/Select.js.map +1 -1
- package/components/Select/index.d.ts +1 -1
- package/components/Spinner/Spinner.cjs +6 -0
- package/components/Spinner/Spinner.cjs.map +1 -0
- package/components/Spinner/Spinner.d.ts +26 -0
- package/components/Spinner/Spinner.js +6 -0
- package/components/Spinner/Spinner.js.map +1 -0
- package/components/Spinner/index.d.ts +2 -0
- package/components/Spinner.d.ts +6 -0
- package/components/Stat/Stat.cjs +4 -83
- package/components/Stat/Stat.cjs.map +1 -1
- package/components/Stat/Stat.js +3 -82
- 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 +4 -77
- package/components/StatusMessage/StatusMessage.cjs.map +1 -1
- package/components/StatusMessage/StatusMessage.d.ts +20 -36
- 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 +8 -47
- package/components/Stepper/Stepper.cjs.map +1 -1
- package/components/Stepper/Stepper.d.ts +9 -8
- package/components/Stepper/Stepper.js +7 -46
- package/components/Stepper/Stepper.js.map +1 -1
- package/{hooks/Wizard/WizardContext.d.ts → components/Stepper/StepperContext.d.ts} +29 -23
- 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 +6 -0
- package/components/Switch/Switch.cjs.map +1 -0
- package/components/Switch/Switch.d.ts +48 -0
- package/components/Switch/Switch.definitions.d.ts +7 -0
- package/components/Switch/Switch.js +6 -0
- package/components/Switch/Switch.js.map +1 -0
- package/components/Switch/Switch.sx.d.ts +22 -0
- package/components/Switch/Switch.types.d.ts +1 -0
- package/components/Switch/index.d.ts +2 -0
- package/components/Switch.d.ts +6 -0
- 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 +5 -94
- package/components/Tabs/Tabs.cjs.map +1 -1
- package/components/Tabs/Tabs.d.ts +21 -16
- package/components/Tabs/Tabs.js +4 -93
- 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 +96 -6
- package/index.cjs.map +1 -1
- package/index.d.ts +36 -0
- package/index.js +70 -4
- package/index.js.map +1 -1
- package/local/affiliations/affiliations.dev.soyfri.com-key.pem +28 -0
- package/local/affiliations/affiliations.dev.soyfri.com.pem +27 -0
- package/local/aficiliaciones/afiliaciones.dev.soyfri.com-key.pem +28 -0
- package/local/aficiliaciones/afiliaciones.dev.soyfri.com.pem +27 -0
- package/local/afiliaciones/afiliaciones.dev.soyfri.com-key.pem +28 -0
- package/local/afiliaciones/afiliaciones.dev.soyfri.com.pem +27 -0
- package/local/root/rootCA-key.pem +40 -0
- package/local/root/rootCA.pem +30 -0
- package/local/soporte/supportweb.dev.soyfri.com-key.pem +28 -0
- package/local/soporte/supportweb.dev.soyfri.com.pem +27 -0
- package/local/support/supportweb.dev.soyfri.com-key.pem +28 -0
- package/local/support/supportweb.dev.soyfri.com.pem +27 -0
- 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 +3 -1
- package/package.json +78 -73
- 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/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/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/DateRangePicker/DateRangePicker.cjs.map +0 -1
- package/components/DateRangePicker/DateRangePicker.d.ts +0 -15
- package/components/DateRangePicker/DateRangePicker.definitions.d.ts +0 -6
- package/components/DateRangePicker/DateRangePicker.js.map +0 -1
- package/components/DateRangePicker/index.d.ts +0 -1
- package/components/DateRangePicker.d.ts +0 -2
- 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/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/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
|
@@ -17,11 +17,11 @@ var __spreadValues = (a, b) => {
|
|
|
17
17
|
return a;
|
|
18
18
|
};
|
|
19
19
|
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
20
|
-
import { jsx
|
|
21
|
-
import
|
|
22
|
-
import { AppBar as AppBar$1, Toolbar,
|
|
20
|
+
import { jsx } from "react/jsx-runtime";
|
|
21
|
+
import { createContext, useContext, useMemo } from "react";
|
|
22
|
+
import { AppBar as AppBar$1, Toolbar, Tooltip, IconButton } from "@mui/material";
|
|
23
23
|
import { useTheme } from "@mui/material/styles";
|
|
24
|
-
import { r as resolvePreset } from "../../resolvePreset-
|
|
24
|
+
import { r as resolvePreset } from "../../resolvePreset-K6_BfWHD.js";
|
|
25
25
|
import MenuIcon from "@mui/icons-material/Menu";
|
|
26
26
|
import MenuOpenIcon from "@mui/icons-material/MenuOpen";
|
|
27
27
|
const AppBarContext = createContext(null);
|
|
@@ -59,14 +59,12 @@ function AppBar({
|
|
|
59
59
|
preset,
|
|
60
60
|
sx,
|
|
61
61
|
toolbarSx,
|
|
62
|
-
className,
|
|
63
62
|
appBarProps
|
|
64
63
|
}) {
|
|
65
64
|
const theme = useTheme();
|
|
66
65
|
const presetSx = resolvePreset("AppBar", preset, theme);
|
|
67
|
-
const transparent = color === "transparent";
|
|
68
66
|
const rootSx = [
|
|
69
|
-
buildAppBarSx({ height, transparent }),
|
|
67
|
+
buildAppBarSx({ height, transparent: color === "transparent" }),
|
|
70
68
|
...presetSx ? [presetSx] : [],
|
|
71
69
|
...Array.isArray(sx) ? sx : sx ? [sx] : []
|
|
72
70
|
];
|
|
@@ -78,101 +76,14 @@ function AppBar({
|
|
|
78
76
|
AppBar$1,
|
|
79
77
|
__spreadProps(__spreadValues({
|
|
80
78
|
position,
|
|
81
|
-
color
|
|
79
|
+
color,
|
|
82
80
|
elevation,
|
|
83
|
-
className,
|
|
84
81
|
sx: rootSx
|
|
85
82
|
}, appBarProps), {
|
|
86
83
|
children: /* @__PURE__ */ jsx(Toolbar, { sx: toolbarSx, children })
|
|
87
84
|
})
|
|
88
85
|
) });
|
|
89
86
|
}
|
|
90
|
-
function AppBarBrand({
|
|
91
|
-
logo,
|
|
92
|
-
title,
|
|
93
|
-
subtitle,
|
|
94
|
-
onClick,
|
|
95
|
-
hideTitleOnMobile = true,
|
|
96
|
-
sx,
|
|
97
|
-
className
|
|
98
|
-
}) {
|
|
99
|
-
const clickable = !!onClick;
|
|
100
|
-
const rootSx = [
|
|
101
|
-
{
|
|
102
|
-
display: "flex",
|
|
103
|
-
alignItems: "center",
|
|
104
|
-
gap: 1.25,
|
|
105
|
-
cursor: clickable ? "pointer" : "default",
|
|
106
|
-
userSelect: "none",
|
|
107
|
-
minWidth: 0
|
|
108
|
-
},
|
|
109
|
-
...Array.isArray(sx) ? sx : sx ? [sx] : []
|
|
110
|
-
];
|
|
111
|
-
return /* @__PURE__ */ jsxs(
|
|
112
|
-
Box,
|
|
113
|
-
{
|
|
114
|
-
role: clickable ? "button" : void 0,
|
|
115
|
-
tabIndex: clickable ? 0 : void 0,
|
|
116
|
-
onClick,
|
|
117
|
-
onKeyDown: (event) => {
|
|
118
|
-
if (!clickable) return;
|
|
119
|
-
if (event.key === "Enter" || event.key === " ") {
|
|
120
|
-
event.preventDefault();
|
|
121
|
-
onClick == null ? void 0 : onClick(event);
|
|
122
|
-
}
|
|
123
|
-
},
|
|
124
|
-
className,
|
|
125
|
-
sx: rootSx,
|
|
126
|
-
children: [
|
|
127
|
-
logo && /* @__PURE__ */ jsx(
|
|
128
|
-
Box,
|
|
129
|
-
{
|
|
130
|
-
component: "span",
|
|
131
|
-
sx: {
|
|
132
|
-
display: "flex",
|
|
133
|
-
alignItems: "center",
|
|
134
|
-
flexShrink: 0
|
|
135
|
-
},
|
|
136
|
-
children: logo
|
|
137
|
-
}
|
|
138
|
-
),
|
|
139
|
-
(title || subtitle) && /* @__PURE__ */ jsxs(
|
|
140
|
-
Box,
|
|
141
|
-
{
|
|
142
|
-
sx: {
|
|
143
|
-
display: hideTitleOnMobile ? { xs: "none", sm: "flex" } : "flex",
|
|
144
|
-
flexDirection: "column",
|
|
145
|
-
minWidth: 0,
|
|
146
|
-
lineHeight: 1.2
|
|
147
|
-
},
|
|
148
|
-
children: [
|
|
149
|
-
title && /* @__PURE__ */ jsx(
|
|
150
|
-
Typography,
|
|
151
|
-
{
|
|
152
|
-
component: "span",
|
|
153
|
-
variant: "subtitle1",
|
|
154
|
-
noWrap: true,
|
|
155
|
-
sx: { fontWeight: 700 },
|
|
156
|
-
children: title
|
|
157
|
-
}
|
|
158
|
-
),
|
|
159
|
-
subtitle && /* @__PURE__ */ jsx(
|
|
160
|
-
Typography,
|
|
161
|
-
{
|
|
162
|
-
component: "span",
|
|
163
|
-
variant: "caption",
|
|
164
|
-
color: "text.secondary",
|
|
165
|
-
noWrap: true,
|
|
166
|
-
children: subtitle
|
|
167
|
-
}
|
|
168
|
-
)
|
|
169
|
-
]
|
|
170
|
-
}
|
|
171
|
-
)
|
|
172
|
-
]
|
|
173
|
-
}
|
|
174
|
-
);
|
|
175
|
-
}
|
|
176
87
|
function AppBarMenuToggle({
|
|
177
88
|
onClick,
|
|
178
89
|
menuOpen,
|
|
@@ -208,138 +119,10 @@ function AppBarMenuToggle({
|
|
|
208
119
|
}
|
|
209
120
|
) }) });
|
|
210
121
|
}
|
|
211
|
-
function computeInitials(name) {
|
|
212
|
-
var _a, _b, _c, _d;
|
|
213
|
-
if (typeof name !== "string") return "?";
|
|
214
|
-
const parts = name.trim().split(/\s+/).filter(Boolean);
|
|
215
|
-
if (parts.length === 0) return "?";
|
|
216
|
-
const first = (_b = (_a = parts[0]) == null ? void 0 : _a.charAt(0)) != null ? _b : "";
|
|
217
|
-
const last = parts.length > 1 ? (_d = (_c = parts[parts.length - 1]) == null ? void 0 : _c.charAt(0)) != null ? _d : "" : "";
|
|
218
|
-
return (first + last).toUpperCase();
|
|
219
|
-
}
|
|
220
|
-
function AppBarUserMenu({
|
|
221
|
-
user,
|
|
222
|
-
items,
|
|
223
|
-
hideUserHeader = false,
|
|
224
|
-
triggerTooltip = "Cuenta",
|
|
225
|
-
avatarSize = 36,
|
|
226
|
-
menuSx,
|
|
227
|
-
triggerSx,
|
|
228
|
-
className
|
|
229
|
-
}) {
|
|
230
|
-
var _a;
|
|
231
|
-
const [anchorEl, setAnchorEl] = useState(null);
|
|
232
|
-
const open = Boolean(anchorEl);
|
|
233
|
-
const handleOpen = (event) => {
|
|
234
|
-
setAnchorEl(event.currentTarget);
|
|
235
|
-
};
|
|
236
|
-
const handleClose = () => setAnchorEl(null);
|
|
237
|
-
const handleItemClick = (event, item) => {
|
|
238
|
-
var _a2;
|
|
239
|
-
event.stopPropagation();
|
|
240
|
-
(_a2 = item.onClick) == null ? void 0 : _a2.call(item, event);
|
|
241
|
-
handleClose();
|
|
242
|
-
};
|
|
243
|
-
const initials = (_a = user == null ? void 0 : user.initials) != null ? _a : computeInitials(user == null ? void 0 : user.name);
|
|
244
|
-
const showUserHeader = !hideUserHeader && ((user == null ? void 0 : user.name) || (user == null ? void 0 : user.email));
|
|
245
|
-
return /* @__PURE__ */ jsxs(Box, { component: "span", className, children: [
|
|
246
|
-
/* @__PURE__ */ jsx(Tooltip, { title: triggerTooltip, arrow: true, children: /* @__PURE__ */ jsx(
|
|
247
|
-
IconButton,
|
|
248
|
-
{
|
|
249
|
-
onClick: handleOpen,
|
|
250
|
-
size: "small",
|
|
251
|
-
"aria-label": triggerTooltip,
|
|
252
|
-
"aria-haspopup": "menu",
|
|
253
|
-
"aria-expanded": open || void 0,
|
|
254
|
-
sx: [{ p: 0.5 }, ...Array.isArray(triggerSx) ? triggerSx : triggerSx ? [triggerSx] : []],
|
|
255
|
-
children: /* @__PURE__ */ jsx(
|
|
256
|
-
Avatar,
|
|
257
|
-
{
|
|
258
|
-
src: user == null ? void 0 : user.avatarUrl,
|
|
259
|
-
sx: {
|
|
260
|
-
width: avatarSize,
|
|
261
|
-
height: avatarSize,
|
|
262
|
-
fontSize: avatarSize * 0.4,
|
|
263
|
-
fontWeight: 600
|
|
264
|
-
},
|
|
265
|
-
children: !(user == null ? void 0 : user.avatarUrl) && initials
|
|
266
|
-
}
|
|
267
|
-
)
|
|
268
|
-
}
|
|
269
|
-
) }),
|
|
270
|
-
/* @__PURE__ */ jsxs(
|
|
271
|
-
Menu,
|
|
272
|
-
{
|
|
273
|
-
anchorEl,
|
|
274
|
-
open,
|
|
275
|
-
onClose: handleClose,
|
|
276
|
-
anchorOrigin: { vertical: "bottom", horizontal: "right" },
|
|
277
|
-
transformOrigin: { vertical: "top", horizontal: "right" },
|
|
278
|
-
slotProps: {
|
|
279
|
-
paper: {
|
|
280
|
-
sx: __spreadValues({ minWidth: 240 }, menuSx)
|
|
281
|
-
}
|
|
282
|
-
},
|
|
283
|
-
children: [
|
|
284
|
-
showUserHeader && /* @__PURE__ */ jsxs(
|
|
285
|
-
Box,
|
|
286
|
-
{
|
|
287
|
-
sx: {
|
|
288
|
-
px: 2,
|
|
289
|
-
py: 1.25,
|
|
290
|
-
display: "flex",
|
|
291
|
-
flexDirection: "column",
|
|
292
|
-
gap: 0.25
|
|
293
|
-
},
|
|
294
|
-
children: [
|
|
295
|
-
(user == null ? void 0 : user.name) && /* @__PURE__ */ jsx(Typography, { variant: "subtitle2", noWrap: true, sx: { fontWeight: 700 }, children: user.name }),
|
|
296
|
-
(user == null ? void 0 : user.email) && /* @__PURE__ */ jsx(Typography, { variant: "caption", color: "text.secondary", noWrap: true, children: user.email })
|
|
297
|
-
]
|
|
298
|
-
}
|
|
299
|
-
),
|
|
300
|
-
showUserHeader && /* @__PURE__ */ jsx(Divider, {}),
|
|
301
|
-
items.map((item, idx) => {
|
|
302
|
-
var _a2;
|
|
303
|
-
const key = (_a2 = item.key) != null ? _a2 : `${String(item.label)}-${idx}`;
|
|
304
|
-
const node = /* @__PURE__ */ jsxs(
|
|
305
|
-
MenuItem,
|
|
306
|
-
{
|
|
307
|
-
disabled: item.disabled,
|
|
308
|
-
onClick: (event) => handleItemClick(event, item),
|
|
309
|
-
sx: (theme) => ({
|
|
310
|
-
color: item.danger ? theme.palette.error.main : "inherit",
|
|
311
|
-
"& .MuiListItemIcon-root": {
|
|
312
|
-
color: item.danger ? theme.palette.error.main : "inherit",
|
|
313
|
-
minWidth: 32
|
|
314
|
-
}
|
|
315
|
-
}),
|
|
316
|
-
children: [
|
|
317
|
-
item.icon && /* @__PURE__ */ jsx(ListItemIcon, { children: item.icon }),
|
|
318
|
-
/* @__PURE__ */ jsx(ListItemText, { primary: item.label })
|
|
319
|
-
]
|
|
320
|
-
},
|
|
321
|
-
key
|
|
322
|
-
);
|
|
323
|
-
if (item.dividerBefore && idx > 0) {
|
|
324
|
-
return /* @__PURE__ */ jsxs(React__default.Fragment, { children: [
|
|
325
|
-
/* @__PURE__ */ jsx(Divider, {}),
|
|
326
|
-
node
|
|
327
|
-
] }, `${key}-frag`);
|
|
328
|
-
}
|
|
329
|
-
return node;
|
|
330
|
-
})
|
|
331
|
-
]
|
|
332
|
-
}
|
|
333
|
-
)
|
|
334
|
-
] });
|
|
335
|
-
}
|
|
336
122
|
export {
|
|
337
123
|
AppBar,
|
|
338
|
-
AppBarBrand,
|
|
339
124
|
AppBarContext,
|
|
340
125
|
AppBarMenuToggle,
|
|
341
|
-
AppBarUserMenu,
|
|
342
|
-
buildAppBarSx,
|
|
343
126
|
AppBar as default,
|
|
344
127
|
useAppBarContext
|
|
345
128
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AppBar.js","sources":["../../../src/components/AppBar/AppBarContext.ts","../../../src/components/AppBar/AppBar.sx.ts","../../../src/components/AppBar/AppBar.tsx","../../../src/components/AppBar/AppBarBrand.tsx","../../../src/components/AppBar/AppBarMenuToggle.tsx","../../../src/components/AppBar/AppBarUserMenu.tsx"],"sourcesContent":["import { createContext, useContext } from 'react';\n\n/**\n * Context interno del AppBar. Permite que sub-componentes (MenuToggle, etc.)\n * consuman callbacks registrados en el AppBar padre sin tener que pasarlos\n * por props explícitas.\n */\nexport interface AppBarContextValue {\n /** Handler del botón hamburguesa. Si es undefined, el toggle se oculta. */\n onMenuToggle?: () => void;\n /** Estado actual del drawer asociado (usado por el icono del toggle). */\n menuOpen?: boolean;\n}\n\nexport const AppBarContext = createContext<AppBarContextValue | null>(null);\n\n/**\n * Hook para leer el contexto del AppBar. Si se llama fuera de un `<AppBar>`,\n * devuelve un objeto vacío — los sub-componentes caen en modo \"standalone\"\n * con sus defaults en lugar de romper.\n */\nexport function useAppBarContext(): AppBarContextValue {\n const ctx = useContext(AppBarContext);\n return ctx ?? {};\n}\n","import type { SxProps, Theme } from '@mui/material/styles';\n\nexport interface BuildAppBarSxArgs {\n /** Altura en px. Default: 64. */\n height?: number;\n /** Color del AppBar (se pasa al MuiAppBar). */\n transparent?: boolean;\n}\n\n/**\n * sx del root del MuiAppBar. Define altura fija y layout flex del Toolbar\n * interno. El color/elevación se dejan a las props nativas de MuiAppBar.\n */\nexport function buildAppBarSx({\n height = 64,\n transparent = false,\n}: BuildAppBarSxArgs): SxProps<Theme> {\n return (theme) => ({\n minHeight: height,\n justifyContent: 'center',\n backgroundImage: 'none',\n ...(transparent && {\n backgroundColor: 'transparent',\n boxShadow: 'none',\n borderBottom: `1px solid ${theme.palette.divider}`,\n }),\n '& .MuiToolbar-root': {\n minHeight: height,\n gap: 1.5,\n },\n });\n}\n","import React, { useMemo, type ReactNode } from 'react';\nimport {\n AppBar as MuiAppBar,\n Toolbar,\n type AppBarProps as MuiAppBarProps,\n} from '@mui/material';\nimport {\n useTheme,\n type SxProps,\n type Theme,\n} from '@mui/material/styles';\n\nimport { AppBarContext } from './AppBarContext';\nimport { buildAppBarSx } from './AppBar.sx';\nimport { resolvePreset } from '../_shared/resolvePreset';\n\nexport type AppBarPosition = 'fixed' | 'sticky' | 'static' | 'absolute' | 'relative';\nexport type AppBarColor =\n | 'default'\n | 'primary'\n | 'secondary'\n | 'transparent'\n | 'inherit';\n\nexport interface AppBarProps {\n /** Contenido del AppBar (típicamente sub-componentes + acciones custom). */\n children?: ReactNode;\n /** Posicionamiento. Default: `'sticky'`. */\n position?: AppBarPosition;\n /** Color. Default: `'default'`. */\n color?: AppBarColor;\n /** Nivel de sombra. Default: 1. */\n elevation?: number;\n /** Altura en px. Default: 64. */\n height?: number;\n /**\n * Handler del botón hamburguesa. Se expone vía AppBarContext para que el\n * sub-componente `<AppBarMenuToggle>` lo consuma sin prop drilling.\n */\n onMenuToggle?: () => void;\n /** Estado del drawer asociado (para que el icono del toggle cambie). */\n menuOpen?: boolean;\n /**\n * Nombre del preset de estilo registrado en `theme.styles.AppBar`.\n * - `\"default\"` (o ausente) = estilo built-in del paquete.\n */\n preset?: string;\n /** sx del root (se mergea después del preset). */\n sx?: SxProps<Theme>;\n /** sx del Toolbar interno. */\n toolbarSx?: SxProps<Theme>;\n className?: string;\n /** Otras props nativas del MuiAppBar (ej. `enableColorOnDark`). */\n appBarProps?: Omit<\n MuiAppBarProps,\n 'position' | 'color' | 'elevation' | 'sx' | 'children' | 'className'\n >;\n}\n\n/**\n * AppBar (header superior) del paquete. Se diseñó como un shell compositivo\n * — el consumer arma el contenido con los sub-componentes que exporta el\n * paquete (`AppBarBrand`, `AppBarMenuToggle`, `AppBarUserMenu`) + cualquier\n * otra cosa custom.\n *\n * Patrón recomendado para navegación en dashboards:\n *\n * ```tsx\n * <AppBar onMenuToggle={toggleDrawer}>\n * <AppBarMenuToggle />\n * <AppBarBrand logo={<Logo />} title=\"Afiliaciones\" />\n * <Box sx={{ flex: 1 }} />\n * <AppBarUserMenu user={user} items={menuItems} />\n * </AppBar>\n * ```\n */\nexport function AppBar({\n children,\n position = 'sticky',\n color = 'default',\n elevation = 1,\n height = 64,\n onMenuToggle,\n menuOpen,\n preset,\n sx,\n toolbarSx,\n className,\n appBarProps,\n}: AppBarProps) {\n const theme = useTheme();\n const presetSx = resolvePreset('AppBar', preset, theme);\n\n const transparent = color === 'transparent';\n\n const rootSx: SxProps<Theme> = [\n buildAppBarSx({ height, transparent }),\n ...(presetSx ? [presetSx] : []),\n ...(Array.isArray(sx) ? sx : sx ? [sx] : []),\n ];\n\n const contextValue = useMemo(\n () => ({ onMenuToggle, menuOpen }),\n [onMenuToggle, menuOpen],\n );\n\n return (\n <AppBarContext.Provider value={contextValue}>\n <MuiAppBar\n position={position}\n color={color === 'transparent' ? 'transparent' : color}\n elevation={elevation}\n className={className}\n sx={rootSx}\n {...appBarProps}\n >\n <Toolbar sx={toolbarSx}>{children}</Toolbar>\n </MuiAppBar>\n </AppBarContext.Provider>\n );\n}\n\nexport default AppBar;\n","import React, { type ReactNode, type MouseEvent } from 'react';\nimport { Box, Typography } from '@mui/material';\nimport type { SxProps, Theme } from '@mui/material/styles';\n\nexport interface AppBarBrandProps {\n /** Logo (img, svg, componente). Se muestra a la izquierda del título. */\n logo?: ReactNode;\n /** Título del sistema. */\n title?: ReactNode;\n /** Subtítulo opcional (p.ej. nombre de módulo actual). */\n subtitle?: ReactNode;\n /** Handler de click sobre todo el brand (típicamente navega al home). */\n onClick?: (event: MouseEvent<HTMLDivElement>) => void;\n /** Oculta solo el título en viewports pequeños (mantiene el logo). Default: true. */\n hideTitleOnMobile?: boolean;\n sx?: SxProps<Theme>;\n className?: string;\n}\n\n/**\n * Brand del AppBar: combina logo + título + subtítulo opcional con un\n * click handler global (típicamente para navegar al home).\n *\n * ```tsx\n * <AppBarBrand\n * logo={<img src={logo} alt=\"\" height={32} />}\n * title=\"Afiliaciones\"\n * subtitle=\"Panel administrativo\"\n * onClick={() => navigate('/')}\n * />\n * ```\n */\nexport function AppBarBrand({\n logo,\n title,\n subtitle,\n onClick,\n hideTitleOnMobile = true,\n sx,\n className,\n}: AppBarBrandProps) {\n const clickable = !!onClick;\n\n const rootSx: SxProps<Theme> = [\n {\n display: 'flex',\n alignItems: 'center',\n gap: 1.25,\n cursor: clickable ? 'pointer' : 'default',\n userSelect: 'none',\n minWidth: 0,\n },\n ...(Array.isArray(sx) ? sx : sx ? [sx] : []),\n ];\n\n return (\n <Box\n role={clickable ? 'button' : undefined}\n tabIndex={clickable ? 0 : undefined}\n onClick={onClick}\n onKeyDown={(event) => {\n if (!clickable) return;\n if (event.key === 'Enter' || event.key === ' ') {\n event.preventDefault();\n onClick?.(event as unknown as MouseEvent<HTMLDivElement>);\n }\n }}\n className={className}\n sx={rootSx}\n >\n {logo && (\n <Box\n component=\"span\"\n sx={{\n display: 'flex',\n alignItems: 'center',\n flexShrink: 0,\n }}\n >\n {logo}\n </Box>\n )}\n {(title || subtitle) && (\n <Box\n sx={{\n display: hideTitleOnMobile\n ? { xs: 'none', sm: 'flex' }\n : 'flex',\n flexDirection: 'column',\n minWidth: 0,\n lineHeight: 1.2,\n }}\n >\n {title && (\n <Typography\n component=\"span\"\n variant=\"subtitle1\"\n noWrap\n sx={{ fontWeight: 700 }}\n >\n {title}\n </Typography>\n )}\n {subtitle && (\n <Typography\n component=\"span\"\n variant=\"caption\"\n color=\"text.secondary\"\n noWrap\n >\n {subtitle}\n </Typography>\n )}\n </Box>\n )}\n </Box>\n );\n}\n\nexport default AppBarBrand;\n","import React, { type ReactNode } from 'react';\nimport { IconButton, Tooltip } from '@mui/material';\nimport MenuIcon from '@mui/icons-material/Menu';\nimport MenuOpenIcon from '@mui/icons-material/MenuOpen';\nimport type { SxProps, Theme } from '@mui/material/styles';\n\nimport { useAppBarContext } from './AppBarContext';\n\nexport interface AppBarMenuToggleProps {\n /**\n * Callback explícito. Si se omite, se consume del `AppBarContext`. Útil para\n * usar el toggle fuera de un `<AppBar>` (p.ej. en un header custom).\n */\n onClick?: () => void;\n /** Estado del drawer asociado. Si se omite, se lee del `AppBarContext`. */\n menuOpen?: boolean;\n /** Icono custom cuando el drawer está cerrado. Default: `<MenuIcon />`. */\n closedIcon?: ReactNode;\n /** Icono custom cuando el drawer está abierto. Default: `<MenuOpenIcon />`. */\n openIcon?: ReactNode;\n /** Texto de tooltip. Default: \"Menú\". */\n tooltip?: string;\n /** aria-label del botón. Default: el mismo tooltip. */\n ariaLabel?: string;\n /** Tamaño del IconButton. Default: `'medium'`. */\n size?: 'small' | 'medium' | 'large';\n /** Oculta el botón cuando no hay handler disponible. Default: true. */\n hideIfNoHandler?: boolean;\n sx?: SxProps<Theme>;\n className?: string;\n}\n\n/**\n * Botón hamburguesa del AppBar. Por default consume `onMenuToggle` y\n * `menuOpen` del `AppBarContext` (pattern composicional), pero permite\n * overrides explícitos si se usa fuera de un `<AppBar>`.\n *\n * ```tsx\n * <AppBar onMenuToggle={toggleDrawer} menuOpen={open}>\n * <AppBarMenuToggle />\n * ...\n * </AppBar>\n * ```\n */\nexport function AppBarMenuToggle({\n onClick,\n menuOpen,\n closedIcon,\n openIcon,\n tooltip = 'Menú',\n ariaLabel,\n size = 'medium',\n hideIfNoHandler = true,\n sx,\n className,\n}: AppBarMenuToggleProps) {\n const ctx = useAppBarContext();\n\n const handler = onClick ?? ctx.onMenuToggle;\n const open = menuOpen ?? ctx.menuOpen ?? false;\n\n if (!handler && hideIfNoHandler) {\n return null;\n }\n\n const icon = open\n ? (openIcon ?? <MenuOpenIcon />)\n : (closedIcon ?? <MenuIcon />);\n\n return (\n <Tooltip title={tooltip} arrow>\n <span>\n <IconButton\n size={size}\n edge=\"start\"\n color=\"inherit\"\n aria-label={ariaLabel ?? tooltip}\n onClick={handler}\n disabled={!handler}\n className={className}\n sx={sx}\n >\n {icon}\n </IconButton>\n </span>\n </Tooltip>\n );\n}\n\nexport default AppBarMenuToggle;\n","import React, { useState, type ReactNode, type MouseEvent } from 'react';\nimport {\n Avatar,\n Box,\n Divider,\n IconButton,\n ListItemIcon,\n ListItemText,\n Menu,\n MenuItem,\n Tooltip,\n Typography,\n} from '@mui/material';\nimport type { SxProps, Theme } from '@mui/material/styles';\n\nexport interface AppBarUserMenuItem {\n /** Key única. Si no se provee, se usa el label. */\n key?: string;\n /** Texto del item. */\n label: ReactNode;\n /** Icono opcional a la izquierda. */\n icon?: ReactNode;\n /** Handler de click. */\n onClick?: (event: MouseEvent<HTMLLIElement>) => void;\n /** Deshabilita el item. */\n disabled?: boolean;\n /** Pinta el item en color error (típico para \"Cerrar sesión\"). */\n danger?: boolean;\n /** Inserta un `<Divider />` ANTES de este item. */\n dividerBefore?: boolean;\n}\n\nexport interface AppBarUserMenuUser {\n /** Nombre a mostrar en el header del menú. */\n name?: ReactNode;\n /** Email / subtítulo secundario. */\n email?: ReactNode;\n /** URL del avatar. Si se omite, se muestran iniciales del `name`. */\n avatarUrl?: string;\n /** Iniciales custom. Si se omite, se calculan del `name`. */\n initials?: string;\n}\n\nexport interface AppBarUserMenuProps {\n /** Datos del usuario a mostrar. */\n user?: AppBarUserMenuUser;\n /** Items del menú. */\n items: AppBarUserMenuItem[];\n /**\n * Si `true`, oculta la fila con nombre + email en el tope del menú.\n * Default: `false`.\n */\n hideUserHeader?: boolean;\n /** Tooltip del trigger. Default: \"Cuenta\". */\n triggerTooltip?: string;\n /** Tamaño del Avatar en px. Default: 36. */\n avatarSize?: number;\n /** sx del Paper del Menu. */\n menuSx?: SxProps<Theme>;\n /** sx del trigger (IconButton). */\n triggerSx?: SxProps<Theme>;\n className?: string;\n}\n\nfunction computeInitials(name?: ReactNode): string {\n if (typeof name !== 'string') return '?';\n const parts = name.trim().split(/\\s+/).filter(Boolean);\n if (parts.length === 0) return '?';\n const first = parts[0]?.charAt(0) ?? '';\n const last = parts.length > 1 ? (parts[parts.length - 1]?.charAt(0) ?? '') : '';\n return (first + last).toUpperCase();\n}\n\n/**\n * Menú de usuario del AppBar: avatar clickable que despliega un menú con la\n * info del usuario (nombre + email) y una lista de acciones (perfil, cerrar\n * sesión, etc).\n *\n * ```tsx\n * <AppBarUserMenu\n * user={{ name: 'Andrea', email: 'a@soyfri.com' }}\n * items={[\n * { label: 'Perfil', icon: <PersonIcon />, onClick: goToProfile },\n * { label: 'Cerrar sesión', icon: <LogoutIcon />, onClick: logout, danger: true, dividerBefore: true },\n * ]}\n * />\n * ```\n */\nexport function AppBarUserMenu({\n user,\n items,\n hideUserHeader = false,\n triggerTooltip = 'Cuenta',\n avatarSize = 36,\n menuSx,\n triggerSx,\n className,\n}: AppBarUserMenuProps) {\n const [anchorEl, setAnchorEl] = useState<HTMLElement | null>(null);\n const open = Boolean(anchorEl);\n\n const handleOpen = (event: MouseEvent<HTMLElement>) => {\n setAnchorEl(event.currentTarget);\n };\n const handleClose = () => setAnchorEl(null);\n\n const handleItemClick = (\n event: MouseEvent<HTMLLIElement>,\n item: AppBarUserMenuItem,\n ) => {\n event.stopPropagation();\n item.onClick?.(event);\n handleClose();\n };\n\n const initials = user?.initials ?? computeInitials(user?.name);\n const showUserHeader = !hideUserHeader && (user?.name || user?.email);\n\n return (\n <Box component=\"span\" className={className}>\n <Tooltip title={triggerTooltip} arrow>\n <IconButton\n onClick={handleOpen}\n size=\"small\"\n aria-label={triggerTooltip}\n aria-haspopup=\"menu\"\n aria-expanded={open || undefined}\n sx={[{ p: 0.5 }, ...(Array.isArray(triggerSx) ? triggerSx : triggerSx ? [triggerSx] : [])]}\n >\n <Avatar\n src={user?.avatarUrl}\n sx={{\n width: avatarSize,\n height: avatarSize,\n fontSize: avatarSize * 0.4,\n fontWeight: 600,\n }}\n >\n {!user?.avatarUrl && initials}\n </Avatar>\n </IconButton>\n </Tooltip>\n\n <Menu\n anchorEl={anchorEl}\n open={open}\n onClose={handleClose}\n anchorOrigin={{ vertical: 'bottom', horizontal: 'right' }}\n transformOrigin={{ vertical: 'top', horizontal: 'right' }}\n slotProps={{\n paper: {\n sx: { minWidth: 240, ...(menuSx as any) },\n },\n }}\n >\n {showUserHeader && (\n <Box\n sx={{\n px: 2,\n py: 1.25,\n display: 'flex',\n flexDirection: 'column',\n gap: 0.25,\n }}\n >\n {user?.name && (\n <Typography variant=\"subtitle2\" noWrap sx={{ fontWeight: 700 }}>\n {user.name}\n </Typography>\n )}\n {user?.email && (\n <Typography variant=\"caption\" color=\"text.secondary\" noWrap>\n {user.email}\n </Typography>\n )}\n </Box>\n )}\n {showUserHeader && <Divider />}\n\n {items.map((item, idx) => {\n const key = item.key ?? `${String(item.label)}-${idx}`;\n const node = (\n <MenuItem\n key={key}\n disabled={item.disabled}\n onClick={(event) => handleItemClick(event, item)}\n sx={(theme) => ({\n color: item.danger ? theme.palette.error.main : 'inherit',\n '& .MuiListItemIcon-root': {\n color: item.danger\n ? theme.palette.error.main\n : 'inherit',\n minWidth: 32,\n },\n })}\n >\n {item.icon && <ListItemIcon>{item.icon}</ListItemIcon>}\n <ListItemText primary={item.label} />\n </MenuItem>\n );\n\n if (item.dividerBefore && idx > 0) {\n return (\n <React.Fragment key={`${key}-frag`}>\n <Divider />\n {node}\n </React.Fragment>\n );\n }\n return node;\n })}\n </Menu>\n </Box>\n );\n}\n\nexport default AppBarUserMenu;\n"],"names":["MuiAppBar","_a","React"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAcO,MAAM,gBAAgB,cAAyC,IAAI;AAOnE,SAAS,mBAAuC;AACrD,QAAM,MAAM,WAAW,aAAa;AACpC,SAAO,oBAAO,CAAA;AAChB;ACXO,SAAS,cAAc;AAAA,EAC5B,SAAS;AAAA,EACT,cAAc;AAChB,GAAsC;AACpC,SAAO,CAAC,UAAW;AAAA,IACjB,WAAW;AAAA,IACX,gBAAgB;AAAA,IAChB,iBAAiB;AAAA,KACb,eAAe;AAAA,IACjB,iBAAiB;AAAA,IACjB,WAAW;AAAA,IACX,cAAc,aAAa,MAAM,QAAQ,OAAO;AAAA,EAAA,IAPjC;AAAA,IASjB,sBAAsB;AAAA,MACpB,WAAW;AAAA,MACX,KAAK;AAAA,IAAA;AAAA,EACP;AAEJ;AC6CO,SAAS,OAAO;AAAA,EACrB;AAAA,EACA,WAAW;AAAA,EACX,QAAQ;AAAA,EACR,YAAY;AAAA,EACZ,SAAS;AAAA,EACT;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAgB;AACd,QAAM,QAAQ,SAAA;AACd,QAAM,WAAW,cAAc,UAAU,QAAQ,KAAK;AAEtD,QAAM,cAAc,UAAU;AAE9B,QAAM,SAAyB;AAAA,IAC7B,cAAc,EAAE,QAAQ,aAAa;AAAA,IACrC,GAAI,WAAW,CAAC,QAAQ,IAAI,CAAA;AAAA,IAC5B,GAAI,MAAM,QAAQ,EAAE,IAAI,KAAK,KAAK,CAAC,EAAE,IAAI,CAAA;AAAA,EAAC;AAG5C,QAAM,eAAe;AAAA,IACnB,OAAO,EAAE,cAAc;IACvB,CAAC,cAAc,QAAQ;AAAA,EAAA;AAGzB,SACE,oBAAC,cAAc,UAAd,EAAuB,OAAO,cAC7B,UAAA;AAAA,IAACA;AAAAA,IAAA;AAAA,MACC;AAAA,MACA,OAAO,UAAU,gBAAgB,gBAAgB;AAAA,MACjD;AAAA,MACA;AAAA,MACA,IAAI;AAAA,OACA,cANL;AAAA,MAQC,UAAA,oBAAC,SAAA,EAAQ,IAAI,WAAY,SAAA,CAAS;AAAA,IAAA;AAAA,EAAA,GAEtC;AAEJ;ACxFO,SAAS,YAAY;AAAA,EAC1B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,oBAAoB;AAAA,EACpB;AAAA,EACA;AACF,GAAqB;AACnB,QAAM,YAAY,CAAC,CAAC;AAEpB,QAAM,SAAyB;AAAA,IAC7B;AAAA,MACE,SAAS;AAAA,MACT,YAAY;AAAA,MACZ,KAAK;AAAA,MACL,QAAQ,YAAY,YAAY;AAAA,MAChC,YAAY;AAAA,MACZ,UAAU;AAAA,IAAA;AAAA,IAEZ,GAAI,MAAM,QAAQ,EAAE,IAAI,KAAK,KAAK,CAAC,EAAE,IAAI,CAAA;AAAA,EAAC;AAG5C,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAM,YAAY,WAAW;AAAA,MAC7B,UAAU,YAAY,IAAI;AAAA,MAC1B;AAAA,MACA,WAAW,CAAC,UAAU;AACpB,YAAI,CAAC,UAAW;AAChB,YAAI,MAAM,QAAQ,WAAW,MAAM,QAAQ,KAAK;AAC9C,gBAAM,eAAA;AACN,6CAAU;AAAA,QACZ;AAAA,MACF;AAAA,MACA;AAAA,MACA,IAAI;AAAA,MAEH,UAAA;AAAA,QAAA,QACC;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,IAAI;AAAA,cACF,SAAS;AAAA,cACT,YAAY;AAAA,cACZ,YAAY;AAAA,YAAA;AAAA,YAGb,UAAA;AAAA,UAAA;AAAA,QAAA;AAAA,SAGH,SAAS,aACT;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,IAAI;AAAA,cACF,SAAS,oBACL,EAAE,IAAI,QAAQ,IAAI,WAClB;AAAA,cACJ,eAAe;AAAA,cACf,UAAU;AAAA,cACV,YAAY;AAAA,YAAA;AAAA,YAGb,UAAA;AAAA,cAAA,SACC;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,WAAU;AAAA,kBACV,SAAQ;AAAA,kBACR,QAAM;AAAA,kBACN,IAAI,EAAE,YAAY,IAAA;AAAA,kBAEjB,UAAA;AAAA,gBAAA;AAAA,cAAA;AAAA,cAGJ,YACC;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,WAAU;AAAA,kBACV,SAAQ;AAAA,kBACR,OAAM;AAAA,kBACN,QAAM;AAAA,kBAEL,UAAA;AAAA,gBAAA;AAAA,cAAA;AAAA,YACH;AAAA,UAAA;AAAA,QAAA;AAAA,MAEJ;AAAA,IAAA;AAAA,EAAA;AAIR;ACzEO,SAAS,iBAAiB;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV;AAAA,EACA,OAAO;AAAA,EACP,kBAAkB;AAAA,EAClB;AAAA,EACA;AACF,GAA0B;;AACxB,QAAM,MAAM,iBAAA;AAEZ,QAAM,UAAU,4BAAW,IAAI;AAC/B,QAAM,QAAO,mCAAY,IAAI,aAAhB,YAA4B;AAEzC,MAAI,CAAC,WAAW,iBAAiB;AAC/B,WAAO;AAAA,EACT;AAEA,QAAM,OAAO,OACR,8BAAY,oBAAC,gBAAa,IAC1B,sDAAe,UAAA,CAAA,CAAS;AAE7B,6BACG,SAAA,EAAQ,OAAO,SAAS,OAAK,MAC5B,8BAAC,QAAA,EACC,UAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC;AAAA,MACA,MAAK;AAAA,MACL,OAAM;AAAA,MACN,cAAY,gCAAa;AAAA,MACzB,SAAS;AAAA,MACT,UAAU,CAAC;AAAA,MACX;AAAA,MACA;AAAA,MAEC,UAAA;AAAA,IAAA;AAAA,EAAA,GAEL,EAAA,CACF;AAEJ;ACvBA,SAAS,gBAAgB,MAA0B;;AACjD,MAAI,OAAO,SAAS,SAAU,QAAO;AACrC,QAAM,QAAQ,KAAK,KAAA,EAAO,MAAM,KAAK,EAAE,OAAO,OAAO;AACrD,MAAI,MAAM,WAAW,EAAG,QAAO;AAC/B,QAAM,SAAQ,iBAAM,CAAC,MAAP,mBAAU,OAAO,OAAjB,YAAuB;AACrC,QAAM,OAAO,MAAM,SAAS,KAAK,iBAAM,MAAM,SAAS,CAAC,MAAtB,mBAAyB,OAAO,OAAhC,YAAsC,KAAM;AAC7E,UAAQ,QAAQ,MAAM,YAAA;AACxB;AAiBO,SAAS,eAAe;AAAA,EAC7B;AAAA,EACA;AAAA,EACA,iBAAiB;AAAA,EACjB,iBAAiB;AAAA,EACjB,aAAa;AAAA,EACb;AAAA,EACA;AAAA,EACA;AACF,GAAwB;;AACtB,QAAM,CAAC,UAAU,WAAW,IAAI,SAA6B,IAAI;AACjE,QAAM,OAAO,QAAQ,QAAQ;AAE7B,QAAM,aAAa,CAAC,UAAmC;AACrD,gBAAY,MAAM,aAAa;AAAA,EACjC;AACA,QAAM,cAAc,MAAM,YAAY,IAAI;AAE1C,QAAM,kBAAkB,CACtB,OACA,SACG;;AACH,UAAM,gBAAA;AACN,KAAAC,MAAA,KAAK,YAAL,gBAAAA,IAAA,WAAe;AACf,gBAAA;AAAA,EACF;AAEA,QAAM,YAAW,kCAAM,aAAN,YAAkB,gBAAgB,6BAAM,IAAI;AAC7D,QAAM,iBAAiB,CAAC,oBAAmB,6BAAM,UAAQ,6BAAM;AAE/D,SACE,qBAAC,KAAA,EAAI,WAAU,QAAO,WACpB,UAAA;AAAA,IAAA,oBAAC,SAAA,EAAQ,OAAO,gBAAgB,OAAK,MACnC,UAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,SAAS;AAAA,QACT,MAAK;AAAA,QACL,cAAY;AAAA,QACZ,iBAAc;AAAA,QACd,iBAAe,QAAQ;AAAA,QACvB,IAAI,CAAC,EAAE,GAAG,IAAA,GAAO,GAAI,MAAM,QAAQ,SAAS,IAAI,YAAY,YAAY,CAAC,SAAS,IAAI,CAAA,CAAG;AAAA,QAEzF,UAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,KAAK,6BAAM;AAAA,YACX,IAAI;AAAA,cACF,OAAO;AAAA,cACP,QAAQ;AAAA,cACR,UAAU,aAAa;AAAA,cACvB,YAAY;AAAA,YAAA;AAAA,YAGb,UAAA,EAAC,6BAAM,cAAa;AAAA,UAAA;AAAA,QAAA;AAAA,MACvB;AAAA,IAAA,GAEJ;AAAA,IAEA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,SAAS;AAAA,QACT,cAAc,EAAE,UAAU,UAAU,YAAY,QAAA;AAAA,QAChD,iBAAiB,EAAE,UAAU,OAAO,YAAY,QAAA;AAAA,QAChD,WAAW;AAAA,UACT,OAAO;AAAA,YACL,IAAI,iBAAE,UAAU,OAAS;AAAA,UAAe;AAAA,QAC1C;AAAA,QAGD,UAAA;AAAA,UAAA,kBACC;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,IAAI;AAAA,gBACF,IAAI;AAAA,gBACJ,IAAI;AAAA,gBACJ,SAAS;AAAA,gBACT,eAAe;AAAA,gBACf,KAAK;AAAA,cAAA;AAAA,cAGN,UAAA;AAAA,iBAAA,6BAAM,SACL,oBAAC,YAAA,EAAW,SAAQ,aAAY,QAAM,MAAC,IAAI,EAAE,YAAY,IAAA,GACtD,eAAK,MACR;AAAA,iBAED,6BAAM,UACL,oBAAC,YAAA,EAAW,SAAQ,WAAU,OAAM,kBAAiB,QAAM,MACxD,UAAA,KAAK,MAAA,CACR;AAAA,cAAA;AAAA,YAAA;AAAA,UAAA;AAAA,UAIL,sCAAmB,SAAA,EAAQ;AAAA,UAE3B,MAAM,IAAI,CAAC,MAAM,QAAQ;;AACxB,kBAAM,OAAMA,MAAA,KAAK,QAAL,OAAAA,MAAY,GAAG,OAAO,KAAK,KAAK,CAAC,IAAI,GAAG;AACpD,kBAAM,OACJ;AAAA,cAAC;AAAA,cAAA;AAAA,gBAEC,UAAU,KAAK;AAAA,gBACf,SAAS,CAAC,UAAU,gBAAgB,OAAO,IAAI;AAAA,gBAC/C,IAAI,CAAC,WAAW;AAAA,kBACd,OAAO,KAAK,SAAS,MAAM,QAAQ,MAAM,OAAO;AAAA,kBAChD,2BAA2B;AAAA,oBACzB,OAAO,KAAK,SACR,MAAM,QAAQ,MAAM,OACpB;AAAA,oBACJ,UAAU;AAAA,kBAAA;AAAA,gBACZ;AAAA,gBAGD,UAAA;AAAA,kBAAA,KAAK,QAAQ,oBAAC,cAAA,EAAc,UAAA,KAAK,MAAK;AAAA,kBACvC,oBAAC,cAAA,EAAa,SAAS,KAAK,MAAA,CAAO;AAAA,gBAAA;AAAA,cAAA;AAAA,cAd9B;AAAA,YAAA;AAkBT,gBAAI,KAAK,iBAAiB,MAAM,GAAG;AACjC,qBACE,qBAACC,eAAM,UAAN,EACC,UAAA;AAAA,gBAAA,oBAAC,SAAA,EAAQ;AAAA,gBACR;AAAA,cAAA,EAAA,GAFkB,GAAG,GAAG,OAG3B;AAAA,YAEJ;AACA,mBAAO;AAAA,UACT,CAAC;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EACH,GACF;AAEJ;"}
|
|
1
|
+
{"version":3,"file":"AppBar.js","sources":["../../../src/components/AppBar/AppBarContext.ts","../../../src/components/AppBar/AppBar.sx.ts","../../../src/components/AppBar/AppBar.tsx","../../../src/components/AppBar/AppBarMenuToggle.tsx"],"sourcesContent":["import { createContext, useContext } from 'react';\n\n/**\n * Context interno del AppBar. Permite que sub-componentes (MenuToggle, etc.)\n * consuman callbacks registrados en el AppBar padre sin tener que pasarlos\n * por props explícitas.\n */\nexport interface AppBarContextValue {\n /** Handler del botón hamburguesa. Si es undefined, el toggle se oculta. */\n onMenuToggle?: () => void;\n /** Estado actual del drawer asociado (usado por el icono del toggle). */\n menuOpen?: boolean;\n}\n\nexport const AppBarContext = createContext<AppBarContextValue | null>(null);\n\n/**\n * Hook para leer el contexto del AppBar. Si se llama fuera de un `<AppBar>`,\n * devuelve un objeto vacío — los sub-componentes caen en modo \"standalone\"\n * con sus defaults en lugar de romper.\n */\nexport function useAppBarContext(): AppBarContextValue {\n const ctx = useContext(AppBarContext);\n return ctx ?? {};\n}\n","import type { SxProps, Theme } from '@mui/material/styles';\n\nexport interface BuildAppBarSxArgs {\n /** Altura en px. Default: 64. */\n height?: number;\n /** Color del AppBar (se pasa al MuiAppBar). */\n transparent?: boolean;\n}\n\n/**\n * sx del root del MuiAppBar. Define altura fija y layout flex del Toolbar\n * interno. El color/elevación se dejan a las props nativas de MuiAppBar.\n */\nexport function buildAppBarSx({\n height = 64,\n transparent = false,\n}: BuildAppBarSxArgs): SxProps<Theme> {\n return (theme) => ({\n minHeight: height,\n justifyContent: 'center',\n backgroundImage: 'none',\n ...(transparent && {\n backgroundColor: 'transparent',\n boxShadow: 'none',\n borderBottom: `1px solid ${theme.palette.divider}`,\n }),\n '& .MuiToolbar-root': {\n minHeight: height,\n gap: 1.5,\n },\n });\n}\n","import React, { useMemo, type ReactNode } from 'react';\nimport {\n AppBar as MuiAppBar,\n Toolbar,\n type AppBarProps as MuiAppBarProps,\n} from '@mui/material';\nimport {\n useTheme,\n type SxProps,\n type Theme,\n} from '@mui/material/styles';\n\nimport { AppBarContext } from './AppBarContext';\nimport { buildAppBarSx } from './AppBar.sx';\nimport { resolvePreset } from '../_shared/resolvePreset';\n\nexport type AppBarPosition = 'fixed' | 'sticky' | 'static' | 'absolute' | 'relative';\nexport type AppBarColor =\n | 'default'\n | 'primary'\n | 'secondary'\n | 'transparent'\n | 'inherit';\n\nexport interface AppBarProps {\n /** Contenido del AppBar (típicamente sub-componentes + acciones custom). */\n children?: ReactNode;\n /** Posicionamiento. Default: `'sticky'`. */\n position?: AppBarPosition;\n /** Color. Default: `'default'`. */\n color?: AppBarColor;\n /** Nivel de sombra. Default: 1. */\n elevation?: number;\n /** Altura en px. Default: 64. */\n height?: number;\n /**\n * Handler del botón hamburguesa. Se expone vía AppBarContext para que el\n * sub-componente `<AppBarMenuToggle>` lo consuma sin prop drilling.\n */\n onMenuToggle?: () => void;\n /** Estado del drawer asociado (para que el icono del toggle cambie). */\n menuOpen?: boolean;\n /**\n * Nombre del preset de estilo registrado en `theme.styles.AppBar`.\n * - `\"default\"` (o ausente) = estilo built-in del paquete.\n */\n preset?: string;\n /** sx del root (se mergea después del preset). */\n sx?: SxProps<Theme>;\n /** sx del Toolbar interno. */\n toolbarSx?: SxProps<Theme>;\n className?: string;\n /** Otras props nativas del MuiAppBar (ej. `enableColorOnDark`). */\n appBarProps?: Omit<\n MuiAppBarProps,\n 'position' | 'color' | 'elevation' | 'sx' | 'children' | 'className'\n >;\n}\n\n/**\n * AppBar (header superior) del paquete. Se diseñó como un shell compositivo\n * — el consumer arma el contenido libremente (logo, título, menú de usuario,\n * etc.) y puede usar `<AppBarMenuToggle>` para el botón hamburguesa\n * integrado con el contexto.\n *\n * Patrón recomendado para navegación en dashboards:\n *\n * ```tsx\n * <AppBar onMenuToggle={toggleDrawer}>\n * <AppBarMenuToggle />\n * <MyBrand />\n * <Box sx={{ flex: 1 }} />\n * <MyUserMenu />\n * </AppBar>\n * ```\n */\nexport function AppBar({\n children,\n position = 'sticky',\n color = 'default',\n elevation = 1,\n height = 64,\n onMenuToggle,\n menuOpen,\n preset,\n sx,\n toolbarSx,\n appBarProps,\n}: AppBarProps) {\n const theme = useTheme();\n const presetSx = resolvePreset('AppBar', preset, theme);\n\n const rootSx: SxProps<Theme> = [\n buildAppBarSx({ height, transparent: color === 'transparent' }),\n ...(presetSx ? [presetSx] : []),\n ...(Array.isArray(sx) ? sx : sx ? [sx] : []),\n ];\n\n const contextValue = useMemo(\n () => ({ onMenuToggle, menuOpen }),\n [onMenuToggle, menuOpen],\n );\n\n return (\n <AppBarContext.Provider value={contextValue}>\n <MuiAppBar\n position={position}\n color={color}\n elevation={elevation}\n sx={rootSx}\n {...appBarProps}\n >\n <Toolbar sx={toolbarSx}>{children}</Toolbar>\n </MuiAppBar>\n </AppBarContext.Provider>\n );\n}\n\nexport default AppBar;\n","import { type ReactNode } from 'react';\nimport { IconButton, Tooltip } from '@mui/material';\nimport MenuIcon from '@mui/icons-material/Menu';\nimport MenuOpenIcon from '@mui/icons-material/MenuOpen';\nimport type { SxProps, Theme } from '@mui/material/styles';\n\nimport { useAppBarContext } from './AppBarContext';\n\nexport interface AppBarMenuToggleProps {\n /**\n * Callback explícito. Si se omite, se consume del `AppBarContext`. Útil para\n * usar el toggle fuera de un `<AppBar>` (p.ej. en un header custom).\n */\n onClick?: () => void;\n /** Estado del drawer asociado. Si se omite, se lee del `AppBarContext`. */\n menuOpen?: boolean;\n /** Icono custom cuando el drawer está cerrado. Default: `<MenuIcon />`. */\n closedIcon?: ReactNode;\n /** Icono custom cuando el drawer está abierto. Default: `<MenuOpenIcon />`. */\n openIcon?: ReactNode;\n /** Texto de tooltip. Default: \"Menú\". */\n tooltip?: string;\n /** aria-label del botón. Default: el mismo tooltip. */\n ariaLabel?: string;\n /** Tamaño del IconButton. Default: `'medium'`. */\n size?: 'small' | 'medium' | 'large';\n /** Oculta el botón cuando no hay handler disponible. Default: true. */\n hideIfNoHandler?: boolean;\n sx?: SxProps<Theme>;\n className?: string;\n}\n\n/**\n * Botón hamburguesa del AppBar. Por default consume `onMenuToggle` y\n * `menuOpen` del `AppBarContext` (pattern composicional), pero permite\n * overrides explícitos si se usa fuera de un `<AppBar>`.\n *\n * ```tsx\n * <AppBar onMenuToggle={toggleDrawer} menuOpen={open}>\n * <AppBarMenuToggle />\n * ...\n * </AppBar>\n * ```\n */\nexport function AppBarMenuToggle({\n onClick,\n menuOpen,\n closedIcon,\n openIcon,\n tooltip = 'Menú',\n ariaLabel,\n size = 'medium',\n hideIfNoHandler = true,\n sx,\n className,\n}: AppBarMenuToggleProps) {\n const ctx = useAppBarContext();\n\n const handler = onClick ?? ctx.onMenuToggle;\n const open = menuOpen ?? ctx.menuOpen ?? false;\n\n if (!handler && hideIfNoHandler) {\n return null;\n }\n\n const icon = open\n ? (openIcon ?? <MenuOpenIcon />)\n : (closedIcon ?? <MenuIcon />);\n\n return (\n <Tooltip title={tooltip} arrow>\n <span>\n <IconButton\n size={size}\n edge=\"start\"\n color=\"inherit\"\n aria-label={ariaLabel ?? tooltip}\n onClick={handler}\n disabled={!handler}\n className={className}\n sx={sx}\n >\n {icon}\n </IconButton>\n </span>\n </Tooltip>\n );\n}\n\nexport default AppBarMenuToggle;\n"],"names":["MuiAppBar"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAcO,MAAM,gBAAgB,cAAyC,IAAI;AAOnE,SAAS,mBAAuC;AACrD,QAAM,MAAM,WAAW,aAAa;AACpC,SAAO,oBAAO,CAAA;AAChB;ACXO,SAAS,cAAc;AAAA,EAC5B,SAAS;AAAA,EACT,cAAc;AAChB,GAAsC;AACpC,SAAO,CAAC,UAAW;AAAA,IACjB,WAAW;AAAA,IACX,gBAAgB;AAAA,IAChB,iBAAiB;AAAA,KACb,eAAe;AAAA,IACjB,iBAAiB;AAAA,IACjB,WAAW;AAAA,IACX,cAAc,aAAa,MAAM,QAAQ,OAAO;AAAA,EAAA,IAPjC;AAAA,IASjB,sBAAsB;AAAA,MACpB,WAAW;AAAA,MACX,KAAK;AAAA,IAAA;AAAA,EACP;AAEJ;AC6CO,SAAS,OAAO;AAAA,EACrB;AAAA,EACA,WAAW;AAAA,EACX,QAAQ;AAAA,EACR,YAAY;AAAA,EACZ,SAAS;AAAA,EACT;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAgB;AACd,QAAM,QAAQ,SAAA;AACd,QAAM,WAAW,cAAc,UAAU,QAAQ,KAAK;AAEtD,QAAM,SAAyB;AAAA,IAC7B,cAAc,EAAE,QAAQ,aAAa,UAAU,eAAe;AAAA,IAC9D,GAAI,WAAW,CAAC,QAAQ,IAAI,CAAA;AAAA,IAC5B,GAAI,MAAM,QAAQ,EAAE,IAAI,KAAK,KAAK,CAAC,EAAE,IAAI,CAAA;AAAA,EAAC;AAG5C,QAAM,eAAe;AAAA,IACnB,OAAO,EAAE,cAAc;IACvB,CAAC,cAAc,QAAQ;AAAA,EAAA;AAGzB,SACE,oBAAC,cAAc,UAAd,EAAuB,OAAO,cAC7B,UAAA;AAAA,IAACA;AAAAA,IAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA,IAAI;AAAA,OACA,cALL;AAAA,MAOC,UAAA,oBAAC,SAAA,EAAQ,IAAI,WAAY,SAAA,CAAS;AAAA,IAAA;AAAA,EAAA,GAEtC;AAEJ;ACxEO,SAAS,iBAAiB;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV;AAAA,EACA,OAAO;AAAA,EACP,kBAAkB;AAAA,EAClB;AAAA,EACA;AACF,GAA0B;;AACxB,QAAM,MAAM,iBAAA;AAEZ,QAAM,UAAU,4BAAW,IAAI;AAC/B,QAAM,QAAO,mCAAY,IAAI,aAAhB,YAA4B;AAEzC,MAAI,CAAC,WAAW,iBAAiB;AAC/B,WAAO;AAAA,EACT;AAEA,QAAM,OAAO,OACR,8BAAY,oBAAC,gBAAa,IAC1B,sDAAe,UAAA,CAAA,CAAS;AAE7B,6BACG,SAAA,EAAQ,OAAO,SAAS,OAAK,MAC5B,8BAAC,QAAA,EACC,UAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC;AAAA,MACA,MAAK;AAAA,MACL,OAAM;AAAA,MACN,cAAY,gCAAa;AAAA,MACzB,SAAS;AAAA,MACT,UAAU,CAAC;AAAA,MACX;AAAA,MACA;AAAA,MAEC,UAAA;AAAA,IAAA;AAAA,EAAA,GAEL,EAAA,CACF;AAEJ;"}
|
|
@@ -1,12 +1,6 @@
|
|
|
1
1
|
export { AppBar, default } from './AppBar';
|
|
2
2
|
export type { AppBarProps, AppBarPosition, AppBarColor, } from './AppBar';
|
|
3
|
-
export { AppBarBrand } from './AppBarBrand';
|
|
4
|
-
export type { AppBarBrandProps } from './AppBarBrand';
|
|
5
3
|
export { AppBarMenuToggle } from './AppBarMenuToggle';
|
|
6
4
|
export type { AppBarMenuToggleProps } from './AppBarMenuToggle';
|
|
7
|
-
export { AppBarUserMenu } from './AppBarUserMenu';
|
|
8
|
-
export type { AppBarUserMenuProps, AppBarUserMenuItem, AppBarUserMenuUser, } from './AppBarUserMenu';
|
|
9
5
|
export { AppBarContext, useAppBarContext } from './AppBarContext';
|
|
10
6
|
export type { AppBarContextValue } from './AppBarContext';
|
|
11
|
-
export { buildAppBarSx } from './AppBar.sx';
|
|
12
|
-
export type { BuildAppBarSxArgs } from './AppBar.sx';
|