@soyfri/shared-library 2.0.0-beta.3 → 2.0.0-beta.30
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/Autocomplete-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/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 +94 -2
- package/index.cjs.map +1 -1
- package/index.d.ts +34 -0
- package/index.js +68 -3
- 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 +73 -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
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Icon.cjs","sources":["../../../src/components/Icon/Icon.tsx"],"sourcesContent":["import React, { type ReactNode, useMemo } from 'react';\nimport { Badge, styled } from '@mui/material';\n\nexport type IconSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n\nexport interface IconProps {\n /**\n * Contenido icono. Modo legacy: acepta un elemento MUI o SVG ya armado.\n * Si se usa junto con `path` o `url`, `children` tiene prioridad.\n */\n children?: ReactNode;\n /**\n * Ruta SVG inline
|
|
1
|
+
{"version":3,"file":"Icon.cjs","sources":["../../../src/components/Icon/Icon.tsx"],"sourcesContent":["import React, { type ReactNode, useMemo } from 'react';\nimport { Badge, styled } from '@mui/material';\nimport type { SxProps, Theme } from '@mui/material/styles';\n\nexport type IconSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n\nexport interface IconProps {\n /**\n * Contenido del icono. Modo legacy: acepta un elemento MUI o SVG ya armado.\n * Si se usa junto con `path` o `url`, `children` tiene prioridad.\n */\n children?: ReactNode;\n /**\n * Ruta SVG inline. Acepta dos formatos:\n * - Solo el valor del atributo `d` de un `<path>` (ej. `\"M12 2L2 22...\"`).\n * - Un SVG completo (ej. `\"<svg>...</svg>\"`).\n *\n * ⚠️ Seguridad: cuando el string empieza con `<svg`, se inyecta vía\n * `dangerouslySetInnerHTML`. **NUNCA pasar contenido proveniente de input\n * de usuario o de backends no confiables** — riesgo XSS.\n */\n path?: string;\n /**\n * URL a un archivo `.svg` (asset local o remoto). Se renderiza vía `<img>`.\n * El color del icono NO aplica en este modo (limitación de `<img>`).\n */\n url?: string;\n /** Alt text cuando se usa `url`. Default: `\"icon\"`. */\n alt?: string;\n /**\n * ViewBox cuando se usa `path`. Default: `\"0 0 24 24\"`. Ignorado si `path`\n * ya viene como `<svg>` completo.\n */\n viewBox?: string;\n color?: string;\n outlined?: boolean;\n spin?: boolean;\n badge?: string | number;\n badgeColor?: 'primary' | 'secondary' | 'error';\n badgePosition?: {\n vertical: 'top' | 'bottom';\n horizontal: 'right' | 'left';\n };\n size?: IconSize;\n black?: boolean;\n white?: boolean;\n className?: string;\n sx?: SxProps<Theme>;\n}\n\nconst sizeMap: Record<IconSize, number> = {\n xs: 18,\n sm: 24,\n md: 36,\n lg: 48,\n xl: 64,\n};\n\nconst StyledIcon = styled('span')<{\n color?: string;\n fontSize?: number;\n spin?: boolean;\n outlined?: boolean;\n}>(({ color, fontSize, spin, outlined }) => ({\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center',\n color: color,\n fontSize: fontSize,\n width: fontSize,\n height: fontSize,\n animation: spin ? 'spin 1s linear infinite' : undefined,\n border: outlined ? '1px solid currentColor' : undefined,\n borderRadius: '50%',\n padding: outlined ? 4 : 0,\n '@keyframes spin': {\n '0%': { transform: 'rotate(0deg)' },\n '100%': { transform: 'rotate(360deg)' },\n },\n '& svg': {\n width: '100%',\n height: '100%',\n fill: 'currentColor',\n display: 'block',\n },\n '& img': {\n width: '100%',\n height: '100%',\n display: 'block',\n },\n}));\n\nexport const Icon: React.FC<IconProps> = ({\n children,\n path,\n url,\n alt = 'icon',\n viewBox = '0 0 24 24',\n color = 'var(--primary-color)',\n outlined = false,\n spin = false,\n badge,\n badgeColor = 'primary',\n badgePosition = { vertical: 'bottom', horizontal: 'right' },\n size = 'sm',\n black,\n white,\n className,\n sx,\n}) => {\n const finalColor = white ? 'white' : black ? 'black' : color;\n const iconSize = sizeMap[size];\n\n const content = useMemo(() => {\n if (children) return children;\n\n if (path) {\n const trimmed = path.trim();\n if (trimmed.startsWith('<svg')) {\n return <span dangerouslySetInnerHTML={{ __html: trimmed }} />;\n }\n return (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox={viewBox}\n fill=\"currentColor\"\n aria-hidden=\"true\"\n >\n <path d={trimmed} />\n </svg>\n );\n }\n\n if (url) {\n return <img src={url} alt={alt} />;\n }\n\n return null;\n }, [children, path, url, alt, viewBox]);\n\n return (\n <Badge\n badgeContent={badge}\n color={badgeColor}\n anchorOrigin={badgePosition}\n invisible={badge === undefined}\n sx={{ '.MuiBadge-badge': { transform: 'scale(1)' } }}\n >\n <StyledIcon\n color={finalColor}\n fontSize={iconSize}\n spin={spin}\n outlined={outlined}\n className={`hsi-icon ${className || ''}`}\n sx={sx}\n >\n {content}\n </StyledIcon>\n </Badge>\n );\n};\n\nexport default Icon;\n"],"names":["styled","useMemo","jsx","Badge"],"mappings":";;;;;AAkDA,MAAM,UAAoC;AAAA,EACxC,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAEA,MAAM,aAAaA,SAAAA,OAAO,MAAM,EAK7B,CAAC,EAAE,OAAO,UAAU,MAAM,gBAAgB;AAAA,EAC3C,SAAS;AAAA,EACT,YAAY;AAAA,EACZ,gBAAgB;AAAA,EAChB;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,WAAW,OAAO,4BAA4B;AAAA,EAC9C,QAAQ,WAAW,2BAA2B;AAAA,EAC9C,cAAc;AAAA,EACd,SAAS,WAAW,IAAI;AAAA,EACxB,mBAAmB;AAAA,IACjB,MAAM,EAAE,WAAW,eAAA;AAAA,IACnB,QAAQ,EAAE,WAAW,iBAAA;AAAA,EAAiB;AAAA,EAExC,SAAS;AAAA,IACP,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,MAAM;AAAA,IACN,SAAS;AAAA,EAAA;AAAA,EAEX,SAAS;AAAA,IACP,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,SAAS;AAAA,EAAA;AAEb,EAAE;AAEK,MAAM,OAA4B,CAAC;AAAA,EACxC;AAAA,EACA;AAAA,EACA;AAAA,EACA,MAAM;AAAA,EACN,UAAU;AAAA,EACV,QAAQ;AAAA,EACR,WAAW;AAAA,EACX,OAAO;AAAA,EACP;AAAA,EACA,aAAa;AAAA,EACb,gBAAgB,EAAE,UAAU,UAAU,YAAY,QAAA;AAAA,EAClD,OAAO;AAAA,EACP;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,aAAa,QAAQ,UAAU,QAAQ,UAAU;AACvD,QAAM,WAAW,QAAQ,IAAI;AAE7B,QAAM,UAAUC,MAAAA,QAAQ,MAAM;AAC5B,QAAI,SAAU,QAAO;AAErB,QAAI,MAAM;AACR,YAAM,UAAU,KAAK,KAAA;AACrB,UAAI,QAAQ,WAAW,MAAM,GAAG;AAC9B,8CAAQ,QAAA,EAAK,yBAAyB,EAAE,QAAQ,WAAW;AAAA,MAC7D;AACA,aACEC,2BAAAA;AAAAA,QAAC;AAAA,QAAA;AAAA,UACC,OAAM;AAAA,UACN;AAAA,UACA,MAAK;AAAA,UACL,eAAY;AAAA,UAEZ,UAAAA,2BAAAA,IAAC,QAAA,EAAK,GAAG,QAAA,CAAS;AAAA,QAAA;AAAA,MAAA;AAAA,IAGxB;AAEA,QAAI,KAAK;AACP,aAAOA,2BAAAA,IAAC,OAAA,EAAI,KAAK,KAAK,IAAA,CAAU;AAAA,IAClC;AAEA,WAAO;AAAA,EACT,GAAG,CAAC,UAAU,MAAM,KAAK,KAAK,OAAO,CAAC;AAEtC,SACEA,2BAAAA;AAAAA,IAACC,SAAAA;AAAAA,IAAA;AAAA,MACC,cAAc;AAAA,MACd,OAAO;AAAA,MACP,cAAc;AAAA,MACd,WAAW,UAAU;AAAA,MACrB,IAAI,EAAE,mBAAmB,EAAE,WAAW,aAAW;AAAA,MAEjD,UAAAD,2BAAAA;AAAAA,QAAC;AAAA,QAAA;AAAA,UACC,OAAO;AAAA,UACP,UAAU;AAAA,UACV;AAAA,UACA;AAAA,UACA,WAAW,YAAY,aAAa,EAAE;AAAA,UACtC;AAAA,UAEC,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IACH;AAAA,EAAA;AAGN;;;"}
|
|
@@ -1,34 +1,28 @@
|
|
|
1
1
|
import { default as React, ReactNode } from 'react';
|
|
2
|
+
import { SxProps, Theme } from '@mui/material/styles';
|
|
2
3
|
export type IconSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
|
|
3
4
|
export interface IconProps {
|
|
4
5
|
/**
|
|
5
|
-
* Contenido icono. Modo legacy: acepta un elemento MUI o SVG ya armado.
|
|
6
|
+
* Contenido del icono. Modo legacy: acepta un elemento MUI o SVG ya armado.
|
|
6
7
|
* Si se usa junto con `path` o `url`, `children` tiene prioridad.
|
|
7
8
|
*/
|
|
8
9
|
children?: ReactNode;
|
|
9
10
|
/**
|
|
10
|
-
* Ruta SVG inline
|
|
11
|
-
*
|
|
11
|
+
* Ruta SVG inline. Acepta dos formatos:
|
|
12
|
+
* - Solo el valor del atributo `d` de un `<path>` (ej. `"M12 2L2 22..."`).
|
|
13
|
+
* - Un SVG completo (ej. `"<svg>...</svg>"`).
|
|
12
14
|
*
|
|
13
|
-
*
|
|
14
|
-
*
|
|
15
|
-
*
|
|
16
|
-
*
|
|
17
|
-
* Si el string contiene el tag `<svg>` completo (no solo el `d`), también
|
|
18
|
-
* se soporta y se inyecta tal cual via `dangerouslySetInnerHTML`.
|
|
15
|
+
* ⚠️ Seguridad: cuando el string empieza con `<svg`, se inyecta vía
|
|
16
|
+
* `dangerouslySetInnerHTML`. **NUNCA pasar contenido proveniente de input
|
|
17
|
+
* de usuario o de backends no confiables** — riesgo XSS.
|
|
19
18
|
*/
|
|
20
19
|
path?: string;
|
|
21
20
|
/**
|
|
22
21
|
* URL a un archivo `.svg` (asset local o remoto). Se renderiza vía `<img>`.
|
|
23
|
-
*
|
|
24
|
-
* ```tsx
|
|
25
|
-
* <Icon url="/assets/icons/custom-warning.svg" />
|
|
26
|
-
* ```
|
|
22
|
+
* El color del icono NO aplica en este modo (limitación de `<img>`).
|
|
27
23
|
*/
|
|
28
24
|
url?: string;
|
|
29
|
-
/**
|
|
30
|
-
* Alt text cuando se usa `url`. Default: `"icon"`.
|
|
31
|
-
*/
|
|
25
|
+
/** Alt text cuando se usa `url`. Default: `"icon"`. */
|
|
32
26
|
alt?: string;
|
|
33
27
|
/**
|
|
34
28
|
* ViewBox cuando se usa `path`. Default: `"0 0 24 24"`. Ignorado si `path`
|
|
@@ -44,11 +38,11 @@ export interface IconProps {
|
|
|
44
38
|
vertical: 'top' | 'bottom';
|
|
45
39
|
horizontal: 'right' | 'left';
|
|
46
40
|
};
|
|
47
|
-
badgeSize?: 'small' | 'medium' | 'large';
|
|
48
41
|
size?: IconSize;
|
|
49
42
|
black?: boolean;
|
|
50
43
|
white?: boolean;
|
|
51
44
|
className?: string;
|
|
45
|
+
sx?: SxProps<Theme>;
|
|
52
46
|
}
|
|
53
47
|
export declare const Icon: React.FC<IconProps>;
|
|
54
48
|
export default Icon;
|
package/components/Icon/Icon.js
CHANGED
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import '../../styles.css';/* empty css */
|
|
2
1
|
import { jsx } from "react/jsx-runtime";
|
|
3
2
|
import { useMemo } from "react";
|
|
4
3
|
import { styled, Badge } from "@mui/material";
|
|
@@ -52,13 +51,10 @@ const Icon = ({
|
|
|
52
51
|
size = "sm",
|
|
53
52
|
black,
|
|
54
53
|
white,
|
|
55
|
-
className
|
|
54
|
+
className,
|
|
55
|
+
sx
|
|
56
56
|
}) => {
|
|
57
|
-
const finalColor =
|
|
58
|
-
if (white) return "white";
|
|
59
|
-
if (black) return "black";
|
|
60
|
-
return color;
|
|
61
|
-
}, [color, white, black]);
|
|
57
|
+
const finalColor = white ? "white" : black ? "black" : color;
|
|
62
58
|
const iconSize = sizeMap[size];
|
|
63
59
|
const content = useMemo(() => {
|
|
64
60
|
if (children) return children;
|
|
@@ -99,6 +95,7 @@ const Icon = ({
|
|
|
99
95
|
spin,
|
|
100
96
|
outlined,
|
|
101
97
|
className: `hsi-icon ${className || ""}`,
|
|
98
|
+
sx,
|
|
102
99
|
children: content
|
|
103
100
|
}
|
|
104
101
|
)
|
|
@@ -106,6 +103,7 @@ const Icon = ({
|
|
|
106
103
|
);
|
|
107
104
|
};
|
|
108
105
|
export {
|
|
109
|
-
Icon
|
|
106
|
+
Icon,
|
|
107
|
+
Icon as default
|
|
110
108
|
};
|
|
111
109
|
//# sourceMappingURL=Icon.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Icon.js","sources":["../../../src/components/Icon/Icon.tsx"],"sourcesContent":["import React, { type ReactNode, useMemo } from 'react';\nimport { Badge, styled } from '@mui/material';\n\nexport type IconSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n\nexport interface IconProps {\n /**\n * Contenido icono. Modo legacy: acepta un elemento MUI o SVG ya armado.\n * Si se usa junto con `path` o `url`, `children` tiene prioridad.\n */\n children?: ReactNode;\n /**\n * Ruta SVG inline
|
|
1
|
+
{"version":3,"file":"Icon.js","sources":["../../../src/components/Icon/Icon.tsx"],"sourcesContent":["import React, { type ReactNode, useMemo } from 'react';\nimport { Badge, styled } from '@mui/material';\nimport type { SxProps, Theme } from '@mui/material/styles';\n\nexport type IconSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n\nexport interface IconProps {\n /**\n * Contenido del icono. Modo legacy: acepta un elemento MUI o SVG ya armado.\n * Si se usa junto con `path` o `url`, `children` tiene prioridad.\n */\n children?: ReactNode;\n /**\n * Ruta SVG inline. Acepta dos formatos:\n * - Solo el valor del atributo `d` de un `<path>` (ej. `\"M12 2L2 22...\"`).\n * - Un SVG completo (ej. `\"<svg>...</svg>\"`).\n *\n * ⚠️ Seguridad: cuando el string empieza con `<svg`, se inyecta vía\n * `dangerouslySetInnerHTML`. **NUNCA pasar contenido proveniente de input\n * de usuario o de backends no confiables** — riesgo XSS.\n */\n path?: string;\n /**\n * URL a un archivo `.svg` (asset local o remoto). Se renderiza vía `<img>`.\n * El color del icono NO aplica en este modo (limitación de `<img>`).\n */\n url?: string;\n /** Alt text cuando se usa `url`. Default: `\"icon\"`. */\n alt?: string;\n /**\n * ViewBox cuando se usa `path`. Default: `\"0 0 24 24\"`. Ignorado si `path`\n * ya viene como `<svg>` completo.\n */\n viewBox?: string;\n color?: string;\n outlined?: boolean;\n spin?: boolean;\n badge?: string | number;\n badgeColor?: 'primary' | 'secondary' | 'error';\n badgePosition?: {\n vertical: 'top' | 'bottom';\n horizontal: 'right' | 'left';\n };\n size?: IconSize;\n black?: boolean;\n white?: boolean;\n className?: string;\n sx?: SxProps<Theme>;\n}\n\nconst sizeMap: Record<IconSize, number> = {\n xs: 18,\n sm: 24,\n md: 36,\n lg: 48,\n xl: 64,\n};\n\nconst StyledIcon = styled('span')<{\n color?: string;\n fontSize?: number;\n spin?: boolean;\n outlined?: boolean;\n}>(({ color, fontSize, spin, outlined }) => ({\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center',\n color: color,\n fontSize: fontSize,\n width: fontSize,\n height: fontSize,\n animation: spin ? 'spin 1s linear infinite' : undefined,\n border: outlined ? '1px solid currentColor' : undefined,\n borderRadius: '50%',\n padding: outlined ? 4 : 0,\n '@keyframes spin': {\n '0%': { transform: 'rotate(0deg)' },\n '100%': { transform: 'rotate(360deg)' },\n },\n '& svg': {\n width: '100%',\n height: '100%',\n fill: 'currentColor',\n display: 'block',\n },\n '& img': {\n width: '100%',\n height: '100%',\n display: 'block',\n },\n}));\n\nexport const Icon: React.FC<IconProps> = ({\n children,\n path,\n url,\n alt = 'icon',\n viewBox = '0 0 24 24',\n color = 'var(--primary-color)',\n outlined = false,\n spin = false,\n badge,\n badgeColor = 'primary',\n badgePosition = { vertical: 'bottom', horizontal: 'right' },\n size = 'sm',\n black,\n white,\n className,\n sx,\n}) => {\n const finalColor = white ? 'white' : black ? 'black' : color;\n const iconSize = sizeMap[size];\n\n const content = useMemo(() => {\n if (children) return children;\n\n if (path) {\n const trimmed = path.trim();\n if (trimmed.startsWith('<svg')) {\n return <span dangerouslySetInnerHTML={{ __html: trimmed }} />;\n }\n return (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox={viewBox}\n fill=\"currentColor\"\n aria-hidden=\"true\"\n >\n <path d={trimmed} />\n </svg>\n );\n }\n\n if (url) {\n return <img src={url} alt={alt} />;\n }\n\n return null;\n }, [children, path, url, alt, viewBox]);\n\n return (\n <Badge\n badgeContent={badge}\n color={badgeColor}\n anchorOrigin={badgePosition}\n invisible={badge === undefined}\n sx={{ '.MuiBadge-badge': { transform: 'scale(1)' } }}\n >\n <StyledIcon\n color={finalColor}\n fontSize={iconSize}\n spin={spin}\n outlined={outlined}\n className={`hsi-icon ${className || ''}`}\n sx={sx}\n >\n {content}\n </StyledIcon>\n </Badge>\n );\n};\n\nexport default Icon;\n"],"names":[],"mappings":";;;AAkDA,MAAM,UAAoC;AAAA,EACxC,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAEA,MAAM,aAAa,OAAO,MAAM,EAK7B,CAAC,EAAE,OAAO,UAAU,MAAM,gBAAgB;AAAA,EAC3C,SAAS;AAAA,EACT,YAAY;AAAA,EACZ,gBAAgB;AAAA,EAChB;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,WAAW,OAAO,4BAA4B;AAAA,EAC9C,QAAQ,WAAW,2BAA2B;AAAA,EAC9C,cAAc;AAAA,EACd,SAAS,WAAW,IAAI;AAAA,EACxB,mBAAmB;AAAA,IACjB,MAAM,EAAE,WAAW,eAAA;AAAA,IACnB,QAAQ,EAAE,WAAW,iBAAA;AAAA,EAAiB;AAAA,EAExC,SAAS;AAAA,IACP,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,MAAM;AAAA,IACN,SAAS;AAAA,EAAA;AAAA,EAEX,SAAS;AAAA,IACP,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,SAAS;AAAA,EAAA;AAEb,EAAE;AAEK,MAAM,OAA4B,CAAC;AAAA,EACxC;AAAA,EACA;AAAA,EACA;AAAA,EACA,MAAM;AAAA,EACN,UAAU;AAAA,EACV,QAAQ;AAAA,EACR,WAAW;AAAA,EACX,OAAO;AAAA,EACP;AAAA,EACA,aAAa;AAAA,EACb,gBAAgB,EAAE,UAAU,UAAU,YAAY,QAAA;AAAA,EAClD,OAAO;AAAA,EACP;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,aAAa,QAAQ,UAAU,QAAQ,UAAU;AACvD,QAAM,WAAW,QAAQ,IAAI;AAE7B,QAAM,UAAU,QAAQ,MAAM;AAC5B,QAAI,SAAU,QAAO;AAErB,QAAI,MAAM;AACR,YAAM,UAAU,KAAK,KAAA;AACrB,UAAI,QAAQ,WAAW,MAAM,GAAG;AAC9B,mCAAQ,QAAA,EAAK,yBAAyB,EAAE,QAAQ,WAAW;AAAA,MAC7D;AACA,aACE;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,OAAM;AAAA,UACN;AAAA,UACA,MAAK;AAAA,UACL,eAAY;AAAA,UAEZ,UAAA,oBAAC,QAAA,EAAK,GAAG,QAAA,CAAS;AAAA,QAAA;AAAA,MAAA;AAAA,IAGxB;AAEA,QAAI,KAAK;AACP,aAAO,oBAAC,OAAA,EAAI,KAAK,KAAK,IAAA,CAAU;AAAA,IAClC;AAEA,WAAO;AAAA,EACT,GAAG,CAAC,UAAU,MAAM,KAAK,KAAK,OAAO,CAAC;AAEtC,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,cAAc;AAAA,MACd,OAAO;AAAA,MACP,cAAc;AAAA,MACd,WAAW,UAAU;AAAA,MACrB,IAAI,EAAE,mBAAmB,EAAE,WAAW,aAAW;AAAA,MAEjD,UAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,OAAO;AAAA,UACP,UAAU;AAAA,UACV;AAAA,UACA;AAAA,UACA,WAAW,YAAY,aAAa,EAAE;AAAA,UACtC;AAAA,UAEC,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IACH;AAAA,EAAA;AAGN;"}
|
|
@@ -1 +1,2 @@
|
|
|
1
|
-
export { default
|
|
1
|
+
export { Icon, default } from './Icon';
|
|
2
|
+
export type { IconProps, IconSize } from './Icon';
|
package/components/Icon.d.ts
CHANGED
|
@@ -1,175 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __defProp = Object.defineProperty;
|
|
3
|
-
var __defProps = Object.defineProperties;
|
|
4
|
-
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
5
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
6
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
8
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
9
|
-
var __spreadValues = (a, b) => {
|
|
10
|
-
for (var prop in b || (b = {}))
|
|
11
|
-
if (__hasOwnProp.call(b, prop))
|
|
12
|
-
__defNormalProp(a, prop, b[prop]);
|
|
13
|
-
if (__getOwnPropSymbols)
|
|
14
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
15
|
-
if (__propIsEnum.call(b, prop))
|
|
16
|
-
__defNormalProp(a, prop, b[prop]);
|
|
17
|
-
}
|
|
18
|
-
return a;
|
|
19
|
-
};
|
|
20
|
-
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
21
|
-
var __objRest = (source, exclude) => {
|
|
22
|
-
var target = {};
|
|
23
|
-
for (var prop in source)
|
|
24
|
-
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
25
|
-
target[prop] = source[prop];
|
|
26
|
-
if (source != null && __getOwnPropSymbols)
|
|
27
|
-
for (var prop of __getOwnPropSymbols(source)) {
|
|
28
|
-
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
29
|
-
target[prop] = source[prop];
|
|
30
|
-
}
|
|
31
|
-
return target;
|
|
32
|
-
};
|
|
33
2
|
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
|
|
34
|
-
const
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
const reactHookForm = require("react-hook-form");
|
|
38
|
-
const formField_sx = require("../../formField.sx-CQ1mbk9M.cjs");
|
|
39
|
-
const resolvePreset = require("../../resolvePreset-CT3kU-K2.cjs");
|
|
40
|
-
const parseValue = (raw, type) => {
|
|
41
|
-
if (type !== "number") return raw;
|
|
42
|
-
if (raw === "" || raw === "-") return raw;
|
|
43
|
-
const n = parseFloat(raw);
|
|
44
|
-
return isNaN(n) ? raw : n;
|
|
45
|
-
};
|
|
46
|
-
const buildSlotProps = (type, min, max, customSlotProps, customInputProps, _labelPosition, readOnly) => {
|
|
47
|
-
const numberAttrs = type === "number" ? __spreadValues({ min: min != null ? min : Number.NEGATIVE_INFINITY }, max !== void 0 && { max }) : {};
|
|
48
|
-
return __spreadProps(__spreadValues({}, customSlotProps), {
|
|
49
|
-
htmlInput: __spreadValues(__spreadValues(__spreadValues(__spreadValues({}, customInputProps), customSlotProps == null ? void 0 : customSlotProps.htmlInput), numberAttrs), readOnly && { readOnly: true }),
|
|
50
|
-
// Dejamos que MUI maneje el shrink nativamente (animación inside → up).
|
|
51
|
-
// El consumidor puede forzar shrink con slotProps.inputLabel.shrink=true si lo necesita.
|
|
52
|
-
inputLabel: __spreadValues({}, customSlotProps == null ? void 0 : customSlotProps.inputLabel)
|
|
53
|
-
});
|
|
54
|
-
};
|
|
55
|
-
const buildInputSx = (borderRadius, labelPosition) => {
|
|
56
|
-
const radius = typeof borderRadius === "number" ? `${borderRadius}px` : borderRadius;
|
|
57
|
-
return formField_sx.buildFormFieldSx({
|
|
58
|
-
borderRadius,
|
|
59
|
-
labelPosition,
|
|
60
|
-
extraOutsideSx: {
|
|
61
|
-
"& .MuiInputBase-input": {
|
|
62
|
-
paddingTop: formField_sx.FIELD_INPUT_PADDING_Y,
|
|
63
|
-
paddingBottom: formField_sx.FIELD_INPUT_PADDING_Y
|
|
64
|
-
},
|
|
65
|
-
// Filled: quitar el padding-top reservado para el label flotante dentro.
|
|
66
|
-
"& .MuiFilledInput-root": {
|
|
67
|
-
paddingTop: 0,
|
|
68
|
-
borderRadius: `${radius} ${radius} 0 0`
|
|
69
|
-
},
|
|
70
|
-
"& .MuiFilledInput-input": {
|
|
71
|
-
paddingTop: formField_sx.FIELD_INPUT_PADDING_Y
|
|
72
|
-
},
|
|
73
|
-
// Standard: quitar el margin-top reservado para el label flotante.
|
|
74
|
-
"& .MuiInput-root": {
|
|
75
|
-
marginTop: 0
|
|
76
|
-
}
|
|
77
|
-
}
|
|
78
|
-
});
|
|
79
|
-
};
|
|
80
|
-
const Input = (props) => {
|
|
81
|
-
const _a = props, {
|
|
82
|
-
type = "text",
|
|
83
|
-
variant = "outlined",
|
|
84
|
-
size = "small",
|
|
85
|
-
borderRadius = 10,
|
|
86
|
-
labelPosition = "outside",
|
|
87
|
-
preset,
|
|
88
|
-
min,
|
|
89
|
-
max,
|
|
90
|
-
readOnly,
|
|
91
|
-
inputProps,
|
|
92
|
-
slotProps,
|
|
93
|
-
sx
|
|
94
|
-
} = _a, rest = __objRest(_a, [
|
|
95
|
-
"type",
|
|
96
|
-
"variant",
|
|
97
|
-
"size",
|
|
98
|
-
"borderRadius",
|
|
99
|
-
"labelPosition",
|
|
100
|
-
"preset",
|
|
101
|
-
"min",
|
|
102
|
-
"max",
|
|
103
|
-
"readOnly",
|
|
104
|
-
"inputProps",
|
|
105
|
-
"slotProps",
|
|
106
|
-
"sx"
|
|
107
|
-
]);
|
|
108
|
-
const theme = styles.useTheme();
|
|
109
|
-
const presetSx = resolvePreset.resolvePreset("Input", preset, theme);
|
|
110
|
-
const finalSlotProps = buildSlotProps(
|
|
111
|
-
type,
|
|
112
|
-
min,
|
|
113
|
-
max,
|
|
114
|
-
slotProps,
|
|
115
|
-
inputProps,
|
|
116
|
-
labelPosition,
|
|
117
|
-
readOnly
|
|
118
|
-
);
|
|
119
|
-
const mergedSx = [
|
|
120
|
-
buildInputSx(borderRadius, labelPosition),
|
|
121
|
-
...presetSx ? [presetSx] : [],
|
|
122
|
-
...Array.isArray(sx) ? sx : [sx]
|
|
123
|
-
];
|
|
124
|
-
if ("control" in props && props.control) {
|
|
125
|
-
const { name, control, validation } = props;
|
|
126
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
127
|
-
reactHookForm.Controller,
|
|
128
|
-
{
|
|
129
|
-
name,
|
|
130
|
-
control,
|
|
131
|
-
rules: validation,
|
|
132
|
-
render: ({ field, fieldState: { error } }) => {
|
|
133
|
-
var _a2, _b;
|
|
134
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
135
|
-
material.TextField,
|
|
136
|
-
__spreadProps(__spreadValues({
|
|
137
|
-
fullWidth: true
|
|
138
|
-
}, rest), {
|
|
139
|
-
name: field.name,
|
|
140
|
-
value: (_a2 = field.value) != null ? _a2 : "",
|
|
141
|
-
onChange: (e) => field.onChange(parseValue(e.target.value, type)),
|
|
142
|
-
onBlur: field.onBlur,
|
|
143
|
-
inputRef: field.ref,
|
|
144
|
-
type,
|
|
145
|
-
variant,
|
|
146
|
-
size,
|
|
147
|
-
slotProps: finalSlotProps,
|
|
148
|
-
sx: mergedSx,
|
|
149
|
-
error: !!error || rest.error,
|
|
150
|
-
helperText: (_b = error == null ? void 0 : error.message) != null ? _b : rest.helperText
|
|
151
|
-
})
|
|
152
|
-
);
|
|
153
|
-
}
|
|
154
|
-
}
|
|
155
|
-
);
|
|
156
|
-
}
|
|
157
|
-
const { value, onChange } = props;
|
|
158
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
159
|
-
material.TextField,
|
|
160
|
-
__spreadProps(__spreadValues({
|
|
161
|
-
fullWidth: true
|
|
162
|
-
}, rest), {
|
|
163
|
-
value: value != null ? value : "",
|
|
164
|
-
onChange: (e) => onChange(parseValue(e.target.value, type)),
|
|
165
|
-
type,
|
|
166
|
-
variant,
|
|
167
|
-
size,
|
|
168
|
-
slotProps: finalSlotProps,
|
|
169
|
-
sx: mergedSx
|
|
170
|
-
})
|
|
171
|
-
);
|
|
172
|
-
};
|
|
173
|
-
exports.Input = Input;
|
|
174
|
-
exports.default = Input;
|
|
3
|
+
const Input = require("../../Input-CScC87J5.cjs");
|
|
4
|
+
exports.Input = Input.Input;
|
|
5
|
+
exports.default = Input.Input;
|
|
175
6
|
//# sourceMappingURL=Input.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.cjs","sources":[
|
|
1
|
+
{"version":3,"file":"Input.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;"}
|
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
import { TextFieldProps } from '@mui/material';
|
|
2
|
-
import {
|
|
2
|
+
import { RegisterOptions } from 'react-hook-form';
|
|
3
3
|
export type InputType = 'text' | 'number' | 'email' | 'password' | 'tel' | 'url' | 'search' | 'date' | 'datetime-local' | 'month' | 'week' | 'time' | 'color';
|
|
4
4
|
export type LabelPosition = 'outside' | 'floating';
|
|
5
5
|
export interface BaseInputProps extends Omit<TextFieldProps, 'value' | 'onChange' | 'type'> {
|
|
6
6
|
type?: InputType;
|
|
7
7
|
min?: number;
|
|
8
8
|
max?: number;
|
|
9
|
+
maxLength?: number;
|
|
9
10
|
/** Border radius del input. Default: 10 */
|
|
10
11
|
borderRadius?: number | string;
|
|
11
12
|
/** "outside" = label arriba del campo (default). "floating" = label clásico MUI dentro del borde */
|
|
@@ -20,8 +21,14 @@ export interface BaseInputProps extends Omit<TextFieldProps, 'value' | 'onChange
|
|
|
20
21
|
}
|
|
21
22
|
export interface RHFInputProps extends BaseInputProps {
|
|
22
23
|
name: string;
|
|
23
|
-
control:
|
|
24
|
+
control: any;
|
|
24
25
|
validation?: RegisterOptions;
|
|
26
|
+
/**
|
|
27
|
+
* Side-effect que corre después de que RHF actualiza el form state.
|
|
28
|
+
* Útil para cascadas entre campos (ej. reset de municipio al cambiar
|
|
29
|
+
* departamento). NO reemplaza al handler de RHF.
|
|
30
|
+
*/
|
|
31
|
+
onValueChange?: (value: string | number) => void;
|
|
25
32
|
value?: never;
|
|
26
33
|
onChange?: never;
|
|
27
34
|
}
|
|
@@ -12,3 +12,4 @@ export declare const FullWidthInputDefinition = "\nimport React, { useState } fr
|
|
|
12
12
|
export declare const LabelPositionFloatingDefinition = "\nimport React, { useState } from 'react';\nimport { Input } from './Input'; // Ajusta la ruta si es necesario\nimport { Box } from '@mui/material';\n\nexport const LabelPositionExample = () => {\n const [outside, setOutside] = useState('Outside (default)');\n const [floating, setFloating] = useState('Floating');\n return (\n <Box sx={{ display: 'flex', flexDirection: 'column', gap: 3, width: 300 }}>\n <Input\n label=\"Label outside\"\n value={outside}\n onChange={setOutside}\n labelPosition=\"outside\"\n />\n <Input\n label=\"Label floating (MUI cl\u00E1sico)\"\n value={floating}\n onChange={setFloating}\n labelPosition=\"floating\"\n />\n </Box>\n );\n};\n";
|
|
13
13
|
export declare const CustomBorderRadiusDefinition = "\nimport React, { useState } from 'react';\nimport { Input } from './Input'; // Ajusta la ruta si es necesario\nimport { Box } from '@mui/material';\n\nexport const CustomBorderRadiusExample = () => {\n const [v, setV] = useState('Texto');\n return (\n <Box sx={{ display: 'flex', flexDirection: 'column', gap: 3, width: 300 }}>\n <Input label=\"Sin radius\" value={v} onChange={setV} borderRadius={0} />\n <Input label=\"Radius 4px\" value={v} onChange={setV} borderRadius={4} />\n <Input label=\"Default (10px)\" value={v} onChange={setV} />\n <Input label=\"Pill (24px)\" value={v} onChange={setV} borderRadius={24} />\n </Box>\n );\n};\n";
|
|
14
14
|
export declare const CustomStylingDefinition = "\nimport React, { useState } from 'react';\nimport { Input } from './Input'; // Ajusta la ruta si es necesario\nimport { Box } from '@mui/material';\n\nexport const CustomStylingExample = () => {\n const [v, setV] = useState('Custom completo');\n return (\n <Box sx={{ width: 300 }}>\n <Input\n label=\"Combinado: bg + borderColor + label color\"\n value={v}\n onChange={setV}\n sx={{\n '& .MuiInputLabel-root': { color: 'primary.main' },\n '& .MuiOutlinedInput-root': { bgcolor: '#fff7e6' },\n '& .MuiOutlinedInput-notchedOutline': {\n borderColor: 'warning.main',\n borderWidth: 2,\n },\n }}\n />\n </Box>\n );\n};\n";
|
|
15
|
+
export declare const MultilineInputDefinition = "\nimport React, { useState } from 'react';\nimport { Input } from './Input';\nimport { Box, Typography } from '@mui/material';\n\nexport const MultilineInputExample = () => {\n const [value, setValue] = useState('Escribe un comentario en varias l\u00EDneas...');\n return (\n <Box sx={{ width: 400 }}>\n <Input\n label=\"Comentario\"\n value={value}\n onChange={(v) => setValue(v.toString())}\n multiline\n minRows={3}\n maxRows={6}\n fullWidth\n />\n <Typography sx={{ mt: 2 }}>Valor actual: {value}</Typography>\n </Box>\n );\n};\n";
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { InputHTMLAttributes } from 'react';
|
|
2
2
|
import { TextFieldProps } from '@mui/material';
|
|
3
|
-
import { InputType
|
|
3
|
+
import { InputType } from './Input';
|
|
4
4
|
/**
|
|
5
5
|
* Convierte el valor raw del evento al tipo apropiado.
|
|
6
6
|
* Para type="number" intenta parsear a número; si falla, devuelve el raw
|
|
@@ -9,6 +9,6 @@ import { InputType, LabelPosition } from './Input';
|
|
|
9
9
|
export declare const parseValue: (raw: string, type: InputType) => string | number;
|
|
10
10
|
/**
|
|
11
11
|
* Construye los slotProps del TextField consolidando htmlInput + inputLabel.
|
|
12
|
-
* Maneja los atributos min/max cuando type="number" y readOnly.
|
|
12
|
+
* Maneja los atributos min/max cuando type="number", maxLength y readOnly.
|
|
13
13
|
*/
|
|
14
|
-
export declare const buildSlotProps: (type: InputType, min: number | undefined, max: number | undefined, customSlotProps: TextFieldProps["slotProps"], customInputProps: InputHTMLAttributes<HTMLInputElement> | undefined,
|
|
14
|
+
export declare const buildSlotProps: (type: InputType, min: number | undefined, max: number | undefined, maxLength: number | undefined, customSlotProps: TextFieldProps["slotProps"], customInputProps: InputHTMLAttributes<HTMLInputElement> | undefined, readOnly?: boolean) => TextFieldProps["slotProps"];
|
|
@@ -1,175 +1,6 @@
|
|
|
1
|
-
|
|
2
|
-
var __defProps = Object.defineProperties;
|
|
3
|
-
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
4
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
5
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
7
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
8
|
-
var __spreadValues = (a, b) => {
|
|
9
|
-
for (var prop in b || (b = {}))
|
|
10
|
-
if (__hasOwnProp.call(b, prop))
|
|
11
|
-
__defNormalProp(a, prop, b[prop]);
|
|
12
|
-
if (__getOwnPropSymbols)
|
|
13
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
14
|
-
if (__propIsEnum.call(b, prop))
|
|
15
|
-
__defNormalProp(a, prop, b[prop]);
|
|
16
|
-
}
|
|
17
|
-
return a;
|
|
18
|
-
};
|
|
19
|
-
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
20
|
-
var __objRest = (source, exclude) => {
|
|
21
|
-
var target = {};
|
|
22
|
-
for (var prop in source)
|
|
23
|
-
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
24
|
-
target[prop] = source[prop];
|
|
25
|
-
if (source != null && __getOwnPropSymbols)
|
|
26
|
-
for (var prop of __getOwnPropSymbols(source)) {
|
|
27
|
-
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
28
|
-
target[prop] = source[prop];
|
|
29
|
-
}
|
|
30
|
-
return target;
|
|
31
|
-
};
|
|
32
|
-
import { jsx } from "react/jsx-runtime";
|
|
33
|
-
import { TextField } from "@mui/material";
|
|
34
|
-
import { useTheme } from "@mui/material/styles";
|
|
35
|
-
import { Controller } from "react-hook-form";
|
|
36
|
-
import { b as buildFormFieldSx, F as FIELD_INPUT_PADDING_Y } from "../../formField.sx-DfVbMe0V.js";
|
|
37
|
-
import { r as resolvePreset } from "../../resolvePreset-B-IB0ehH.js";
|
|
38
|
-
const parseValue = (raw, type) => {
|
|
39
|
-
if (type !== "number") return raw;
|
|
40
|
-
if (raw === "" || raw === "-") return raw;
|
|
41
|
-
const n = parseFloat(raw);
|
|
42
|
-
return isNaN(n) ? raw : n;
|
|
43
|
-
};
|
|
44
|
-
const buildSlotProps = (type, min, max, customSlotProps, customInputProps, _labelPosition, readOnly) => {
|
|
45
|
-
const numberAttrs = type === "number" ? __spreadValues({ min: min != null ? min : Number.NEGATIVE_INFINITY }, max !== void 0 && { max }) : {};
|
|
46
|
-
return __spreadProps(__spreadValues({}, customSlotProps), {
|
|
47
|
-
htmlInput: __spreadValues(__spreadValues(__spreadValues(__spreadValues({}, customInputProps), customSlotProps == null ? void 0 : customSlotProps.htmlInput), numberAttrs), readOnly && { readOnly: true }),
|
|
48
|
-
// Dejamos que MUI maneje el shrink nativamente (animación inside → up).
|
|
49
|
-
// El consumidor puede forzar shrink con slotProps.inputLabel.shrink=true si lo necesita.
|
|
50
|
-
inputLabel: __spreadValues({}, customSlotProps == null ? void 0 : customSlotProps.inputLabel)
|
|
51
|
-
});
|
|
52
|
-
};
|
|
53
|
-
const buildInputSx = (borderRadius, labelPosition) => {
|
|
54
|
-
const radius = typeof borderRadius === "number" ? `${borderRadius}px` : borderRadius;
|
|
55
|
-
return buildFormFieldSx({
|
|
56
|
-
borderRadius,
|
|
57
|
-
labelPosition,
|
|
58
|
-
extraOutsideSx: {
|
|
59
|
-
"& .MuiInputBase-input": {
|
|
60
|
-
paddingTop: FIELD_INPUT_PADDING_Y,
|
|
61
|
-
paddingBottom: FIELD_INPUT_PADDING_Y
|
|
62
|
-
},
|
|
63
|
-
// Filled: quitar el padding-top reservado para el label flotante dentro.
|
|
64
|
-
"& .MuiFilledInput-root": {
|
|
65
|
-
paddingTop: 0,
|
|
66
|
-
borderRadius: `${radius} ${radius} 0 0`
|
|
67
|
-
},
|
|
68
|
-
"& .MuiFilledInput-input": {
|
|
69
|
-
paddingTop: FIELD_INPUT_PADDING_Y
|
|
70
|
-
},
|
|
71
|
-
// Standard: quitar el margin-top reservado para el label flotante.
|
|
72
|
-
"& .MuiInput-root": {
|
|
73
|
-
marginTop: 0
|
|
74
|
-
}
|
|
75
|
-
}
|
|
76
|
-
});
|
|
77
|
-
};
|
|
78
|
-
const Input = (props) => {
|
|
79
|
-
const _a = props, {
|
|
80
|
-
type = "text",
|
|
81
|
-
variant = "outlined",
|
|
82
|
-
size = "small",
|
|
83
|
-
borderRadius = 10,
|
|
84
|
-
labelPosition = "outside",
|
|
85
|
-
preset,
|
|
86
|
-
min,
|
|
87
|
-
max,
|
|
88
|
-
readOnly,
|
|
89
|
-
inputProps,
|
|
90
|
-
slotProps,
|
|
91
|
-
sx
|
|
92
|
-
} = _a, rest = __objRest(_a, [
|
|
93
|
-
"type",
|
|
94
|
-
"variant",
|
|
95
|
-
"size",
|
|
96
|
-
"borderRadius",
|
|
97
|
-
"labelPosition",
|
|
98
|
-
"preset",
|
|
99
|
-
"min",
|
|
100
|
-
"max",
|
|
101
|
-
"readOnly",
|
|
102
|
-
"inputProps",
|
|
103
|
-
"slotProps",
|
|
104
|
-
"sx"
|
|
105
|
-
]);
|
|
106
|
-
const theme = useTheme();
|
|
107
|
-
const presetSx = resolvePreset("Input", preset, theme);
|
|
108
|
-
const finalSlotProps = buildSlotProps(
|
|
109
|
-
type,
|
|
110
|
-
min,
|
|
111
|
-
max,
|
|
112
|
-
slotProps,
|
|
113
|
-
inputProps,
|
|
114
|
-
labelPosition,
|
|
115
|
-
readOnly
|
|
116
|
-
);
|
|
117
|
-
const mergedSx = [
|
|
118
|
-
buildInputSx(borderRadius, labelPosition),
|
|
119
|
-
...presetSx ? [presetSx] : [],
|
|
120
|
-
...Array.isArray(sx) ? sx : [sx]
|
|
121
|
-
];
|
|
122
|
-
if ("control" in props && props.control) {
|
|
123
|
-
const { name, control, validation } = props;
|
|
124
|
-
return /* @__PURE__ */ jsx(
|
|
125
|
-
Controller,
|
|
126
|
-
{
|
|
127
|
-
name,
|
|
128
|
-
control,
|
|
129
|
-
rules: validation,
|
|
130
|
-
render: ({ field, fieldState: { error } }) => {
|
|
131
|
-
var _a2, _b;
|
|
132
|
-
return /* @__PURE__ */ jsx(
|
|
133
|
-
TextField,
|
|
134
|
-
__spreadProps(__spreadValues({
|
|
135
|
-
fullWidth: true
|
|
136
|
-
}, rest), {
|
|
137
|
-
name: field.name,
|
|
138
|
-
value: (_a2 = field.value) != null ? _a2 : "",
|
|
139
|
-
onChange: (e) => field.onChange(parseValue(e.target.value, type)),
|
|
140
|
-
onBlur: field.onBlur,
|
|
141
|
-
inputRef: field.ref,
|
|
142
|
-
type,
|
|
143
|
-
variant,
|
|
144
|
-
size,
|
|
145
|
-
slotProps: finalSlotProps,
|
|
146
|
-
sx: mergedSx,
|
|
147
|
-
error: !!error || rest.error,
|
|
148
|
-
helperText: (_b = error == null ? void 0 : error.message) != null ? _b : rest.helperText
|
|
149
|
-
})
|
|
150
|
-
);
|
|
151
|
-
}
|
|
152
|
-
}
|
|
153
|
-
);
|
|
154
|
-
}
|
|
155
|
-
const { value, onChange } = props;
|
|
156
|
-
return /* @__PURE__ */ jsx(
|
|
157
|
-
TextField,
|
|
158
|
-
__spreadProps(__spreadValues({
|
|
159
|
-
fullWidth: true
|
|
160
|
-
}, rest), {
|
|
161
|
-
value: value != null ? value : "",
|
|
162
|
-
onChange: (e) => onChange(parseValue(e.target.value, type)),
|
|
163
|
-
type,
|
|
164
|
-
variant,
|
|
165
|
-
size,
|
|
166
|
-
slotProps: finalSlotProps,
|
|
167
|
-
sx: mergedSx
|
|
168
|
-
})
|
|
169
|
-
);
|
|
170
|
-
};
|
|
1
|
+
import { I, I as I2 } from "../../Input-DP_fKl38.js";
|
|
171
2
|
export {
|
|
172
|
-
Input,
|
|
173
|
-
|
|
3
|
+
I as Input,
|
|
4
|
+
I2 as default
|
|
174
5
|
};
|
|
175
6
|
//# sourceMappingURL=Input.js.map
|