@soyfri/shared-library 1.5.0 → 1.6.0-beta.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/Button-C17mExpd.cjs.map +1 -0
- package/Button-UkkP-bNw.js.map +1 -0
- package/components/ActionMenu/ActionMenu.cjs +107 -0
- package/components/ActionMenu/ActionMenu.cjs.map +1 -0
- package/components/ActionMenu/ActionMenu.d.ts +44 -0
- package/components/ActionMenu/ActionMenu.js +107 -0
- package/components/ActionMenu/ActionMenu.js.map +1 -0
- package/components/ActionMenu/index.d.ts +2 -0
- package/components/ActionMenu.d.ts +6 -0
- package/components/AppBar/AppBar.cjs +129 -0
- package/components/AppBar/AppBar.cjs.map +1 -0
- package/components/AppBar/AppBar.d.ts +55 -0
- package/components/AppBar/AppBar.js +129 -0
- package/components/AppBar/AppBar.js.map +1 -0
- package/components/AppBar/AppBar.sx.d.ts +12 -0
- package/components/AppBar/AppBarContext.d.ts +18 -0
- package/components/AppBar/AppBarMenuToggle.d.ts +39 -0
- package/components/AppBar/index.d.ts +6 -0
- package/components/AppBar.d.ts +6 -0
- package/components/Autocomplete/Autocomplete.cjs +313 -0
- package/components/Autocomplete/Autocomplete.cjs.map +1 -0
- package/components/Autocomplete/Autocomplete.d.ts +86 -0
- package/components/Autocomplete/Autocomplete.definitions.d.ts +16 -0
- package/components/Autocomplete/Autocomplete.helpers.d.ts +22 -0
- package/components/Autocomplete/Autocomplete.js +313 -0
- package/components/Autocomplete/Autocomplete.js.map +1 -0
- package/components/Autocomplete/Autocomplete.sx.d.ts +7 -0
- package/components/Autocomplete/_parts/AutocompleteChips.d.ts +20 -0
- package/components/Autocomplete/_parts/AutocompleteLoader.d.ts +9 -0
- package/components/Autocomplete/_parts/AutocompleteOption.d.ts +16 -0
- package/components/Autocomplete/index.d.ts +2 -0
- package/components/Autocomplete.d.ts +6 -0
- package/components/Avatar/Avatar.cjs +162 -0
- package/components/Avatar/Avatar.cjs.map +1 -0
- package/components/Avatar/Avatar.d.ts +33 -0
- package/components/Avatar/Avatar.definitions.d.ts +11 -0
- package/components/Avatar/Avatar.js +162 -0
- package/components/Avatar/Avatar.js.map +1 -0
- package/components/Avatar/index.d.ts +2 -0
- package/{dist/components → components}/Button/Button.d.ts +5 -5
- package/{dist/components → components}/Button/index.d.ts +1 -0
- package/components/Card/Card.cjs +99 -0
- package/components/Card/Card.cjs.map +1 -0
- package/components/Card/Card.d.ts +36 -0
- package/components/Card/Card.js +99 -0
- package/components/Card/Card.js.map +1 -0
- package/components/Card/Card.sx.d.ts +14 -0
- package/components/Card/index.d.ts +4 -0
- package/components/Card.d.ts +6 -0
- package/components/Checkbox/Checkbox.cjs +189 -0
- package/components/Checkbox/Checkbox.cjs.map +1 -0
- package/components/Checkbox/Checkbox.d.ts +55 -0
- package/components/Checkbox/Checkbox.js +189 -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/{dist/components → components}/Chip/Chip.cjs +2 -1
- package/components/Chip/Chip.cjs.map +1 -0
- package/{dist/components → components}/Chip/Chip.js +2 -1
- package/components/Chip/Chip.js.map +1 -0
- package/components/Chip/index.d.ts +2 -0
- package/components/Chip.d.ts +6 -0
- package/components/DatePicker/DatePicker.cjs +180 -0
- package/components/DatePicker/DatePicker.cjs.map +1 -0
- package/components/DatePicker/DatePicker.d.ts +44 -0
- package/{dist/components → components}/DatePicker/DatePicker.definitions.d.ts +1 -0
- package/components/DatePicker/DatePicker.helpers.d.ts +7 -0
- package/components/DatePicker/DatePicker.js +180 -0
- package/components/DatePicker/DatePicker.js.map +1 -0
- package/components/DatePicker/DatePicker.sx.d.ts +9 -0
- package/components/DatePicker/index.d.ts +2 -0
- package/components/DatePicker.d.ts +6 -0
- package/components/DateTimePicker/DateTimePicker.cjs +198 -0
- package/components/DateTimePicker/DateTimePicker.cjs.map +1 -0
- package/components/DateTimePicker/DateTimePicker.d.ts +57 -0
- package/{dist/components → components}/DateTimePicker/DateTimePicker.definitions.d.ts +3 -0
- package/components/DateTimePicker/DateTimePicker.helpers.d.ts +13 -0
- package/components/DateTimePicker/DateTimePicker.js +198 -0
- package/components/DateTimePicker/DateTimePicker.js.map +1 -0
- package/components/DateTimePicker/DateTimePicker.sx.d.ts +7 -0
- package/components/DateTimePicker/index.d.ts +2 -0
- package/components/DateTimePicker.d.ts +6 -0
- package/components/Drawer/Drawer.cjs +272 -0
- package/components/Drawer/Drawer.cjs.map +1 -0
- package/components/Drawer/Drawer.d.ts +58 -0
- package/components/Drawer/Drawer.js +272 -0
- package/components/Drawer/Drawer.js.map +1 -0
- package/components/Drawer/Drawer.sx.d.ts +23 -0
- package/components/Drawer/DrawerContext.d.ts +18 -0
- package/components/Drawer/DrawerItem.d.ts +40 -0
- package/components/Drawer/index.d.ts +6 -0
- package/components/Drawer.d.ts +6 -0
- package/{dist/components → components}/Gallery/Gallery.cjs +154 -79
- package/components/Gallery/Gallery.cjs.map +1 -0
- package/components/Gallery/Gallery.d.ts +28 -0
- package/{dist/components → components}/Gallery/Gallery.js +154 -79
- package/components/Gallery/Gallery.js.map +1 -0
- package/components/Gallery/GalleryLightbox.d.ts +16 -0
- package/{dist/components → components}/Gallery/GalleryMain.d.ts +3 -7
- package/components/Gallery/GalleryThumbnails.d.ts +13 -0
- package/components/Gallery/index.d.ts +2 -0
- package/components/Gallery.d.ts +6 -0
- package/{dist/components → components}/Icon/Icon.cjs +49 -10
- package/components/Icon/Icon.cjs.map +1 -0
- package/components/Icon/Icon.d.ts +48 -0
- package/{dist/components → components}/Icon/Icon.js +49 -10
- package/components/Icon/Icon.js.map +1 -0
- package/components/Icon/index.d.ts +2 -0
- package/components/Icon.d.ts +6 -0
- package/components/Input/Input.cjs +188 -0
- package/components/Input/Input.cjs.map +1 -0
- package/components/Input/Input.d.ts +44 -0
- package/{dist/components → components}/Input/Input.definitions.d.ts +6 -2
- package/components/Input/Input.helpers.d.ts +14 -0
- package/components/Input/Input.js +188 -0
- package/components/Input/Input.js.map +1 -0
- package/components/Input/Input.sx.d.ts +8 -0
- package/components/Input/index.d.ts +2 -0
- package/components/Input.d.ts +6 -0
- package/components/InputGroup/InputGroup.cjs +140 -0
- package/components/InputGroup/InputGroup.cjs.map +1 -0
- package/components/InputGroup/InputGroup.d.ts +42 -0
- package/components/InputGroup/InputGroup.definitions.d.ts +6 -0
- package/components/InputGroup/InputGroup.js +140 -0
- package/components/InputGroup/InputGroup.js.map +1 -0
- package/components/InputGroup/index.d.ts +2 -0
- package/components/InputGroup.d.ts +6 -0
- package/components/Modal/Modal.cjs +348 -0
- package/components/Modal/Modal.cjs.map +1 -0
- package/components/Modal/Modal.d.ts +80 -0
- package/components/Modal/Modal.js +348 -0
- package/components/Modal/Modal.js.map +1 -0
- package/components/Modal/ModalBody.d.ts +11 -0
- package/components/Modal/ModalFooter.d.ts +27 -0
- package/components/Modal/ModalHeader.d.ts +11 -0
- package/components/Modal/index.d.ts +8 -0
- package/components/Modal.d.ts +6 -0
- package/components/RadioGroup/RadioGroup.cjs +204 -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 +204 -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 +313 -0
- package/components/Select/Select.cjs.map +1 -0
- package/components/Select/Select.d.ts +95 -0
- package/components/Select/Select.helpers.d.ts +15 -0
- package/components/Select/Select.js +313 -0
- package/components/Select/Select.js.map +1 -0
- package/components/Select/Select.sx.d.ts +7 -0
- package/components/Select/_parts/SelectMenuItem.d.ts +20 -0
- package/components/Select/index.d.ts +2 -0
- package/components/Select.d.ts +6 -0
- package/{dist/components → components}/Stat/Stat.cjs +2 -2
- package/{dist/components → components}/Stat/Stat.cjs.map +1 -1
- package/{dist/components → components}/Stat/Stat.js +2 -2
- package/{dist/components → components}/Stat/Stat.js.map +1 -1
- package/components/Stat/index.d.ts +2 -0
- package/components/Stat.d.ts +6 -0
- package/components/StatusMessage/StatusMessage.cjs +90 -0
- package/components/StatusMessage/StatusMessage.cjs.map +1 -0
- package/components/StatusMessage/StatusMessage.d.ts +28 -0
- package/components/StatusMessage/StatusMessage.js +90 -0
- package/components/StatusMessage/StatusMessage.js.map +1 -0
- package/components/StatusMessage/index.d.ts +2 -0
- package/components/StatusMessage.d.ts +6 -0
- package/components/Stepper/Stepper.cjs +302 -0
- package/components/Stepper/Stepper.cjs.map +1 -0
- package/components/Stepper/Stepper.d.ts +17 -0
- package/components/Stepper/Stepper.js +302 -0
- package/components/Stepper/Stepper.js.map +1 -0
- package/components/Stepper/StepperContext.d.ts +73 -0
- 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 -0
- package/components/Stepper.d.ts +6 -0
- package/components/Switch/Switch.cjs +184 -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 +184 -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/Tabs/Tabs.cjs +112 -0
- package/components/Tabs/Tabs.cjs.map +1 -0
- package/components/Tabs/Tabs.d.ts +24 -0
- package/components/Tabs/Tabs.js +112 -0
- package/components/Tabs/Tabs.js.map +1 -0
- package/components/Tabs/index.d.ts +4 -0
- package/components/Tabs.d.ts +6 -0
- package/{dist/components → components}/Timeline/Timeline.cjs +3 -2
- package/components/Timeline/Timeline.cjs.map +1 -0
- package/components/Timeline/Timeline.d.ts +9 -0
- package/{dist/components → components}/Timeline/Timeline.js +3 -2
- package/components/Timeline/Timeline.js.map +1 -0
- package/components/Timeline/index.d.ts +4 -0
- package/components/Timeline.d.ts +6 -0
- package/components/_shared/formField.sx.d.ts +33 -0
- package/components/_shared/mergeSx.d.ts +7 -0
- package/components/_shared/resolvePreset.d.ts +18 -0
- package/formField.sx-8_QRnKxv.js +68 -0
- package/formField.sx-8_QRnKxv.js.map +1 -0
- package/formField.sx-BAX7KwMR.cjs +67 -0
- package/formField.sx-BAX7KwMR.cjs.map +1 -0
- package/index.cjs +145 -0
- package/index.cjs.map +1 -0
- package/index.d.ts +4 -0
- package/index.js +49 -0
- package/index.js.map +1 -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 +7 -0
- package/package.json +164 -43
- package/resolvePreset-B-IB0ehH.js +15 -0
- package/resolvePreset-B-IB0ehH.js.map +1 -0
- package/resolvePreset-CT3kU-K2.cjs +14 -0
- package/resolvePreset-CT3kU-K2.cjs.map +1 -0
- package/theme/componentStyles.d.ts +32 -0
- package/theme/tokens.d.ts +28 -0
- 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/utils/scrollToTop.d.ts +28 -0
- package/.dockerignore +0 -8
- package/.github/workflows/publish.yml +0 -107
- package/.prettierrc +0 -3
- package/.storybook/main.ts +0 -19
- package/.storybook/preview.ts +0 -14
- package/.storybook/vitest.setup.ts +0 -9
- package/Dockerfile +0 -37
- package/build.js +0 -102
- package/chromatic.config.json +0 -5
- package/cleanDirectories.js +0 -40
- package/dist/Button-C17mExpd.cjs.map +0 -1
- package/dist/Button-UkkP-bNw.js.map +0 -1
- package/dist/DatePicker-BSNboVhN.js +0 -201
- package/dist/DatePicker-BSNboVhN.js.map +0 -1
- package/dist/DatePicker-BoqxWAhj.cjs +0 -200
- package/dist/DatePicker-BoqxWAhj.cjs.map +0 -1
- package/dist/Input-DFHs7cJ_.js +0 -171
- package/dist/Input-DFHs7cJ_.js.map +0 -1
- package/dist/Input-c8MwNNPg.cjs +0 -170
- package/dist/Input-c8MwNNPg.cjs.map +0 -1
- package/dist/Select-BO2N56sm.cjs +0 -411
- package/dist/Select-BO2N56sm.cjs.map +0 -1
- package/dist/Select-BcLkyHSE.js +0 -412
- package/dist/Select-BcLkyHSE.js.map +0 -1
- package/dist/components/Autocomplete/Autocomplete.cjs +0 -109
- package/dist/components/Autocomplete/Autocomplete.cjs.map +0 -1
- package/dist/components/Autocomplete/Autocomplete.d.ts +0 -28
- package/dist/components/Autocomplete/Autocomplete.definitions.d.ts +0 -9
- package/dist/components/Autocomplete/Autocomplete.js +0 -109
- package/dist/components/Autocomplete/Autocomplete.js.map +0 -1
- package/dist/components/Autocomplete/index.d.ts +0 -1
- package/dist/components/Autocomplete.d.ts +0 -2
- package/dist/components/Avatar/Avatar.cjs +0 -126
- package/dist/components/Avatar/Avatar.cjs.map +0 -1
- package/dist/components/Avatar/Avatar.d.ts +0 -19
- package/dist/components/Avatar/Avatar.js +0 -126
- package/dist/components/Avatar/Avatar.js.map +0 -1
- package/dist/components/Avatar/index.d.ts +0 -1
- package/dist/components/Card/Card.cjs +0 -28
- package/dist/components/Card/Card.cjs.map +0 -1
- package/dist/components/Card/Card.d.ts +0 -13
- package/dist/components/Card/Card.js +0 -28
- package/dist/components/Card/Card.js.map +0 -1
- package/dist/components/Card/index.d.ts +0 -1
- package/dist/components/Card.d.ts +0 -2
- package/dist/components/Chip/Chip.cjs.map +0 -1
- package/dist/components/Chip/Chip.js.map +0 -1
- package/dist/components/Chip/index.d.ts +0 -1
- package/dist/components/Chip.d.ts +0 -2
- package/dist/components/DatePicker/DatePicker.cjs +0 -5
- package/dist/components/DatePicker/DatePicker.cjs.map +0 -1
- package/dist/components/DatePicker/DatePicker.d.ts +0 -18
- package/dist/components/DatePicker/DatePicker.js +0 -5
- package/dist/components/DatePicker/DatePicker.js.map +0 -1
- package/dist/components/DatePicker/index.d.ts +0 -1
- package/dist/components/DatePicker.d.ts +0 -2
- package/dist/components/DateTimePicker/DateTimePicker.cjs +0 -208
- package/dist/components/DateTimePicker/DateTimePicker.cjs.map +0 -1
- package/dist/components/DateTimePicker/DateTimePicker.d.ts +0 -28
- package/dist/components/DateTimePicker/DateTimePicker.js +0 -208
- package/dist/components/DateTimePicker/DateTimePicker.js.map +0 -1
- package/dist/components/DateTimePicker/index.d.ts +0 -1
- package/dist/components/DateTimePicker.d.ts +0 -2
- package/dist/components/Gallery/Gallery.cjs.map +0 -1
- package/dist/components/Gallery/Gallery.d.ts +0 -12
- package/dist/components/Gallery/Gallery.js.map +0 -1
- package/dist/components/Gallery/GalleryLightbox.d.ts +0 -20
- package/dist/components/Gallery/GalleryThumbnails.d.ts +0 -17
- package/dist/components/Gallery/index.d.ts +0 -1
- package/dist/components/Gallery.d.ts +0 -2
- package/dist/components/Icon/Icon.cjs.map +0 -1
- package/dist/components/Icon/Icon.d.ts +0 -21
- package/dist/components/Icon/Icon.js.map +0 -1
- package/dist/components/Icon/index.d.ts +0 -1
- package/dist/components/Icon.d.ts +0 -2
- package/dist/components/Input/Input.cjs +0 -5
- package/dist/components/Input/Input.cjs.map +0 -1
- package/dist/components/Input/Input.d.ts +0 -32
- package/dist/components/Input/Input.js +0 -5
- package/dist/components/Input/Input.js.map +0 -1
- package/dist/components/Input/index.d.ts +0 -1
- package/dist/components/Input.d.ts +0 -2
- package/dist/components/InputGroup/InputGroup.cjs +0 -126
- package/dist/components/InputGroup/InputGroup.cjs.map +0 -1
- package/dist/components/InputGroup/InputGroup.d.ts +0 -6
- package/dist/components/InputGroup/InputGroup.js +0 -126
- package/dist/components/InputGroup/InputGroup.js.map +0 -1
- package/dist/components/InputGroup/index.d.ts +0 -1
- package/dist/components/InputGroup.d.ts +0 -2
- package/dist/components/Modal/Modal.cjs +0 -209
- package/dist/components/Modal/Modal.cjs.map +0 -1
- package/dist/components/Modal/Modal.d.ts +0 -29
- package/dist/components/Modal/Modal.js +0 -209
- package/dist/components/Modal/Modal.js.map +0 -1
- package/dist/components/Modal/ModalBody.d.ts +0 -6
- package/dist/components/Modal/ModalFooter.d.ts +0 -19
- package/dist/components/Modal/ModalHeader.d.ts +0 -6
- package/dist/components/Modal/index.d.ts +0 -1
- package/dist/components/Modal.d.ts +0 -2
- package/dist/components/Select/Select.cjs +0 -6
- package/dist/components/Select/Select.cjs.map +0 -1
- package/dist/components/Select/Select.d.ts +0 -60
- package/dist/components/Select/Select.definitions.d.ts +0 -14
- package/dist/components/Select/Select.js +0 -6
- package/dist/components/Select/Select.js.map +0 -1
- package/dist/components/Select/index.d.ts +0 -1
- package/dist/components/Select.d.ts +0 -2
- package/dist/components/Stat/index.d.ts +0 -1
- package/dist/components/Stat.d.ts +0 -2
- package/dist/components/StatusMessage/StatusMessage.cjs +0 -79
- package/dist/components/StatusMessage/StatusMessage.cjs.map +0 -1
- package/dist/components/StatusMessage/StatusMessage.d.ts +0 -44
- package/dist/components/StatusMessage/StatusMessage.js +0 -79
- package/dist/components/StatusMessage/StatusMessage.js.map +0 -1
- package/dist/components/StatusMessage/index.d.ts +0 -1
- package/dist/components/StatusMessage.d.ts +0 -2
- package/dist/components/Stepper/Stepper.cjs +0 -46
- package/dist/components/Stepper/Stepper.cjs.map +0 -1
- package/dist/components/Stepper/Stepper.d.ts +0 -11
- package/dist/components/Stepper/Stepper.js +0 -46
- package/dist/components/Stepper/Stepper.js.map +0 -1
- package/dist/components/Stepper/index.d.ts +0 -2
- package/dist/components/Stepper.d.ts +0 -2
- package/dist/components/Tabs/Tabs.cjs +0 -96
- package/dist/components/Tabs/Tabs.cjs.map +0 -1
- package/dist/components/Tabs/Tabs.d.ts +0 -19
- package/dist/components/Tabs/Tabs.js +0 -96
- package/dist/components/Tabs/Tabs.js.map +0 -1
- package/dist/components/Tabs/index.d.ts +0 -2
- package/dist/components/Tabs.d.ts +0 -2
- package/dist/components/Timeline/Timeline.cjs.map +0 -1
- package/dist/components/Timeline/Timeline.d.ts +0 -13
- package/dist/components/Timeline/Timeline.js.map +0 -1
- package/dist/components/Timeline/index.d.ts +0 -2
- package/dist/components/Timeline.d.ts +0 -2
- package/dist/index.cjs +0 -2
- package/dist/index.cjs.map +0 -1
- package/dist/index.d.ts +0 -0
- package/dist/index.js +0 -2
- package/dist/index.js.map +0 -1
- package/dist/styles.css +0 -112
- package/rollup.config.cjs +0 -87
- package/src/components/Autocomplete/Autocomplete.definitions.ts +0 -254
- package/src/components/Autocomplete/Autocomplete.stories.tsx +0 -387
- package/src/components/Autocomplete/Autocomplete.tsx +0 -139
- package/src/components/Autocomplete/index.ts +0 -1
- package/src/components/Avatar/Avatar.stories.tsx +0 -54
- package/src/components/Avatar/Avatar.tsx +0 -143
- package/src/components/Avatar/index.ts +0 -1
- package/src/components/Button/Button.definition.ts +0 -97
- package/src/components/Button/Button.stories.tsx +0 -285
- package/src/components/Button/Button.tsx +0 -67
- package/src/components/Button/index.ts +0 -1
- package/src/components/Card/Card.definition.ts +0 -5
- package/src/components/Card/Card.stories.tsx +0 -32
- package/src/components/Card/Card.tsx +0 -44
- package/src/components/Card/index.ts +0 -1
- package/src/components/Chip/Chip.definitions.ts +0 -167
- package/src/components/Chip/Chip.stories.tsx +0 -265
- package/src/components/Chip/Chip.tsx +0 -61
- package/src/components/Chip/index.ts +0 -1
- package/src/components/Column/Column.tsx +0 -29
- package/src/components/Column/index.ts +0 -1
- package/src/components/DatePicker/DatePicker.definitions.ts +0 -205
- package/src/components/DatePicker/DatePicker.stories.tsx +0 -282
- package/src/components/DatePicker/DatePicker.tsx +0 -165
- package/src/components/DatePicker/index.ts +0 -1
- package/src/components/DateRangePicker/DateRangePicker.definitions.ts +0 -191
- package/src/components/DateRangePicker/DateRangePicker.stories.tsx +0 -252
- package/src/components/DateRangePicker/DateRangePicker.tsx +0 -56
- package/src/components/DateRangePicker/index.ts +0 -1
- package/src/components/DateTimePicker/DateTimePicker.definitions.ts +0 -232
- package/src/components/DateTimePicker/DateTimePicker.stories.tsx +0 -390
- package/src/components/DateTimePicker/DateTimePicker.tsx +0 -191
- package/src/components/DateTimePicker/index.ts +0 -1
- package/src/components/Flyout/Flyout.stories.tsx +0 -274
- package/src/components/Flyout/Flyout.tsx +0 -122
- package/src/components/Flyout/index.ts +0 -1
- package/src/components/Gallery/Gallery.definition.tsx +0 -37
- package/src/components/Gallery/Gallery.stories.tsx +0 -82
- package/src/components/Gallery/Gallery.tsx +0 -118
- package/src/components/Gallery/GalleryLightbox.tsx +0 -170
- package/src/components/Gallery/GalleryMain.tsx +0 -84
- package/src/components/Gallery/GalleryThumbnails.tsx +0 -106
- package/src/components/Gallery/index.ts +0 -1
- package/src/components/Icon/Icon.stories.tsx +0 -54
- package/src/components/Icon/Icon.tsx +0 -94
- package/src/components/Icon/index.ts +0 -2
- package/src/components/Input/Input.definitions.ts +0 -252
- package/src/components/Input/Input.stories.tsx +0 -387
- package/src/components/Input/Input.tsx +0 -186
- package/src/components/Input/index.ts +0 -1
- package/src/components/InputGroup/InputGroup.stories.tsx +0 -136
- package/src/components/InputGroup/InputGroup.tsx +0 -136
- package/src/components/InputGroup/index.ts +0 -1
- package/src/components/MenuButton/MenuButton.stories.tsx +0 -197
- package/src/components/MenuButton/MenuButton.tsx +0 -100
- package/src/components/MenuButton/index.ts +0 -1
- package/src/components/Modal/Modal.stories.tsx +0 -293
- package/src/components/Modal/Modal.tsx +0 -173
- package/src/components/Modal/ModalBody.tsx +0 -16
- package/src/components/Modal/ModalFooter.tsx +0 -61
- package/src/components/Modal/ModalHeader.tsx +0 -18
- package/src/components/Modal/index.ts +0 -1
- package/src/components/Select/Select.definitions.ts +0 -488
- package/src/components/Select/Select.stories.tsx +0 -569
- package/src/components/Select/Select.tsx +0 -468
- package/src/components/Select/index.ts +0 -1
- package/src/components/Stat/Stat.stories.tsx +0 -85
- package/src/components/Stat/Stat.tsx +0 -117
- package/src/components/Stat/index.ts +0 -2
- package/src/components/StatusMessage/StatusMessage.stories.tsx +0 -130
- package/src/components/StatusMessage/StatusMessage.tsx +0 -162
- package/src/components/StatusMessage/index.ts +0 -2
- package/src/components/Stepper/Step.tsx +0 -21
- package/src/components/Stepper/Stepper.definition.ts +0 -75
- package/src/components/Stepper/Stepper.stories.tsx +0 -122
- package/src/components/Stepper/Stepper.tsx +0 -59
- package/src/components/Stepper/index.ts +0 -2
- package/src/components/Table/EmptyTable.png +0 -0
- package/src/components/Table/Table.definition.ts +0 -580
- package/src/components/Table/Table.stories.tsx +0 -853
- package/src/components/Table/Table.tsx +0 -495
- package/src/components/Table/data.ts +0 -134
- package/src/components/Table/exportsUtils.ts +0 -195
- package/src/components/Table/index.ts +0 -3
- package/src/components/Table/types.ts +0 -34
- package/src/components/Tabs/Tab.definition.ts +0 -53
- package/src/components/Tabs/Tab.tsx +0 -19
- package/src/components/Tabs/Tabs.stories.tsx +0 -118
- package/src/components/Tabs/Tabs.tsx +0 -99
- package/src/components/Tabs/_tabUtils.tsx +0 -4
- package/src/components/Tabs/index.ts +0 -2
- package/src/components/Timeline/Timeline.definition.ts +0 -43
- package/src/components/Timeline/Timeline.stories.tsx +0 -108
- package/src/components/Timeline/Timeline.tsx +0 -49
- package/src/components/Timeline/TimelineItem.tsx +0 -31
- package/src/components/Timeline/index.ts +0 -2
- package/src/components/Tooltip/Tooltip.stories.tsx +0 -117
- package/src/components/Tooltip/Tooltip.tsx +0 -58
- package/src/components/Tooltip/index.ts +0 -1
- package/src/hooks/ClipBoard/ClipBoard.stories.tsx +0 -168
- package/src/hooks/ClipBoard/ClipBoard.tsx +0 -131
- package/src/hooks/ClipBoard/ClipboardUnifiedDemo.tsx +0 -111
- package/src/hooks/ClipBoard/index.ts +0 -1
- package/src/index.ts +0 -1
- package/src/styles.css +0 -3
- package/tailwind.config.js +0 -10
- package/tsconfig.json +0 -48
- package/tsup.config.js +0 -41
- package/vite.config.js +0 -132
- package/vitest.config.ts +0 -35
- /package/{dist/Button-C17mExpd.cjs → Button-C17mExpd.cjs} +0 -0
- /package/{dist/Button-UkkP-bNw.js → Button-UkkP-bNw.js} +0 -0
- /package/{Readme.md → README.md} +0 -0
- /package/{dist/components → components}/Avatar.d.ts +0 -0
- /package/{dist/components → components}/Button/Button.cjs +0 -0
- /package/{dist/components → components}/Button/Button.cjs.map +0 -0
- /package/{dist/components → components}/Button/Button.definition.d.ts +0 -0
- /package/{dist/components → components}/Button/Button.js +0 -0
- /package/{dist/components → components}/Button/Button.js.map +0 -0
- /package/{dist/components → components}/Button.d.ts +0 -0
- /package/{dist/components → components}/Card/Card.definition.d.ts +0 -0
- /package/{dist/components → components}/Chip/Chip.d.ts +0 -0
- /package/{dist/components → components}/Chip/Chip.definitions.d.ts +0 -0
- /package/{dist/components → components}/Column/Column.cjs +0 -0
- /package/{dist/components → components}/Column/Column.cjs.map +0 -0
- /package/{dist/components → components}/Column/Column.d.ts +0 -0
- /package/{dist/components → components}/Column/Column.js +0 -0
- /package/{dist/components → components}/Column/Column.js.map +0 -0
- /package/{dist/components → components}/Column/index.d.ts +0 -0
- /package/{dist/components → components}/Column.d.ts +0 -0
- /package/{dist/components → components}/DateRangePicker/DateRangePicker.cjs +0 -0
- /package/{dist/components → components}/DateRangePicker/DateRangePicker.cjs.map +0 -0
- /package/{dist/components → components}/DateRangePicker/DateRangePicker.d.ts +0 -0
- /package/{dist/components → components}/DateRangePicker/DateRangePicker.definitions.d.ts +0 -0
- /package/{dist/components → components}/DateRangePicker/DateRangePicker.js +0 -0
- /package/{dist/components → components}/DateRangePicker/DateRangePicker.js.map +0 -0
- /package/{dist/components → components}/DateRangePicker/index.d.ts +0 -0
- /package/{dist/components → components}/DateRangePicker.d.ts +0 -0
- /package/{dist/components → components}/Flyout/Flyout.cjs +0 -0
- /package/{dist/components → components}/Flyout/Flyout.cjs.map +0 -0
- /package/{dist/components → components}/Flyout/Flyout.d.ts +0 -0
- /package/{dist/components → components}/Flyout/Flyout.js +0 -0
- /package/{dist/components → components}/Flyout/Flyout.js.map +0 -0
- /package/{dist/components → components}/Flyout/index.d.ts +0 -0
- /package/{dist/components → components}/Flyout.d.ts +0 -0
- /package/{dist/components → components}/Gallery/Gallery.definition.d.ts +0 -0
- /package/{dist/components → components}/MenuButton/MenuButton.cjs +0 -0
- /package/{dist/components → components}/MenuButton/MenuButton.cjs.map +0 -0
- /package/{dist/components → components}/MenuButton/MenuButton.d.ts +0 -0
- /package/{dist/components → components}/MenuButton/MenuButton.js +0 -0
- /package/{dist/components → components}/MenuButton/MenuButton.js.map +0 -0
- /package/{dist/components → components}/MenuButton/index.d.ts +0 -0
- /package/{dist/components → components}/MenuButton.d.ts +0 -0
- /package/{dist/components → components}/Stat/Stat.d.ts +0 -0
- /package/{dist/components → components}/Stepper/Step.d.ts +0 -0
- /package/{dist/components → components}/Stepper/Stepper.definition.d.ts +0 -0
- /package/{dist/components → components}/Table/Table.cjs +0 -0
- /package/{dist/components → components}/Table/Table.cjs.map +0 -0
- /package/{dist/components → components}/Table/Table.d.ts +0 -0
- /package/{dist/components → components}/Table/Table.definition.d.ts +0 -0
- /package/{dist/components → components}/Table/Table.js +0 -0
- /package/{dist/components → components}/Table/Table.js.map +0 -0
- /package/{dist/components → components}/Table/data.d.ts +0 -0
- /package/{dist/components → components}/Table/exportsUtils.d.ts +0 -0
- /package/{dist/components → components}/Table/index.d.ts +0 -0
- /package/{dist/components → components}/Table/types.d.ts +0 -0
- /package/{dist/components → components}/Table.d.ts +0 -0
- /package/{dist/components → components}/Tabs/Tab.d.ts +0 -0
- /package/{dist/components → components}/Tabs/Tab.definition.d.ts +0 -0
- /package/{dist/components → components}/Tabs/_tabUtils.d.ts +0 -0
- /package/{dist/components → components}/Timeline/Timeline.definition.d.ts +0 -0
- /package/{dist/components → components}/Timeline/TimelineItem.d.ts +0 -0
- /package/{dist/components → components}/Tooltip/Tooltip.cjs +0 -0
- /package/{dist/components → components}/Tooltip/Tooltip.cjs.map +0 -0
- /package/{dist/components → components}/Tooltip/Tooltip.d.ts +0 -0
- /package/{dist/components → components}/Tooltip/Tooltip.js +0 -0
- /package/{dist/components → components}/Tooltip/Tooltip.js.map +0 -0
- /package/{dist/components → components}/Tooltip/index.d.ts +0 -0
- /package/{dist/components → components}/Tooltip.d.ts +0 -0
- /package/{dist/hooks → hooks}/ClipBoard/ClipBoard.cjs +0 -0
- /package/{dist/hooks → hooks}/ClipBoard/ClipBoard.cjs.map +0 -0
- /package/{dist/hooks → hooks}/ClipBoard/ClipBoard.d.ts +0 -0
- /package/{dist/hooks → hooks}/ClipBoard/ClipBoard.js +0 -0
- /package/{dist/hooks → hooks}/ClipBoard/ClipBoard.js.map +0 -0
- /package/{dist/hooks → hooks}/ClipBoard/ClipboardUnifiedDemo.d.ts +0 -0
- /package/{dist/hooks → hooks}/ClipBoard/index.d.ts +0 -0
- /package/{dist/hooks → hooks}/ClipBoard.d.ts +0 -0
- /package/{dist/index.css → index.css} +0 -0
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { SxProps, Theme } from '@mui/material/styles';
|
|
2
|
+
import { AutocompleteValueKey, SelectOption } from './Autocomplete';
|
|
3
|
+
/** Resuelve un value único a su SelectOption dentro del pool. */
|
|
4
|
+
export declare const resolveSingleValue: <TValue>(options: SelectOption<TValue>[], value: TValue | null | undefined, getKey: (v: TValue) => AutocompleteValueKey) => SelectOption<TValue> | null;
|
|
5
|
+
/** Resuelve un array de values a sus SelectOption dentro del pool. */
|
|
6
|
+
export declare const resolveMultipleValue: <TValue>(options: SelectOption<TValue>[], value: TValue[] | null | undefined, getKey: (v: TValue) => AutocompleteValueKey) => SelectOption<TValue>[];
|
|
7
|
+
/** Merge de sx base + extra del consumer, respetando el contrato de MUI. */
|
|
8
|
+
export declare const mergeSx: (base: SxProps<Theme>, extra?: SxProps<Theme>) => SxProps<Theme>;
|
|
9
|
+
/**
|
|
10
|
+
* Compara dos valores resueltos (single o multiple) estructuralmente para
|
|
11
|
+
* decidir si se puede reusar la referencia previa. Se usa para estabilizar la
|
|
12
|
+
* referencia que se pasa a MUI Autocomplete (MUI compara value por referencia
|
|
13
|
+
* con `!==`, y una nueva referencia — aunque el contenido sea igual — dispara
|
|
14
|
+
* `resetInputValue` y borra el texto mientras el usuario tipea).
|
|
15
|
+
*
|
|
16
|
+
* Comparamos todas las props del SelectOption, no solo `value`, para que un
|
|
17
|
+
* refresh de metadata (label/img/etc.) invalide la referencia estabilizada
|
|
18
|
+
* y la UI muestre los datos actualizados.
|
|
19
|
+
*/
|
|
20
|
+
export declare const areResolvedValuesEqual: <TValue>(prev: SelectOption<TValue> | SelectOption<TValue>[] | null, next: SelectOption<TValue> | SelectOption<TValue>[] | null, multiple: boolean, getKey: (v: TValue) => AutocompleteValueKey) => boolean;
|
|
21
|
+
/** Determina si un valor resuelto está vacío (para placeholder/shrink). */
|
|
22
|
+
export declare const isResolvedValueEmpty: (resolvedValue: unknown, multiple: boolean) => boolean;
|
|
@@ -0,0 +1,313 @@
|
|
|
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, jsxs, Fragment } from "react/jsx-runtime";
|
|
33
|
+
import { useState, useRef, useMemo } from "react";
|
|
34
|
+
import { Chip, Avatar, Box, CircularProgress, Typography, Autocomplete as Autocomplete$1, TextField } from "@mui/material";
|
|
35
|
+
import { useTheme } from "@mui/material/styles";
|
|
36
|
+
import { b as buildFormFieldSx } from "../../formField.sx-8_QRnKxv.js";
|
|
37
|
+
import { r as resolvePreset } from "../../resolvePreset-B-IB0ehH.js";
|
|
38
|
+
import ClearIcon from "@mui/icons-material/Clear";
|
|
39
|
+
const buildAutocompleteSx = (borderRadius, labelPosition) => buildFormFieldSx({
|
|
40
|
+
borderRadius,
|
|
41
|
+
labelPosition,
|
|
42
|
+
extraOutsideSx: {
|
|
43
|
+
// El input interno del Autocomplete.
|
|
44
|
+
"& .MuiAutocomplete-input": {
|
|
45
|
+
paddingTop: "4px",
|
|
46
|
+
paddingBottom: "4px"
|
|
47
|
+
},
|
|
48
|
+
// Contenedor del input (donde viven los chips en modo multiple).
|
|
49
|
+
"& .MuiAutocomplete-inputRoot": {
|
|
50
|
+
paddingTop: "4px",
|
|
51
|
+
paddingBottom: "4px"
|
|
52
|
+
}
|
|
53
|
+
}
|
|
54
|
+
});
|
|
55
|
+
const resolveSingleValue = (options, value, getKey) => {
|
|
56
|
+
var _a;
|
|
57
|
+
if (value === null || value === void 0) return null;
|
|
58
|
+
const key = getKey(value);
|
|
59
|
+
return (_a = options.find((o) => getKey(o.value) === key)) != null ? _a : null;
|
|
60
|
+
};
|
|
61
|
+
const resolveMultipleValue = (options, value, getKey) => {
|
|
62
|
+
if (!Array.isArray(value)) return [];
|
|
63
|
+
const keys = new Set(value.map(getKey));
|
|
64
|
+
return options.filter((o) => keys.has(getKey(o.value)));
|
|
65
|
+
};
|
|
66
|
+
const areOptionsShallowEqual = (a, b, getKey) => {
|
|
67
|
+
const keysA = Object.keys(a);
|
|
68
|
+
const keysB = Object.keys(b);
|
|
69
|
+
if (keysA.length !== keysB.length) return false;
|
|
70
|
+
return keysA.every((k) => {
|
|
71
|
+
if (k === "value") return getKey(a.value) === getKey(b.value);
|
|
72
|
+
return a[k] === b[k];
|
|
73
|
+
});
|
|
74
|
+
};
|
|
75
|
+
const areResolvedValuesEqual = (prev, next, multiple, getKey) => {
|
|
76
|
+
if (multiple) {
|
|
77
|
+
if (!Array.isArray(prev) || !Array.isArray(next)) return false;
|
|
78
|
+
if (prev.length !== next.length) return false;
|
|
79
|
+
return prev.every((o, i) => {
|
|
80
|
+
const n2 = next[i];
|
|
81
|
+
return !!n2 && areOptionsShallowEqual(o, n2, getKey);
|
|
82
|
+
});
|
|
83
|
+
}
|
|
84
|
+
const p = prev;
|
|
85
|
+
const n = next;
|
|
86
|
+
if (p === n) return true;
|
|
87
|
+
if (!p || !n) return false;
|
|
88
|
+
return areOptionsShallowEqual(p, n, getKey);
|
|
89
|
+
};
|
|
90
|
+
const isResolvedValueEmpty = (resolvedValue, multiple) => {
|
|
91
|
+
if (multiple) {
|
|
92
|
+
return !Array.isArray(resolvedValue) || resolvedValue.length === 0;
|
|
93
|
+
}
|
|
94
|
+
return !resolvedValue;
|
|
95
|
+
};
|
|
96
|
+
const AutocompleteOption = ({
|
|
97
|
+
liProps,
|
|
98
|
+
option,
|
|
99
|
+
customRender
|
|
100
|
+
}) => {
|
|
101
|
+
return /* @__PURE__ */ jsx("li", __spreadProps(__spreadValues({}, liProps), { children: customRender ? customRender(option) : option.label }));
|
|
102
|
+
};
|
|
103
|
+
const AutocompleteChips = ({
|
|
104
|
+
value,
|
|
105
|
+
getTagProps,
|
|
106
|
+
size,
|
|
107
|
+
maxChipsToShow,
|
|
108
|
+
renderChipLabel,
|
|
109
|
+
getKey
|
|
110
|
+
}) => {
|
|
111
|
+
const displayed = value.slice(0, maxChipsToShow);
|
|
112
|
+
const hidden = value.length - maxChipsToShow;
|
|
113
|
+
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
114
|
+
displayed.map((option, index) => {
|
|
115
|
+
const _a = getTagProps({ index }), { key: _ignored } = _a, tagProps = __objRest(_a, ["key"]);
|
|
116
|
+
return /* @__PURE__ */ jsx(
|
|
117
|
+
Chip,
|
|
118
|
+
__spreadProps(__spreadValues({}, tagProps), {
|
|
119
|
+
size,
|
|
120
|
+
label: renderChipLabel ? renderChipLabel(option) : option.label,
|
|
121
|
+
avatar: option.img ? /* @__PURE__ */ jsx(Avatar, { src: option.img }) : void 0,
|
|
122
|
+
deleteIcon: /* @__PURE__ */ jsx(ClearIcon, {})
|
|
123
|
+
}),
|
|
124
|
+
getKey(option.value)
|
|
125
|
+
);
|
|
126
|
+
}),
|
|
127
|
+
hidden > 0 && /* @__PURE__ */ jsx(Chip, { size, label: `+${hidden} más` })
|
|
128
|
+
] });
|
|
129
|
+
};
|
|
130
|
+
const AutocompleteLoader = ({
|
|
131
|
+
text = "Cargando..."
|
|
132
|
+
}) => /* @__PURE__ */ jsxs(Box, { sx: { display: "flex", alignItems: "center", gap: 1 }, children: [
|
|
133
|
+
/* @__PURE__ */ jsx(CircularProgress, { size: 16 }),
|
|
134
|
+
/* @__PURE__ */ jsx(Typography, { variant: "body2", children: text })
|
|
135
|
+
] });
|
|
136
|
+
function Autocomplete(props) {
|
|
137
|
+
const {
|
|
138
|
+
label,
|
|
139
|
+
options,
|
|
140
|
+
placeholder,
|
|
141
|
+
multiple = false,
|
|
142
|
+
disabled = false,
|
|
143
|
+
readOnly = false,
|
|
144
|
+
loading = false,
|
|
145
|
+
error: errorProp = false,
|
|
146
|
+
helperText,
|
|
147
|
+
maxChipsToShow = 3,
|
|
148
|
+
renderOptionItem,
|
|
149
|
+
renderChipLabel,
|
|
150
|
+
renderSingleValue,
|
|
151
|
+
borderRadius = 10,
|
|
152
|
+
labelPosition = "outside",
|
|
153
|
+
size = "small",
|
|
154
|
+
noOptionsText = "No hay opciones",
|
|
155
|
+
loadingText,
|
|
156
|
+
sx,
|
|
157
|
+
preset,
|
|
158
|
+
textFieldProps,
|
|
159
|
+
onInputChange,
|
|
160
|
+
inputValue,
|
|
161
|
+
filterOptions,
|
|
162
|
+
freeSolo,
|
|
163
|
+
open,
|
|
164
|
+
onOpen,
|
|
165
|
+
onClose,
|
|
166
|
+
getOptionKey
|
|
167
|
+
} = props;
|
|
168
|
+
const getKey = getOptionKey != null ? getOptionKey : ((v) => v);
|
|
169
|
+
const [isFocused, setIsFocused] = useState(false);
|
|
170
|
+
const seenOptionsRef = useRef(/* @__PURE__ */ new Map());
|
|
171
|
+
for (const opt of options) {
|
|
172
|
+
seenOptionsRef.current.set(getKey(opt.value), opt);
|
|
173
|
+
}
|
|
174
|
+
const resolvePool = useMemo(() => {
|
|
175
|
+
const merged = new Map(seenOptionsRef.current);
|
|
176
|
+
for (const opt of options) merged.set(getKey(opt.value), opt);
|
|
177
|
+
return Array.from(merged.values());
|
|
178
|
+
}, [options]);
|
|
179
|
+
const prevResolvedRef = useRef(multiple ? [] : null);
|
|
180
|
+
const stabilizeResolved = (newVal) => {
|
|
181
|
+
if (areResolvedValuesEqual(prevResolvedRef.current, newVal, multiple, getKey)) {
|
|
182
|
+
return prevResolvedRef.current;
|
|
183
|
+
}
|
|
184
|
+
prevResolvedRef.current = newVal;
|
|
185
|
+
return newVal;
|
|
186
|
+
};
|
|
187
|
+
const theme = useTheme();
|
|
188
|
+
const presetSx = resolvePreset("Autocomplete", preset, theme);
|
|
189
|
+
const mergedSx = [
|
|
190
|
+
buildAutocompleteSx(borderRadius, labelPosition),
|
|
191
|
+
...presetSx ? [presetSx] : [],
|
|
192
|
+
...Array.isArray(sx) ? sx : sx ? [sx] : []
|
|
193
|
+
];
|
|
194
|
+
const renderAutocomplete = (resolvedValue2, handleChange) => {
|
|
195
|
+
const isEmpty = isResolvedValueEmpty(resolvedValue2, multiple);
|
|
196
|
+
const showPlaceholder = isEmpty && isFocused && !!placeholder;
|
|
197
|
+
const singleAdornment = !multiple && resolvedValue2 && renderSingleValue ? renderSingleValue(resolvedValue2) : null;
|
|
198
|
+
return /* @__PURE__ */ jsx(
|
|
199
|
+
Autocomplete$1,
|
|
200
|
+
{
|
|
201
|
+
multiple,
|
|
202
|
+
options,
|
|
203
|
+
value: resolvedValue2,
|
|
204
|
+
disabled,
|
|
205
|
+
readOnly,
|
|
206
|
+
loading,
|
|
207
|
+
sx: mergedSx,
|
|
208
|
+
freeSolo,
|
|
209
|
+
open,
|
|
210
|
+
onOpen,
|
|
211
|
+
onClose,
|
|
212
|
+
inputValue,
|
|
213
|
+
onInputChange,
|
|
214
|
+
filterOptions,
|
|
215
|
+
getOptionLabel: (opt) => {
|
|
216
|
+
var _a;
|
|
217
|
+
return typeof opt === "string" ? opt : (_a = opt == null ? void 0 : opt.label) != null ? _a : "";
|
|
218
|
+
},
|
|
219
|
+
isOptionEqualToValue: (a, b) => {
|
|
220
|
+
if (typeof a === "string" || typeof b === "string") return a === b;
|
|
221
|
+
if (!a || !b) return a === b;
|
|
222
|
+
return getKey(a.value) === getKey(b.value);
|
|
223
|
+
},
|
|
224
|
+
getOptionDisabled: (opt) => typeof opt === "string" ? false : !!(opt == null ? void 0 : opt.disabled),
|
|
225
|
+
onChange: handleChange,
|
|
226
|
+
onFocus: () => setIsFocused(true),
|
|
227
|
+
onBlur: () => setIsFocused(false),
|
|
228
|
+
renderOption: (liProps, option) => {
|
|
229
|
+
const _a = liProps, { key: _muiKey } = _a, liRest = __objRest(_a, ["key"]);
|
|
230
|
+
return /* @__PURE__ */ jsx(
|
|
231
|
+
AutocompleteOption,
|
|
232
|
+
{
|
|
233
|
+
liProps: liRest,
|
|
234
|
+
option,
|
|
235
|
+
customRender: renderOptionItem
|
|
236
|
+
},
|
|
237
|
+
getKey(option.value)
|
|
238
|
+
);
|
|
239
|
+
},
|
|
240
|
+
renderValue: multiple ? (value, getItemProps) => /* @__PURE__ */ jsx(
|
|
241
|
+
AutocompleteChips,
|
|
242
|
+
{
|
|
243
|
+
value,
|
|
244
|
+
getTagProps: getItemProps,
|
|
245
|
+
size,
|
|
246
|
+
maxChipsToShow,
|
|
247
|
+
renderChipLabel,
|
|
248
|
+
getKey
|
|
249
|
+
}
|
|
250
|
+
) : void 0,
|
|
251
|
+
noOptionsText,
|
|
252
|
+
loadingText: loadingText != null ? loadingText : /* @__PURE__ */ jsx(AutocompleteLoader, {}),
|
|
253
|
+
renderInput: (params) => {
|
|
254
|
+
var _a, _b, _c, _d;
|
|
255
|
+
const paramsInputLabel = params.InputLabelProps;
|
|
256
|
+
const consumerInputLabel = (_b = (_a = textFieldProps == null ? void 0 : textFieldProps.slotProps) == null ? void 0 : _a.inputLabel) != null ? _b : textFieldProps == null ? void 0 : textFieldProps.InputLabelProps;
|
|
257
|
+
const muiInputProps = params.InputProps;
|
|
258
|
+
const consumerInputProps = (_d = (_c = textFieldProps == null ? void 0 : textFieldProps.slotProps) == null ? void 0 : _c.input) != null ? _d : textFieldProps == null ? void 0 : textFieldProps.InputProps;
|
|
259
|
+
const inputSlot = singleAdornment ? __spreadProps(__spreadValues(__spreadValues({}, muiInputProps), consumerInputProps), {
|
|
260
|
+
startAdornment: /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
261
|
+
singleAdornment,
|
|
262
|
+
consumerInputProps == null ? void 0 : consumerInputProps.startAdornment,
|
|
263
|
+
muiInputProps == null ? void 0 : muiInputProps.startAdornment
|
|
264
|
+
] })
|
|
265
|
+
}) : void 0;
|
|
266
|
+
return /* @__PURE__ */ jsx(
|
|
267
|
+
TextField,
|
|
268
|
+
__spreadProps(__spreadValues(__spreadProps(__spreadValues({}, params), {
|
|
269
|
+
label,
|
|
270
|
+
size,
|
|
271
|
+
variant: "outlined",
|
|
272
|
+
placeholder: showPlaceholder ? placeholder : void 0,
|
|
273
|
+
error: !!errorProp,
|
|
274
|
+
helperText
|
|
275
|
+
}), textFieldProps), {
|
|
276
|
+
slotProps: __spreadProps(__spreadValues(__spreadValues({}, textFieldProps == null ? void 0 : textFieldProps.slotProps), inputSlot ? { input: inputSlot } : {}), {
|
|
277
|
+
inputLabel: __spreadProps(__spreadValues(__spreadValues({}, paramsInputLabel), consumerInputLabel), {
|
|
278
|
+
shrink: labelPosition === "outside" ? !isEmpty || isFocused : paramsInputLabel == null ? void 0 : paramsInputLabel.shrink
|
|
279
|
+
})
|
|
280
|
+
})
|
|
281
|
+
})
|
|
282
|
+
);
|
|
283
|
+
}
|
|
284
|
+
}
|
|
285
|
+
);
|
|
286
|
+
};
|
|
287
|
+
const extractValue = (opt) => {
|
|
288
|
+
var _a;
|
|
289
|
+
if (opt === null || opt === void 0) return null;
|
|
290
|
+
if (typeof opt === "string") return opt;
|
|
291
|
+
return (_a = opt == null ? void 0 : opt.value) != null ? _a : null;
|
|
292
|
+
};
|
|
293
|
+
const handleControlledChange = (_event, newValue) => {
|
|
294
|
+
const { onChange } = props;
|
|
295
|
+
if (multiple) {
|
|
296
|
+
const values = (newValue != null ? newValue : []).map((opt) => extractValue(opt)).filter((v) => v !== null);
|
|
297
|
+
onChange(values);
|
|
298
|
+
} else {
|
|
299
|
+
onChange(extractValue(newValue));
|
|
300
|
+
}
|
|
301
|
+
};
|
|
302
|
+
const resolvedValue = stabilizeResolved(
|
|
303
|
+
multiple ? resolveMultipleValue(resolvePool, props.value, getKey) : resolveSingleValue(resolvePool, props.value, getKey)
|
|
304
|
+
);
|
|
305
|
+
return renderAutocomplete(resolvedValue, handleControlledChange);
|
|
306
|
+
}
|
|
307
|
+
const AutocompleteSelect = Autocomplete;
|
|
308
|
+
export {
|
|
309
|
+
Autocomplete,
|
|
310
|
+
AutocompleteSelect,
|
|
311
|
+
Autocomplete as default
|
|
312
|
+
};
|
|
313
|
+
//# sourceMappingURL=Autocomplete.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Autocomplete.js","sources":["../../../src/components/Autocomplete/Autocomplete.sx.ts","../../../src/components/Autocomplete/Autocomplete.helpers.ts","../../../src/components/Autocomplete/_parts/AutocompleteOption.tsx","../../../src/components/Autocomplete/_parts/AutocompleteChips.tsx","../../../src/components/Autocomplete/_parts/AutocompleteLoader.tsx","../../../src/components/Autocomplete/Autocomplete.tsx"],"sourcesContent":["import type { SxProps, Theme } from '@mui/material/styles';\n\nimport { buildFormFieldSx } from '../_shared/formField.sx';\nimport type { LabelPosition } from './Autocomplete';\n\n/**\n * Builder del sx del Autocomplete. Reutiliza `buildFormFieldSx` y añade\n * los paddings propios del Autocomplete (chips + input interno).\n */\nexport const buildAutocompleteSx = (\n borderRadius: number | string,\n labelPosition: LabelPosition,\n): SxProps<Theme> =>\n buildFormFieldSx({\n borderRadius,\n labelPosition,\n extraOutsideSx: {\n // El input interno del Autocomplete.\n '& .MuiAutocomplete-input': {\n paddingTop: '4px',\n paddingBottom: '4px',\n },\n\n // Contenedor del input (donde viven los chips en modo multiple).\n '& .MuiAutocomplete-inputRoot': {\n paddingTop: '4px',\n paddingBottom: '4px',\n },\n },\n });\n","import type { SxProps, Theme } from '@mui/material/styles';\nimport type { AutocompleteValueKey, SelectOption } from './Autocomplete';\n\n/** Resuelve un value único a su SelectOption dentro del pool. */\nexport const resolveSingleValue = <TValue,>(\n options: SelectOption<TValue>[],\n value: TValue | null | undefined,\n getKey: (v: TValue) => AutocompleteValueKey,\n): SelectOption<TValue> | null => {\n if (value === null || value === undefined) return null;\n const key = getKey(value);\n return options.find((o) => getKey(o.value) === key) ?? null;\n};\n\n/** Resuelve un array de values a sus SelectOption dentro del pool. */\nexport const resolveMultipleValue = <TValue,>(\n options: SelectOption<TValue>[],\n value: TValue[] | null | undefined,\n getKey: (v: TValue) => AutocompleteValueKey,\n): SelectOption<TValue>[] => {\n if (!Array.isArray(value)) return [];\n const keys = new Set(value.map(getKey));\n return options.filter((o) => keys.has(getKey(o.value)));\n};\n\n/** Merge de sx base + extra del consumer, respetando el contrato de MUI. */\nexport const mergeSx = (\n base: SxProps<Theme>,\n extra?: SxProps<Theme>,\n): SxProps<Theme> => {\n if (!extra) return base;\n return [base, ...(Array.isArray(extra) ? extra : [extra])] as SxProps<Theme>;\n};\n\n/**\n * Compara dos SelectOption por todas sus props (shallow). Se usa para detectar\n * cambios de metadata (p.ej. `label`, `img`) cuando `value` no cambió, para\n * que la estabilización no tape datos frescos del server. Para `value` se\n * compara vía `getKey` (no por `===`), de modo que values objeto con misma\n * identidad lógica pero referencia distinta no rompan la estabilización.\n */\nconst areOptionsShallowEqual = <TValue,>(\n a: SelectOption<TValue>,\n b: SelectOption<TValue>,\n getKey: (v: TValue) => AutocompleteValueKey,\n): boolean => {\n const keysA = Object.keys(a);\n const keysB = Object.keys(b);\n if (keysA.length !== keysB.length) return false;\n return keysA.every((k) => {\n if (k === 'value') return getKey(a.value) === getKey(b.value);\n return a[k] === b[k];\n });\n};\n\n/**\n * Compara dos valores resueltos (single o multiple) estructuralmente para\n * decidir si se puede reusar la referencia previa. Se usa para estabilizar la\n * referencia que se pasa a MUI Autocomplete (MUI compara value por referencia\n * con `!==`, y una nueva referencia — aunque el contenido sea igual — dispara\n * `resetInputValue` y borra el texto mientras el usuario tipea).\n *\n * Comparamos todas las props del SelectOption, no solo `value`, para que un\n * refresh de metadata (label/img/etc.) invalide la referencia estabilizada\n * y la UI muestre los datos actualizados.\n */\nexport const areResolvedValuesEqual = <TValue,>(\n prev: SelectOption<TValue> | SelectOption<TValue>[] | null,\n next: SelectOption<TValue> | SelectOption<TValue>[] | null,\n multiple: boolean,\n getKey: (v: TValue) => AutocompleteValueKey,\n): boolean => {\n if (multiple) {\n if (!Array.isArray(prev) || !Array.isArray(next)) return false;\n if (prev.length !== next.length) return false;\n return prev.every((o, i) => {\n const n = next[i];\n return !!n && areOptionsShallowEqual(o, n, getKey);\n });\n }\n const p = prev as SelectOption<TValue> | null;\n const n = next as SelectOption<TValue> | null;\n if (p === n) return true;\n if (!p || !n) return false;\n return areOptionsShallowEqual(p, n, getKey);\n};\n\n/** Determina si un valor resuelto está vacío (para placeholder/shrink). */\nexport const isResolvedValueEmpty = (\n resolvedValue: unknown,\n multiple: boolean,\n): boolean => {\n if (multiple) {\n return !Array.isArray(resolvedValue) || resolvedValue.length === 0;\n }\n return !resolvedValue;\n};\n","import React from 'react';\nimport type {\n AutocompleteValueKey,\n RenderOptionItem,\n SelectOption,\n} from '../Autocomplete';\n\ninterface AutocompleteOptionProps<TValue = AutocompleteValueKey> {\n liProps: React.HTMLAttributes<HTMLLIElement>;\n option: SelectOption<TValue>;\n customRender?: RenderOptionItem<TValue>;\n}\n\n/**\n * Render por defecto de un `<li>` del dropdown del Autocomplete.\n * MUI lo invoca desde `renderOption={(props, option) => ...}` en el padre.\n *\n * La `key` la maneja el padre (`renderOption` en Autocomplete.tsx). Este\n * componente solo recibe los props restantes del `<li>` para spread.\n */\nexport const AutocompleteOption = <TValue,>({\n liProps,\n option,\n customRender,\n}: AutocompleteOptionProps<TValue>) => {\n return (\n <li {...liProps}>\n {customRender ? customRender(option) : option.label}\n </li>\n );\n};\n\nexport default AutocompleteOption;\n","import { Avatar, Chip } from '@mui/material';\nimport ClearIcon from '@mui/icons-material/Clear';\n\nimport type {\n AutocompleteSize,\n AutocompleteValueKey,\n RenderChipLabel,\n SelectOption,\n} from '../Autocomplete';\n\ninterface AutocompleteChipsProps<TValue = AutocompleteValueKey> {\n value: SelectOption<TValue>[];\n getTagProps: (args: { index: number }) => Record<string, any>;\n size: AutocompleteSize;\n maxChipsToShow: number;\n renderChipLabel?: RenderChipLabel<TValue>;\n /** Extrae la React key estable a partir del value (necesario para values objeto). */\n getKey: (value: TValue) => AutocompleteValueKey;\n}\n\n/**\n * Render de los chips del Autocomplete en modo multiple.\n * Trunca después de `maxChipsToShow` con un chip \"+N más\".\n * El `getTagProps({ index })` viene de MUI y contiene el handler de delete,\n * la key, etc. — se spreadea tal cual al Chip.\n */\nexport const AutocompleteChips = <TValue,>({\n value,\n getTagProps,\n size,\n maxChipsToShow,\n renderChipLabel,\n getKey,\n}: AutocompleteChipsProps<TValue>) => {\n const displayed = value.slice(0, maxChipsToShow);\n const hidden = value.length - maxChipsToShow;\n\n return (\n <>\n {displayed.map((option, index) => {\n const { key: _ignored, ...tagProps } = getTagProps({ index });\n return (\n <Chip\n key={getKey(option.value)}\n {...tagProps}\n size={size}\n label={renderChipLabel ? renderChipLabel(option) : option.label}\n avatar={option.img ? <Avatar src={option.img} /> : undefined}\n deleteIcon={<ClearIcon />}\n />\n );\n })}\n {hidden > 0 && <Chip size={size} label={`+${hidden} más`} />}\n </>\n );\n};\n\nexport default AutocompleteChips;\n","import React from 'react';\nimport { Box, CircularProgress, Typography } from '@mui/material';\n\n/**\n * Loader por defecto para el `loadingText` del Autocomplete.\n * El consumer puede sobrescribirlo pasando `loadingText` al componente padre.\n */\nexport const AutocompleteLoader: React.FC<{ text?: string }> = ({\n text = 'Cargando...',\n}) => (\n <Box sx={{ display: 'flex', alignItems: 'center', gap: 1 }}>\n <CircularProgress size={16} />\n <Typography variant=\"body2\">{text}</Typography>\n </Box>\n);\n\nexport default AutocompleteLoader;\n","import React, {\n useMemo,\n useRef,\n useState,\n type ReactNode,\n type SyntheticEvent,\n} from 'react';\nimport {\n Autocomplete as MuiAutocomplete,\n TextField,\n type TextFieldProps,\n} from '@mui/material';\nimport { useTheme, type SxProps, type Theme } from '@mui/material/styles';\n\nimport { buildAutocompleteSx } from './Autocomplete.sx';\nimport {\n areResolvedValuesEqual,\n isResolvedValueEmpty,\n resolveMultipleValue,\n resolveSingleValue,\n} from './Autocomplete.helpers';\nimport { resolvePreset } from '../_shared/resolvePreset';\nimport { AutocompleteOption } from './_parts/AutocompleteOption';\nimport { AutocompleteChips } from './_parts/AutocompleteChips';\nimport { AutocompleteLoader } from './_parts/AutocompleteLoader';\n\n// ── Tipos de dominio ─────────────────────────────────────────────────────\n/** Key estable usada para comparar values, indexar caches y como React key. */\nexport type AutocompleteValueKey = string | number;\n\nexport interface SelectOption<TValue = AutocompleteValueKey> {\n value: TValue;\n label: string;\n img?: string;\n disabled?: boolean;\n group?: string;\n [key: string]: any; //campos extras que puede tener la opcion\n}\n\nexport type LabelPosition = 'outside' | 'floating';\nexport type AutocompleteSize = 'small' | 'medium';\n\n// ── Render slots ─────────────────────────────────────────────────────────\nexport type RenderOptionItem<TValue = AutocompleteValueKey> = (\n item: SelectOption<TValue>,\n) => ReactNode;\nexport type RenderChipLabel<TValue = AutocompleteValueKey> = (\n item: SelectOption<TValue>,\n) => ReactNode;\nexport type RenderSingleValue<TValue = AutocompleteValueKey> = (\n item: SelectOption<TValue>,\n) => ReactNode;\n\n// ── Props base ───────────────────────────────────────────────────────────\nexport type BaseAutocompleteProps<TValue = AutocompleteValueKey> = {\n label?: string;\n options: SelectOption<TValue>[];\n placeholder?: string;\n multiple?: boolean;\n disabled?: boolean;\n readOnly?: boolean;\n loading?: boolean;\n error?: boolean;\n helperText?: string;\n maxChipsToShow?: number;\n renderOptionItem?: RenderOptionItem<TValue>;\n renderChipLabel?: RenderChipLabel<TValue>;\n /**\n * Renderiza JSX custom como `startAdornment` del input en single mode.\n * Recibe la `SelectOption` seleccionada. Útil para mostrar avatars, iconos,\n * etc. junto al texto del label. En `multiple` no aplica (se usa `renderChipLabel`).\n */\n renderSingleValue?: RenderSingleValue<TValue>;\n /**\n * Extrae una key estable (string | number) desde el `value`. Obligatorio\n * cuando `TValue` es un objeto: se usa para comparar values (`isOptionEqualToValue`,\n * resolución desde el value del form), indexar el cache interno de opciones\n * vistas y como React key en chips/options del dropdown. Para primitivos se\n * puede omitir (default: identidad, o sea `===`).\n */\n getOptionKey?: (value: TValue) => AutocompleteValueKey;\n /** Border radius del input. Default: 10. */\n borderRadius?: number | string;\n /** \"outside\" (default) = label arriba del input; \"floating\" = comportamiento nativo MUI. */\n labelPosition?: LabelPosition;\n /** Tamaño del TextField. Default: 'small'. */\n size?: AutocompleteSize;\n /** Texto cuando no hay coincidencias. */\n noOptionsText?: ReactNode;\n /** Texto cuando está cargando. */\n loadingText?: ReactNode;\n sx?: SxProps<Theme>;\n /**\n * Nombre del preset de estilo registrado en `theme.styles.Autocomplete`.\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 /** Props para el TextField subyacente. */\n textFieldProps?: Partial<TextFieldProps>;\n\n // ── Búsqueda asíncrona / remota ──────────────────────────────────────\n /** Se dispara cada vez que el usuario escribe. Útil para llamadas a servicios\n * (debounce recomendado en el consumer). */\n onInputChange?: (\n event: SyntheticEvent,\n value: string,\n reason: 'input' | 'reset' | 'clear' | 'blur' | 'selectOption' | 'removeOption',\n ) => void;\n /** Valor controlado del texto de búsqueda. */\n inputValue?: string;\n /** Filtro custom. Para búsqueda remota pasar `(x) => x` y confiar sólo en el servicio. */\n filterOptions?: (\n options: SelectOption<TValue>[],\n state: any,\n ) => SelectOption<TValue>[];\n /** Permite valores arbitrarios (no solo de la lista). */\n freeSolo?: boolean;\n open?: boolean;\n onOpen?: (event: SyntheticEvent) => void;\n onClose?: (event: SyntheticEvent, reason: string) => void;\n};\n\n// ── API pública final ────────────────────────────────────────────────────\nexport interface AutocompleteProps<TValue = AutocompleteValueKey>\n extends BaseAutocompleteProps<TValue> {\n value: TValue | TValue[] | null;\n onChange: (val: TValue | TValue[] | null) => void;\n name?: string;\n}\n\nexport function Autocomplete<TValue = AutocompleteValueKey>(\n props: AutocompleteProps<TValue>,\n) {\n const {\n label,\n options,\n placeholder,\n multiple = false,\n disabled = false,\n readOnly = false,\n loading = false,\n error: errorProp = false,\n helperText,\n maxChipsToShow = 3,\n renderOptionItem,\n renderChipLabel,\n renderSingleValue,\n borderRadius = 10,\n labelPosition = 'outside',\n size = 'small',\n noOptionsText = 'No hay opciones',\n loadingText,\n sx,\n preset,\n textFieldProps,\n onInputChange,\n inputValue,\n filterOptions,\n freeSolo,\n open,\n onOpen,\n onClose,\n getOptionKey,\n } = props as BaseAutocompleteProps<TValue>;\n\n // Default identidad: para primitivos (string|number) funciona como `===`.\n // Para values objeto, el consumer DEBE pasar `getOptionKey` o la igualdad\n // caerá a referencia (Map/Set agruparían por identidad).\n const getKey = (getOptionKey ??\n ((v: TValue) => v as unknown as AutocompleteValueKey)) as (\n v: TValue,\n ) => AutocompleteValueKey;\n\n // Focus tracking para mostrar placeholder solo cuando el label sube.\n const [isFocused, setIsFocused] = useState(false);\n\n // Cache interno de opciones vistas (indexado por key estable). Crítico para\n // async multiple: cuando `options` cambian por un nuevo search, los items\n // ya seleccionados no desaparecen de los chips porque los recordamos acá.\n const seenOptionsRef = useRef<\n Map<AutocompleteValueKey, SelectOption<TValue>>\n >(new Map());\n for (const opt of options) {\n seenOptionsRef.current.set(getKey(opt.value), opt);\n }\n\n // Pool de opciones para resolver values (merge de options + vistas).\n const resolvePool = useMemo<SelectOption<TValue>[]>(() => {\n const merged = new Map(seenOptionsRef.current);\n for (const opt of options) merged.set(getKey(opt.value), opt);\n return Array.from(merged.values());\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [options]);\n\n // Estabiliza la referencia del resolvedValue que pasamos a MUI Autocomplete.\n // MUI compara value con `!==`: una referencia nueva con mismo contenido\n // dispara resetInputValue() y borra el texto que el usuario está escribiendo.\n const prevResolvedRef = useRef<\n SelectOption<TValue>[] | SelectOption<TValue> | null\n >(multiple ? [] : null);\n\n const stabilizeResolved = (\n newVal: SelectOption<TValue>[] | SelectOption<TValue> | null,\n ): SelectOption<TValue>[] | SelectOption<TValue> | null => {\n if (\n areResolvedValuesEqual(prevResolvedRef.current, newVal, multiple, getKey)\n ) {\n return prevResolvedRef.current;\n }\n prevResolvedRef.current = newVal;\n return newVal;\n };\n\n const theme = useTheme();\n const presetSx = resolvePreset('Autocomplete', preset, theme);\n\n const mergedSx = [\n buildAutocompleteSx(borderRadius, labelPosition),\n ...(presetSx ? [presetSx] : []),\n ...(Array.isArray(sx) ? sx : sx ? [sx] : []),\n ];\n\n const renderAutocomplete = (\n resolvedValue: any,\n handleChange: (event: any, newValue: any) => void,\n ) => {\n const isEmpty = isResolvedValueEmpty(resolvedValue, multiple);\n const showPlaceholder = isEmpty && isFocused && !!placeholder;\n const singleAdornment =\n !multiple && resolvedValue && renderSingleValue\n ? renderSingleValue(resolvedValue as SelectOption<TValue>)\n : null;\n\n return (\n <MuiAutocomplete\n multiple={multiple}\n options={options}\n value={resolvedValue}\n disabled={disabled}\n readOnly={readOnly}\n loading={loading}\n sx={mergedSx}\n freeSolo={freeSolo as any}\n open={open}\n onOpen={onOpen}\n onClose={onClose}\n inputValue={inputValue}\n onInputChange={onInputChange}\n filterOptions={filterOptions as any}\n getOptionLabel={(opt) =>\n typeof opt === 'string' ? opt : (opt?.label ?? '')\n }\n isOptionEqualToValue={(a, b) => {\n if (typeof a === 'string' || typeof b === 'string') return a === b;\n if (!a || !b) return a === b;\n return getKey(a.value) === getKey(b.value);\n }}\n getOptionDisabled={(opt) =>\n typeof opt === 'string' ? false : !!opt?.disabled\n }\n onChange={handleChange}\n onFocus={() => setIsFocused(true)}\n onBlur={() => setIsFocused(false)}\n renderOption={(liProps, option) => {\n // MUI inyecta la `key` dentro de `liProps`. React necesita la key\n // en el elemento más externo que devuelve `renderOption` (acá el\n // wrapper), no en el `<li>` interno. El resto de `liProps` viaja\n // al `<li>`. La key auto-generada por MUI cae a `getOptionLabel`,\n // que colisiona si hay opciones con label duplicado. Usamos\n // `option.value` (único por contrato de SelectOption) para\n // garantizar uniqueness aunque haya labels repetidos.\n const { key: _muiKey, ...liRest } = liProps as React.HTMLAttributes<HTMLLIElement> & {\n key?: React.Key;\n };\n return (\n <AutocompleteOption<TValue>\n key={getKey(option.value)}\n liProps={liRest}\n option={option}\n customRender={renderOptionItem}\n />\n );\n }}\n renderValue={\n multiple\n ? (value, getItemProps) => (\n <AutocompleteChips<TValue>\n value={value as SelectOption<TValue>[]}\n getTagProps={getItemProps}\n size={size}\n maxChipsToShow={maxChipsToShow}\n renderChipLabel={renderChipLabel}\n getKey={getKey}\n />\n )\n : undefined\n }\n noOptionsText={noOptionsText}\n loadingText={loadingText ?? <AutocompleteLoader />}\n renderInput={(params) => {\n const paramsInputLabel =\n (params as any).InputLabelProps as Record<string, any> | undefined;\n const consumerInputLabel =\n (textFieldProps?.slotProps as any)?.inputLabel ??\n (textFieldProps as any)?.InputLabelProps;\n // Para inyectar `singleAdornment` necesitamos pasar `slotProps.input`\n // a TextField, pero `slotProps.input` gana sobre `params.InputProps`\n // (que trae endAdornment con chevron + clear). Por eso, cuando hay\n // adornment custom, mergeamos params.InputProps + lo que el consumer\n // haya pasado por textFieldProps + nuestro startAdornment. Si no hay\n // adornment, no tocamos `slotProps.input` y se preserva el flujo legacy.\n const muiInputProps = (params as any).InputProps as\n | Record<string, any>\n | undefined;\n const consumerInputProps =\n (textFieldProps?.slotProps as any)?.input ??\n (textFieldProps as any)?.InputProps;\n const inputSlot = singleAdornment\n ? {\n ...muiInputProps,\n ...consumerInputProps,\n startAdornment: (\n <>\n {singleAdornment}\n {consumerInputProps?.startAdornment}\n {muiInputProps?.startAdornment}\n </>\n ),\n }\n : undefined;\n\n return (\n <TextField\n {...params}\n label={label}\n size={size}\n variant=\"outlined\"\n placeholder={showPlaceholder ? placeholder : undefined}\n error={!!errorProp}\n helperText={helperText}\n {...textFieldProps}\n slotProps={{\n ...textFieldProps?.slotProps,\n ...(inputSlot ? { input: inputSlot } : {}),\n inputLabel: {\n ...paramsInputLabel,\n ...consumerInputLabel,\n shrink:\n labelPosition === 'outside'\n ? !isEmpty || isFocused\n : paramsInputLabel?.shrink,\n },\n }}\n />\n );\n }}\n />\n );\n };\n\n //obtiene el primitivo (o objeto) value desde la opción seleccionada\n const extractValue = (opt: any): TValue | null => {\n if (opt === null || opt === undefined) return null;\n if (typeof opt === 'string') return opt as unknown as TValue;\n return (opt?.value ?? null) as TValue | null;\n };\n\n const handleControlledChange = (_event: any, newValue: any) => {\n const { onChange } = props;\n if (multiple) {\n const values = (newValue ?? [])\n .map((opt: SelectOption<TValue> | string) => extractValue(opt))\n .filter((v: TValue | null): v is TValue => v !== null);\n onChange(values);\n } else {\n onChange(extractValue(newValue));\n }\n };\n\n const resolvedValue = stabilizeResolved(\n multiple\n ? resolveMultipleValue(resolvePool, props.value as TValue[], getKey)\n : resolveSingleValue(resolvePool, props.value as TValue, getKey),\n );\n\n return renderAutocomplete(resolvedValue, handleControlledChange);\n}\n\n/** Alias de `Autocomplete`. Ambos nombres son equivalentes. */\nexport const AutocompleteSelect = Autocomplete;\n\nexport default Autocomplete;\n"],"names":["n","resolvedValue","MuiAutocomplete"],"mappings":"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"}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { SxProps, Theme } from '@mui/material/styles';
|
|
2
|
+
import { LabelPosition } from './Autocomplete';
|
|
3
|
+
/**
|
|
4
|
+
* Builder del sx del Autocomplete. Reutiliza `buildFormFieldSx` y añade
|
|
5
|
+
* los paddings propios del Autocomplete (chips + input interno).
|
|
6
|
+
*/
|
|
7
|
+
export declare const buildAutocompleteSx: (borderRadius: number | string, labelPosition: LabelPosition) => SxProps<Theme>;
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { AutocompleteSize, AutocompleteValueKey, RenderChipLabel, SelectOption } from '../Autocomplete';
|
|
2
|
+
interface AutocompleteChipsProps<TValue = AutocompleteValueKey> {
|
|
3
|
+
value: SelectOption<TValue>[];
|
|
4
|
+
getTagProps: (args: {
|
|
5
|
+
index: number;
|
|
6
|
+
}) => Record<string, any>;
|
|
7
|
+
size: AutocompleteSize;
|
|
8
|
+
maxChipsToShow: number;
|
|
9
|
+
renderChipLabel?: RenderChipLabel<TValue>;
|
|
10
|
+
/** Extrae la React key estable a partir del value (necesario para values objeto). */
|
|
11
|
+
getKey: (value: TValue) => AutocompleteValueKey;
|
|
12
|
+
}
|
|
13
|
+
/**
|
|
14
|
+
* Render de los chips del Autocomplete en modo multiple.
|
|
15
|
+
* Trunca después de `maxChipsToShow` con un chip "+N más".
|
|
16
|
+
* El `getTagProps({ index })` viene de MUI y contiene el handler de delete,
|
|
17
|
+
* la key, etc. — se spreadea tal cual al Chip.
|
|
18
|
+
*/
|
|
19
|
+
export declare const AutocompleteChips: <TValue>({ value, getTagProps, size, maxChipsToShow, renderChipLabel, getKey, }: AutocompleteChipsProps<TValue>) => import("react/jsx-runtime").JSX.Element;
|
|
20
|
+
export default AutocompleteChips;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
/**
|
|
3
|
+
* Loader por defecto para el `loadingText` del Autocomplete.
|
|
4
|
+
* El consumer puede sobrescribirlo pasando `loadingText` al componente padre.
|
|
5
|
+
*/
|
|
6
|
+
export declare const AutocompleteLoader: React.FC<{
|
|
7
|
+
text?: string;
|
|
8
|
+
}>;
|
|
9
|
+
export default AutocompleteLoader;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
import { AutocompleteValueKey, RenderOptionItem, SelectOption } from '../Autocomplete';
|
|
3
|
+
interface AutocompleteOptionProps<TValue = AutocompleteValueKey> {
|
|
4
|
+
liProps: React.HTMLAttributes<HTMLLIElement>;
|
|
5
|
+
option: SelectOption<TValue>;
|
|
6
|
+
customRender?: RenderOptionItem<TValue>;
|
|
7
|
+
}
|
|
8
|
+
/**
|
|
9
|
+
* Render por defecto de un `<li>` del dropdown del Autocomplete.
|
|
10
|
+
* MUI lo invoca desde `renderOption={(props, option) => ...}` en el padre.
|
|
11
|
+
*
|
|
12
|
+
* La `key` la maneja el padre (`renderOption` en Autocomplete.tsx). Este
|
|
13
|
+
* componente solo recibe los props restantes del `<li>` para spread.
|
|
14
|
+
*/
|
|
15
|
+
export declare const AutocompleteOption: <TValue>({ liProps, option, customRender, }: AutocompleteOptionProps<TValue>) => import("react/jsx-runtime").JSX.Element;
|
|
16
|
+
export default AutocompleteOption;
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
export { Autocomplete, AutocompleteSelect, default } from './Autocomplete';
|
|
2
|
+
export type { AutocompleteProps, SelectOption, BaseAutocompleteProps, RenderOptionItem, RenderChipLabel, RenderSingleValue, LabelPosition, AutocompleteSize, AutocompleteValueKey, } from './Autocomplete';
|
|
@@ -0,0 +1,162 @@
|
|
|
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
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
22
|
+
const jsxRuntime = require("react/jsx-runtime");
|
|
23
|
+
const React = require("react");
|
|
24
|
+
const material = require("@mui/material");
|
|
25
|
+
const AccountCircleIcon = require("@mui/icons-material/AccountCircle");
|
|
26
|
+
const sizeMap = {
|
|
27
|
+
sm: { px: 32, border: 2, font: 14, overlap: 8 },
|
|
28
|
+
md: { px: 40, border: 2, font: 16, overlap: 10 },
|
|
29
|
+
lg: { px: 56, border: 3, font: 22, overlap: 14 },
|
|
30
|
+
xl: { px: 96, border: 4, font: 36, overlap: 20 }
|
|
31
|
+
};
|
|
32
|
+
const resolveSize = (size) => {
|
|
33
|
+
if (typeof size === "number") {
|
|
34
|
+
return {
|
|
35
|
+
px: size,
|
|
36
|
+
border: Math.max(2, Math.round(size * 0.05)),
|
|
37
|
+
font: Math.round(size * 0.4),
|
|
38
|
+
overlap: Math.round(size * 0.25)
|
|
39
|
+
};
|
|
40
|
+
}
|
|
41
|
+
return sizeMap[size];
|
|
42
|
+
};
|
|
43
|
+
const mergeSx = (base, extra) => {
|
|
44
|
+
if (!extra) return base;
|
|
45
|
+
const baseArr = Array.isArray(base) ? base : [base];
|
|
46
|
+
const extraArr = Array.isArray(extra) ? extra : [extra];
|
|
47
|
+
return [...baseArr, ...extraArr];
|
|
48
|
+
};
|
|
49
|
+
const Avatar = ({
|
|
50
|
+
items,
|
|
51
|
+
type,
|
|
52
|
+
displayedAvatars = 4,
|
|
53
|
+
size = "sm",
|
|
54
|
+
showText = true,
|
|
55
|
+
showTooltip = false,
|
|
56
|
+
sx,
|
|
57
|
+
avatarSx,
|
|
58
|
+
className,
|
|
59
|
+
overlap
|
|
60
|
+
}) => {
|
|
61
|
+
var _a;
|
|
62
|
+
const [failedUrls, setFailedUrls] = React.useState(/* @__PURE__ */ new Set());
|
|
63
|
+
const handleImageError = (url) => {
|
|
64
|
+
setFailedUrls((prev) => {
|
|
65
|
+
if (prev.has(url)) return prev;
|
|
66
|
+
const next = new Set(prev);
|
|
67
|
+
next.add(url);
|
|
68
|
+
return next;
|
|
69
|
+
});
|
|
70
|
+
};
|
|
71
|
+
if (!items || items.length === 0) {
|
|
72
|
+
return null;
|
|
73
|
+
}
|
|
74
|
+
const s = resolveSize(size);
|
|
75
|
+
const effectiveOverlap = overlap != null ? overlap : s.overlap;
|
|
76
|
+
const visibleItems = items.slice(0, displayedAvatars);
|
|
77
|
+
const baseAvatarSx = {
|
|
78
|
+
width: s.px,
|
|
79
|
+
height: s.px,
|
|
80
|
+
fontSize: s.font,
|
|
81
|
+
fontWeight: 700,
|
|
82
|
+
border: (theme) => `${s.border}px solid ${theme.palette.background.paper}`,
|
|
83
|
+
boxSizing: "content-box"
|
|
84
|
+
};
|
|
85
|
+
const renderSingleAvatar = (item, i) => {
|
|
86
|
+
var _a2, _b, _c, _d, _e;
|
|
87
|
+
const hasImage = !!item.imageUrl && !failedUrls.has(item.imageUrl);
|
|
88
|
+
const showBadgeFallback = !!item.badge;
|
|
89
|
+
const itemKey = (_c = item.imageUrl) != null ? _c : `${(_a2 = item.text) != null ? _a2 : ""}-${(_b = item.badge) != null ? _b : ""}-${i}`;
|
|
90
|
+
const itemSx = __spreadProps(__spreadValues({
|
|
91
|
+
bgcolor: (_d = item.backgroundColor) != null ? _d : "action.selected",
|
|
92
|
+
color: (_e = item.color) != null ? _e : "text.secondary"
|
|
93
|
+
}, i > 0 && { marginLeft: `-${effectiveOverlap}px` }), {
|
|
94
|
+
zIndex: visibleItems.length - i
|
|
95
|
+
});
|
|
96
|
+
const finalSx = mergeSx(mergeSx(baseAvatarSx, itemSx), avatarSx);
|
|
97
|
+
const avatarEl = /* @__PURE__ */ jsxRuntime.jsx(
|
|
98
|
+
material.Avatar,
|
|
99
|
+
{
|
|
100
|
+
alt: item.text || "User avatar",
|
|
101
|
+
src: hasImage ? item.imageUrl : void 0,
|
|
102
|
+
imgProps: {
|
|
103
|
+
onError: () => {
|
|
104
|
+
if (item.imageUrl) handleImageError(item.imageUrl);
|
|
105
|
+
}
|
|
106
|
+
},
|
|
107
|
+
sx: finalSx,
|
|
108
|
+
children: !hasImage && showBadgeFallback ? /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-label": item.text, children: item.badge }) : !hasImage ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
109
|
+
AccountCircleIcon,
|
|
110
|
+
{
|
|
111
|
+
"aria-label": item.text,
|
|
112
|
+
sx: { width: "100%", height: "100%" }
|
|
113
|
+
}
|
|
114
|
+
) : null
|
|
115
|
+
}
|
|
116
|
+
);
|
|
117
|
+
if (showTooltip && item.text) {
|
|
118
|
+
return /* @__PURE__ */ jsxRuntime.jsx(material.Tooltip, { title: item.text, children: avatarEl }, itemKey);
|
|
119
|
+
}
|
|
120
|
+
return /* @__PURE__ */ jsxRuntime.jsx(React.Fragment, { children: avatarEl }, itemKey);
|
|
121
|
+
};
|
|
122
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
123
|
+
material.Box,
|
|
124
|
+
{
|
|
125
|
+
className,
|
|
126
|
+
sx: mergeSx(
|
|
127
|
+
{
|
|
128
|
+
display: "flex",
|
|
129
|
+
alignItems: "center",
|
|
130
|
+
lineHeight: 1,
|
|
131
|
+
width: "fit-content"
|
|
132
|
+
},
|
|
133
|
+
sx
|
|
134
|
+
),
|
|
135
|
+
children: [
|
|
136
|
+
/* @__PURE__ */ jsxRuntime.jsx(material.Box, { sx: { display: "flex", alignItems: "center" }, children: visibleItems.map((item, i) => renderSingleAvatar(item, i)) }),
|
|
137
|
+
showText && ((_a = items[0]) == null ? void 0 : _a.text) && /* @__PURE__ */ jsxRuntime.jsxs(
|
|
138
|
+
material.Typography,
|
|
139
|
+
{
|
|
140
|
+
variant: "caption",
|
|
141
|
+
sx: {
|
|
142
|
+
ml: 1,
|
|
143
|
+
fontSize: "0.75rem",
|
|
144
|
+
fontWeight: 400,
|
|
145
|
+
color: "text.primary"
|
|
146
|
+
},
|
|
147
|
+
children: [
|
|
148
|
+
type && items.length === 1 && /* @__PURE__ */ jsxRuntime.jsxs(material.Box, { component: "span", sx: { mr: 0.5 }, children: [
|
|
149
|
+
type,
|
|
150
|
+
":"
|
|
151
|
+
] }),
|
|
152
|
+
items[0].text,
|
|
153
|
+
items.length > 1 && ` +${items.length - 1}`
|
|
154
|
+
]
|
|
155
|
+
}
|
|
156
|
+
)
|
|
157
|
+
]
|
|
158
|
+
}
|
|
159
|
+
);
|
|
160
|
+
};
|
|
161
|
+
exports.Avatar = Avatar;
|
|
162
|
+
//# sourceMappingURL=Avatar.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Avatar.cjs","sources":["../../../src/components/Avatar/Avatar.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport {\n Avatar as MuiAvatar,\n Box,\n Tooltip,\n Typography,\n type SxProps,\n type Theme,\n} from '@mui/material';\nimport AccountCircleIcon from '@mui/icons-material/AccountCircle';\n\nexport interface AvatarItem {\n text?: string;\n imageUrl?: string;\n badge?: string;\n color?: string;\n backgroundColor?: string;\n}\n\nexport type AvatarSize = 'sm' | 'md' | 'lg' | 'xl' | number;\n\nexport interface AvatarProps {\n type?: string;\n items: AvatarItem[];\n displayedAvatars?: number;\n size?: AvatarSize;\n showText?: boolean;\n showTooltip?: boolean;\n /**\n * sx aplicado al contenedor raíz.\n */\n sx?: SxProps<Theme>;\n /**\n * sx aplicado a cada MuiAvatar individual (se mergea sobre los defaults).\n */\n avatarSx?: SxProps<Theme>;\n className?: string;\n /**\n * Overlap (px) entre avatares cuando hay varios. Default depende del tamaño.\n */\n overlap?: number;\n}\n\n// Escala alineada con la escala de MUI (sm=32, md=40, lg=56, xl=96) con borde\n// proporcional para el efecto stacked.\nconst sizeMap: Record<\n Exclude<AvatarSize, number>,\n { px: number; border: number; font: number; overlap: number }\n> = {\n sm: { px: 32, border: 2, font: 14, overlap: 8 },\n md: { px: 40, border: 2, font: 16, overlap: 10 },\n lg: { px: 56, border: 3, font: 22, overlap: 14 },\n xl: { px: 96, border: 4, font: 36, overlap: 20 },\n};\n\nconst resolveSize = (size: AvatarSize) => {\n if (typeof size === 'number') {\n return {\n px: size,\n border: Math.max(2, Math.round(size * 0.05)),\n font: Math.round(size * 0.4),\n overlap: Math.round(size * 0.25),\n };\n }\n return sizeMap[size];\n};\n\nconst mergeSx = (base: SxProps<Theme>, extra?: SxProps<Theme>): SxProps<Theme> => {\n if (!extra) return base;\n const baseArr = Array.isArray(base) ? base : [base];\n const extraArr = Array.isArray(extra) ? extra : [extra];\n return [...baseArr, ...extraArr] as SxProps<Theme>;\n};\n\nexport const Avatar: React.FC<AvatarProps> = ({\n items,\n type,\n displayedAvatars = 4,\n size = 'sm',\n showText = true,\n showTooltip = false,\n sx,\n avatarSx,\n className,\n overlap,\n}) => {\n // Indexamos por URL (no por posición) para que cambios en `items` — reorder,\n // filtrado, paginación — no hagan que un avatar válido \"herede\" el estado de\n // imagen rota de un item anterior que estaba en la misma posición.\n const [failedUrls, setFailedUrls] = useState<Set<string>>(new Set());\n\n const handleImageError = (url: string) => {\n setFailedUrls((prev) => {\n if (prev.has(url)) return prev;\n const next = new Set(prev);\n next.add(url);\n return next;\n });\n };\n\n if (!items || items.length === 0) {\n return null;\n }\n\n const s = resolveSize(size);\n const effectiveOverlap = overlap ?? s.overlap;\n const visibleItems = items.slice(0, displayedAvatars);\n\n const baseAvatarSx: SxProps<Theme> = {\n width: s.px,\n height: s.px,\n fontSize: s.font,\n fontWeight: 700,\n border: (theme) => `${s.border}px solid ${theme.palette.background.paper}`,\n boxSizing: 'content-box',\n };\n\n const renderSingleAvatar = (item: AvatarItem, i: number) => {\n const hasImage = !!item.imageUrl && !failedUrls.has(item.imageUrl);\n const showBadgeFallback = !!item.badge;\n const itemKey = item.imageUrl ?? `${item.text ?? ''}-${item.badge ?? ''}-${i}`;\n\n // Defaults tirando al theme; item.color / item.backgroundColor tienen prioridad.\n const itemSx: SxProps<Theme> = {\n bgcolor: item.backgroundColor ?? 'action.selected',\n color: item.color ?? 'text.secondary',\n // Stacking manual: margen negativo al segundo avatar en adelante.\n ...(i > 0 && { marginLeft: `-${effectiveOverlap}px` }),\n zIndex: visibleItems.length - i,\n };\n\n const finalSx = mergeSx(mergeSx(baseAvatarSx, itemSx), avatarSx);\n\n const avatarEl = (\n <MuiAvatar\n alt={item.text || 'User avatar'}\n src={hasImage ? item.imageUrl : undefined}\n imgProps={{\n onError: () => {\n if (item.imageUrl) handleImageError(item.imageUrl);\n },\n }}\n sx={finalSx}\n >\n {!hasImage && showBadgeFallback ? (\n <span aria-label={item.text}>{item.badge}</span>\n ) : !hasImage ? (\n <AccountCircleIcon\n aria-label={item.text}\n sx={{ width: '100%', height: '100%' }}\n />\n ) : null}\n </MuiAvatar>\n );\n\n if (showTooltip && item.text) {\n return (\n <Tooltip key={itemKey} title={item.text}>\n {avatarEl}\n </Tooltip>\n );\n }\n return <React.Fragment key={itemKey}>{avatarEl}</React.Fragment>;\n };\n\n return (\n <Box\n className={className}\n sx={mergeSx(\n {\n display: 'flex',\n alignItems: 'center',\n lineHeight: 1,\n width: 'fit-content',\n },\n sx,\n )}\n >\n <Box sx={{ display: 'flex', alignItems: 'center' }}>\n {visibleItems.map((item, i) => renderSingleAvatar(item, i))}\n </Box>\n\n {showText && items[0]?.text && (\n <Typography\n variant=\"caption\"\n sx={{\n ml: 1,\n fontSize: '0.75rem',\n fontWeight: 400,\n color: 'text.primary',\n }}\n >\n {type && items.length === 1 && (\n <Box component=\"span\" sx={{ mr: 0.5 }}>\n {type}:\n </Box>\n )}\n {items[0].text}\n {items.length > 1 && ` +${items.length - 1}`}\n </Typography>\n )}\n </Box>\n );\n};\n\nexport default Avatar;\n"],"names":["useState","_a","jsx","MuiAvatar","Tooltip","jsxs","Box","Typography"],"mappings":"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"}
|