@mailstep/design-system 0.1.5 → 0.1.7
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/package.json +1 -1
- package/ui/Blocks/CornerDialog/CornerDialog.js +12 -14
- package/ui/Blocks/CornerDialog/CornerDialog.js.map +1 -1
- package/ui/Blocks/CornerDialog/index.js +2 -6
- package/ui/Blocks/CornerDialog/index.js.map +1 -1
- package/ui/Blocks/CornerDialog/styles.js +11 -22
- package/ui/Blocks/CornerDialog/styles.js.map +1 -1
- package/ui/Blocks/CornerDialog/utils.js +1 -4
- package/ui/Blocks/CornerDialog/utils.js.map +1 -1
- package/ui/Blocks/ImageList/ImageList.js +17 -19
- package/ui/Blocks/ImageList/ImageList.js.map +1 -1
- package/ui/Blocks/ImageList/components/AddPhoto/index.js +9 -11
- package/ui/Blocks/ImageList/components/AddPhoto/index.js.map +1 -1
- package/ui/Blocks/ImageList/components/AddPhoto/styles.js +5 -12
- package/ui/Blocks/ImageList/components/AddPhoto/styles.js.map +1 -1
- package/ui/Blocks/ImageList/components/CloseButton/index.js +6 -8
- package/ui/Blocks/ImageList/components/CloseButton/index.js.map +1 -1
- package/ui/Blocks/ImageList/components/CloseButton/styles.js +4 -10
- package/ui/Blocks/ImageList/components/CloseButton/styles.js.map +1 -1
- package/ui/Blocks/ImageList/components/ImageElement/index.js +7 -9
- package/ui/Blocks/ImageList/components/ImageElement/index.js.map +1 -1
- package/ui/Blocks/ImageList/components/ImageElement/styles.js +5 -11
- package/ui/Blocks/ImageList/components/ImageElement/styles.js.map +1 -1
- package/ui/Blocks/ImageList/components/ImageTag/index.js +5 -7
- package/ui/Blocks/ImageList/components/ImageTag/index.js.map +1 -1
- package/ui/Blocks/ImageList/components/ImageTag/styles.js +4 -10
- package/ui/Blocks/ImageList/components/ImageTag/styles.js.map +1 -1
- package/ui/Blocks/ImageList/index.js +2 -6
- package/ui/Blocks/ImageList/index.js.map +1 -1
- package/ui/Blocks/ImageList/styles.js +4 -10
- package/ui/Blocks/ImageList/styles.js.map +1 -1
- package/ui/Blocks/LightBox/LightBox.js +10 -12
- package/ui/Blocks/LightBox/LightBox.js.map +1 -1
- package/ui/Blocks/LightBox/hooks/useLightBox.js +6 -8
- package/ui/Blocks/LightBox/hooks/useLightBox.js.map +1 -1
- package/ui/Blocks/LightBox/index.js +4 -8
- package/ui/Blocks/LightBox/index.js.map +1 -1
- package/ui/Blocks/LightBox/styles.js +6 -14
- package/ui/Blocks/LightBox/styles.js.map +1 -1
- package/ui/Blocks/Modal/Modal.js +18 -20
- package/ui/Blocks/Modal/Modal.js.map +1 -1
- package/ui/Blocks/Modal/hooks/useClickOutside.js +6 -8
- package/ui/Blocks/Modal/hooks/useClickOutside.js.map +1 -1
- package/ui/Blocks/Modal/hooks/useModal.js +6 -8
- package/ui/Blocks/Modal/hooks/useModal.js.map +1 -1
- package/ui/Blocks/Modal/index.js +3 -7
- package/ui/Blocks/Modal/index.js.map +1 -1
- package/ui/Blocks/Modal/styles.js +16 -29
- package/ui/Blocks/Modal/styles.js.map +1 -1
- package/ui/Blocks/Modal/utils.js +1 -4
- package/ui/Blocks/Modal/utils.js.map +1 -1
- package/ui/Blocks/Tabs/Tabs.js +11 -13
- package/ui/Blocks/Tabs/Tabs.js.map +1 -1
- package/ui/Blocks/Tabs/hooks/useTabs.js +4 -6
- package/ui/Blocks/Tabs/hooks/useTabs.js.map +1 -1
- package/ui/Blocks/Tabs/index.js +3 -8
- package/ui/Blocks/Tabs/index.js.map +1 -1
- package/ui/Blocks/Tabs/styles.js +9 -19
- package/ui/Blocks/Tabs/styles.js.map +1 -1
- package/ui/Elements/Alert/Alert.js +10 -14
- package/ui/Elements/Alert/Alert.js.map +1 -1
- package/ui/Elements/Alert/index.js +2 -7
- package/ui/Elements/Alert/index.js.map +1 -1
- package/ui/Elements/Alert/styles.js +15 -29
- package/ui/Elements/Alert/styles.js.map +1 -1
- package/ui/Elements/Avatar/Avatar.js +8 -14
- package/ui/Elements/Avatar/Avatar.js.map +1 -1
- package/ui/Elements/Avatar/index.js +2 -7
- package/ui/Elements/Avatar/index.js.map +1 -1
- package/ui/Elements/Badge/Badge.js +13 -21
- package/ui/Elements/Badge/Badge.js.map +1 -1
- package/ui/Elements/Badge/index.js +2 -7
- package/ui/Elements/Badge/index.js.map +1 -1
- package/ui/Elements/BorderedBox/BorderedBox.js +7 -15
- package/ui/Elements/BorderedBox/BorderedBox.js.map +1 -1
- package/ui/Elements/BorderedBox/index.js +2 -7
- package/ui/Elements/BorderedBox/index.js.map +1 -1
- package/ui/Elements/Button/Button.js +7 -11
- package/ui/Elements/Button/Button.js.map +1 -1
- package/ui/Elements/Button/index.js +2 -7
- package/ui/Elements/Button/index.js.map +1 -1
- package/ui/Elements/Button/styles.js +10 -19
- package/ui/Elements/Button/styles.js.map +1 -1
- package/ui/Elements/Card/Card.js +14 -21
- package/ui/Elements/Card/Card.js.map +1 -1
- package/ui/Elements/Card/index.d.ts +5 -4
- package/ui/Elements/Card/index.js +3 -9
- package/ui/Elements/Card/index.js.map +1 -1
- package/ui/Elements/Card/styles.d.ts +12 -0
- package/ui/Elements/Card/styles.js +13 -23
- package/ui/Elements/Card/styles.js.map +1 -1
- package/ui/Elements/Card/types.d.ts +8 -13
- package/ui/Elements/Dropdown/Dropdown.js +10 -18
- package/ui/Elements/Dropdown/Dropdown.js.map +1 -1
- package/ui/Elements/Dropdown/index.js +2 -7
- package/ui/Elements/Dropdown/index.js.map +1 -1
- package/ui/Elements/ErrorMessage/ErrorMessage.js +9 -17
- package/ui/Elements/ErrorMessage/ErrorMessage.js.map +1 -1
- package/ui/Elements/ErrorMessage/index.js +2 -7
- package/ui/Elements/ErrorMessage/index.js.map +1 -1
- package/ui/Elements/Icon/Icon.js +214 -224
- package/ui/Elements/Icon/Icon.js.map +1 -1
- package/ui/Elements/Icon/icons/FlagCZ.js +4 -6
- package/ui/Elements/Icon/icons/FlagCZ.js.map +1 -1
- package/ui/Elements/Icon/icons/FlagUSA.js +4 -6
- package/ui/Elements/Icon/icons/FlagUSA.js.map +1 -1
- package/ui/Elements/Icon/index.js +5 -10
- package/ui/Elements/Icon/index.js.map +1 -1
- package/ui/Elements/Image/Image.js +5 -9
- package/ui/Elements/Image/Image.js.map +1 -1
- package/ui/Elements/Image/index.js +2 -7
- package/ui/Elements/Image/index.js.map +1 -1
- package/ui/Elements/Label/Label.js +10 -17
- package/ui/Elements/Label/Label.js.map +1 -1
- package/ui/Elements/Label/index.js +3 -8
- package/ui/Elements/Label/index.js.map +1 -1
- package/ui/Elements/Line/Line.js +6 -14
- package/ui/Elements/Line/Line.js.map +1 -1
- package/ui/Elements/Line/index.js +2 -7
- package/ui/Elements/Line/index.js.map +1 -1
- package/ui/Elements/Link/Link.js +15 -23
- package/ui/Elements/Link/Link.js.map +1 -1
- package/ui/Elements/Link/index.js +2 -7
- package/ui/Elements/Link/index.js.map +1 -1
- package/ui/Elements/Logo/Logo.js +27 -35
- package/ui/Elements/Logo/Logo.js.map +1 -1
- package/ui/Elements/Logo/assets/mailship/logo_black.png.js +1 -5
- package/ui/Elements/Logo/assets/mailship/logo_black.png.js.map +1 -1
- package/ui/Elements/Logo/assets/mailship/logo_m.png.js +1 -5
- package/ui/Elements/Logo/assets/mailship/logo_m.png.js.map +1 -1
- package/ui/Elements/Logo/assets/mailship/logo_white.png.js +1 -5
- package/ui/Elements/Logo/assets/mailship/logo_white.png.js.map +1 -1
- package/ui/Elements/Logo/assets/mailship/mailship-logo.svg.js +2 -6
- package/ui/Elements/Logo/assets/mailship/mailship-logo.svg.js.map +1 -1
- package/ui/Elements/Logo/assets/mailstep/mailstep_black.svg.js +2 -6
- package/ui/Elements/Logo/assets/mailstep/mailstep_black.svg.js.map +1 -1
- package/ui/Elements/Logo/assets/mailstep/mailstep_white.svg.js +2 -6
- package/ui/Elements/Logo/assets/mailstep/mailstep_white.svg.js.map +1 -1
- package/ui/Elements/Logo/assets/mailstock/mailstock.svg.js +2 -6
- package/ui/Elements/Logo/assets/mailstock/mailstock.svg.js.map +1 -1
- package/ui/Elements/Logo/assets/mailwise/mailwiseLogo.svg.js +2 -6
- package/ui/Elements/Logo/assets/mailwise/mailwiseLogo.svg.js.map +1 -1
- package/ui/Elements/Logo/assets/mailwise/mailwiseLogoSmall.svg.js +2 -6
- package/ui/Elements/Logo/assets/mailwise/mailwiseLogoSmall.svg.js.map +1 -1
- package/ui/Elements/Logo/assets/mailwrap/mailwrapLogo.svg.js +2 -6
- package/ui/Elements/Logo/assets/mailwrap/mailwrapLogo.svg.js.map +1 -1
- package/ui/Elements/Logo/index.js +2 -7
- package/ui/Elements/Logo/index.js.map +1 -1
- package/ui/Elements/Pagination/Pagination.js +7 -11
- package/ui/Elements/Pagination/Pagination.js.map +1 -1
- package/ui/Elements/Pagination/index.js +2 -7
- package/ui/Elements/Pagination/index.js.map +1 -1
- package/ui/Elements/Pagination/styled.js +14 -25
- package/ui/Elements/Pagination/styled.js.map +1 -1
- package/ui/Elements/Paragraph/Paragraph.js +3 -7
- package/ui/Elements/Paragraph/Paragraph.js.map +1 -1
- package/ui/Elements/Paragraph/index.js +2 -7
- package/ui/Elements/Paragraph/index.js.map +1 -1
- package/ui/Elements/Portal/index.js +6 -15
- package/ui/Elements/Portal/index.js.map +1 -1
- package/ui/Elements/ProgressBar/ProgressBar.js +4 -8
- package/ui/Elements/ProgressBar/ProgressBar.js.map +1 -1
- package/ui/Elements/ProgressBar/index.js +2 -7
- package/ui/Elements/ProgressBar/index.js.map +1 -1
- package/ui/Elements/ProgressBar/styles.js +14 -22
- package/ui/Elements/ProgressBar/styles.js.map +1 -1
- package/ui/Elements/SimpleLink/SimpleLink.js +7 -15
- package/ui/Elements/SimpleLink/SimpleLink.js.map +1 -1
- package/ui/Elements/SimpleLink/index.js +2 -7
- package/ui/Elements/SimpleLink/index.js.map +1 -1
- package/ui/Elements/SpaceAround/SpaceAround.js +12 -20
- package/ui/Elements/SpaceAround/SpaceAround.js.map +1 -1
- package/ui/Elements/SpaceAround/index.js +2 -7
- package/ui/Elements/SpaceAround/index.js.map +1 -1
- package/ui/Elements/Spinner/Spinner.js +4 -10
- package/ui/Elements/Spinner/Spinner.js.map +1 -1
- package/ui/Elements/Spinner/index.js +2 -7
- package/ui/Elements/Spinner/index.js.map +1 -1
- package/ui/Elements/Spinner/styles.js +9 -16
- package/ui/Elements/Spinner/styles.js.map +1 -1
- package/ui/Elements/Tag/Tag.js +7 -16
- package/ui/Elements/Tag/Tag.js.map +1 -1
- package/ui/Elements/Tag/index.js +2 -7
- package/ui/Elements/Tag/index.js.map +1 -1
- package/ui/Elements/Tag/palletes.js +1 -3
- package/ui/Elements/Tag/palletes.js.map +1 -1
- package/ui/Elements/Tag/types.d.ts +1 -0
- package/ui/Elements/Text/Text.js +5 -9
- package/ui/Elements/Text/Text.js.map +1 -1
- package/ui/Elements/Toast/Toast.js +10 -18
- package/ui/Elements/Toast/Toast.js.map +1 -1
- package/ui/Elements/Toast/index.js +2 -7
- package/ui/Elements/Toast/index.js.map +1 -1
- package/ui/Elements/Toggle/Toggle.js +15 -23
- package/ui/Elements/Toggle/Toggle.js.map +1 -1
- package/ui/Elements/Toggle/index.js +2 -7
- package/ui/Elements/Toggle/index.js.map +1 -1
- package/ui/Elements/Typography/Typography.js +17 -31
- package/ui/Elements/Typography/Typography.js.map +1 -1
- package/ui/Elements/Typography/index.js +3 -19
- package/ui/Elements/Typography/index.js.map +1 -1
- package/ui/Forms/Checkbox/Checkbox.js +9 -13
- package/ui/Forms/Checkbox/Checkbox.js.map +1 -1
- package/ui/Forms/Checkbox/index.js +2 -7
- package/ui/Forms/Checkbox/index.js.map +1 -1
- package/ui/Forms/Checkbox/styles.js +9 -18
- package/ui/Forms/Checkbox/styles.js.map +1 -1
- package/ui/Forms/Input/Input.js +18 -20
- package/ui/Forms/Input/Input.js.map +1 -1
- package/ui/Forms/Input/index.js +2 -7
- package/ui/Forms/Input/index.js.map +1 -1
- package/ui/Forms/Input/styles.js +19 -32
- package/ui/Forms/Input/styles.js.map +1 -1
- package/ui/Forms/RadioButton/RadioButton.js +6 -10
- package/ui/Forms/RadioButton/RadioButton.js.map +1 -1
- package/ui/Forms/RadioButton/index.js +2 -7
- package/ui/Forms/RadioButton/index.js.map +1 -1
- package/ui/Forms/RadioButton/styles.js +9 -20
- package/ui/Forms/RadioButton/styles.js.map +1 -1
- package/ui/ThemeProvider/ThemeProvider.js +5 -9
- package/ui/ThemeProvider/ThemeProvider.js.map +1 -1
- package/ui/ThemeProvider/index.js +2 -7
- package/ui/ThemeProvider/index.js.map +1 -1
- package/ui/ThemeProvider/themes/default.js +1 -5
- package/ui/ThemeProvider/themes/default.js.map +1 -1
- package/ui/ThemeProvider/themes/index.js +7 -11
- package/ui/ThemeProvider/themes/index.js.map +1 -1
- package/ui/ThemeProvider/themes/light.js +1 -5
- package/ui/ThemeProvider/themes/light.js.map +1 -1
- package/ui/ThemeProvider/themes/mailwise.js +1 -5
- package/ui/ThemeProvider/themes/mailwise.js.map +1 -1
- package/ui/dts/Elements/Tag/types.d.ts +1 -0
- package/ui/index.d.ts +1 -1
- package/ui/index.js +45 -113
- package/ui/index.js.map +1 -1
- package/ui/utils/CreateRgba/createRgba.js +6 -15
- package/ui/utils/CreateRgba/createRgba.js.map +1 -1
- package/ui/utils/KeyPress/KeyPress.js +4 -8
- package/ui/utils/KeyPress/KeyPress.js.map +1 -1
- package/ui/utils/KeyPress/index.js +2 -6
- package/ui/utils/KeyPress/index.js.map +1 -1
- package/ui/utils/index.js +5 -11
- package/ui/utils/index.js.map +1 -1
- package/ui/Elements/Card/Card.d.ts +0 -8
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Badge.js","sources":["../../../../packages/ui/Elements/Badge/Badge.tsx"],"sourcesContent":["import { __makeTemplateObject } from \"tslib\";\nimport { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport styled, { css, useTheme } from '@xstyled/styled-components';\nimport { th } from '@xstyled/styled-components';\nvar Circle = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject([\"\\n display: flex;\\n align-items: center;\\n justify-content: center;\\n padding: 2px;\\n color: white;\\n background-color: \", \";\\n border-radius: 50%;\\n width: \", \";\\n height: \", \";\\n\\n .label {\\n font-family: \", \";\\n font-weight: 600;\\n vertical-align: middle;\\n text-align: center;\\n font-size: \", \";\\n }\\n\\n position: absolute;\\n top: 0;\\n right: 0;\\n transform: translate(\", \");\\n\"], [\"\\n display: flex;\\n align-items: center;\\n justify-content: center;\\n padding: 2px;\\n color: white;\\n background-color: \", \";\\n border-radius: 50%;\\n width: \", \";\\n height: \", \";\\n\\n .label {\\n font-family: \", \";\\n font-weight: 600;\\n vertical-align: middle;\\n text-align: center;\\n font-size: \", \";\\n }\\n\\n position: absolute;\\n top: 0;\\n right: 0;\\n transform: translate(\", \");\\n\"])), function (_a) {\n var color = _a.color;\n return color;\n}, function (_a) {\n var size = _a.size;\n return size;\n}, function (_a) {\n var size = _a.size;\n return size;\n}, th('fonts.primary'), function (_a) {\n var fontSize = _a.fontSize;\n return \"\".concat(fontSize, \"px\");\n}, function (_a) {\n var topPosition = _a.topPosition;\n return (topPosition ? '75%, -75%' : '50%, -50%');\n});\nvar RelativeWrap = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject([\"\\n position: relative;\\n \", \";\\n\"], [\"\\n position: relative;\\n \", \";\\n\"])), function (_a) {\n var width = _a.width;\n return width\n ? css(templateObject_2 || (templateObject_2 = __makeTemplateObject([\"\\n width: \", \";\\n \"], [\"\\n width: \", \";\\n \"])), width) : '';\n});\nvar Badge = function (_a) {\n var children = _a.children, _b = _a.color, color = _b === void 0 ? 'red2' : _b, _c = _a.size, size = _c === void 0 ? 6 : _c, _d = _a.fontSize, fontSize = _d === void 0 ? 10 : _d, label = _a.label, childWidth = _a.childWidth, topPosition = _a.topPosition;\n var theme = useTheme();\n var themeColor = th.color(color)({ theme: theme });\n var themeSize = th.fontSize(size)({ theme: theme });\n if (!label || (typeof label === 'number' && label <= 0)) {\n return _jsx(_Fragment, { children: children });\n }\n return (_jsxs(RelativeWrap, { width: childWidth, children: [_jsx(Circle, { color: themeColor, size: themeSize, topPosition: topPosition, fontSize: fontSize, children: _jsx(\"div\", { className: \"label\", children: label }) }), children] }));\n};\nexport default Badge;\nvar templateObject_1, templateObject_2, templateObject_3;\n//# sourceMappingURL=Badge.js.map"],"names":["
|
|
1
|
+
{"version":3,"file":"Badge.js","sources":["../../../../packages/ui/Elements/Badge/Badge.tsx"],"sourcesContent":["import { __makeTemplateObject } from \"tslib\";\nimport { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport styled, { css, useTheme } from '@xstyled/styled-components';\nimport { th } from '@xstyled/styled-components';\nvar Circle = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject([\"\\n display: flex;\\n align-items: center;\\n justify-content: center;\\n padding: 2px;\\n color: white;\\n background-color: \", \";\\n border-radius: 50%;\\n width: \", \";\\n height: \", \";\\n\\n .label {\\n font-family: \", \";\\n font-weight: 600;\\n vertical-align: middle;\\n text-align: center;\\n font-size: \", \";\\n }\\n\\n position: absolute;\\n top: 0;\\n right: 0;\\n transform: translate(\", \");\\n\"], [\"\\n display: flex;\\n align-items: center;\\n justify-content: center;\\n padding: 2px;\\n color: white;\\n background-color: \", \";\\n border-radius: 50%;\\n width: \", \";\\n height: \", \";\\n\\n .label {\\n font-family: \", \";\\n font-weight: 600;\\n vertical-align: middle;\\n text-align: center;\\n font-size: \", \";\\n }\\n\\n position: absolute;\\n top: 0;\\n right: 0;\\n transform: translate(\", \");\\n\"])), function (_a) {\n var color = _a.color;\n return color;\n}, function (_a) {\n var size = _a.size;\n return size;\n}, function (_a) {\n var size = _a.size;\n return size;\n}, th('fonts.primary'), function (_a) {\n var fontSize = _a.fontSize;\n return \"\".concat(fontSize, \"px\");\n}, function (_a) {\n var topPosition = _a.topPosition;\n return (topPosition ? '75%, -75%' : '50%, -50%');\n});\nvar RelativeWrap = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject([\"\\n position: relative;\\n \", \";\\n\"], [\"\\n position: relative;\\n \", \";\\n\"])), function (_a) {\n var width = _a.width;\n return width\n ? css(templateObject_2 || (templateObject_2 = __makeTemplateObject([\"\\n width: \", \";\\n \"], [\"\\n width: \", \";\\n \"])), width) : '';\n});\nvar Badge = function (_a) {\n var children = _a.children, _b = _a.color, color = _b === void 0 ? 'red2' : _b, _c = _a.size, size = _c === void 0 ? 6 : _c, _d = _a.fontSize, fontSize = _d === void 0 ? 10 : _d, label = _a.label, childWidth = _a.childWidth, topPosition = _a.topPosition;\n var theme = useTheme();\n var themeColor = th.color(color)({ theme: theme });\n var themeSize = th.fontSize(size)({ theme: theme });\n if (!label || (typeof label === 'number' && label <= 0)) {\n return _jsx(_Fragment, { children: children });\n }\n return (_jsxs(RelativeWrap, { width: childWidth, children: [_jsx(Circle, { color: themeColor, size: themeSize, topPosition: topPosition, fontSize: fontSize, children: _jsx(\"div\", { className: \"label\", children: label }) }), children] }));\n};\nexport default Badge;\nvar templateObject_1, templateObject_2, templateObject_3;\n//# sourceMappingURL=Badge.js.map"],"names":["_jsx","_Fragment","_jsxs"],"mappings":"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"}
|
|
@@ -1,11 +1,6 @@
|
|
|
1
|
-
|
|
1
|
+
import Badge from './Badge.js';
|
|
2
2
|
|
|
3
|
-
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
3
|
|
|
5
|
-
var Badge = require('./Badge.js');
|
|
6
4
|
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
exports.Badge = Badge.default;
|
|
10
|
-
exports.default = Badge.default;
|
|
5
|
+
export { Badge, Badge as default };
|
|
11
6
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
|
|
@@ -1,21 +1,13 @@
|
|
|
1
|
-
|
|
1
|
+
import { __makeTemplateObject, __rest, __assign } from 'tslib';
|
|
2
|
+
import { jsx } from 'react/jsx-runtime';
|
|
3
|
+
import styled, { x } from '@xstyled/styled-components';
|
|
2
4
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
var tslib = require('tslib');
|
|
6
|
-
var jsxRuntime = require('react/jsx-runtime');
|
|
7
|
-
var styled = require('@xstyled/styled-components');
|
|
8
|
-
|
|
9
|
-
function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
|
|
10
|
-
|
|
11
|
-
var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
|
|
12
|
-
|
|
13
|
-
var StyledBox = styled__default.default(styled.x.div)(templateObject_1 || (templateObject_1 = tslib.__makeTemplateObject(["\n display: flex;\n box-sizing: border-box;\n flex-direction: column;\n padding: 3;\n border: slim;\n border-color: lightGray3;\n border-radius: md;\n"], ["\n display: flex;\n box-sizing: border-box;\n flex-direction: column;\n padding: 3;\n border: slim;\n border-color: lightGray3;\n border-radius: md;\n"])));
|
|
5
|
+
var StyledBox = styled(x.div)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n display: flex;\n box-sizing: border-box;\n flex-direction: column;\n padding: 3;\n border: slim;\n border-color: lightGray3;\n border-radius: md;\n"], ["\n display: flex;\n box-sizing: border-box;\n flex-direction: column;\n padding: 3;\n border: slim;\n border-color: lightGray3;\n border-radius: md;\n"])));
|
|
14
6
|
var BorderedBox = function (_a) {
|
|
15
|
-
var children = _a.children, className = _a.className, id = _a.id, rest =
|
|
16
|
-
return (
|
|
7
|
+
var children = _a.children, className = _a.className, id = _a.id, rest = __rest(_a, ["children", "className", "id"]);
|
|
8
|
+
return (jsx(StyledBox, __assign({ id: id, className: className }, rest, { children: children })));
|
|
17
9
|
};
|
|
18
10
|
var templateObject_1;
|
|
19
11
|
|
|
20
|
-
|
|
12
|
+
export { BorderedBox as default };
|
|
21
13
|
//# sourceMappingURL=BorderedBox.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BorderedBox.js","sources":["../../../../packages/ui/Elements/BorderedBox/BorderedBox.tsx"],"sourcesContent":["import { __assign, __makeTemplateObject, __rest } from \"tslib\";\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport styled, { x } from '@xstyled/styled-components';\nvar StyledBox = styled(x.div)(templateObject_1 || (templateObject_1 = __makeTemplateObject([\"\\n display: flex;\\n box-sizing: border-box;\\n flex-direction: column;\\n padding: 3;\\n border: slim;\\n border-color: lightGray3;\\n border-radius: md;\\n\"], [\"\\n display: flex;\\n box-sizing: border-box;\\n flex-direction: column;\\n padding: 3;\\n border: slim;\\n border-color: lightGray3;\\n border-radius: md;\\n\"])));\nvar BorderedBox = function (_a) {\n var children = _a.children, className = _a.className, id = _a.id, rest = __rest(_a, [\"children\", \"className\", \"id\"]);\n return (_jsx(StyledBox, __assign({ id: id, className: className }, rest, { children: children })));\n};\nexport default BorderedBox;\nvar templateObject_1;\n//# sourceMappingURL=BorderedBox.js.map"],"names":["
|
|
1
|
+
{"version":3,"file":"BorderedBox.js","sources":["../../../../packages/ui/Elements/BorderedBox/BorderedBox.tsx"],"sourcesContent":["import { __assign, __makeTemplateObject, __rest } from \"tslib\";\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport styled, { x } from '@xstyled/styled-components';\nvar StyledBox = styled(x.div)(templateObject_1 || (templateObject_1 = __makeTemplateObject([\"\\n display: flex;\\n box-sizing: border-box;\\n flex-direction: column;\\n padding: 3;\\n border: slim;\\n border-color: lightGray3;\\n border-radius: md;\\n\"], [\"\\n display: flex;\\n box-sizing: border-box;\\n flex-direction: column;\\n padding: 3;\\n border: slim;\\n border-color: lightGray3;\\n border-radius: md;\\n\"])));\nvar BorderedBox = function (_a) {\n var children = _a.children, className = _a.className, id = _a.id, rest = __rest(_a, [\"children\", \"className\", \"id\"]);\n return (_jsx(StyledBox, __assign({ id: id, className: className }, rest, { children: children })));\n};\nexport default BorderedBox;\nvar templateObject_1;\n//# sourceMappingURL=BorderedBox.js.map"],"names":["_jsx"],"mappings":";;;;AAGA,IAAI,SAAS,GAAG,MAAM,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,gBAAgB,KAAK,gBAAgB,GAAG,oBAAoB,CAAC,CAAC,+JAA+J,CAAC,EAAE,CAAC,+JAA+J,CAAC,CAAC,CAAC,CAAC,CAAC;AACha,IAAC,WAAW,GAAG,UAAU,EAAE,EAAE;AAChC,IAAI,IAAI,QAAQ,GAAG,EAAE,CAAC,QAAQ,EAAE,SAAS,GAAG,EAAE,CAAC,SAAS,EAAE,EAAE,GAAG,EAAE,CAAC,EAAE,EAAE,IAAI,GAAG,MAAM,CAAC,EAAE,EAAE,CAAC,UAAU,EAAE,WAAW,EAAE,IAAI,CAAC,CAAC,CAAC;AACzH,IAAI,QAAQA,GAAI,CAAC,SAAS,EAAE,QAAQ,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,SAAS,EAAE,EAAE,IAAI,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,CAAC,CAAC,EAAE;AACvG,EAAE;AAEF,IAAI,gBAAgB;;;;"}
|
|
@@ -1,11 +1,6 @@
|
|
|
1
|
-
|
|
1
|
+
import BorderedBox from './BorderedBox.js';
|
|
2
2
|
|
|
3
|
-
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
3
|
|
|
5
|
-
var BorderedBox = require('./BorderedBox.js');
|
|
6
4
|
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
exports.BorderedBox = BorderedBox.default;
|
|
10
|
-
exports.default = BorderedBox.default;
|
|
5
|
+
export { BorderedBox, BorderedBox as default };
|
|
11
6
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
|
|
@@ -1,16 +1,12 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
var tslib = require('tslib');
|
|
6
|
-
var jsxRuntime = require('react/jsx-runtime');
|
|
7
|
-
var styles = require('./styles.js');
|
|
8
|
-
var Spinner = require('../Spinner/Spinner.js');
|
|
1
|
+
import { __rest, __assign } from 'tslib';
|
|
2
|
+
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
3
|
+
import { StyledButton, StyledWrapper, StyledIcon, LoadingIconWrapper } from './styles.js';
|
|
4
|
+
import { Spinner } from '../Spinner/Spinner.js';
|
|
9
5
|
|
|
10
6
|
var Button = function (_a) {
|
|
11
|
-
var isLoading = _a.isLoading, loadingText = _a.loadingText, icon = _a.icon, _b = _a.appearance, appearance = _b === void 0 ? 'primary' : _b, _c = _a.disabled, disabled = _c === void 0 ? false : _c, _d = _a.sizing, sizing = _d === void 0 ? 'normal' : _d, buttonRef = _a.buttonRef, onClick = _a.onClick, _e = _a.fullWidth, fullWidth = _e === void 0 ? false : _e, props =
|
|
12
|
-
return (
|
|
7
|
+
var isLoading = _a.isLoading, loadingText = _a.loadingText, icon = _a.icon, _b = _a.appearance, appearance = _b === void 0 ? 'primary' : _b, _c = _a.disabled, disabled = _c === void 0 ? false : _c, _d = _a.sizing, sizing = _d === void 0 ? 'normal' : _d, buttonRef = _a.buttonRef, onClick = _a.onClick, _e = _a.fullWidth, fullWidth = _e === void 0 ? false : _e, props = __rest(_a, ["isLoading", "loadingText", "icon", "appearance", "disabled", "sizing", "buttonRef", "onClick", "fullWidth"]);
|
|
8
|
+
return (jsx(StyledButton, __assign({}, props, { onClick: !disabled && !isLoading ? onClick : undefined, "data-appearance": appearance, "data-sizing": sizing, disabled: disabled, ref: buttonRef, fullWidth: fullWidth, children: jsxs(StyledWrapper, { children: [icon && (typeof icon === 'string' ? jsx(StyledIcon, { "$addMargin": !!props.children, icon: icon }) : icon), isLoading ? (jsxs(Fragment, { children: [jsx(LoadingIconWrapper, { "$addMargin": !!loadingText || !!props.children, children: jsx(Spinner, { variant: "sm" }) }), loadingText || loadingText === '' ? loadingText : 'Loading'] })) : (props.children)] }) })));
|
|
13
9
|
};
|
|
14
10
|
|
|
15
|
-
|
|
11
|
+
export { Button as default };
|
|
16
12
|
//# sourceMappingURL=Button.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.js","sources":["../../../../packages/ui/Elements/Button/Button.tsx"],"sourcesContent":["import { __assign, __rest } from \"tslib\";\nimport { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport { StyledButton, LoadingIconWrapper, StyledIcon, StyledWrapper } from './styles';\nimport { Spinner } from '../Spinner';\nvar Button = function (_a) {\n var isLoading = _a.isLoading, loadingText = _a.loadingText, icon = _a.icon, _b = _a.appearance, appearance = _b === void 0 ? 'primary' : _b, _c = _a.disabled, disabled = _c === void 0 ? false : _c, _d = _a.sizing, sizing = _d === void 0 ? 'normal' : _d, buttonRef = _a.buttonRef, onClick = _a.onClick, _e = _a.fullWidth, fullWidth = _e === void 0 ? false : _e, props = __rest(_a, [\"isLoading\", \"loadingText\", \"icon\", \"appearance\", \"disabled\", \"sizing\", \"buttonRef\", \"onClick\", \"fullWidth\"]);\n return (_jsx(StyledButton, __assign({}, props, { onClick: !disabled && !isLoading ? onClick : undefined, \"data-appearance\": appearance, \"data-sizing\": sizing, disabled: disabled, ref: buttonRef, fullWidth: fullWidth, children: _jsxs(StyledWrapper, { children: [icon && (typeof icon === 'string' ? _jsx(StyledIcon, { \"$addMargin\": !!props.children, icon: icon }) : icon), isLoading ? (_jsxs(_Fragment, { children: [_jsx(LoadingIconWrapper, { \"$addMargin\": !!loadingText || !!props.children, children: _jsx(Spinner, { variant: \"sm\" }) }), loadingText || loadingText === '' ? loadingText : 'Loading'] })) : (props.children)] }) })));\n};\nexport default Button;\n//# sourceMappingURL=Button.js.map"],"names":["
|
|
1
|
+
{"version":3,"file":"Button.js","sources":["../../../../packages/ui/Elements/Button/Button.tsx"],"sourcesContent":["import { __assign, __rest } from \"tslib\";\nimport { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport { StyledButton, LoadingIconWrapper, StyledIcon, StyledWrapper } from './styles';\nimport { Spinner } from '../Spinner';\nvar Button = function (_a) {\n var isLoading = _a.isLoading, loadingText = _a.loadingText, icon = _a.icon, _b = _a.appearance, appearance = _b === void 0 ? 'primary' : _b, _c = _a.disabled, disabled = _c === void 0 ? false : _c, _d = _a.sizing, sizing = _d === void 0 ? 'normal' : _d, buttonRef = _a.buttonRef, onClick = _a.onClick, _e = _a.fullWidth, fullWidth = _e === void 0 ? false : _e, props = __rest(_a, [\"isLoading\", \"loadingText\", \"icon\", \"appearance\", \"disabled\", \"sizing\", \"buttonRef\", \"onClick\", \"fullWidth\"]);\n return (_jsx(StyledButton, __assign({}, props, { onClick: !disabled && !isLoading ? onClick : undefined, \"data-appearance\": appearance, \"data-sizing\": sizing, disabled: disabled, ref: buttonRef, fullWidth: fullWidth, children: _jsxs(StyledWrapper, { children: [icon && (typeof icon === 'string' ? _jsx(StyledIcon, { \"$addMargin\": !!props.children, icon: icon }) : icon), isLoading ? (_jsxs(_Fragment, { children: [_jsx(LoadingIconWrapper, { \"$addMargin\": !!loadingText || !!props.children, children: _jsx(Spinner, { variant: \"sm\" }) }), loadingText || loadingText === '' ? loadingText : 'Loading'] })) : (props.children)] }) })));\n};\nexport default Button;\n//# sourceMappingURL=Button.js.map"],"names":["_jsx","_jsxs","_Fragment"],"mappings":";;;;;AAIG,IAAC,MAAM,GAAG,UAAU,EAAE,EAAE;AAC3B,IAAI,IAAI,SAAS,GAAG,EAAE,CAAC,SAAS,EAAE,WAAW,GAAG,EAAE,CAAC,WAAW,EAAE,IAAI,GAAG,EAAE,CAAC,IAAI,EAAE,EAAE,GAAG,EAAE,CAAC,UAAU,EAAE,UAAU,GAAG,EAAE,KAAK,KAAK,CAAC,GAAG,SAAS,GAAG,EAAE,EAAE,EAAE,GAAG,EAAE,CAAC,QAAQ,EAAE,QAAQ,GAAG,EAAE,KAAK,KAAK,CAAC,GAAG,KAAK,GAAG,EAAE,EAAE,EAAE,GAAG,EAAE,CAAC,MAAM,EAAE,MAAM,GAAG,EAAE,KAAK,KAAK,CAAC,GAAG,QAAQ,GAAG,EAAE,EAAE,SAAS,GAAG,EAAE,CAAC,SAAS,EAAE,OAAO,GAAG,EAAE,CAAC,OAAO,EAAE,EAAE,GAAG,EAAE,CAAC,SAAS,EAAE,SAAS,GAAG,EAAE,KAAK,KAAK,CAAC,GAAG,KAAK,GAAG,EAAE,EAAE,KAAK,GAAG,MAAM,CAAC,EAAE,EAAE,CAAC,WAAW,EAAE,aAAa,EAAE,MAAM,EAAE,YAAY,EAAE,UAAU,EAAE,QAAQ,EAAE,WAAW,EAAE,SAAS,EAAE,WAAW,CAAC,CAAC,CAAC;AAC/e,IAAI,QAAQA,GAAI,CAAC,YAAY,EAAE,QAAQ,CAAC,EAAE,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,CAAC,QAAQ,IAAI,CAAC,SAAS,GAAG,OAAO,GAAG,SAAS,EAAE,iBAAiB,EAAE,UAAU,EAAE,aAAa,EAAE,MAAM,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAEC,IAAK,CAAC,aAAa,EAAE,EAAE,QAAQ,EAAE,CAAC,IAAI,KAAK,OAAO,IAAI,KAAK,QAAQ,GAAGD,GAAI,CAAC,UAAU,EAAE,EAAE,YAAY,EAAE,CAAC,CAAC,KAAK,CAAC,QAAQ,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,GAAG,IAAI,CAAC,EAAE,SAAS,IAAIC,IAAK,CAACC,QAAS,EAAE,EAAE,QAAQ,EAAE,CAACF,GAAI,CAAC,kBAAkB,EAAE,EAAE,YAAY,EAAE,CAAC,CAAC,WAAW,IAAI,CAAC,CAAC,KAAK,CAAC,QAAQ,EAAE,QAAQ,EAAEA,GAAI,CAAC,OAAO,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,EAAE,CAAC,EAAE,WAAW,IAAI,WAAW,KAAK,EAAE,GAAG,WAAW,GAAG,SAAS,CAAC,EAAE,CAAC,KAAK,KAAK,CAAC,QAAQ,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,EAAE;AAC1nB;;;;"}
|
|
@@ -1,11 +1,6 @@
|
|
|
1
|
-
|
|
1
|
+
import Button from './Button.js';
|
|
2
2
|
|
|
3
|
-
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
3
|
|
|
5
|
-
var Button = require('./Button.js');
|
|
6
4
|
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
exports.Button = Button.default;
|
|
10
|
-
exports.default = Button.default;
|
|
5
|
+
export { Button, Button as default };
|
|
11
6
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
|
|
@@ -1,24 +1,18 @@
|
|
|
1
|
-
|
|
1
|
+
import { __makeTemplateObject } from 'tslib';
|
|
2
|
+
import styled, { th } from '@xstyled/styled-components';
|
|
3
|
+
import Icon from '../Icon/Icon.js';
|
|
4
|
+
import 'react/jsx-runtime';
|
|
2
5
|
|
|
3
|
-
var
|
|
4
|
-
var styled =
|
|
5
|
-
var Icon = require('../Icon/Icon.js');
|
|
6
|
-
require('react/jsx-runtime');
|
|
7
|
-
|
|
8
|
-
function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
|
|
9
|
-
|
|
10
|
-
var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
|
|
11
|
-
|
|
12
|
-
var StyledWrapper = styled__default.default.span(templateObject_1 || (templateObject_1 = tslib.__makeTemplateObject(["\n display: flex;\n justify-content: center;\n align-items: center;\n"], ["\n display: flex;\n justify-content: center;\n align-items: center;\n"])));
|
|
13
|
-
var LoadingIconWrapper = styled__default.default.div(templateObject_2 || (templateObject_2 = tslib.__makeTemplateObject(["\n & svg {\n margin-right: ", ";\n }\n"], ["\n & svg {\n margin-right: ", ";\n }\n"])), function (_a) {
|
|
6
|
+
var StyledWrapper = styled.span(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n display: flex;\n justify-content: center;\n align-items: center;\n"], ["\n display: flex;\n justify-content: center;\n align-items: center;\n"])));
|
|
7
|
+
var LoadingIconWrapper = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n & svg {\n margin-right: ", ";\n }\n"], ["\n & svg {\n margin-right: ", ";\n }\n"])), function (_a) {
|
|
14
8
|
var $addMargin = _a.$addMargin;
|
|
15
9
|
return ($addMargin ? '0.5em' : '0');
|
|
16
10
|
});
|
|
17
|
-
var StyledIcon =
|
|
11
|
+
var StyledIcon = styled(Icon)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n & svg {\n height: 1em;\n margin-right: ", ";\n }\n"], ["\n & svg {\n height: 1em;\n margin-right: ", ";\n }\n"])), function (_a) {
|
|
18
12
|
var $addMargin = _a.$addMargin;
|
|
19
13
|
return ($addMargin ? '0.5em' : '0');
|
|
20
14
|
});
|
|
21
|
-
var StyledButton =
|
|
15
|
+
var StyledButton = styled.button(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n width: ", ";\n margin-top: ", ";\n margin-right: ", ";\n margin-bottom: ", ";\n margin-left: ", ";\n height: 2.5em;\n border: slim;\n text-align: center;\n text-decoration: none;\n display: ", ";\n flex-direction: ", ";\n align-items: ", ";\n font-family: ", ";\n font-weight: semiBold;\n border-radius: lg;\n cursor: pointer;\n transition-duration: 0.1s;\n align-items: center;\n justify-content: center;\n transition: all 300ms ease-out;\n pointer-events: ", ";\n opacity: ", ";\n\n :disabled {\n color: lightGray5;\n }\n\n :focus {\n outline: none;\n }\n\n &[data-appearance='primary'] {\n background-color: red1;\n color: white;\n border-color: red1;\n\n @media (hover: hover) {\n &:hover {\n background-color: white;\n color: red1;\n border-color: red1;\n }\n }\n\n :active {\n background-color: red1;\n color: red1;\n border: none;\n }\n\n :disabled {\n background-color: bgLightGray;\n border-color: lightGray5;\n color: gray3;\n }\n }\n\n &[data-appearance='primaryLight'] {\n color: red1;\n background-color: red20;\n border-color: red20;\n\n @media (hover: hover) {\n &:hover {\n background-color: red1;\n color: white;\n border-color: red1;\n }\n }\n\n :active {\n background-color: red1;\n color: white;\n border-color: red1;\n }\n\n :disabled {\n background-color: bgLightGray;\n border-color: lightGray5;\n color: gray3;\n }\n }\n\n &[data-appearance='success'] {\n background-color: successColor;\n color: white;\n border-color: successColor;\n\n @media (hover: hover) {\n &:hover {\n background-color: white;\n color: successColor;\n }\n }\n\n :active {\n background-color: white;\n color: successColor;\n }\n\n :disabled {\n background-color: bgLightGray;\n border-color: lightGray5;\n color: gray3;\n }\n }\n\n &[data-appearance='secondary'] {\n background-color: white;\n color: red1;\n border-color: red1;\n\n @media (hover: hover) {\n &:hover {\n background-color: red1;\n color: white;\n border-color: red1;\n }\n }\n\n :active {\n background-color: red1;\n color: red1;\n border-color: red1;\n }\n\n :disabled {\n background-color: white;\n border-color: lightGray7;\n }\n }\n\n &[data-appearance='secondaryLg'] {\n background-color: white;\n color: typoPrimary;\n border-color: blue2;\n\n @media (hover: hover) {\n &:hover {\n background-color: blue2;\n color: white;\n border-color: blue2;\n }\n }\n\n :active {\n background-color: gray;\n color: white;\n border: none;\n }\n\n :disabled {\n background-color: white;\n border-color: bgLightGray1;\n }\n }\n\n &[data-appearance='primaryLg'] {\n background-color: blue2;\n color: white;\n border-color: blue2;\n\n @media (hover: hover) {\n &:hover {\n background-color: white;\n color: typoPrimary;\n border-color: blue2;\n }\n }\n\n :active {\n background-color: gray;\n color: white;\n border: none;\n }\n\n :disabled {\n background-color: bgLightGray1;\n border-color: bgLightGray1;\n }\n }\n\n &[data-appearance='minimal'] {\n background-color: transparent;\n border: none !important;\n color: blue2;\n\n :disabled {\n color: blue2;\n }\n }\n\n &[data-appearance='minimalRed'] {\n background-color: transparent;\n border: none !important;\n color: red1;\n\n @media (hover: hover) {\n &:hover {\n color: red3;\n svg {\n fill: red3 !important;\n }\n }\n }\n \n :disabled,\n :active {\n color: red3;\n svg {\n fill: red3 !important;\n }\n }\n }\n\n &[data-sizing='icon'] {\n aspect-ratio: 4 / 3;\n padding: 0.5em 0.875em;\n }\n\n &[data-sizing='iconLg'] {\n min-width: 42px;\n min-height: 38px;\n padding: 0.5em 0.875em;\n svg {\n height: 16px;\n }\n }\n\n &[data-sizing='normal'] {\n min-width: 7rem;\n padding: 12px 18px;\n min-height: 38px;\n line-height: 14px;\n font-size: 14px;\n }\n\n &[data-sizing='large'] {\n min-width: 12rem;\n padding: 0.75em 1.5em;\n min-height: 34px;\n font-size: 12px;\n }\n\n &[data-sizing='grid'] {\n min-width: 5rem;\n padding: 0.5em 1.25em;\n font-size: 10px;\n border-radius: 5px;\n }\n"], ["\n width: ", ";\n margin-top: ", ";\n margin-right: ", ";\n margin-bottom: ", ";\n margin-left: ", ";\n height: 2.5em;\n border: slim;\n text-align: center;\n text-decoration: none;\n display: ", ";\n flex-direction: ", ";\n align-items: ", ";\n font-family: ", ";\n font-weight: semiBold;\n border-radius: lg;\n cursor: pointer;\n transition-duration: 0.1s;\n align-items: center;\n justify-content: center;\n transition: all 300ms ease-out;\n pointer-events: ", ";\n opacity: ", ";\n\n :disabled {\n color: lightGray5;\n }\n\n :focus {\n outline: none;\n }\n\n &[data-appearance='primary'] {\n background-color: red1;\n color: white;\n border-color: red1;\n\n @media (hover: hover) {\n &:hover {\n background-color: white;\n color: red1;\n border-color: red1;\n }\n }\n\n :active {\n background-color: red1;\n color: red1;\n border: none;\n }\n\n :disabled {\n background-color: bgLightGray;\n border-color: lightGray5;\n color: gray3;\n }\n }\n\n &[data-appearance='primaryLight'] {\n color: red1;\n background-color: red20;\n border-color: red20;\n\n @media (hover: hover) {\n &:hover {\n background-color: red1;\n color: white;\n border-color: red1;\n }\n }\n\n :active {\n background-color: red1;\n color: white;\n border-color: red1;\n }\n\n :disabled {\n background-color: bgLightGray;\n border-color: lightGray5;\n color: gray3;\n }\n }\n\n &[data-appearance='success'] {\n background-color: successColor;\n color: white;\n border-color: successColor;\n\n @media (hover: hover) {\n &:hover {\n background-color: white;\n color: successColor;\n }\n }\n\n :active {\n background-color: white;\n color: successColor;\n }\n\n :disabled {\n background-color: bgLightGray;\n border-color: lightGray5;\n color: gray3;\n }\n }\n\n &[data-appearance='secondary'] {\n background-color: white;\n color: red1;\n border-color: red1;\n\n @media (hover: hover) {\n &:hover {\n background-color: red1;\n color: white;\n border-color: red1;\n }\n }\n\n :active {\n background-color: red1;\n color: red1;\n border-color: red1;\n }\n\n :disabled {\n background-color: white;\n border-color: lightGray7;\n }\n }\n\n &[data-appearance='secondaryLg'] {\n background-color: white;\n color: typoPrimary;\n border-color: blue2;\n\n @media (hover: hover) {\n &:hover {\n background-color: blue2;\n color: white;\n border-color: blue2;\n }\n }\n\n :active {\n background-color: gray;\n color: white;\n border: none;\n }\n\n :disabled {\n background-color: white;\n border-color: bgLightGray1;\n }\n }\n\n &[data-appearance='primaryLg'] {\n background-color: blue2;\n color: white;\n border-color: blue2;\n\n @media (hover: hover) {\n &:hover {\n background-color: white;\n color: typoPrimary;\n border-color: blue2;\n }\n }\n\n :active {\n background-color: gray;\n color: white;\n border: none;\n }\n\n :disabled {\n background-color: bgLightGray1;\n border-color: bgLightGray1;\n }\n }\n\n &[data-appearance='minimal'] {\n background-color: transparent;\n border: none !important;\n color: blue2;\n\n :disabled {\n color: blue2;\n }\n }\n\n &[data-appearance='minimalRed'] {\n background-color: transparent;\n border: none !important;\n color: red1;\n\n @media (hover: hover) {\n &:hover {\n color: red3;\n svg {\n fill: red3 !important;\n }\n }\n }\n \n :disabled,\n :active {\n color: red3;\n svg {\n fill: red3 !important;\n }\n }\n }\n\n &[data-sizing='icon'] {\n aspect-ratio: 4 / 3;\n padding: 0.5em 0.875em;\n }\n\n &[data-sizing='iconLg'] {\n min-width: 42px;\n min-height: 38px;\n padding: 0.5em 0.875em;\n svg {\n height: 16px;\n }\n }\n\n &[data-sizing='normal'] {\n min-width: 7rem;\n padding: 12px 18px;\n min-height: 38px;\n line-height: 14px;\n font-size: 14px;\n }\n\n &[data-sizing='large'] {\n min-width: 12rem;\n padding: 0.75em 1.5em;\n min-height: 34px;\n font-size: 12px;\n }\n\n &[data-sizing='grid'] {\n min-width: 5rem;\n padding: 0.5em 1.25em;\n font-size: 10px;\n border-radius: 5px;\n }\n"])), function (_a) {
|
|
22
16
|
var fullWidth = _a.fullWidth;
|
|
23
17
|
return (fullWidth ? '100%' : 'initial');
|
|
24
18
|
}, function (_a) {
|
|
@@ -42,7 +36,7 @@ var StyledButton = styled__default.default.button(templateObject_4 || (templateO
|
|
|
42
36
|
}, function (_a) {
|
|
43
37
|
var columnAlign = _a.columnAlign;
|
|
44
38
|
return (columnAlign ? 'center' : 'auto');
|
|
45
|
-
},
|
|
39
|
+
}, th('fonts.primary'), function (_a) {
|
|
46
40
|
var disabled = _a.disabled;
|
|
47
41
|
return (disabled ? 'none' : 'auto');
|
|
48
42
|
}, function (_a) {
|
|
@@ -51,8 +45,5 @@ var StyledButton = styled__default.default.button(templateObject_4 || (templateO
|
|
|
51
45
|
});
|
|
52
46
|
var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
|
|
53
47
|
|
|
54
|
-
|
|
55
|
-
exports.StyledButton = StyledButton;
|
|
56
|
-
exports.StyledIcon = StyledIcon;
|
|
57
|
-
exports.StyledWrapper = StyledWrapper;
|
|
48
|
+
export { LoadingIconWrapper, StyledButton, StyledIcon, StyledWrapper };
|
|
58
49
|
//# sourceMappingURL=styles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.js","sources":["../../../../packages/ui/Elements/Button/styles.ts"],"sourcesContent":["import { __makeTemplateObject } from \"tslib\";\nimport { th } from '@xstyled/styled-components';\nimport styled from '@xstyled/styled-components';\nimport { Icon } from '../Icon';\nexport var StyledWrapper = styled.span(templateObject_1 || (templateObject_1 = __makeTemplateObject([\"\\n display: flex;\\n justify-content: center;\\n align-items: center;\\n\"], [\"\\n display: flex;\\n justify-content: center;\\n align-items: center;\\n\"])));\nexport var LoadingIconWrapper = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject([\"\\n & svg {\\n margin-right: \", \";\\n }\\n\"], [\"\\n & svg {\\n margin-right: \", \";\\n }\\n\"])), function (_a) {\n var $addMargin = _a.$addMargin;\n return ($addMargin ? '0.5em' : '0');\n});\nexport var StyledIcon = styled(Icon)(templateObject_3 || (templateObject_3 = __makeTemplateObject([\"\\n & svg {\\n height: 1em;\\n margin-right: \", \";\\n }\\n\"], [\"\\n & svg {\\n height: 1em;\\n margin-right: \", \";\\n }\\n\"])), function (_a) {\n var $addMargin = _a.$addMargin;\n return ($addMargin ? '0.5em' : '0');\n});\nexport var StyledButton = styled.button(templateObject_4 || (templateObject_4 = __makeTemplateObject([\"\\n width: \", \";\\n margin-top: \", \";\\n margin-right: \", \";\\n margin-bottom: \", \";\\n margin-left: \", \";\\n height: 2.5em;\\n border: slim;\\n text-align: center;\\n text-decoration: none;\\n display: \", \";\\n flex-direction: \", \";\\n align-items: \", \";\\n font-family: \", \";\\n font-weight: semiBold;\\n border-radius: lg;\\n cursor: pointer;\\n transition-duration: 0.1s;\\n align-items: center;\\n justify-content: center;\\n transition: all 300ms ease-out;\\n pointer-events: \", \";\\n opacity: \", \";\\n\\n :disabled {\\n color: lightGray5;\\n }\\n\\n :focus {\\n outline: none;\\n }\\n\\n &[data-appearance='primary'] {\\n background-color: red1;\\n color: white;\\n border-color: red1;\\n\\n @media (hover: hover) {\\n &:hover {\\n background-color: white;\\n color: red1;\\n border-color: red1;\\n }\\n }\\n\\n :active {\\n background-color: red1;\\n color: red1;\\n border: none;\\n }\\n\\n :disabled {\\n background-color: bgLightGray;\\n border-color: lightGray5;\\n color: gray3;\\n }\\n }\\n\\n &[data-appearance='primaryLight'] {\\n color: red1;\\n background-color: red20;\\n border-color: red20;\\n\\n @media (hover: hover) {\\n &:hover {\\n background-color: red1;\\n color: white;\\n border-color: red1;\\n }\\n }\\n\\n :active {\\n background-color: red1;\\n color: white;\\n border-color: red1;\\n }\\n\\n :disabled {\\n background-color: bgLightGray;\\n border-color: lightGray5;\\n color: gray3;\\n }\\n }\\n\\n &[data-appearance='success'] {\\n background-color: successColor;\\n color: white;\\n border-color: successColor;\\n\\n @media (hover: hover) {\\n &:hover {\\n background-color: white;\\n color: successColor;\\n }\\n }\\n\\n :active {\\n background-color: white;\\n color: successColor;\\n }\\n\\n :disabled {\\n background-color: bgLightGray;\\n border-color: lightGray5;\\n color: gray3;\\n }\\n }\\n\\n &[data-appearance='secondary'] {\\n background-color: white;\\n color: red1;\\n border-color: red1;\\n\\n @media (hover: hover) {\\n &:hover {\\n background-color: red1;\\n color: white;\\n border-color: red1;\\n }\\n }\\n\\n :active {\\n background-color: red1;\\n color: red1;\\n border-color: red1;\\n }\\n\\n :disabled {\\n background-color: white;\\n border-color: lightGray7;\\n }\\n }\\n\\n &[data-appearance='secondaryLg'] {\\n background-color: white;\\n color: typoPrimary;\\n border-color: blue2;\\n\\n @media (hover: hover) {\\n &:hover {\\n background-color: blue2;\\n color: white;\\n border-color: blue2;\\n }\\n }\\n\\n :active {\\n background-color: gray;\\n color: white;\\n border: none;\\n }\\n\\n :disabled {\\n background-color: white;\\n border-color: bgLightGray1;\\n }\\n }\\n\\n &[data-appearance='primaryLg'] {\\n background-color: blue2;\\n color: white;\\n border-color: blue2;\\n\\n @media (hover: hover) {\\n &:hover {\\n background-color: white;\\n color: typoPrimary;\\n border-color: blue2;\\n }\\n }\\n\\n :active {\\n background-color: gray;\\n color: white;\\n border: none;\\n }\\n\\n :disabled {\\n background-color: bgLightGray1;\\n border-color: bgLightGray1;\\n }\\n }\\n\\n &[data-appearance='minimal'] {\\n background-color: transparent;\\n border: none !important;\\n color: blue2;\\n\\n :disabled {\\n color: blue2;\\n }\\n }\\n\\n &[data-appearance='minimalRed'] {\\n background-color: transparent;\\n border: none !important;\\n color: red1;\\n\\n @media (hover: hover) {\\n &:hover {\\n color: red3;\\n svg {\\n fill: red3 !important;\\n }\\n }\\n }\\n \\n :disabled,\\n :active {\\n color: red3;\\n svg {\\n fill: red3 !important;\\n }\\n }\\n }\\n\\n &[data-sizing='icon'] {\\n aspect-ratio: 4 / 3;\\n padding: 0.5em 0.875em;\\n }\\n\\n &[data-sizing='iconLg'] {\\n min-width: 42px;\\n min-height: 38px;\\n padding: 0.5em 0.875em;\\n svg {\\n height: 16px;\\n }\\n }\\n\\n &[data-sizing='normal'] {\\n min-width: 7rem;\\n padding: 12px 18px;\\n min-height: 38px;\\n line-height: 14px;\\n font-size: 14px;\\n }\\n\\n &[data-sizing='large'] {\\n min-width: 12rem;\\n padding: 0.75em 1.5em;\\n min-height: 34px;\\n font-size: 12px;\\n }\\n\\n &[data-sizing='grid'] {\\n min-width: 5rem;\\n padding: 0.5em 1.25em;\\n font-size: 10px;\\n border-radius: 5px;\\n }\\n\"], [\"\\n width: \", \";\\n margin-top: \", \";\\n margin-right: \", \";\\n margin-bottom: \", \";\\n margin-left: \", \";\\n height: 2.5em;\\n border: slim;\\n text-align: center;\\n text-decoration: none;\\n display: \", \";\\n flex-direction: \", \";\\n align-items: \", \";\\n font-family: \", \";\\n font-weight: semiBold;\\n border-radius: lg;\\n cursor: pointer;\\n transition-duration: 0.1s;\\n align-items: center;\\n justify-content: center;\\n transition: all 300ms ease-out;\\n pointer-events: \", \";\\n opacity: \", \";\\n\\n :disabled {\\n color: lightGray5;\\n }\\n\\n :focus {\\n outline: none;\\n }\\n\\n &[data-appearance='primary'] {\\n background-color: red1;\\n color: white;\\n border-color: red1;\\n\\n @media (hover: hover) {\\n &:hover {\\n background-color: white;\\n color: red1;\\n border-color: red1;\\n }\\n }\\n\\n :active {\\n background-color: red1;\\n color: red1;\\n border: none;\\n }\\n\\n :disabled {\\n background-color: bgLightGray;\\n border-color: lightGray5;\\n color: gray3;\\n }\\n }\\n\\n &[data-appearance='primaryLight'] {\\n color: red1;\\n background-color: red20;\\n border-color: red20;\\n\\n @media (hover: hover) {\\n &:hover {\\n background-color: red1;\\n color: white;\\n border-color: red1;\\n }\\n }\\n\\n :active {\\n background-color: red1;\\n color: white;\\n border-color: red1;\\n }\\n\\n :disabled {\\n background-color: bgLightGray;\\n border-color: lightGray5;\\n color: gray3;\\n }\\n }\\n\\n &[data-appearance='success'] {\\n background-color: successColor;\\n color: white;\\n border-color: successColor;\\n\\n @media (hover: hover) {\\n &:hover {\\n background-color: white;\\n color: successColor;\\n }\\n }\\n\\n :active {\\n background-color: white;\\n color: successColor;\\n }\\n\\n :disabled {\\n background-color: bgLightGray;\\n border-color: lightGray5;\\n color: gray3;\\n }\\n }\\n\\n &[data-appearance='secondary'] {\\n background-color: white;\\n color: red1;\\n border-color: red1;\\n\\n @media (hover: hover) {\\n &:hover {\\n background-color: red1;\\n color: white;\\n border-color: red1;\\n }\\n }\\n\\n :active {\\n background-color: red1;\\n color: red1;\\n border-color: red1;\\n }\\n\\n :disabled {\\n background-color: white;\\n border-color: lightGray7;\\n }\\n }\\n\\n &[data-appearance='secondaryLg'] {\\n background-color: white;\\n color: typoPrimary;\\n border-color: blue2;\\n\\n @media (hover: hover) {\\n &:hover {\\n background-color: blue2;\\n color: white;\\n border-color: blue2;\\n }\\n }\\n\\n :active {\\n background-color: gray;\\n color: white;\\n border: none;\\n }\\n\\n :disabled {\\n background-color: white;\\n border-color: bgLightGray1;\\n }\\n }\\n\\n &[data-appearance='primaryLg'] {\\n background-color: blue2;\\n color: white;\\n border-color: blue2;\\n\\n @media (hover: hover) {\\n &:hover {\\n background-color: white;\\n color: typoPrimary;\\n border-color: blue2;\\n }\\n }\\n\\n :active {\\n background-color: gray;\\n color: white;\\n border: none;\\n }\\n\\n :disabled {\\n background-color: bgLightGray1;\\n border-color: bgLightGray1;\\n }\\n }\\n\\n &[data-appearance='minimal'] {\\n background-color: transparent;\\n border: none !important;\\n color: blue2;\\n\\n :disabled {\\n color: blue2;\\n }\\n }\\n\\n &[data-appearance='minimalRed'] {\\n background-color: transparent;\\n border: none !important;\\n color: red1;\\n\\n @media (hover: hover) {\\n &:hover {\\n color: red3;\\n svg {\\n fill: red3 !important;\\n }\\n }\\n }\\n \\n :disabled,\\n :active {\\n color: red3;\\n svg {\\n fill: red3 !important;\\n }\\n }\\n }\\n\\n &[data-sizing='icon'] {\\n aspect-ratio: 4 / 3;\\n padding: 0.5em 0.875em;\\n }\\n\\n &[data-sizing='iconLg'] {\\n min-width: 42px;\\n min-height: 38px;\\n padding: 0.5em 0.875em;\\n svg {\\n height: 16px;\\n }\\n }\\n\\n &[data-sizing='normal'] {\\n min-width: 7rem;\\n padding: 12px 18px;\\n min-height: 38px;\\n line-height: 14px;\\n font-size: 14px;\\n }\\n\\n &[data-sizing='large'] {\\n min-width: 12rem;\\n padding: 0.75em 1.5em;\\n min-height: 34px;\\n font-size: 12px;\\n }\\n\\n &[data-sizing='grid'] {\\n min-width: 5rem;\\n padding: 0.5em 1.25em;\\n font-size: 10px;\\n border-radius: 5px;\\n }\\n\"])), function (_a) {\n var fullWidth = _a.fullWidth;\n return (fullWidth ? '100%' : 'initial');\n}, function (_a) {\n var mt = _a.mt;\n return (mt ? mt : 0);\n}, function (_a) {\n var mr = _a.mr;\n return (mr ? mr : 0);\n}, function (_a) {\n var mb = _a.mb;\n return (mb ? mb : 0);\n}, function (_a) {\n var ml = _a.ml;\n return (ml ? ml : 0);\n}, function (_a) {\n var columnAlign = _a.columnAlign;\n return (columnAlign ? 'flex' : 'inline-flex');\n}, function (_a) {\n var columnAlign = _a.columnAlign;\n return (columnAlign ? 'column' : 'auto');\n}, function (_a) {\n var columnAlign = _a.columnAlign;\n return (columnAlign ? 'center' : 'auto');\n}, th('fonts.primary'), function (_a) {\n var disabled = _a.disabled;\n return (disabled ? 'none' : 'auto');\n}, function (_a) {\n var disabled = _a.disabled;\n return (disabled ? '0.6' : '1');\n});\nvar templateObject_1, templateObject_2, templateObject_3, templateObject_4;\n//# sourceMappingURL=styles.js.map"],"names":["styled","__makeTemplateObject","Icon","th"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"styles.js","sources":["../../../../packages/ui/Elements/Button/styles.ts"],"sourcesContent":["import { __makeTemplateObject } from \"tslib\";\nimport { th } from '@xstyled/styled-components';\nimport styled from '@xstyled/styled-components';\nimport { Icon } from '../Icon';\nexport var StyledWrapper = styled.span(templateObject_1 || (templateObject_1 = __makeTemplateObject([\"\\n display: flex;\\n justify-content: center;\\n align-items: center;\\n\"], [\"\\n display: flex;\\n justify-content: center;\\n align-items: center;\\n\"])));\nexport var LoadingIconWrapper = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject([\"\\n & svg {\\n margin-right: \", \";\\n }\\n\"], [\"\\n & svg {\\n margin-right: \", \";\\n }\\n\"])), function (_a) {\n var $addMargin = _a.$addMargin;\n return ($addMargin ? '0.5em' : '0');\n});\nexport var StyledIcon = styled(Icon)(templateObject_3 || (templateObject_3 = __makeTemplateObject([\"\\n & svg {\\n height: 1em;\\n margin-right: \", \";\\n }\\n\"], [\"\\n & svg {\\n height: 1em;\\n margin-right: \", \";\\n }\\n\"])), function (_a) {\n var $addMargin = _a.$addMargin;\n return ($addMargin ? '0.5em' : '0');\n});\nexport var StyledButton = styled.button(templateObject_4 || (templateObject_4 = __makeTemplateObject([\"\\n width: \", \";\\n margin-top: \", \";\\n margin-right: \", \";\\n margin-bottom: \", \";\\n margin-left: \", \";\\n height: 2.5em;\\n border: slim;\\n text-align: center;\\n text-decoration: none;\\n display: \", \";\\n flex-direction: \", \";\\n align-items: \", \";\\n font-family: \", \";\\n font-weight: semiBold;\\n border-radius: lg;\\n cursor: pointer;\\n transition-duration: 0.1s;\\n align-items: center;\\n justify-content: center;\\n transition: all 300ms ease-out;\\n pointer-events: \", \";\\n opacity: \", \";\\n\\n :disabled {\\n color: lightGray5;\\n }\\n\\n :focus {\\n outline: none;\\n }\\n\\n &[data-appearance='primary'] {\\n background-color: red1;\\n color: white;\\n border-color: red1;\\n\\n @media (hover: hover) {\\n &:hover {\\n background-color: white;\\n color: red1;\\n border-color: red1;\\n }\\n }\\n\\n :active {\\n background-color: red1;\\n color: red1;\\n border: none;\\n }\\n\\n :disabled {\\n background-color: bgLightGray;\\n border-color: lightGray5;\\n color: gray3;\\n }\\n }\\n\\n &[data-appearance='primaryLight'] {\\n color: red1;\\n background-color: red20;\\n border-color: red20;\\n\\n @media (hover: hover) {\\n &:hover {\\n background-color: red1;\\n color: white;\\n border-color: red1;\\n }\\n }\\n\\n :active {\\n background-color: red1;\\n color: white;\\n border-color: red1;\\n }\\n\\n :disabled {\\n background-color: bgLightGray;\\n border-color: lightGray5;\\n color: gray3;\\n }\\n }\\n\\n &[data-appearance='success'] {\\n background-color: successColor;\\n color: white;\\n border-color: successColor;\\n\\n @media (hover: hover) {\\n &:hover {\\n background-color: white;\\n color: successColor;\\n }\\n }\\n\\n :active {\\n background-color: white;\\n color: successColor;\\n }\\n\\n :disabled {\\n background-color: bgLightGray;\\n border-color: lightGray5;\\n color: gray3;\\n }\\n }\\n\\n &[data-appearance='secondary'] {\\n background-color: white;\\n color: red1;\\n border-color: red1;\\n\\n @media (hover: hover) {\\n &:hover {\\n background-color: red1;\\n color: white;\\n border-color: red1;\\n }\\n }\\n\\n :active {\\n background-color: red1;\\n color: red1;\\n border-color: red1;\\n }\\n\\n :disabled {\\n background-color: white;\\n border-color: lightGray7;\\n }\\n }\\n\\n &[data-appearance='secondaryLg'] {\\n background-color: white;\\n color: typoPrimary;\\n border-color: blue2;\\n\\n @media (hover: hover) {\\n &:hover {\\n background-color: blue2;\\n color: white;\\n border-color: blue2;\\n }\\n }\\n\\n :active {\\n background-color: gray;\\n color: white;\\n border: none;\\n }\\n\\n :disabled {\\n background-color: white;\\n border-color: bgLightGray1;\\n }\\n }\\n\\n &[data-appearance='primaryLg'] {\\n background-color: blue2;\\n color: white;\\n border-color: blue2;\\n\\n @media (hover: hover) {\\n &:hover {\\n background-color: white;\\n color: typoPrimary;\\n border-color: blue2;\\n }\\n }\\n\\n :active {\\n background-color: gray;\\n color: white;\\n border: none;\\n }\\n\\n :disabled {\\n background-color: bgLightGray1;\\n border-color: bgLightGray1;\\n }\\n }\\n\\n &[data-appearance='minimal'] {\\n background-color: transparent;\\n border: none !important;\\n color: blue2;\\n\\n :disabled {\\n color: blue2;\\n }\\n }\\n\\n &[data-appearance='minimalRed'] {\\n background-color: transparent;\\n border: none !important;\\n color: red1;\\n\\n @media (hover: hover) {\\n &:hover {\\n color: red3;\\n svg {\\n fill: red3 !important;\\n }\\n }\\n }\\n \\n :disabled,\\n :active {\\n color: red3;\\n svg {\\n fill: red3 !important;\\n }\\n }\\n }\\n\\n &[data-sizing='icon'] {\\n aspect-ratio: 4 / 3;\\n padding: 0.5em 0.875em;\\n }\\n\\n &[data-sizing='iconLg'] {\\n min-width: 42px;\\n min-height: 38px;\\n padding: 0.5em 0.875em;\\n svg {\\n height: 16px;\\n }\\n }\\n\\n &[data-sizing='normal'] {\\n min-width: 7rem;\\n padding: 12px 18px;\\n min-height: 38px;\\n line-height: 14px;\\n font-size: 14px;\\n }\\n\\n &[data-sizing='large'] {\\n min-width: 12rem;\\n padding: 0.75em 1.5em;\\n min-height: 34px;\\n font-size: 12px;\\n }\\n\\n &[data-sizing='grid'] {\\n min-width: 5rem;\\n padding: 0.5em 1.25em;\\n font-size: 10px;\\n border-radius: 5px;\\n }\\n\"], [\"\\n width: \", \";\\n margin-top: \", \";\\n margin-right: \", \";\\n margin-bottom: \", \";\\n margin-left: \", \";\\n height: 2.5em;\\n border: slim;\\n text-align: center;\\n text-decoration: none;\\n display: \", \";\\n flex-direction: \", \";\\n align-items: \", \";\\n font-family: \", \";\\n font-weight: semiBold;\\n border-radius: lg;\\n cursor: pointer;\\n transition-duration: 0.1s;\\n align-items: center;\\n justify-content: center;\\n transition: all 300ms ease-out;\\n pointer-events: \", \";\\n opacity: \", \";\\n\\n :disabled {\\n color: lightGray5;\\n }\\n\\n :focus {\\n outline: none;\\n }\\n\\n &[data-appearance='primary'] {\\n background-color: red1;\\n color: white;\\n border-color: red1;\\n\\n @media (hover: hover) {\\n &:hover {\\n background-color: white;\\n color: red1;\\n border-color: red1;\\n }\\n }\\n\\n :active {\\n background-color: red1;\\n color: red1;\\n border: none;\\n }\\n\\n :disabled {\\n background-color: bgLightGray;\\n border-color: lightGray5;\\n color: gray3;\\n }\\n }\\n\\n &[data-appearance='primaryLight'] {\\n color: red1;\\n background-color: red20;\\n border-color: red20;\\n\\n @media (hover: hover) {\\n &:hover {\\n background-color: red1;\\n color: white;\\n border-color: red1;\\n }\\n }\\n\\n :active {\\n background-color: red1;\\n color: white;\\n border-color: red1;\\n }\\n\\n :disabled {\\n background-color: bgLightGray;\\n border-color: lightGray5;\\n color: gray3;\\n }\\n }\\n\\n &[data-appearance='success'] {\\n background-color: successColor;\\n color: white;\\n border-color: successColor;\\n\\n @media (hover: hover) {\\n &:hover {\\n background-color: white;\\n color: successColor;\\n }\\n }\\n\\n :active {\\n background-color: white;\\n color: successColor;\\n }\\n\\n :disabled {\\n background-color: bgLightGray;\\n border-color: lightGray5;\\n color: gray3;\\n }\\n }\\n\\n &[data-appearance='secondary'] {\\n background-color: white;\\n color: red1;\\n border-color: red1;\\n\\n @media (hover: hover) {\\n &:hover {\\n background-color: red1;\\n color: white;\\n border-color: red1;\\n }\\n }\\n\\n :active {\\n background-color: red1;\\n color: red1;\\n border-color: red1;\\n }\\n\\n :disabled {\\n background-color: white;\\n border-color: lightGray7;\\n }\\n }\\n\\n &[data-appearance='secondaryLg'] {\\n background-color: white;\\n color: typoPrimary;\\n border-color: blue2;\\n\\n @media (hover: hover) {\\n &:hover {\\n background-color: blue2;\\n color: white;\\n border-color: blue2;\\n }\\n }\\n\\n :active {\\n background-color: gray;\\n color: white;\\n border: none;\\n }\\n\\n :disabled {\\n background-color: white;\\n border-color: bgLightGray1;\\n }\\n }\\n\\n &[data-appearance='primaryLg'] {\\n background-color: blue2;\\n color: white;\\n border-color: blue2;\\n\\n @media (hover: hover) {\\n &:hover {\\n background-color: white;\\n color: typoPrimary;\\n border-color: blue2;\\n }\\n }\\n\\n :active {\\n background-color: gray;\\n color: white;\\n border: none;\\n }\\n\\n :disabled {\\n background-color: bgLightGray1;\\n border-color: bgLightGray1;\\n }\\n }\\n\\n &[data-appearance='minimal'] {\\n background-color: transparent;\\n border: none !important;\\n color: blue2;\\n\\n :disabled {\\n color: blue2;\\n }\\n }\\n\\n &[data-appearance='minimalRed'] {\\n background-color: transparent;\\n border: none !important;\\n color: red1;\\n\\n @media (hover: hover) {\\n &:hover {\\n color: red3;\\n svg {\\n fill: red3 !important;\\n }\\n }\\n }\\n \\n :disabled,\\n :active {\\n color: red3;\\n svg {\\n fill: red3 !important;\\n }\\n }\\n }\\n\\n &[data-sizing='icon'] {\\n aspect-ratio: 4 / 3;\\n padding: 0.5em 0.875em;\\n }\\n\\n &[data-sizing='iconLg'] {\\n min-width: 42px;\\n min-height: 38px;\\n padding: 0.5em 0.875em;\\n svg {\\n height: 16px;\\n }\\n }\\n\\n &[data-sizing='normal'] {\\n min-width: 7rem;\\n padding: 12px 18px;\\n min-height: 38px;\\n line-height: 14px;\\n font-size: 14px;\\n }\\n\\n &[data-sizing='large'] {\\n min-width: 12rem;\\n padding: 0.75em 1.5em;\\n min-height: 34px;\\n font-size: 12px;\\n }\\n\\n &[data-sizing='grid'] {\\n min-width: 5rem;\\n padding: 0.5em 1.25em;\\n font-size: 10px;\\n border-radius: 5px;\\n }\\n\"])), function (_a) {\n var fullWidth = _a.fullWidth;\n return (fullWidth ? '100%' : 'initial');\n}, function (_a) {\n var mt = _a.mt;\n return (mt ? mt : 0);\n}, function (_a) {\n var mr = _a.mr;\n return (mr ? mr : 0);\n}, function (_a) {\n var mb = _a.mb;\n return (mb ? mb : 0);\n}, function (_a) {\n var ml = _a.ml;\n return (ml ? ml : 0);\n}, function (_a) {\n var columnAlign = _a.columnAlign;\n return (columnAlign ? 'flex' : 'inline-flex');\n}, function (_a) {\n var columnAlign = _a.columnAlign;\n return (columnAlign ? 'column' : 'auto');\n}, function (_a) {\n var columnAlign = _a.columnAlign;\n return (columnAlign ? 'center' : 'auto');\n}, th('fonts.primary'), function (_a) {\n var disabled = _a.disabled;\n return (disabled ? 'none' : 'auto');\n}, function (_a) {\n var disabled = _a.disabled;\n return (disabled ? '0.6' : '1');\n});\nvar templateObject_1, templateObject_2, templateObject_3, templateObject_4;\n//# sourceMappingURL=styles.js.map"],"names":[],"mappings":"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"}
|
package/ui/Elements/Card/Card.js
CHANGED
|
@@ -1,33 +1,26 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
var tslib = require('tslib');
|
|
6
|
-
var jsxRuntime = require('react/jsx-runtime');
|
|
7
|
-
var styled = require('@xstyled/styled-components');
|
|
8
|
-
var styles = require('./styles.js');
|
|
1
|
+
import { __rest, __assign } from 'tslib';
|
|
2
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
3
|
+
import { useTheme, th } from '@xstyled/styled-components';
|
|
4
|
+
import { StyledBody, ImageWrapper, StyledImage, CardWrapper, StyledCard } from './styles.js';
|
|
9
5
|
|
|
10
6
|
var Card = function (_a) {
|
|
11
|
-
var children = _a.children, block = _a.block, _b = _a.hasBorder, hasBorder = _b === void 0 ? true : _b, backgroundColor = _a.backgroundColor, rest =
|
|
12
|
-
return (
|
|
7
|
+
var children = _a.children, block = _a.block, _b = _a.hasBorder, hasBorder = _b === void 0 ? true : _b, backgroundColor = _a.backgroundColor, rest = __rest(_a, ["children", "block", "hasBorder", "backgroundColor"]);
|
|
8
|
+
return (jsx(CardWrapper, { block: block, children: jsx(StyledCard, __assign({ block: block, hasBorder: hasBorder, backgroundColor: backgroundColor }, rest, { children: children })) }));
|
|
13
9
|
};
|
|
14
10
|
var CardBody = function (_a) {
|
|
15
|
-
var children = _a.children, rest =
|
|
16
|
-
return
|
|
11
|
+
var children = _a.children, rest = __rest(_a, ["children"]);
|
|
12
|
+
return jsx(StyledBody, __assign({}, rest, { children: children }));
|
|
17
13
|
};
|
|
18
14
|
var CardImage = function (_a) {
|
|
19
|
-
var children = _a.children, _b = _a.color, color = _b === void 0 ? 'white' : _b, rest =
|
|
20
|
-
var theme =
|
|
21
|
-
var themeColor =
|
|
22
|
-
return (
|
|
15
|
+
var children = _a.children, _b = _a.color, color = _b === void 0 ? 'white' : _b, rest = __rest(_a, ["children", "color"]);
|
|
16
|
+
var theme = useTheme();
|
|
17
|
+
var themeColor = th.color(color)({ theme: theme });
|
|
18
|
+
return (jsx(ImageWrapper, { color: themeColor, children: jsx(StyledImage, __assign({}, rest, { children: children })) }));
|
|
23
19
|
};
|
|
24
20
|
var CardComponent = function (_a) {
|
|
25
21
|
var img = _a.img, body = _a.body, children = _a.children, color = _a.color;
|
|
26
|
-
return (
|
|
22
|
+
return (jsxs(Card, { children: [img && (jsx(CardImage, { color: color, children: jsx("img", { src: img, width: "300" }) })), jsxs(CardBody, { children: [body, children] })] }));
|
|
27
23
|
};
|
|
28
24
|
|
|
29
|
-
|
|
30
|
-
exports.CardBody = CardBody;
|
|
31
|
-
exports.CardImage = CardImage;
|
|
32
|
-
exports.default = CardComponent;
|
|
25
|
+
export { Card, CardBody, CardImage, CardComponent as default };
|
|
33
26
|
//# sourceMappingURL=Card.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Card.js","sources":["../../../../packages/ui/Elements/Card/Card.tsx"],"sourcesContent":["import { __assign, __rest } from \"tslib\";\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport { th } from '@xstyled/styled-components';\nimport { useTheme } from '@xstyled/styled-components';\nimport { StyledCard, CardWrapper, StyledBody, ImageWrapper, StyledImage } from './styles';\nexport var Card = function (_a) {\n var children = _a.children, block = _a.block, _b = _a.hasBorder, hasBorder = _b === void 0 ? true : _b, backgroundColor = _a.backgroundColor, rest = __rest(_a, [\"children\", \"block\", \"hasBorder\", \"backgroundColor\"]);\n return (_jsx(CardWrapper, { block: block, children: _jsx(StyledCard, __assign({ block: block, hasBorder: hasBorder, backgroundColor: backgroundColor }, rest, { children: children })) }));\n};\nexport var CardBody = function (_a) {\n var children = _a.children, rest = __rest(_a, [\"children\"]);\n return _jsx(StyledBody, __assign({}, rest, { children: children }));\n};\nexport var CardImage = function (_a) {\n var children = _a.children, _b = _a.color, color = _b === void 0 ? 'white' : _b, rest = __rest(_a, [\"children\", \"color\"]);\n var theme = useTheme();\n var themeColor = th.color(color)({ theme: theme });\n return (_jsx(ImageWrapper, { color: themeColor, children: _jsx(StyledImage, __assign({}, rest, { children: children })) }));\n};\nvar CardComponent = function (_a) {\n var img = _a.img, body = _a.body, children = _a.children, color = _a.color;\n return (_jsxs(Card, { children: [img && (_jsx(CardImage, { color: color, children: _jsx(\"img\", { src: img, width: \"300\" }) })), _jsxs(CardBody, { children: [body, children] })] }));\n};\nexport default CardComponent;\n//# sourceMappingURL=Card.js.map"],"names":["
|
|
1
|
+
{"version":3,"file":"Card.js","sources":["../../../../packages/ui/Elements/Card/Card.tsx"],"sourcesContent":["import { __assign, __rest } from \"tslib\";\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport { th } from '@xstyled/styled-components';\nimport { useTheme } from '@xstyled/styled-components';\nimport { StyledCard, CardWrapper, StyledBody, ImageWrapper, StyledImage } from './styles';\nexport var Card = function (_a) {\n var children = _a.children, block = _a.block, _b = _a.hasBorder, hasBorder = _b === void 0 ? true : _b, backgroundColor = _a.backgroundColor, rest = __rest(_a, [\"children\", \"block\", \"hasBorder\", \"backgroundColor\"]);\n return (_jsx(CardWrapper, { block: block, children: _jsx(StyledCard, __assign({ block: block, hasBorder: hasBorder, backgroundColor: backgroundColor }, rest, { children: children })) }));\n};\nexport var CardBody = function (_a) {\n var children = _a.children, rest = __rest(_a, [\"children\"]);\n return _jsx(StyledBody, __assign({}, rest, { children: children }));\n};\nexport var CardImage = function (_a) {\n var children = _a.children, _b = _a.color, color = _b === void 0 ? 'white' : _b, rest = __rest(_a, [\"children\", \"color\"]);\n var theme = useTheme();\n var themeColor = th.color(color)({ theme: theme });\n return (_jsx(ImageWrapper, { color: themeColor, children: _jsx(StyledImage, __assign({}, rest, { children: children })) }));\n};\nvar CardComponent = function (_a) {\n var img = _a.img, body = _a.body, children = _a.children, color = _a.color;\n return (_jsxs(Card, { children: [img && (_jsx(CardImage, { color: color, children: _jsx(\"img\", { src: img, width: \"300\" }) })), _jsxs(CardBody, { children: [body, children] })] }));\n};\nexport default CardComponent;\n//# sourceMappingURL=Card.js.map"],"names":["_jsx","_jsxs"],"mappings":";;;;;AAKU,IAAC,IAAI,GAAG,UAAU,EAAE,EAAE;AAChC,IAAI,IAAI,QAAQ,GAAG,EAAE,CAAC,QAAQ,EAAE,KAAK,GAAG,EAAE,CAAC,KAAK,EAAE,EAAE,GAAG,EAAE,CAAC,SAAS,EAAE,SAAS,GAAG,EAAE,KAAK,KAAK,CAAC,GAAG,IAAI,GAAG,EAAE,EAAE,eAAe,GAAG,EAAE,CAAC,eAAe,EAAE,IAAI,GAAG,MAAM,CAAC,EAAE,EAAE,CAAC,UAAU,EAAE,OAAO,EAAE,WAAW,EAAE,iBAAiB,CAAC,CAAC,CAAC;AAC3N,IAAI,QAAQA,GAAI,CAAC,WAAW,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAEA,GAAI,CAAC,UAAU,EAAE,QAAQ,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,eAAe,EAAE,eAAe,EAAE,EAAE,IAAI,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE;AAC/L,EAAE;AACQ,IAAC,QAAQ,GAAG,UAAU,EAAE,EAAE;AACpC,IAAI,IAAI,QAAQ,GAAG,EAAE,CAAC,QAAQ,EAAE,IAAI,GAAG,MAAM,CAAC,EAAE,EAAE,CAAC,UAAU,CAAC,CAAC,CAAC;AAChE,IAAI,OAAOA,GAAI,CAAC,UAAU,EAAE,QAAQ,CAAC,EAAE,EAAE,IAAI,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,CAAC,CAAC,CAAC;AACxE,EAAE;AACQ,IAAC,SAAS,GAAG,UAAU,EAAE,EAAE;AACrC,IAAI,IAAI,QAAQ,GAAG,EAAE,CAAC,QAAQ,EAAE,EAAE,GAAG,EAAE,CAAC,KAAK,EAAE,KAAK,GAAG,EAAE,KAAK,KAAK,CAAC,GAAG,OAAO,GAAG,EAAE,EAAE,IAAI,GAAG,MAAM,CAAC,EAAE,EAAE,CAAC,UAAU,EAAE,OAAO,CAAC,CAAC,CAAC;AAC9H,IAAI,IAAI,KAAK,GAAG,QAAQ,EAAE,CAAC;AAC3B,IAAI,IAAI,UAAU,GAAG,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,CAAC;AACvD,IAAI,QAAQA,GAAI,CAAC,YAAY,EAAE,EAAE,KAAK,EAAE,UAAU,EAAE,QAAQ,EAAEA,GAAI,CAAC,WAAW,EAAE,QAAQ,CAAC,EAAE,EAAE,IAAI,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE;AAChI,EAAE;AACC,IAAC,aAAa,GAAG,UAAU,EAAE,EAAE;AAClC,IAAI,IAAI,GAAG,GAAG,EAAE,CAAC,GAAG,EAAE,IAAI,GAAG,EAAE,CAAC,IAAI,EAAE,QAAQ,GAAG,EAAE,CAAC,QAAQ,EAAE,KAAK,GAAG,EAAE,CAAC,KAAK,CAAC;AAC/E,IAAI,QAAQC,IAAK,CAAC,IAAI,EAAE,EAAE,QAAQ,EAAE,CAAC,GAAG,KAAKD,GAAI,CAAC,SAAS,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAEA,GAAI,CAAC,KAAK,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,EAAE,CAAC,CAAC,EAAEC,IAAK,CAAC,QAAQ,EAAE,EAAE,QAAQ,EAAE,CAAC,IAAI,EAAE,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE;AACzL;;;;"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
|
-
import
|
|
2
|
-
export { CardBody, CardImage } from './Card.js';
|
|
1
|
+
import { CardProps } from './types.js';
|
|
3
2
|
|
|
3
|
+
declare interface Card {
|
|
4
|
+
(props: CardProps): JSX.Element
|
|
5
|
+
}
|
|
4
6
|
|
|
5
|
-
|
|
6
|
-
export { CardComponent as default };
|
|
7
|
+
export { Card, Card as default };
|
|
@@ -1,13 +1,7 @@
|
|
|
1
|
-
|
|
1
|
+
import CardComponent from './Card.js';
|
|
2
|
+
export { Card, CardBody, CardImage } from './Card.js';
|
|
2
3
|
|
|
3
|
-
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
var Card = require('./Card.js');
|
|
6
5
|
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
exports.Card = Card.Card;
|
|
10
|
-
exports.CardBody = Card.CardBody;
|
|
11
|
-
exports.CardImage = Card.CardImage;
|
|
12
|
-
exports.default = Card.default;
|
|
6
|
+
export { CardComponent as default };
|
|
13
7
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;"}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import * as styled_components from 'styled-components';
|
|
2
|
+
import * as _xstyled_system from '@xstyled/system';
|
|
3
|
+
|
|
4
|
+
declare const StyledCard: styled_components.StyledComponent<"div", _xstyled_system.Theme, {
|
|
5
|
+
block?: boolean | undefined;
|
|
6
|
+
hasBorder?: boolean | undefined;
|
|
7
|
+
shadow?: boolean | undefined;
|
|
8
|
+
p?: string | undefined;
|
|
9
|
+
backgroundColor?: string | undefined;
|
|
10
|
+
}, never>;
|
|
11
|
+
|
|
12
|
+
export { StyledCard };
|
|
@@ -1,18 +1,12 @@
|
|
|
1
|
-
|
|
1
|
+
import { __makeTemplateObject } from 'tslib';
|
|
2
|
+
import styled, { css, th, x, down } from '@xstyled/styled-components';
|
|
2
3
|
|
|
3
|
-
var
|
|
4
|
-
var styled =
|
|
5
|
-
|
|
6
|
-
function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
|
|
7
|
-
|
|
8
|
-
var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
|
|
9
|
-
|
|
10
|
-
var wrapper = styled.css(templateObject_1 || (templateObject_1 = tslib.__makeTemplateObject(["\n display: flex;\n box-sizing: border-box;\n font-family: ", ";\n :after {\n box-sizing: border-box;\n }\n"], ["\n display: flex;\n box-sizing: border-box;\n font-family: ", ";\n :after {\n box-sizing: border-box;\n }\n"])), styled.th('fonts.primary'));
|
|
11
|
-
var CardWrapper = styled__default.default.div(templateObject_2 || (templateObject_2 = tslib.__makeTemplateObject(["\n ", ";\n display: ", ";\n justify-content: center;\n flex-wrap: wrap;\n"], ["\n ", ";\n display: ", ";\n justify-content: center;\n flex-wrap: wrap;\n"])), wrapper, function (_a) {
|
|
4
|
+
var wrapper = css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n display: flex;\n box-sizing: border-box;\n font-family: ", ";\n :after {\n box-sizing: border-box;\n }\n"], ["\n display: flex;\n box-sizing: border-box;\n font-family: ", ";\n :after {\n box-sizing: border-box;\n }\n"])), th('fonts.primary'));
|
|
5
|
+
var CardWrapper = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n ", ";\n display: ", ";\n justify-content: center;\n flex-wrap: wrap;\n"], ["\n ", ";\n display: ", ";\n justify-content: center;\n flex-wrap: wrap;\n"])), wrapper, function (_a) {
|
|
12
6
|
var block = _a.block;
|
|
13
7
|
return (block ? 'block' : 'inline-flex');
|
|
14
8
|
});
|
|
15
|
-
var StyledCard =
|
|
9
|
+
var StyledCard = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n justify-content: space-between;\n display: ", ";\n padding: ", ";\n box-shadow: ", ";\n border: ", ";\n background-color: ", ";\n border-color: lightGray3;\n border-radius: 4px;\n"], ["\n justify-content: space-between;\n display: ", ";\n padding: ", ";\n box-shadow: ", ";\n border: ", ";\n background-color: ", ";\n border-color: lightGray3;\n border-radius: 4px;\n"])), function (_a) {
|
|
16
10
|
var block = _a.block;
|
|
17
11
|
return (block ? 'block' : 'inline-flex');
|
|
18
12
|
}, function (_a) {
|
|
@@ -20,25 +14,21 @@ var StyledCard = styled__default.default.div(templateObject_3 || (templateObject
|
|
|
20
14
|
return p || 'initial';
|
|
21
15
|
}, function (_a) {
|
|
22
16
|
var shadow = _a.shadow;
|
|
23
|
-
return (shadow ?
|
|
17
|
+
return (shadow ? th.shadow('smooth') : 'none');
|
|
24
18
|
}, function (_a) {
|
|
25
19
|
var hasBorder = _a.hasBorder;
|
|
26
|
-
return (hasBorder ?
|
|
20
|
+
return (hasBorder ? th.border('slim') : 'none');
|
|
27
21
|
}, function (_a) {
|
|
28
22
|
var backgroundColor = _a.backgroundColor;
|
|
29
|
-
return (backgroundColor ?
|
|
23
|
+
return (backgroundColor ? th.color(backgroundColor) : 'initial');
|
|
30
24
|
});
|
|
31
|
-
var ImageWrapper =
|
|
25
|
+
var ImageWrapper = styled(x.div)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n ", ";\n justify-content: center;\n flex-direction: column;\n background-color: ", ";\n ", "\n"], ["\n ", ";\n justify-content: center;\n flex-direction: column;\n background-color: ", ";\n ", "\n"])), wrapper, function (_a) {
|
|
32
26
|
var color = _a.color;
|
|
33
27
|
return color;
|
|
34
|
-
},
|
|
35
|
-
var StyledImage =
|
|
36
|
-
var StyledBody =
|
|
28
|
+
}, down('lg', css(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n display: none;\n "], ["\n display: none;\n "])))));
|
|
29
|
+
var StyledImage = styled(x.div)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n display: flex;\n align-self: center;\n justify-content: center;\n object-fit: cover;\n"], ["\n display: flex;\n align-self: center;\n justify-content: center;\n object-fit: cover;\n"])));
|
|
30
|
+
var StyledBody = styled(x.div)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n ", ";\n justify-content: center;\n flex-direction: column;\n"], ["\n ", ";\n justify-content: center;\n flex-direction: column;\n"])), wrapper);
|
|
37
31
|
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;
|
|
38
32
|
|
|
39
|
-
|
|
40
|
-
exports.ImageWrapper = ImageWrapper;
|
|
41
|
-
exports.StyledBody = StyledBody;
|
|
42
|
-
exports.StyledCard = StyledCard;
|
|
43
|
-
exports.StyledImage = StyledImage;
|
|
33
|
+
export { CardWrapper, ImageWrapper, StyledBody, StyledCard, StyledImage };
|
|
44
34
|
//# sourceMappingURL=styles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.js","sources":["../../../../packages/ui/Elements/Card/styles.ts"],"sourcesContent":["import { __makeTemplateObject } from \"tslib\";\nimport styled, { x, css, down } from '@xstyled/styled-components';\nimport { th } from '@xstyled/styled-components';\nvar wrapper = css(templateObject_1 || (templateObject_1 = __makeTemplateObject([\"\\n display: flex;\\n box-sizing: border-box;\\n font-family: \", \";\\n :after {\\n box-sizing: border-box;\\n }\\n\"], [\"\\n display: flex;\\n box-sizing: border-box;\\n font-family: \", \";\\n :after {\\n box-sizing: border-box;\\n }\\n\"])), th('fonts.primary'));\nexport var CardWrapper = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject([\"\\n \", \";\\n display: \", \";\\n justify-content: center;\\n flex-wrap: wrap;\\n\"], [\"\\n \", \";\\n display: \", \";\\n justify-content: center;\\n flex-wrap: wrap;\\n\"])), wrapper, function (_a) {\n var block = _a.block;\n return (block ? 'block' : 'inline-flex');\n});\nexport var StyledCard = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject([\"\\n justify-content: space-between;\\n display: \", \";\\n padding: \", \";\\n box-shadow: \", \";\\n border: \", \";\\n background-color: \", \";\\n border-color: lightGray3;\\n border-radius: 4px;\\n\"], [\"\\n justify-content: space-between;\\n display: \", \";\\n padding: \", \";\\n box-shadow: \", \";\\n border: \", \";\\n background-color: \", \";\\n border-color: lightGray3;\\n border-radius: 4px;\\n\"])), function (_a) {\n var block = _a.block;\n return (block ? 'block' : 'inline-flex');\n}, function (_a) {\n var p = _a.p;\n return p || 'initial';\n}, function (_a) {\n var shadow = _a.shadow;\n return (shadow ? th.shadow('smooth') : 'none');\n}, function (_a) {\n var hasBorder = _a.hasBorder;\n return (hasBorder ? th.border('slim') : 'none');\n}, function (_a) {\n var backgroundColor = _a.backgroundColor;\n return (backgroundColor ? th.color(backgroundColor) : 'initial');\n});\nexport var ImageWrapper = styled(x.div)(templateObject_5 || (templateObject_5 = __makeTemplateObject([\"\\n \", \";\\n justify-content: center;\\n flex-direction: column;\\n background-color: \", \";\\n \", \"\\n\"], [\"\\n \", \";\\n justify-content: center;\\n flex-direction: column;\\n background-color: \", \";\\n \", \"\\n\"])), wrapper, function (_a) {\n var color = _a.color;\n return color;\n}, down('lg', css(templateObject_4 || (templateObject_4 = __makeTemplateObject([\"\\n display: none;\\n \"], [\"\\n display: none;\\n \"])))));\nexport var StyledImage = styled(x.div)(templateObject_6 || (templateObject_6 = __makeTemplateObject([\"\\n display: flex;\\n align-self: center;\\n justify-content: center;\\n object-fit: cover;\\n\"], [\"\\n display: flex;\\n align-self: center;\\n justify-content: center;\\n object-fit: cover;\\n\"])));\nexport var StyledBody = styled(x.div)(templateObject_7 || (templateObject_7 = __makeTemplateObject([\"\\n \", \";\\n justify-content: center;\\n flex-direction: column;\\n\"], [\"\\n \", \";\\n justify-content: center;\\n flex-direction: column;\\n\"])), wrapper);\nvar templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;\n//# sourceMappingURL=styles.js.map"],"names":[
|
|
1
|
+
{"version":3,"file":"styles.js","sources":["../../../../packages/ui/Elements/Card/styles.ts"],"sourcesContent":["import { __makeTemplateObject } from \"tslib\";\nimport styled, { x, css, down } from '@xstyled/styled-components';\nimport { th } from '@xstyled/styled-components';\nvar wrapper = css(templateObject_1 || (templateObject_1 = __makeTemplateObject([\"\\n display: flex;\\n box-sizing: border-box;\\n font-family: \", \";\\n :after {\\n box-sizing: border-box;\\n }\\n\"], [\"\\n display: flex;\\n box-sizing: border-box;\\n font-family: \", \";\\n :after {\\n box-sizing: border-box;\\n }\\n\"])), th('fonts.primary'));\nexport var CardWrapper = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject([\"\\n \", \";\\n display: \", \";\\n justify-content: center;\\n flex-wrap: wrap;\\n\"], [\"\\n \", \";\\n display: \", \";\\n justify-content: center;\\n flex-wrap: wrap;\\n\"])), wrapper, function (_a) {\n var block = _a.block;\n return (block ? 'block' : 'inline-flex');\n});\nexport var StyledCard = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject([\"\\n justify-content: space-between;\\n display: \", \";\\n padding: \", \";\\n box-shadow: \", \";\\n border: \", \";\\n background-color: \", \";\\n border-color: lightGray3;\\n border-radius: 4px;\\n\"], [\"\\n justify-content: space-between;\\n display: \", \";\\n padding: \", \";\\n box-shadow: \", \";\\n border: \", \";\\n background-color: \", \";\\n border-color: lightGray3;\\n border-radius: 4px;\\n\"])), function (_a) {\n var block = _a.block;\n return (block ? 'block' : 'inline-flex');\n}, function (_a) {\n var p = _a.p;\n return p || 'initial';\n}, function (_a) {\n var shadow = _a.shadow;\n return (shadow ? th.shadow('smooth') : 'none');\n}, function (_a) {\n var hasBorder = _a.hasBorder;\n return (hasBorder ? th.border('slim') : 'none');\n}, function (_a) {\n var backgroundColor = _a.backgroundColor;\n return (backgroundColor ? th.color(backgroundColor) : 'initial');\n});\nexport var ImageWrapper = styled(x.div)(templateObject_5 || (templateObject_5 = __makeTemplateObject([\"\\n \", \";\\n justify-content: center;\\n flex-direction: column;\\n background-color: \", \";\\n \", \"\\n\"], [\"\\n \", \";\\n justify-content: center;\\n flex-direction: column;\\n background-color: \", \";\\n \", \"\\n\"])), wrapper, function (_a) {\n var color = _a.color;\n return color;\n}, down('lg', css(templateObject_4 || (templateObject_4 = __makeTemplateObject([\"\\n display: none;\\n \"], [\"\\n display: none;\\n \"])))));\nexport var StyledImage = styled(x.div)(templateObject_6 || (templateObject_6 = __makeTemplateObject([\"\\n display: flex;\\n align-self: center;\\n justify-content: center;\\n object-fit: cover;\\n\"], [\"\\n display: flex;\\n align-self: center;\\n justify-content: center;\\n object-fit: cover;\\n\"])));\nexport var StyledBody = styled(x.div)(templateObject_7 || (templateObject_7 = __makeTemplateObject([\"\\n \", \";\\n justify-content: center;\\n flex-direction: column;\\n\"], [\"\\n \", \";\\n justify-content: center;\\n flex-direction: column;\\n\"])), wrapper);\nvar templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;\n//# sourceMappingURL=styles.js.map"],"names":[],"mappings":"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"}
|