@dxc-technology/halstack-react 12.1.0 → 13.0.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/README.md +1 -1
- package/dist/index.d.mts +6439 -0
- package/dist/index.d.ts +6439 -0
- package/dist/index.js +12617 -0
- package/dist/index.mjs +12529 -0
- package/package.json +59 -63
- package/BackgroundColorContext.d.ts +0 -1
- package/BackgroundColorContext.js +0 -30
- package/HalstackContext.d.ts +0 -1246
- package/HalstackContext.js +0 -310
- package/accordion/Accordion.accessibility.test.d.ts +0 -1
- package/accordion/Accordion.accessibility.test.js +0 -71
- package/accordion/Accordion.d.ts +0 -4
- package/accordion/Accordion.js +0 -168
- package/accordion/Accordion.stories.tsx +0 -241
- package/accordion/Accordion.test.d.ts +0 -1
- package/accordion/Accordion.test.js +0 -56
- package/accordion/types.d.ts +0 -57
- package/accordion/types.js +0 -5
- package/accordion-group/AccordionGroup.accessibility.test.d.ts +0 -1
- package/accordion-group/AccordionGroup.accessibility.test.js +0 -82
- package/accordion-group/AccordionGroup.d.ts +0 -7
- package/accordion-group/AccordionGroup.js +0 -101
- package/accordion-group/AccordionGroup.stories.tsx +0 -252
- package/accordion-group/AccordionGroup.test.d.ts +0 -1
- package/accordion-group/AccordionGroup.test.js +0 -94
- package/accordion-group/AccordionGroupAccordion.d.ts +0 -4
- package/accordion-group/AccordionGroupAccordion.js +0 -31
- package/accordion-group/AccordionGroupContext.d.ts +0 -3
- package/accordion-group/AccordionGroupContext.js +0 -8
- package/accordion-group/types.d.ts +0 -67
- package/accordion-group/types.js +0 -5
- package/action-icon/ActionIcon.accessibility.test.d.ts +0 -1
- package/action-icon/ActionIcon.accessibility.test.js +0 -63
- package/action-icon/ActionIcon.d.ts +0 -4
- package/action-icon/ActionIcon.js +0 -48
- package/action-icon/ActionIcon.stories.tsx +0 -41
- package/action-icon/ActionIcon.test.d.ts +0 -1
- package/action-icon/ActionIcon.test.js +0 -64
- package/action-icon/types.d.ts +0 -26
- package/action-icon/types.js +0 -5
- package/alert/Alert.accessibility.test.d.ts +0 -1
- package/alert/Alert.accessibility.test.js +0 -95
- package/alert/Alert.d.ts +0 -4
- package/alert/Alert.js +0 -203
- package/alert/Alert.stories.tsx +0 -198
- package/alert/Alert.test.d.ts +0 -1
- package/alert/Alert.test.js +0 -75
- package/alert/types.d.ts +0 -49
- package/alert/types.js +0 -5
- package/badge/Badge.accessibility.test.d.ts +0 -1
- package/badge/Badge.accessibility.test.js +0 -129
- package/badge/Badge.d.ts +0 -4
- package/badge/Badge.js +0 -161
- package/badge/Badge.stories.tsx +0 -210
- package/badge/Badge.test.d.ts +0 -1
- package/badge/Badge.test.js +0 -30
- package/badge/types.d.ts +0 -54
- package/badge/types.js +0 -5
- package/bleed/Bleed.d.ts +0 -3
- package/bleed/Bleed.js +0 -43
- package/bleed/Bleed.stories.tsx +0 -342
- package/bleed/types.d.ts +0 -37
- package/bleed/types.js +0 -5
- package/box/Box.accessibility.test.d.ts +0 -1
- package/box/Box.accessibility.test.js +0 -33
- package/box/Box.d.ts +0 -4
- package/box/Box.js +0 -75
- package/box/Box.stories.tsx +0 -119
- package/box/Box.test.d.ts +0 -1
- package/box/Box.test.js +0 -13
- package/box/types.d.ts +0 -32
- package/box/types.js +0 -5
- package/breadcrumbs/Breadcrumbs.accessibility.test.d.ts +0 -1
- package/breadcrumbs/Breadcrumbs.accessibility.test.js +0 -96
- package/breadcrumbs/Breadcrumbs.d.ts +0 -4
- package/breadcrumbs/Breadcrumbs.js +0 -79
- package/breadcrumbs/Breadcrumbs.stories.tsx +0 -194
- package/breadcrumbs/Breadcrumbs.test.d.ts +0 -1
- package/breadcrumbs/Breadcrumbs.test.js +0 -168
- package/breadcrumbs/Item.d.ts +0 -4
- package/breadcrumbs/Item.js +0 -52
- package/breadcrumbs/dropdownTheme.d.ts +0 -53
- package/breadcrumbs/dropdownTheme.js +0 -62
- package/breadcrumbs/types.d.ts +0 -16
- package/breadcrumbs/types.js +0 -5
- package/bulleted-list/BulletedList.accessibility.test.d.ts +0 -1
- package/bulleted-list/BulletedList.accessibility.test.js +0 -119
- package/bulleted-list/BulletedList.d.ts +0 -7
- package/bulleted-list/BulletedList.js +0 -92
- package/bulleted-list/BulletedList.stories.tsx +0 -115
- package/bulleted-list/types.d.ts +0 -38
- package/bulleted-list/types.js +0 -5
- package/button/Button.accessibility.test.d.ts +0 -1
- package/button/Button.accessibility.test.js +0 -127
- package/button/Button.d.ts +0 -4
- package/button/Button.js +0 -121
- package/button/Button.stories.tsx +0 -325
- package/button/Button.test.d.ts +0 -1
- package/button/Button.test.js +0 -38
- package/button/types.d.ts +0 -57
- package/button/types.js +0 -5
- package/card/Card.accessibility.test.d.ts +0 -1
- package/card/Card.accessibility.test.js +0 -36
- package/card/Card.d.ts +0 -4
- package/card/Card.js +0 -121
- package/card/Card.stories.tsx +0 -171
- package/card/Card.test.d.ts +0 -1
- package/card/Card.test.js +0 -39
- package/card/types.d.ts +0 -62
- package/card/types.js +0 -5
- package/checkbox/Checkbox.accessibility.test.d.ts +0 -1
- package/checkbox/Checkbox.accessibility.test.js +0 -87
- package/checkbox/Checkbox.d.ts +0 -4
- package/checkbox/Checkbox.js +0 -212
- package/checkbox/Checkbox.stories.tsx +0 -222
- package/checkbox/Checkbox.test.d.ts +0 -1
- package/checkbox/Checkbox.test.js +0 -199
- package/checkbox/types.d.ts +0 -72
- package/checkbox/types.js +0 -5
- package/chip/Chip.accessibility.test.d.ts +0 -1
- package/chip/Chip.accessibility.test.js +0 -67
- package/chip/Chip.d.ts +0 -4
- package/chip/Chip.js +0 -126
- package/chip/Chip.stories.tsx +0 -195
- package/chip/Chip.test.d.ts +0 -1
- package/chip/Chip.test.js +0 -41
- package/chip/types.d.ts +0 -45
- package/chip/types.js +0 -5
- package/common/coreTokens.d.ts +0 -237
- package/common/coreTokens.js +0 -184
- package/common/utils.d.ts +0 -1
- package/common/utils.js +0 -16
- package/common/variables.d.ts +0 -1392
- package/common/variables.js +0 -1264
- package/container/Container.d.ts +0 -4
- package/container/Container.js +0 -194
- package/container/Container.stories.tsx +0 -214
- package/container/types.d.ts +0 -74
- package/container/types.js +0 -5
- package/contextual-menu/ContextualMenu.accessibility.test.d.ts +0 -1
- package/contextual-menu/ContextualMenu.accessibility.test.js +0 -98
- package/contextual-menu/ContextualMenu.d.ts +0 -5
- package/contextual-menu/ContextualMenu.js +0 -108
- package/contextual-menu/ContextualMenu.stories.tsx +0 -223
- package/contextual-menu/ContextualMenu.test.d.ts +0 -1
- package/contextual-menu/ContextualMenu.test.js +0 -247
- package/contextual-menu/GroupItem.d.ts +0 -4
- package/contextual-menu/GroupItem.js +0 -67
- package/contextual-menu/ItemAction.d.ts +0 -4
- package/contextual-menu/ItemAction.js +0 -50
- package/contextual-menu/MenuItem.d.ts +0 -4
- package/contextual-menu/MenuItem.js +0 -29
- package/contextual-menu/SingleItem.d.ts +0 -4
- package/contextual-menu/SingleItem.js +0 -38
- package/contextual-menu/types.d.ts +0 -61
- package/contextual-menu/types.js +0 -5
- package/date-input/Calendar.d.ts +0 -4
- package/date-input/Calendar.js +0 -230
- package/date-input/DateInput.accessibility.test.d.ts +0 -1
- package/date-input/DateInput.accessibility.test.js +0 -229
- package/date-input/DateInput.d.ts +0 -4
- package/date-input/DateInput.js +0 -228
- package/date-input/DateInput.stories.tsx +0 -291
- package/date-input/DateInput.test.d.ts +0 -1
- package/date-input/DateInput.test.js +0 -808
- package/date-input/DatePicker.d.ts +0 -4
- package/date-input/DatePicker.js +0 -121
- package/date-input/YearPicker.d.ts +0 -4
- package/date-input/YearPicker.js +0 -105
- package/date-input/types.d.ts +0 -164
- package/date-input/types.js +0 -5
- package/dialog/Dialog.accessibility.test.d.ts +0 -1
- package/dialog/Dialog.accessibility.test.js +0 -69
- package/dialog/Dialog.d.ts +0 -4
- package/dialog/Dialog.js +0 -93
- package/dialog/Dialog.stories.tsx +0 -369
- package/dialog/Dialog.test.d.ts +0 -1
- package/dialog/Dialog.test.js +0 -370
- package/dialog/types.d.ts +0 -36
- package/dialog/types.js +0 -5
- package/divider/Divider.accessibility.test.d.ts +0 -1
- package/divider/Divider.accessibility.test.js +0 -33
- package/divider/Divider.d.ts +0 -4
- package/divider/Divider.js +0 -36
- package/divider/Divider.stories.tsx +0 -223
- package/divider/Divider.test.d.ts +0 -1
- package/divider/Divider.test.js +0 -38
- package/divider/types.d.ts +0 -21
- package/divider/types.js +0 -5
- package/dropdown/Dropdown.accessibility.test.d.ts +0 -1
- package/dropdown/Dropdown.accessibility.test.js +0 -183
- package/dropdown/Dropdown.d.ts +0 -4
- package/dropdown/Dropdown.js +0 -320
- package/dropdown/Dropdown.stories.tsx +0 -427
- package/dropdown/Dropdown.test.d.ts +0 -1
- package/dropdown/Dropdown.test.js +0 -628
- package/dropdown/DropdownMenu.d.ts +0 -4
- package/dropdown/DropdownMenu.js +0 -63
- package/dropdown/DropdownMenuItem.d.ts +0 -4
- package/dropdown/DropdownMenuItem.js +0 -71
- package/dropdown/types.d.ts +0 -96
- package/dropdown/types.js +0 -5
- package/file-input/FileInput.accessibility.test.d.ts +0 -1
- package/file-input/FileInput.accessibility.test.js +0 -167
- package/file-input/FileInput.d.ts +0 -4
- package/file-input/FileInput.js +0 -438
- package/file-input/FileInput.stories.tsx +0 -618
- package/file-input/FileInput.test.d.ts +0 -1
- package/file-input/FileInput.test.js +0 -404
- package/file-input/FileItem.d.ts +0 -4
- package/file-input/FileItem.js +0 -125
- package/file-input/types.d.ts +0 -125
- package/file-input/types.js +0 -5
- package/flex/Flex.d.ts +0 -4
- package/flex/Flex.js +0 -57
- package/flex/Flex.stories.tsx +0 -112
- package/flex/types.d.ts +0 -97
- package/flex/types.js +0 -5
- package/footer/Footer.accessibility.test.d.ts +0 -1
- package/footer/Footer.accessibility.test.js +0 -125
- package/footer/Footer.d.ts +0 -4
- package/footer/Footer.js +0 -140
- package/footer/Footer.stories.tsx +0 -208
- package/footer/Footer.test.d.ts +0 -1
- package/footer/Footer.test.js +0 -85
- package/footer/Icons.d.ts +0 -3
- package/footer/Icons.js +0 -108
- package/footer/types.d.ts +0 -64
- package/footer/types.js +0 -5
- package/grid/Grid.d.ts +0 -7
- package/grid/Grid.js +0 -76
- package/grid/Grid.stories.tsx +0 -221
- package/grid/types.d.ts +0 -115
- package/grid/types.js +0 -5
- package/header/Header.accessibility.test.d.ts +0 -1
- package/header/Header.accessibility.test.js +0 -94
- package/header/Header.d.ts +0 -8
- package/header/Header.js +0 -210
- package/header/Header.stories.tsx +0 -267
- package/header/Header.test.d.ts +0 -1
- package/header/Header.test.js +0 -66
- package/header/Icons.d.ts +0 -2
- package/header/Icons.js +0 -24
- package/header/types.d.ts +0 -33
- package/header/types.js +0 -5
- package/heading/Heading.accessibility.test.d.ts +0 -1
- package/heading/Heading.accessibility.test.js +0 -33
- package/heading/Heading.d.ts +0 -4
- package/heading/Heading.js +0 -137
- package/heading/Heading.stories.tsx +0 -54
- package/heading/Heading.test.d.ts +0 -1
- package/heading/Heading.test.js +0 -156
- package/heading/types.d.ts +0 -33
- package/heading/types.js +0 -5
- package/icon/Icon.accessibility.test.d.ts +0 -1
- package/icon/Icon.accessibility.test.js +0 -30
- package/icon/Icon.d.ts +0 -4
- package/icon/Icon.js +0 -33
- package/icon/Icon.stories.tsx +0 -28
- package/icon/types.d.ts +0 -4
- package/icon/types.js +0 -5
- package/image/Image.accessibility.test.d.ts +0 -1
- package/image/Image.accessibility.test.js +0 -56
- package/image/Image.d.ts +0 -4
- package/image/Image.js +0 -70
- package/image/Image.stories.tsx +0 -129
- package/image/types.d.ts +0 -72
- package/image/types.js +0 -5
- package/inset/Inset.d.ts +0 -3
- package/inset/Inset.js +0 -43
- package/inset/Inset.stories.tsx +0 -230
- package/inset/types.d.ts +0 -37
- package/inset/types.js +0 -5
- package/layout/ApplicationLayout.d.ts +0 -20
- package/layout/ApplicationLayout.js +0 -137
- package/layout/ApplicationLayout.stories.tsx +0 -162
- package/layout/Icons.d.ts +0 -7
- package/layout/Icons.js +0 -48
- package/layout/types.d.ts +0 -41
- package/layout/types.js +0 -5
- package/link/Link.accessibility.test.d.ts +0 -1
- package/link/Link.accessibility.test.js +0 -108
- package/link/Link.d.ts +0 -4
- package/link/Link.js +0 -117
- package/link/Link.stories.tsx +0 -253
- package/link/Link.test.d.ts +0 -1
- package/link/Link.test.js +0 -63
- package/link/types.d.ts +0 -54
- package/link/types.js +0 -5
- package/main.d.ts +0 -50
- package/main.js +0 -364
- package/nav-tabs/NavTabs.accessibility.test.d.ts +0 -1
- package/nav-tabs/NavTabs.accessibility.test.js +0 -44
- package/nav-tabs/NavTabs.d.ts +0 -7
- package/nav-tabs/NavTabs.js +0 -108
- package/nav-tabs/NavTabs.stories.tsx +0 -294
- package/nav-tabs/NavTabs.test.d.ts +0 -1
- package/nav-tabs/NavTabs.test.js +0 -77
- package/nav-tabs/NavTabsContext.d.ts +0 -3
- package/nav-tabs/NavTabsContext.js +0 -8
- package/nav-tabs/Tab.d.ts +0 -4
- package/nav-tabs/Tab.js +0 -117
- package/nav-tabs/types.d.ts +0 -52
- package/nav-tabs/types.js +0 -5
- package/number-input/NumberInput.accessibility.test.d.ts +0 -1
- package/number-input/NumberInput.accessibility.test.js +0 -227
- package/number-input/NumberInput.d.ts +0 -4
- package/number-input/NumberInput.js +0 -86
- package/number-input/NumberInput.stories.tsx +0 -117
- package/number-input/NumberInput.test.d.ts +0 -1
- package/number-input/NumberInput.test.js +0 -988
- package/number-input/NumberInputContext.d.ts +0 -3
- package/number-input/NumberInputContext.js +0 -8
- package/number-input/types.d.ts +0 -136
- package/number-input/types.js +0 -5
- package/paginator/Paginator.accessibility.test.d.ts +0 -1
- package/paginator/Paginator.accessibility.test.js +0 -78
- package/paginator/Paginator.d.ts +0 -4
- package/paginator/Paginator.js +0 -138
- package/paginator/Paginator.stories.tsx +0 -87
- package/paginator/Paginator.test.d.ts +0 -1
- package/paginator/Paginator.test.js +0 -334
- package/paginator/types.d.ts +0 -38
- package/paginator/types.js +0 -5
- package/paragraph/Paragraph.accessibility.test.d.ts +0 -1
- package/paragraph/Paragraph.accessibility.test.js +0 -28
- package/paragraph/Paragraph.d.ts +0 -5
- package/paragraph/Paragraph.js +0 -22
- package/paragraph/Paragraph.stories.tsx +0 -27
- package/password-input/PasswordInput.accessibility.test.d.ts +0 -1
- package/password-input/PasswordInput.accessibility.test.js +0 -152
- package/password-input/PasswordInput.d.ts +0 -4
- package/password-input/PasswordInput.js +0 -97
- package/password-input/PasswordInput.stories.tsx +0 -99
- package/password-input/PasswordInput.test.d.ts +0 -1
- package/password-input/PasswordInput.test.js +0 -197
- package/password-input/types.d.ts +0 -111
- package/password-input/types.js +0 -5
- package/progress-bar/ProgressBar.accessibility.test.d.ts +0 -1
- package/progress-bar/ProgressBar.accessibility.test.js +0 -35
- package/progress-bar/ProgressBar.d.ts +0 -4
- package/progress-bar/ProgressBar.js +0 -146
- package/progress-bar/ProgressBar.stories.tsx +0 -93
- package/progress-bar/ProgressBar.test.d.ts +0 -1
- package/progress-bar/ProgressBar.test.js +0 -93
- package/progress-bar/types.d.ts +0 -37
- package/progress-bar/types.js +0 -5
- package/quick-nav/QuickNav.accessibility.test.d.ts +0 -1
- package/quick-nav/QuickNav.accessibility.test.js +0 -57
- package/quick-nav/QuickNav.d.ts +0 -4
- package/quick-nav/QuickNav.js +0 -94
- package/quick-nav/QuickNav.stories.tsx +0 -356
- package/quick-nav/types.d.ts +0 -21
- package/quick-nav/types.js +0 -5
- package/radio-group/Radio.d.ts +0 -4
- package/radio-group/Radio.js +0 -121
- package/radio-group/RadioGroup.accessibility.test.d.ts +0 -1
- package/radio-group/RadioGroup.accessibility.test.js +0 -97
- package/radio-group/RadioGroup.d.ts +0 -4
- package/radio-group/RadioGroup.js +0 -233
- package/radio-group/RadioGroup.stories.tsx +0 -214
- package/radio-group/RadioGroup.test.d.ts +0 -1
- package/radio-group/RadioGroup.test.js +0 -754
- package/radio-group/types.d.ts +0 -114
- package/radio-group/types.js +0 -5
- package/resultset-table/Icons.d.ts +0 -7
- package/resultset-table/Icons.js +0 -47
- package/resultset-table/ResultsetTable.accessibility.test.d.ts +0 -1
- package/resultset-table/ResultsetTable.accessibility.test.js +0 -284
- package/resultset-table/ResultsetTable.d.ts +0 -7
- package/resultset-table/ResultsetTable.js +0 -171
- package/resultset-table/ResultsetTable.stories.tsx +0 -413
- package/resultset-table/ResultsetTable.test.d.ts +0 -1
- package/resultset-table/ResultsetTable.test.js +0 -379
- package/resultset-table/types.d.ts +0 -100
- package/resultset-table/types.js +0 -5
- package/select/Listbox.d.ts +0 -4
- package/select/Listbox.js +0 -151
- package/select/Option.d.ts +0 -4
- package/select/Option.js +0 -89
- package/select/Select.accessibility.test.d.ts +0 -1
- package/select/Select.accessibility.test.js +0 -227
- package/select/Select.d.ts +0 -4
- package/select/Select.js +0 -600
- package/select/Select.stories.tsx +0 -919
- package/select/Select.test.d.ts +0 -1
- package/select/Select.test.js +0 -2267
- package/select/types.d.ts +0 -209
- package/select/types.js +0 -5
- package/sidenav/Sidenav.accessibility.test.d.ts +0 -1
- package/sidenav/Sidenav.accessibility.test.js +0 -59
- package/sidenav/Sidenav.d.ts +0 -10
- package/sidenav/Sidenav.js +0 -201
- package/sidenav/Sidenav.stories.tsx +0 -277
- package/sidenav/Sidenav.test.d.ts +0 -1
- package/sidenav/Sidenav.test.js +0 -37
- package/sidenav/SidenavContext.d.ts +0 -5
- package/sidenav/SidenavContext.js +0 -13
- package/sidenav/types.d.ts +0 -76
- package/sidenav/types.js +0 -5
- package/slider/Slider.accessibility.test.d.ts +0 -1
- package/slider/Slider.accessibility.test.js +0 -103
- package/slider/Slider.d.ts +0 -4
- package/slider/Slider.js +0 -283
- package/slider/Slider.stories.tsx +0 -180
- package/slider/Slider.test.d.ts +0 -1
- package/slider/Slider.test.js +0 -256
- package/slider/types.d.ts +0 -86
- package/slider/types.js +0 -5
- package/spinner/Spinner.accessibility.test.d.ts +0 -1
- package/spinner/Spinner.accessibility.test.js +0 -96
- package/spinner/Spinner.d.ts +0 -4
- package/spinner/Spinner.js +0 -210
- package/spinner/Spinner.stories.tsx +0 -129
- package/spinner/Spinner.test.d.ts +0 -1
- package/spinner/Spinner.test.js +0 -55
- package/spinner/types.d.ts +0 -32
- package/spinner/types.js +0 -5
- package/status-light/StatusLight.accessibility.test.d.ts +0 -1
- package/status-light/StatusLight.accessibility.test.js +0 -157
- package/status-light/StatusLight.d.ts +0 -4
- package/status-light/StatusLight.js +0 -51
- package/status-light/StatusLight.stories.tsx +0 -74
- package/status-light/StatusLight.test.d.ts +0 -1
- package/status-light/StatusLight.test.js +0 -25
- package/status-light/types.d.ts +0 -17
- package/status-light/types.js +0 -5
- package/switch/Switch.accessibility.test.d.ts +0 -1
- package/switch/Switch.accessibility.test.js +0 -98
- package/switch/Switch.d.ts +0 -4
- package/switch/Switch.js +0 -211
- package/switch/Switch.stories.tsx +0 -149
- package/switch/Switch.test.d.ts +0 -1
- package/switch/Switch.test.js +0 -180
- package/switch/types.d.ts +0 -66
- package/switch/types.js +0 -5
- package/table/DropdownTheme.js +0 -62
- package/table/Table.accessibility.test.d.ts +0 -1
- package/table/Table.accessibility.test.js +0 -92
- package/table/Table.d.ts +0 -8
- package/table/Table.js +0 -161
- package/table/Table.stories.tsx +0 -663
- package/table/Table.test.d.ts +0 -1
- package/table/Table.test.js +0 -111
- package/table/types.d.ts +0 -49
- package/table/types.js +0 -5
- package/tabs/Tab.d.ts +0 -4
- package/tabs/Tab.js +0 -117
- package/tabs/Tabs.accessibility.test.d.ts +0 -1
- package/tabs/Tabs.accessibility.test.js +0 -56
- package/tabs/Tabs.d.ts +0 -4
- package/tabs/Tabs.js +0 -373
- package/tabs/Tabs.stories.tsx +0 -230
- package/tabs/Tabs.test.d.ts +0 -1
- package/tabs/Tabs.test.js +0 -276
- package/tabs/types.d.ts +0 -92
- package/tabs/types.js +0 -5
- package/tag/Tag.accessibility.test.d.ts +0 -1
- package/tag/Tag.accessibility.test.js +0 -69
- package/tag/Tag.d.ts +0 -4
- package/tag/Tag.js +0 -151
- package/tag/Tag.stories.tsx +0 -152
- package/tag/Tag.test.d.ts +0 -1
- package/tag/Tag.test.js +0 -41
- package/tag/types.d.ts +0 -69
- package/tag/types.js +0 -5
- package/text-input/Suggestion.d.ts +0 -4
- package/text-input/Suggestion.js +0 -67
- package/text-input/Suggestions.d.ts +0 -4
- package/text-input/Suggestions.js +0 -94
- package/text-input/TextInput.accessibility.test.d.ts +0 -1
- package/text-input/TextInput.accessibility.test.js +0 -320
- package/text-input/TextInput.d.ts +0 -4
- package/text-input/TextInput.js +0 -569
- package/text-input/TextInput.stories.tsx +0 -468
- package/text-input/TextInput.test.d.ts +0 -1
- package/text-input/TextInput.test.js +0 -1755
- package/text-input/types.d.ts +0 -205
- package/text-input/types.js +0 -5
- package/textarea/Textarea.accessibility.test.d.ts +0 -1
- package/textarea/Textarea.accessibility.test.js +0 -155
- package/textarea/Textarea.d.ts +0 -4
- package/textarea/Textarea.js +0 -235
- package/textarea/Textarea.stories.tsx +0 -174
- package/textarea/Textarea.test.d.ts +0 -1
- package/textarea/Textarea.test.js +0 -406
- package/textarea/types.d.ts +0 -141
- package/textarea/types.js +0 -5
- package/toggle-group/ToggleGroup.accessibility.test.d.ts +0 -1
- package/toggle-group/ToggleGroup.accessibility.test.js +0 -107
- package/toggle-group/ToggleGroup.d.ts +0 -4
- package/toggle-group/ToggleGroup.js +0 -199
- package/toggle-group/ToggleGroup.stories.tsx +0 -218
- package/toggle-group/ToggleGroup.test.d.ts +0 -1
- package/toggle-group/ToggleGroup.test.js +0 -137
- package/toggle-group/types.d.ts +0 -114
- package/toggle-group/types.js +0 -5
- package/typography/Typography.accessibility.test.d.ts +0 -1
- package/typography/Typography.accessibility.test.js +0 -339
- package/typography/Typography.d.ts +0 -4
- package/typography/Typography.js +0 -23
- package/typography/Typography.stories.tsx +0 -196
- package/typography/types.d.ts +0 -18
- package/typography/types.js +0 -5
- package/useTheme.d.ts +0 -1145
- package/useTheme.js +0 -15
- package/useTranslatedLabels.d.ts +0 -85
- package/useTranslatedLabels.js +0 -14
- package/utils/BaseTypography.d.ts +0 -21
- package/utils/BaseTypography.js +0 -94
- package/utils/FocusLock.d.ts +0 -13
- package/utils/FocusLock.js +0 -125
- package/wizard/Wizard.accessibility.test.d.ts +0 -1
- package/wizard/Wizard.accessibility.test.js +0 -55
- package/wizard/Wizard.d.ts +0 -4
- package/wizard/Wizard.js +0 -239
- package/wizard/Wizard.stories.tsx +0 -272
- package/wizard/Wizard.test.d.ts +0 -1
- package/wizard/Wizard.test.js +0 -114
- package/wizard/types.d.ts +0 -64
- package/wizard/types.js +0 -5
|
@@ -1,101 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
var _typeof3 = require("@babel/runtime/helpers/typeof");
|
|
5
|
-
Object.defineProperty(exports, "__esModule", {
|
|
6
|
-
value: true
|
|
7
|
-
});
|
|
8
|
-
exports["default"] = void 0;
|
|
9
|
-
var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
|
|
10
|
-
var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
|
|
11
|
-
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
12
|
-
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
13
|
-
var _react = _interopRequireWildcard(require("react"));
|
|
14
|
-
var _styledComponents = _interopRequireWildcard(require("styled-components"));
|
|
15
|
-
var _utils = require("../common/utils");
|
|
16
|
-
var _variables = require("../common/variables");
|
|
17
|
-
var _useTheme = _interopRequireDefault(require("../useTheme"));
|
|
18
|
-
var _AccordionGroupAccordion = _interopRequireDefault(require("./AccordionGroupAccordion"));
|
|
19
|
-
var _AccordionGroupContext = require("./AccordionGroupContext");
|
|
20
|
-
var _templateObject;
|
|
21
|
-
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
22
|
-
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof3(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
|
|
23
|
-
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
24
|
-
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
25
|
-
var DxcAccordionGroup = function DxcAccordionGroup(_ref) {
|
|
26
|
-
var defaultIndexActive = _ref.defaultIndexActive,
|
|
27
|
-
indexActive = _ref.indexActive,
|
|
28
|
-
_ref$disabled = _ref.disabled,
|
|
29
|
-
disabled = _ref$disabled === void 0 ? false : _ref$disabled,
|
|
30
|
-
onActiveChange = _ref.onActiveChange,
|
|
31
|
-
margin = _ref.margin,
|
|
32
|
-
children = _ref.children;
|
|
33
|
-
var colorsTheme = (0, _useTheme["default"])();
|
|
34
|
-
var _useState = (0, _react.useState)(defaultIndexActive !== null && defaultIndexActive !== void 0 ? defaultIndexActive : -1),
|
|
35
|
-
_useState2 = (0, _slicedToArray2["default"])(_useState, 2),
|
|
36
|
-
innerIndexActive = _useState2[0],
|
|
37
|
-
setInnerIndexActive = _useState2[1];
|
|
38
|
-
var handlerActiveChange = (0, _react.useCallback)(function (index) {
|
|
39
|
-
indexActive !== null && indexActive !== void 0 ? indexActive : setInnerIndexActive(function (prev) {
|
|
40
|
-
return index === prev ? -1 : index;
|
|
41
|
-
});
|
|
42
|
-
!disabled && (onActiveChange === null || onActiveChange === void 0 ? void 0 : onActiveChange(index));
|
|
43
|
-
}, [disabled, indexActive, onActiveChange]);
|
|
44
|
-
var contextValue = (0, _react.useMemo)(function () {
|
|
45
|
-
return {
|
|
46
|
-
activeIndex: indexActive !== null && indexActive !== void 0 ? indexActive : innerIndexActive,
|
|
47
|
-
handlerActiveChange: handlerActiveChange,
|
|
48
|
-
disabled: disabled
|
|
49
|
-
};
|
|
50
|
-
}, [indexActive, innerIndexActive, handlerActiveChange, disabled]);
|
|
51
|
-
return /*#__PURE__*/_react["default"].createElement(_styledComponents.ThemeProvider, {
|
|
52
|
-
theme: colorsTheme.accordion
|
|
53
|
-
}, /*#__PURE__*/_react["default"].createElement(AccordionGroupContainer, {
|
|
54
|
-
margin: margin,
|
|
55
|
-
disabled: disabled
|
|
56
|
-
}, _react.Children.map(children, function (accordion, index) {
|
|
57
|
-
return /*#__PURE__*/_react["default"].createElement(_AccordionGroupContext.AccordionGroupAccordionContext.Provider, {
|
|
58
|
-
key: "accordion-".concat(index),
|
|
59
|
-
value: _objectSpread({
|
|
60
|
-
index: index
|
|
61
|
-
}, contextValue)
|
|
62
|
-
}, accordion);
|
|
63
|
-
})));
|
|
64
|
-
};
|
|
65
|
-
DxcAccordionGroup.Accordion = _AccordionGroupAccordion["default"];
|
|
66
|
-
var calculateWidth = function calculateWidth(margin) {
|
|
67
|
-
return "calc(100% - ".concat((0, _utils.getMargin)(margin, "left"), " - ").concat((0, _utils.getMargin)(margin, "right"), ")");
|
|
68
|
-
};
|
|
69
|
-
var AccordionGroupContainer = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n width: ", ";\n margin: ", ";\n margin-top: ", ";\n margin-right: ", ";\n margin-bottom: ", ";\n margin-left: ", ";\n cursor: ", ";\n\n > div:not(:last-of-type):not(:only-of-type) {\n border-bottom: ", ";\n border-color: ", ";\n }\n > div:not(:first-of-type):not(:last-of-type):not(:only-of-type) {\n border-radius: 0;\n & > h3 > button {\n border-radius: 0;\n }\n }\n > div:first-of-type:not(:only-of-type) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n border-top-left-radius: ", ";\n border-top-right-radius: ", ";\n\n & > h3 > button {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n }\n > div:last-of-type:not(:only-of-type) {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n border-bottom-left-radius: ", ";\n border-bottom-right-radius: ", ";\n\n & > h3 > button {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n }\n"])), function (props) {
|
|
70
|
-
return calculateWidth(props.margin);
|
|
71
|
-
}, function (_ref2) {
|
|
72
|
-
var margin = _ref2.margin;
|
|
73
|
-
return margin && (0, _typeof2["default"])(margin) !== "object" ? _variables.spaces[margin] : "0px";
|
|
74
|
-
}, function (_ref3) {
|
|
75
|
-
var margin = _ref3.margin;
|
|
76
|
-
return margin && (0, _typeof2["default"])(margin) === "object" && margin.top ? _variables.spaces[margin.top] : "";
|
|
77
|
-
}, function (_ref4) {
|
|
78
|
-
var margin = _ref4.margin;
|
|
79
|
-
return margin && (0, _typeof2["default"])(margin) === "object" && margin.right ? _variables.spaces[margin.right] : "";
|
|
80
|
-
}, function (_ref5) {
|
|
81
|
-
var margin = _ref5.margin;
|
|
82
|
-
return margin && (0, _typeof2["default"])(margin) === "object" && margin.bottom ? _variables.spaces[margin.bottom] : "";
|
|
83
|
-
}, function (_ref6) {
|
|
84
|
-
var margin = _ref6.margin;
|
|
85
|
-
return margin && (0, _typeof2["default"])(margin) === "object" && margin.left ? _variables.spaces[margin.left] : "";
|
|
86
|
-
}, function (props) {
|
|
87
|
-
return props.disabled ? "not-allowed" : "pointer";
|
|
88
|
-
}, function (props) {
|
|
89
|
-
return "".concat(props.theme.accordionGroupSeparatorBorderThickness, " ").concat(props.theme.accordionGroupSeparatorBorderStyle);
|
|
90
|
-
}, function (props) {
|
|
91
|
-
return props.theme.accordionGroupSeparatorBorderColor;
|
|
92
|
-
}, function (props) {
|
|
93
|
-
return props.theme.borderRadius;
|
|
94
|
-
}, function (props) {
|
|
95
|
-
return props.theme.borderRadius;
|
|
96
|
-
}, function (props) {
|
|
97
|
-
return props.theme.borderRadius;
|
|
98
|
-
}, function (props) {
|
|
99
|
-
return props.theme.borderRadius;
|
|
100
|
-
});
|
|
101
|
-
var _default = exports["default"] = DxcAccordionGroup;
|
|
@@ -1,252 +0,0 @@
|
|
|
1
|
-
import React from "react";
|
|
2
|
-
import DxcAccordionGroup from "./AccordionGroup";
|
|
3
|
-
import DxcInset from "../inset/Inset";
|
|
4
|
-
import Title from "../../.storybook/components/Title";
|
|
5
|
-
import ExampleContainer from "../../.storybook/components/ExampleContainer";
|
|
6
|
-
|
|
7
|
-
export default {
|
|
8
|
-
title: "Accordion Group",
|
|
9
|
-
component: DxcAccordionGroup,
|
|
10
|
-
};
|
|
11
|
-
|
|
12
|
-
export const Chromatic = () => (
|
|
13
|
-
<>
|
|
14
|
-
<Title title="States" theme="light" level={2} />
|
|
15
|
-
<ExampleContainer>
|
|
16
|
-
<Title title="Default" theme="light" level={4} />
|
|
17
|
-
<DxcAccordionGroup>
|
|
18
|
-
<DxcAccordionGroup.Accordion label="Accordion1" assistiveText="Assistive text">
|
|
19
|
-
<DxcInset space="2rem">
|
|
20
|
-
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse malesuada lacus ex, sit amet blandit
|
|
21
|
-
leo lobortis eget.
|
|
22
|
-
</DxcInset>
|
|
23
|
-
</DxcAccordionGroup.Accordion>
|
|
24
|
-
<DxcAccordionGroup.Accordion label="Accordion2" assistiveText="Assistive text">
|
|
25
|
-
<DxcInset space="2rem">
|
|
26
|
-
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse malesuada lacus ex, sit amet blandit
|
|
27
|
-
leo lobortis eget.
|
|
28
|
-
</DxcInset>
|
|
29
|
-
</DxcAccordionGroup.Accordion>
|
|
30
|
-
<DxcAccordionGroup.Accordion label="Accordion3" assistiveText="Assistive text">
|
|
31
|
-
<DxcInset space="2rem">
|
|
32
|
-
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse malesuada lacus ex, sit amet blandit
|
|
33
|
-
leo lobortis eget.
|
|
34
|
-
</DxcInset>
|
|
35
|
-
</DxcAccordionGroup.Accordion>
|
|
36
|
-
</DxcAccordionGroup>
|
|
37
|
-
</ExampleContainer>
|
|
38
|
-
<ExampleContainer>
|
|
39
|
-
<Title title="Expanded" theme="light" level={4} />
|
|
40
|
-
<DxcAccordionGroup defaultIndexActive={1}>
|
|
41
|
-
<DxcAccordionGroup.Accordion label="Accordion4">
|
|
42
|
-
<DxcInset space="2rem">
|
|
43
|
-
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et
|
|
44
|
-
dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex
|
|
45
|
-
ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat
|
|
46
|
-
nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit
|
|
47
|
-
anim id est laborum.
|
|
48
|
-
</DxcInset>
|
|
49
|
-
</DxcAccordionGroup.Accordion>
|
|
50
|
-
<DxcAccordionGroup.Accordion label="Accordion5">
|
|
51
|
-
<DxcInset space="2rem">
|
|
52
|
-
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse malesuada lacus ex, sit amet blandit
|
|
53
|
-
leo lobortis eget.
|
|
54
|
-
</DxcInset>
|
|
55
|
-
</DxcAccordionGroup.Accordion>
|
|
56
|
-
<DxcAccordionGroup.Accordion label="Accordion6">
|
|
57
|
-
<DxcInset space="2rem">
|
|
58
|
-
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse malesuada lacus ex, sit amet blandit
|
|
59
|
-
leo lobortis eget.
|
|
60
|
-
</DxcInset>
|
|
61
|
-
</DxcAccordionGroup.Accordion>
|
|
62
|
-
</DxcAccordionGroup>
|
|
63
|
-
</ExampleContainer>
|
|
64
|
-
<ExampleContainer>
|
|
65
|
-
<Title title="Disabled" theme="light" level={4} />
|
|
66
|
-
<DxcAccordionGroup disabled>
|
|
67
|
-
<DxcAccordionGroup.Accordion label="Accordion7">
|
|
68
|
-
<DxcInset space="2rem">
|
|
69
|
-
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et
|
|
70
|
-
dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex
|
|
71
|
-
ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat
|
|
72
|
-
nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit
|
|
73
|
-
anim id est laborum.
|
|
74
|
-
</DxcInset>
|
|
75
|
-
</DxcAccordionGroup.Accordion>
|
|
76
|
-
<DxcAccordionGroup.Accordion label="Accordion8">
|
|
77
|
-
<DxcInset space="2rem">
|
|
78
|
-
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse malesuada lacus ex, sit amet blandit
|
|
79
|
-
leo lobortis eget.
|
|
80
|
-
</DxcInset>
|
|
81
|
-
</DxcAccordionGroup.Accordion>
|
|
82
|
-
</DxcAccordionGroup>
|
|
83
|
-
</ExampleContainer>
|
|
84
|
-
<ExampleContainer pseudoState="pseudo-focus">
|
|
85
|
-
<Title title="Focused" theme="light" level={4} />
|
|
86
|
-
<DxcAccordionGroup defaultIndexActive={2}>
|
|
87
|
-
<DxcAccordionGroup.Accordion label="Accordion9">
|
|
88
|
-
<DxcInset space="2rem">
|
|
89
|
-
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et
|
|
90
|
-
dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex
|
|
91
|
-
ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat
|
|
92
|
-
nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit
|
|
93
|
-
anim id est laborum.
|
|
94
|
-
</DxcInset>
|
|
95
|
-
</DxcAccordionGroup.Accordion>
|
|
96
|
-
<DxcAccordionGroup.Accordion label="Accordion10">
|
|
97
|
-
<DxcInset space="2rem">
|
|
98
|
-
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse malesuada lacus ex, sit amet blandit
|
|
99
|
-
leo lobortis eget.
|
|
100
|
-
</DxcInset>
|
|
101
|
-
</DxcAccordionGroup.Accordion>
|
|
102
|
-
<DxcAccordionGroup.Accordion label="Accordion11">
|
|
103
|
-
<DxcInset space="2rem">
|
|
104
|
-
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse malesuada lacus ex, sit amet blandit
|
|
105
|
-
leo lobortis eget.
|
|
106
|
-
</DxcInset>
|
|
107
|
-
</DxcAccordionGroup.Accordion>
|
|
108
|
-
</DxcAccordionGroup>
|
|
109
|
-
</ExampleContainer>
|
|
110
|
-
<Title title="Margins" theme="light" level={2} />
|
|
111
|
-
<ExampleContainer>
|
|
112
|
-
<Title title="Xxsmall" theme="light" level={4} />
|
|
113
|
-
<DxcAccordionGroup margin="xxsmall">
|
|
114
|
-
<DxcAccordionGroup.Accordion label="Accordion12">
|
|
115
|
-
<DxcInset space="2rem">
|
|
116
|
-
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et
|
|
117
|
-
dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex
|
|
118
|
-
ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat
|
|
119
|
-
nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit
|
|
120
|
-
anim id est laborum.
|
|
121
|
-
</DxcInset>
|
|
122
|
-
</DxcAccordionGroup.Accordion>
|
|
123
|
-
<DxcAccordionGroup.Accordion label="Accordion13">
|
|
124
|
-
<DxcInset space="2rem">
|
|
125
|
-
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse malesuada lacus ex, sit amet blandit
|
|
126
|
-
leo lobortis eget.
|
|
127
|
-
</DxcInset>
|
|
128
|
-
</DxcAccordionGroup.Accordion>
|
|
129
|
-
</DxcAccordionGroup>
|
|
130
|
-
</ExampleContainer>
|
|
131
|
-
<ExampleContainer>
|
|
132
|
-
<Title title="Xsmall" theme="light" level={4} />
|
|
133
|
-
<DxcAccordionGroup margin="xsmall">
|
|
134
|
-
<DxcAccordionGroup.Accordion label="Accordion14">
|
|
135
|
-
<DxcInset space="2rem">
|
|
136
|
-
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et
|
|
137
|
-
dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex
|
|
138
|
-
ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat
|
|
139
|
-
nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit
|
|
140
|
-
anim id est laborum.
|
|
141
|
-
</DxcInset>
|
|
142
|
-
</DxcAccordionGroup.Accordion>
|
|
143
|
-
<DxcAccordionGroup.Accordion label="Accordion15">
|
|
144
|
-
<DxcInset space="2rem">
|
|
145
|
-
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse malesuada lacus ex, sit amet blandit
|
|
146
|
-
leo lobortis eget.
|
|
147
|
-
</DxcInset>
|
|
148
|
-
</DxcAccordionGroup.Accordion>
|
|
149
|
-
</DxcAccordionGroup>
|
|
150
|
-
</ExampleContainer>
|
|
151
|
-
<ExampleContainer>
|
|
152
|
-
<Title title="Small" theme="light" level={4} />
|
|
153
|
-
<DxcAccordionGroup margin="small">
|
|
154
|
-
<DxcAccordionGroup.Accordion label="Accordion16">
|
|
155
|
-
<DxcInset space="2rem">
|
|
156
|
-
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et
|
|
157
|
-
dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex
|
|
158
|
-
ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat
|
|
159
|
-
nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit
|
|
160
|
-
anim id est laborum.
|
|
161
|
-
</DxcInset>
|
|
162
|
-
</DxcAccordionGroup.Accordion>
|
|
163
|
-
<DxcAccordionGroup.Accordion label="Accordion17">
|
|
164
|
-
<DxcInset space="2rem">
|
|
165
|
-
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse malesuada lacus ex, sit amet blandit
|
|
166
|
-
leo lobortis eget.
|
|
167
|
-
</DxcInset>
|
|
168
|
-
</DxcAccordionGroup.Accordion>
|
|
169
|
-
</DxcAccordionGroup>
|
|
170
|
-
</ExampleContainer>
|
|
171
|
-
<ExampleContainer>
|
|
172
|
-
<Title title="Medium" theme="light" level={4} />
|
|
173
|
-
<DxcAccordionGroup margin="medium">
|
|
174
|
-
<DxcAccordionGroup.Accordion label="Accordion18">
|
|
175
|
-
<DxcInset space="2rem">
|
|
176
|
-
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et
|
|
177
|
-
dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex
|
|
178
|
-
ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat
|
|
179
|
-
nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit
|
|
180
|
-
anim id est laborum.
|
|
181
|
-
</DxcInset>
|
|
182
|
-
</DxcAccordionGroup.Accordion>
|
|
183
|
-
<DxcAccordionGroup.Accordion label="Accordion19">
|
|
184
|
-
<DxcInset space="2rem">
|
|
185
|
-
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse malesuada lacus ex, sit amet blandit
|
|
186
|
-
leo lobortis eget.
|
|
187
|
-
</DxcInset>
|
|
188
|
-
</DxcAccordionGroup.Accordion>
|
|
189
|
-
</DxcAccordionGroup>
|
|
190
|
-
</ExampleContainer>
|
|
191
|
-
<ExampleContainer>
|
|
192
|
-
<Title title="Large" theme="light" level={4} />
|
|
193
|
-
<DxcAccordionGroup margin="large">
|
|
194
|
-
<DxcAccordionGroup.Accordion label="Accordion20">
|
|
195
|
-
<DxcInset space="2rem">
|
|
196
|
-
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et
|
|
197
|
-
dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex
|
|
198
|
-
ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat
|
|
199
|
-
nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit
|
|
200
|
-
anim id est laborum.
|
|
201
|
-
</DxcInset>
|
|
202
|
-
</DxcAccordionGroup.Accordion>
|
|
203
|
-
<DxcAccordionGroup.Accordion label="Accordion21">
|
|
204
|
-
<DxcInset space="2rem">
|
|
205
|
-
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse malesuada lacus ex, sit amet blandit
|
|
206
|
-
leo lobortis eget.
|
|
207
|
-
</DxcInset>
|
|
208
|
-
</DxcAccordionGroup.Accordion>
|
|
209
|
-
</DxcAccordionGroup>
|
|
210
|
-
</ExampleContainer>
|
|
211
|
-
<ExampleContainer>
|
|
212
|
-
<Title title="Xlarge" theme="light" level={4} />
|
|
213
|
-
<DxcAccordionGroup margin="xlarge">
|
|
214
|
-
<DxcAccordionGroup.Accordion label="Accordion22">
|
|
215
|
-
<DxcInset space="2rem">
|
|
216
|
-
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et
|
|
217
|
-
dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex
|
|
218
|
-
ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat
|
|
219
|
-
nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit
|
|
220
|
-
anim id est laborum.
|
|
221
|
-
</DxcInset>
|
|
222
|
-
</DxcAccordionGroup.Accordion>
|
|
223
|
-
<DxcAccordionGroup.Accordion label="Accordion23">
|
|
224
|
-
<DxcInset space="2rem">
|
|
225
|
-
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse malesuada lacus ex, sit amet blandit
|
|
226
|
-
leo lobortis eget.
|
|
227
|
-
</DxcInset>
|
|
228
|
-
</DxcAccordionGroup.Accordion>
|
|
229
|
-
</DxcAccordionGroup>
|
|
230
|
-
</ExampleContainer>
|
|
231
|
-
<ExampleContainer>
|
|
232
|
-
<Title title="Xxlarge" theme="light" level={4} />
|
|
233
|
-
<DxcAccordionGroup margin="xxlarge">
|
|
234
|
-
<DxcAccordionGroup.Accordion label="Accordion24">
|
|
235
|
-
<DxcInset space="2rem">
|
|
236
|
-
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et
|
|
237
|
-
dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex
|
|
238
|
-
ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat
|
|
239
|
-
nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit
|
|
240
|
-
anim id est laborum.
|
|
241
|
-
</DxcInset>
|
|
242
|
-
</DxcAccordionGroup.Accordion>
|
|
243
|
-
<DxcAccordionGroup.Accordion label="Accordion25">
|
|
244
|
-
<DxcInset space="2rem">
|
|
245
|
-
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse malesuada lacus ex, sit amet blandit
|
|
246
|
-
leo lobortis eget.
|
|
247
|
-
</DxcInset>
|
|
248
|
-
</DxcAccordionGroup.Accordion>
|
|
249
|
-
</DxcAccordionGroup>
|
|
250
|
-
</ExampleContainer>
|
|
251
|
-
</>
|
|
252
|
-
);
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
|
@@ -1,94 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
var _react = _interopRequireDefault(require("react"));
|
|
5
|
-
var _react2 = require("@testing-library/react");
|
|
6
|
-
var _AccordionGroup = _interopRequireDefault(require("./AccordionGroup"));
|
|
7
|
-
describe("Accordion component tests", function () {
|
|
8
|
-
test("Uncontrolled accordion group calls correct function on click", function () {
|
|
9
|
-
var onActiveChange = jest.fn();
|
|
10
|
-
var _render = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_AccordionGroup["default"], {
|
|
11
|
-
margin: "large",
|
|
12
|
-
onActiveChange: onActiveChange
|
|
13
|
-
}, /*#__PURE__*/_react["default"].createElement(_AccordionGroup["default"].Accordion, {
|
|
14
|
-
label: "Accordion1"
|
|
15
|
-
}, /*#__PURE__*/_react["default"].createElement("div", null, "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse malesuada lacus ex, sit amet blandit leo lobortis eget.")), /*#__PURE__*/_react["default"].createElement(_AccordionGroup["default"].Accordion, {
|
|
16
|
-
label: "Accordion2"
|
|
17
|
-
}, /*#__PURE__*/_react["default"].createElement("div", null, "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse malesuada lacus ex, sit amet blandit leo lobortis eget.")))),
|
|
18
|
-
getByText = _render.getByText,
|
|
19
|
-
getAllByRole = _render.getAllByRole;
|
|
20
|
-
expect(getAllByRole("button")[0].getAttribute("aria-expanded")).toBe("false");
|
|
21
|
-
expect(getAllByRole("button")[1].getAttribute("aria-expanded")).toBe("false");
|
|
22
|
-
_react2.fireEvent.click(getByText("Accordion1"));
|
|
23
|
-
expect(onActiveChange).toHaveBeenCalled();
|
|
24
|
-
expect(getAllByRole("button")[0].getAttribute("aria-expanded")).toBe("true");
|
|
25
|
-
expect(getAllByRole("button")[1].getAttribute("aria-expanded")).toBe("false");
|
|
26
|
-
});
|
|
27
|
-
test("Uncontrolled accordion group renders initially with an accordion expanded using defaultIndexActive", function () {
|
|
28
|
-
var _render2 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_AccordionGroup["default"], {
|
|
29
|
-
defaultIndexActive: 1
|
|
30
|
-
}, /*#__PURE__*/_react["default"].createElement(_AccordionGroup["default"].Accordion, {
|
|
31
|
-
label: "Accordion1"
|
|
32
|
-
}, /*#__PURE__*/_react["default"].createElement("div", null, "First accordion")), /*#__PURE__*/_react["default"].createElement(_AccordionGroup["default"].Accordion, {
|
|
33
|
-
label: "Accordion2"
|
|
34
|
-
}, /*#__PURE__*/_react["default"].createElement("div", null, "Second accordion")))),
|
|
35
|
-
queryByText = _render2.queryByText,
|
|
36
|
-
getByText = _render2.getByText,
|
|
37
|
-
getAllByRole = _render2.getAllByRole;
|
|
38
|
-
expect(getAllByRole("button")[0].getAttribute("aria-expanded")).toBe("false");
|
|
39
|
-
expect(getAllByRole("button")[1].getAttribute("aria-expanded")).toBe("true");
|
|
40
|
-
expect(getByText("Second accordion")).toBeTruthy();
|
|
41
|
-
expect(queryByText("First accordion")).toBeFalsy();
|
|
42
|
-
});
|
|
43
|
-
test("Controlled accordion with indexActive change", function () {
|
|
44
|
-
var onActiveChange = jest.fn();
|
|
45
|
-
var _render3 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_AccordionGroup["default"], {
|
|
46
|
-
margin: "large",
|
|
47
|
-
indexActive: 1,
|
|
48
|
-
onActiveChange: onActiveChange
|
|
49
|
-
}, /*#__PURE__*/_react["default"].createElement(_AccordionGroup["default"].Accordion, {
|
|
50
|
-
label: "Accordion1"
|
|
51
|
-
}, /*#__PURE__*/_react["default"].createElement("div", null, "Text1")), /*#__PURE__*/_react["default"].createElement(_AccordionGroup["default"].Accordion, {
|
|
52
|
-
label: "Accordion2"
|
|
53
|
-
}, /*#__PURE__*/_react["default"].createElement("div", null, "Text2")))),
|
|
54
|
-
queryByText = _render3.queryByText,
|
|
55
|
-
getByText = _render3.getByText,
|
|
56
|
-
getAllByRole = _render3.getAllByRole,
|
|
57
|
-
rerender = _render3.rerender;
|
|
58
|
-
expect(queryByText("Text1")).toBeFalsy();
|
|
59
|
-
expect(getByText("Text2")).toBeTruthy();
|
|
60
|
-
_react2.fireEvent.click(getByText("Accordion1"));
|
|
61
|
-
_react2.fireEvent.click(getByText("Accordion2"));
|
|
62
|
-
expect(onActiveChange.mock.calls[0][0]).toBe(0);
|
|
63
|
-
expect(onActiveChange.mock.calls[1][0]).toBe(1);
|
|
64
|
-
expect(getAllByRole("button")[0].getAttribute("aria-expanded")).toBe("false");
|
|
65
|
-
expect(getAllByRole("button")[1].getAttribute("aria-expanded")).toBe("true");
|
|
66
|
-
rerender( /*#__PURE__*/_react["default"].createElement(_AccordionGroup["default"], {
|
|
67
|
-
margin: "large",
|
|
68
|
-
indexActive: 0,
|
|
69
|
-
onActiveChange: onActiveChange
|
|
70
|
-
}, /*#__PURE__*/_react["default"].createElement(_AccordionGroup["default"].Accordion, {
|
|
71
|
-
label: "Accordion1"
|
|
72
|
-
}, /*#__PURE__*/_react["default"].createElement("div", null, "Text1")), /*#__PURE__*/_react["default"].createElement(_AccordionGroup["default"].Accordion, {
|
|
73
|
-
label: "Accordion2"
|
|
74
|
-
}, /*#__PURE__*/_react["default"].createElement("div", null, "Text2"))));
|
|
75
|
-
expect(getAllByRole("button")[0].getAttribute("aria-expanded")).toBe("true");
|
|
76
|
-
expect(getAllByRole("button")[1].getAttribute("aria-expanded")).toBe("false");
|
|
77
|
-
});
|
|
78
|
-
test("Disabled uncontrolled accordion group", function () {
|
|
79
|
-
var onActiveChange = jest.fn();
|
|
80
|
-
var _render4 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_AccordionGroup["default"], {
|
|
81
|
-
margin: "large",
|
|
82
|
-
onActiveChange: onActiveChange,
|
|
83
|
-
disabled: true
|
|
84
|
-
}, /*#__PURE__*/_react["default"].createElement(_AccordionGroup["default"].Accordion, {
|
|
85
|
-
label: "Accordion1"
|
|
86
|
-
}, /*#__PURE__*/_react["default"].createElement("div", null, "Text1")), /*#__PURE__*/_react["default"].createElement(_AccordionGroup["default"].Accordion, {
|
|
87
|
-
label: "Accordion2"
|
|
88
|
-
}, /*#__PURE__*/_react["default"].createElement("div", null, "Text2")))),
|
|
89
|
-
getByText = _render4.getByText;
|
|
90
|
-
_react2.fireEvent.click(getByText("Accordion1"));
|
|
91
|
-
_react2.fireEvent.click(getByText("Accordion2"));
|
|
92
|
-
expect(onActiveChange).toHaveBeenCalledTimes(0);
|
|
93
|
-
});
|
|
94
|
-
});
|
|
@@ -1,31 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
5
|
-
Object.defineProperty(exports, "__esModule", {
|
|
6
|
-
value: true
|
|
7
|
-
});
|
|
8
|
-
exports["default"] = void 0;
|
|
9
|
-
var _objectDestructuringEmpty2 = _interopRequireDefault(require("@babel/runtime/helpers/objectDestructuringEmpty"));
|
|
10
|
-
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
11
|
-
var _react = _interopRequireWildcard(require("react"));
|
|
12
|
-
var _Accordion = _interopRequireDefault(require("../accordion/Accordion"));
|
|
13
|
-
var _AccordionGroupContext = require("./AccordionGroupContext");
|
|
14
|
-
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
15
|
-
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
|
|
16
|
-
var AccordionGroupAccordion = function AccordionGroupAccordion(_ref) {
|
|
17
|
-
var childProps = (0, _extends2["default"])({}, ((0, _objectDestructuringEmpty2["default"])(_ref), _ref));
|
|
18
|
-
var _useContext = (0, _react.useContext)(_AccordionGroupContext.AccordionGroupAccordionContext),
|
|
19
|
-
activeIndex = _useContext.activeIndex,
|
|
20
|
-
handlerActiveChange = _useContext.handlerActiveChange,
|
|
21
|
-
disabled = _useContext.disabled,
|
|
22
|
-
index = _useContext.index;
|
|
23
|
-
return /*#__PURE__*/_react["default"].createElement(_Accordion["default"], (0, _extends2["default"])({
|
|
24
|
-
isExpanded: activeIndex === index,
|
|
25
|
-
onChange: function onChange() {
|
|
26
|
-
handlerActiveChange(index);
|
|
27
|
-
},
|
|
28
|
-
disabled: disabled
|
|
29
|
-
}, childProps), childProps.children);
|
|
30
|
-
};
|
|
31
|
-
var _default = exports["default"] = AccordionGroupAccordion;
|
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.AccordionGroupAccordionContext = void 0;
|
|
7
|
-
var _react = require("react");
|
|
8
|
-
var AccordionGroupAccordionContext = exports.AccordionGroupAccordionContext = /*#__PURE__*/(0, _react.createContext)(null);
|
|
@@ -1,67 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
|
|
3
|
-
type Margin = {
|
|
4
|
-
top?: Space;
|
|
5
|
-
bottom?: Space;
|
|
6
|
-
left?: Space;
|
|
7
|
-
right?: Space;
|
|
8
|
-
};
|
|
9
|
-
type SVG = React.ReactNode & React.SVGProps<SVGSVGElement>;
|
|
10
|
-
export type AccordionPropsType = {
|
|
11
|
-
/**
|
|
12
|
-
* The panel label.
|
|
13
|
-
*/
|
|
14
|
-
label: string;
|
|
15
|
-
/**
|
|
16
|
-
* Material Symbol name or SVG element used as the icon that will be placed next to panel label.
|
|
17
|
-
*/
|
|
18
|
-
icon?: string | SVG;
|
|
19
|
-
/**
|
|
20
|
-
* Assistive text to be placed on the right side of the panel.
|
|
21
|
-
*/
|
|
22
|
-
assistiveText?: string;
|
|
23
|
-
/**
|
|
24
|
-
* If true, the component will be disabled.
|
|
25
|
-
*/
|
|
26
|
-
disabled?: boolean;
|
|
27
|
-
/**
|
|
28
|
-
* The expanded panel of the accordion. This area can be used to render
|
|
29
|
-
* custom content.
|
|
30
|
-
*/
|
|
31
|
-
children: React.ReactNode;
|
|
32
|
-
};
|
|
33
|
-
type Props = {
|
|
34
|
-
/**
|
|
35
|
-
* Initially active accordion, only when it is uncontrolled.
|
|
36
|
-
*/
|
|
37
|
-
defaultIndexActive?: number;
|
|
38
|
-
/**
|
|
39
|
-
* The index of the active accordion. If undefined, the component will be uncontrolled and the active accordion will be managed internally by the component.
|
|
40
|
-
* If null, the component will be controlled and all accordions will be closed.
|
|
41
|
-
*/
|
|
42
|
-
indexActive?: number;
|
|
43
|
-
/**
|
|
44
|
-
* If true, the component will be disabled.
|
|
45
|
-
*/
|
|
46
|
-
disabled?: boolean;
|
|
47
|
-
/**
|
|
48
|
-
* This function will be called when the user clicks on an accordion. The index of the clicked accordion will be passed as a parameter.
|
|
49
|
-
*/
|
|
50
|
-
onActiveChange?: (indexActive: number) => void;
|
|
51
|
-
/**
|
|
52
|
-
* Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
|
|
53
|
-
* You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
|
|
54
|
-
*/
|
|
55
|
-
margin?: Space | Margin;
|
|
56
|
-
/**
|
|
57
|
-
* Customized accordion(s) that are allowed inside an Accordion Group.
|
|
58
|
-
*/
|
|
59
|
-
children: React.ReactElement<AccordionPropsType>[] | React.ReactElement<AccordionPropsType>;
|
|
60
|
-
};
|
|
61
|
-
export type AccordionGroupAccordionContextProps = {
|
|
62
|
-
activeIndex: number;
|
|
63
|
-
handlerActiveChange: (index: number) => void;
|
|
64
|
-
disabled: boolean;
|
|
65
|
-
index: number;
|
|
66
|
-
};
|
|
67
|
-
export default Props;
|
package/accordion-group/types.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
|
@@ -1,63 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
|
|
5
|
-
var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
|
|
6
|
-
var _react = _interopRequireDefault(require("react"));
|
|
7
|
-
var _react2 = require("@testing-library/react");
|
|
8
|
-
var _ActionIcon = _interopRequireDefault(require("./ActionIcon"));
|
|
9
|
-
var _axeHelper = require("../../test/accessibility/axe-helper.js");
|
|
10
|
-
var iconSVG = /*#__PURE__*/_react["default"].createElement("svg", {
|
|
11
|
-
width: "24px",
|
|
12
|
-
height: "24px",
|
|
13
|
-
viewBox: "0 0 24 24",
|
|
14
|
-
fill: "currentColor"
|
|
15
|
-
}, /*#__PURE__*/_react["default"].createElement("path", {
|
|
16
|
-
d: "M0 0h24v24H0z",
|
|
17
|
-
fill: "none"
|
|
18
|
-
}), /*#__PURE__*/_react["default"].createElement("path", {
|
|
19
|
-
d: "M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z"
|
|
20
|
-
}));
|
|
21
|
-
describe("Action icon component accessibility tests", function () {
|
|
22
|
-
it("Should not have basic accessibility issues", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee() {
|
|
23
|
-
var _render, container, results;
|
|
24
|
-
return _regenerator["default"].wrap(function _callee$(_context) {
|
|
25
|
-
while (1) switch (_context.prev = _context.next) {
|
|
26
|
-
case 0:
|
|
27
|
-
_render = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_ActionIcon["default"], {
|
|
28
|
-
icon: iconSVG,
|
|
29
|
-
title: "favourite"
|
|
30
|
-
})), container = _render.container;
|
|
31
|
-
_context.next = 3;
|
|
32
|
-
return (0, _axeHelper.axe)(container);
|
|
33
|
-
case 3:
|
|
34
|
-
results = _context.sent;
|
|
35
|
-
expect(results).toHaveNoViolations();
|
|
36
|
-
case 5:
|
|
37
|
-
case "end":
|
|
38
|
-
return _context.stop();
|
|
39
|
-
}
|
|
40
|
-
}, _callee);
|
|
41
|
-
})));
|
|
42
|
-
it("Should not have basic accessibility issues for disabled mode", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee2() {
|
|
43
|
-
var _render2, container, results;
|
|
44
|
-
return _regenerator["default"].wrap(function _callee2$(_context2) {
|
|
45
|
-
while (1) switch (_context2.prev = _context2.next) {
|
|
46
|
-
case 0:
|
|
47
|
-
_render2 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_ActionIcon["default"], {
|
|
48
|
-
icon: iconSVG,
|
|
49
|
-
title: "disabled",
|
|
50
|
-
disabled: true
|
|
51
|
-
})), container = _render2.container;
|
|
52
|
-
_context2.next = 3;
|
|
53
|
-
return (0, _axeHelper.axe)(container);
|
|
54
|
-
case 3:
|
|
55
|
-
results = _context2.sent;
|
|
56
|
-
expect(results).toHaveNoViolations();
|
|
57
|
-
case 5:
|
|
58
|
-
case "end":
|
|
59
|
-
return _context2.stop();
|
|
60
|
-
}
|
|
61
|
-
}, _callee2);
|
|
62
|
-
})));
|
|
63
|
-
});
|