@okta/odyssey-react-mui 1.50.1 → 1.52.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/CHANGELOG.md +10 -0
- package/dist/{assets/axeRun-B-LchFqf.js → cjs/ConditionalWrapper.cjs} +22 -3
- package/dist/cjs/ConditionalWrapper.cjs.map +1 -0
- package/dist/cjs/DataTable/DataTable.cjs +1 -2
- package/dist/cjs/DataTable/DataTable.cjs.map +1 -1
- package/dist/cjs/Dialog.cjs +9 -1
- package/dist/cjs/Dialog.cjs.map +1 -1
- package/dist/cjs/Drawer.cjs +1 -0
- package/dist/cjs/Drawer.cjs.map +1 -1
- package/dist/cjs/FullScreenOverlay.cjs +4 -1
- package/dist/cjs/FullScreenOverlay.cjs.map +1 -1
- package/dist/cjs/FullScreenOverlayContext.cjs +10 -3
- package/dist/cjs/FullScreenOverlayContext.cjs.map +1 -1
- package/dist/cjs/HintLink.cjs +1 -1
- package/dist/cjs/HintLink.cjs.map +1 -1
- package/dist/cjs/OdysseyProvider.cjs +33 -22
- package/dist/cjs/OdysseyProvider.cjs.map +1 -1
- package/dist/cjs/Select.cjs +5 -0
- package/dist/cjs/Select.cjs.map +1 -1
- package/dist/cjs/__internal.cjs +11 -0
- package/dist/cjs/__internal.cjs.map +1 -1
- package/dist/cjs/createUniqueId.cjs +4 -1
- package/dist/cjs/createUniqueId.cjs.map +1 -1
- package/dist/cjs/labs/index.cjs +12 -0
- package/dist/cjs/labs/index.cjs.map +1 -1
- package/dist/cjs/theme/components.cjs +5 -2
- package/dist/cjs/theme/components.cjs.map +1 -1
- package/dist/cjs/ui-shell/NarrowUiShellContent.cjs +6 -10
- package/dist/cjs/ui-shell/NarrowUiShellContent.cjs.map +1 -1
- package/dist/cjs/ui-shell/SideNav/SideNavHeader.cjs +2 -2
- package/dist/cjs/ui-shell/SideNav/SideNavHeader.cjs.map +1 -1
- package/dist/cjs/ui-shell/SideNav/types.cjs.map +1 -1
- package/dist/cjs/ui-shell/UiShell.cjs +5 -1
- package/dist/cjs/ui-shell/UiShell.cjs.map +1 -1
- package/dist/cjs/ui-shell/{SideNav/SideNavLogo.cjs → UiShellLogo.cjs} +6 -6
- package/dist/cjs/ui-shell/UiShellLogo.cjs.map +1 -0
- package/dist/cjs/ui-shell/index.cjs +12 -0
- package/dist/cjs/ui-shell/index.cjs.map +1 -1
- package/dist/cjs/ui-shell/uiShellContentTypes.cjs.map +1 -1
- package/dist/cjs/useContrastMode.cjs +1 -1
- package/dist/cjs/useContrastMode.cjs.map +1 -1
- package/dist/cjs/web-component/odysseyWebComponentVersion.generated.cjs +1 -1
- package/dist/cjs/web-component/odysseyWebComponentVersion.generated.cjs.map +1 -1
- package/dist/{assets/pxToRem-BrMhKUxS.js → esm/ConditionalWrapper.js} +15 -1
- package/dist/esm/ConditionalWrapper.js.map +1 -0
- package/dist/esm/DataTable/DataTable.js +1 -2
- package/dist/esm/DataTable/DataTable.js.map +1 -1
- package/dist/esm/Dialog.js +10 -2
- package/dist/esm/Dialog.js.map +1 -1
- package/dist/esm/Drawer.js +1 -0
- package/dist/esm/Drawer.js.map +1 -1
- package/dist/esm/FullScreenOverlay.js +4 -1
- package/dist/esm/FullScreenOverlay.js.map +1 -1
- package/dist/esm/FullScreenOverlayContext.js +9 -2
- package/dist/esm/FullScreenOverlayContext.js.map +1 -1
- package/dist/esm/HintLink.js +1 -1
- package/dist/esm/HintLink.js.map +1 -1
- package/dist/esm/OdysseyProvider.js +34 -23
- package/dist/esm/OdysseyProvider.js.map +1 -1
- package/dist/esm/Select.js +5 -0
- package/dist/esm/Select.js.map +1 -1
- package/dist/esm/__internal.js +1 -0
- package/dist/esm/__internal.js.map +1 -1
- package/dist/esm/createUniqueId.js +4 -1
- package/dist/esm/createUniqueId.js.map +1 -1
- package/dist/esm/labs/index.js +1 -0
- package/dist/esm/labs/index.js.map +1 -1
- package/dist/esm/theme/components.js +5 -2
- package/dist/esm/theme/components.js.map +1 -1
- package/dist/esm/ui-shell/NarrowUiShellContent.js +6 -10
- package/dist/esm/ui-shell/NarrowUiShellContent.js.map +1 -1
- package/dist/esm/ui-shell/SideNav/SideNavHeader.js +2 -2
- package/dist/esm/ui-shell/SideNav/SideNavHeader.js.map +1 -1
- package/dist/esm/ui-shell/SideNav/types.js.map +1 -1
- package/dist/esm/ui-shell/UiShell.js +5 -1
- package/dist/esm/ui-shell/UiShell.js.map +1 -1
- package/dist/esm/ui-shell/{SideNav/SideNavLogo.js → UiShellLogo.js} +6 -6
- package/dist/esm/ui-shell/UiShellLogo.js.map +1 -0
- package/dist/esm/ui-shell/index.js +1 -0
- package/dist/esm/ui-shell/index.js.map +1 -1
- package/dist/esm/ui-shell/uiShellContentTypes.js.map +1 -1
- package/dist/esm/useContrastMode.js +1 -1
- package/dist/esm/useContrastMode.js.map +1 -1
- package/dist/esm/web-component/odysseyWebComponentVersion.generated.js +1 -1
- package/dist/esm/web-component/odysseyWebComponentVersion.generated.js.map +1 -1
- package/dist/index.d.ts +21 -232
- package/dist/index.es.js.map +1 -1
- package/dist/index.iife.js.map +1 -1
- package/dist/index.umd.cjs.map +1 -1
- package/dist/tsconfig.production.tsbuildinfo +1 -1
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/dist/{assets/uiShellSharedConstants-CvCey4L_.js → types/ConditionalWrapper.d.ts} +10 -1
- package/dist/types/ConditionalWrapper.d.ts.map +1 -0
- package/dist/types/DataTable/DataTable.d.ts.map +1 -1
- package/dist/types/Dialog.d.ts +5 -1
- package/dist/types/Dialog.d.ts.map +1 -1
- package/dist/types/Drawer.d.ts.map +1 -1
- package/dist/types/FullScreenOverlay.d.ts +3 -2
- package/dist/types/FullScreenOverlay.d.ts.map +1 -1
- package/dist/types/FullScreenOverlayContext.d.ts +12 -1
- package/dist/types/FullScreenOverlayContext.d.ts.map +1 -1
- package/dist/types/OdysseyProvider.d.ts +7 -1
- package/dist/types/OdysseyProvider.d.ts.map +1 -1
- package/dist/types/Select.d.ts.map +1 -1
- package/dist/types/__internal.d.ts +1 -0
- package/dist/types/__internal.d.ts.map +1 -1
- package/dist/types/createUniqueId.d.ts.map +1 -1
- package/dist/types/labs/index.d.ts +4 -0
- package/dist/types/labs/index.d.ts.map +1 -1
- package/dist/types/theme/components.d.ts.map +1 -1
- package/dist/types/tsconfig.tsbuildinfo +1 -1
- package/dist/types/ui-shell/NarrowUiShellContent.d.ts +2 -2
- package/dist/types/ui-shell/NarrowUiShellContent.d.ts.map +1 -1
- package/dist/types/ui-shell/SideNav/SideNavHeader.d.ts +6 -2
- package/dist/types/ui-shell/SideNav/SideNavHeader.d.ts.map +1 -1
- package/dist/types/ui-shell/SideNav/types.d.ts +4 -44
- package/dist/types/ui-shell/SideNav/types.d.ts.map +1 -1
- package/dist/types/ui-shell/UiShell.d.ts.map +1 -1
- package/dist/types/ui-shell/UiShellLogo.d.ts +55 -0
- package/dist/types/ui-shell/UiShellLogo.d.ts.map +1 -0
- package/dist/types/ui-shell/index.d.ts +1 -0
- package/dist/types/ui-shell/index.d.ts.map +1 -1
- package/dist/types/ui-shell/uiShellContentTypes.d.ts +7 -0
- package/dist/types/ui-shell/uiShellContentTypes.d.ts.map +1 -1
- package/dist/types/useContrastMode.d.ts +1 -1
- package/dist/types/useContrastMode.d.ts.map +1 -1
- package/dist/types/web-component/odysseyWebComponentVersion.generated.d.ts +1 -1
- package/package.json +8 -8
- package/dist/appswitcher/admin-app-default.svg +0 -6
- package/dist/appswitcher/admin-app-selected.svg +0 -6
- package/dist/appswitcher/aerial-default.svg +0 -7
- package/dist/appswitcher/aerial-selected.svg +0 -7
- package/dist/appswitcher/okta-dashboard-default.svg +0 -7
- package/dist/appswitcher/okta-dashboard-selected.svg +0 -7
- package/dist/appswitcher/privileged-access-default.svg +0 -4
- package/dist/appswitcher/privileged-access-selected.svg +0 -4
- package/dist/appswitcher/workflows-default.svg +0 -5
- package/dist/appswitcher/workflows-selected.svg +0 -5
- package/dist/assets/Accordion-TL4V06gN.js +0 -1
- package/dist/assets/Accordion.stories-_etHHM8e.js +0 -85
- package/dist/assets/AccordionSummary-D9iUNt-k.js +0 -1
- package/dist/assets/AlertTitle-C5NflvC5.js +0 -1
- package/dist/assets/AppSwitcher-QbTtJQaq.js +0 -21
- package/dist/assets/AppSwitcher.stories-DHBG5rOr.js +0 -100
- package/dist/assets/AppTile _labs_.stories-C-dzZ7Qn.js +0 -136
- package/dist/assets/ArrowDropDown-DddCYTEO.js +0 -1
- package/dist/assets/ArrowRight-BCdbWzwG.js +0 -1
- package/dist/assets/Autocomplete-BMfy4j72.js +0 -1
- package/dist/assets/Autocomplete-DVDZYzDH.js +0 -1
- package/dist/assets/Autocomplete.stories-B8RiFnpA.js +0 -316
- package/dist/assets/Badge-DGWMi2ON.js +0 -11
- package/dist/assets/Banner-DCJxRKN5.js +0 -1
- package/dist/assets/Banner.stories-Bsazp99i.js +0 -96
- package/dist/assets/BaseButton-C1Nzi3yl.js +0 -11
- package/dist/assets/BaseMenuButton-DPFgAU1j.js +0 -1
- package/dist/assets/Box-BK5oZBIO.js +0 -1
- package/dist/assets/Box-CTjIz0-2.js +0 -1
- package/dist/assets/Box-Csk9IBP6.js +0 -11
- package/dist/assets/Box.stories-CtReuS8W.js +0 -38
- package/dist/assets/Breadcrumbs-DnkzpkPy.js +0 -6
- package/dist/assets/Breadcrumbs.stories-C7zVt3mr.js +0 -79
- package/dist/assets/Bug-CxccEZAh.js +0 -1
- package/dist/assets/Button-CbJri63v.js +0 -1
- package/dist/assets/Button-DuM2NeMY.js +0 -11
- package/dist/assets/Button.stories-CRV-c8gG.js +0 -271
- package/dist/assets/ButtonBase-Lbe0_84r.js +0 -74
- package/dist/assets/Calendar-DXL71nUA.js +0 -1
- package/dist/assets/Callout-DY2rv89C.js +0 -1
- package/dist/assets/Callout.stories--Eo8BRU5.js +0 -128
- package/dist/assets/Card-BBklAYRu.js +0 -8
- package/dist/assets/Card-z7130zaB.js +0 -1
- package/dist/assets/Card.stories-fvpTzjYC.js +0 -56
- package/dist/assets/CardActionArea-B7i8fBJO.js +0 -1
- package/dist/assets/CardActions-C8G3mEo5.js +0 -1
- package/dist/assets/Checkbox-BlSNHylx.js +0 -1
- package/dist/assets/Checkbox-CMDOP82Q.js +0 -1
- package/dist/assets/Checkbox.stories-DP2aUvGZ.js +0 -96
- package/dist/assets/CheckboxGroup-CwIFFbkc.js +0 -1
- package/dist/assets/CheckboxGroup.stories-Bo4ON9ko.js +0 -92
- package/dist/assets/ChevronRight-SFKDVCjo.js +0 -1
- package/dist/assets/ChevronUp-DyYSBYAc.js +0 -1
- package/dist/assets/Chip-M3FRYspe.js +0 -1
- package/dist/assets/CircularProgress-K0vgt9-g.js +0 -28
- package/dist/assets/CircularProgress-iBaxEenq.js +0 -1
- package/dist/assets/CircularProgress.stories-B0Pf66JJ.js +0 -44
- package/dist/assets/Clock-B6hba9Vz.js +0 -1
- package/dist/assets/Close-DJA1l50S.js +0 -1
- package/dist/assets/Code Styling Guidelines-pHbGhTau.js +0 -14
- package/dist/assets/Collapse-DKQFr8Jv.js +0 -1
- package/dist/assets/Color-YHDXOIA2-CG5LwN35.js +0 -1
- package/dist/assets/CssBaseline-Bkt1iTa6.js +0 -191
- package/dist/assets/CssBaseline.stories-DJmHUmdE.js +0 -364
- package/dist/assets/Custom Theming-B72hK7oE.js +0 -135
- package/dist/assets/Custom Theming.stories-Cf2-ayRw.js +0 -95
- package/dist/assets/DataFilters _labs_-jIB_cIPS.js +0 -55
- package/dist/assets/DataFilters _labs_.stories-Bbrh7lix.js +0 -31
- package/dist/assets/DataFilters-DPi4_TMw.js +0 -1
- package/dist/assets/DataTable _labs_-UipdAC3j.js +0 -41
- package/dist/assets/DataTable _labs_.stories-o_LRnzmM.js +0 -21
- package/dist/assets/DataTable-8_tFkAz1.js +0 -404
- package/dist/assets/DataTable-Breh7Oua.js +0 -21
- package/dist/assets/DataTable.stories-D_xL1EQO.js +0 -438
- package/dist/assets/DataView _labs_-Uk1ng26p.js +0 -332
- package/dist/assets/DataView _labs_.stories-BIkujkH4.js +0 -438
- package/dist/assets/DataView-CBu_vDz5.js +0 -91
- package/dist/assets/DataView.stories-BZ_fLfnH.js +0 -954
- package/dist/assets/DatePicker-DcQC9osa.js +0 -1
- package/dist/assets/DatePicker-DrZNv0PG.js +0 -11
- package/dist/assets/DatePicker.stories-CdxHpQSt.js +0 -133
- package/dist/assets/DateTimePicker-Bc3ybPls.js +0 -1
- package/dist/assets/DateTimePicker.stories-EwHhkVLF.js +0 -158
- package/dist/assets/Design Tokens-rV9HMgkt.js +0 -4
- package/dist/assets/Dialog-DzHtD6Y8.js +0 -1
- package/dist/assets/Dialog.stories-Da8cQK7E.js +0 -201
- package/dist/assets/DialogContent-CfzX3t0u.js +0 -1
- package/dist/assets/DialogTitle-DWrKQeoP.js +0 -1
- package/dist/assets/Divider-bVF9wNUG.js +0 -1
- package/dist/assets/DocsRenderer-CFRXHY34-DjVgG9gc.js +0 -2
- package/dist/assets/Documentation-D-myRfum.js +0 -1
- package/dist/assets/Download-vZ2qKd4H.js +0 -1
- package/dist/assets/Drawer-D97GHbuL.js +0 -33
- package/dist/assets/Drawer.stories-BgDN3SBx.js +0 -95
- package/dist/assets/EmptyState-DqVcjLYd.js +0 -11
- package/dist/assets/EmptyState.stories-LlfICq7c.js +0 -11
- package/dist/assets/ExampleButton.stories-Dlu-0j3r.js +0 -320
- package/dist/assets/Extending Translations-yMUmArCq.js +0 -148
- package/dist/assets/ExternalLink-D3z7HWdx.js +0 -1
- package/dist/assets/Fade-fD56BVkE.js +0 -1
- package/dist/assets/Field-QbF6sK2K.js +0 -11
- package/dist/assets/FieldHint-Mz3OdL0I.js +0 -1
- package/dist/assets/Fieldset-Qg__SoCs.js +0 -11
- package/dist/assets/Fieldset.stories-CSgoy_R1.js +0 -15
- package/dist/assets/FileUploader.stories-CLC8ua1s.js +0 -58
- package/dist/assets/Filter-sXa3iWrm.js +0 -1
- package/dist/assets/Folder-DFjbrJpD.js +0 -1
- package/dist/assets/Form Field Accessibility-CeE-yHi9.js +0 -18
- package/dist/assets/Form--NGGwJcX.js +0 -11
- package/dist/assets/Form.stories-DpN6pnfW.js +0 -69
- package/dist/assets/FormControlLabel-DPa22EmK.js +0 -1
- package/dist/assets/FormGroup-CYHiKrU4.js +0 -1
- package/dist/assets/FormHelperText-DQoZ2-nD.js +0 -1
- package/dist/assets/FormLabel-CjrKvhME.js +0 -1
- package/dist/assets/FullScreenOverlay-B8rXO7lI.js +0 -11
- package/dist/assets/Generating Icons-4rsSwyQz.js +0 -16
- package/dist/assets/Globe-DER_Oel8.js +0 -1
- package/dist/assets/Grid-_Dwg3x03.js +0 -1
- package/dist/assets/Group-D87tnFnJ.js +0 -1
- package/dist/assets/GroupPicker _labs_.stories-Dkot8Gvy.js +0 -33
- package/dist/assets/Grow-D6A2VZqw.js +0 -1
- package/dist/assets/Hide-ovxLvICH.js +0 -1
- package/dist/assets/Hint-CkN2-6Wh.js +0 -11
- package/dist/assets/Home-Cn8YbOdj.js +0 -1
- package/dist/assets/Icon _icons_.stories-qnlVJ269.js +0 -16
- package/dist/assets/IconButton-CgM2Hv_L.js +0 -1
- package/dist/assets/IconWithTooltip _icons_.stories-Bdz-yaYX.js +0 -19
- package/dist/assets/InformationCircle-CG6-PCJh.js +0 -1
- package/dist/assets/InputAdornment-CVIbzdDI.js +0 -1
- package/dist/assets/InputBase-DSyP23zj.js +0 -2
- package/dist/assets/Installing odyssey-react-mui-CiYP6xN7.js +0 -216
- package/dist/assets/Introduction-CrzfC_TA.js +0 -36
- package/dist/assets/Layout-CLuC-soE.js +0 -11
- package/dist/assets/Layout.stories-CBxD-F_N.js +0 -285
- package/dist/assets/Legacy Migrations-ClnAFJAt.js +0 -86
- package/dist/assets/Link-BS9ZeF6K.js +0 -11
- package/dist/assets/Link-Ck99nJao.js +0 -1
- package/dist/assets/Link-D0sejjD3.js +0 -1
- package/dist/assets/Link-PjuOItUN.js +0 -1
- package/dist/assets/Link.stories--V5lBgMx.js +0 -43
- package/dist/assets/List-B7JH4gjK.js +0 -1
- package/dist/assets/List-BSidosAy.js +0 -1
- package/dist/assets/ListItem-DB9pwEx3.js +0 -1
- package/dist/assets/ListSubheader--G940pR4.js +0 -1
- package/dist/assets/Menu-C2dEwThV.js +0 -1
- package/dist/assets/MenuButton-Bh79TcKB.js +0 -9
- package/dist/assets/MenuButton-C-OmKt3g.js +0 -11
- package/dist/assets/MenuButton.stories-Ceqz4qjB.js +0 -246
- package/dist/assets/MenuContext-DKMyPMNY.js +0 -11
- package/dist/assets/MenuItem-C0i8WJAZ.js +0 -1
- package/dist/assets/MenuItem-D69h7bYZ.js +0 -1
- package/dist/assets/MenuItem.stories-D1nmz6cr.js +0 -29
- package/dist/assets/MenuList-BCZDiX8u.js +0 -1
- package/dist/assets/Modal-Ddv1e_fT.js +0 -1
- package/dist/assets/More-DLP5TTaz.js +0 -1
- package/dist/assets/MuiPropsContext-DhRylJZk.js +0 -11
- package/dist/assets/NativeSelect.stories-iwOAP2MY.js +0 -173
- package/dist/assets/Notification-DZN2A8i5.js +0 -1
- package/dist/assets/OdysseyProvider-oMWLr_-4.js +0 -66
- package/dist/assets/OdysseyStorybookThemeDecorator-DmBIIOGu.js +0 -1
- package/dist/assets/OdysseyThemeProvider-C4N_85M9.js +0 -189
- package/dist/assets/PageHeader.stories-CP7yWDvu.js +0 -57
- package/dist/assets/PageHeader.stories-o8T_qtyq.js +0 -364
- package/dist/assets/PageTemplate _labs_-D-ZpvSDn.js +0 -8
- package/dist/assets/PageTemplate _labs_.stories-CcKAPVlY.js +0 -306
- package/dist/assets/PageTemplate-DwiuZ2gD.js +0 -21
- package/dist/assets/PageTemplate.stories-BWAsJCDg.js +0 -205
- package/dist/assets/PaginatedTable _labs_.stories-eXIvKB_N.js +0 -65
- package/dist/assets/Pagination-CPZOkZUE.js +0 -11
- package/dist/assets/Pagination.stories-ZB73al5s.js +0 -17
- package/dist/assets/Paper-D4wDjY4F.js +0 -1
- package/dist/assets/PasswordField.stories-CFBj2mPt.js +0 -129
- package/dist/assets/Picker _labs_.stories-BSP2s_pC.js +0 -18
- package/dist/assets/PickerWithOptionAdornment _labs_.stories-CcdT2YZm.js +0 -70
- package/dist/assets/PlaceholderLogo-JfVvgA23.js +0 -11
- package/dist/assets/Popper-9pd1Yneu.js +0 -1
- package/dist/assets/Portal-DK2ELYoG.js +0 -1
- package/dist/assets/ProgressBar.stories-BNmDO6bH.js +0 -311
- package/dist/assets/Radio-B2zw408T.js +0 -1
- package/dist/assets/Radio-BRMnUBeG.js +0 -1
- package/dist/assets/Radio.stories-BiHez-Um.js +0 -63
- package/dist/assets/RadioGroup-3NM12Muw.js +0 -10
- package/dist/assets/RadioGroup-BM3_3HU2.js +0 -1
- package/dist/assets/RadioGroup-CZWIkl-b.js +0 -1
- package/dist/assets/RadioGroup.stories-cENtOlFv.js +0 -138
- package/dist/assets/Refresh-D3vISItP.js +0 -1
- package/dist/assets/ResourceAccessPolicyComponentsStorybookThemeDecorator-Di2iOJpx.js +0 -212
- package/dist/assets/Right-to-Left (RTL)-fcueNY4p.js +0 -62
- package/dist/assets/ScreenReaderText-6_RVPtH_.js +0 -15
- package/dist/assets/ScreenReaderText-DrkvjfUf.js +0 -1
- package/dist/assets/ScreenReaderText.stories-CO8LdK8F.js +0 -8
- package/dist/assets/Search-BH45H3v4.js +0 -1
- package/dist/assets/SearchDropdown _labs_.stories-Bmp81G56.js +0 -53
- package/dist/assets/SearchField-vEVEEXjl.js +0 -1
- package/dist/assets/SearchField.stories-C83bZsBy.js +0 -37
- package/dist/assets/Select-DGL00QcS.js +0 -15
- package/dist/assets/Select-Dg6qtAos.js +0 -1
- package/dist/assets/Select.stories-CZO06lSs.js +0 -293
- package/dist/assets/Server-3cieqme0.js +0 -1
- package/dist/assets/Settings-Bxzwc53G.js +0 -1
- package/dist/assets/Setup-wp_q8G1u.js +0 -7
- package/dist/assets/Shadow DOM-UCL9R1Bd.js +0 -64
- package/dist/assets/Show-D1oNDX9u.js +0 -1
- package/dist/assets/SideNav-CA5MPRIw.js +0 -85
- package/dist/assets/SideNav-DjaJNhvQ.js +0 -131
- package/dist/assets/SideNav.stories-DsqmEgxA.js +0 -207
- package/dist/assets/Skeleton-Bgl-rJ6W.js +0 -51
- package/dist/assets/Snackbar-hhmQPX8K.js +0 -1
- package/dist/assets/Stack-Dyzg8njm.js +0 -1
- package/dist/assets/Stack.stories-DoWxKo-o.js +0 -1
- package/dist/assets/StaticTable _labs_.stories-CwBlkxKe.js +0 -34
- package/dist/assets/Status-SY8R_HiF.js +0 -1
- package/dist/assets/Status.stories-DEyjfdZ8.js +0 -66
- package/dist/assets/Stepper.stories-C2_hEMjv.js +0 -564
- package/dist/assets/Surface-DBEECTVv.js +0 -1
- package/dist/assets/Switch.stories-CsPyggPf.js +0 -61
- package/dist/assets/SwitchBase-n4YlIRfi.js +0 -1
- package/dist/assets/Sync-MXQ8RKoq.js +0 -1
- package/dist/assets/Tabs-CKDb0WZw.js +0 -23
- package/dist/assets/Tabs-Yjnd4xiR.js +0 -1
- package/dist/assets/Tabs.stories-DYgpMtE6.js +0 -100
- package/dist/assets/Tag-DCZngwHs.js +0 -11
- package/dist/assets/Tag.stories-DjsZZZ5g.js +0 -96
- package/dist/assets/TagList-BvQLms1L.js +0 -1
- package/dist/assets/TextField-DUdvP48K.js +0 -1
- package/dist/assets/TextField.stories-CFIUIy2O.js +0 -149
- package/dist/assets/Toast.stories-DmPuslG7.js +0 -134
- package/dist/assets/ToastManager.stories-C0WSwoY-.js +0 -196
- package/dist/assets/Tooltip-DOwIJUHs.js +0 -1
- package/dist/assets/Tooltip-ciZ4e0Eb.js +0 -11
- package/dist/assets/Tooltip.stories-B4e1QEoX.js +0 -68
- package/dist/assets/TopNav-DjvdFijR.js +0 -11
- package/dist/assets/TopNav.stories-Ctwu_9N_.js +0 -13
- package/dist/assets/TransitionGroupContext-DAL84N7p.js +0 -1
- package/dist/assets/Typography-C4vClHaZ.js +0 -1
- package/dist/assets/Typography-DkvJJHkF.js +0 -1
- package/dist/assets/Typography-NdqIGwl5.js +0 -1
- package/dist/assets/Typography-c9CeGtmy.js +0 -9
- package/dist/assets/Typography.stories-C8KXE15q.js +0 -139
- package/dist/assets/Typography.stories-Di7tmDM_.js +0 -73
- package/dist/assets/UiShell.stories-CkplIEt6.js +0 -558
- package/dist/assets/UiShellProvider-Do3wWAnY.js +0 -31
- package/dist/assets/Upload-B99qcWTV.js +0 -1
- package/dist/assets/User-D5oZGOlm.js +0 -1
- package/dist/assets/UserProfile-DyDMmyrK.js +0 -11
- package/dist/assets/UserProfile.stories-W7GTlBN8.js +0 -14
- package/dist/assets/UserProfileMenuButton.stories-BLoHU0os.js +0 -30
- package/dist/assets/Video-t97PFROt.js +0 -1
- package/dist/assets/WorkflowsComponentsStorybookThemeDecorator-C42hLMDY.js +0 -197
- package/dist/assets/_commonjsHelpers-gnU0ypJ3.js +0 -1
- package/dist/assets/assertThisInitialized-B9jnkVVz.js +0 -1
- package/dist/assets/axe-4JP0vCEZ.js +0 -30
- package/dist/assets/chunk-XP5HYGXS-BpfKkqn7.js +0 -1
- package/dist/assets/client-ByW5HbEz.js +0 -1
- package/dist/assets/colorManipulator-BmBCr6qx.js +0 -1
- package/dist/assets/constants-CGUp4oSR.js +0 -11
- package/dist/assets/constants-CyailK6t.js +0 -11
- package/dist/assets/createBox-Cu6fLdzL.js +0 -1
- package/dist/assets/createChainedFunction-BO_9K8Jh.js +0 -1
- package/dist/assets/createStyled-CcazfAPj.js +0 -1
- package/dist/assets/createSvgIcon-V-Po-Ssl.js +0 -1
- package/dist/assets/createUniqueId-ByTaVY63.js +0 -1
- package/dist/assets/debounce-Be36O1Ab.js +0 -1
- package/dist/assets/dialogActionsClasses-p1SqDmrR.js +0 -1
- package/dist/assets/dom.esm-B9r8vBgQ.js +0 -65
- package/dist/assets/emotion-react-jsx-runtime.browser.esm-DIdX2qdc.js +0 -1
- package/dist/assets/entry-preview-CPHmgmI_.js +0 -2
- package/dist/assets/entry-preview-docs-BKXv92OK.js +0 -46
- package/dist/assets/fieldComponentPropsMetaData-BqbNLw6V.js +0 -11
- package/dist/assets/getReactElementRef-SdO7zWnC.js +0 -1
- package/dist/assets/getScrollbarSize-Bqq2hMjQ.js +0 -1
- package/dist/assets/i18next-7SyOfhCu.js +0 -1
- package/dist/assets/iconUtils-01jcyLGr.js +0 -11
- package/dist/assets/iframe-pzQvMjuK.js +0 -211
- package/dist/assets/index-B-lxVbXh.js +0 -1
- package/dist/assets/index-B5xazMy1.js +0 -1
- package/dist/assets/index-BJMTVygn.js +0 -240
- package/dist/assets/index-BJRwoad0.js +0 -1
- package/dist/assets/index-BJTM6NaI.js +0 -192
- package/dist/assets/index-BVtttuMv.js +0 -1
- package/dist/assets/index-BeeV6X6A.js +0 -1
- package/dist/assets/index-CXQShRbs.js +0 -8
- package/dist/assets/index-DDAqzdZr.js +0 -1
- package/dist/assets/index-DieBXP3Z.js +0 -24
- package/dist/assets/index-DrFu-skq.js +0 -6
- package/dist/assets/index-NdkWRN8K.js +0 -9
- package/dist/assets/index-c74KQyVj.js +0 -384
- package/dist/assets/index.esm-C8irYXeq.js +0 -1
- package/dist/assets/index.esm-Dv3Cs9mX.js +0 -138
- package/dist/assets/index.modern-CkASn_bb.js +0 -14
- package/dist/assets/inheritsLoose-S-YxUaHb.js +0 -1
- package/dist/assets/inputUtils-Dbi8XkA6.js +0 -11
- package/dist/assets/isHostComponent-DVu5iVWx.js +0 -1
- package/dist/assets/jsx-runtime-CnH95YSl.js +0 -9
- package/dist/assets/matchers-7Z3WT2CE-T3xScrR7.js +0 -14
- package/dist/assets/ownerDocument-DW-IO8s5.js +0 -1
- package/dist/assets/ownerWindow-HkKU3E4x.js +0 -1
- package/dist/assets/personData-BDz2-Bac.js +0 -11
- package/dist/assets/personData-TjBCCFSX.js +0 -1
- package/dist/assets/pickerComponentPropsMetadata-DyMkD2Aw.js +0 -21
- package/dist/assets/popper-ChLFknNm.js +0 -1
- package/dist/assets/preview-B8lJiyuQ.js +0 -34
- package/dist/assets/preview-BAx1BwgB.js +0 -1
- package/dist/assets/preview-BBWR9nbA.js +0 -1
- package/dist/assets/preview-BWzBA1C2.js +0 -396
- package/dist/assets/preview-BaoH-L4j.js +0 -1
- package/dist/assets/preview-CQqyhYi4.js +0 -2
- package/dist/assets/preview-CYp4EYYZ.js +0 -1
- package/dist/assets/preview-CvbIS5ZJ.js +0 -1
- package/dist/assets/preview-DGUiP6tS.js +0 -7
- package/dist/assets/preview-DHQbi4pV.js +0 -1
- package/dist/assets/preview-Db5KMipM.js +0 -2
- package/dist/assets/preview-MBifGIx_.js +0 -1
- package/dist/assets/queryOdysseySelector-_ueksTI2.js +0 -123
- package/dist/assets/react-18-u8niHpKc.js +0 -1
- package/dist/assets/renderUiShell.stories-DJOqBLkr.js +0 -872
- package/dist/assets/resolveComponentProps-D1ztx9lS.js +0 -1
- package/dist/assets/tableSortLabelClasses-BUdDGZ1b.js +0 -1
- package/dist/assets/test-utils-H9lH7T5D.js +0 -9
- package/dist/assets/useAutocomplete-B3_vLbIK.js +0 -11
- package/dist/assets/useControlled-NQulfz4l.js +0 -1
- package/dist/assets/useFormControl-BMISTZuX.js +0 -1
- package/dist/assets/useIsFocusVisible-DH0qxT5e.js +0 -1
- package/dist/assets/useMobilePicker-NPR54vgn.js +0 -6
- package/dist/assets/useMountLifecycleEffect-CjsUCFhB.js +0 -11
- package/dist/assets/useOdysseyDateFields-NlKc4Nvp.js +0 -61
- package/dist/assets/useScrollIndication-DY-bS9Bn.js +0 -31
- package/dist/assets/useSlot-D_uu6bU4.js +0 -1
- package/dist/assets/useThemeProps-BX3arxP9.js +0 -1
- package/dist/assets/useThemeProps-k7xle20R.js +0 -1
- package/dist/assets/useUniqueId-Bsgqe1tm.js +0 -11
- package/dist/assets/utilities.esm-DpQ0TZP_.js +0 -5
- package/dist/assets/utils-3Wr9v8NX.js +0 -1
- package/dist/assets/utils-iop7lDec.js +0 -1
- package/dist/assets/v4-CtRu48qb.js +0 -1
- package/dist/assets/visuallyHidden-Dan1xhjv.js +0 -1
- package/dist/cjs/ui-shell/SideNav/SideNavLogo.cjs.map +0 -1
- package/dist/esm/ui-shell/SideNav/SideNavLogo.js.map +0 -1
- package/dist/favicon.svg +0 -1
- package/dist/iframe.html +0 -748
- package/dist/index.cjs +0 -231
- package/dist/index.html +0 -203
- package/dist/index.json +0 -1
- package/dist/index.mjs +0 -229
- package/dist/index.scss +0 -549
- package/dist/nunito-sans-bold-italic.woff2 +0 -0
- package/dist/nunito-sans-bold.woff2 +0 -0
- package/dist/nunito-sans-italic.woff2 +0 -0
- package/dist/nunito-sans-regular.woff2 +0 -0
- package/dist/project.json +0 -1
- package/dist/sb-addons/a11y-3/manager-bundle.js +0 -220
- package/dist/sb-addons/docs-1/manager-bundle.js +0 -242
- package/dist/sb-addons/essentials-actions-5/manager-bundle.js +0 -3
- package/dist/sb-addons/essentials-backgrounds-6/manager-bundle.js +0 -12
- package/dist/sb-addons/essentials-controls-4/manager-bundle.js +0 -402
- package/dist/sb-addons/essentials-measure-9/manager-bundle.js +0 -3
- package/dist/sb-addons/essentials-outline-10/manager-bundle.js +0 -3
- package/dist/sb-addons/essentials-toolbars-8/manager-bundle.js +0 -3
- package/dist/sb-addons/essentials-viewport-7/manager-bundle.js +0 -3
- package/dist/sb-addons/interactions-11/manager-bundle.js +0 -222
- package/dist/sb-addons/links-2/manager-bundle.js +0 -3
- package/dist/sb-addons/rtl-12/manager-bundle.js +0 -3
- package/dist/sb-addons/storybook-13/manager-bundle.js +0 -3
- package/dist/sb-addons/storybook-core-core-server-presets-0/common-manager-bundle.js +0 -3
- package/dist/sb-common-assets/favicon.svg +0 -1
- package/dist/sb-common-assets/nunito-sans-bold-italic.woff2 +0 -0
- package/dist/sb-common-assets/nunito-sans-bold.woff2 +0 -0
- package/dist/sb-common-assets/nunito-sans-italic.woff2 +0 -0
- package/dist/sb-common-assets/nunito-sans-regular.woff2 +0 -0
- package/dist/sb-manager/globals-module-info.js +0 -1052
- package/dist/sb-manager/globals-runtime.js +0 -42127
- package/dist/sb-manager/globals.js +0 -48
- package/dist/sb-manager/runtime.js +0 -12048
- package/dist/types/ui-shell/SideNav/SideNavLogo.d.ts +0 -15
- package/dist/types/ui-shell/SideNav/SideNavLogo.d.ts.map +0 -1
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{u as t,a5 as a,h as n,O as d}from"./OdysseyThemeProvider-C4N_85M9.js";import{r as i}from"./index-NdkWRN8K.js";import{j as s}from"./jsx-runtime-CnH95YSl.js";import{P as c}from"./Paper-D4wDjY4F.js";const m=n(c,{shouldForwardProp:o=>o!=="odysseyDesignTokens"&&o!=="contrastMode"})(({contrastMode:o,odysseyDesignTokens:e})=>({border:o==="lowContrast"?`1px solid ${e.HueNeutral100}`:"none",borderRadius:e.Spacing4,boxShadow:"none",padding:e.Spacing5})),p=({children:o})=>{const e=t(),{contrastMode:r}=a();return s.jsx(m,{contrastMode:r,odysseyDesignTokens:e,children:s.jsx(d,{children:o})})},u=i.memo(p);u.displayName="Surface";export{u as M};
|
|
@@ -1,61 +0,0 @@
|
|
|
1
|
-
import{j as o}from"./jsx-runtime-CnH95YSl.js";import{w as it,u as O,e as ct}from"./index-BJMTVygn.js";import{r as s}from"./index-NdkWRN8K.js";import{a as st}from"./axeRun-B-LchFqf.js";import{O as lt}from"./OdysseyStorybookThemeDecorator-DmBIIOGu.js";import{f as m}from"./fieldComponentPropsMetaData-BqbNLw6V.js";import{K as ut,u as J,h as l,M as dt}from"./OdysseyThemeProvider-C4N_85M9.js";import{M as ht}from"./Box-BK5oZBIO.js";import{M as pt}from"./FieldHint-Mz3OdL0I.js";import{g as mt,C as bt}from"./inputUtils-Dbi8XkA6.js";import{u as ft}from"./useUniqueId-Bsgqe1tm.js";import{F as wt}from"./FormLabel-CjrKvhME.js";import{M as Ct}from"./Link-PjuOItUN.js";import"./_commonjsHelpers-gnU0ypJ3.js";import"./axe-4JP0vCEZ.js";import"./index-BJTM6NaI.js";import"./OdysseyProvider-oMWLr_-4.js";import"./Box-CTjIz0-2.js";import"./createBox-Cu6fLdzL.js";import"./FormHelperText-DQoZ2-nD.js";import"./useFormControl-BMISTZuX.js";import"./createUniqueId-ByTaVY63.js";import"./Link-D0sejjD3.js";import"./useIsFocusVisible-DH0qxT5e.js";import"./Typography-NdqIGwl5.js";import"./ExternalLink-D3z7HWdx.js";/*!
|
|
2
|
-
* Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.
|
|
3
|
-
* The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the "License.")
|
|
4
|
-
*
|
|
5
|
-
* You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
|
-
* Unless required by applicable law or agreed to in writing, software
|
|
7
|
-
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
|
|
8
|
-
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
9
|
-
*
|
|
10
|
-
* See the License for the specific language governing permissions and limitations under the License.
|
|
11
|
-
*/const kt=e=>o.jsx(Ct,{...e,variant:"default"}),Q=s.memo(kt);Q.displayName="HintLink";/*!
|
|
12
|
-
* Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.
|
|
13
|
-
* The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the "License.")
|
|
14
|
-
*
|
|
15
|
-
* You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.
|
|
16
|
-
* Unless required by applicable law or agreed to in writing, software
|
|
17
|
-
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
|
|
18
|
-
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
19
|
-
*
|
|
20
|
-
* See the License for the specific language governing permissions and limitations under the License.
|
|
21
|
-
*/const D=e=>Number(e.replace(/rem$/,"")),w=e=>e/14,{CONTROLLED:H}=bt,b=["isChecked","isDisabled","isFullWidth","isReadOnly","odysseyDesignTokens"],St=l("div",{shouldForwardProp:e=>!b.includes(e)})(({isFullWidth:e,odysseyDesignTokens:r})=>({display:"flex",alignItems:"flex-start",justifyContent:"space-between",maxWidth:e?"100%":r.TypographyLineLengthMax})),xt=l.div({position:"relative"}),gt=l(wt,{shouldForwardProp:e=>!b.includes(e)})(({isDisabled:e,isReadOnly:r,odysseyDesignTokens:a})=>({display:"block",margin:0,color:a.PaletteNeutralDark,...e&&{color:a.TypographyColorDisabled,p:{color:a.TypographyColorDisabled},a:{color:`${a.TypographyColorDisabled} !important`}},...r&&{color:a.HueNeutral700,p:{color:a.HueNeutral700},a:{color:`${a.HueNeutral700} !important`}}})),vt=l("div",{shouldForwardProp:e=>!b.includes(e)})(({isChecked:e,isDisabled:r,isReadOnly:a,odysseyDesignTokens:t})=>({position:"relative",width:t.Spacing7,height:`calc(${t.Spacing4} + ${t.Spacing1})`,borderRadius:t.BorderRadiusOuter,backgroundColor:t.HueNeutral300,transition:`background-color ${t.TransitionDurationMain}`,...r&&{backgroundColor:t.HueNeutral200},...a&&{backgroundColor:t.HueNeutral600},...e&&!r&&!a&&{backgroundColor:t.PaletteSuccessLight}})),yt=l("span",{shouldForwardProp:e=>!b.includes(e)})(({isChecked:e,isDisabled:r,isReadOnly:a,odysseyDesignTokens:t})=>{const i=w(3),c=D(t.Spacing7),u=D(t.Spacing4)-w(2),n=c-u-i*2;return{position:"absolute",top:"50%",left:`${i}rem`,width:`calc(${t.Spacing4} - ${w(2)}rem)`,height:`calc(${t.Spacing4} - ${w(2)}rem)`,borderRadius:t.BorderRadiusRound,backgroundColor:t.HueNeutralWhite,transform:"translate3d(0, -50%, 0)",transition:`transform ${t.TransitionDurationMain}`,...r&&{backgroundColor:t.HueNeutral50},...a&&{backgroundColor:t.HueNeutral400},...e&&{transform:`translate3d(${n}rem, -50%, 0)`}}}),$t=l(dt,{shouldForwardProp:e=>!b.includes(e)})(({isChecked:e,isDisabled:r,isReadOnly:a,odysseyDesignTokens:t})=>({position:"absolute",top:"50%",left:3,width:t.Spacing4,transform:"translateY(-50%)",transition:`opacity ${t.TransitionDurationMain}`,opacity:0,path:{fill:t.HueNeutralWhite},...e&&{opacity:1},...(r||a)&&{path:{fill:t.HueNeutral50}}})),Ht=l.input(({odysseyDesignTokens:e,isReadOnly:r})=>({position:"absolute",top:0,left:0,width:"100%",height:"100%",margin:0,opacity:0,cursor:r?"default":"pointer",zIndex:2,"&:focus-visible":{"~ [data-switch-track='true']":{boxShadow:`0 0 0 2px ${e.HueNeutralWhite}, 0 0 0 4px ${e.PalettePrimaryMain}`}}})),T=({hint:e,hintId:r,HintLinkComponent:a,inputId:t,isDisabled:i,label:c,isReadOnly:u})=>{const n=J();return o.jsx(o.Fragment,{children:o.jsxs(gt,{htmlFor:t,isDisabled:i,isReadOnly:u,odysseyDesignTokens:n,children:[c,e&&o.jsx(pt,{id:r,LinkComponent:a,text:e})]})})},Lt=s.memo(T);T.displayName="SwitchLabel";const Mt=({hint:e,HintLinkComponent:r,id:a,isChecked:t,isDefaultChecked:i,isDisabled:c,isFullWidth:u=!1,isReadOnly:n=!1,label:v,name:X,onChange:f,testId:Z,value:tt})=>{const{t:M}=ut(),d=J(),y=s.useRef(mt({controlledValue:t,uncontrolledValue:i})),et=s.useMemo(()=>y.current===H?{checked:t}:{defaultChecked:i},[i,t]),[h,$]=s.useState(y.current===H?!!t:!!i);s.useEffect(()=>{y.current===H&&$(!!t)},[t]);const p=ft(a),N=e?`${p}-hint`:void 0,at=`${p}-label`,rt=s.useCallback(R=>{if(n){R.preventDefault();return}const ot=R.target,{checked:j,value:nt}=ot;$(j),f==null||f({checked:j,value:nt})},[f,$,n]);return o.jsx(ht,{sx:{marginBlockEnd:d.Spacing2,"&:last-child":{marginBlockEnd:0}},children:o.jsxs(St,{isFullWidth:u,odysseyDesignTokens:d,children:[o.jsx(Lt,{hint:e,hintId:N,HintLinkComponent:r,inputId:p,isDisabled:c,isFullWidth:u,isReadOnly:n,label:v}),o.jsxs(xt,{children:[o.jsx(Ht,{...et,"aria-checked":h,"aria-describedby":N,"aria-label":h?`${v}: ${M("switch.active")}`:`${v}: ${M("switch.inactive")}`,"aria-labelledby":at,"data-se":Z,disabled:c,id:p,isReadOnly:n,name:X??p,odysseyDesignTokens:d,onChange:rt,readOnly:n,type:"checkbox",value:tt}),o.jsxs(vt,{"data-switch-track":!0,isChecked:h,isDisabled:c,isReadOnly:n,odysseyDesignTokens:d,children:[o.jsx(yt,{isChecked:h,isDisabled:c,isReadOnly:n,odysseyDesignTokens:d}),o.jsx($t,{isChecked:h,isDisabled:c,isReadOnly:n,odysseyDesignTokens:d})]})]})]})})},L=s.memo(Mt);L.displayName="Switch";const ee={component:L,decorators:[lt],tags:["autodocs"],argTypes:{isChecked:{control:"boolean",description:"If `true`, the Switch button is checked",table:{type:{summary:"boolean"}}},isDefaultChecked:{control:"boolean",description:"If `true`, the Switch button is checked by default",table:{type:{summary:"boolean"}}},hint:m.hint,HintLinkComponent:m.HintLinkComponent,id:m.id,isDisabled:m.isDisabled,isReadOnly:{control:"boolean",description:"The value attribute of the Switch",table:{type:{summary:"boolean"},defaultValue:{summary:"false"}}},label:{control:"text",description:"The label text for the Switch button",table:{type:{summary:"string"}},type:{required:!0,name:"string"}},name:m.name,value:{control:"text",description:"The value attribute of the Switch button",table:{type:{summary:"string"}},type:{required:!0,name:"string"}}},args:{hint:"Optional hint text",label:"Switch label",value:"Switch value",HintLinkComponent:o.jsx(Q,{href:"",children:"Some hint link"})}},C={play:async({canvasElement:e,step:r})=>{await r("select the switch button",async()=>{const t=it(e).getByRole("checkbox");t&&await O.click(t),await ct(t).toBeChecked(),await st("Switch Default"),await O.tab()})}},k={args:{isDisabled:!0}},S={args:{isDisabled:!0,isDefaultChecked:!0}},x={args:{isReadOnly:!0,isDefaultChecked:!0}},g={render:function({...r}){const[a,t]=s.useState(!0),i=s.useCallback(({checked:c})=>t(c),[]);return o.jsx(L,{...r,isChecked:a,onChange:i})}};var E,F,B;C.parameters={...C.parameters,docs:{...(E=C.parameters)==null?void 0:E.docs,source:{originalSource:`{
|
|
22
|
-
play: async ({
|
|
23
|
-
canvasElement,
|
|
24
|
-
step
|
|
25
|
-
}) => {
|
|
26
|
-
await step("select the switch button", async () => {
|
|
27
|
-
const canvas = within(canvasElement);
|
|
28
|
-
const switchCheckbox = canvas.getByRole("checkbox");
|
|
29
|
-
if (switchCheckbox) {
|
|
30
|
-
await userEvent.click(switchCheckbox);
|
|
31
|
-
}
|
|
32
|
-
await expect(switchCheckbox).toBeChecked();
|
|
33
|
-
await axeRun("Switch Default");
|
|
34
|
-
await userEvent.tab();
|
|
35
|
-
});
|
|
36
|
-
}
|
|
37
|
-
}`,...(B=(F=C.parameters)==null?void 0:F.docs)==null?void 0:B.source}}};var I,P,z;k.parameters={...k.parameters,docs:{...(I=k.parameters)==null?void 0:I.docs,source:{originalSource:`{
|
|
38
|
-
args: {
|
|
39
|
-
isDisabled: true
|
|
40
|
-
}
|
|
41
|
-
}`,...(z=(P=k.parameters)==null?void 0:P.docs)==null?void 0:z.source}}};var W,V,q;S.parameters={...S.parameters,docs:{...(W=S.parameters)==null?void 0:W.docs,source:{originalSource:`{
|
|
42
|
-
args: {
|
|
43
|
-
isDisabled: true,
|
|
44
|
-
isDefaultChecked: true
|
|
45
|
-
}
|
|
46
|
-
}`,...(q=(V=S.parameters)==null?void 0:V.docs)==null?void 0:q.source}}};var _,A,K;x.parameters={...x.parameters,docs:{...(_=x.parameters)==null?void 0:_.docs,source:{originalSource:`{
|
|
47
|
-
args: {
|
|
48
|
-
isReadOnly: true,
|
|
49
|
-
isDefaultChecked: true
|
|
50
|
-
}
|
|
51
|
-
}`,...(K=(A=x.parameters)==null?void 0:A.docs)==null?void 0:K.source}}};var U,Y,G;g.parameters={...g.parameters,docs:{...(U=g.parameters)==null?void 0:U.docs,source:{originalSource:`{
|
|
52
|
-
render: function C({
|
|
53
|
-
...props
|
|
54
|
-
}) {
|
|
55
|
-
const [checked, setChecked] = useState(true);
|
|
56
|
-
const onChange = useCallback<NonNullable<SwitchProps["onChange"]>>(({
|
|
57
|
-
checked
|
|
58
|
-
}) => setChecked(checked), []);
|
|
59
|
-
return <Switch {...props} isChecked={checked} onChange={onChange} />;
|
|
60
|
-
}
|
|
61
|
-
}`,...(G=(Y=g.parameters)==null?void 0:Y.docs)==null?void 0:G.source}}};const ae=["Default","Disabled","CheckedDisabled","CheckedReadOnly","Controlled"];export{S as CheckedDisabled,x as CheckedReadOnly,g as Controlled,C as Default,k as Disabled,ae as __namedExportsOrder,ee as default};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{V as W,W as V,_ as $,b as c,s as F,d as A,e as D,f as G,r as H}from"./OdysseyThemeProvider-C4N_85M9.js";import{r as J}from"./index-NdkWRN8K.js";import{u as K}from"./useFormControl-BMISTZuX.js";import{j as x}from"./jsx-runtime-CnH95YSl.js";import{u as Q}from"./useControlled-NQulfz4l.js";import{B as T}from"./ButtonBase-Lbe0_84r.js";function X(e){return W("PrivateSwitchBase",e)}V("PrivateSwitchBase",["root","checked","disabled","input","edgeStart","edgeEnd"]);const Y=["autoFocus","checked","checkedIcon","className","defaultChecked","disabled","disableFocusRipple","edge","icon","id","inputProps","inputRef","name","onBlur","onChange","onFocus","readOnly","required","tabIndex","type","value"],Z=e=>{const{classes:t,checked:d,disabled:r,edge:a}=e,l={root:["root",d&&"checked",r&&"disabled",a&&`edge${D(a)}`],input:["input"]};return G(l,X,t)},ee=F(T,{name:"MuiSwitchBase"})(({ownerState:e})=>c({padding:9,borderRadius:"50%"},e.edge==="start"&&{marginLeft:e.size==="small"?-3:-12},e.edge==="end"&&{marginRight:e.size==="small"?-3:-12})),se=F("input",{name:"MuiSwitchBase",shouldForwardProp:H})({cursor:"inherit",position:"absolute",opacity:0,width:"100%",height:"100%",top:0,left:0,margin:0,padding:0,zIndex:1}),de=J.forwardRef(function(t,d){const{autoFocus:r,checked:a,checkedIcon:l,className:w,defaultChecked:h,disabled:S,disableFocusRipple:p=!1,edge:y=!1,icon:R,id:P,inputProps:I,inputRef:v,name:j,onBlur:f,onChange:m,onFocus:g,readOnly:z,required:E=!1,tabIndex:N,type:n,value:b}=t,U=$(t,Y),[B,_]=Q({controlled:a,default:!!h,name:"SwitchBase",state:"checked"}),o=K(),L=s=>{g&&g(s),o&&o.onFocus&&o.onFocus(s)},q=s=>{f&&f(s),o&&o.onBlur&&o.onBlur(s)},M=s=>{if(s.nativeEvent.defaultPrevented)return;const C=s.target.checked;_(C),m&&m(s,C)};let i=S;o&&typeof i>"u"&&(i=o.disabled);const O=n==="checkbox"||n==="radio",u=c({},t,{checked:B,disabled:i,disableFocusRipple:p,edge:y}),k=Z(u);return x.jsxs(ee,c({component:"span",className:A(k.root,w),centerRipple:!0,focusRipple:!p,disabled:i,tabIndex:null,role:void 0,onFocus:L,onBlur:q,ownerState:u,ref:d},U,{children:[x.jsx(se,c({autoFocus:r,checked:a,defaultChecked:h,className:k.input,disabled:i,id:O?P:void 0,name:j,onChange:M,readOnly:z,ref:v,required:E,ownerState:u,tabIndex:N,type:n},n==="checkbox"&&b===void 0?{}:{value:b},I)),B?l:R]}))});export{de as S};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{r}from"./index-NdkWRN8K.js";import{j as o}from"./jsx-runtime-CnH95YSl.js";import{S as n}from"./OdysseyThemeProvider-C4N_85M9.js";const c=r.forwardRef((e,l)=>o.jsx(n,{fill:"none",ref:l,viewBox:"0 0 16 16",xmlns:"http://www.w3.org/2000/svg",...e,children:o.jsx(o.Fragment,{children:o.jsx("path",{clipRule:"evenodd",d:"M3.333 4.667h9.724L11.53 6.195l.942.943 2.29-2.29.01-.01c.057-.057.124-.124.178-.187a1 1 0 0 0 .197-.342 1 1 0 0 0 0-.618 1.006 1.006 0 0 0-.197-.342c-.054-.063-.121-.13-.177-.187l-.011-.01-2.29-2.29-.942.943 1.528 1.528H3.333a2 2 0 0 0-2 2v3.839l1.334-1.334V5.333c0-.368.298-.666.666-.666Zm10 6V8.162l1.334-1.334v3.839a2 2 0 0 1-2 2H2.943l1.528 1.528-.942.943-2.29-2.29-.01-.01a3.274 3.274 0 0 1-.178-.187 1.006 1.006 0 0 1-.197-.342 1 1 0 0 1 0-.618 1 1 0 0 1 .197-.342c.054-.063.121-.13.177-.187l.011-.01 2.29-2.29.942.943-1.528 1.528h9.724a.667.667 0 0 0 .666-.666Z",fill:"currentColor",fillRule:"evenodd"})})})),t=r.memo(c);t.displayName="SyncIcon";export{t as M};
|
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
import{j as t}from"./jsx-runtime-CnH95YSl.js";import{useMDXComponents as s}from"./index-BeeV6X6A.js";import"./index-DDAqzdZr.js";import{M as n,T as c,S as p,D as h,P as d,a as l,b as m}from"./index-c74KQyVj.js";import{T as o}from"./Tabs.stories-DYgpMtE6.js";import"./index-NdkWRN8K.js";import"./_commonjsHelpers-gnU0ypJ3.js";import"./preview-CQqyhYi4.js";import"./iframe-pzQvMjuK.js";import"./DocsRenderer-CFRXHY34-DjVgG9gc.js";import"./client-ByW5HbEz.js";import"./index-DieBXP3Z.js";import"./index-BJTM6NaI.js";import"./index-B5xazMy1.js";import"./index-CXQShRbs.js";import"./index-DrFu-skq.js";import"./index-BJMTVygn.js";import"./axeRun-B-LchFqf.js";import"./axe-4JP0vCEZ.js";import"./iconUtils-01jcyLGr.js";import"./index-BJRwoad0.js";import"./OdysseyThemeProvider-C4N_85M9.js";import"./Server-3cieqme0.js";import"./List-B7JH4gjK.js";import"./ArrowRight-BCdbWzwG.js";import"./Bug-CxccEZAh.js";import"./Calendar-DXL71nUA.js";import"./ChevronRight-SFKDVCjo.js";import"./ChevronUp-DyYSBYAc.js";import"./Clock-B6hba9Vz.js";import"./Upload-B99qcWTV.js";import"./Documentation-D-myRfum.js";import"./Download-vZ2qKd4H.js";import"./ExternalLink-D3z7HWdx.js";import"./Filter-sXa3iWrm.js";import"./Folder-DFjbrJpD.js";import"./Globe-DER_Oel8.js";import"./Grid-_Dwg3x03.js";import"./Group-D87tnFnJ.js";import"./Hide-ovxLvICH.js";import"./Home-Cn8YbOdj.js";import"./InformationCircle-CG6-PCJh.js";import"./Link-Ck99nJao.js";import"./More-DLP5TTaz.js";import"./Notification-DZN2A8i5.js";import"./Refresh-D3vISItP.js";import"./Search-BH45H3v4.js";import"./Settings-Bxzwc53G.js";import"./Show-D1oNDX9u.js";import"./Sync-MXQ8RKoq.js";import"./User-D5oZGOlm.js";import"./Video-t97PFROt.js";import"./OdysseyStorybookThemeDecorator-DmBIIOGu.js";import"./OdysseyProvider-oMWLr_-4.js";import"./Badge-DGWMi2ON.js";import"./Box-BK5oZBIO.js";import"./Box-CTjIz0-2.js";import"./createBox-Cu6fLdzL.js";import"./Tabs-Yjnd4xiR.js";import"./ButtonBase-Lbe0_84r.js";import"./useIsFocusVisible-DH0qxT5e.js";import"./assertThisInitialized-B9jnkVVz.js";import"./inheritsLoose-S-YxUaHb.js";import"./TransitionGroupContext-DAL84N7p.js";import"./utils-3Wr9v8NX.js";import"./debounce-Be36O1Ab.js";import"./ownerWindow-HkKU3E4x.js";import"./ownerDocument-DW-IO8s5.js";import"./createSvgIcon-V-Po-Ssl.js";import"./getReactElementRef-SdO7zWnC.js";import"./resolveComponentProps-D1ztx9lS.js";import"./isHostComponent-DVu5iVWx.js";import"./useThemeProps-k7xle20R.js";import"./useThemeProps-BX3arxP9.js";import"./Button-DuM2NeMY.js";import"./BaseButton-C1Nzi3yl.js";import"./MuiPropsContext-DhRylJZk.js";import"./Tooltip-ciZ4e0Eb.js";import"./Tooltip-DOwIJUHs.js";import"./Grow-D6A2VZqw.js";import"./useControlled-NQulfz4l.js";import"./Popper-9pd1Yneu.js";import"./popper-ChLFknNm.js";import"./Portal-DK2ELYoG.js";import"./Button-CbJri63v.js";function e(i){const r={a:"a",code:"code",h2:"h2",h3:"h3",li:"li",p:"p",ul:"ul",...s(),...i.components};return t.jsxs(t.Fragment,{children:[t.jsx(n,{of:o}),`
|
|
2
|
-
`,t.jsx(c,{of:o}),`
|
|
3
|
-
`,t.jsx(p,{of:o}),`
|
|
4
|
-
`,t.jsx(h,{of:o}),`
|
|
5
|
-
`,t.jsx(d,{of:o}),`
|
|
6
|
-
`,t.jsxs(r.p,{children:["A full composition includes a ",t.jsx(r.code,{children:"<Tabs>"})," component with the ",t.jsx(r.code,{children:"tabs"}),` prop set to an array of two or more objects
|
|
7
|
-
that use the following props:`]}),`
|
|
8
|
-
`,t.jsx(l,{}),`
|
|
9
|
-
`,t.jsx(m,{}),`
|
|
10
|
-
`,t.jsx(r.h2,{id:"accessibility",children:"Accessibility"}),`
|
|
11
|
-
`,t.jsx(r.h3,{id:"keyboard-support",children:"Keyboard Support"}),`
|
|
12
|
-
`,t.jsx("figure",{className:"ods-table--figure",children:t.jsxs("table",{className:"ods-table",children:[t.jsx("caption",{children:"Tabs support the following keyboard shortcuts"}),t.jsx("thead",{children:t.jsxs("tr",{children:[t.jsx("th",{scope:"column",children:"Key"}),t.jsx("th",{scope:"column",children:"Behavior"})]})}),t.jsxs("tbody",{children:[t.jsxs("tr",{children:[t.jsx("th",{scope:"row",rowSpan:"2",children:t.jsx("kbd",{children:"Tab"})}),t.jsx("td",{children:t.jsxs(r.p,{children:["When focus moves in to ",t.jsx("code",{children:"tablist"}),` the focus is placed on the
|
|
13
|
-
first `,t.jsx("code",{children:"tab"})," element."]})})]}),t.jsx("tr",{children:t.jsx("td",{children:t.jsxs(r.p,{children:[`Unlike the right arrow key, if you Tab past the last element, the Tab
|
|
14
|
-
focus continues down the page as normal. In this case, it should set
|
|
15
|
-
focus in to the active `,t.jsx("code",{children:"tabpanel"})]})})}),t.jsxs("tr",{children:[t.jsx("th",{scope:"row",children:t.jsxs(r.p,{children:[t.jsx("kbd",{children:"Space"})," or ",t.jsx("kbd",{children:"Enter"})]})}),t.jsx("td",{children:t.jsxs(r.p,{children:["When focus is placed on a Tab, the corresponding ",t.jsx("code",{children:"tabpanel"})," ",`
|
|
16
|
-
is activated/displayed.`]})})]}),t.jsxs("tr",{children:[t.jsx("th",{scope:"row",rowSpan:"2",children:t.jsx("kbd",{children:"Right Arrow"})}),t.jsx("td",{children:t.jsxs(r.p,{children:["When focus is within the ",t.jsx("code",{children:"tablist"}),` the next Tab is
|
|
17
|
-
selected.`]})})]}),t.jsx("tr",{children:t.jsx("td",{children:"If the last Tab is focused the focus is moved to the first Tab."})}),t.jsxs("tr",{children:[t.jsx("th",{scope:"row",rowSpan:"2",children:t.jsx("kbd",{children:"Left Arrow"})}),t.jsx("td",{children:t.jsxs(r.p,{children:["When focus is within the ",t.jsx("code",{children:"tablist"}),` the previous Tab is
|
|
18
|
-
selected.`]})})]}),t.jsx("tr",{children:t.jsx("td",{children:"If the first Tab is focused the focus is moved to the last Tab."})}),t.jsxs("tr",{children:[t.jsx("th",{scope:"row",children:t.jsx("kbd",{children:"Home"})}),t.jsx("td",{children:"If a Tab has focus, the focus is moved to the first Tab."})]}),t.jsxs("tr",{children:[t.jsx("th",{scope:"row",children:t.jsx("kbd",{children:"End"})}),t.jsx("td",{children:"If a Tab has focus, the focus is moved to the last Tab."})]})]})]})}),`
|
|
19
|
-
`,t.jsx(r.h2,{id:"references",children:"References"}),`
|
|
20
|
-
`,t.jsx(r.h3,{id:"further-reading",children:"Further Reading"}),`
|
|
21
|
-
`,t.jsxs(r.ul,{children:[`
|
|
22
|
-
`,t.jsx(r.li,{children:t.jsx(r.a,{href:"https://www.w3.org/TR/wai-aria-practices-1.1/#tabpanel",rel:"nofollow",children:"Tabs Design Pattern in WAI-ARIA Authoring Practices 1.1"})}),`
|
|
23
|
-
`]})]})}function qt(i={}){const{wrapper:r}={...s(),...i.components};return r?t.jsx(r,{...i,children:t.jsx(e,{...i})}):e(i)}export{qt as default};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{W as bt,V as pt,c as ht,_ as rt,b as f,d as N,s as j,e as Pt,f as vt,a as Zt,z as Lt}from"./OdysseyThemeProvider-C4N_85M9.js";import{r as d}from"./index-NdkWRN8K.js";import{j as v}from"./jsx-runtime-CnH95YSl.js";import{B as Nt}from"./ButtonBase-Lbe0_84r.js";import{u as te}from"./utils-3Wr9v8NX.js";import{d as kt}from"./debounce-Be36O1Ab.js";import{o as Ft}from"./ownerWindow-HkKU3E4x.js";import{c as At}from"./createSvgIcon-V-Po-Ssl.js";import{u as lt}from"./getReactElementRef-SdO7zWnC.js";import{u as ut}from"./inheritsLoose-S-YxUaHb.js";import{o as ee}from"./ownerDocument-DW-IO8s5.js";let U;function $t(){if(U)return U;const t=document.createElement("div"),e=document.createElement("div");return e.style.width="10px",e.style.height="1px",t.appendChild(e),t.dir="rtl",t.style.fontSize="14px",t.style.width="4px",t.style.height="1px",t.style.position="absolute",t.style.top="-1000px",t.style.overflow="scroll",document.body.appendChild(t),U="reverse",t.scrollLeft>0?U="default":(t.scrollLeft=1,t.scrollLeft===0&&(U="negative")),document.body.removeChild(t),U}function oe(t,e){const r=t.scrollLeft;if(e!=="rtl")return r;switch($t()){case"negative":return t.scrollWidth-t.clientWidth+r;case"reverse":return t.scrollWidth-t.clientWidth-r;default:return r}}function le(t){return pt("MuiTab",t)}const L=bt("MuiTab",["root","labelIcon","textColorInherit","textColorPrimary","textColorSecondary","selected","disabled","fullWidth","wrapped","iconWrapper"]),re=["className","disabled","disableFocusRipple","fullWidth","icon","iconPosition","indicator","label","onChange","onClick","onFocus","selected","selectionFollowsFocus","textColor","value","wrapped"],ne=t=>{const{classes:e,textColor:r,fullWidth:i,wrapped:s,icon:c,label:h,selected:p,disabled:u}=t,x={root:["root",c&&h&&"labelIcon",`textColor${Pt(r)}`,i&&"fullWidth",s&&"wrapped",p&&"selected",u&&"disabled"],iconWrapper:["iconWrapper"]};return vt(x,le,e)},se=j(Nt,{name:"MuiTab",slot:"Root",overridesResolver:(t,e)=>{const{ownerState:r}=t;return[e.root,r.label&&r.icon&&e.labelIcon,e[`textColor${Pt(r.textColor)}`],r.fullWidth&&e.fullWidth,r.wrapped&&e.wrapped,{[`& .${L.iconWrapper}`]:e.iconWrapper}]}})(({theme:t,ownerState:e})=>f({},t.typography.button,{maxWidth:360,minWidth:90,position:"relative",minHeight:48,flexShrink:0,padding:"12px 16px",overflow:"hidden",whiteSpace:"normal",textAlign:"center"},e.label&&{flexDirection:e.iconPosition==="top"||e.iconPosition==="bottom"?"column":"row"},{lineHeight:1.25},e.icon&&e.label&&{minHeight:72,paddingTop:9,paddingBottom:9,[`& > .${L.iconWrapper}`]:f({},e.iconPosition==="top"&&{marginBottom:6},e.iconPosition==="bottom"&&{marginTop:6},e.iconPosition==="start"&&{marginRight:t.spacing(1)},e.iconPosition==="end"&&{marginLeft:t.spacing(1)})},e.textColor==="inherit"&&{color:"inherit",opacity:.6,[`&.${L.selected}`]:{opacity:1},[`&.${L.disabled}`]:{opacity:(t.vars||t).palette.action.disabledOpacity}},e.textColor==="primary"&&{color:(t.vars||t).palette.text.secondary,[`&.${L.selected}`]:{color:(t.vars||t).palette.primary.main},[`&.${L.disabled}`]:{color:(t.vars||t).palette.text.disabled}},e.textColor==="secondary"&&{color:(t.vars||t).palette.text.secondary,[`&.${L.selected}`]:{color:(t.vars||t).palette.secondary.main},[`&.${L.disabled}`]:{color:(t.vars||t).palette.text.disabled}},e.fullWidth&&{flexShrink:1,flexGrow:1,flexBasis:0,maxWidth:"none"},e.wrapped&&{fontSize:t.typography.pxToRem(12)})),Oe=d.forwardRef(function(e,r){const i=ht({props:e,name:"MuiTab"}),{className:s,disabled:c=!1,disableFocusRipple:h=!1,fullWidth:p,icon:u,iconPosition:x="top",indicator:C,label:y,onChange:m,onClick:w,onFocus:k,selected:I,selectionFollowsFocus:g,textColor:H="inherit",value:M,wrapped:nt=!1}=i,D=rt(i,re),Y=f({},i,{disabled:c,disableFocusRipple:h,selected:I,icon:!!u,iconPosition:x,label:!!y,fullWidth:p,textColor:H,wrapped:nt}),X=ne(Y),F=u&&y&&d.isValidElement(u)?d.cloneElement(u,{className:N(X.iconWrapper,u.props.className)}):u,J=R=>{!I&&m&&m(R,M),w&&w(R)},_=R=>{g&&!I&&m&&m(R,M),k&&k(R)};return v.jsxs(se,f({focusRipple:!h,className:N(X.root,s),ref:r,role:"tab","aria-selected":I,disabled:c,onClick:J,onFocus:_,ownerState:Y,tabIndex:I?0:-1},D,{children:[x==="top"||x==="start"?v.jsxs(d.Fragment,{children:[F,y]}):v.jsxs(d.Fragment,{children:[y,F]}),C]}))}),ie=At(v.jsx("path",{d:"M15.41 16.09l-4.58-4.59 4.58-4.59L14 5.5l-6 6 6 6z"}),"KeyboardArrowLeft"),ae=At(v.jsx("path",{d:"M8.59 16.34l4.58-4.59-4.58-4.59L10 5.75l6 6-6 6z"}),"KeyboardArrowRight");function ce(t){return(1+Math.sin(Math.PI*t-Math.PI/2))/2}function de(t,e,r,i={},s=()=>{}){const{ease:c=ce,duration:h=300}=i;let p=null;const u=e[t];let x=!1;const C=()=>{x=!0},y=m=>{if(x){s(new Error("Animation cancelled"));return}p===null&&(p=m);const w=Math.min(1,(m-p)/h);if(e[t]=c(w)*(r-u)+u,w>=1){requestAnimationFrame(()=>{s(null)});return}requestAnimationFrame(y)};return u===r?(s(new Error("Element already at target position")),C):(requestAnimationFrame(y),C)}const ue=["onChange"],fe={width:99,height:99,position:"absolute",top:-9999,overflow:"scroll"};function be(t){const{onChange:e}=t,r=rt(t,ue),i=d.useRef(),s=d.useRef(null),c=()=>{i.current=s.current.offsetHeight-s.current.clientHeight};return Zt(()=>{const h=kt(()=>{const u=i.current;c(),u!==i.current&&e(i.current)}),p=Ft(s.current);return p.addEventListener("resize",h),()=>{h.clear(),p.removeEventListener("resize",h)}},[e]),d.useEffect(()=>{c(),e(i.current)},[e]),v.jsx("div",f({style:fe},r,{ref:s}))}function pe(t){return pt("MuiTabScrollButton",t)}const he=bt("MuiTabScrollButton",["root","vertical","horizontal","disabled"]),ve=["className","slots","slotProps","direction","orientation","disabled"],me=t=>{const{classes:e,orientation:r,disabled:i}=t;return vt({root:["root",r,i&&"disabled"]},pe,e)},Se=j(Nt,{name:"MuiTabScrollButton",slot:"Root",overridesResolver:(t,e)=>{const{ownerState:r}=t;return[e.root,r.orientation&&e[r.orientation]]}})(({ownerState:t})=>f({width:40,flexShrink:0,opacity:.8,[`&.${he.disabled}`]:{opacity:0}},t.orientation==="vertical"&&{width:"100%",height:40,"& svg":{transform:`rotate(${t.isRtl?-90:90}deg)`}})),xe=d.forwardRef(function(e,r){var i,s;const c=ht({props:e,name:"MuiTabScrollButton"}),{className:h,slots:p={},slotProps:u={},direction:x}=c,C=rt(c,ve),y=Lt(),m=f({isRtl:y},c),w=me(m),k=(i=p.StartScrollButtonIcon)!=null?i:ie,I=(s=p.EndScrollButtonIcon)!=null?s:ae,g=lt({elementType:k,externalSlotProps:u.startScrollButtonIcon,additionalProps:{fontSize:"small"},ownerState:m}),H=lt({elementType:I,externalSlotProps:u.endScrollButtonIcon,additionalProps:{fontSize:"small"},ownerState:m});return v.jsx(Se,f({component:"div",className:N(w.root,h),ref:r,role:null,ownerState:m,tabIndex:null},C,{children:x==="left"?v.jsx(k,f({},g)):v.jsx(I,f({},H))}))});function ge(t){return pt("MuiTabs",t)}const ft=bt("MuiTabs",["root","vertical","flexContainer","flexContainerVertical","centered","scroller","fixed","scrollableX","scrollableY","hideScrollbar","scrollButtons","scrollButtonsHideMobile","indicator"]),ye=["aria-label","aria-labelledby","action","centered","children","className","component","allowScrollButtonsMobile","indicatorColor","onChange","orientation","ScrollButtonComponent","scrollButtons","selectionFollowsFocus","slots","slotProps","TabIndicatorProps","TabScrollButtonProps","textColor","value","variant","visibleScrollbar"],Rt=(t,e)=>t===e?t.firstChild:e&&e.nextElementSibling?e.nextElementSibling:t.firstChild,Wt=(t,e)=>t===e?t.lastChild:e&&e.previousElementSibling?e.previousElementSibling:t.lastChild,ot=(t,e,r)=>{let i=!1,s=r(t,e);for(;s;){if(s===t.firstChild){if(i)return;i=!0}const c=s.disabled||s.getAttribute("aria-disabled")==="true";if(!s.hasAttribute("tabindex")||c)s=r(t,s);else{s.focus();return}}},Be=t=>{const{vertical:e,fixed:r,hideScrollbar:i,scrollableX:s,scrollableY:c,centered:h,scrollButtonsHideMobile:p,classes:u}=t;return vt({root:["root",e&&"vertical"],scroller:["scroller",r&&"fixed",i&&"hideScrollbar",s&&"scrollableX",c&&"scrollableY"],flexContainer:["flexContainer",e&&"flexContainerVertical",h&&"centered"],indicator:["indicator"],scrollButtons:["scrollButtons",p&&"scrollButtonsHideMobile"],scrollableX:[s&&"scrollableX"],hideScrollbar:[i&&"hideScrollbar"]},ge,u)},Ce=j("div",{name:"MuiTabs",slot:"Root",overridesResolver:(t,e)=>{const{ownerState:r}=t;return[{[`& .${ft.scrollButtons}`]:e.scrollButtons},{[`& .${ft.scrollButtons}`]:r.scrollButtonsHideMobile&&e.scrollButtonsHideMobile},e.root,r.vertical&&e.vertical]}})(({ownerState:t,theme:e})=>f({overflow:"hidden",minHeight:48,WebkitOverflowScrolling:"touch",display:"flex"},t.vertical&&{flexDirection:"column"},t.scrollButtonsHideMobile&&{[`& .${ft.scrollButtons}`]:{[e.breakpoints.down("sm")]:{display:"none"}}})),we=j("div",{name:"MuiTabs",slot:"Scroller",overridesResolver:(t,e)=>{const{ownerState:r}=t;return[e.scroller,r.fixed&&e.fixed,r.hideScrollbar&&e.hideScrollbar,r.scrollableX&&e.scrollableX,r.scrollableY&&e.scrollableY]}})(({ownerState:t})=>f({position:"relative",display:"inline-block",flex:"1 1 auto",whiteSpace:"nowrap"},t.fixed&&{overflowX:"hidden",width:"100%"},t.hideScrollbar&&{scrollbarWidth:"none","&::-webkit-scrollbar":{display:"none"}},t.scrollableX&&{overflowX:"auto",overflowY:"hidden"},t.scrollableY&&{overflowY:"auto",overflowX:"hidden"})),Ie=j("div",{name:"MuiTabs",slot:"FlexContainer",overridesResolver:(t,e)=>{const{ownerState:r}=t;return[e.flexContainer,r.vertical&&e.flexContainerVertical,r.centered&&e.centered]}})(({ownerState:t})=>f({display:"flex"},t.vertical&&{flexDirection:"column"},t.centered&&{justifyContent:"center"})),Te=j("span",{name:"MuiTabs",slot:"Indicator",overridesResolver:(t,e)=>e.indicator})(({ownerState:t,theme:e})=>f({position:"absolute",height:2,bottom:0,width:"100%",transition:e.transitions.create()},t.indicatorColor==="primary"&&{backgroundColor:(e.vars||e).palette.primary.main},t.indicatorColor==="secondary"&&{backgroundColor:(e.vars||e).palette.secondary.main},t.vertical&&{height:"100%",width:2,right:0})),Ee=j(be)({overflowX:"auto",overflowY:"hidden",scrollbarWidth:"none","&::-webkit-scrollbar":{display:"none"}}),zt={},je=d.forwardRef(function(e,r){const i=ht({props:e,name:"MuiTabs"}),s=te(),c=Lt(),{"aria-label":h,"aria-labelledby":p,action:u,centered:x=!1,children:C,className:y,component:m="div",allowScrollButtonsMobile:w=!1,indicatorColor:k="primary",onChange:I,orientation:g="horizontal",ScrollButtonComponent:H=xe,scrollButtons:M="auto",selectionFollowsFocus:nt,slots:D={},slotProps:Y={},TabIndicatorProps:X={},TabScrollButtonProps:F={},textColor:J="primary",value:_,variant:R="standard",visibleScrollbar:st=!1}=i,Ot=rt(i,ye),T=R==="scrollable",B=g==="vertical",V=B?"scrollTop":"scrollLeft",Q=B?"top":"left",Z=B?"bottom":"right",it=B?"clientHeight":"clientWidth",K=B?"height":"width",A=f({},i,{component:m,allowScrollButtonsMobile:w,indicatorColor:k,orientation:g,vertical:B,scrollButtons:M,textColor:J,variant:R,visibleScrollbar:st,fixed:!T,hideScrollbar:T&&!st,scrollableX:T&&!B,scrollableY:T&&B,centered:x&&!T,scrollButtonsHideMobile:!w}),z=Be(A),jt=lt({elementType:D.StartScrollButtonIcon,externalSlotProps:Y.startScrollButtonIcon,ownerState:A}),Ht=lt({elementType:D.EndScrollButtonIcon,externalSlotProps:Y.endScrollButtonIcon,ownerState:A}),[mt,Dt]=d.useState(!1),[$,St]=d.useState(zt),[xt,Xt]=d.useState(!1),[gt,_t]=d.useState(!1),[yt,Ut]=d.useState(!1),[Bt,Yt]=d.useState({overflow:"hidden",scrollbarWidth:0}),Ct=new Map,W=d.useRef(null),O=d.useRef(null),wt=()=>{const o=W.current;let l;if(o){const n=o.getBoundingClientRect();l={clientWidth:o.clientWidth,scrollLeft:o.scrollLeft,scrollTop:o.scrollTop,scrollLeftNormalized:oe(o,c?"rtl":"ltr"),scrollWidth:o.scrollWidth,top:n.top,bottom:n.bottom,left:n.left,right:n.right}}let a;if(o&&_!==!1){const n=O.current.children;if(n.length>0){const b=n[Ct.get(_)];a=b?b.getBoundingClientRect():null}}return{tabsMeta:l,tabMeta:a}},q=ut(()=>{const{tabsMeta:o,tabMeta:l}=wt();let a=0,n;if(B)n="top",l&&o&&(a=l.top-o.top+o.scrollTop);else if(n=c?"right":"left",l&&o){const S=c?o.scrollLeftNormalized+o.clientWidth-o.scrollWidth:o.scrollLeft;a=(c?-1:1)*(l[n]-o[n]+S)}const b={[n]:a,[K]:l?l[K]:0};if(isNaN($[n])||isNaN($[K]))St(b);else{const S=Math.abs($[n]-b[n]),E=Math.abs($[K]-b[K]);(S>=1||E>=1)&&St(b)}}),at=(o,{animation:l=!0}={})=>{l?de(V,W.current,o,{duration:s.transitions.duration.standard}):W.current[V]=o},It=o=>{let l=W.current[V];B?l+=o:(l+=o*(c?-1:1),l*=c&&$t()==="reverse"?-1:1),at(l)},Tt=()=>{const o=W.current[it];let l=0;const a=Array.from(O.current.children);for(let n=0;n<a.length;n+=1){const b=a[n];if(l+b[it]>o){n===0&&(l=o);break}l+=b[it]}return l},Vt=()=>{It(-1*Tt())},Kt=()=>{It(Tt())},qt=d.useCallback(o=>{Yt({overflow:null,scrollbarWidth:o})},[]),Gt=()=>{const o={};o.scrollbarSizeListener=T?v.jsx(Ee,{onChange:qt,className:N(z.scrollableX,z.hideScrollbar)}):null;const a=T&&(M==="auto"&&(xt||gt)||M===!0);return o.scrollButtonStart=a?v.jsx(H,f({slots:{StartScrollButtonIcon:D.StartScrollButtonIcon},slotProps:{startScrollButtonIcon:jt},orientation:g,direction:c?"right":"left",onClick:Vt,disabled:!xt},F,{className:N(z.scrollButtons,F.className)})):null,o.scrollButtonEnd=a?v.jsx(H,f({slots:{EndScrollButtonIcon:D.EndScrollButtonIcon},slotProps:{endScrollButtonIcon:Ht},orientation:g,direction:c?"left":"right",onClick:Kt,disabled:!gt},F,{className:N(z.scrollButtons,F.className)})):null,o},Et=ut(o=>{const{tabsMeta:l,tabMeta:a}=wt();if(!(!a||!l)){if(a[Q]<l[Q]){const n=l[V]+(a[Q]-l[Q]);at(n,{animation:o})}else if(a[Z]>l[Z]){const n=l[V]+(a[Z]-l[Z]);at(n,{animation:o})}}}),tt=ut(()=>{T&&M!==!1&&Ut(!yt)});d.useEffect(()=>{const o=kt(()=>{W.current&&q()});let l;const a=S=>{S.forEach(E=>{E.removedNodes.forEach(G=>{var P;(P=l)==null||P.unobserve(G)}),E.addedNodes.forEach(G=>{var P;(P=l)==null||P.observe(G)})}),o(),tt()},n=Ft(W.current);n.addEventListener("resize",o);let b;return typeof ResizeObserver<"u"&&(l=new ResizeObserver(o),Array.from(O.current.children).forEach(S=>{l.observe(S)})),typeof MutationObserver<"u"&&(b=new MutationObserver(a),b.observe(O.current,{childList:!0})),()=>{var S,E;o.clear(),n.removeEventListener("resize",o),(S=b)==null||S.disconnect(),(E=l)==null||E.disconnect()}},[q,tt]),d.useEffect(()=>{const o=Array.from(O.current.children),l=o.length;if(typeof IntersectionObserver<"u"&&l>0&&T&&M!==!1){const a=o[0],n=o[l-1],b={root:W.current,threshold:.99},S=dt=>{Xt(!dt[0].isIntersecting)},E=new IntersectionObserver(S,b);E.observe(a);const G=dt=>{_t(!dt[0].isIntersecting)},P=new IntersectionObserver(G,b);return P.observe(n),()=>{E.disconnect(),P.disconnect()}}},[T,M,yt,C==null?void 0:C.length]),d.useEffect(()=>{Dt(!0)},[]),d.useEffect(()=>{q()}),d.useEffect(()=>{Et(zt!==$)},[Et,$]),d.useImperativeHandle(u,()=>({updateIndicator:q,updateScrollButtons:tt}),[q,tt]);const Mt=v.jsx(Te,f({},X,{className:N(z.indicator,X.className),ownerState:A,style:f({},$,X.style)}));let et=0;const Jt=d.Children.map(C,o=>{if(!d.isValidElement(o))return null;const l=o.props.value===void 0?et:o.props.value;Ct.set(l,et);const a=l===_;return et+=1,d.cloneElement(o,f({fullWidth:R==="fullWidth",indicator:a&&!mt&&Mt,selected:a,selectionFollowsFocus:nt,onChange:I,textColor:J,value:l},et===1&&_===!1&&!o.props.tabIndex?{tabIndex:0}:{}))}),Qt=o=>{const l=O.current,a=ee(l).activeElement;if(a.getAttribute("role")!=="tab")return;let b=g==="horizontal"?"ArrowLeft":"ArrowUp",S=g==="horizontal"?"ArrowRight":"ArrowDown";switch(g==="horizontal"&&c&&(b="ArrowRight",S="ArrowLeft"),o.key){case b:o.preventDefault(),ot(l,a,Wt);break;case S:o.preventDefault(),ot(l,a,Rt);break;case"Home":o.preventDefault(),ot(l,null,Rt);break;case"End":o.preventDefault(),ot(l,null,Wt);break}},ct=Gt();return v.jsxs(Ce,f({className:N(z.root,y),ownerState:A,ref:r,as:m},Ot,{children:[ct.scrollButtonStart,ct.scrollbarSizeListener,v.jsxs(we,{className:z.scroller,ownerState:A,style:{overflow:Bt.overflow,[B?`margin${c?"Left":"Right"}`:"marginBottom"]:st?void 0:-Bt.scrollbarWidth},ref:W,children:[v.jsx(Ie,{"aria-label":h,"aria-labelledby":p,"aria-orientation":g==="vertical"?"vertical":null,className:z.flexContainer,ownerState:A,onKeyDown:Qt,ref:O,role:"tablist",children:Jt}),mt&&Mt]}),ct.scrollButtonEnd]}))});export{je as T,Oe as a,ft as t};
|
|
@@ -1,100 +0,0 @@
|
|
|
1
|
-
import{j as t}from"./jsx-runtime-CnH95YSl.js";import{a as le,w as re,u as D,e as ie}from"./index-BJMTVygn.js";import{r as s}from"./index-NdkWRN8K.js";import{a as ce}from"./axeRun-B-LchFqf.js";import{i as E}from"./iconUtils-01jcyLGr.js";import{O as ue}from"./OdysseyStorybookThemeDecorator-DmBIIOGu.js";import{M as me,b as P}from"./Badge-DGWMi2ON.js";import{M as J}from"./Box-BK5oZBIO.js";import{_ as K,b as j,V as de,W as be,s as pe,d as fe,f as he,u as xe}from"./OdysseyThemeProvider-C4N_85M9.js";import{T as Te,a as ye}from"./Tabs-Yjnd4xiR.js";import{u as ve}from"./useThemeProps-k7xle20R.js";import{M as Ce}from"./Button-DuM2NeMY.js";import{M as ge}from"./Bug-CxccEZAh.js";const Q=s.createContext(null);function Me(){const[a,e]=s.useState(null);return s.useEffect(()=>{e(`mui-p-${Math.round(Math.random()*1e5)}`)},[]),a}function Ie(a){const{children:e,value:n}=a,o=Me(),l=s.useMemo(()=>({idPrefix:o,value:n}),[o,n]);return t.jsx(Q.Provider,{value:l,children:e})}function Y(){return s.useContext(Q)}function Z(a,e){const{idPrefix:n}=a;return n===null?null:`${a.idPrefix}-P-${e}`}function ee(a,e){const{idPrefix:n}=a;return n===null?null:`${a.idPrefix}-T-${e}`}const we=["children"],je=s.forwardRef(function(e,n){const{children:o}=e,l=K(e,we),i=Y();if(i===null)throw new TypeError("No TabContext provided");const u=s.Children.map(o,m=>s.isValidElement(m)?s.cloneElement(m,{"aria-controls":Z(i,m.props.value),id:ee(i,m.props.value)}):null);return t.jsx(Te,j({},l,{ref:n,value:i.value,children:u}))});function Se(a){return de("MuiTabPanel",a)}be("MuiTabPanel",["root"]);const De=["children","className","value"],Ee=a=>{const{classes:e}=a;return he({root:["root"]},Se,e)},Pe=pe("div",{name:"MuiTabPanel",slot:"Root",overridesResolver:(a,e)=>e.root})(({theme:a})=>({padding:a.spacing(3)})),Be=s.forwardRef(function(e,n){const o=ve({props:e,name:"MuiTabPanel"}),{children:l,className:i,value:u}=o,m=K(o,De),C=j({},o),w=Ee(C),d=Y();if(d===null)throw new TypeError("No TabContext provided");const r=Z(d,u),c=ee(d,u);return t.jsx(Pe,j({"aria-labelledby":c,className:fe(w.root,i),hidden:u!==d.value,id:r,ref:n,role:"tabpanel",ownerState:C},m,{children:u===d.value&&l}))}),Xe=({label:a,notificationCount:e,notificationCountMax:n,tabState:o,value:l})=>{const i=xe();return t.jsxs(t.Fragment,{children:[a,e!==void 0&&e>0&&t.jsx(J,{sx:{marginInlineStart:e?i.Spacing2:0},children:t.jsx(me,{badgeContent:e,badgeContentMax:n,type:l===o?"attention":"default"})})]})},_e=({ariaLabel:a,initialValue:e,tabs:n,value:o,onChange:l})=>{const[i,u]=s.useState(e??o??"0"),[m,C]=s.useState(!1),w=s.useCallback((r,c)=>{u(c),l==null||l(r,c)},[l]);s.useEffect(()=>{o!==void 0&&u(o)},[o]),s.useEffect(()=>{let r;const c=()=>{cancelAnimationFrame(r),document.removeEventListener("visibilitychange",g)};function g(){r=requestAnimationFrame(()=>{c(),C("auto")})}return m!=="auto"&&document.addEventListener("visibilitychange",g),()=>{c()}},[m]);const d=s.useCallback((r,c)=>{const{testId:g,isDisabled:ae,label:ne,startIcon:te,value:b,notificationCount:oe,notificationCountMax:se}=r;return t.jsx(ye,{"data-se":g,disabled:ae,icon:te,label:t.jsx(Xe,{label:ne,notificationCount:oe,notificationCountMax:se,tabState:i,value:b}),tabIndex:0,value:b||c.toString()},b||c.toString())},[i]);return t.jsxs(Ie,{value:i,children:[t.jsx(je,{"aria-label":a,onChange:w,scrollButtons:m,variant:"scrollable",children:n.map((r,c)=>d(r,c))}),n.map((r,c)=>t.jsx(Be,{value:r.value?r.value:c.toString(),children:r.children},r.value?r.value:c.toString()))]})},M=s.memo(_e);M.displayName="Tabs";const ke={component:M,decorators:[ue],argTypes:{children:{control:"text",description:"The content of the tab item",table:{type:{summary:"ReactNode"}},type:{required:!0,name:"string"}},startIcon:{control:{type:"select"},options:Object.keys(E),mapping:E,description:"An optional icon to display at the start of the tab item",table:{type:{summary:"<Icon />"}}},label:{control:"text",description:"The label text for the tab item",table:{type:{summary:"string"}},type:{required:!0,name:"string"}},isDisabled:{control:"boolean",description:"If `true`, the tab item is disabled",table:{type:{summary:"boolean"},defaultValue:{summary:"false"}}},value:{control:"text",description:"The value associated with the tab item",table:{type:{summary:"string"}}},onChange:{description:"Callback fired when the active tab is changed",table:{type:{summary:"func"}}},notificationCount:{control:{type:"number"},description:"The value associated with the Badge",table:{type:{summary:"number"}}},notificationCountMax:{control:{type:"select"},options:P,description:"The limit at which the badge will show `{notificationCountMax} +`. Can be increments of 10, up to 100",table:{type:{summary:P.join("|")},defaultValue:{summary:"10"}},type:{required:!1,name:"number"}}},args:{children:"This is the tab content. This tab happens to be about stars.",notificationCountMax:10,label:"Stars",value:"stars"}},I=({canvasElement:a,step:e})=>async(n,o)=>{await e(`select the ${o} tab`,async()=>{await ce(n),await le(async()=>{const l=re(a),i=l.getByText(o);await D.click(i),await D.tab();const u=l.getByText(`Information about ${o}`);ie(u).toBeInTheDocument()})})},v={render:function(e){const n=[{label:"Planets",value:"planets",children:"Information about Planets"},{label:"Moons",value:"moons",children:"Information about Moons"}];return e!=null&&e.label&&n.push({notificationCount:e==null?void 0:e.notificationCount,notificationCountMax:e==null?void 0:e.notificationCountMax,label:e.label,value:e.value,isDisabled:e.isDisabled,startIcon:e.startIcon,children:e.children}),t.jsx(M,{ariaLabel:"basic tabs example",initialValue:"planets",tabs:n})}},S=({label:a})=>t.jsxs(t.Fragment,{children:["Information about ",a]}),p={...v,play:async({canvasElement:a,step:e})=>{await I({canvasElement:a,step:e})("Tab Default","Moons")}},f={...v,args:{isDisabled:!0,label:"Disabled Tab",children:"Tab is disabled"},play:async({canvasElement:a,step:e})=>{await I({canvasElement:a,step:e})("Tab Disabled","Moons")}},h={...v,args:{startIcon:t.jsx(ge,{}),label:"Xenomorphs",children:t.jsx(S,{label:"Xenomorphs"})},play:async({canvasElement:a,step:e})=>{await I({canvasElement:a,step:e})("Tab Icon","Xenomorphs")}},x={render:function(){const[e,n]=s.useState("planets"),o=(i,u)=>{n(u)},l=[{label:"Planets",value:"planets",children:"Information about Planets"},{label:"Moons",value:"moons",children:"Information about Moons"},{label:"Galaxies",value:"galaxies",children:"Information about Galaxies"}];return t.jsxs(t.Fragment,{children:[t.jsx(M,{ariaLabel:"controlled tabs example",onChange:o,tabs:l,value:e}),t.jsx(J,{sx:{marginTop:4},children:t.jsx(Ce,{label:"Navigate to Galaxies",onClick:()=>{n("galaxies")},size:"small",variant:"primary"})})]})}},T={...v,args:{notificationCount:1,label:"Xenomorphs",value:"xenomorphs",children:t.jsx(S,{label:"Xenomorphs"})},play:async({canvasElement:a,step:e})=>{await I({canvasElement:a,step:e})("Tab Icon","Xenomorphs")}},y={...v,args:{notificationCount:101,notificationCountMax:100,label:"Xenomorphs",value:"xenomorphs",children:t.jsx(S,{label:"Xenomorphs"})}};var B,X,_;p.parameters={...p.parameters,docs:{...(B=p.parameters)==null?void 0:B.docs,source:{originalSource:`{
|
|
2
|
-
...DefaultTemplate,
|
|
3
|
-
play: async ({
|
|
4
|
-
canvasElement,
|
|
5
|
-
step
|
|
6
|
-
}) => {
|
|
7
|
-
await selectTab({
|
|
8
|
-
canvasElement,
|
|
9
|
-
step
|
|
10
|
-
})("Tab Default", "Moons");
|
|
11
|
-
}
|
|
12
|
-
}`,...(_=(X=p.parameters)==null?void 0:X.docs)==null?void 0:_.source}}};var k,V,L;f.parameters={...f.parameters,docs:{...(k=f.parameters)==null?void 0:k.docs,source:{originalSource:`{
|
|
13
|
-
...DefaultTemplate,
|
|
14
|
-
args: {
|
|
15
|
-
isDisabled: true,
|
|
16
|
-
label: "Disabled Tab",
|
|
17
|
-
children: "Tab is disabled"
|
|
18
|
-
},
|
|
19
|
-
play: async ({
|
|
20
|
-
canvasElement,
|
|
21
|
-
step
|
|
22
|
-
}) => {
|
|
23
|
-
await selectTab({
|
|
24
|
-
canvasElement,
|
|
25
|
-
step
|
|
26
|
-
})("Tab Disabled", "Moons");
|
|
27
|
-
}
|
|
28
|
-
}`,...(L=(V=f.parameters)==null?void 0:V.docs)==null?void 0:L.source}}};var $,z,R;h.parameters={...h.parameters,docs:{...($=h.parameters)==null?void 0:$.docs,source:{originalSource:`{
|
|
29
|
-
...DefaultTemplate,
|
|
30
|
-
args: {
|
|
31
|
-
startIcon: <BugIcon />,
|
|
32
|
-
label: "Xenomorphs",
|
|
33
|
-
children: <ExampleTabContent label="Xenomorphs" />
|
|
34
|
-
},
|
|
35
|
-
play: async ({
|
|
36
|
-
canvasElement,
|
|
37
|
-
step
|
|
38
|
-
}) => {
|
|
39
|
-
await selectTab({
|
|
40
|
-
canvasElement,
|
|
41
|
-
step
|
|
42
|
-
})("Tab Icon", "Xenomorphs");
|
|
43
|
-
}
|
|
44
|
-
}`,...(R=(z=h.parameters)==null?void 0:z.docs)==null?void 0:R.source}}};var F,N,O;x.parameters={...x.parameters,docs:{...(F=x.parameters)==null?void 0:F.docs,source:{originalSource:`{
|
|
45
|
-
render: function C() {
|
|
46
|
-
const [value, setValue] = useState("planets");
|
|
47
|
-
const onChange: TabsProps["onChange"] = (_e: unknown, value: string) => {
|
|
48
|
-
setValue(value);
|
|
49
|
-
};
|
|
50
|
-
const tabs: TabItemProps[] = [{
|
|
51
|
-
label: "Planets",
|
|
52
|
-
value: "planets",
|
|
53
|
-
children: "Information about Planets"
|
|
54
|
-
}, {
|
|
55
|
-
label: "Moons",
|
|
56
|
-
value: "moons",
|
|
57
|
-
children: "Information about Moons"
|
|
58
|
-
}, {
|
|
59
|
-
label: "Galaxies",
|
|
60
|
-
value: "galaxies",
|
|
61
|
-
children: "Information about Galaxies"
|
|
62
|
-
}];
|
|
63
|
-
return <>
|
|
64
|
-
<Tabs ariaLabel="controlled tabs example" onChange={onChange} tabs={tabs} value={value} />
|
|
65
|
-
<Box sx={{
|
|
66
|
-
marginTop: 4
|
|
67
|
-
}}>
|
|
68
|
-
<Button label="Navigate to Galaxies" onClick={() => {
|
|
69
|
-
setValue("galaxies");
|
|
70
|
-
}} size="small" variant="primary" />
|
|
71
|
-
</Box>
|
|
72
|
-
</>;
|
|
73
|
-
}
|
|
74
|
-
}`,...(O=(N=x.parameters)==null?void 0:N.docs)==null?void 0:O.source}}};var G,q,U;T.parameters={...T.parameters,docs:{...(G=T.parameters)==null?void 0:G.docs,source:{originalSource:`{
|
|
75
|
-
...DefaultTemplate,
|
|
76
|
-
args: {
|
|
77
|
-
notificationCount: 1,
|
|
78
|
-
label: "Xenomorphs",
|
|
79
|
-
value: "xenomorphs",
|
|
80
|
-
children: <ExampleTabContent label="Xenomorphs" />
|
|
81
|
-
},
|
|
82
|
-
play: async ({
|
|
83
|
-
canvasElement,
|
|
84
|
-
step
|
|
85
|
-
}) => {
|
|
86
|
-
await selectTab({
|
|
87
|
-
canvasElement,
|
|
88
|
-
step
|
|
89
|
-
})("Tab Icon", "Xenomorphs");
|
|
90
|
-
}
|
|
91
|
-
}`,...(U=(q=T.parameters)==null?void 0:q.docs)==null?void 0:U.source}}};var W,A,H;y.parameters={...y.parameters,docs:{...(W=y.parameters)==null?void 0:W.docs,source:{originalSource:`{
|
|
92
|
-
...DefaultTemplate,
|
|
93
|
-
args: {
|
|
94
|
-
notificationCount: 101,
|
|
95
|
-
notificationCountMax: 100,
|
|
96
|
-
label: "Xenomorphs",
|
|
97
|
-
value: "xenomorphs",
|
|
98
|
-
children: <ExampleTabContent label="Xenomorphs" />
|
|
99
|
-
}
|
|
100
|
-
}`,...(H=(A=y.parameters)==null?void 0:A.docs)==null?void 0:H.source}}};const Ve=["Default","Disabled","Icons","Controlled","WithBadge","CountMax"],Je=Object.freeze(Object.defineProperty({__proto__:null,Controlled:x,CountMax:y,Default:p,Disabled:f,Icons:h,WithBadge:T,__namedExportsOrder:Ve,default:ke},Symbol.toStringTag,{value:"Module"}));export{Je as T};
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import{K as w,u as i,a5 as I,h as F,L as B}from"./OdysseyThemeProvider-C4N_85M9.js";import{r as a}from"./index-NdkWRN8K.js";import{M as O}from"./MuiPropsContext-DhRylJZk.js";import{j as H}from"./jsx-runtime-CnH95YSl.js";import{C as N}from"./Chip-M3FRYspe.js";/*!
|
|
2
|
-
* Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.
|
|
3
|
-
* The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the "License.")
|
|
4
|
-
*
|
|
5
|
-
* You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
|
-
* Unless required by applicable law or agreed to in writing, software
|
|
7
|
-
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
|
|
8
|
-
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
9
|
-
*
|
|
10
|
-
* See the License for the specific language governing permissions and limitations under the License.
|
|
11
|
-
*/const n=a.createContext({chipElementType:"div"}),f=({colorVariant:u,contrastMode:c,odysseyDesignTokens:t})=>{const r={default:{...c==="highContrast"&&{background:t.HueNeutral200,text:t.HueNeutral700,textDisabled:t.HueNeutral400},...c==="lowContrast"&&{background:t.HueNeutral100,text:t.HueNeutral700,textDisabled:t.HueNeutral300},hover:t.HueNeutral200,active:t.HueNeutral300,border:t.HueNeutral200,deleteIcon:t.HueNeutral500,deleteIconHover:t.HueNeutral700,icon:t.HueNeutral700,iconDisabled:t.HueNeutral300},info:{...c==="highContrast"&&{background:t.HueBlue200,text:t.HueBlue700,textDisabled:t.HueBlue400},...c==="lowContrast"&&{background:t.HueBlue100,text:t.HueBlue700,textDisabled:t.HueBlue300},hover:t.HueBlue200,active:t.HueBlue300,border:t.HueBlue200,deleteIcon:t.HueBlue500,deleteIconHover:t.HueBlue700,icon:t.HueBlue700,iconDisabled:t.HueBlue300},accentOne:{...c==="highContrast"&&{background:t.HueAccentOne200,text:t.HueAccentOne700,textDisabled:t.HueAccentOne400},...c==="lowContrast"&&{background:t.HueAccentOne100,text:t.HueAccentOne700,textDisabled:t.HueAccentOne300},hover:t.HueAccentOne200,active:t.HueAccentOne300,border:t.HueAccentOne200,deleteIcon:t.HueAccentOne500,deleteIconHover:t.HueAccentOne700,icon:t.HueAccentOne700,iconDisabled:t.HueAccentOne300},accentTwo:{...c==="highContrast"&&{background:t.HueAccentTwo200,text:t.HueAccentTwo800,textDisabled:t.HueAccentTwo400},...c==="lowContrast"&&{background:t.HueAccentTwo100,text:t.HueAccentTwo700,textDisabled:t.HueAccentTwo300},hover:t.HueAccentTwo200,active:t.HueAccentTwo300,border:t.HueAccentTwo200,deleteIcon:t.HueAccentTwo500,deleteIconHover:t.HueAccentTwo700,icon:t.HueAccentTwo700,iconDisabled:t.HueAccentTwo300},accentThree:{...c==="highContrast"&&{background:t.HueAccentThree200,text:t.HueAccentThree700,textDisabled:t.HueAccentThree400},...c==="lowContrast"&&{background:t.HueAccentThree100,text:t.HueAccentThree700,textDisabled:t.HueAccentThree300},hover:t.HueAccentThree200,active:t.HueAccentThree300,border:t.HueAccentThree200,deleteIcon:t.HueAccentThree500,deleteIconHover:t.HueAccentThree700,icon:t.HueAccentThree700,iconDisabled:t.HueAccentThree300},accentFour:{...c==="highContrast"&&{background:t.HueAccentFour200,text:t.HueAccentFour700,textDisabled:t.HueAccentFour400},...c==="lowContrast"&&{background:t.HueAccentFour100,text:t.HueAccentFour700,textDisabled:t.HueAccentFour300},hover:t.HueAccentFour200,active:t.HueAccentFour300,border:t.HueAccentFour200,deleteIcon:t.HueAccentFour500,deleteIconHover:t.HueAccentFour700,icon:t.HueAccentFour700,iconDisabled:t.HueAccentFour300}};return r[u]||r.default},d=F(N,{shouldForwardProp:u=>!["colorVariant","contrastMode","odysseyDesignTokens","size"].includes(u)})(({colorVariant:u,contrastMode:c,odysseyDesignTokens:t,clickable:r,size:l})=>{const e=f({colorVariant:u,odysseyDesignTokens:t,contrastMode:c});return{backgroundColor:e.background,color:e.text,...r===!0&&{borderColor:e.border},...r===!1&&{borderColor:"transparent"},...l==="small"&&{paddingBlock:`calc(${t.Spacing1})`},"&.MuiChip-clickable:hover":{backgroundColor:e.hover},"&.MuiChip-clickable:active":{backgroundColor:e.active},"&.Mui-disabled":{color:e.textDisabled,borderColor:e.border,"& .MuiChip-icon, & .MuiChip-deleteIcon":{color:e.iconDisabled}},"& .MuiChip-icon":{color:e.icon},"& .MuiChip-deleteIcon":{color:e.deleteIcon,"&:hover":{color:e.deleteIconHover}}}}),j=({colorVariant:u="default",icon:c,isDisabled:t,label:r,onClick:l,onRemove:e,size:A="medium",testId:b,translate:h})=>{const{t:x}=w(),o=i(),{chipElementType:C}=a.useContext(n),{contrastMode:p}=I(),v=a.useCallback(m=>H.jsx(d,{...m,"aria-disabled":t,as:C,clickable:!!l,colorVariant:u,contrastMode:p,"data-se":b,deleteIcon:H.jsx(B,{role:"button",titleAccess:x("tag.remove")}),disabled:t,icon:c,label:r,odysseyDesignTokens:o,onClick:l,onDelete:e,size:A,translate:h}),[x,C,u,p,c,t,r,o,l,e,A,b,h]);return H.jsx(O.Consumer,{children:v})},M=a.memo(j);M.displayName="Tag";export{M,n as T};
|
|
@@ -1,96 +0,0 @@
|
|
|
1
|
-
import{j as a}from"./jsx-runtime-CnH95YSl.js";import{f as sa,w as na,u as T,e as ta}from"./index-BJMTVygn.js";import{a as oa}from"./axeRun-B-LchFqf.js";import{i as S}from"./iconUtils-01jcyLGr.js";import{O as ca}from"./OdysseyStorybookThemeDecorator-DmBIIOGu.js";import{M as e}from"./Tag-DCZngwHs.js";import{M as ia}from"./TagList-BvQLms1L.js";import{M as la}from"./Group-D87tnFnJ.js";import"./index-NdkWRN8K.js";import"./_commonjsHelpers-gnU0ypJ3.js";import"./axe-4JP0vCEZ.js";import"./index-BJRwoad0.js";import"./OdysseyThemeProvider-C4N_85M9.js";import"./Server-3cieqme0.js";import"./List-B7JH4gjK.js";import"./ArrowRight-BCdbWzwG.js";import"./Bug-CxccEZAh.js";import"./Calendar-DXL71nUA.js";import"./ChevronRight-SFKDVCjo.js";import"./ChevronUp-DyYSBYAc.js";import"./Clock-B6hba9Vz.js";import"./Upload-B99qcWTV.js";import"./Documentation-D-myRfum.js";import"./Download-vZ2qKd4H.js";import"./ExternalLink-D3z7HWdx.js";import"./Filter-sXa3iWrm.js";import"./Folder-DFjbrJpD.js";import"./Globe-DER_Oel8.js";import"./Grid-_Dwg3x03.js";import"./Hide-ovxLvICH.js";import"./Home-Cn8YbOdj.js";import"./InformationCircle-CG6-PCJh.js";import"./Link-Ck99nJao.js";import"./More-DLP5TTaz.js";import"./Notification-DZN2A8i5.js";import"./Refresh-D3vISItP.js";import"./Search-BH45H3v4.js";import"./Settings-Bxzwc53G.js";import"./Show-D1oNDX9u.js";import"./Sync-MXQ8RKoq.js";import"./User-D5oZGOlm.js";import"./Video-t97PFROt.js";import"./index-BJTM6NaI.js";import"./OdysseyProvider-oMWLr_-4.js";import"./MuiPropsContext-DhRylJZk.js";import"./Chip-M3FRYspe.js";import"./createSvgIcon-V-Po-Ssl.js";import"./useIsFocusVisible-DH0qxT5e.js";import"./ButtonBase-Lbe0_84r.js";import"./assertThisInitialized-B9jnkVVz.js";import"./inheritsLoose-S-YxUaHb.js";import"./TransitionGroupContext-DAL84N7p.js";import"./Stack-Dyzg8njm.js";import"./createStyled-CcazfAPj.js";import"./useThemeProps-BX3arxP9.js";const pe={component:e,decorators:[ca],parameters:{actions:{argTypesRegex:null}},tags:["autodocs"],argTypes:{icon:{control:{type:"select"},options:Object.keys(S),mapping:S,description:"An optional icon to display alongside the label",table:{type:{summary:"<Icon />"}}},isDisabled:{control:"boolean",description:"If `true`, the tag is disabled",table:{type:{summary:"boolean"},defaultValue:{summary:"false"}}},label:{control:"text",description:"The label text for the tag",table:{type:{summary:"string"}},type:{required:!0,name:"string"}},onClick:{control:"object",action:!0,description:"Callback fired when the tag is clicked",table:{type:{summary:"func"}}},onRemove:{control:"object",action:!0,description:"Callback fired when the remove button of the tag is clicked",table:{type:{summary:"func"}}},colorVariant:{control:{type:"select"},options:["default","info","accentOne","accentTwo","accentThree","accentFour"],description:"The color of the tag",table:{type:{summary:"string"},defaultValue:{summary:"default"}}},size:{control:{type:"select"},options:["default","small"],description:"The size of the tag",table:{type:{summary:"string"},defaultValue:{summary:"default"}}}},args:{label:"Starship",colorVariant:"default",onClick:sa(),size:"medium"}},n={args:{label:"Starship"}},c={args:{label:"Starship",colorVariant:"info"}},i={args:{label:"Starship",colorVariant:"accentOne"}},l={args:{label:"Starship",colorVariant:"accentTwo"}},m={args:{label:"Starship",colorVariant:"accentThree"}},p={args:{label:"Starship",colorVariant:"accentFour"}},u={render:function(t){return a.jsxs(ia,{children:[a.jsx(e,{label:t.label}),a.jsx(e,{colorVariant:"info",label:"Info tag"}),a.jsx(e,{colorVariant:"accentOne",label:"AccentOne tag"}),a.jsx(e,{colorVariant:"accentTwo",label:"AccentTwo tag"}),a.jsx(e,{colorVariant:"accentThree",label:"AccentThree tag"}),a.jsx(e,{colorVariant:"accentFour",label:"AccentFour tag"})]})},args:{label:"Default tag"}},g={args:{label:"Starship",size:"small"}},d={args:{label:"Crew",icon:a.jsx(la,{})}},b={args:{label:"Starship"},play:async({args:r,canvasElement:t,step:y})=>{await y("click the tag",async()=>{const s=na(t).getByText(r.label);await T.click(s),ta(r.onClick).toHaveBeenCalledTimes(1),await oa("Clickable Tag")})}},h={args:{label:"Starship"},play:async({args:r,canvasElement:t,step:y})=>{await y("remove the tag on click",async()=>{const o=t.querySelector('[role="button"]'),s=o==null?void 0:o.querySelector("svg");s&&(await T.click(s),await T.tab(),await ta(r.onRemove).toHaveBeenCalled()),await oa("Removable Tag")})}},f={args:{label:"Starship",isDisabled:!0}};var v,w,V;n.parameters={...n.parameters,docs:{...(v=n.parameters)==null?void 0:v.docs,source:{originalSource:`{
|
|
2
|
-
args: {
|
|
3
|
-
label: "Starship"
|
|
4
|
-
}
|
|
5
|
-
}`,...(V=(w=n.parameters)==null?void 0:w.docs)==null?void 0:V.source}}};var x,k,C;c.parameters={...c.parameters,docs:{...(x=c.parameters)==null?void 0:x.docs,source:{originalSource:`{
|
|
6
|
-
args: {
|
|
7
|
-
label: "Starship",
|
|
8
|
-
colorVariant: "info"
|
|
9
|
-
}
|
|
10
|
-
}`,...(C=(k=c.parameters)==null?void 0:k.docs)==null?void 0:C.source}}};var A,I,j;i.parameters={...i.parameters,docs:{...(A=i.parameters)==null?void 0:A.docs,source:{originalSource:`{
|
|
11
|
-
args: {
|
|
12
|
-
label: "Starship",
|
|
13
|
-
colorVariant: "accentOne"
|
|
14
|
-
}
|
|
15
|
-
}`,...(j=(I=i.parameters)==null?void 0:I.docs)==null?void 0:j.source}}};var O,R,E;l.parameters={...l.parameters,docs:{...(O=l.parameters)==null?void 0:O.docs,source:{originalSource:`{
|
|
16
|
-
args: {
|
|
17
|
-
label: "Starship",
|
|
18
|
-
colorVariant: "accentTwo"
|
|
19
|
-
}
|
|
20
|
-
}`,...(E=(R=l.parameters)==null?void 0:R.docs)==null?void 0:E.source}}};var D,F,z;m.parameters={...m.parameters,docs:{...(D=m.parameters)==null?void 0:D.docs,source:{originalSource:`{
|
|
21
|
-
args: {
|
|
22
|
-
label: "Starship",
|
|
23
|
-
colorVariant: "accentThree"
|
|
24
|
-
}
|
|
25
|
-
}`,...(z=(F=m.parameters)==null?void 0:F.docs)==null?void 0:z.source}}};var B,M,q;p.parameters={...p.parameters,docs:{...(B=p.parameters)==null?void 0:B.docs,source:{originalSource:`{
|
|
26
|
-
args: {
|
|
27
|
-
label: "Starship",
|
|
28
|
-
colorVariant: "accentFour"
|
|
29
|
-
}
|
|
30
|
-
}`,...(q=(M=p.parameters)==null?void 0:M.docs)==null?void 0:q.source}}};var L,H,G;u.parameters={...u.parameters,docs:{...(L=u.parameters)==null?void 0:L.docs,source:{originalSource:`{
|
|
31
|
-
render: function C(args) {
|
|
32
|
-
return <TagList>
|
|
33
|
-
<Tag label={args.label} />
|
|
34
|
-
<Tag colorVariant="info" label="Info tag" />
|
|
35
|
-
<Tag colorVariant="accentOne" label="AccentOne tag" />
|
|
36
|
-
<Tag colorVariant="accentTwo" label="AccentTwo tag" />
|
|
37
|
-
<Tag colorVariant="accentThree" label="AccentThree tag" />
|
|
38
|
-
<Tag colorVariant="accentFour" label="AccentFour tag" />
|
|
39
|
-
</TagList>;
|
|
40
|
-
},
|
|
41
|
-
args: {
|
|
42
|
-
label: "Default tag"
|
|
43
|
-
}
|
|
44
|
-
}`,...(G=(H=u.parameters)==null?void 0:H.docs)==null?void 0:G.source}}};var _,J,K;g.parameters={...g.parameters,docs:{...(_=g.parameters)==null?void 0:_.docs,source:{originalSource:`{
|
|
45
|
-
args: {
|
|
46
|
-
label: "Starship",
|
|
47
|
-
size: "small"
|
|
48
|
-
}
|
|
49
|
-
}`,...(K=(J=g.parameters)==null?void 0:J.docs)==null?void 0:K.source}}};var N,P,Q;d.parameters={...d.parameters,docs:{...(N=d.parameters)==null?void 0:N.docs,source:{originalSource:`{
|
|
50
|
-
args: {
|
|
51
|
-
label: "Crew",
|
|
52
|
-
icon: <GroupIcon />
|
|
53
|
-
}
|
|
54
|
-
}`,...(Q=(P=d.parameters)==null?void 0:P.docs)==null?void 0:Q.source}}};var U,W,X;b.parameters={...b.parameters,docs:{...(U=b.parameters)==null?void 0:U.docs,source:{originalSource:`{
|
|
55
|
-
args: {
|
|
56
|
-
label: "Starship"
|
|
57
|
-
},
|
|
58
|
-
play: async ({
|
|
59
|
-
args,
|
|
60
|
-
canvasElement,
|
|
61
|
-
step
|
|
62
|
-
}) => {
|
|
63
|
-
await step("click the tag", async () => {
|
|
64
|
-
const canvas = within(canvasElement);
|
|
65
|
-
const tag = canvas.getByText(args.label);
|
|
66
|
-
await userEvent.click(tag);
|
|
67
|
-
expect(args.onClick).toHaveBeenCalledTimes(1);
|
|
68
|
-
await axeRun("Clickable Tag");
|
|
69
|
-
});
|
|
70
|
-
}
|
|
71
|
-
}`,...(X=(W=b.parameters)==null?void 0:W.docs)==null?void 0:X.source}}};var Y,Z,$;h.parameters={...h.parameters,docs:{...(Y=h.parameters)==null?void 0:Y.docs,source:{originalSource:`{
|
|
72
|
-
args: {
|
|
73
|
-
label: "Starship"
|
|
74
|
-
},
|
|
75
|
-
play: async ({
|
|
76
|
-
args,
|
|
77
|
-
canvasElement,
|
|
78
|
-
step
|
|
79
|
-
}) => {
|
|
80
|
-
await step("remove the tag on click", async () => {
|
|
81
|
-
const tagElement = canvasElement.querySelector('[role="button"]');
|
|
82
|
-
const removeIcon = tagElement?.querySelector("svg");
|
|
83
|
-
if (removeIcon) {
|
|
84
|
-
await userEvent.click(removeIcon);
|
|
85
|
-
await userEvent.tab();
|
|
86
|
-
await expect(args.onRemove).toHaveBeenCalled();
|
|
87
|
-
}
|
|
88
|
-
await axeRun("Removable Tag");
|
|
89
|
-
});
|
|
90
|
-
}
|
|
91
|
-
}`,...($=(Z=h.parameters)==null?void 0:Z.docs)==null?void 0:$.source}}};var aa,ea,ra;f.parameters={...f.parameters,docs:{...(aa=f.parameters)==null?void 0:aa.docs,source:{originalSource:`{
|
|
92
|
-
args: {
|
|
93
|
-
label: "Starship",
|
|
94
|
-
isDisabled: true
|
|
95
|
-
}
|
|
96
|
-
}`,...(ra=(ea=f.parameters)==null?void 0:ea.docs)==null?void 0:ra.source}}};const ue=["Default","Info","AccentOne","AccentTwo","AccentThree","AccentFour","List","Small","Icon","Clickable","Removable","Disabled"];export{p as AccentFour,i as AccentOne,m as AccentThree,l as AccentTwo,b as Clickable,n as Default,f as Disabled,d as Icon,c as Info,u as List,h as Removable,g as Small,ue as __namedExportsOrder,pe as default};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{r}from"./index-NdkWRN8K.js";import{T as a}from"./Tag-DCZngwHs.js";import{j as e}from"./jsx-runtime-CnH95YSl.js";import{S as i}from"./Stack-Dyzg8njm.js";const m=({children:t,testId:o})=>{const s=r.useMemo(()=>({chipElementType:"li"}),[]);return e.jsx(i,{component:"ul","data-se":o,direction:"row",flexWrap:"wrap",spacing:2,useFlexGap:!0,children:e.jsx(a.Provider,{value:s,children:t})})},p=r.memo(m);p.displayName="TagList";export{p as M};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{r as e}from"./index-NdkWRN8K.js";import{M as G}from"./Field-QbF6sK2K.js";import{g as J,u as K}from"./inputUtils-Dbi8XkA6.js";import{j as a}from"./jsx-runtime-CnH95YSl.js";import{I as Q}from"./InputBase-DSyP23zj.js";import{I as T}from"./InputAdornment-CVIbzdDI.js";const P=["email","number","tel","text","url"],U=e.forwardRef(({ariaDescribedBy:k,autoCompleteType:n,defaultValue:u,hasInitialFocus:m,endAdornment:l,errorMessage:L,errorMessageList:S,hint:h,HintLinkComponent:z,id:B,inputRef:D,inputMode:d,isDisabled:E=!1,isFullWidth:H=!1,isMultiline:c=!1,isOptional:o=!1,isReadOnly:f,label:q,name:p,onBlur:x,onChange:s,onFocus:b,placeholder:F,startAdornment:i,testId:j,translate:r,type:R="text",value:y},I)=>{const w=e.useRef(J({controlledValue:y,uncontrolledValue:u})),V=K({defaultValue:u,value:y,controlState:w.current}),g=e.useRef(null);e.useImperativeHandle(D,()=>({focus:()=>{var t;(t=g.current)==null||t.focus()}}),[]);const C=e.useCallback(t=>{s==null||s(t)},[s]),N=e.useCallback(({ariaDescribedBy:t,errorMessageElementId:W,id:M,labelElementId:v})=>a.jsx(Q,{...V,"aria-describedby":t,autoComplete:n,autoFocus:m,endAdornment:l&&a.jsx(T,{position:"end",translate:r,children:l}),id:M,inputProps:{"aria-errormessage":W,"aria-labelledby":v,"data-se":j,inputMode:d},inputRef:g,multiline:c,name:p??M,onBlur:x,onChange:C,onFocus:b,placeholder:F,readOnly:f,ref:I,required:!o,startAdornment:i&&a.jsx(T,{position:"start",translate:r,children:i}),translate:r,type:R}),[n,V,m,l,d,c,p,x,C,b,F,o,f,I,i,j,r,R]);return a.jsx(G,{ariaDescribedBy:k,errorMessage:L,errorMessageList:S,fieldType:"single",hasVisibleLabel:!0,hint:h,HintLinkComponent:z,id:B,isDisabled:E,isFullWidth:H,isOptional:o,label:q,renderFieldComponent:N})}),X=e.memo(U);X.displayName="TextField";export{X as M,P as t};
|
|
@@ -1,149 +0,0 @@
|
|
|
1
|
-
import{j as v}from"./jsx-runtime-CnH95YSl.js";import{f as w,w as Te,u as r,e as C}from"./index-BJMTVygn.js";import{r as S}from"./index-NdkWRN8K.js";import{O as we}from"./OdysseyStorybookThemeDecorator-DmBIIOGu.js";import{f as e}from"./fieldComponentPropsMetaData-BqbNLw6V.js";import{t as E,M as be}from"./TextField-DUdvP48K.js";import{M as Ce}from"./Link-PjuOItUN.js";import{I as ve}from"./InputAdornment-CVIbzdDI.js";import"./_commonjsHelpers-gnU0ypJ3.js";import"./OdysseyThemeProvider-C4N_85M9.js";import"./index-BJTM6NaI.js";import"./OdysseyProvider-oMWLr_-4.js";import"./Field-QbF6sK2K.js";import"./Box-BK5oZBIO.js";import"./Box-CTjIz0-2.js";import"./createBox-Cu6fLdzL.js";import"./List-BSidosAy.js";import"./ListItem-DB9pwEx3.js";import"./utils-iop7lDec.js";import"./useFormControl-BMISTZuX.js";import"./FormLabel-CjrKvhME.js";import"./useIsFocusVisible-DH0qxT5e.js";import"./isHostComponent-DVu5iVWx.js";import"./ButtonBase-Lbe0_84r.js";import"./assertThisInitialized-B9jnkVVz.js";import"./inheritsLoose-S-YxUaHb.js";import"./TransitionGroupContext-DAL84N7p.js";import"./ScreenReaderText-DrkvjfUf.js";import"./visuallyHidden-Dan1xhjv.js";import"./FormHelperText-DQoZ2-nD.js";import"./FieldHint-Mz3OdL0I.js";import"./Typography-C4vClHaZ.js";import"./Typography-NdqIGwl5.js";import"./useUniqueId-Bsgqe1tm.js";import"./createUniqueId-ByTaVY63.js";import"./inputUtils-Dbi8XkA6.js";import"./InputBase-DSyP23zj.js";import"./ownerWindow-HkKU3E4x.js";import"./ownerDocument-DW-IO8s5.js";import"./debounce-Be36O1Ab.js";import"./Link-D0sejjD3.js";import"./ExternalLink-D3z7HWdx.js";const ut={component:be,decorators:[we],tags:["autodocs"],argTypes:{autoCompleteType:{control:"text",description:"This prop helps users to fill forms faster, especially on mobile devices. You can learn more about it [following the specification](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill)",table:{type:{summary:"string"}}},defaultValue:{control:"text",description:"The value of the `input` element. Use when the component is not controlled",table:{type:{summary:"string"},defaultValue:{summary:void 0}}},endAdornment:{control:"text",description:"End `InputAdornment` for this component",table:{type:{summary:"string | ReactElement<typeof Icon>"}}},errorMessage:e.errorMessage,errorMessageList:e.errorMessageList,hasInitialFocus:{control:"boolean",description:"If `true`, the component will receive focus automatically",table:{type:{summary:"boolean"}}},hint:e.hint,HintLinkComponent:e.HintLinkComponent,id:e.id,isDisabled:e.isDisabled,isFullWidth:e.isFullWidth,isMultiline:{control:"boolean",description:"If `true`, a TextareaAutosize element is rendered",table:{type:{summary:"boolean"},defaultValue:{summary:"false"}}},isOptional:e.isOptional,isReadOnly:e.isReadOnly,label:{control:"text",description:"The label for the `input` element",table:{type:{summary:"string"}},type:{required:!0,name:"string"}},name:e.name,onBlur:{description:"Callback fired when the `input` element loses focus",table:{type:{summary:"func"}}},onChange:{description:"Callback fired when the value is changed",table:{type:{summary:"func"}}},onFocus:{description:"Callback fired when the `input` element gets focus",table:{type:{summary:"func"}}},placeholder:{control:"text",description:"The short hint displayed in the `input` before the user enters a value",table:{type:{summary:"string"}}},startAdornment:{control:"text",description:"Start `InputAdornment` for this component",table:{type:{summary:"string | ReactElement<typeof Icon>"}}},type:{options:E,control:{type:"radio"},description:"Type of the `input` element. It should be [a valid HTML5 input type](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Form_%3Cinput%3E_types)",table:{type:{summary:E.join(" | ")},defaultValue:{summary:"text"}}},value:{control:"text",description:"The value of the `input` element, required for a controlled component",table:{type:{summary:"string"}}}},args:{defaultValue:void 0,label:"Destination",onBlur:w(),onChange:w(),onFocus:w()}},n={args:{defaultValue:""},play:async({args:a,canvasElement:x,step:T})=>{await T("Textfield callback",async()=>{const t=Te(x).getByRole("textbox");await r.click(t),await C(a.onFocus).toHaveBeenCalledTimes(1),await r.type(t,"Earth"),await C(a.onChange).toHaveBeenCalledTimes(5),await r.clear(t),await r.tab(),await C(a.onBlur).toHaveBeenCalledTimes(1)})}},o={parameters:{docs:{description:{story:"The values of disabled inputs will not be submitted."}}},args:{isDisabled:!0,defaultValue:"Earth"}},s={args:{isOptional:!0,defaultValue:""}},i={parameters:{docs:{description:{story:"The values of readonly inputs will be submitted."}}},args:{isReadOnly:!0,value:"Earth"}},l={args:{errorMessage:"This field is required.",defaultValue:""}},p={args:{errorMessage:"This field is required:",errorMessageList:["At least 2 chars","No more than 20 chars"],defaultValue:""}},c={args:{isFullWidth:!0}},m={args:{hint:"Specify your destination within the Sol system.",defaultValue:""}},u={args:{hint:"Specify your destination within the Sol system. Learn more",HintLinkComponent:v.jsx(Ce,{href:"/learn-more",children:"about the Sol system"}),defaultValue:""}},d={parameters:{docs:{description:{story:"TextField supports both `string` and `<Icon />` adornments."}}},args:{label:"Cargo weight",endAdornment:v.jsx(ve,{position:"end",children:"kg"}),defaultValue:""}},h={args:{autoCompleteType:"work email",label:"Company email",type:"email",defaultValue:""}},y={parameters:{docs:{description:{story:"As the user types, the field will grow vertically to accommodate the new lines."}}},args:{autoCompleteType:"shipping street-address",label:"Permanent residence",isMultiline:!0,defaultValue:""},name:"Multiline (Textarea)"},g={args:{placeholder:"Destination within the Sol system"}},f={parameters:{docs:{description:{story:"TextFields of type `tel` are not automatically validated because global formats are so varied."}}},args:{autoCompleteType:"mobile tel",label:"Phone number",startAdornment:v.jsx(ve,{position:"start",children:"+1"}),type:"tel",defaultValue:""}},b={parameters:{docs:{description:{story:"When the component is controlled, the parent component is responsible for passing `value` to the component and listening for changes with `onChange`"}}},args:{value:"Initial state"},render:function({...x}){const[T,V]=S.useState("Initial state"),t=S.useCallback(xe=>V(xe.target.value),[]);return v.jsx(be,{...x,onChange:t,value:T})}};var M,L,k;n.parameters={...n.parameters,docs:{...(M=n.parameters)==null?void 0:M.docs,source:{originalSource:`{
|
|
2
|
-
args: {
|
|
3
|
-
defaultValue: ""
|
|
4
|
-
},
|
|
5
|
-
play: async ({
|
|
6
|
-
args,
|
|
7
|
-
canvasElement,
|
|
8
|
-
step
|
|
9
|
-
}) => {
|
|
10
|
-
await step("Textfield callback", async () => {
|
|
11
|
-
const canvas = within(canvasElement);
|
|
12
|
-
const textbox = canvas.getByRole("textbox");
|
|
13
|
-
await userEvent.click(textbox);
|
|
14
|
-
await expect(args.onFocus).toHaveBeenCalledTimes(1);
|
|
15
|
-
await userEvent.type(textbox, "Earth");
|
|
16
|
-
await expect(args.onChange).toHaveBeenCalledTimes(5);
|
|
17
|
-
await userEvent.clear(textbox);
|
|
18
|
-
await userEvent.tab();
|
|
19
|
-
await expect(args.onBlur).toHaveBeenCalledTimes(1);
|
|
20
|
-
});
|
|
21
|
-
}
|
|
22
|
-
}`,...(k=(L=n.parameters)==null?void 0:L.docs)==null?void 0:k.source}}};var A,F,I;o.parameters={...o.parameters,docs:{...(A=o.parameters)==null?void 0:A.docs,source:{originalSource:`{
|
|
23
|
-
parameters: {
|
|
24
|
-
docs: {
|
|
25
|
-
description: {
|
|
26
|
-
story: "The values of disabled inputs will not be submitted."
|
|
27
|
-
}
|
|
28
|
-
}
|
|
29
|
-
},
|
|
30
|
-
args: {
|
|
31
|
-
isDisabled: true,
|
|
32
|
-
defaultValue: "Earth"
|
|
33
|
-
}
|
|
34
|
-
}`,...(I=(F=o.parameters)==null?void 0:F.docs)==null?void 0:I.source}}};var H,O,D;s.parameters={...s.parameters,docs:{...(H=s.parameters)==null?void 0:H.docs,source:{originalSource:`{
|
|
35
|
-
args: {
|
|
36
|
-
isOptional: true,
|
|
37
|
-
defaultValue: ""
|
|
38
|
-
}
|
|
39
|
-
}`,...(D=(O=s.parameters)==null?void 0:O.docs)==null?void 0:D.source}}};var B,R,W;i.parameters={...i.parameters,docs:{...(B=i.parameters)==null?void 0:B.docs,source:{originalSource:`{
|
|
40
|
-
parameters: {
|
|
41
|
-
docs: {
|
|
42
|
-
description: {
|
|
43
|
-
story: "The values of readonly inputs will be submitted."
|
|
44
|
-
}
|
|
45
|
-
}
|
|
46
|
-
},
|
|
47
|
-
args: {
|
|
48
|
-
isReadOnly: true,
|
|
49
|
-
value: "Earth"
|
|
50
|
-
}
|
|
51
|
-
}`,...(W=(R=i.parameters)==null?void 0:R.docs)==null?void 0:W.source}}};var j,P,q;l.parameters={...l.parameters,docs:{...(j=l.parameters)==null?void 0:j.docs,source:{originalSource:`{
|
|
52
|
-
args: {
|
|
53
|
-
errorMessage: "This field is required.",
|
|
54
|
-
defaultValue: ""
|
|
55
|
-
}
|
|
56
|
-
}`,...(q=(P=l.parameters)==null?void 0:P.docs)==null?void 0:q.source}}};var z,_,N;p.parameters={...p.parameters,docs:{...(z=p.parameters)==null?void 0:z.docs,source:{originalSource:`{
|
|
57
|
-
args: {
|
|
58
|
-
errorMessage: "This field is required:",
|
|
59
|
-
errorMessageList: ["At least 2 chars", "No more than 20 chars"],
|
|
60
|
-
defaultValue: ""
|
|
61
|
-
}
|
|
62
|
-
}`,...(N=(_=p.parameters)==null?void 0:_.docs)==null?void 0:N.source}}};var U,Y,G;c.parameters={...c.parameters,docs:{...(U=c.parameters)==null?void 0:U.docs,source:{originalSource:`{
|
|
63
|
-
args: {
|
|
64
|
-
isFullWidth: true
|
|
65
|
-
}
|
|
66
|
-
}`,...(G=(Y=c.parameters)==null?void 0:Y.docs)==null?void 0:G.source}}};var J,K,Q;m.parameters={...m.parameters,docs:{...(J=m.parameters)==null?void 0:J.docs,source:{originalSource:`{
|
|
67
|
-
args: {
|
|
68
|
-
hint: "Specify your destination within the Sol system.",
|
|
69
|
-
defaultValue: ""
|
|
70
|
-
}
|
|
71
|
-
}`,...(Q=(K=m.parameters)==null?void 0:K.docs)==null?void 0:Q.source}}};var X,Z,$;u.parameters={...u.parameters,docs:{...(X=u.parameters)==null?void 0:X.docs,source:{originalSource:`{
|
|
72
|
-
args: {
|
|
73
|
-
hint: "Specify your destination within the Sol system. Learn more",
|
|
74
|
-
HintLinkComponent: <Link href="/learn-more">about the Sol system</Link>,
|
|
75
|
-
defaultValue: ""
|
|
76
|
-
}
|
|
77
|
-
}`,...($=(Z=u.parameters)==null?void 0:Z.docs)==null?void 0:$.source}}};var ee,te,ae;d.parameters={...d.parameters,docs:{...(ee=d.parameters)==null?void 0:ee.docs,source:{originalSource:`{
|
|
78
|
-
parameters: {
|
|
79
|
-
docs: {
|
|
80
|
-
description: {
|
|
81
|
-
story: "TextField supports both \`string\` and \`<Icon />\` adornments."
|
|
82
|
-
}
|
|
83
|
-
}
|
|
84
|
-
},
|
|
85
|
-
args: {
|
|
86
|
-
label: "Cargo weight",
|
|
87
|
-
endAdornment: <InputAdornment position="end">kg</InputAdornment>,
|
|
88
|
-
defaultValue: ""
|
|
89
|
-
}
|
|
90
|
-
}`,...(ae=(te=d.parameters)==null?void 0:te.docs)==null?void 0:ae.source}}};var re,ne,oe;h.parameters={...h.parameters,docs:{...(re=h.parameters)==null?void 0:re.docs,source:{originalSource:`{
|
|
91
|
-
args: {
|
|
92
|
-
autoCompleteType: "work email",
|
|
93
|
-
label: "Company email",
|
|
94
|
-
type: "email",
|
|
95
|
-
defaultValue: ""
|
|
96
|
-
}
|
|
97
|
-
}`,...(oe=(ne=h.parameters)==null?void 0:ne.docs)==null?void 0:oe.source}}};var se,ie,le;y.parameters={...y.parameters,docs:{...(se=y.parameters)==null?void 0:se.docs,source:{originalSource:`{
|
|
98
|
-
parameters: {
|
|
99
|
-
docs: {
|
|
100
|
-
description: {
|
|
101
|
-
story: "As the user types, the field will grow vertically to accommodate the new lines."
|
|
102
|
-
}
|
|
103
|
-
}
|
|
104
|
-
},
|
|
105
|
-
args: {
|
|
106
|
-
autoCompleteType: "shipping street-address",
|
|
107
|
-
label: "Permanent residence",
|
|
108
|
-
isMultiline: true,
|
|
109
|
-
defaultValue: ""
|
|
110
|
-
},
|
|
111
|
-
name: "Multiline (Textarea)"
|
|
112
|
-
}`,...(le=(ie=y.parameters)==null?void 0:ie.docs)==null?void 0:le.source}}};var pe,ce,me;g.parameters={...g.parameters,docs:{...(pe=g.parameters)==null?void 0:pe.docs,source:{originalSource:`{
|
|
113
|
-
args: {
|
|
114
|
-
placeholder: "Destination within the Sol system"
|
|
115
|
-
}
|
|
116
|
-
}`,...(me=(ce=g.parameters)==null?void 0:ce.docs)==null?void 0:me.source}}};var ue,de,he;f.parameters={...f.parameters,docs:{...(ue=f.parameters)==null?void 0:ue.docs,source:{originalSource:`{
|
|
117
|
-
parameters: {
|
|
118
|
-
docs: {
|
|
119
|
-
description: {
|
|
120
|
-
story: "TextFields of type \`tel\` are not automatically validated because global formats are so varied."
|
|
121
|
-
}
|
|
122
|
-
}
|
|
123
|
-
},
|
|
124
|
-
args: {
|
|
125
|
-
autoCompleteType: "mobile tel",
|
|
126
|
-
label: "Phone number",
|
|
127
|
-
startAdornment: <InputAdornment position="start">+1</InputAdornment>,
|
|
128
|
-
type: "tel",
|
|
129
|
-
defaultValue: ""
|
|
130
|
-
}
|
|
131
|
-
}`,...(he=(de=f.parameters)==null?void 0:de.docs)==null?void 0:he.source}}};var ye,ge,fe;b.parameters={...b.parameters,docs:{...(ye=b.parameters)==null?void 0:ye.docs,source:{originalSource:`{
|
|
132
|
-
parameters: {
|
|
133
|
-
docs: {
|
|
134
|
-
description: {
|
|
135
|
-
story: "When the component is controlled, the parent component is responsible for passing \`value\` to the component and listening for changes with \`onChange\`"
|
|
136
|
-
}
|
|
137
|
-
}
|
|
138
|
-
},
|
|
139
|
-
args: {
|
|
140
|
-
value: "Initial state"
|
|
141
|
-
},
|
|
142
|
-
render: function C({
|
|
143
|
-
...props
|
|
144
|
-
}) {
|
|
145
|
-
const [localValue, setLocalValue] = useState("Initial state");
|
|
146
|
-
const onChange = useCallback((event: ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => setLocalValue(event.target.value), []);
|
|
147
|
-
return <TextField {...props} onChange={onChange} value={localValue} />;
|
|
148
|
-
}
|
|
149
|
-
}`,...(fe=(ge=b.parameters)==null?void 0:ge.docs)==null?void 0:fe.source}}};const dt=["Default","Disabled","Optional","ReadOnly","Error","ErrorsList","FullWidth","Hint","HintLink","Adornment","Email","Multiline","Placeholder","Tel","ControlledTextField"];export{d as Adornment,b as ControlledTextField,n as Default,o as Disabled,h as Email,l as Error,p as ErrorsList,c as FullWidth,m as Hint,u as HintLink,y as Multiline,s as Optional,g as Placeholder,i as ReadOnly,f as Tel,dt as __namedExportsOrder,ut as default};
|