@simplybusiness/mobius 3.9.2 → 3.9.4
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 +15 -0
- package/dist/cjs/components/Button/Button.stories.d.ts +4 -0
- package/dist/cjs/components/Button/Button.stories.js +18 -1
- package/dist/cjs/components/Button/Button.stories.js.map +1 -1
- package/dist/cjs/components/Segment/Segment.stories.d.ts +10 -0
- package/dist/cjs/components/Segment/Segment.stories.js +47 -1
- package/dist/cjs/components/Segment/Segment.stories.js.map +1 -1
- package/dist/cjs/components/Text/Text.stories.d.ts +5 -0
- package/dist/cjs/components/Text/Text.stories.js +9 -1
- package/dist/cjs/components/Text/Text.stories.js.map +1 -1
- package/dist/cjs/components/TextField/TextField.stories.d.ts +3 -0
- package/dist/cjs/components/TextField/TextField.stories.js +5 -1
- package/dist/cjs/components/TextField/TextField.stories.js.map +1 -1
- package/dist/cjs/tsconfig.tsbuildinfo +1 -1
- package/dist/esm/tsconfig.esm.tsbuildinfo +1 -1
- package/package.json +2 -1
- package/src/components/Accordion/Accordion.mdx +3 -4
- package/src/components/Alert/Alert.mdx +4 -8
- package/src/components/Box/Box.mdx +4 -8
- package/src/components/Breadcrumbs/Breadcrumbs.mdx +2 -2
- package/src/components/Button/Button.mdx +17 -79
- package/src/components/Button/Button.stories.tsx +27 -0
- package/src/components/Checkbox/Checkbox.mdx +9 -23
- package/src/components/Checkbox/CheckboxGroup.mdx +7 -17
- package/src/components/Chopin/Actions/Actions.mdx +3 -5
- package/src/components/Chopin/Footer/Footer.mdx +2 -2
- package/src/components/Chopin/Header/Header.mdx +2 -2
- package/src/components/Chopin/PercentageTotalsQuestion/PercentageTotalsQuestion.mdx +3 -5
- package/src/components/Chopin/Question/Question.mdx +2 -2
- package/src/components/Chopin/QuestionGroup/QuestionGroup.mdx +2 -2
- package/src/components/Chopin/Section/Section.mdx +2 -2
- package/src/components/Chopin/Steps/Steps.mdx +2 -2
- package/src/components/Chopin/Testimonial/Testimonial.mdx +3 -5
- package/src/components/Chopin/TradeSelector/TradeSelector.mdx +2 -2
- package/src/components/Container/Container.mdx +3 -5
- package/src/components/DataTable/DataTable.mdx +7 -17
- package/src/components/DatePicker/DatePicker.mdx +2 -2
- package/src/components/Divider/Divider.mdx +3 -5
- package/src/components/DropdownMenu/DropdownMenu.mdx +4 -8
- package/src/components/ErrorMessage/ErrorMessage.mdx +3 -7
- package/src/components/Fieldset/Fieldset.mdx +4 -8
- package/src/components/Flex/Flex.mdx +2 -2
- package/src/components/Grid/Grid.mdx +35 -69
- package/src/components/Icon/Icon.mdx +2 -2
- package/src/components/Image/Image.mdx +3 -5
- package/src/components/Label/Label.mdx +3 -5
- package/src/components/Link/Link.mdx +4 -8
- package/src/components/LinkButton/LinkButton.mdx +3 -5
- package/src/components/List/List.mdx +2 -2
- package/src/components/LoadingIndicator/LoadingIndicator.mdx +2 -2
- package/src/components/MaskedField/MaskedField.mdx +3 -5
- package/src/components/Modal/Modal.mdx +2 -2
- package/src/components/NumberField/NumberField.mdx +25 -20
- package/src/components/PasswordField/PasswordField.mdx +3 -5
- package/src/components/Progress/Progress.mdx +6 -14
- package/src/components/Radio/Radio.mdx +9 -23
- package/src/components/Radio/RadioButton.mdx +10 -26
- package/src/components/SVG/SVG.mdx +2 -2
- package/src/components/Segment/Segment.mdx +31 -240
- package/src/components/Segment/Segment.stories.tsx +205 -2
- package/src/components/Select/Select.mdx +2 -2
- package/src/components/Slider/Slider.mdx +5 -13
- package/src/components/Table/Table.mdx +4 -8
- package/src/components/Text/Text.mdx +6 -114
- package/src/components/Text/Text.stories.tsx +102 -0
- package/src/components/TextArea/TextArea.mdx +8 -20
- package/src/components/TextField/TextField.mdx +10 -35
- package/src/components/TextField/TextField.stories.tsx +13 -0
- package/src/components/Title/Title.mdx +3 -5
- package/src/components/VisuallyHidden/VisuallyHidden.mdx +2 -4
- package/src/hooks/useBreakpoint/useBreakpoint.mdx +3 -7
- package/dist/esm/components/Accordion/Accordion.stories.js +0 -45
- package/dist/esm/components/Accordion/Accordion.stories.js.map +0 -1
- package/dist/esm/components/Accordion/Accordion.test.js +0 -65
- package/dist/esm/components/Accordion/Accordion.test.js.map +0 -1
- package/dist/esm/components/Alert/Alert.stories.js +0 -32
- package/dist/esm/components/Alert/Alert.stories.js.map +0 -1
- package/dist/esm/components/Alert/Alert.test.js +0 -48
- package/dist/esm/components/Alert/Alert.test.js.map +0 -1
- package/dist/esm/components/Box/Box.stories.js +0 -20
- package/dist/esm/components/Box/Box.stories.js.map +0 -1
- package/dist/esm/components/Box/Box.test.js +0 -31
- package/dist/esm/components/Box/Box.test.js.map +0 -1
- package/dist/esm/components/Breadcrumbs/Breadcrumbs.stories.js +0 -17
- package/dist/esm/components/Breadcrumbs/Breadcrumbs.stories.js.map +0 -1
- package/dist/esm/components/Breadcrumbs/Breadcrumbs.test.js +0 -33
- package/dist/esm/components/Breadcrumbs/Breadcrumbs.test.js.map +0 -1
- package/dist/esm/components/Button/Button.stories.js +0 -198
- package/dist/esm/components/Button/Button.stories.js.map +0 -1
- package/dist/esm/components/Button/Button.test.js +0 -81
- package/dist/esm/components/Button/Button.test.js.map +0 -1
- package/dist/esm/components/Checkbox/Checkbox.stories.js +0 -98
- package/dist/esm/components/Checkbox/Checkbox.stories.js.map +0 -1
- package/dist/esm/components/Checkbox/Checkbox.test.js +0 -108
- package/dist/esm/components/Checkbox/Checkbox.test.js.map +0 -1
- package/dist/esm/components/Checkbox/CheckboxGroup.stories.js +0 -71
- package/dist/esm/components/Checkbox/CheckboxGroup.stories.js.map +0 -1
- package/dist/esm/components/Checkbox/CheckboxGroup.test.js +0 -44
- package/dist/esm/components/Checkbox/CheckboxGroup.test.js.map +0 -1
- package/dist/esm/components/Chopin/Actions/Actions.stories.js +0 -56
- package/dist/esm/components/Chopin/Actions/Actions.stories.js.map +0 -1
- package/dist/esm/components/Chopin/Actions/Actions.test.js +0 -95
- package/dist/esm/components/Chopin/Actions/Actions.test.js.map +0 -1
- package/dist/esm/components/Chopin/Actions/LinkOrButton.test.js +0 -33
- package/dist/esm/components/Chopin/Actions/LinkOrButton.test.js.map +0 -1
- package/dist/esm/components/Chopin/Footer/Footer.stories.js +0 -166
- package/dist/esm/components/Chopin/Footer/Footer.stories.js.map +0 -1
- package/dist/esm/components/Chopin/Footer/Footer.test.js +0 -90
- package/dist/esm/components/Chopin/Footer/Footer.test.js.map +0 -1
- package/dist/esm/components/Chopin/Header/Header.stories.js +0 -38
- package/dist/esm/components/Chopin/Header/Header.stories.js.map +0 -1
- package/dist/esm/components/Chopin/Header/Header.test.js +0 -86
- package/dist/esm/components/Chopin/Header/Header.test.js.map +0 -1
- package/dist/esm/components/Chopin/PercentageTotalsQuestion/PercentageTotalsQuestion.stories.js +0 -43
- package/dist/esm/components/Chopin/PercentageTotalsQuestion/PercentageTotalsQuestion.stories.js.map +0 -1
- package/dist/esm/components/Chopin/PercentageTotalsQuestion/PercentageTotalsQuestion.test.js +0 -108
- package/dist/esm/components/Chopin/PercentageTotalsQuestion/PercentageTotalsQuestion.test.js.map +0 -1
- package/dist/esm/components/Chopin/Question/Question.stories.js +0 -136
- package/dist/esm/components/Chopin/Question/Question.stories.js.map +0 -1
- package/dist/esm/components/Chopin/Question/Question.test.js +0 -116
- package/dist/esm/components/Chopin/Question/Question.test.js.map +0 -1
- package/dist/esm/components/Chopin/QuestionGroup/QuestionGroup.stories.js +0 -40
- package/dist/esm/components/Chopin/QuestionGroup/QuestionGroup.stories.js.map +0 -1
- package/dist/esm/components/Chopin/QuestionGroup/QuestionGroup.test.js +0 -62
- package/dist/esm/components/Chopin/QuestionGroup/QuestionGroup.test.js.map +0 -1
- package/dist/esm/components/Chopin/QuestionHelp/QuestionHelp.test.js +0 -41
- package/dist/esm/components/Chopin/QuestionHelp/QuestionHelp.test.js.map +0 -1
- package/dist/esm/components/Chopin/Section/Section.stories.js +0 -16
- package/dist/esm/components/Chopin/Section/Section.stories.js.map +0 -1
- package/dist/esm/components/Chopin/Section/Section.test.js +0 -35
- package/dist/esm/components/Chopin/Section/Section.test.js.map +0 -1
- package/dist/esm/components/Chopin/Steps/Steps.stories.js +0 -12
- package/dist/esm/components/Chopin/Steps/Steps.stories.js.map +0 -1
- package/dist/esm/components/Chopin/Steps/Steps.test.js +0 -93
- package/dist/esm/components/Chopin/Steps/Steps.test.js.map +0 -1
- package/dist/esm/components/Chopin/Testimonial/Testimonial.stories.js +0 -15
- package/dist/esm/components/Chopin/Testimonial/Testimonial.stories.js.map +0 -1
- package/dist/esm/components/Chopin/Testimonial/Testimonial.test.js +0 -35
- package/dist/esm/components/Chopin/Testimonial/Testimonial.test.js.map +0 -1
- package/dist/esm/components/Chopin/TradeSelector/Listing/Listing.test.js +0 -26
- package/dist/esm/components/Chopin/TradeSelector/Listing/Listing.test.js.map +0 -1
- package/dist/esm/components/Chopin/TradeSelector/Listing/ListingItem.test.js +0 -37
- package/dist/esm/components/Chopin/TradeSelector/Listing/ListingItem.test.js.map +0 -1
- package/dist/esm/components/Chopin/TradeSelector/SearchResults/SearchResults.test.js +0 -86
- package/dist/esm/components/Chopin/TradeSelector/SearchResults/SearchResults.test.js.map +0 -1
- package/dist/esm/components/Chopin/TradeSelector/TradeInput/TradeInput.test.js +0 -52
- package/dist/esm/components/Chopin/TradeSelector/TradeInput/TradeInput.test.js.map +0 -1
- package/dist/esm/components/Chopin/TradeSelector/TradeSelector.stories.js +0 -52
- package/dist/esm/components/Chopin/TradeSelector/TradeSelector.stories.js.map +0 -1
- package/dist/esm/components/Chopin/TradeSelector/TradeSelector.test.js +0 -226
- package/dist/esm/components/Chopin/TradeSelector/TradeSelector.test.js.map +0 -1
- package/dist/esm/components/Container/Container.stories.js +0 -12
- package/dist/esm/components/Container/Container.stories.js.map +0 -1
- package/dist/esm/components/Container/Container.test.js +0 -37
- package/dist/esm/components/Container/Container.test.js.map +0 -1
- package/dist/esm/components/DataTable/DataTable.stories.js +0 -174
- package/dist/esm/components/DataTable/DataTable.stories.js.map +0 -1
- package/dist/esm/components/DataTable/DataTable.test.js +0 -119
- package/dist/esm/components/DataTable/DataTable.test.js.map +0 -1
- package/dist/esm/components/DatePicker/DatePicker.stories.js +0 -25
- package/dist/esm/components/DatePicker/DatePicker.stories.js.map +0 -1
- package/dist/esm/components/Divider/Divider.stories.js +0 -12
- package/dist/esm/components/Divider/Divider.stories.js.map +0 -1
- package/dist/esm/components/DropdownMenu/DropdownMenu.stories.js +0 -58
- package/dist/esm/components/DropdownMenu/DropdownMenu.stories.js.map +0 -1
- package/dist/esm/components/DropdownMenu/DropdownMenu.test.js +0 -95
- package/dist/esm/components/DropdownMenu/DropdownMenu.test.js.map +0 -1
- package/dist/esm/components/ErrorMessage/ErrorMessage.stories.js +0 -21
- package/dist/esm/components/ErrorMessage/ErrorMessage.stories.js.map +0 -1
- package/dist/esm/components/ErrorMessage/ErrorMessage.test.js +0 -30
- package/dist/esm/components/ErrorMessage/ErrorMessage.test.js.map +0 -1
- package/dist/esm/components/Fieldset/Fieldset.stories.js +0 -22
- package/dist/esm/components/Fieldset/Fieldset.stories.js.map +0 -1
- package/dist/esm/components/Fieldset/Fieldset.test.js +0 -10
- package/dist/esm/components/Fieldset/Fieldset.test.js.map +0 -1
- package/dist/esm/components/Flex/Flex.stories.js +0 -148
- package/dist/esm/components/Flex/Flex.stories.js.map +0 -1
- package/dist/esm/components/Flex/Flex.test.js +0 -31
- package/dist/esm/components/Flex/Flex.test.js.map +0 -1
- package/dist/esm/components/Grid/Grid.stories.js +0 -227
- package/dist/esm/components/Grid/Grid.stories.js.map +0 -1
- package/dist/esm/components/Grid/Grid.test.js +0 -95
- package/dist/esm/components/Grid/Grid.test.js.map +0 -1
- package/dist/esm/components/Icon/Icon.stories.js +0 -43
- package/dist/esm/components/Icon/Icon.stories.js.map +0 -1
- package/dist/esm/components/Icon/Icon.test.js +0 -52
- package/dist/esm/components/Icon/Icon.test.js.map +0 -1
- package/dist/esm/components/Image/Image.stories.js +0 -17
- package/dist/esm/components/Image/Image.stories.js.map +0 -1
- package/dist/esm/components/Image/Image.test.js +0 -37
- package/dist/esm/components/Image/Image.test.js.map +0 -1
- package/dist/esm/components/Label/Label.stories.js +0 -15
- package/dist/esm/components/Label/Label.stories.js.map +0 -1
- package/dist/esm/components/Label/Label.test.js +0 -35
- package/dist/esm/components/Label/Label.test.js.map +0 -1
- package/dist/esm/components/Link/Link.stories.js +0 -41
- package/dist/esm/components/Link/Link.stories.js.map +0 -1
- package/dist/esm/components/Link/Link.test.js +0 -65
- package/dist/esm/components/Link/Link.test.js.map +0 -1
- package/dist/esm/components/LinkButton/LinkButton.stories.js +0 -42
- package/dist/esm/components/LinkButton/LinkButton.stories.js.map +0 -1
- package/dist/esm/components/LinkButton/LinkButton.test.js +0 -62
- package/dist/esm/components/LinkButton/LinkButton.test.js.map +0 -1
- package/dist/esm/components/List/List.stories.js +0 -77
- package/dist/esm/components/List/List.stories.js.map +0 -1
- package/dist/esm/components/List/List.test.js +0 -93
- package/dist/esm/components/List/List.test.js.map +0 -1
- package/dist/esm/components/LoadingIndicator/LoadingIndicator.stories.js +0 -50
- package/dist/esm/components/LoadingIndicator/LoadingIndicator.stories.js.map +0 -1
- package/dist/esm/components/LoadingIndicator/LoadingIndicator.test.js +0 -27
- package/dist/esm/components/LoadingIndicator/LoadingIndicator.test.js.map +0 -1
- package/dist/esm/components/MaskedField/MaskedField.stories.js +0 -22
- package/dist/esm/components/MaskedField/MaskedField.stories.js.map +0 -1
- package/dist/esm/components/MaskedField/MaskedField.test.js +0 -64
- package/dist/esm/components/MaskedField/MaskedField.test.js.map +0 -1
- package/dist/esm/components/Modal/Modal.stories.js +0 -79
- package/dist/esm/components/Modal/Modal.stories.js.map +0 -1
- package/dist/esm/components/Modal/Modal.test.js +0 -135
- package/dist/esm/components/Modal/Modal.test.js.map +0 -1
- package/dist/esm/components/NumberField/NumberField.stories.js +0 -103
- package/dist/esm/components/NumberField/NumberField.stories.js.map +0 -1
- package/dist/esm/components/NumberField/NumberField.test.js +0 -81
- package/dist/esm/components/NumberField/NumberField.test.js.map +0 -1
- package/dist/esm/components/PasswordField/PasswordField.stories.js +0 -31
- package/dist/esm/components/PasswordField/PasswordField.stories.js.map +0 -1
- package/dist/esm/components/PasswordField/PasswordField.test.js +0 -29
- package/dist/esm/components/PasswordField/PasswordField.test.js.map +0 -1
- package/dist/esm/components/Progress/Progress.stories.js +0 -89
- package/dist/esm/components/Progress/Progress.stories.js.map +0 -1
- package/dist/esm/components/Progress/Progress.test.js +0 -32
- package/dist/esm/components/Progress/Progress.test.js.map +0 -1
- package/dist/esm/components/Radio/Radio.stories.js +0 -118
- package/dist/esm/components/Radio/Radio.stories.js.map +0 -1
- package/dist/esm/components/Radio/Radio.test.js +0 -139
- package/dist/esm/components/Radio/Radio.test.js.map +0 -1
- package/dist/esm/components/Radio/RadioButton.stories.js +0 -88
- package/dist/esm/components/Radio/RadioButton.stories.js.map +0 -1
- package/dist/esm/components/Radio/RadioButton.test.js +0 -118
- package/dist/esm/components/Radio/RadioButton.test.js.map +0 -1
- package/dist/esm/components/SVG/SVG.stories.js +0 -19
- package/dist/esm/components/SVG/SVG.stories.js.map +0 -1
- package/dist/esm/components/SVG/SVG.test.js +0 -26
- package/dist/esm/components/SVG/SVG.test.js.map +0 -1
- package/dist/esm/components/Segment/Segment.stories.js +0 -75
- package/dist/esm/components/Segment/Segment.stories.js.map +0 -1
- package/dist/esm/components/Select/Select.stories.js +0 -79
- package/dist/esm/components/Select/Select.stories.js.map +0 -1
- package/dist/esm/components/Select/Select.test.js +0 -94
- package/dist/esm/components/Select/Select.test.js.map +0 -1
- package/dist/esm/components/Slider/Slider.stories.js +0 -63
- package/dist/esm/components/Slider/Slider.stories.js.map +0 -1
- package/dist/esm/components/Slider/Slider.test.js +0 -58
- package/dist/esm/components/Slider/Slider.test.js.map +0 -1
- package/dist/esm/components/Table/Table.stories.js +0 -15
- package/dist/esm/components/Table/Table.stories.js.map +0 -1
- package/dist/esm/components/Table/Table.test.js +0 -73
- package/dist/esm/components/Table/Table.test.js.map +0 -1
- package/dist/esm/components/Text/Text.stories.js +0 -26
- package/dist/esm/components/Text/Text.stories.js.map +0 -1
- package/dist/esm/components/Text/Text.test.js +0 -31
- package/dist/esm/components/Text/Text.test.js.map +0 -1
- package/dist/esm/components/TextArea/TextArea.stories.js +0 -80
- package/dist/esm/components/TextArea/TextArea.stories.js.map +0 -1
- package/dist/esm/components/TextArea/TextArea.test.js +0 -84
- package/dist/esm/components/TextArea/TextArea.test.js.map +0 -1
- package/dist/esm/components/TextAreaInput/TextAreaInput.test.js +0 -42
- package/dist/esm/components/TextAreaInput/TextAreaInput.test.js.map +0 -1
- package/dist/esm/components/TextField/TextField.stories.js +0 -100
- package/dist/esm/components/TextField/TextField.stories.js.map +0 -1
- package/dist/esm/components/TextField/TextField.test.js +0 -123
- package/dist/esm/components/TextField/TextField.test.js.map +0 -1
- package/dist/esm/components/Title/Title.stories.js +0 -16
- package/dist/esm/components/Title/Title.stories.js.map +0 -1
- package/dist/esm/components/Title/Title.test.js +0 -20
- package/dist/esm/components/Title/Title.test.js.map +0 -1
- package/dist/esm/components/VisuallyHidden/VisuallyHidden.stories.js +0 -12
- package/dist/esm/components/VisuallyHidden/VisuallyHidden.stories.js.map +0 -1
- package/dist/esm/contexts/ThemeContext/ThemeContext.test.js +0 -10
- package/dist/esm/contexts/ThemeContext/ThemeContext.test.js.map +0 -1
- package/dist/esm/hooks/useBreakpoint/useBreakpoint.stories.js +0 -40
- package/dist/esm/hooks/useBreakpoint/useBreakpoint.stories.js.map +0 -1
- package/dist/esm/hooks/useBreakpoint/useBreakpoint.test.js +0 -242
- package/dist/esm/hooks/useBreakpoint/useBreakpoint.test.js.map +0 -1
- package/dist/esm/hooks/useButton/useButton.test.js +0 -141
- package/dist/esm/hooks/useButton/useButton.test.js.map +0 -1
|
@@ -1,198 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
-
import { Button } from "./Button";
|
|
3
|
-
import { excludeControls } from "../../utils/excludeControls";
|
|
4
|
-
export default {
|
|
5
|
-
title: "Components/Button",
|
|
6
|
-
component: Button,
|
|
7
|
-
argTypes: Object.assign({ icon: {
|
|
8
|
-
options: ["", "menu", "rightArrow", "leftArrow", "dropdown", "home"],
|
|
9
|
-
control: { type: "select" },
|
|
10
|
-
}, iconPosition: {
|
|
11
|
-
if: {
|
|
12
|
-
arg: "icon",
|
|
13
|
-
},
|
|
14
|
-
}, isLoading: {
|
|
15
|
-
if: {
|
|
16
|
-
arg: "isSuccess",
|
|
17
|
-
truthy: false,
|
|
18
|
-
},
|
|
19
|
-
}, isSuccess: {
|
|
20
|
-
if: {
|
|
21
|
-
arg: "isLoading",
|
|
22
|
-
truthy: false,
|
|
23
|
-
},
|
|
24
|
-
}, href: {
|
|
25
|
-
if: {
|
|
26
|
-
arg: "elementType",
|
|
27
|
-
eq: "a",
|
|
28
|
-
},
|
|
29
|
-
}, rel: {
|
|
30
|
-
if: {
|
|
31
|
-
arg: "elementType",
|
|
32
|
-
eq: "a",
|
|
33
|
-
},
|
|
34
|
-
}, target: {
|
|
35
|
-
if: {
|
|
36
|
-
arg: "elementType",
|
|
37
|
-
eq: "a",
|
|
38
|
-
},
|
|
39
|
-
}, type: {
|
|
40
|
-
if: {
|
|
41
|
-
arg: "elementType",
|
|
42
|
-
neq: "a",
|
|
43
|
-
},
|
|
44
|
-
} }, excludeControls("className", "onClick", "elementType", "onPress", "role")),
|
|
45
|
-
};
|
|
46
|
-
export const Normal = {
|
|
47
|
-
render: (args) => _jsx(Button, Object.assign({}, args)),
|
|
48
|
-
args: {
|
|
49
|
-
children: "Confirm",
|
|
50
|
-
variant: "primary",
|
|
51
|
-
size: "medium",
|
|
52
|
-
isDisabled: false,
|
|
53
|
-
isLoading: false,
|
|
54
|
-
isSuccess: false,
|
|
55
|
-
type: "button",
|
|
56
|
-
},
|
|
57
|
-
};
|
|
58
|
-
export const Secondary = {
|
|
59
|
-
render: (args) => _jsx(Button, Object.assign({}, args)),
|
|
60
|
-
args: {
|
|
61
|
-
variant: "secondary",
|
|
62
|
-
size: "medium",
|
|
63
|
-
children: "Secondary Button",
|
|
64
|
-
isDisabled: false,
|
|
65
|
-
isLoading: false,
|
|
66
|
-
isSuccess: false,
|
|
67
|
-
type: "button",
|
|
68
|
-
},
|
|
69
|
-
};
|
|
70
|
-
export const Ghost = {
|
|
71
|
-
render: (args) => _jsx(Button, Object.assign({}, args)),
|
|
72
|
-
args: {
|
|
73
|
-
variant: "ghost",
|
|
74
|
-
size: "medium",
|
|
75
|
-
children: "Ghost Button",
|
|
76
|
-
isDisabled: false,
|
|
77
|
-
isLoading: false,
|
|
78
|
-
isSuccess: false,
|
|
79
|
-
type: "button",
|
|
80
|
-
},
|
|
81
|
-
};
|
|
82
|
-
export const Basic = {
|
|
83
|
-
render: (args) => _jsx(Button, Object.assign({}, args)),
|
|
84
|
-
args: {
|
|
85
|
-
variant: "basic",
|
|
86
|
-
size: "medium",
|
|
87
|
-
children: "Basic Button",
|
|
88
|
-
isDisabled: false,
|
|
89
|
-
isLoading: false,
|
|
90
|
-
isSuccess: false,
|
|
91
|
-
type: "button",
|
|
92
|
-
},
|
|
93
|
-
};
|
|
94
|
-
export const Large = {
|
|
95
|
-
render: (args) => _jsx(Button, Object.assign({}, args)),
|
|
96
|
-
args: {
|
|
97
|
-
children: "Large Button",
|
|
98
|
-
variant: "primary",
|
|
99
|
-
size: "large",
|
|
100
|
-
isDisabled: false,
|
|
101
|
-
isLoading: false,
|
|
102
|
-
isSuccess: false,
|
|
103
|
-
type: "button",
|
|
104
|
-
},
|
|
105
|
-
};
|
|
106
|
-
export const Link = {
|
|
107
|
-
render: (args) => _jsx(Button, Object.assign({}, args)),
|
|
108
|
-
args: {
|
|
109
|
-
children: "Link Button",
|
|
110
|
-
elementType: "a",
|
|
111
|
-
variant: "primary",
|
|
112
|
-
size: "medium",
|
|
113
|
-
isDisabled: false,
|
|
114
|
-
isLoading: false,
|
|
115
|
-
isSuccess: false,
|
|
116
|
-
href: "",
|
|
117
|
-
rel: "",
|
|
118
|
-
target: "",
|
|
119
|
-
},
|
|
120
|
-
};
|
|
121
|
-
export const Loading = {
|
|
122
|
-
render: (args) => _jsx(Button, Object.assign({}, args)),
|
|
123
|
-
args: {
|
|
124
|
-
children: "Loading",
|
|
125
|
-
variant: "primary",
|
|
126
|
-
size: "medium",
|
|
127
|
-
isDisabled: false,
|
|
128
|
-
isLoading: true,
|
|
129
|
-
isSuccess: false,
|
|
130
|
-
type: "button",
|
|
131
|
-
},
|
|
132
|
-
parameters: {
|
|
133
|
-
controls: {
|
|
134
|
-
exclude: ["icon", "iconPosition"],
|
|
135
|
-
},
|
|
136
|
-
},
|
|
137
|
-
};
|
|
138
|
-
export const Success = {
|
|
139
|
-
render: (args) => _jsx(Button, Object.assign({}, args)),
|
|
140
|
-
args: {
|
|
141
|
-
children: "Success",
|
|
142
|
-
variant: "primary",
|
|
143
|
-
size: "medium",
|
|
144
|
-
isDisabled: false,
|
|
145
|
-
isLoading: false,
|
|
146
|
-
isSuccess: true,
|
|
147
|
-
type: "button",
|
|
148
|
-
},
|
|
149
|
-
parameters: {
|
|
150
|
-
controls: {
|
|
151
|
-
exclude: ["icon", "iconPosition"],
|
|
152
|
-
},
|
|
153
|
-
},
|
|
154
|
-
};
|
|
155
|
-
export const Disabled = {
|
|
156
|
-
render: (args) => _jsx(Button, Object.assign({}, args)),
|
|
157
|
-
args: {
|
|
158
|
-
children: "Disabled",
|
|
159
|
-
variant: "primary",
|
|
160
|
-
size: "medium",
|
|
161
|
-
isDisabled: true,
|
|
162
|
-
isLoading: false,
|
|
163
|
-
isSuccess: false,
|
|
164
|
-
type: "button",
|
|
165
|
-
},
|
|
166
|
-
};
|
|
167
|
-
export const WithIcon = {
|
|
168
|
-
render: (args) => _jsx(Button, Object.assign({}, args)),
|
|
169
|
-
args: {
|
|
170
|
-
children: "Menu",
|
|
171
|
-
variant: "primary",
|
|
172
|
-
size: "medium",
|
|
173
|
-
icon: "menu",
|
|
174
|
-
iconPosition: "right",
|
|
175
|
-
isDisabled: false,
|
|
176
|
-
isLoading: false,
|
|
177
|
-
isSuccess: false,
|
|
178
|
-
type: "button",
|
|
179
|
-
},
|
|
180
|
-
};
|
|
181
|
-
export const Themed = {
|
|
182
|
-
render: (args) => {
|
|
183
|
-
// eslint-disable-next-line global-require
|
|
184
|
-
require("./Button.story.styles.css");
|
|
185
|
-
return _jsx(Button, Object.assign({}, args));
|
|
186
|
-
},
|
|
187
|
-
args: {
|
|
188
|
-
children: "Confirm",
|
|
189
|
-
variant: "primary",
|
|
190
|
-
size: "medium",
|
|
191
|
-
isDisabled: false,
|
|
192
|
-
isLoading: false,
|
|
193
|
-
isSuccess: false,
|
|
194
|
-
className: "button-example-with-theme",
|
|
195
|
-
type: "button",
|
|
196
|
-
},
|
|
197
|
-
};
|
|
198
|
-
//# sourceMappingURL=Button.stories.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Button.stories.js","sourceRoot":"","sources":["../../../../src/components/Button/Button.stories.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,81 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
-
import { render, screen } from "@testing-library/react";
|
|
3
|
-
import userEvent from "@testing-library/user-event";
|
|
4
|
-
import { Button } from ".";
|
|
5
|
-
const CLASS_NAME = "mobius/Button";
|
|
6
|
-
describe("Button", () => {
|
|
7
|
-
it("should render without errors", () => {
|
|
8
|
-
const error = jest.spyOn(global.console, "error");
|
|
9
|
-
const onPress = jest.fn();
|
|
10
|
-
render(_jsx(Button, Object.assign({ onPress: onPress }, { children: "Sample text" })));
|
|
11
|
-
expect(error).not.toHaveBeenCalled();
|
|
12
|
-
});
|
|
13
|
-
it("should call the onPress", async () => {
|
|
14
|
-
const onPress = jest.fn();
|
|
15
|
-
const { getByText } = render(_jsx(Button, Object.assign({ onPress: onPress }, { children: "Press" })));
|
|
16
|
-
await userEvent.click(getByText("Press"));
|
|
17
|
-
expect(onPress).toHaveBeenCalled();
|
|
18
|
-
});
|
|
19
|
-
it("should call the onClick", async () => {
|
|
20
|
-
const onClick = jest.fn();
|
|
21
|
-
const { getByText } = render(_jsx(Button, Object.assign({ onClick: onClick }, { children: "Click" })));
|
|
22
|
-
await userEvent.click(getByText("Click"));
|
|
23
|
-
expect(onClick).toHaveBeenCalled();
|
|
24
|
-
});
|
|
25
|
-
describe("given icon is provided", () => {
|
|
26
|
-
it("renders the icon on the left by default", () => {
|
|
27
|
-
var _a;
|
|
28
|
-
render(_jsx(Button, Object.assign({ icon: "chevronDown" }, { children: "Icon on the left" })));
|
|
29
|
-
expect((_a = screen.getByRole("button").firstElementChild) === null || _a === void 0 ? void 0 : _a.tagName).toBe("svg");
|
|
30
|
-
});
|
|
31
|
-
it("renders the icon after text when position is set to 'right'", () => {
|
|
32
|
-
render(_jsx(Button, Object.assign({ icon: "chevronDown", iconPosition: "right" }, { children: "Icon on the right" })));
|
|
33
|
-
expect(screen.getByRole("button").children[1].tagName).toBe("svg");
|
|
34
|
-
});
|
|
35
|
-
});
|
|
36
|
-
describe("given the button is set to 'loading'", () => {
|
|
37
|
-
it("should only render the loading icon", () => {
|
|
38
|
-
render(_jsx(Button, Object.assign({ isLoading: true, icon: "chevronDown", iconPosition: "right" }, { children: "Click me" })));
|
|
39
|
-
expect(screen.getByRole("button").firstElementChild).toHaveClass("mobius/ButtonIconWrapper");
|
|
40
|
-
expect(screen.getByRole("button").children[1]).toHaveClass("hide-children");
|
|
41
|
-
});
|
|
42
|
-
});
|
|
43
|
-
describe("given the button is set to 'loading' and 'success'", () => {
|
|
44
|
-
it("renders 'loading' state", () => {
|
|
45
|
-
render(_jsx(Button, { isLoading: true, isSuccess: true }));
|
|
46
|
-
expect(screen.getByRole("button")).toHaveClass("--is-loading");
|
|
47
|
-
expect(screen.getByRole("button")).not.toHaveClass("--is-success");
|
|
48
|
-
});
|
|
49
|
-
});
|
|
50
|
-
describe("uses correct class names", () => {
|
|
51
|
-
it("uses Mobius class", () => {
|
|
52
|
-
render(_jsx(Button, {}));
|
|
53
|
-
expect(screen.getByRole("button")).toHaveClass("mobius");
|
|
54
|
-
});
|
|
55
|
-
it("uses base Mobius class", () => {
|
|
56
|
-
render(_jsx(Button, {}));
|
|
57
|
-
expect(screen.getByRole("button")).toHaveClass(CLASS_NAME);
|
|
58
|
-
});
|
|
59
|
-
it("includes disabled class name", () => {
|
|
60
|
-
render(_jsx(Button, { isDisabled: true }));
|
|
61
|
-
expect(screen.getByRole("button")).toHaveClass("--is-disabled");
|
|
62
|
-
});
|
|
63
|
-
it("includes custom class name", () => {
|
|
64
|
-
render(_jsx(Button, { className: "my-class" }));
|
|
65
|
-
expect(screen.getByRole("button")).toHaveClass(CLASS_NAME);
|
|
66
|
-
expect(screen.getByRole("button")).toHaveClass("my-class");
|
|
67
|
-
});
|
|
68
|
-
it("includes the focus-visible class name", async () => {
|
|
69
|
-
render(_jsx(Button, {}));
|
|
70
|
-
await userEvent.tab();
|
|
71
|
-
expect(screen.getByRole("button")).toHaveClass("--is-focus-visible");
|
|
72
|
-
});
|
|
73
|
-
describe("given icon is provided", () => {
|
|
74
|
-
it("includes icon class name", () => {
|
|
75
|
-
render(_jsx(Button, { icon: "chevronDown" }));
|
|
76
|
-
expect(screen.getByRole("button")).toHaveClass("--has-icon");
|
|
77
|
-
});
|
|
78
|
-
});
|
|
79
|
-
});
|
|
80
|
-
});
|
|
81
|
-
//# sourceMappingURL=Button.test.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Button.test.js","sourceRoot":"","sources":["../../../../src/components/Button/Button.test.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,98 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { Checkbox } from ".";
|
|
3
|
-
import { excludeControls } from "../../utils/excludeControls";
|
|
4
|
-
export default {
|
|
5
|
-
title: "Forms/Checkbox",
|
|
6
|
-
component: Checkbox,
|
|
7
|
-
argTypes: Object.assign({ validationState: {
|
|
8
|
-
options: ["valid", "invalid", "neither"],
|
|
9
|
-
control: { type: "radio" },
|
|
10
|
-
mapping: {
|
|
11
|
-
valid: "valid",
|
|
12
|
-
invalid: "invalid",
|
|
13
|
-
neither: "",
|
|
14
|
-
},
|
|
15
|
-
}, label: {
|
|
16
|
-
control: { type: "text" },
|
|
17
|
-
} }, excludeControls("className")),
|
|
18
|
-
};
|
|
19
|
-
export const Normal = {
|
|
20
|
-
render: (args) => _jsx(Checkbox, Object.assign({}, args)),
|
|
21
|
-
args: {
|
|
22
|
-
label: "Value",
|
|
23
|
-
isDisabled: false,
|
|
24
|
-
isIndeterminate: false,
|
|
25
|
-
errorMessage: "",
|
|
26
|
-
defaultSelected: false,
|
|
27
|
-
isRequired: false,
|
|
28
|
-
},
|
|
29
|
-
};
|
|
30
|
-
export const ControlledValue = {
|
|
31
|
-
render: (args) => _jsx(Checkbox, Object.assign({}, args)),
|
|
32
|
-
args: {
|
|
33
|
-
label: "Value",
|
|
34
|
-
isDisabled: false,
|
|
35
|
-
isIndeterminate: false,
|
|
36
|
-
errorMessage: "",
|
|
37
|
-
isSelected: true,
|
|
38
|
-
isRequired: false,
|
|
39
|
-
},
|
|
40
|
-
};
|
|
41
|
-
export const Disabled = {
|
|
42
|
-
render: (args) => _jsx(Checkbox, Object.assign({}, args)),
|
|
43
|
-
args: {
|
|
44
|
-
label: "Value",
|
|
45
|
-
isDisabled: true,
|
|
46
|
-
isIndeterminate: false,
|
|
47
|
-
errorMessage: "",
|
|
48
|
-
defaultSelected: false,
|
|
49
|
-
isRequired: false,
|
|
50
|
-
},
|
|
51
|
-
};
|
|
52
|
-
export const Indeterminate = {
|
|
53
|
-
render: (args) => _jsx(Checkbox, Object.assign({}, args)),
|
|
54
|
-
args: {
|
|
55
|
-
label: "Value",
|
|
56
|
-
isDisabled: false,
|
|
57
|
-
isIndeterminate: true,
|
|
58
|
-
errorMessage: "",
|
|
59
|
-
defaultSelected: false,
|
|
60
|
-
isRequired: false,
|
|
61
|
-
},
|
|
62
|
-
};
|
|
63
|
-
export const Valid = {
|
|
64
|
-
render: (args) => _jsx(Checkbox, Object.assign({}, args)),
|
|
65
|
-
args: {
|
|
66
|
-
label: "Value",
|
|
67
|
-
isDisabled: false,
|
|
68
|
-
isIndeterminate: false,
|
|
69
|
-
errorMessage: "",
|
|
70
|
-
validationState: "valid",
|
|
71
|
-
defaultSelected: false,
|
|
72
|
-
isRequired: false,
|
|
73
|
-
},
|
|
74
|
-
};
|
|
75
|
-
export const Invalid = {
|
|
76
|
-
render: (args) => _jsx(Checkbox, Object.assign({}, args)),
|
|
77
|
-
args: {
|
|
78
|
-
label: "Value",
|
|
79
|
-
isDisabled: false,
|
|
80
|
-
isIndeterminate: false,
|
|
81
|
-
validationState: "invalid",
|
|
82
|
-
errorMessage: "This is an error message",
|
|
83
|
-
defaultSelected: false,
|
|
84
|
-
isRequired: false,
|
|
85
|
-
},
|
|
86
|
-
};
|
|
87
|
-
export const LongLabel = {
|
|
88
|
-
render: (args) => _jsx(Checkbox, Object.assign({}, args)),
|
|
89
|
-
args: {
|
|
90
|
-
label: (_jsxs(_Fragment, { children: ["Example", _jsx("br", {}), "of", _jsx("br", {}), "long", _jsx("br", {}), "label", _jsx("br", {}), "text", _jsx("br", {})] })),
|
|
91
|
-
isDisabled: false,
|
|
92
|
-
isIndeterminate: false,
|
|
93
|
-
errorMessage: "",
|
|
94
|
-
defaultSelected: false,
|
|
95
|
-
isRequired: false,
|
|
96
|
-
},
|
|
97
|
-
};
|
|
98
|
-
//# sourceMappingURL=Checkbox.stories.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Checkbox.stories.js","sourceRoot":"","sources":["../../../../src/components/Checkbox/Checkbox.stories.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,108 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { Fragment } from "react";
|
|
3
|
-
import { render, fireEvent, screen } from "@testing-library/react";
|
|
4
|
-
import userEvent from "@testing-library/user-event";
|
|
5
|
-
import { Checkbox, CheckboxGroup } from ".";
|
|
6
|
-
const WRAPPER_CLASS_NAME = "mobius/Checkbox";
|
|
7
|
-
const INPUT_CLASS_NAME = "mobius/CheckboxInput";
|
|
8
|
-
describe.each([
|
|
9
|
-
["Grouped checkbox", CheckboxGroup, { label: "Checkbox Group" }],
|
|
10
|
-
["Ungrouped checkbox", Fragment, {}],
|
|
11
|
-
])("%s", (_description, Container, containerProps) => {
|
|
12
|
-
it("should render without error", () => {
|
|
13
|
-
const component = render(_jsx(Container, Object.assign({}, containerProps, { children: _jsx(Checkbox, { label: "Checkbox", value: "value" }) })));
|
|
14
|
-
expect(component).toBeTruthy();
|
|
15
|
-
});
|
|
16
|
-
it("should call onChange when clicked", () => {
|
|
17
|
-
const callback = jest.fn();
|
|
18
|
-
const component = render(_jsx(Container, Object.assign({}, containerProps, { children: _jsx(Checkbox, { label: "Checkbox", onChange: callback, value: "value" }) })));
|
|
19
|
-
fireEvent.click(component.container.querySelector("input"));
|
|
20
|
-
expect(callback).toHaveBeenCalledWith(true);
|
|
21
|
-
});
|
|
22
|
-
it("should be selectable via keyboard", async () => {
|
|
23
|
-
const callback = jest.fn();
|
|
24
|
-
render(_jsx(Container, Object.assign({}, containerProps, { children: _jsx(Checkbox, { label: "Checkbox", onChange: callback, value: "value" }) })));
|
|
25
|
-
await userEvent.tab();
|
|
26
|
-
await userEvent.keyboard("[Space]");
|
|
27
|
-
expect(callback).toHaveBeenCalledWith(true);
|
|
28
|
-
await userEvent.keyboard("[Space]");
|
|
29
|
-
expect(callback).toHaveBeenCalledWith(false);
|
|
30
|
-
});
|
|
31
|
-
it("should set the correct aria-describedby attribute", () => {
|
|
32
|
-
const { getByLabelText } = render(_jsx(Checkbox, { label: "I agree", name: "agree", errorMessage: "Required" }));
|
|
33
|
-
expect(getByLabelText("I agree")).toHaveAccessibleDescription("Required");
|
|
34
|
-
});
|
|
35
|
-
describe("isSelected", () => {
|
|
36
|
-
beforeAll(() => {
|
|
37
|
-
jest.spyOn(console, "error").mockImplementationOnce(() => { });
|
|
38
|
-
});
|
|
39
|
-
it("should not pass the prop as a DOM attribute", () => {
|
|
40
|
-
render(_jsxs(Container, Object.assign({}, containerProps, { children: [_jsx(Checkbox, { label: "I agree", name: "agree", value: "test", isSelected: true }), ","] })));
|
|
41
|
-
// eslint-disable-next-line
|
|
42
|
-
expect(console.error).not.toHaveBeenCalled();
|
|
43
|
-
});
|
|
44
|
-
});
|
|
45
|
-
describe("isRequired", () => {
|
|
46
|
-
it("should set aria-required to true", () => {
|
|
47
|
-
render(_jsx(Container, Object.assign({}, containerProps, { children: _jsx(Checkbox, { label: "Checkbox", value: "value", isRequired: true }) })));
|
|
48
|
-
expect(screen.getByLabelText("Checkbox")).toHaveAttribute("aria-required", "true");
|
|
49
|
-
});
|
|
50
|
-
it("should have className of --is-required when true", () => {
|
|
51
|
-
render(_jsx(Container, Object.assign({}, containerProps, { children: _jsx(Checkbox, { label: "Checkbox", value: "value", isRequired: true }) })));
|
|
52
|
-
expect(screen.getByLabelText("Checkbox")).toHaveClass("--is-required");
|
|
53
|
-
});
|
|
54
|
-
it("should have className of --is-optional when false", () => {
|
|
55
|
-
render(_jsx(Container, Object.assign({}, containerProps, { children: _jsx(Checkbox, { label: "Checkbox", value: "value", isRequired: false }) })));
|
|
56
|
-
expect(screen.getByLabelText("Checkbox")).toHaveClass("--is-optional");
|
|
57
|
-
});
|
|
58
|
-
it("should have neither --is-required nor --is-optional when unset", () => {
|
|
59
|
-
render(_jsx(Container, Object.assign({}, containerProps, { children: _jsx(Checkbox, { label: "Checkbox", value: "value" }) })));
|
|
60
|
-
expect(screen.getByLabelText("Checkbox")).not.toHaveClass("--is-required");
|
|
61
|
-
expect(screen.getByLabelText("Checkbox")).not.toHaveClass("--is-optional");
|
|
62
|
-
});
|
|
63
|
-
});
|
|
64
|
-
describe("uses correct class names", () => {
|
|
65
|
-
it("uses mobius Mobius class", () => {
|
|
66
|
-
const { container } = render(_jsx(Container, Object.assign({}, containerProps, { children: _jsx(Checkbox, { label: "Checkbox", value: "value" }) })));
|
|
67
|
-
expect(container.firstChild).toHaveClass("mobius");
|
|
68
|
-
});
|
|
69
|
-
it("uses base Mobius class", () => {
|
|
70
|
-
render(_jsx(Container, Object.assign({}, containerProps, { children: _jsx(Checkbox, { label: "Checkbox", value: "value" }) })));
|
|
71
|
-
expect(screen.getByLabelText("Checkbox")).toHaveClass(INPUT_CLASS_NAME);
|
|
72
|
-
});
|
|
73
|
-
it("includes disabled class name", () => {
|
|
74
|
-
render(_jsx(Container, Object.assign({}, containerProps, { children: _jsx(Checkbox, { label: "Checkbox", isDisabled: true, value: "value" }) })));
|
|
75
|
-
expect(screen.getByLabelText("Checkbox")).toHaveClass("--is-disabled");
|
|
76
|
-
});
|
|
77
|
-
it("includes valid class name", () => {
|
|
78
|
-
render(_jsx(Container, Object.assign({}, containerProps, { children: _jsx(Checkbox, { label: "Checkbox", validationState: "valid", value: "value" }) })));
|
|
79
|
-
expect(screen.getByLabelText("Checkbox")).toHaveClass("--is-valid");
|
|
80
|
-
});
|
|
81
|
-
it("includes invalid class name", () => {
|
|
82
|
-
render(_jsx(Container, Object.assign({}, containerProps, { children: _jsx(Checkbox, { label: "Checkbox", validationState: "invalid", errorMessage: "There is a problem", value: "value" }) })));
|
|
83
|
-
expect(screen.getByLabelText("Checkbox")).toHaveClass("--is-invalid");
|
|
84
|
-
});
|
|
85
|
-
it("includes custom class name", () => {
|
|
86
|
-
render(_jsx(Container, Object.assign({}, containerProps, { children: _jsx(Checkbox, { label: "Checkbox", className: "my-class", value: "value" }) })));
|
|
87
|
-
expect(screen.getByLabelText("Checkbox")).toHaveClass("my-class");
|
|
88
|
-
expect(screen.getByLabelText("Checkbox")).toHaveClass(INPUT_CLASS_NAME);
|
|
89
|
-
});
|
|
90
|
-
it("only sets id on the input element", () => {
|
|
91
|
-
render(_jsx(Container, Object.assign({}, containerProps, { children: _jsx(Checkbox, { id: "test", label: "Checkbox", value: "value" }) })));
|
|
92
|
-
expect(screen.getByLabelText("Checkbox").getAttribute("id")).toEqual("test");
|
|
93
|
-
});
|
|
94
|
-
it("includes focused and selected class names", async () => {
|
|
95
|
-
render(_jsx(Container, Object.assign({}, containerProps, { children: _jsx(Checkbox, { label: "Checkbox", value: "value" }) })));
|
|
96
|
-
await userEvent.tab();
|
|
97
|
-
expect(screen.getByRole("checkbox")).toHaveClass("--is-focused");
|
|
98
|
-
expect(screen.getByRole("checkbox")).toHaveClass(INPUT_CLASS_NAME);
|
|
99
|
-
expect(screen.getByLabelText("Checkbox")).toHaveClass("--is-focused");
|
|
100
|
-
expect(screen.getByLabelText("Checkbox").closest("label")).toHaveClass(WRAPPER_CLASS_NAME);
|
|
101
|
-
await userEvent.keyboard("[Space]");
|
|
102
|
-
expect(screen.getByRole("checkbox")).toHaveClass("--is-selected");
|
|
103
|
-
await userEvent.tab();
|
|
104
|
-
expect(screen.getByRole("checkbox")).not.toHaveClass("--is-hovered");
|
|
105
|
-
});
|
|
106
|
-
});
|
|
107
|
-
});
|
|
108
|
-
//# sourceMappingURL=Checkbox.test.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Checkbox.test.js","sourceRoot":"","sources":["../../../../src/components/Checkbox/Checkbox.test.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,71 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { CheckboxGroup, Checkbox } from ".";
|
|
3
|
-
import { excludeControls } from "../../utils/excludeControls";
|
|
4
|
-
export default {
|
|
5
|
-
title: "Forms/CheckboxGroup",
|
|
6
|
-
component: CheckboxGroup,
|
|
7
|
-
argTypes: Object.assign({ validationState: {
|
|
8
|
-
options: ["valid", "invalid", "neither"],
|
|
9
|
-
control: { type: "radio" },
|
|
10
|
-
mapping: {
|
|
11
|
-
valid: "valid",
|
|
12
|
-
invalid: "invalid",
|
|
13
|
-
neither: "",
|
|
14
|
-
},
|
|
15
|
-
} }, excludeControls("className")),
|
|
16
|
-
};
|
|
17
|
-
export const Normal = {
|
|
18
|
-
render: (args) => (_jsxs(CheckboxGroup, Object.assign({}, args, { children: [_jsx(Checkbox, { label: "Option 1", value: "option1" }), _jsx(Checkbox, { label: "Option 2", value: "option2" }), _jsx(Checkbox, { label: "Option 3", value: "option3" })] }))),
|
|
19
|
-
args: {
|
|
20
|
-
label: "Value",
|
|
21
|
-
errorMessage: "",
|
|
22
|
-
isDisabled: false,
|
|
23
|
-
orientation: "vertical",
|
|
24
|
-
defaultValue: ["option1", "option3"],
|
|
25
|
-
isRequired: false,
|
|
26
|
-
},
|
|
27
|
-
};
|
|
28
|
-
export const ControlledValue = {
|
|
29
|
-
render: (args) => (_jsxs(CheckboxGroup, Object.assign({}, args, { children: [_jsx(Checkbox, { label: "Option 1", value: "option1" }), _jsx(Checkbox, { label: "Option 2", value: "option2" }), _jsx(Checkbox, { label: "Option 3", value: "option3" })] }))),
|
|
30
|
-
args: {
|
|
31
|
-
label: "Value",
|
|
32
|
-
errorMessage: "",
|
|
33
|
-
isDisabled: false,
|
|
34
|
-
orientation: "vertical",
|
|
35
|
-
value: ["option2", "option3"],
|
|
36
|
-
isRequired: false,
|
|
37
|
-
},
|
|
38
|
-
};
|
|
39
|
-
export const Disabled = {
|
|
40
|
-
render: (args) => (_jsxs(CheckboxGroup, Object.assign({}, args, { children: [_jsx(Checkbox, { label: "Option 1", value: "option1" }), _jsx(Checkbox, { label: "Option 2", value: "option2" }), _jsx(Checkbox, { label: "Option 3", value: "option3" })] }))),
|
|
41
|
-
args: {
|
|
42
|
-
label: "Value",
|
|
43
|
-
errorMessage: "",
|
|
44
|
-
isDisabled: true,
|
|
45
|
-
orientation: "vertical",
|
|
46
|
-
isRequired: false,
|
|
47
|
-
},
|
|
48
|
-
};
|
|
49
|
-
export const Valid = {
|
|
50
|
-
render: (args) => (_jsxs(CheckboxGroup, Object.assign({}, args, { children: [_jsx(Checkbox, { label: "Option 1", value: "option1" }), _jsx(Checkbox, { label: "Option 2", value: "option2" }), _jsx(Checkbox, { label: "Option 3", value: "option3" })] }))),
|
|
51
|
-
args: {
|
|
52
|
-
label: "Value",
|
|
53
|
-
errorMessage: "",
|
|
54
|
-
isDisabled: false,
|
|
55
|
-
validationState: "valid",
|
|
56
|
-
orientation: "vertical",
|
|
57
|
-
isRequired: false,
|
|
58
|
-
},
|
|
59
|
-
};
|
|
60
|
-
export const Invalid = {
|
|
61
|
-
render: (args) => (_jsxs(CheckboxGroup, Object.assign({}, args, { children: [_jsx(Checkbox, { label: "Option 1", value: "option1" }), _jsx(Checkbox, { label: "Option 2", value: "option2" }), _jsx(Checkbox, { label: "Option 3", value: "option3" })] }))),
|
|
62
|
-
args: {
|
|
63
|
-
label: "Value",
|
|
64
|
-
errorMessage: "This field is required",
|
|
65
|
-
isDisabled: false,
|
|
66
|
-
validationState: "invalid",
|
|
67
|
-
orientation: "vertical",
|
|
68
|
-
isRequired: false,
|
|
69
|
-
},
|
|
70
|
-
};
|
|
71
|
-
//# sourceMappingURL=CheckboxGroup.stories.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"CheckboxGroup.stories.js","sourceRoot":"","sources":["../../../../src/components/Checkbox/CheckboxGroup.stories.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,44 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { render, screen } from "@testing-library/react";
|
|
3
|
-
import { Checkbox, CheckboxGroup } from ".";
|
|
4
|
-
const CHECKBOX_GROUP_ITEM_TEST_ID = "CheckboxGroupItem";
|
|
5
|
-
const CHECKBOX_ITEM_TEST_ID = "CheckboxItem";
|
|
6
|
-
describe("CheckboxGroup", () => {
|
|
7
|
-
it("renders a CheckboxGroupItem inside a CheckboxGroup", () => {
|
|
8
|
-
render(_jsx(CheckboxGroup, Object.assign({ label: "Checkbox Group" }, { children: _jsx(Checkbox, { label: "Checkbox", value: "value" }) })));
|
|
9
|
-
expect(screen.getByLabelText("Checkbox")).toHaveAttribute("data-testid", CHECKBOX_GROUP_ITEM_TEST_ID);
|
|
10
|
-
expect(screen.getByLabelText("Checkbox")).not.toHaveAttribute("data-testid", CHECKBOX_ITEM_TEST_ID);
|
|
11
|
-
});
|
|
12
|
-
it("renders a non-CheckboxGroupItem outside a CheckboxGroup", () => {
|
|
13
|
-
render(_jsx(Checkbox, { label: "Checkbox", value: "value" }));
|
|
14
|
-
expect(screen.getByLabelText("Checkbox")).not.toHaveAttribute("data-testid", CHECKBOX_GROUP_ITEM_TEST_ID);
|
|
15
|
-
expect(screen.getByLabelText("Checkbox")).toHaveAttribute("data-testid", CHECKBOX_ITEM_TEST_ID);
|
|
16
|
-
});
|
|
17
|
-
it("displays an error message when errorMessage is set", () => {
|
|
18
|
-
render(_jsx(CheckboxGroup, Object.assign({ label: "Checkbox Group", errorMessage: "Error message" }, { children: _jsx(Checkbox, { label: "Checkbox", value: "value" }) })));
|
|
19
|
-
expect(screen.getByText("Error message")).toBeInTheDocument();
|
|
20
|
-
});
|
|
21
|
-
it("sets aria-describedby for all checkboxes when errorMessage is set", () => {
|
|
22
|
-
render(_jsxs(CheckboxGroup, Object.assign({ label: "Checkbox Group", errorMessage: "Error message" }, { children: [_jsx(Checkbox, { label: "Checkbox 1", value: "value1" }), _jsx(Checkbox, { label: "Checkbox 2", value: "value2" }), _jsx(Checkbox, { label: "Checkbox 3", value: "value3" })] })));
|
|
23
|
-
const checkboxes = screen.getAllByRole("checkbox");
|
|
24
|
-
checkboxes.forEach(checkbox => {
|
|
25
|
-
expect(checkbox).toHaveAccessibleDescription("Error message");
|
|
26
|
-
});
|
|
27
|
-
});
|
|
28
|
-
describe("isRequired", () => {
|
|
29
|
-
it("should have className of --is-required when true", () => {
|
|
30
|
-
render(_jsx(CheckboxGroup, Object.assign({ label: "Checkbox Group", errorMessage: "Error message", isRequired: true }, { children: _jsx(Checkbox, { label: "Checkbox 1", value: "value1" }) })));
|
|
31
|
-
expect(screen.getByLabelText("Checkbox Group")).toHaveClass("--is-required");
|
|
32
|
-
});
|
|
33
|
-
it("should have className of --is-optional when false", () => {
|
|
34
|
-
render(_jsx(CheckboxGroup, Object.assign({ label: "Checkbox Group", errorMessage: "Error message", isRequired: false }, { children: _jsx(Checkbox, { label: "Checkbox 1", value: "value1" }) })));
|
|
35
|
-
expect(screen.getByLabelText("Checkbox Group")).toHaveClass("--is-optional");
|
|
36
|
-
});
|
|
37
|
-
it("should have neither --is-required nor --is-optional when unset", () => {
|
|
38
|
-
render(_jsx(CheckboxGroup, Object.assign({ label: "Checkbox Group", errorMessage: "Error message" }, { children: _jsx(Checkbox, { label: "Checkbox 1", value: "value1" }) })));
|
|
39
|
-
expect(screen.getByLabelText("Checkbox Group")).not.toHaveClass("--is-required");
|
|
40
|
-
expect(screen.getByLabelText("Checkbox Group")).not.toHaveClass("--is-optional");
|
|
41
|
-
});
|
|
42
|
-
});
|
|
43
|
-
});
|
|
44
|
-
//# sourceMappingURL=CheckboxGroup.test.js.map
|