@mrshmllw/smores-react 2.19.2 → 3.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/dist/Accordion/Accordion.d.ts +1 -0
- package/dist/Accordion/Accordion.js +16 -12
- package/dist/Accordion/Accordion.js.map +1 -1
- package/dist/Accordion/Accordion.stories.d.ts +1 -2
- package/dist/Accordion/Accordion.stories.js +2 -8
- package/dist/Accordion/Accordion.stories.js.map +1 -1
- package/dist/Accordion/Collection.d.ts +2 -0
- package/dist/Accordion/Collection.js +52 -0
- package/dist/Accordion/Collection.js.map +1 -0
- package/dist/Accordion/__tests__/Accordion.js +9 -0
- package/dist/Accordion/__tests__/Accordion.js.map +1 -0
- package/dist/ActionDropdown/ActionDropdown.js +7 -7
- package/dist/ActionDropdown/ActionDropdown.js.map +1 -1
- package/dist/ActionDropdown/ActionDropdown.stories.js +1 -1
- package/dist/ActionDropdown/Container.js +16 -10
- package/dist/ActionDropdown/Container.js.map +1 -1
- package/dist/ActionDropdown/List.js +3 -3
- package/dist/ActionDropdown/List.js.map +1 -1
- package/dist/ActionDropdown/__tests__/ActionDropdown.js +3 -3
- package/dist/ActionDropdown/__tests__/ActionDropdown.js.map +1 -1
- package/dist/Banner/Banner.stories.d.ts +9 -0
- package/dist/Banner/Banner.stories.js +86 -0
- package/dist/Banner/Banner.stories.js.map +1 -0
- package/dist/Banner/BannerContainer.d.ts +7 -0
- package/dist/Banner/BannerContainer.js +40 -0
- package/dist/Banner/BannerContainer.js.map +1 -0
- package/dist/Banner/BannerItem.d.ts +7 -0
- package/dist/Banner/BannerItem.js +64 -0
- package/dist/Banner/BannerItem.js.map +1 -0
- package/dist/Banner/hooks.d.ts +3 -0
- package/dist/Banner/hooks.js +6 -0
- package/dist/Banner/hooks.js.map +1 -0
- package/dist/Banner/index.d.ts +2 -0
- package/dist/Banner/index.js +3 -0
- package/dist/Banner/index.js.map +1 -0
- package/dist/Banner/types.d.ts +18 -0
- package/dist/Banner/types.js +2 -0
- package/dist/Banner/types.js.map +1 -0
- package/dist/Box/Box.stories.js +2 -2
- package/dist/Box/Box.stories.js.map +1 -1
- package/dist/BrandCard/BrandCard.d.ts +27 -0
- package/dist/BrandCard/BrandCard.js +60 -0
- package/dist/BrandCard/BrandCard.js.map +1 -0
- package/dist/BrandCard/BrandCard.stories.d.ts +11 -0
- package/dist/BrandCard/BrandCard.stories.js +54 -0
- package/dist/BrandCard/BrandCard.stories.js.map +1 -0
- package/dist/BrandCard/__tests__/BrandCard.js +9 -0
- package/dist/BrandCard/__tests__/BrandCard.js.map +1 -0
- package/dist/BrandCard/index.d.ts +1 -0
- package/dist/BrandCard/index.js +2 -0
- package/dist/BrandCard/index.js.map +1 -0
- package/dist/Button/Button.d.ts +4 -6
- package/dist/Button/Button.js +52 -54
- package/dist/Button/Button.js.map +1 -1
- package/dist/Button/Button.stories.js +1 -1
- package/dist/Button/Collection.d.ts +2 -0
- package/dist/Button/Collection.js +4 -2
- package/dist/Button/Collection.js.map +1 -1
- package/dist/Button/LegacyButton.js +6 -6
- package/dist/Button/LegacyButton.js.map +1 -1
- package/dist/Button/__tests__/Button.js.map +1 -1
- package/dist/Card/Card.d.ts +19 -1
- package/dist/Card/Card.js +42 -10
- package/dist/Card/Card.js.map +1 -1
- package/dist/Card/Card.stories.d.ts +8 -4
- package/dist/Card/Card.stories.js +74 -18
- package/dist/Card/Card.stories.js.map +1 -1
- package/dist/CheckBox/CheckBox.js +39 -16
- package/dist/CheckBox/CheckBox.js.map +1 -1
- package/dist/Chip/Chip.js +15 -9
- package/dist/Chip/Chip.js.map +1 -1
- package/dist/Datepicker/Datepicker.d.ts +3 -0
- package/dist/Datepicker/Datepicker.js +34 -20
- package/dist/Datepicker/Datepicker.js.map +1 -1
- package/dist/Datepicker/DatesList.js +18 -10
- package/dist/Datepicker/DatesList.js.map +1 -1
- package/dist/Divider/Divider.js +1 -1
- package/dist/Divider/Divider.js.map +1 -1
- package/dist/Dropdown/Collection.d.ts +2 -0
- package/dist/Dropdown/Collection.js +91 -0
- package/dist/Dropdown/Collection.js.map +1 -0
- package/dist/Dropdown/Dropdown.d.ts +2 -1
- package/dist/Dropdown/Dropdown.js +24 -30
- package/dist/Dropdown/Dropdown.js.map +1 -1
- package/dist/Dropdown/Dropdown.stories.d.ts +2 -16
- package/dist/Dropdown/Dropdown.stories.js +7 -156
- package/dist/Dropdown/Dropdown.stories.js.map +1 -1
- package/dist/Icon/Icon.js +1 -1
- package/dist/Icon/Icon.stories.js +2 -2
- package/dist/IconStrict/IconStrict.d.ts +20 -0
- package/dist/IconStrict/IconStrict.js +50 -0
- package/dist/IconStrict/IconStrict.js.map +1 -0
- package/dist/IconStrict/IconStrict.stories.d.ts +11 -0
- package/dist/IconStrict/IconStrict.stories.js +33 -0
- package/dist/IconStrict/IconStrict.stories.js.map +1 -0
- package/dist/IconStrict/__tests__/IconStrict.js +9 -0
- package/dist/IconStrict/__tests__/IconStrict.js.map +1 -0
- package/dist/IconStrict/index.d.ts +1 -0
- package/dist/IconStrict/index.js +2 -0
- package/dist/IconStrict/index.js.map +1 -0
- package/dist/IconWrapper/IconWrapper.js +2 -2
- package/dist/IconWrapper/IconWrapper.js.map +1 -1
- package/dist/LabelledText/LabelledText.js +1 -1
- package/dist/LabelledText/LabelledText.js.map +1 -1
- package/dist/Link/Link.d.ts +3 -0
- package/dist/Link/Link.js +10 -13
- package/dist/Link/Link.js.map +1 -1
- package/dist/Link/Link.stories.d.ts +2 -0
- package/dist/Link/Link.stories.js +5 -1
- package/dist/Link/Link.stories.js.map +1 -1
- package/dist/Loader/Loader.js +1 -1
- package/dist/Loader/Loader.js.map +1 -1
- package/dist/Loader/Loader.stories.d.ts +1 -1
- package/dist/Loader/Loader.stories.js +3 -3
- package/dist/Loader/Loader.stories.js.map +1 -1
- package/dist/Loader/__tests__/Loader.js +1 -1
- package/dist/Loader/__tests__/Loader.js.map +1 -1
- package/dist/Modal/Modal.js +6 -23
- package/dist/Modal/Modal.js.map +1 -1
- package/dist/NumberInput/Collection.d.ts +2 -0
- package/dist/NumberInput/Collection.js +97 -0
- package/dist/NumberInput/Collection.js.map +1 -0
- package/dist/NumberInput/NumberInput.d.ts +1 -6
- package/dist/NumberInput/NumberInput.js +13 -89
- package/dist/NumberInput/NumberInput.js.map +1 -1
- package/dist/NumberInput/NumberInput.stories.d.ts +2 -7
- package/dist/NumberInput/NumberInput.stories.js +5 -73
- package/dist/NumberInput/NumberInput.stories.js.map +1 -1
- package/dist/Pagination/Pagination.js +43 -12
- package/dist/Pagination/Pagination.js.map +1 -1
- package/dist/Pagination/Pagination.stories.js +8 -1
- package/dist/Pagination/Pagination.stories.js.map +1 -1
- package/dist/RadioGroup/RadioElement.js +4 -4
- package/dist/RadioGroup/RadioElement.js.map +1 -1
- package/dist/RadioGroup/RadioGroup.d.ts +4 -0
- package/dist/RadioGroup/RadioGroup.js +2 -2
- package/dist/RadioGroup/RadioGroup.js.map +1 -1
- package/dist/RadioGroup/RadioGroup.stories.d.ts +3 -0
- package/dist/RadioGroup/RadioGroup.stories.js +2 -0
- package/dist/RadioGroup/RadioGroup.stories.js.map +1 -1
- package/dist/RadioGroup/RadioItem.d.ts +2 -0
- package/dist/RadioGroup/RadioItem.js +25 -9
- package/dist/RadioGroup/RadioItem.js.map +1 -1
- package/dist/Row/Row.js +14 -8
- package/dist/Row/Row.js.map +1 -1
- package/dist/Row/Row.stories.js +1 -1
- package/dist/SearchInput/Container.js +2 -2
- package/dist/SearchInput/Container.js.map +1 -1
- package/dist/SearchInput/SearchInput.d.ts +0 -2
- package/dist/SearchInput/SearchInput.js +8 -55
- package/dist/SearchInput/SearchInput.js.map +1 -1
- package/dist/SearchInput/SearchInput.stories.d.ts +0 -1
- package/dist/SearchInput/SearchInput.stories.js +0 -5
- package/dist/SearchInput/SearchInput.stories.js.map +1 -1
- package/dist/SearchInput/SearchOptions.d.ts +0 -2
- package/dist/SearchInput/SearchOptions.js +12 -16
- package/dist/SearchInput/SearchOptions.js.map +1 -1
- package/dist/Snackbar/SnackbarContainer.js +1 -1
- package/dist/Snackbar/SnackbarItem.js +5 -5
- package/dist/Snackbar/SnackbarItem.js.map +1 -1
- package/dist/SupportMessage/Collection.js +6 -1
- package/dist/SupportMessage/Collection.js.map +1 -1
- package/dist/SupportMessage/SupportMessage.d.ts +1 -1
- package/dist/SupportMessage/SupportMessage.js +27 -26
- package/dist/SupportMessage/SupportMessage.js.map +1 -1
- package/dist/Tag/Collection.d.ts +2 -0
- package/dist/Tag/Collection.js +77 -0
- package/dist/Tag/Collection.js.map +1 -0
- package/dist/Tag/Tag.d.ts +3 -13
- package/dist/Tag/Tag.js +7 -8
- package/dist/Tag/Tag.js.map +1 -1
- package/dist/Tag/Tag.stories.d.ts +1 -1
- package/dist/Tag/Tag.stories.js +5 -9
- package/dist/Tag/Tag.stories.js.map +1 -1
- package/dist/Tag/__tests__/Tag.js +1 -1
- package/dist/Tag/__tests__/Tag.js.map +1 -1
- package/dist/Text/Text.js +1 -1
- package/dist/Text/Text.stories.js +4 -4
- package/dist/Text/Text.stories.js.map +1 -1
- package/dist/Text/fontMapping.js +1 -1
- package/dist/TextInput/Collection.d.ts +2 -0
- package/dist/TextInput/Collection.js +69 -0
- package/dist/TextInput/Collection.js.map +1 -0
- package/dist/TextInput/TextInput.d.ts +0 -3
- package/dist/TextInput/TextInput.js +7 -60
- package/dist/TextInput/TextInput.js.map +1 -1
- package/dist/TextInput/TextInput.stories.d.ts +2 -10
- package/dist/TextInput/TextInput.stories.js +5 -111
- package/dist/TextInput/TextInput.stories.js.map +1 -1
- package/dist/Textarea/Container.js +1 -1
- package/dist/Textarea/Container.js.map +1 -1
- package/dist/Textarea/Textarea.d.ts +1 -0
- package/dist/Textarea/Textarea.js +10 -16
- package/dist/Textarea/Textarea.js.map +1 -1
- package/dist/Textarea/Textarea.stories.js +2 -0
- package/dist/Textarea/Textarea.stories.js.map +1 -1
- package/dist/Toggle/Toggle.js +19 -13
- package/dist/Toggle/Toggle.js.map +1 -1
- package/dist/Tooltip/Tooltip.d.ts +3 -3
- package/dist/Tooltip/Tooltip.js +16 -13
- package/dist/Tooltip/Tooltip.js.map +1 -1
- package/dist/Tooltip/Tooltip.stories.d.ts +1 -0
- package/dist/Tooltip/Tooltip.stories.js +15 -4
- package/dist/Tooltip/Tooltip.stories.js.map +1 -1
- package/dist/colors.stories.js +37 -11
- package/dist/colors.stories.js.map +1 -1
- package/dist/fields/Field/Field.d.ts +0 -1
- package/dist/fields/Field/Field.js.map +1 -1
- package/dist/fields/Fieldset/Fieldset.js +1 -1
- package/dist/fields/Fieldset/Fieldset.js.map +1 -1
- package/dist/fields/commonFieldTypes.d.ts +4 -3
- package/dist/fields/components/CommonInput.d.ts +18 -0
- package/dist/fields/components/CommonInput.js +64 -0
- package/dist/fields/components/CommonInput.js.map +1 -0
- package/dist/fields/components/InternalField.d.ts +3 -3
- package/dist/fields/components/InternalField.js +7 -7
- package/dist/fields/components/InternalField.js.map +1 -1
- package/dist/fields/components/Placeholder.js +3 -3
- package/dist/fields/components/Placeholder.js.map +1 -1
- package/dist/fontStyle.js +2 -2
- package/dist/index.d.ts +0 -3
- package/dist/index.js +0 -3
- package/dist/index.js.map +1 -1
- package/dist/theme.d.ts +58 -28
- package/dist/theme.js +34 -18
- package/dist/theme.js.map +1 -1
- package/dist/utils/focusOutline.d.ts +1 -0
- package/dist/utils/focusOutline.js +7 -1
- package/dist/utils/focusOutline.js.map +1 -1
- package/package.json +2 -1
- package/dist/ConfirmationRadioButtons/Confirmation.d.ts +0 -17
- package/dist/ConfirmationRadioButtons/Confirmation.js +0 -100
- package/dist/ConfirmationRadioButtons/Confirmation.js.map +0 -1
- package/dist/ConfirmationRadioButtons/Confirmation.stories.d.ts +0 -21
- package/dist/ConfirmationRadioButtons/Confirmation.stories.js +0 -76
- package/dist/ConfirmationRadioButtons/Confirmation.stories.js.map +0 -1
- package/dist/ConfirmationRadioButtons/Container.d.ts +0 -2
- package/dist/ConfirmationRadioButtons/Container.js +0 -8
- package/dist/ConfirmationRadioButtons/Container.js.map +0 -1
- package/dist/ConfirmationRadioButtons/RadioButtonStyled.d.ts +0 -17
- package/dist/ConfirmationRadioButtons/RadioButtonStyled.js +0 -41
- package/dist/ConfirmationRadioButtons/RadioButtonStyled.js.map +0 -1
- package/dist/ConfirmationRadioButtons/__tests__/Confirmation.js +0 -8
- package/dist/ConfirmationRadioButtons/__tests__/Confirmation.js.map +0 -1
- package/dist/ConfirmationRadioButtons/index.d.ts +0 -1
- package/dist/ConfirmationRadioButtons/index.js +0 -2
- package/dist/ConfirmationRadioButtons/index.js.map +0 -1
- package/dist/Message/Message.d.ts +0 -21
- package/dist/Message/Message.js +0 -45
- package/dist/Message/Message.js.map +0 -1
- package/dist/Message/Message.stories.d.ts +0 -13
- package/dist/Message/Message.stories.js +0 -38
- package/dist/Message/Message.stories.js.map +0 -1
- package/dist/Message/__tests__/Message.js +0 -26
- package/dist/Message/__tests__/Message.js.map +0 -1
- package/dist/Message/index.d.ts +0 -1
- package/dist/Message/index.js +0 -2
- package/dist/Message/index.js.map +0 -1
- package/dist/RadioButton/Container.d.ts +0 -2
- package/dist/RadioButton/Container.js +0 -9
- package/dist/RadioButton/Container.js.map +0 -1
- package/dist/RadioButton/RadioButton.d.ts +0 -10
- package/dist/RadioButton/RadioButton.js +0 -68
- package/dist/RadioButton/RadioButton.js.map +0 -1
- package/dist/RadioButton/RadioButton.stories.d.ts +0 -15
- package/dist/RadioButton/RadioButton.stories.js +0 -29
- package/dist/RadioButton/RadioButton.stories.js.map +0 -1
- package/dist/RadioButton/__tests__/RadioButton.js +0 -13
- package/dist/RadioButton/__tests__/RadioButton.js.map +0 -1
- package/dist/RadioButton/index.d.ts +0 -1
- package/dist/RadioButton/index.js +0 -2
- package/dist/RadioButton/index.js.map +0 -1
- /package/dist/{ConfirmationRadioButtons/__tests__/Confirmation.d.ts → Accordion/__tests__/Accordion.d.ts} +0 -0
- /package/dist/{Message/__tests__/Message.d.ts → BrandCard/__tests__/BrandCard.d.ts} +0 -0
- /package/dist/{RadioButton/__tests__/RadioButton.d.ts → IconStrict/__tests__/IconStrict.d.ts} +0 -0
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"NumberInput.js","sourceRoot":"","sources":["../../src/NumberInput/NumberInput.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAGZ,UAAU,GAGX,MAAM,OAAO,CAAA;AACd,OAAO,MAAM,MAAM,mBAAmB,CAAA;AAEtC,OAAO,EAAE,GAAG,EAAE,MAAM,QAAQ,CAAA;AAC5B,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAC9B,OAAO,EAAE,
|
1
|
+
{"version":3,"file":"NumberInput.js","sourceRoot":"","sources":["../../src/NumberInput/NumberInput.tsx"],"names":[],"mappings":"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"}
|
@@ -11,11 +11,6 @@ declare const _default: {
|
|
11
11
|
};
|
12
12
|
export default _default;
|
13
13
|
export declare const Default: any;
|
14
|
-
export declare const
|
15
|
-
export declare const
|
16
|
-
export declare const Currency: any;
|
17
|
-
export declare const Distance: any;
|
18
|
-
export declare const Telephone: any;
|
19
|
-
export declare const Disabled: any;
|
20
|
-
export declare const WithOutline: any;
|
14
|
+
export declare const DefaultFallback: any;
|
15
|
+
export declare const Collection: any;
|
21
16
|
export declare const WorkingExample: any;
|
@@ -2,6 +2,7 @@ import React from 'react';
|
|
2
2
|
import { NumberInput } from './NumberInput';
|
3
3
|
import { Container } from './Container';
|
4
4
|
import { noop } from '../utils/noop';
|
5
|
+
import { CollectionPage } from './Collection';
|
5
6
|
export default {
|
6
7
|
title: 'Number Input',
|
7
8
|
component: NumberInput,
|
@@ -15,87 +16,18 @@ Default.args = {
|
|
15
16
|
name: 'totalAmount',
|
16
17
|
placeholder: '0',
|
17
18
|
onChange: noop,
|
18
|
-
outlined: false,
|
19
19
|
};
|
20
|
-
export const
|
21
|
-
|
22
|
-
id: 'total_amount',
|
23
|
-
label: 'Total Amount',
|
24
|
-
name: 'totalAmount',
|
25
|
-
placeholder: '0',
|
26
|
-
onChange: noop,
|
27
|
-
required: true,
|
28
|
-
outlined: false,
|
29
|
-
};
|
30
|
-
export const Error = Template.bind({});
|
31
|
-
Error.args = {
|
32
|
-
id: 'total_amount',
|
33
|
-
label: 'Total Amount',
|
34
|
-
name: 'totalAmount',
|
35
|
-
placeholder: '0',
|
36
|
-
onChange: noop,
|
37
|
-
error: true,
|
38
|
-
errorMsg: 'Oh boy, something went wrong!',
|
39
|
-
outlined: false,
|
40
|
-
};
|
41
|
-
export const Currency = Template.bind({});
|
42
|
-
Currency.args = {
|
43
|
-
id: 'currency',
|
44
|
-
label: 'Currency',
|
45
|
-
name: 'currencyAmount',
|
46
|
-
placeholder: '0.00',
|
47
|
-
prefix: '$',
|
48
|
-
roundCurrency: true,
|
49
|
-
required: true,
|
50
|
-
onChange: noop,
|
51
|
-
step: 10,
|
52
|
-
outlined: false,
|
53
|
-
};
|
54
|
-
export const Distance = Template.bind({});
|
55
|
-
Distance.args = {
|
56
|
-
id: 'distance',
|
57
|
-
label: 'Distance',
|
58
|
-
name: 'distanceNumber',
|
59
|
-
placeholder: '0',
|
60
|
-
suffix: 'km',
|
61
|
-
required: true,
|
62
|
-
onChange: noop,
|
63
|
-
step: 100,
|
64
|
-
outlined: false,
|
65
|
-
};
|
66
|
-
export const Telephone = Template.bind({});
|
67
|
-
Telephone.args = {
|
68
|
-
id: 'telephone',
|
69
|
-
label: 'Telephone number',
|
70
|
-
name: 'telephoneNumber',
|
71
|
-
placeholder: '7123 456789',
|
72
|
-
prefix: '+44',
|
73
|
-
required: true,
|
74
|
-
onChange: noop,
|
75
|
-
outlined: false,
|
76
|
-
};
|
77
|
-
export const Disabled = Template.bind({});
|
78
|
-
Disabled.args = {
|
20
|
+
export const DefaultFallback = Template.bind({});
|
21
|
+
DefaultFallback.args = {
|
79
22
|
id: 'telephone',
|
80
23
|
label: 'Telephone number',
|
81
24
|
name: 'telephoneNumber',
|
82
25
|
placeholder: '7123 456789',
|
83
|
-
prefix: '+44',
|
84
26
|
required: true,
|
85
27
|
onChange: noop,
|
86
|
-
|
87
|
-
outlined: false,
|
88
|
-
};
|
89
|
-
export const WithOutline = Template.bind({});
|
90
|
-
WithOutline.args = {
|
91
|
-
id: 'outlined',
|
92
|
-
label: 'with outline',
|
93
|
-
name: 'outlined',
|
94
|
-
required: false,
|
95
|
-
onChange: noop,
|
96
|
-
disabled: false,
|
97
|
-
outlined: true,
|
28
|
+
fallback: true,
|
98
29
|
};
|
30
|
+
export const Collection = CollectionPage.bind({});
|
99
31
|
const WorkingExampleTemplate = () => React.createElement(Container, null);
|
100
32
|
export const WorkingExample = WorkingExampleTemplate.bind({});
|
101
33
|
//# sourceMappingURL=NumberInput.stories.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"NumberInput.stories.js","sourceRoot":"","sources":["../../src/NumberInput/NumberInput.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,WAAW,EAAoB,MAAM,eAAe,CAAA;AAC7D,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAA;AACvC,OAAO,EAAE,IAAI,EAAE,MAAM,eAAe,CAAA;
|
1
|
+
{"version":3,"file":"NumberInput.stories.js","sourceRoot":"","sources":["../../src/NumberInput/NumberInput.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,WAAW,EAAoB,MAAM,eAAe,CAAA;AAC7D,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAA;AACvC,OAAO,EAAE,IAAI,EAAE,MAAM,eAAe,CAAA;AACpC,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAA;AAE7C,eAAe;IACb,KAAK,EAAE,cAAc;IACrB,SAAS,EAAE,WAAW;IACtB,QAAQ,EAAE,EAAE,QAAQ,EAAE,EAAE,MAAM,EAAE,SAAS,EAAE,EAAE;CAC9C,CAAA;AAED,MAAM,QAAQ,GAAG,CAAC,KAAuB,EAAE,EAAE,CAAC,oBAAC,WAAW,oBAAK,KAAK,EAAI,CAAA;AAExE,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAExC,OAAO,CAAC,IAAI,GAAG;IACb,EAAE,EAAE,cAAc;IAClB,KAAK,EAAE,cAAc;IACrB,IAAI,EAAE,aAAa;IACnB,WAAW,EAAE,GAAG;IAChB,QAAQ,EAAE,IAAI;CACf,CAAA;AAED,MAAM,CAAC,MAAM,eAAe,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAEhD,eAAe,CAAC,IAAI,GAAG;IACrB,EAAE,EAAE,WAAW;IACf,KAAK,EAAE,kBAAkB;IACzB,IAAI,EAAE,iBAAiB;IACvB,WAAW,EAAE,aAAa;IAC1B,QAAQ,EAAE,IAAI;IACd,QAAQ,EAAE,IAAI;IACd,QAAQ,EAAE,IAAI;CACf,CAAA;AAED,MAAM,CAAC,MAAM,UAAU,GAAG,cAAc,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAEjD,MAAM,sBAAsB,GAAG,GAAG,EAAE,CAAC,oBAAC,SAAS,OAAG,CAAA;AAElD,MAAM,CAAC,MAAM,cAAc,GAAG,sBAAsB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA"}
|
@@ -15,6 +15,7 @@ import { Box } from '../Box';
|
|
15
15
|
import { Text } from '../Text';
|
16
16
|
import { Icon } from '../Icon';
|
17
17
|
import { theme } from '../theme';
|
18
|
+
import { focusOutlineStyle } from '../utils/focusOutline';
|
18
19
|
const MAX_PAGES = 7;
|
19
20
|
const MAX_ADDITIONAL_PAGES = Math.ceil(MAX_PAGES / 2);
|
20
21
|
export const Pagination = (_a) => {
|
@@ -79,28 +80,42 @@ export const Pagination = (_a) => {
|
|
79
80
|
}
|
80
81
|
};
|
81
82
|
return (React.createElement(Container, Object.assign({ flex: true, direction: "row" }, marginProps),
|
82
|
-
activePage - 1 > 0 && (React.createElement(
|
83
|
-
|
83
|
+
activePage - 1 > 0 && (React.createElement(IconBox, { firstPage: true, onClick: () => movePage(activePage - 1), onKeyDown: (e) => {
|
84
|
+
if (e.key === 'Enter') {
|
85
|
+
movePage(activePage - 1);
|
86
|
+
}
|
87
|
+
} },
|
88
|
+
React.createElement(Icon, { size: 18, render: "arrow" }))),
|
84
89
|
React.createElement(PageBox, { active: activePage === 1, onClick: () => movePage(1) },
|
85
90
|
React.createElement(Text, { typo: activePage === 1 ? 'desc-medium' : 'desc-light', tag: "p" }, "1")),
|
86
|
-
showFirstDots && (React.createElement(
|
91
|
+
showFirstDots && (React.createElement(PageBox, null,
|
87
92
|
React.createElement(Text, { tag: "p" }, "..."))),
|
88
93
|
shownPages.map((i) => {
|
89
|
-
return (React.createElement(PageBox, { active: activePage === i, key: i, onClick: () => movePage(i)
|
94
|
+
return (React.createElement(PageBox, { active: activePage === i, key: i, onClick: () => movePage(i), onKeyDown: (e) => {
|
95
|
+
if (e.key === 'Enter') {
|
96
|
+
movePage(i);
|
97
|
+
}
|
98
|
+
} },
|
90
99
|
React.createElement(Text, { typo: activePage === i ? 'desc-medium' : 'desc-light', tag: "p" }, i)));
|
91
100
|
}),
|
92
|
-
showLastDots && (React.createElement(
|
101
|
+
showLastDots && (React.createElement(PageBox, null,
|
93
102
|
React.createElement(Text, { tag: "p" }, "..."))),
|
94
|
-
Boolean(lastPage) && (React.createElement(PageBox, { active: activePage === lastPage, onClick: () => movePage(lastPage)
|
103
|
+
Boolean(lastPage) && (React.createElement(PageBox, { active: activePage === lastPage, onClick: () => movePage(lastPage), onKeyDown: (e) => {
|
104
|
+
if (e.key === 'Enter') {
|
105
|
+
movePage(lastPage);
|
106
|
+
}
|
107
|
+
} },
|
95
108
|
React.createElement(Text, { typo: activePage === lastPage ? 'desc-medium' : 'desc-light', tag: "p" }, lastPage))),
|
96
|
-
activePage + 1 <= lastPage && (React.createElement(
|
109
|
+
activePage + 1 <= lastPage && (React.createElement(IconBox, { onClick: () => movePage(activePage + 1), onKeyDown: (e) => {
|
110
|
+
if (e.key === 'Enter') {
|
111
|
+
movePage(activePage + 1);
|
112
|
+
}
|
113
|
+
} },
|
97
114
|
React.createElement(Icon, { size: 18, render: "arrow", rotate: 180 })))));
|
98
115
|
};
|
99
116
|
const Container = styled(Box) `
|
100
117
|
align-items: center;
|
101
|
-
|
102
|
-
> div {
|
103
|
-
width: 24px;
|
118
|
+
> button {
|
104
119
|
margin-right: 4px;
|
105
120
|
|
106
121
|
&:last-child {
|
@@ -108,11 +123,27 @@ const Container = styled(Box) `
|
|
108
123
|
}
|
109
124
|
}
|
110
125
|
`;
|
111
|
-
const PageBox = styled
|
112
|
-
background: ${({ active }) =>
|
126
|
+
const PageBox = styled.button `
|
127
|
+
background: ${({ active }) => active ? theme.colors.custard : theme.colors.cream};
|
113
128
|
cursor: pointer;
|
114
129
|
display: flex;
|
115
130
|
justify-content: center;
|
116
131
|
border-radius: 50%;
|
132
|
+
width: 24px;
|
133
|
+
height: 24px;
|
134
|
+
|
135
|
+
&:hover {
|
136
|
+
background-color: ${theme.colors.mascarpone};
|
137
|
+
}
|
138
|
+
&:active {
|
139
|
+
background-color: ${theme.colors.custard};
|
140
|
+
}
|
141
|
+
|
142
|
+
${focusOutlineStyle}
|
143
|
+
`;
|
144
|
+
const IconBox = styled.button `
|
145
|
+
cursor: pointer;
|
146
|
+
|
147
|
+
${focusOutlineStyle}
|
117
148
|
`;
|
118
149
|
//# sourceMappingURL=Pagination.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Pagination.js","sourceRoot":"","sources":["../../src/Pagination/Pagination.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAM,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACtD,OAAO,MAAM,MAAM,mBAAmB,CAAA;AAEtC,OAAO,EAAE,GAAG,EAAE,MAAM,QAAQ,CAAA;AAC5B,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAC9B,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAE9B,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;
|
1
|
+
{"version":3,"file":"Pagination.js","sourceRoot":"","sources":["../../src/Pagination/Pagination.tsx"],"names":[],"mappings":"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"}
|
@@ -1,11 +1,18 @@
|
|
1
1
|
import React from 'react';
|
2
2
|
import { Pagination } from './Pagination';
|
3
|
+
import { Box } from '../Box';
|
4
|
+
import styled from 'styled-components';
|
5
|
+
import { theme } from '../theme';
|
3
6
|
export default {
|
4
7
|
title: 'Pagination',
|
5
8
|
component: Pagination,
|
6
9
|
argTypes: { handlePageChange: { action: 'pageChanged' } },
|
7
10
|
};
|
8
|
-
const
|
11
|
+
const BgWrapper = styled(Box) `
|
12
|
+
background: ${theme.colors.coconut};
|
13
|
+
`;
|
14
|
+
const Template = (props) => (React.createElement(BgWrapper, { height: "100px", flex: true, alignItems: "center" },
|
15
|
+
React.createElement(Pagination, Object.assign({ mx: "32px" }, props))));
|
9
16
|
export const Default = Template.bind({});
|
10
17
|
Default.args = {
|
11
18
|
total: 7,
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Pagination.stories.js","sourceRoot":"","sources":["../../src/Pagination/Pagination.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,UAAU,EAAmB,MAAM,cAAc,CAAA;
|
1
|
+
{"version":3,"file":"Pagination.stories.js","sourceRoot":"","sources":["../../src/Pagination/Pagination.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,UAAU,EAAmB,MAAM,cAAc,CAAA;AAC1D,OAAO,EAAE,GAAG,EAAE,MAAM,QAAQ,CAAA;AAC5B,OAAO,MAAM,MAAM,mBAAmB,CAAA;AACtC,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAEhC,eAAe;IACb,KAAK,EAAE,YAAY;IACnB,SAAS,EAAE,UAAU;IACrB,QAAQ,EAAE,EAAE,gBAAgB,EAAE,EAAE,MAAM,EAAE,aAAa,EAAE,EAAE;CAC1D,CAAA;AAED,MAAM,SAAS,GAAG,MAAM,CAAC,GAAG,CAAC,CAAA;gBACb,KAAK,CAAC,MAAM,CAAC,OAAO;CACnC,CAAA;AAED,MAAM,QAAQ,GAAG,CAAC,KAA4C,EAAE,EAAE,CAAC,CACjE,oBAAC,SAAS,IAAC,MAAM,EAAC,OAAO,EAAC,IAAI,QAAC,UAAU,EAAC,QAAQ;IAChD,oBAAC,UAAU,kBAAC,EAAE,EAAC,MAAM,IAAK,KAAK,EAAI,CACzB,CACb,CAAA;AAED,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAExC,OAAO,CAAC,IAAI,GAAG;IACb,KAAK,EAAE,CAAC;IACR,SAAS,EAAE,CAAC;CACb,CAAA;AAED,MAAM,CAAC,MAAM,gBAAgB,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAEjD,gBAAgB,CAAC,IAAI,GAAG;IACtB,KAAK,EAAE,EAAE;IACT,SAAS,EAAE,CAAC;CACb,CAAA"}
|
@@ -30,20 +30,20 @@ const RadioCircle = styled(Box) `
|
|
30
30
|
width: ${RADIO_SIZE}px;
|
31
31
|
height: ${RADIO_SIZE}px;
|
32
32
|
border-radius: ${RADIO_SIZE}px;
|
33
|
-
background-color: ${theme.colors.
|
33
|
+
background-color: ${theme.colors.cream};
|
34
34
|
border: 2px solid
|
35
|
-
${({ isError }) =>
|
35
|
+
${({ isError }) => isError ? theme.colors.strawberry : theme.colors.sesame};
|
36
36
|
|
37
37
|
${({ checked, isError }) => !checked &&
|
38
38
|
!isError &&
|
39
39
|
`
|
40
40
|
&:hover {
|
41
|
-
border: 2px solid ${theme.colors.
|
41
|
+
border: 2px solid ${theme.colors.liquorice};
|
42
42
|
}
|
43
43
|
`}
|
44
44
|
|
45
45
|
${({ checked, isError }) => checked &&
|
46
|
-
`border: 8px solid ${isError ? theme.colors.
|
46
|
+
`border: 8px solid ${isError ? theme.colors.strawberry : theme.colors.liquorice};`}
|
47
47
|
|
48
48
|
${focusOutline({ selector: `${StyledInput}:focus-visible + &` })}
|
49
49
|
`;
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"RadioElement.js","sourceRoot":"","sources":["../../src/RadioGroup/RadioElement.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AACzC,OAAO,MAAM,MAAM,mBAAmB,CAAA;AAEtC,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAEhC,OAAO,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAA;AACxD,OAAO,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAA;AAEpD,OAAO,EAAE,GAAG,EAAE,MAAM,QAAQ,CAAA;AAY5B,MAAM,CAAC,MAAM,YAAY,GAAG,UAAU,CACpC,SAAS,YAAY,CACnB,EAA+D,EAC/D,GAAG;QADH,EAAE,IAAI,EAAE,EAAE,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,OAAO,OAAkB,EAAb,WAAW,cAA7D,yDAA+D,CAAF;IAG7D,OAAO,CACL;QACE,oBAAC,WAAW,IACV,GAAG,EAAE,GAAG,EACR,IAAI,EAAC,OAAO,EACZ,IAAI,EAAE,IAAI,EACV,EAAE,EAAE,EAAE,EACN,KAAK,EAAE,GAAG,KAAK,EAAE,EACjB,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAC,GAC/B;QACF,oBAAC,WAAW,kBAAC,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,OAAO,IAAM,WAAW,EAAI,CACnE,CACJ,CAAA;AACH,CAAC,CACF,CAAA;AAED,MAAM,WAAW,GAAG,MAAM,CAAC,KAAK,CAAA;IAC5B,cAAc;CACjB,CAAA;AAED,MAAM,UAAU,GAAG,EAAE,CAAA;AAErB,MAAM,WAAW,GAAG,MAAM,CAAC,GAAG,CAAC,CAAwC;;WAE5D,UAAU;YACT,UAAU;mBACH,UAAU;sBACP,KAAK,CAAC,MAAM,CAAC,KAAK;;MAElC,CAAC,EAAE,OAAO,EAAE,EAAE,EAAE,
|
1
|
+
{"version":3,"file":"RadioElement.js","sourceRoot":"","sources":["../../src/RadioGroup/RadioElement.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AACzC,OAAO,MAAM,MAAM,mBAAmB,CAAA;AAEtC,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAEhC,OAAO,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAA;AACxD,OAAO,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAA;AAEpD,OAAO,EAAE,GAAG,EAAE,MAAM,QAAQ,CAAA;AAY5B,MAAM,CAAC,MAAM,YAAY,GAAG,UAAU,CACpC,SAAS,YAAY,CACnB,EAA+D,EAC/D,GAAG;QADH,EAAE,IAAI,EAAE,EAAE,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,OAAO,OAAkB,EAAb,WAAW,cAA7D,yDAA+D,CAAF;IAG7D,OAAO,CACL;QACE,oBAAC,WAAW,IACV,GAAG,EAAE,GAAG,EACR,IAAI,EAAC,OAAO,EACZ,IAAI,EAAE,IAAI,EACV,EAAE,EAAE,EAAE,EACN,KAAK,EAAE,GAAG,KAAK,EAAE,EACjB,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAC,GAC/B;QACF,oBAAC,WAAW,kBAAC,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,OAAO,IAAM,WAAW,EAAI,CACnE,CACJ,CAAA;AACH,CAAC,CACF,CAAA;AAED,MAAM,WAAW,GAAG,MAAM,CAAC,KAAK,CAAA;IAC5B,cAAc;CACjB,CAAA;AAED,MAAM,UAAU,GAAG,EAAE,CAAA;AAErB,MAAM,WAAW,GAAG,MAAM,CAAC,GAAG,CAAC,CAAwC;;WAE5D,UAAU;YACT,UAAU;mBACH,UAAU;sBACP,KAAK,CAAC,MAAM,CAAC,KAAK;;MAElC,CAAC,EAAE,OAAO,EAAE,EAAE,EAAE,CAChB,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,MAAM;;IAEzD,CAAC,EAAE,OAAO,EAAE,OAAO,EAAE,EAAE,EAAE,CACzB,CAAC,OAAO;IACR,CAAC,OAAO;IACR;;0BAEsB,KAAK,CAAC,MAAM,CAAC,SAAS;;GAE7C;;IAEC,CAAC,EAAE,OAAO,EAAE,OAAO,EAAE,EAAE,EAAE,CACzB,OAAO;IACP,qBACE,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,SACnD,GAAG;;IAEH,YAAY,CAAC,EAAE,QAAQ,EAAE,GAAG,WAAW,oBAAoB,EAAE,CAAC;CACjE,CAAA"}
|
@@ -6,10 +6,12 @@ export type RadioGroupProps<Value extends BaseValueType = BaseValueType> = {
|
|
6
6
|
visual?: string;
|
7
7
|
label: string;
|
8
8
|
value: Value;
|
9
|
+
bodyCopy?: string;
|
9
10
|
}>;
|
10
11
|
onChange: (value: Value) => void;
|
11
12
|
value: Value;
|
12
13
|
displayType?: DisplayType;
|
14
|
+
fallback?: boolean;
|
13
15
|
} & CommonFieldProps;
|
14
16
|
export type RadioGroupElement = {
|
15
17
|
focus: VoidFunction;
|
@@ -19,8 +21,10 @@ export declare const RadioGroup: <Value extends BaseValueType = BaseValueType>(p
|
|
19
21
|
visual?: string | undefined;
|
20
22
|
label: string;
|
21
23
|
value: Value;
|
24
|
+
bodyCopy?: string | undefined;
|
22
25
|
}[];
|
23
26
|
onChange: (value: Value) => void;
|
24
27
|
value: Value;
|
25
28
|
displayType?: DisplayType | undefined;
|
29
|
+
fallback?: boolean | undefined;
|
26
30
|
} & CommonFieldProps & React.RefAttributes<HTMLInputElement>) => ReactElement | null;
|
@@ -16,7 +16,7 @@ import { Fieldset } from '../fields/Fieldset';
|
|
16
16
|
import { RadioItem } from './RadioItem';
|
17
17
|
import { ITEM_GAP } from './constants';
|
18
18
|
const RadioGroupComponent = (_a, ref) => {
|
19
|
-
var { options, onChange, value, displayType = 'normal', renderAsTitle = false, error = false } = _a, fieldProps = __rest(_a, ["options", "onChange", "value", "displayType", "renderAsTitle", "error"]);
|
19
|
+
var { options, onChange, value, displayType = 'normal', renderAsTitle = false, error = false, fallback = false } = _a, fieldProps = __rest(_a, ["options", "onChange", "value", "displayType", "renderAsTitle", "error", "fallback"]);
|
20
20
|
const name = useUniqueId();
|
21
21
|
const optionRefs = useRef([]);
|
22
22
|
useImperativeHandle(ref, () => {
|
@@ -36,7 +36,7 @@ const RadioGroupComponent = (_a, ref) => {
|
|
36
36
|
optionRefs.current[index] = {
|
37
37
|
current: radioOptionRef,
|
38
38
|
};
|
39
|
-
}, key: `${option.value}`, name: name, visual: option.visual, label: option.label, value: option.value, checked: isSelected, onChange: onChange, displayType: displayType, isError: error }));
|
39
|
+
}, key: `${option.value}`, name: name, visual: option.visual, label: option.label, value: option.value, checked: isSelected, onChange: onChange, displayType: displayType, isError: error, fallback: fallback, bodyCopy: option.bodyCopy }));
|
40
40
|
}))));
|
41
41
|
};
|
42
42
|
export const RadioGroup = forwardRef(RadioGroupComponent);
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"RadioGroup.js","sourceRoot":"","sources":["../../src/RadioGroup/RadioGroup.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAEZ,UAAU,EAGV,mBAAmB,EACnB,MAAM,GACP,MAAM,OAAO,CAAA;AACd,OAAO,MAAM,MAAM,mBAAmB,CAAA;AAEtC,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAA;AAEzC,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAA;AAE7C,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAA;AAEvC,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAA;
|
1
|
+
{"version":3,"file":"RadioGroup.js","sourceRoot":"","sources":["../../src/RadioGroup/RadioGroup.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAEZ,UAAU,EAGV,mBAAmB,EACnB,MAAM,GACP,MAAM,OAAO,CAAA;AACd,OAAO,MAAM,MAAM,mBAAmB,CAAA;AAEtC,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAA;AAEzC,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAA;AAE7C,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAA;AAEvC,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAA;AAmBtC,MAAM,mBAAmB,GAAG,CAC1B,EASyB,EACzB,GAAoC,EACpC,EAAE;QAXF,EACE,OAAO,EACP,QAAQ,EACR,KAAK,EACL,WAAW,GAAG,QAAQ,EACtB,aAAa,GAAG,KAAK,EACrB,KAAK,GAAG,KAAK,EACb,QAAQ,GAAG,KAAK,OAEO,EADpB,UAAU,cARf,qFASC,CADc;IAIf,MAAM,IAAI,GAAG,WAAW,EAAE,CAAA;IAE1B,MAAM,UAAU,GAAG,MAAM,CAAgC,EAAE,CAAC,CAAA;IAC5D,mBAAmB,CAAC,GAAG,EAAE,GAAG,EAAE;QAC5B,OAAO;YACL,KAAK,EAAE,GAAG,EAAE;;gBACV,MAAM,aAAa,GAAG,OAAO,CAAC,SAAS,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,KAAK,KAAK,KAAK,CAAC,CAAA;gBAEvE,MAAM,cAAc,GAAG,aAAa,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,aAAa,CAAA;gBAC/D,MAAA,UAAU,CAAC,OAAO,CAAC,cAAc,CAAC,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAA;YACrD,CAAC;SACF,CAAA;IACH,CAAC,CAAC,CAAA;IAEF,OAAO,CACL,oBAAC,QAAQ,kBAAC,aAAa,EAAE,aAAa,EAAE,KAAK,EAAE,KAAK,IAAM,UAAU;QAClE,oBAAC,aAAa,IAAC,WAAW,EAAE,WAAW,IACpC,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE;YAC7B,MAAM,UAAU,GAAG,MAAM,CAAC,KAAK,KAAK,KAAK,CAAA;YAEzC,OAAO,CACL,oBAAC,SAAS,IACR,GAAG,EAAE,CAAC,cAAc,EAAE,EAAE;oBACtB,UAAU,CAAC,OAAO,CAAC,KAAK,CAAC,GAAG;wBAC1B,OAAO,EAAE,cAAc;qBACxB,CAAA;gBACH,CAAC,EACD,GAAG,EAAE,GAAG,MAAM,CAAC,KAAK,EAAE,EACtB,IAAI,EAAE,IAAI,EACV,MAAM,EAAE,MAAM,CAAC,MAAM,EACrB,KAAK,EAAE,MAAM,CAAC,KAAK,EACnB,KAAK,EAAE,MAAM,CAAC,KAAK,EACnB,OAAO,EAAE,UAAU,EACnB,QAAQ,EAAE,QAAQ,EAClB,WAAW,EAAE,WAAW,EACxB,OAAO,EAAE,KAAK,EACd,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,MAAM,CAAC,QAAQ,GACzB,CACH,CAAA;QACH,CAAC,CAAC,CACY,CACP,CACZ,CAAA;AACH,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,UAAU,GAAG,UAAU,CAAC,mBAAmB,CAIhC,CAAA;AAExB,MAAM,aAAa,GAAG,MAAM,CAAC,GAAG,CAAsC;;SAE7D,QAAQ;;IAEb,CAAC,EAAE,WAAW,EAAE,EAAE,EAAE;IACpB,IAAI,WAAW,KAAK,iBAAiB,EAAE;QACrC,OAAO;;;OAGN,CAAA;KACF;IAED,OAAO,yBAAyB,CAAA;AAClC,CAAC;CACF,CAAA"}
|
@@ -6,10 +6,12 @@ declare const _default: {
|
|
6
6
|
visual?: string | undefined;
|
7
7
|
label: string;
|
8
8
|
value: Value;
|
9
|
+
bodyCopy?: string | undefined;
|
9
10
|
}[];
|
10
11
|
onChange: (value: Value) => void;
|
11
12
|
value: Value;
|
12
13
|
displayType?: import("./types").DisplayType | undefined;
|
14
|
+
fallback?: boolean | undefined;
|
13
15
|
} & import("../fields/commonFieldTypes").CommonFieldProps & React.RefAttributes<HTMLInputElement>) => React.ReactElement<any, string | React.JSXElementConstructor<any>> | null;
|
14
16
|
argTypes: {
|
15
17
|
onChange: {
|
@@ -22,5 +24,6 @@ export declare const Interactive: any;
|
|
22
24
|
export declare const Default: any;
|
23
25
|
export declare const Vertical: any;
|
24
26
|
export declare const Horizontal: any;
|
27
|
+
export declare const WithBodyCopy: any;
|
25
28
|
export declare const WithError: any;
|
26
29
|
export declare const WithVisual: any;
|
@@ -35,6 +35,8 @@ export const Vertical = Template.bind({});
|
|
35
35
|
Vertical.args = Object.assign(Object.assign({}, defaultArgs), { displayType: 'vertical-card' });
|
36
36
|
export const Horizontal = Template.bind({});
|
37
37
|
Horizontal.args = Object.assign(Object.assign({}, defaultArgs), { displayType: 'horizontal-card' });
|
38
|
+
export const WithBodyCopy = Template.bind({});
|
39
|
+
WithBodyCopy.args = Object.assign(Object.assign({}, defaultArgs), { displayType: 'vertical-card', options: options.map((option) => (Object.assign(Object.assign({}, option), { bodyCopy: 'E.g. shopping, travel and driving to see friends. Does not include travelling to and from work.' }))) });
|
38
40
|
export const WithError = Template.bind({});
|
39
41
|
WithError.args = Object.assign(Object.assign({}, defaultArgs), { error: true, errorMsg: 'something', displayType: 'horizontal-card' });
|
40
42
|
export const WithVisual = Template.bind({});
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"RadioGroup.stories.js","sourceRoot":"","sources":["../../src/RadioGroup/RadioGroup.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACvC,OAAO,EAAE,UAAU,EAAmB,MAAM,cAAc,CAAA;AAC1D,OAAO,SAAS,MAAM,2BAA2B,CAAA;AAEjD,eAAe;IACb,KAAK,EAAE,YAAY;IACnB,SAAS,EAAE,UAAU;IACrB,QAAQ,EAAE,EAAE,QAAQ,EAAE,EAAE,MAAM,EAAE,SAAS,EAAE,EAAE;CAC9C,CAAA;AAED,MAAM,OAAO,GAAG;IACd,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE;IACpC,EAAE,KAAK,EAAE,sBAAsB,EAAE,KAAK,EAAE,kBAAkB,EAAE;IAC5D;QACE,KAAK,EAAE,qCAAqC;QAC5C,KAAK,EAAE,uBAAuB;KAC/B;IACD,EAAE,KAAK,EAAE,2BAA2B,EAAE,KAAK,EAAE,YAAY,EAAE;CAC5D,CAAA;AAED,MAAM,WAAW,GAAoB;IACnC,KAAK,EAAE,yBAAyB;IAChC,QAAQ,EAAE,CAAC,KAAa,EAAE,EAAE,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC;IAC/C,KAAK,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC,KAAK;IACvB,OAAO;IACP,WAAW,EAAE,QAAQ;CACtB,CAAA;AAED,MAAM,gBAAgB,GAAG,CAAC,KAA8B,EAAE,EAAE;IAC1D,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAA;IAEtC,OAAO,CACL,oBAAC,UAAU,oBACL,KAAK,IACT,QAAQ,EAAE,CAAC,SAAS,EAAE,EAAE,CAAC,QAAQ,CAAC,SAAS,CAAC,EAC5C,KAAK,EAAE,KAAK,IACZ,CACH,CAAA;AACH,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,WAAW,GAAG,gBAAgB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAEpD,WAAW,CAAC,IAAI,GAAG,WAAW,CAAA;AAE9B,MAAM,QAAQ,GAAG,CAAC,KAAsB,EAAE,EAAE,CAAC,oBAAC,UAAU,oBAAK,KAAK,EAAI,CAAA;AAEtE,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAExC,OAAO,CAAC,IAAI,GAAG,WAAW,CAAA;AAE1B,MAAM,CAAC,MAAM,QAAQ,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAEzC,QAAQ,CAAC,IAAI,mCACR,WAAW,KACd,WAAW,EAAE,eAAe,GAC7B,CAAA;AAED,MAAM,CAAC,MAAM,UAAU,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAE3C,UAAU,CAAC,IAAI,mCACV,WAAW,KACd,WAAW,EAAE,iBAAiB,GAC/B,CAAA;AAED,MAAM,CAAC,MAAM,SAAS,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAE1C,SAAS,CAAC,IAAI,mCACT,WAAW,KACd,KAAK,EAAE,IAAI,EACX,QAAQ,EAAE,WAAW,EACrB,WAAW,EAAE,iBAAiB,GAC/B,CAAA;AAED,MAAM,CAAC,MAAM,UAAU,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAE3C,UAAU,CAAC,IAAI,mCACV,WAAW,KACd,OAAO,EAAE,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,iCAAM,MAAM,KAAE,MAAM,EAAE,SAAS,IAAG,CAAC,EACpE,WAAW,EAAE,iBAAiB,GAC/B,CAAA"}
|
1
|
+
{"version":3,"file":"RadioGroup.stories.js","sourceRoot":"","sources":["../../src/RadioGroup/RadioGroup.stories.tsx"],"names":[],"mappings":"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"}
|
@@ -9,6 +9,8 @@ type RadioItemProps = {
|
|
9
9
|
onChange: (value: BaseValueType) => void;
|
10
10
|
displayType: DisplayType;
|
11
11
|
isError: boolean;
|
12
|
+
fallback?: boolean;
|
13
|
+
bodyCopy?: string;
|
12
14
|
};
|
13
15
|
export declare const RadioItem: React.ForwardRefExoticComponent<RadioItemProps & React.RefAttributes<HTMLInputElement>>;
|
14
16
|
export {};
|
@@ -3,16 +3,20 @@ import styled, { css } from 'styled-components';
|
|
3
3
|
import { useUniqueId } from '../utils/id';
|
4
4
|
import { theme } from '../theme';
|
5
5
|
import { RadioElement } from './RadioElement';
|
6
|
+
import { Text } from '../Text';
|
6
7
|
import { ITEM_GAP } from './constants';
|
7
8
|
import { Box } from '../Box';
|
8
|
-
export const RadioItem = forwardRef(function RadioItem({ name, visual, label, value, checked, onChange, displayType, isError }, ref) {
|
9
|
+
export const RadioItem = forwardRef(function RadioItem({ name, visual, label, value, checked, onChange, displayType, isError, fallback, bodyCopy, }, ref) {
|
9
10
|
const id = useUniqueId();
|
10
|
-
return (React.createElement(Wrapper, { htmlFor: id, checked: checked, displayType: displayType, "data-testid": value },
|
11
|
+
return (React.createElement(Wrapper, { htmlFor: id, checked: checked, displayType: displayType, "data-testid": value, isError: isError, fallback: fallback },
|
11
12
|
visual && (React.createElement(VisualWrapper, null,
|
12
13
|
React.createElement(Visual, { visualUrl: visual }))),
|
13
|
-
React.createElement(Box, { flex: true,
|
14
|
+
React.createElement(Box, { flex: true, alignItems: "center" },
|
14
15
|
React.createElement(RadioElement, { ref: ref, name: name, id: id, value: value, checked: checked, onChange: onChange, isError: isError, mr: "8px" }),
|
15
|
-
React.createElement(
|
16
|
+
React.createElement(Box, null,
|
17
|
+
React.createElement(RadioText, { isError: isError }, label),
|
18
|
+
bodyCopy && (React.createElement(Box, null,
|
19
|
+
React.createElement(Text, { typo: "caption" }, bodyCopy)))))));
|
16
20
|
});
|
17
21
|
const VisualWrapper = styled.div `
|
18
22
|
width: 100%;
|
@@ -32,18 +36,30 @@ const Wrapper = styled.label `
|
|
32
36
|
flex-direction: column;
|
33
37
|
cursor: pointer;
|
34
38
|
|
35
|
-
${({ displayType, checked }) => css `
|
39
|
+
${({ displayType, checked, isError, fallback }) => css `
|
36
40
|
${(displayType === 'horizontal-card' ||
|
37
41
|
displayType === 'vertical-card') &&
|
38
42
|
css `
|
39
|
-
border-radius:
|
40
|
-
background-color: ${
|
43
|
+
border-radius: 12px;
|
44
|
+
background-color: ${fallback
|
45
|
+
? theme.colors.cream
|
46
|
+
: theme.colors.custard};
|
41
47
|
padding: ${checked ? '10px' : '12px'};
|
42
|
-
${checked &&
|
48
|
+
border: ${checked &&
|
49
|
+
(isError
|
50
|
+
? `2px solid ${theme.colors.strawberry}`
|
51
|
+
: `2px solid ${theme.colors.liquorice}`)};
|
52
|
+
|
53
|
+
&:hover {
|
54
|
+
background-color: ${fallback
|
55
|
+
? theme.colors.coconut
|
56
|
+
: theme.colors.oatmeal};
|
57
|
+
}
|
43
58
|
`}
|
44
59
|
${displayType === 'horizontal-card' &&
|
45
60
|
css `
|
46
61
|
width: 100%;
|
62
|
+
justify-content: center;
|
47
63
|
|
48
64
|
@media (min-width: 420px) {
|
49
65
|
width: calc(50% - ${ITEM_GAP / 2}px);
|
@@ -59,7 +75,7 @@ const RadioText = styled.span `
|
|
59
75
|
line-height: 16px;
|
60
76
|
font-size: 16px;
|
61
77
|
font-weight: ${theme.font.weight.medium};
|
62
|
-
color: ${({ isError }) => isError ? theme.colors.
|
78
|
+
color: ${({ isError }) => isError ? theme.colors.strawberry : theme.colors.liquorice};
|
63
79
|
margin-top: 4px;
|
64
80
|
`;
|
65
81
|
//# sourceMappingURL=RadioItem.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"RadioItem.js","sourceRoot":"","sources":["../../src/RadioGroup/RadioItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AACzC,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAA;AAE/C,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAA;AACzC,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAEhC,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA;
|
1
|
+
{"version":3,"file":"RadioItem.js","sourceRoot":"","sources":["../../src/RadioGroup/RadioItem.tsx"],"names":[],"mappings":"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"}
|
package/dist/Row/Row.js
CHANGED
@@ -16,28 +16,34 @@ import { Icon } from '../Icon';
|
|
16
16
|
import { Box } from '../Box';
|
17
17
|
import { Text } from '../Text';
|
18
18
|
export const Row = (_a) => {
|
19
|
-
var { iconLeft, iconLeftColor, iconRight, iconRightColor, handleClick, heading, subHeading, type, borderTop = true, borderBottom = true, boldHeading } = _a, marginProps = __rest(_a, ["iconLeft", "iconLeftColor", "iconRight", "iconRightColor", "handleClick", "heading", "subHeading", "type", "borderTop", "borderBottom", "boldHeading"]);
|
19
|
+
var { iconLeft, iconLeftColor = 'liquorice', iconRight, iconRightColor = 'marzipan', handleClick, heading, subHeading, type, borderTop = true, borderBottom = true, boldHeading } = _a, marginProps = __rest(_a, ["iconLeft", "iconLeftColor", "iconRight", "iconRightColor", "handleClick", "heading", "subHeading", "type", "borderTop", "borderBottom", "boldHeading"]);
|
20
20
|
const windowWidth = screen.width;
|
21
21
|
return (React.createElement(Container, Object.assign({ type: type, iconLeft: iconLeft, borderTop: borderTop, borderBottom: borderBottom, iconRight: iconRight, onClick: handleClick, boldHeading: boldHeading }, marginProps),
|
22
22
|
iconLeft && (React.createElement(Icon, { render: iconLeft, size: windowWidth > 768 ? 24 : 18, color: iconLeftColor })),
|
23
23
|
React.createElement(Box, null,
|
24
24
|
React.createElement(Text, { tag: "h1", typo: "base" }, heading),
|
25
|
-
React.createElement(Text, { tag: "p", typo: "desc-small", color: "
|
25
|
+
React.createElement(Text, { tag: "p", typo: "desc-small", color: "sesame" }, subHeading)),
|
26
26
|
iconRight && (React.createElement(Icon, { className: "iconRight", render: iconRight, size: 24, rotate: iconRight === 'caret' ? -90 : 0, color: iconRightColor }))));
|
27
27
|
};
|
28
28
|
const Container = styled(Box)(({ type, iconLeft, borderTop, borderBottom, boldHeading }) => css `
|
29
|
-
border-radius: ${(type === 'first' && `
|
30
|
-
(type === 'curved' && `
|
31
|
-
(type === 'last' && `0 0
|
29
|
+
border-radius: ${(type === 'first' && `16px 16px 0 0`) ||
|
30
|
+
(type === 'curved' && `16px`) ||
|
31
|
+
(type === 'last' && `0 0 16px 16px`) ||
|
32
32
|
0};
|
33
|
-
|
33
|
+
|
34
|
+
border-top: ${borderTop && type !== 'curved' && type !== 'first'
|
35
|
+
? `1px solid ${theme.colors.oatmeal}`
|
36
|
+
: 'none'};
|
37
|
+
border-bottom: ${borderBottom && type !== 'curved' && type !== 'last'
|
38
|
+
? `1px solid ${theme.colors.oatmeal}`
|
39
|
+
: 'none'};
|
40
|
+
|
41
|
+
background-color: ${theme.colors.custard};
|
34
42
|
display: grid;
|
35
43
|
grid-template-columns: ${iconLeft ? `24px auto 24px` : `auto 24px`};
|
36
44
|
padding: 16px;
|
37
45
|
grid-gap: 16px;
|
38
46
|
align-items: center;
|
39
|
-
border-top: ${!borderTop && `none`};
|
40
|
-
border-bottom: ${!borderBottom && `none`};
|
41
47
|
|
42
48
|
cursor: pointer;
|
43
49
|
|
package/dist/Row/Row.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Row.js","sourceRoot":"","sources":["../../src/Row/Row.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAa,MAAM,OAAO,CAAA;AACjC,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAA;AAE/C,OAAO,EAAS,KAAK,EAAE,MAAM,UAAU,CAAA;AACvC,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAC9B,OAAO,EAAE,GAAG,EAAE,MAAM,QAAQ,CAAA;AAC5B,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAiB9B,MAAM,CAAC,MAAM,GAAG,GAAiB,CAAC,EAajC,EAAE,EAAE;QAb6B,EAChC,QAAQ,EACR,aAAa,
|
1
|
+
{"version":3,"file":"Row.js","sourceRoot":"","sources":["../../src/Row/Row.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAa,MAAM,OAAO,CAAA;AACjC,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAA;AAE/C,OAAO,EAAS,KAAK,EAAE,MAAM,UAAU,CAAA;AACvC,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAC9B,OAAO,EAAE,GAAG,EAAE,MAAM,QAAQ,CAAA;AAC5B,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAiB9B,MAAM,CAAC,MAAM,GAAG,GAAiB,CAAC,EAajC,EAAE,EAAE;QAb6B,EAChC,QAAQ,EACR,aAAa,GAAG,WAAW,EAC3B,SAAS,EACT,cAAc,GAAG,UAAU,EAC3B,WAAW,EACX,OAAO,EACP,UAAU,EACV,IAAI,EACJ,SAAS,GAAG,IAAI,EAChB,YAAY,GAAG,IAAI,EACnB,WAAW,OAEZ,EADI,WAAW,cAZkB,wJAajC,CADe;IAEd,MAAM,WAAW,GAAG,MAAM,CAAC,KAAK,CAAA;IAEhC,OAAO,CACL,oBAAC,SAAS,kBACR,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,SAAS,EACpB,YAAY,EAAE,YAAY,EAC1B,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,WAAW,EACpB,WAAW,EAAE,WAAW,IACpB,WAAW;QAEd,QAAQ,IAAI,CACX,oBAAC,IAAI,IACH,MAAM,EAAE,QAAQ,EAChB,IAAI,EAAE,WAAW,GAAG,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,EACjC,KAAK,EAAE,aAAa,GACpB,CACH;QACD,oBAAC,GAAG;YACF,oBAAC,IAAI,IAAC,GAAG,EAAC,IAAI,EAAC,IAAI,EAAC,MAAM,IACvB,OAAO,CACH;YACP,oBAAC,IAAI,IAAC,GAAG,EAAC,GAAG,EAAC,IAAI,EAAC,YAAY,EAAC,KAAK,EAAC,QAAQ,IAC3C,UAAU,CACN,CACH;QACL,SAAS,IAAI,CACZ,oBAAC,IAAI,IACH,SAAS,EAAC,WAAW,EACrB,MAAM,EAAE,SAAS,EACjB,IAAI,EAAE,EAAE,EACR,MAAM,EAAE,SAAS,KAAK,OAAO,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,EACvC,KAAK,EAAE,cAAc,GACrB,CACH,CACS,CACb,CAAA;AACH,CAAC,CAAA;AAWD,MAAM,SAAS,GAAG,MAAM,CAAC,GAAG,CAAC,CAC3B,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,SAAS,EAAE,YAAY,EAAE,WAAW,EAAE,EAAE,EAAE,CAAC,GAAG,CAAA;qBAC9C,CAAC,IAAI,KAAK,OAAO,IAAI,eAAe,CAAC;IACtD,CAAC,IAAI,KAAK,QAAQ,IAAI,MAAM,CAAC;IAC7B,CAAC,IAAI,KAAK,MAAM,IAAI,eAAe,CAAC;IACpC,CAAC;;kBAEa,SAAS,IAAI,IAAI,KAAK,QAAQ,IAAI,IAAI,KAAK,OAAO;IAC9D,CAAC,CAAC,aAAa,KAAK,CAAC,MAAM,CAAC,OAAO,EAAE;IACrC,CAAC,CAAC,MAAM;qBACO,YAAY,IAAI,IAAI,KAAK,QAAQ,IAAI,IAAI,KAAK,MAAM;IACnE,CAAC,CAAC,aAAa,KAAK,CAAC,MAAM,CAAC,OAAO,EAAE;IACrC,CAAC,CAAC,MAAM;;wBAEU,KAAK,CAAC,MAAM,CAAC,OAAO;;6BAEf,QAAQ,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,WAAW;;;;;;;;qBAQjD,WAAW,IAAI,GAAG;;;;;;;;;;GAUpC,CACF,CAAA"}
|
package/dist/Row/Row.stories.js
CHANGED
@@ -9,7 +9,7 @@ const Template = (props) => React.createElement(Row, Object.assign({}, props));
|
|
9
9
|
export const Default = Template.bind({});
|
10
10
|
Default.args = {
|
11
11
|
iconLeft: 'info',
|
12
|
-
iconLeftColor: '
|
12
|
+
iconLeftColor: 'liquorice',
|
13
13
|
iconRight: 'caret',
|
14
14
|
iconRightColor: 'subtext',
|
15
15
|
heading: 'A lovely heading',
|
@@ -30,7 +30,7 @@ const list = [
|
|
30
30
|
value: 'Sunday',
|
31
31
|
},
|
32
32
|
];
|
33
|
-
export const Container = ({
|
34
|
-
return (React.createElement(SearchInput, { id: "days", label: "Days", placeholder: "Search days", searchList: list, onFound: (val) => console.log('found', val),
|
33
|
+
export const Container = ({ showIcon }) => {
|
34
|
+
return (React.createElement(SearchInput, { id: "days", label: "Days", placeholder: "Search days", searchList: list, onFound: (val) => console.log('found', val), showIcon: showIcon }));
|
35
35
|
};
|
36
36
|
//# sourceMappingURL=Container.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Container.js","sourceRoot":"","sources":["../../src/SearchInput/Container.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAa,MAAM,OAAO,CAAA;AACjC,OAAO,EAAE,WAAW,EAAoB,MAAM,eAAe,CAAA;AAE7D,MAAM,IAAI,GAAG;IACX;QACE,KAAK,EAAE,QAAQ;QACf,KAAK,EAAE,QAAQ;KAChB;IACD;QACE,KAAK,EAAE,SAAS;QAChB,KAAK,EAAE,SAAS;KACjB;IACD;QACE,KAAK,EAAE,WAAW;QAClB,KAAK,EAAE,WAAW;KACnB;IACD;QACE,KAAK,EAAE,UAAU;QACjB,KAAK,EAAE,UAAU;KAClB;IACD;QACE,KAAK,EAAE,QAAQ;QACf,KAAK,EAAE,QAAQ;KAChB;IACD;QACE,KAAK,EAAE,UAAU;QACjB,KAAK,EAAE,UAAU;KAClB;IACD;QACE,KAAK,EAAE,QAAQ;QACf,KAAK,EAAE,QAAQ;KAChB;CACF,CAAA;AAED,MAAM,CAAC,MAAM,SAAS,GAAyB,CAAC,EAAE,QAAQ,EAAE,
|
1
|
+
{"version":3,"file":"Container.js","sourceRoot":"","sources":["../../src/SearchInput/Container.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAa,MAAM,OAAO,CAAA;AACjC,OAAO,EAAE,WAAW,EAAoB,MAAM,eAAe,CAAA;AAE7D,MAAM,IAAI,GAAG;IACX;QACE,KAAK,EAAE,QAAQ;QACf,KAAK,EAAE,QAAQ;KAChB;IACD;QACE,KAAK,EAAE,SAAS;QAChB,KAAK,EAAE,SAAS;KACjB;IACD;QACE,KAAK,EAAE,WAAW;QAClB,KAAK,EAAE,WAAW;KACnB;IACD;QACE,KAAK,EAAE,UAAU;QACjB,KAAK,EAAE,UAAU;KAClB;IACD;QACE,KAAK,EAAE,QAAQ;QACf,KAAK,EAAE,QAAQ;KAChB;IACD;QACE,KAAK,EAAE,UAAU;QACjB,KAAK,EAAE,UAAU;KAClB;IACD;QACE,KAAK,EAAE,QAAQ;QACf,KAAK,EAAE,QAAQ;KAChB;CACF,CAAA;AAED,MAAM,CAAC,MAAM,SAAS,GAAyB,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE;IAC9D,OAAO,CACL,oBAAC,WAAW,IACV,EAAE,EAAC,MAAM,EACT,KAAK,EAAC,MAAM,EACZ,WAAW,EAAC,aAAa,EACzB,UAAU,EAAE,IAAI,EAChB,OAAO,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,OAAO,CAAC,GAAG,CAAC,OAAO,EAAE,GAAG,CAAC,EAC3C,QAAQ,EAAE,QAAQ,GAClB,CACH,CAAA;AACH,CAAC,CAAA"}
|