@mrshmllw/smores-react 1.8.0 → 2.0.2
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.js +6 -6
- package/dist/Accordion/Accordion.js.map +1 -1
- package/dist/ActionDropdown/ActionDropdown.js +4 -4
- package/dist/ActionDropdown/ActionDropdown.js.map +1 -1
- package/dist/ActionDropdown/ActionDropdown.stories.js +1 -1
- package/dist/ActionDropdown/ActionDropdown.stories.js.map +1 -1
- package/dist/ActionDropdown/Container.js +6 -6
- 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 +2 -2
- package/dist/ActionDropdown/__tests__/ActionDropdown.js.map +1 -1
- package/dist/ActionDropdown/__tests__/__snapshots__/ActionDropdown.js.snap +167 -0
- package/dist/Box/__tests__/__snapshots__/Box.js.snap +20 -0
- package/dist/Button/Button.js +23 -17
- package/dist/Button/Button.js.map +1 -1
- package/dist/Button/Button.stories.js +2 -2
- package/dist/Button/Button.stories.js.map +1 -1
- package/dist/Button/LegacyButton.js +8 -8
- package/dist/Button/LegacyButton.js.map +1 -1
- package/dist/Button/__tests__/__snapshots__/Button.js.snap +46 -0
- package/dist/Card/Card.js +8 -8
- package/dist/Card/Card.js.map +1 -1
- package/dist/Card/__tests__/__snapshots__/Card.js.snap +24 -0
- package/dist/CheckBox/CheckBox.js +10 -8
- package/dist/CheckBox/CheckBox.js.map +1 -1
- package/dist/CheckBox/__tests__/__snapshots__/CheckBox.js.snap +20 -0
- package/dist/CheckBoxGroup/CheckBox.js +5 -5
- package/dist/CheckBoxGroup/CheckBox.js.map +1 -1
- package/dist/Chip/Chip.js +7 -7
- package/dist/Chip/Chip.js.map +1 -1
- package/dist/Chip/Chip.stories.js +1 -0
- package/dist/Chip/Chip.stories.js.map +1 -1
- package/dist/ConfirmationRadioButtons/Confirmation.js +5 -5
- package/dist/ConfirmationRadioButtons/Confirmation.js.map +1 -1
- package/dist/ConfirmationRadioButtons/RadioButtonStyled.js +3 -3
- package/dist/ConfirmationRadioButtons/RadioButtonStyled.js.map +1 -1
- package/dist/Datepicker/Datepicker.js +4 -4
- package/dist/Datepicker/Datepicker.js.map +1 -1
- package/dist/Datepicker/DatesList.js +3 -3
- 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/Dropdown.js +11 -11
- package/dist/Dropdown/Dropdown.js.map +1 -1
- package/dist/Dropdown/__tests__/__snapshots__/Dropdown.js.snap +167 -0
- package/dist/Emoji/__tests__/__snapshots__/Emoji.js.snap +20 -0
- package/dist/Icon/Icon.js +4 -4
- package/dist/Icon/Icon.js.map +1 -1
- package/dist/Icon/Icon.stories.js +2 -2
- package/dist/Icon/Icon.stories.js.map +1 -1
- package/dist/Icon/__tests__/__snapshots__/Icon.js.snap +47 -0
- package/dist/IconWrapper/IconWrapper.js +2 -2
- package/dist/IconWrapper/IconWrapper.js.map +1 -1
- package/dist/IconWrapper/__tests__/__snapshots__/IconWrapper.js.snap +121 -0
- package/dist/LabelledText/LabelledText.js +1 -1
- package/dist/LabelledText/LabelledText.js.map +1 -1
- package/dist/LabelledText/__tests__/__snapshots__/LabelledText.js.snap +57 -0
- package/dist/Loader/Loader.js +3 -3
- package/dist/Loader/Loader.js.map +1 -1
- package/dist/Loader/Loader.stories.js +1 -1
- 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/Loader/__tests__/__snapshots__/Loader.js.snap +53 -0
- package/dist/Message/Message.js +4 -4
- package/dist/Message/Message.js.map +1 -1
- package/dist/Message/Message.stories.js +3 -3
- package/dist/Message/Message.stories.js.map +1 -1
- package/dist/Message/__tests__/__snapshots__/Message.js.snap +279 -0
- package/dist/Modal/Modal.js +6 -6
- package/dist/Modal/Modal.js.map +1 -1
- package/dist/Modal/__tests__/__snapshots__/Modal.js.snap +208 -0
- package/dist/NumberInput/NumberInput.js +14 -14
- package/dist/NumberInput/NumberInput.js.map +1 -1
- package/dist/NumberInput/__tests__/__snapshots__/NumberInput.js.snap +1398 -0
- package/dist/Pagination/Pagination.js +1 -1
- package/dist/Pagination/Pagination.js.map +1 -1
- package/dist/Pagination/__tests__/__snapshots__/Pagination.js.snap +273 -0
- package/dist/RadioButton/RadioButton.js +3 -3
- package/dist/RadioButton/RadioButton.js.map +1 -1
- package/dist/RadioButton/__tests__/__snapshots__/RadioButton.js.snap +146 -0
- package/dist/Row/Row.js +2 -2
- package/dist/Row/Row.js.map +1 -1
- package/dist/Row/Row.stories.js +2 -2
- package/dist/Row/Row.stories.js.map +1 -1
- package/dist/Row/__tests__/__snapshots__/Row.js.snap +96 -0
- package/dist/SearchInput/SearchInput.js +12 -13
- package/dist/SearchInput/SearchInput.js.map +1 -1
- package/dist/SearchInput/__tests__/__snapshots__/SearchInput.js.snap +146 -0
- package/dist/Tag/Tag.stories.js +2 -2
- package/dist/Tag/Tag.stories.js.map +1 -1
- package/dist/Tag/__tests__/__snapshots__/Tag.js.snap +54 -0
- package/dist/Text/Text.js +1 -1
- package/dist/Text/Text.js.map +1 -1
- package/dist/Text/Text.stories.js +1 -1
- package/dist/Text/Text.stories.js.map +1 -1
- package/dist/Text/__tests__/__snapshots__/Text.js.snap +34 -0
- package/dist/TextInput/TextInput.js +9 -9
- package/dist/TextInput/TextInput.js.map +1 -1
- package/dist/TextInput/__tests__/__snapshots__/TextInput.js.snap +74 -0
- package/dist/Textarea/Textarea.js +7 -7
- package/dist/Textarea/Textarea.js.map +1 -1
- package/dist/Textarea/__tests__/__snapshots__/Textarea.js.snap +271 -0
- package/dist/Toggle/Toggle.js +4 -4
- package/dist/Toggle/Toggle.js.map +1 -1
- package/dist/Toggle/__tests__/__snapshots__/Toggle.js.snap +70 -0
- package/dist/theme.d.ts +21 -51
- package/dist/theme.js +25 -61
- package/dist/theme.js.map +1 -1
- package/package.json +2 -1
@@ -10,18 +10,18 @@ export const Accordion = ({ title, children, borderTop = false, subTitle, fullBo
|
|
10
10
|
React.createElement(TopContainer, { flex: true, alignItems: "center", justifyContent: "space-between", onClick: () => setIsOpen(!isOpen), fullBorder: fullBorder, isOpen: isOpen },
|
11
11
|
React.createElement(TitleContainer, null,
|
12
12
|
React.createElement(Title, null, title),
|
13
|
-
subTitle && (React.createElement(Text, { tag: "label", color: "
|
14
|
-
React.createElement(CaretIcon, { render: "caret", size: 24, color: "
|
13
|
+
subTitle && (React.createElement(Text, { tag: "label", color: "subtext", typo: "label" }, subTitle))),
|
14
|
+
React.createElement(CaretIcon, { render: "caret", size: 24, color: "secondary", isOpen: isOpen, borderTop: borderTop })),
|
15
15
|
isOpen && React.createElement(React.Fragment, null, children)));
|
16
16
|
};
|
17
17
|
const Wrapper = styled(Box)(({ isOpen, borderTop, fullBorder }) => css `
|
18
|
-
border-bottom: 1px solid ${theme.colors.
|
18
|
+
border-bottom: 1px solid ${theme.colors.outline};
|
19
19
|
padding-bottom: ${isOpen && '16px'};
|
20
|
-
border-top: ${borderTop && `1px solid ${theme.colors.
|
20
|
+
border-top: ${borderTop && `1px solid ${theme.colors.subtext}`};
|
21
21
|
|
22
22
|
${fullBorder &&
|
23
23
|
css `
|
24
|
-
border: 1px solid ${theme.colors.
|
24
|
+
border: 1px solid ${theme.colors.subtext};
|
25
25
|
border-radius: 8px;
|
26
26
|
margin-bottom: 14px;
|
27
27
|
padding: 20px 15px;
|
@@ -46,7 +46,7 @@ const TopContainer = styled(Box)(({ isOpen, fullBorder }) => css `
|
|
46
46
|
`}
|
47
47
|
`);
|
48
48
|
const Title = styled.h2 `
|
49
|
-
color: ${theme.colors.
|
49
|
+
color: ${theme.colors.secondary};
|
50
50
|
font-size: 16px;
|
51
51
|
line-height: 21px;
|
52
52
|
font-weight: ${theme.font.weight.medium};
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Accordion.js","sourceRoot":"","sources":["../../src/Accordion/Accordion.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAM,QAAQ,EAAE,MAAM,OAAO,CAAA;AAC3C,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAA;AAE/C,OAAO,EAAE,GAAG,EAAE,MAAM,QAAQ,CAAA;AAC5B,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAC9B,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAChC,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAS9B,MAAM,CAAC,MAAM,SAAS,GAAuB,CAAC,EAC5C,KAAK,EACL,QAAQ,EACR,SAAS,GAAG,KAAK,EACjB,QAAQ,EACR,UAAU,GAAG,KAAK,GACnB,EAAE,EAAE;IACH,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IAE3C,OAAO,CACL,oBAAC,OAAO,IAAC,MAAM,EAAE,MAAM,EAAE,SAAS,EAAE,SAAS,EAAE,UAAU,EAAE,UAAU;QACnE,oBAAC,YAAY,IACX,IAAI,QACJ,UAAU,EAAC,QAAQ,EACnB,cAAc,EAAC,eAAe,EAC9B,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,CAAC,MAAM,CAAC,EACjC,UAAU,EAAE,UAAU,EACtB,MAAM,EAAE,MAAM;YAEd,oBAAC,cAAc;gBACb,oBAAC,KAAK,QAAE,KAAK,CAAS;gBACrB,QAAQ,IAAI,CACX,oBAAC,IAAI,IAAC,GAAG,EAAC,OAAO,EAAC,KAAK,EAAC,
|
1
|
+
{"version":3,"file":"Accordion.js","sourceRoot":"","sources":["../../src/Accordion/Accordion.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAM,QAAQ,EAAE,MAAM,OAAO,CAAA;AAC3C,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAA;AAE/C,OAAO,EAAE,GAAG,EAAE,MAAM,QAAQ,CAAA;AAC5B,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAC9B,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAChC,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAS9B,MAAM,CAAC,MAAM,SAAS,GAAuB,CAAC,EAC5C,KAAK,EACL,QAAQ,EACR,SAAS,GAAG,KAAK,EACjB,QAAQ,EACR,UAAU,GAAG,KAAK,GACnB,EAAE,EAAE;IACH,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IAE3C,OAAO,CACL,oBAAC,OAAO,IAAC,MAAM,EAAE,MAAM,EAAE,SAAS,EAAE,SAAS,EAAE,UAAU,EAAE,UAAU;QACnE,oBAAC,YAAY,IACX,IAAI,QACJ,UAAU,EAAC,QAAQ,EACnB,cAAc,EAAC,eAAe,EAC9B,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,CAAC,MAAM,CAAC,EACjC,UAAU,EAAE,UAAU,EACtB,MAAM,EAAE,MAAM;YAEd,oBAAC,cAAc;gBACb,oBAAC,KAAK,QAAE,KAAK,CAAS;gBACrB,QAAQ,IAAI,CACX,oBAAC,IAAI,IAAC,GAAG,EAAC,OAAO,EAAC,KAAK,EAAC,SAAS,EAAC,IAAI,EAAC,OAAO,IAC3C,QAAQ,CACJ,CACR,CACc;YAEjB,oBAAC,SAAS,IACR,MAAM,EAAC,OAAO,EACd,IAAI,EAAE,EAAE,EACR,KAAK,EAAC,WAAW,EACjB,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,SAAS,GACpB,CACW;QACd,MAAM,IAAI,0CAAG,QAAQ,CAAI,CAClB,CACX,CAAA;AACH,CAAC,CAAA;AAQD,MAAM,OAAO,GAAG,MAAM,CAAC,GAAG,CAAC,CACzB,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,UAAU,EAAE,EAAE,EAAE,CAAC,GAAG,CAAA;+BACb,KAAK,CAAC,MAAM,CAAC,OAAO;sBAC7B,MAAM,IAAI,MAAM;kBACpB,SAAS,IAAI,aAAa,KAAK,CAAC,MAAM,CAAC,OAAO,EAAE;;MAE5D,UAAU;IACZ,GAAG,CAAA;0BACmB,KAAK,CAAC,MAAM,CAAC,OAAO;;;;KAIzC;GACF,CACF,CAAA;AAED,MAAM,cAAc,GAAG,MAAM,CAAC,GAAG,CAAA;;;CAGhC,CAAA;AACD,MAAM,YAAY,GAAG,MAAM,CAAC,GAAG,CAAC,CAC9B,CAAC,EAAE,MAAM,EAAE,UAAU,EAAE,EAAE,EAAE,CAAC,GAAG,CAAA;;;;MAI3B,UAAU;IACZ,GAAG,CAAA;;KAEF;;MAEC,MAAM;IACR,GAAG,CAAA;;KAEF;GACF,CACF,CAAA;AAED,MAAM,KAAK,GAAG,MAAM,CAAC,EAAE,CAAA;WACZ,KAAK,CAAC,MAAM,CAAC,SAAS;;;iBAGhB,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,MAAM;CACxC,CAAA;AAED,MAAM,SAAS,GAAG,MAAM,CAAC,IAAI,CAAC,CAC5B,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,GAAG,CAAA;iBACJ,MAAM,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,cAAc;;GAExD,CACF,CAAA"}
|
@@ -8,10 +8,10 @@ export const ActionDropdown = ({ id, className = '', label, value, list, onSelec
|
|
8
8
|
var _a, _b, _c;
|
9
9
|
const [open, setOpen] = useState(false);
|
10
10
|
return (React.createElement(Container, { id: id, className: className, onClick: () => setOpen((currentOpen) => !currentOpen) },
|
11
|
-
label && (React.createElement(Text, { tag: "label", color: "
|
12
|
-
React.createElement(Label, { text: (_a = value.textColor) !== null && _a !== void 0 ? _a : '
|
11
|
+
label && (React.createElement(Text, { tag: "label", color: "subtext", typo: "label" }, label)),
|
12
|
+
React.createElement(Label, { text: (_a = value.textColor) !== null && _a !== void 0 ? _a : 'secondary', bg: (_b = value.bgColor) !== null && _b !== void 0 ? _b : 'subtext' },
|
13
13
|
React.createElement(SelectedOption, null, value.label),
|
14
|
-
React.createElement(Icon, { render: "caret", color: (_c = value.textColor) !== null && _c !== void 0 ? _c : '
|
14
|
+
React.createElement(Icon, { render: "caret", color: (_c = value.textColor) !== null && _c !== void 0 ? _c : 'subtext', size: 24, rotate: open ? 180 : 0 })),
|
15
15
|
React.createElement(OuterContainer, { open: open },
|
16
16
|
React.createElement(List, { options: list, selectOption: onSelect }))));
|
17
17
|
};
|
@@ -54,7 +54,7 @@ const OuterContainer = styled.div(({ open }) => css `
|
|
54
54
|
display: ${open ? 'block' : 'none'};
|
55
55
|
max-height: ${open ? '235px' : '48px'};
|
56
56
|
background-color: ${theme.colors.white};
|
57
|
-
border: 1px solid ${theme.colors.
|
57
|
+
border: 1px solid ${theme.colors.outline};
|
58
58
|
overflow-y: ${open ? 'auto' : 'hidden'};
|
59
59
|
z-index: 2;
|
60
60
|
transition: all 0.2s ease-in-out;
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"ActionDropdown.js","sourceRoot":"","sources":["../../src/ActionDropdown/ActionDropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAM,QAAQ,EAAE,MAAM,OAAO,CAAA;AAC3C,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAA;AAE/C,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAC9B,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAC9B,OAAO,EAAE,IAAI,EAAkB,MAAM,QAAQ,CAAA;AAE7C,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAiBhC,MAAM,CAAC,MAAM,cAAc,GAAc,CAAC,EACxC,EAAE,EACF,SAAS,GAAG,EAAE,EACd,KAAK,EACL,KAAK,EACL,IAAI,EACJ,QAAQ,GACT,EAAE,EAAE;;IACH,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IAEvC,OAAO,CACL,oBAAC,SAAS,IACR,EAAE,EAAE,EAAE,EACN,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,CAAC,WAAW,EAAE,EAAE,CAAC,CAAC,WAAW,CAAC;QAEpD,KAAK,IAAI,CACR,oBAAC,IAAI,IAAC,GAAG,EAAC,OAAO,EAAC,KAAK,EAAC,
|
1
|
+
{"version":3,"file":"ActionDropdown.js","sourceRoot":"","sources":["../../src/ActionDropdown/ActionDropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAM,QAAQ,EAAE,MAAM,OAAO,CAAA;AAC3C,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAA;AAE/C,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAC9B,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAC9B,OAAO,EAAE,IAAI,EAAkB,MAAM,QAAQ,CAAA;AAE7C,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAiBhC,MAAM,CAAC,MAAM,cAAc,GAAc,CAAC,EACxC,EAAE,EACF,SAAS,GAAG,EAAE,EACd,KAAK,EACL,KAAK,EACL,IAAI,EACJ,QAAQ,GACT,EAAE,EAAE;;IACH,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IAEvC,OAAO,CACL,oBAAC,SAAS,IACR,EAAE,EAAE,EAAE,EACN,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,CAAC,WAAW,EAAE,EAAE,CAAC,CAAC,WAAW,CAAC;QAEpD,KAAK,IAAI,CACR,oBAAC,IAAI,IAAC,GAAG,EAAC,OAAO,EAAC,KAAK,EAAC,SAAS,EAAC,IAAI,EAAC,OAAO,IAC3C,KAAK,CACD,CACR;QAED,oBAAC,KAAK,IACJ,IAAI,EAAE,MAAA,KAAK,CAAC,SAAS,mCAAI,WAAW,EACpC,EAAE,EAAE,MAAA,KAAK,CAAC,OAAO,mCAAI,SAAS;YAE9B,oBAAC,cAAc,QAAE,KAAK,CAAC,KAAK,CAAkB;YAC9C,oBAAC,IAAI,IACH,MAAM,EAAC,OAAO,EACd,KAAK,EAAE,MAAA,KAAK,CAAC,SAAS,mCAAI,SAAS,EACnC,IAAI,EAAE,EAAE,EACR,MAAM,EAAE,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,GACtB,CACI;QACR,oBAAC,cAAc,IAAC,IAAI,EAAE,IAAI;YACxB,oBAAC,IAAI,IAAC,OAAO,EAAE,IAAI,EAAE,YAAY,EAAE,QAAQ,GAAI,CAChC,CACP,CACb,CAAA;AACH,CAAC,CAAA;AAOD,MAAM,KAAK,GAAG,MAAM,CAAC,GAAG,CACtB,CAAC,EAAE,IAAI,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,GAAG,CAAA;aACV,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC;wBACP,KAAK,CAAC,MAAM,CAAC,EAAE,CAAC;;;;;;;;;;;;GAYrC,CACF,CAAA;AAED,MAAM,cAAc,GAAG,MAAM,CAAC,IAAI,CAAA;;;;;CAKjC,CAAA;AAED,MAAM,SAAS,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;;CAS3B,CAAA;AAMD,MAAM,cAAc,GAAG,MAAM,CAAC,GAAG,CAC/B,CAAC,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,GAAG,CAAA;;;;;eAKJ,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM;kBACpB,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM;wBACjB,KAAK,CAAC,MAAM,CAAC,KAAK;wBAClB,KAAK,CAAC,MAAM,CAAC,OAAO;kBAC1B,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,QAAQ;;;GAGvC,CACF,CAAA"}
|
@@ -8,6 +8,6 @@ export default {
|
|
8
8
|
const Template = (args) => React.createElement(ActionDropdownContainer, Object.assign({}, args));
|
9
9
|
export const Default = Template.bind({});
|
10
10
|
Default.args = {
|
11
|
-
textColor: '
|
11
|
+
textColor: 'secondary',
|
12
12
|
};
|
13
13
|
//# sourceMappingURL=ActionDropdown.stories.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"ActionDropdown.stories.js","sourceRoot":"","sources":["../../src/ActionDropdown/ActionDropdown.stories.js"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAA;AACjD,OAAO,EAAE,SAAS,IAAI,uBAAuB,EAAE,MAAM,aAAa,CAAA;AAElE,eAAe;IACb,KAAK,EAAE,iBAAiB;IACxB,SAAS,EAAE,cAAc;CAC1B,CAAA;AAED,MAAM,QAAQ,GAAG,CAAC,IAAI,EAAE,EAAE,CAAC,oBAAC,uBAAuB,oBAAK,IAAI,EAAI,CAAA;AAEhE,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAExC,OAAO,CAAC,IAAI,GAAG;IACb,SAAS,EAAE,
|
1
|
+
{"version":3,"file":"ActionDropdown.stories.js","sourceRoot":"","sources":["../../src/ActionDropdown/ActionDropdown.stories.js"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAA;AACjD,OAAO,EAAE,SAAS,IAAI,uBAAuB,EAAE,MAAM,aAAa,CAAA;AAElE,eAAe;IACb,KAAK,EAAE,iBAAiB;IACxB,SAAS,EAAE,cAAc;CAC1B,CAAA;AAED,MAAM,QAAQ,GAAG,CAAC,IAAI,EAAE,EAAE,CAAC,oBAAC,uBAAuB,oBAAK,IAAI,EAAI,CAAA;AAEhE,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAExC,OAAO,CAAC,IAAI,GAAG;IACb,SAAS,EAAE,WAAW;CACvB,CAAA"}
|
@@ -6,25 +6,25 @@ const actions = [
|
|
6
6
|
{
|
7
7
|
label: 'Default grey',
|
8
8
|
value: 'DEFAULT',
|
9
|
-
bgColor: '
|
10
|
-
textColor: '
|
9
|
+
bgColor: 'background',
|
10
|
+
textColor: 'secondary',
|
11
11
|
},
|
12
12
|
{
|
13
13
|
label: 'Medium',
|
14
14
|
value: 'MEDIUM',
|
15
|
-
bgColor: '
|
16
|
-
textColor: '
|
15
|
+
bgColor: 'warning',
|
16
|
+
textColor: 'secondary',
|
17
17
|
},
|
18
18
|
{
|
19
19
|
label: 'High alert',
|
20
20
|
value: 'HIGH_ALERT',
|
21
|
-
bgColor: '
|
21
|
+
bgColor: 'agentWarning',
|
22
22
|
textColor: 'white',
|
23
23
|
},
|
24
24
|
{
|
25
25
|
label: 'Good zone',
|
26
26
|
value: 'GOOD_ZONE',
|
27
|
-
bgColor: '
|
27
|
+
bgColor: 'success',
|
28
28
|
textColor: 'white',
|
29
29
|
},
|
30
30
|
{
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Container.js","sourceRoot":"","sources":["../../src/ActionDropdown/Container.jsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACvC,OAAO,EAAE,GAAG,EAAE,MAAM,QAAQ,CAAA;AAC5B,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAA;AACjD,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAE9B,MAAM,OAAO,GAAG;IACd;QACE,KAAK,EAAE,cAAc;QACrB,KAAK,EAAE,SAAS;QAChB,OAAO,EAAE,
|
1
|
+
{"version":3,"file":"Container.js","sourceRoot":"","sources":["../../src/ActionDropdown/Container.jsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACvC,OAAO,EAAE,GAAG,EAAE,MAAM,QAAQ,CAAA;AAC5B,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAA;AACjD,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAE9B,MAAM,OAAO,GAAG;IACd;QACE,KAAK,EAAE,cAAc;QACrB,KAAK,EAAE,SAAS;QAChB,OAAO,EAAE,YAAY;QACrB,SAAS,EAAE,WAAW;KACvB;IACD;QACE,KAAK,EAAE,QAAQ;QACf,KAAK,EAAE,QAAQ;QACf,OAAO,EAAE,SAAS;QAClB,SAAS,EAAE,WAAW;KACvB;IACD;QACE,KAAK,EAAE,YAAY;QACnB,KAAK,EAAE,YAAY;QACnB,OAAO,EAAE,cAAc;QACvB,SAAS,EAAE,OAAO;KACnB;IACD;QACE,KAAK,EAAE,WAAW;QAClB,KAAK,EAAE,WAAW;QAClB,OAAO,EAAE,SAAS;QAClB,SAAS,EAAE,OAAO;KACnB;IACD;QACE,KAAK,EAAE,aAAa;QACpB,KAAK,EAAE,aAAa;QACpB,OAAO,EAAE,MAAM;QACf,SAAS,EAAE,OAAO;KACnB;CACF,CAAA;AAED,MAAM,CAAC,MAAM,SAAS,GAAG,GAAG,EAAE;IAC5B,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAA;IAEhE,OAAO,CACL,oBAAC,GAAG,IAAC,IAAI,QAAC,UAAU,EAAC,QAAQ;QAC3B,oBAAC,cAAc,IACb,EAAE,EAAC,eAAe,EAClB,IAAI,EAAE,OAAO,EACb,KAAK,EAAE,cAAc,EACrB,QAAQ,EAAE,iBAAiB,GAC3B;QAEF,oBAAC,GAAG,IAAC,EAAE,EAAC,MAAM,GAAG;QAEjB,oBAAC,GAAG;YACF,oBAAC,IAAI,IAAC,GAAG,EAAC,GAAG,EAAC,IAAI,EAAC,YAAY,IAC5B,cAAc,CAAC,KAAK,CAChB,CACH,CACF,CACP,CAAA;AACH,CAAC,CAAA"}
|
@@ -16,11 +16,11 @@ const ListItem = styled.li `
|
|
16
16
|
box-sizing: border-box;
|
17
17
|
font-size: 14px;
|
18
18
|
cursor: pointer;
|
19
|
-
color: ${theme.colors.
|
20
|
-
border-bottom: 1px solid ${theme.colors.
|
19
|
+
color: ${theme.colors.secondary};
|
20
|
+
border-bottom: 1px solid ${theme.colors.outline};
|
21
21
|
|
22
22
|
&:hover {
|
23
|
-
background-color: ${theme.colors.
|
23
|
+
background-color: ${theme.colors.background};
|
24
24
|
}
|
25
25
|
|
26
26
|
&:last-child {
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"List.js","sourceRoot":"","sources":["../../src/ActionDropdown/List.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAa,MAAM,OAAO,CAAA;AACjC,OAAO,MAAM,MAAM,mBAAmB,CAAA;AAEtC,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAchC,MAAM,CAAC,MAAM,IAAI,GAAc,CAAC,EAAE,OAAO,EAAE,YAAY,EAAE,EAAE,EAAE,CAAC,CAC5D,oBAAC,SAAS,QACP,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,CACvB,oBAAC,QAAQ,IAAC,GAAG,EAAE,MAAM,CAAC,KAAK,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,YAAY,CAAC,MAAM,CAAC,IAC7D,MAAM,CAAC,KAAK,CACJ,CACZ,CAAC,CACQ,CACb,CAAA;AAED,MAAM,SAAS,GAAG,MAAM,CAAC,EAAE,CAAA;;;;CAI1B,CAAA;AAED,MAAM,QAAQ,GAAG,MAAM,CAAC,EAAE,CAAA;;;;;;;;;WASf,KAAK,CAAC,MAAM,CAAC,
|
1
|
+
{"version":3,"file":"List.js","sourceRoot":"","sources":["../../src/ActionDropdown/List.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAa,MAAM,OAAO,CAAA;AACjC,OAAO,MAAM,MAAM,mBAAmB,CAAA;AAEtC,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAchC,MAAM,CAAC,MAAM,IAAI,GAAc,CAAC,EAAE,OAAO,EAAE,YAAY,EAAE,EAAE,EAAE,CAAC,CAC5D,oBAAC,SAAS,QACP,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,CACvB,oBAAC,QAAQ,IAAC,GAAG,EAAE,MAAM,CAAC,KAAK,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,YAAY,CAAC,MAAM,CAAC,IAC7D,MAAM,CAAC,KAAK,CACJ,CACZ,CAAC,CACQ,CACb,CAAA;AAED,MAAM,SAAS,GAAG,MAAM,CAAC,EAAE,CAAA;;;;CAI1B,CAAA;AAED,MAAM,QAAQ,GAAG,MAAM,CAAC,EAAE,CAAA;;;;;;;;;WASf,KAAK,CAAC,MAAM,CAAC,SAAS;6BACJ,KAAK,CAAC,MAAM,CAAC,OAAO;;;wBAGzB,KAAK,CAAC,MAAM,CAAC,UAAU;;;;;;CAM9C,CAAA"}
|
@@ -6,13 +6,13 @@ const actions = [
|
|
6
6
|
{
|
7
7
|
label: 'High alert',
|
8
8
|
value: 'HIGH_ALERT',
|
9
|
-
bgColor: '
|
9
|
+
bgColor: 'agentWarning',
|
10
10
|
textColor: 'white',
|
11
11
|
},
|
12
12
|
{
|
13
13
|
label: 'Good zone',
|
14
14
|
value: 'GOOD_ZONE',
|
15
|
-
bgColor: '
|
15
|
+
bgColor: 'success',
|
16
16
|
textColor: 'white',
|
17
17
|
},
|
18
18
|
];
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"ActionDropdown.js","sourceRoot":"","sources":["../../../src/ActionDropdown/__tests__/ActionDropdown.js"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAA;AAC/C,OAAO,wBAAwB,CAAA;AAE/B,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAA;AAElD,MAAM,OAAO,GAAG;IACd;QACE,KAAK,EAAE,YAAY;QACnB,KAAK,EAAE,YAAY;QACnB,OAAO,EAAE,
|
1
|
+
{"version":3,"file":"ActionDropdown.js","sourceRoot":"","sources":["../../../src/ActionDropdown/__tests__/ActionDropdown.js"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAA;AAC/C,OAAO,wBAAwB,CAAA;AAE/B,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAA;AAElD,MAAM,OAAO,GAAG;IACd;QACE,KAAK,EAAE,YAAY;QACnB,KAAK,EAAE,YAAY;QACnB,OAAO,EAAE,cAAc;QACvB,SAAS,EAAE,OAAO;KACnB;IACD;QACE,KAAK,EAAE,WAAW;QAClB,KAAK,EAAE,WAAW;QAClB,OAAO,EAAE,SAAS;QAClB,SAAS,EAAE,OAAO;KACnB;CACF,CAAA;AAED,IAAI,CAAC,SAAS,EAAE,GAAG,EAAE;IACnB,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,CAC1B,oBAAC,cAAc,IACb,KAAK,EAAE,OAAO,CAAC,CAAC,CAAC,EACjB,IAAI,EAAE,OAAO,EACb,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,CAAC,GAC/B,CACH,CAAA;IACD,MAAM,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,eAAe,EAAE,CAAA;AAChD,CAAC,CAAC,CAAA"}
|
@@ -0,0 +1,167 @@
|
|
1
|
+
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
2
|
+
|
3
|
+
exports[`renders 1`] = `
|
4
|
+
.c3 {
|
5
|
+
display: -webkit-box;
|
6
|
+
display: -webkit-flex;
|
7
|
+
display: -ms-flexbox;
|
8
|
+
display: flex;
|
9
|
+
-webkit-align-items: center;
|
10
|
+
-webkit-box-align: center;
|
11
|
+
-ms-flex-align: center;
|
12
|
+
align-items: center;
|
13
|
+
-webkit-box-pack: center;
|
14
|
+
-webkit-justify-content: center;
|
15
|
+
-ms-flex-pack: center;
|
16
|
+
justify-content: center;
|
17
|
+
width: 100%;
|
18
|
+
max-width: 24px;
|
19
|
+
height: 24px;
|
20
|
+
-webkit-transform: rotate(0deg);
|
21
|
+
-ms-transform: rotate(0deg);
|
22
|
+
transform: rotate(0deg);
|
23
|
+
margin-top: 0;
|
24
|
+
margin-right: 0;
|
25
|
+
margin-bottom: 0;
|
26
|
+
margin-left: 0;
|
27
|
+
}
|
28
|
+
|
29
|
+
.c5 {
|
30
|
+
padding: 0;
|
31
|
+
margin: 0;
|
32
|
+
max-height: 188px;
|
33
|
+
}
|
34
|
+
|
35
|
+
.c6 {
|
36
|
+
padding: 16px 24px;
|
37
|
+
text-align: left;
|
38
|
+
overflow: hidden;
|
39
|
+
white-space: nowrap;
|
40
|
+
text-overflow: ellipsis;
|
41
|
+
box-sizing: border-box;
|
42
|
+
font-size: 14px;
|
43
|
+
cursor: pointer;
|
44
|
+
color: #112035;
|
45
|
+
border-bottom: 1px solid #E5E5E5;
|
46
|
+
}
|
47
|
+
|
48
|
+
.c6:hover {
|
49
|
+
background-color: #E5E5E5;
|
50
|
+
}
|
51
|
+
|
52
|
+
.c6:last-child {
|
53
|
+
border-bottom: none;
|
54
|
+
}
|
55
|
+
|
56
|
+
.c1 {
|
57
|
+
color: #ffffff;
|
58
|
+
background-color: #EA9C56;
|
59
|
+
position: relative;
|
60
|
+
width: 100%;
|
61
|
+
height: 48px;
|
62
|
+
display: -webkit-box;
|
63
|
+
display: -webkit-flex;
|
64
|
+
display: -ms-flexbox;
|
65
|
+
display: flex;
|
66
|
+
-webkit-align-items: center;
|
67
|
+
-webkit-box-align: center;
|
68
|
+
-ms-flex-align: center;
|
69
|
+
align-items: center;
|
70
|
+
-webkit-box-pack: justify;
|
71
|
+
-webkit-justify-content: space-between;
|
72
|
+
-ms-flex-pack: justify;
|
73
|
+
justify-content: space-between;
|
74
|
+
text-align: center;
|
75
|
+
border-radius: 8px;
|
76
|
+
padding: 16px 16px 14px;
|
77
|
+
box-sizing: border-box;
|
78
|
+
-webkit-user-select: none;
|
79
|
+
-moz-user-select: none;
|
80
|
+
-ms-user-select: none;
|
81
|
+
user-select: none;
|
82
|
+
}
|
83
|
+
|
84
|
+
.c2 {
|
85
|
+
font-size: 14px;
|
86
|
+
white-space: nowrap;
|
87
|
+
overflow: hidden;
|
88
|
+
text-overflow: ellipsis;
|
89
|
+
}
|
90
|
+
|
91
|
+
.c0 {
|
92
|
+
position: relative;
|
93
|
+
display: block;
|
94
|
+
width: 210px;
|
95
|
+
height: 48px;
|
96
|
+
text-align: center;
|
97
|
+
cursor: pointer;
|
98
|
+
outline: none;
|
99
|
+
border-radius: 8px;
|
100
|
+
}
|
101
|
+
|
102
|
+
.c4 {
|
103
|
+
position: absolute;
|
104
|
+
width: 100%;
|
105
|
+
border-radius: 8px;
|
106
|
+
margin-top: 8px;
|
107
|
+
display: none;
|
108
|
+
max-height: 48px;
|
109
|
+
background-color: #ffffff;
|
110
|
+
border: 1px solid #E5E5E5;
|
111
|
+
overflow-y: hidden;
|
112
|
+
z-index: 2;
|
113
|
+
-webkit-transition: all 0.2s ease-in-out;
|
114
|
+
transition: all 0.2s ease-in-out;
|
115
|
+
}
|
116
|
+
|
117
|
+
<div
|
118
|
+
class="c0"
|
119
|
+
>
|
120
|
+
<div
|
121
|
+
class="c1"
|
122
|
+
>
|
123
|
+
<span
|
124
|
+
class="c2"
|
125
|
+
>
|
126
|
+
High alert
|
127
|
+
</span>
|
128
|
+
<span
|
129
|
+
class="c3"
|
130
|
+
color="white"
|
131
|
+
rotate="0"
|
132
|
+
size="24"
|
133
|
+
>
|
134
|
+
<svg
|
135
|
+
fill="none"
|
136
|
+
height="100%"
|
137
|
+
viewBox="0 0 24 24"
|
138
|
+
width="100%"
|
139
|
+
xmlns="http://www.w3.org/2000/svg"
|
140
|
+
>
|
141
|
+
<path
|
142
|
+
d="M19.66 8.248a1 1 0 00-1.412.095L12 15.482l-6.248-7.14a1 1 0 10-1.504 1.317l7 8a.995.995 0 001.504 0l7-8a1 1 0 00-.093-1.411z"
|
143
|
+
fill="#ffffff"
|
144
|
+
/>
|
145
|
+
</svg>
|
146
|
+
</span>
|
147
|
+
</div>
|
148
|
+
<div
|
149
|
+
class="c4"
|
150
|
+
>
|
151
|
+
<ul
|
152
|
+
class="c5"
|
153
|
+
>
|
154
|
+
<li
|
155
|
+
class="c6"
|
156
|
+
>
|
157
|
+
High alert
|
158
|
+
</li>
|
159
|
+
<li
|
160
|
+
class="c6"
|
161
|
+
>
|
162
|
+
Good zone
|
163
|
+
</li>
|
164
|
+
</ul>
|
165
|
+
</div>
|
166
|
+
</div>
|
167
|
+
`;
|
@@ -0,0 +1,20 @@
|
|
1
|
+
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
2
|
+
|
3
|
+
exports[`renders 1`] = `
|
4
|
+
.c0 {
|
5
|
+
margin-top: 32px;
|
6
|
+
padding-bottom: 16px;
|
7
|
+
display: -webkit-box;
|
8
|
+
display: -webkit-flex;
|
9
|
+
display: -ms-flexbox;
|
10
|
+
display: flex;
|
11
|
+
-webkit-flex-direction: column;
|
12
|
+
-ms-flex-direction: column;
|
13
|
+
flex-direction: column;
|
14
|
+
}
|
15
|
+
|
16
|
+
<div
|
17
|
+
class="c0"
|
18
|
+
direction="column"
|
19
|
+
/>
|
20
|
+
`;
|
package/dist/Button/Button.js
CHANGED
@@ -11,26 +11,27 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
11
11
|
};
|
12
12
|
import React, { forwardRef } from 'react';
|
13
13
|
import styled, { css } from 'styled-components';
|
14
|
+
import { darken } from 'polished';
|
14
15
|
import { theme } from '../theme';
|
15
16
|
import { LegacyButton } from './LegacyButton';
|
16
17
|
import { Loader } from '../Loader';
|
17
18
|
import { Icon as IconComponent } from '../Icon';
|
18
19
|
export const Button = forwardRef((_a, ref) => {
|
19
|
-
var { children, id, className = '', color = '
|
20
|
+
var { children, id, className = '', color = 'secondary', block = false, inverted = false, disabled = false, outlined = false, handleClick, loading = false, primary = false, secondary = false, tertiary = false, icon = '', forcedWidth = '', form, type } = _a, props = __rest(_a, ["children", "id", "className", "color", "block", "inverted", "disabled", "outlined", "handleClick", "loading", "primary", "secondary", "tertiary", "icon", "forcedWidth", "form", "type"]);
|
20
21
|
return (React.createElement("div", null, primary || secondary || tertiary ? (React.createElement(Container, Object.assign({ id: id, className: className, disabled: disabled || loading, onClick: (e) => {
|
21
22
|
handleClick && handleClick(e);
|
22
|
-
}, isLoading: loading, primary: primary, secondary: secondary, tertiary: tertiary, icon: icon, forcedWidth: forcedWidth }, (form ? { form } : {}), { type: type }, props, { ref: ref }), loading ? (React.createElement(Loader, { color: primary ? 'white' : `${theme.colors.
|
23
|
-
icon && (React.createElement(IconContainer, { render: icon, size: 24, color: primary ? 'white' : '
|
23
|
+
}, isLoading: loading, primary: primary, secondary: secondary, tertiary: tertiary, icon: icon, forcedWidth: forcedWidth }, (form ? { form } : {}), { type: type }, props, { ref: ref }), loading ? (React.createElement(Loader, { color: primary ? 'white' : `${theme.colors.secondary}`, height: "16" })) : (React.createElement(React.Fragment, null,
|
24
|
+
icon && (React.createElement(IconContainer, { render: icon, size: 24, color: primary ? 'white' : 'secondary' })),
|
24
25
|
React.createElement(ChildrenContainer, null, children))))) : (React.createElement(LegacyButton, { id: id, className: className, color: color, block: block, inverted: inverted, disabled: disabled, outlined: outlined, handleClick: (e) => {
|
25
26
|
handleClick && handleClick(e);
|
26
27
|
} }, children))));
|
27
28
|
});
|
28
29
|
Button.displayName = 'Button';
|
29
30
|
const Container = styled.button(({ disabled, isLoading, primary, secondary, tertiary, icon, forcedWidth, }) => css `
|
30
|
-
background-color: ${theme.colors.
|
31
|
+
background-color: ${theme.colors.primary};
|
31
32
|
border: 2px solid;
|
32
33
|
box-shadow: none;
|
33
|
-
color: ${theme.colors.
|
34
|
+
color: ${theme.colors.secondary};
|
34
35
|
padding: 16px 20px;
|
35
36
|
outline: none;
|
36
37
|
border-radius: 8px;
|
@@ -47,40 +48,45 @@ const Container = styled.button(({ disabled, isLoading, primary, secondary, tert
|
|
47
48
|
${primary &&
|
48
49
|
css `
|
49
50
|
color: ${theme.colors.white};
|
50
|
-
border-color: ${theme.colors.
|
51
|
+
border-color: ${theme.colors.primary};
|
51
52
|
|
52
53
|
&:hover {
|
53
|
-
background-color: ${!(disabled || isLoading) &&
|
54
|
+
background-color: ${!(disabled || isLoading) &&
|
55
|
+
darken(0.1, theme.colors.primary)};
|
54
56
|
}
|
55
57
|
&:active {
|
56
|
-
background-color: ${!(disabled || isLoading) &&
|
58
|
+
background-color: ${!(disabled || isLoading) &&
|
59
|
+
darken(0.1, theme.colors.primary)};
|
57
60
|
}
|
58
61
|
`}
|
59
62
|
${secondary &&
|
60
63
|
css `
|
61
64
|
background-color: ${theme.colors.white};
|
62
|
-
border-color: ${theme.colors.
|
65
|
+
border-color: ${theme.colors.secondary};
|
63
66
|
|
64
67
|
&:hover {
|
65
|
-
background-color: ${!(disabled || isLoading) &&
|
68
|
+
background-color: ${!(disabled || isLoading) &&
|
69
|
+
theme.colors.background};
|
66
70
|
border: ${!(disabled || isLoading) &&
|
67
|
-
`2px solid ${theme.colors.
|
71
|
+
`2px solid ${theme.colors.secondary}`};
|
68
72
|
}
|
69
73
|
&:active {
|
70
|
-
background-color: ${theme.colors.
|
71
|
-
border: 2px solid ${theme.colors.
|
74
|
+
background-color: ${theme.colors.background};
|
75
|
+
border: 2px solid ${theme.colors.secondary};
|
72
76
|
}
|
73
77
|
`}
|
74
78
|
${tertiary &&
|
75
79
|
css `
|
76
|
-
background-color: ${theme.colors.
|
77
|
-
border-color: ${theme.colors.
|
80
|
+
background-color: ${theme.colors.background};
|
81
|
+
border-color: ${theme.colors.background};
|
78
82
|
|
79
83
|
&:hover {
|
80
|
-
background-color: ${!(disabled || isLoading) &&
|
84
|
+
background-color: ${!(disabled || isLoading) &&
|
85
|
+
darken(0.1, theme.colors.background)};
|
81
86
|
}
|
82
87
|
&:active {
|
83
|
-
background-color: ${
|
88
|
+
background-color: ${!(disabled || isLoading) &&
|
89
|
+
darken(0.1, theme.colors.background)};
|
84
90
|
}
|
85
91
|
`}
|
86
92
|
`);
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../src/Button/Button.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAuC,UAAU,EAAE,MAAM,OAAO,CAAA;AAC9E,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAA;
|
1
|
+
{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../src/Button/Button.tsx"],"names":[],"mappings":"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"}
|
@@ -8,11 +8,11 @@ export default {
|
|
8
8
|
const Template = (args) => React.createElement(Button, Object.assign({}, args), "Get started");
|
9
9
|
export const Default = Template.bind({});
|
10
10
|
Default.args = {
|
11
|
-
color: '
|
11
|
+
color: 'secondary',
|
12
12
|
};
|
13
13
|
export const Coloured = Template.bind({});
|
14
14
|
Coloured.args = {
|
15
|
-
color: '
|
15
|
+
color: 'success',
|
16
16
|
};
|
17
17
|
export const Inverted = Template.bind({});
|
18
18
|
Inverted.args = {
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Button.stories.js","sourceRoot":"","sources":["../../src/Button/Button.stories.js"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AAEjC,eAAe;IACb,KAAK,EAAE,QAAQ;IACf,SAAS,EAAE,MAAM;IACjB,QAAQ,EAAE,EAAE,WAAW,EAAE,EAAE,MAAM,EAAE,SAAS,EAAE,EAAE;CACjD,CAAA;AAED,MAAM,QAAQ,GAAG,CAAC,IAAI,EAAE,EAAE,CAAC,oBAAC,MAAM,oBAAK,IAAI,iBAAsB,CAAA;AAEjE,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAExC,OAAO,CAAC,IAAI,GAAG;IACb,KAAK,EAAE,
|
1
|
+
{"version":3,"file":"Button.stories.js","sourceRoot":"","sources":["../../src/Button/Button.stories.js"],"names":[],"mappings":"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"}
|
@@ -1,7 +1,7 @@
|
|
1
1
|
import React from 'react';
|
2
2
|
import styled, { css } from 'styled-components';
|
3
3
|
import { theme } from '../theme';
|
4
|
-
export const LegacyButton = ({ children, id, className = '', color = '
|
4
|
+
export const LegacyButton = ({ children, id, className = '', color = 'secondary', block = false, inverted = false, disabled = false, outlined = false, handleClick, }) => (React.createElement(Container, { id: id, className: className, color: color, block: block, inverted: inverted, disabled: disabled, outlined: outlined, onClick: handleClick }, children));
|
5
5
|
const Container = styled.button(({ block, color, inverted, outlined }) => css `
|
6
6
|
position: relative;
|
7
7
|
display: inline-block;
|
@@ -13,15 +13,15 @@ const Container = styled.button(({ block, color, inverted, outlined }) => css `
|
|
13
13
|
outline: none;
|
14
14
|
cursor: pointer;
|
15
15
|
width: ${block ? '100%' : 'auto'};
|
16
|
-
background-color: ${theme.colors[`${color}
|
16
|
+
background-color: ${theme.colors[`${color}`]};
|
17
17
|
color: ${theme.colors.white};
|
18
18
|
font-weight: ${theme.font.weight.medium};
|
19
19
|
|
20
20
|
&:hover:not([disabled]) {
|
21
|
-
background-color: ${theme.colors[`${color}
|
21
|
+
background-color: ${theme.colors[`${color}`]};
|
22
22
|
}
|
23
23
|
&:active:not([disabled]) {
|
24
|
-
background-color: ${theme.colors[`${color}
|
24
|
+
background-color: ${theme.colors[`${color}`]};
|
25
25
|
}
|
26
26
|
&:disabled {
|
27
27
|
opacity: 0.5;
|
@@ -31,14 +31,14 @@ const Container = styled.button(({ block, color, inverted, outlined }) => css `
|
|
31
31
|
${(inverted || outlined) &&
|
32
32
|
css `
|
33
33
|
background-color: transparent;
|
34
|
-
border: 1px solid ${outlined ? theme.colors.
|
35
|
-
color: ${outlined ? theme.colors.
|
34
|
+
border: 1px solid ${outlined ? theme.colors.outline : 'transparent'};
|
35
|
+
color: ${outlined ? theme.colors.secondary : theme.colors[`${color}`]};
|
36
36
|
|
37
37
|
&:hover:not([disabled]) {
|
38
|
-
background-color: ${theme.colors.
|
38
|
+
background-color: ${theme.colors.background};
|
39
39
|
}
|
40
40
|
&:active:not([disabled]) {
|
41
|
-
background-color: ${theme.colors.
|
41
|
+
background-color: ${theme.colors.background};
|
42
42
|
}
|
43
43
|
`};
|
44
44
|
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"LegacyButton.js","sourceRoot":"","sources":["../../src/Button/LegacyButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwB,MAAM,OAAO,CAAA;AAC5C,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAA;AAE/C,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AA+BhC,MAAM,CAAC,MAAM,YAAY,GAAc,CAAC,EACtC,QAAQ,EACR,EAAE,EACF,SAAS,GAAG,EAAE,EACd,KAAK,GAAG,
|
1
|
+
{"version":3,"file":"LegacyButton.js","sourceRoot":"","sources":["../../src/Button/LegacyButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwB,MAAM,OAAO,CAAA;AAC5C,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAA;AAE/C,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AA+BhC,MAAM,CAAC,MAAM,YAAY,GAAc,CAAC,EACtC,QAAQ,EACR,EAAE,EACF,SAAS,GAAG,EAAE,EACd,KAAK,GAAG,WAAW,EACnB,KAAK,GAAG,KAAK,EACb,QAAQ,GAAG,KAAK,EAChB,QAAQ,GAAG,KAAK,EAChB,QAAQ,GAAG,KAAK,EAChB,WAAW,GACZ,EAAE,EAAE,CAAC,CACJ,oBAAC,SAAS,IACR,EAAE,EAAE,EAAE,EACN,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,WAAW,IAEnB,QAAQ,CACC,CACb,CAAA;AAED,MAAM,SAAS,GAAG,MAAM,CAAC,MAAM,CAC7B,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,GAAG,CAAA;;;;;;;;;;aAUlC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM;wBACZ,KAAK,CAAC,MAAM,CAAC,GAAG,KAAK,EAAE,CAAC;aACnC,KAAK,CAAC,MAAM,CAAC,KAAK;mBACZ,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,MAAM;;;0BAGjB,KAAK,CAAC,MAAM,CAAC,GAAG,KAAK,EAAE,CAAC;;;0BAGxB,KAAK,CAAC,MAAM,CAAC,GAAG,KAAK,EAAE,CAAC;;;;;;;MAO5C,CAAC,QAAQ,IAAI,QAAQ,CAAC;IACxB,GAAG,CAAA;;0BAEmB,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,aAAa;eAC1D,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,GAAG,KAAK,EAAE,CAAC;;;4BAG/C,KAAK,CAAC,MAAM,CAAC,UAAU;;;4BAGvB,KAAK,CAAC,MAAM,CAAC,UAAU;;KAE9C;;;;;;GAMF,CACF,CAAA"}
|
@@ -0,0 +1,46 @@
|
|
1
|
+
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
2
|
+
|
3
|
+
exports[`renders 1`] = `
|
4
|
+
.c0 {
|
5
|
+
position: relative;
|
6
|
+
display: inline-block;
|
7
|
+
box-sizing: border-box;
|
8
|
+
border: none;
|
9
|
+
border-radius: 8px;
|
10
|
+
font-size: 16px;
|
11
|
+
padding: 18px 16px 14px;
|
12
|
+
outline: none;
|
13
|
+
cursor: pointer;
|
14
|
+
width: auto;
|
15
|
+
background-color: #55D6AA;
|
16
|
+
color: #ffffff;
|
17
|
+
font-weight: 500;
|
18
|
+
}
|
19
|
+
|
20
|
+
.c0:hover:not([disabled]) {
|
21
|
+
background-color: #4CB99F;
|
22
|
+
}
|
23
|
+
|
24
|
+
.c0:active:not([disabled]) {
|
25
|
+
background-color: #469389;
|
26
|
+
}
|
27
|
+
|
28
|
+
.c0:disabled {
|
29
|
+
opacity: 0.5;
|
30
|
+
cursor: not-allowed;
|
31
|
+
}
|
32
|
+
|
33
|
+
@media (min-width:768px) {
|
34
|
+
.c0 {
|
35
|
+
padding: 16px 16px 15px;
|
36
|
+
font-size: 16px;
|
37
|
+
}
|
38
|
+
}
|
39
|
+
|
40
|
+
<div>
|
41
|
+
<button
|
42
|
+
class="c0"
|
43
|
+
color="green"
|
44
|
+
/>
|
45
|
+
</div>
|
46
|
+
`;
|