@laerdal/life-react-components 5.0.2 → 5.0.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/Button/Button.cjs +58 -53
- package/dist/Button/Button.cjs.map +1 -1
- package/dist/Button/Button.d.ts +42 -17
- package/dist/Button/Button.js +58 -53
- package/dist/Button/Button.js.map +1 -1
- package/dist/GlobalNavigationBar/desktop/RightSideNav.cjs +6 -2
- package/dist/GlobalNavigationBar/desktop/RightSideNav.cjs.map +1 -1
- package/dist/GlobalNavigationBar/desktop/RightSideNav.js +6 -2
- package/dist/GlobalNavigationBar/desktop/RightSideNav.js.map +1 -1
- package/dist/InputFields/Checkbox.cjs +1 -1
- package/dist/InputFields/Checkbox.cjs.map +1 -1
- package/dist/InputFields/Checkbox.d.ts +1 -1
- package/dist/InputFields/Checkbox.js +1 -1
- package/dist/InputFields/Checkbox.js.map +1 -1
- package/dist/Modals/ModalContent.cjs +2 -1
- package/dist/Modals/ModalContent.cjs.map +1 -1
- package/dist/Modals/ModalContent.js +2 -1
- package/dist/Modals/ModalContent.js.map +1 -1
- package/dist/Tabs/Tabs.cjs +3 -1
- package/dist/Tabs/Tabs.cjs.map +1 -1
- package/dist/Tabs/Tabs.js +3 -1
- package/dist/Tabs/Tabs.js.map +1 -1
- package/dist/styles/typography.cjs +3 -3
- package/dist/styles/typography.cjs.map +1 -1
- package/dist/styles/typography.js +3 -3
- package/dist/styles/typography.js.map +1 -1
- package/package.json +1 -1
package/dist/Button/Button.js
CHANGED
|
@@ -2,9 +2,9 @@ import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
|
2
2
|
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
|
|
3
3
|
import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
|
|
4
4
|
import _pt from "prop-types";
|
|
5
|
-
var _excluded = ["children", "variant", "type", "size", "width", "testId", "disabled", "flatEdge", "icon"],
|
|
5
|
+
var _excluded = ["children", "variant", "type", "size", "colorTheme", "invertFocus", "width", "testId", "disabled", "flatEdge", "icon"],
|
|
6
6
|
_excluded2 = ["loading"];
|
|
7
|
-
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
|
|
7
|
+
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
|
|
8
8
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
9
9
|
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
10
10
|
import * as React from 'react';
|
|
@@ -29,98 +29,99 @@ var getBorderRadius = function getBorderRadius(flatEdge, radius) {
|
|
|
29
29
|
}
|
|
30
30
|
};
|
|
31
31
|
export var ButtonContentContainer = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n min-width: 64px;\n"])));
|
|
32
|
-
|
|
33
|
-
|
|
32
|
+
var ButtonBaseStyled = styled.button(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral([""])));
|
|
33
|
+
export var ButtonPrimaryStyled = styled(ButtonBaseStyled)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n border: none;\n background-color: transparent;\n cursor: pointer;\n padding: 0;\n margin: 0;\n position: relative;\n box-sizing: border-box;\n min-height: ", ";\n &.loading-state {\n cursor: wait;\n }\n ", " {\n ", ";\n\n background-color: ", ";\n border-radius: ", ";\n\n width: ", ";\n position: relative;\n\n min-height: ", ";\n\n box-sizing: border-box;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: ", ";\n\n span.icon:not(.loading) {\n pointer-events: none;\n }\n\n span.loading {\n opacity: 0;\n }\n\n .icon {\n margin: ", ";\n width: ", ";\n height: ", ";\n svg {\n width: ", " !important;\n height: ", " !important;\n }\n }\n\n .label {\n margin: 0 4px;\n }\n\n div {\n position: absolute;\n width: 100%;\n svg {\n height: ", ";\n width: ", ";\n path {\n fill: ", ";\n }\n }\n }\n }\n &:hover > ", ",\n &.hover-state > ", " {\n background-color: ", ";\n color: ", ";\n }\n &:active > ", ",\n &.active-state > ", " {\n background-color: ", ";\n color: ", ";\n }\n\n &:focus,\n &.focus-state {\n ", "\n }\n &:disabled,\n &.disabled-state {\n cursor: not-allowed;\n }\n &:disabled > ", ",\n &.disabled-state > ", " {\n pointer-events: none;\n background-color: ", ";\n color: ", ";\n }\n"])), function (props) {
|
|
34
|
+
return props.$size === Size.Large ? '56px' : '48px';
|
|
34
35
|
}, ButtonContentContainer, function (props) {
|
|
35
|
-
return props
|
|
36
|
+
return props.$size === Size.Large ? ComponentLStyling(ComponentTextStyle.Bold, (props === null || props === void 0 ? void 0 : props.$colorTheme) === 'dark' ? COLORS.getColor('primary_800', props.theme) : COLORS.getColor('white', props.theme)) : props.$size === Size.Small ? ComponentSStyling(ComponentTextStyle.Bold, (props === null || props === void 0 ? void 0 : props.$colorTheme) === 'dark' ? COLORS.getColor('primary_800', props.theme) : COLORS.getColor('white', props.theme)) : ComponentMStyling(ComponentTextStyle.Bold, (props === null || props === void 0 ? void 0 : props.$colorTheme) === 'dark' ? COLORS.getColor('primary_800', props.theme) : COLORS.getColor('white', props.theme));
|
|
36
37
|
}, function (props) {
|
|
37
|
-
return props
|
|
38
|
+
return props.$colorTheme === 'teal' ? COLORS.getColor('accent1', props.theme) : (props === null || props === void 0 ? void 0 : props.$colorTheme) === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary', props.theme);
|
|
38
39
|
}, function (props) {
|
|
39
|
-
return getBorderRadius(props
|
|
40
|
+
return getBorderRadius(props.$flatEdge, 8);
|
|
40
41
|
}, function (props) {
|
|
41
|
-
return props
|
|
42
|
+
return props.$width;
|
|
42
43
|
}, function (props) {
|
|
43
|
-
return props
|
|
44
|
+
return props.$size === Size.Large ? '56px' : props.$size === Size.Small ? '32px' : '40px';
|
|
44
45
|
}, function (props) {
|
|
45
|
-
return props
|
|
46
|
+
return props.$size === Size.Large ? '14px 16px' : props.$size === Size.Small ? '6px 8px' : '8px 12px';
|
|
46
47
|
}, function (props) {
|
|
47
|
-
return props
|
|
48
|
+
return props.$size === Size.Medium ? props.$iconOnly ? '-2px -8px' : '' : props.$size === Size.Small ? props.$iconOnly ? '-2px -6px' : '' : '';
|
|
48
49
|
}, function (props) {
|
|
49
|
-
return props
|
|
50
|
+
return props.$size === Size.Large ? '28px' : props.$size === Size.Small ? '20px' : '24px';
|
|
50
51
|
}, function (props) {
|
|
51
|
-
return props
|
|
52
|
+
return props.$size === Size.Large ? '28px' : props.$size === Size.Small ? '20px' : '24px';
|
|
52
53
|
}, function (props) {
|
|
53
|
-
return props
|
|
54
|
+
return props.$size === Size.Large ? '28px' : props.$size === Size.Small ? '20px' : '24px';
|
|
54
55
|
}, function (props) {
|
|
55
|
-
return props
|
|
56
|
+
return props.$size === Size.Large ? '28px' : props.$size === Size.Small ? '20px' : '24px';
|
|
56
57
|
}, function (props) {
|
|
57
|
-
return props
|
|
58
|
+
return props.$size === Size.Large ? '28px' : props.$size === Size.Small ? '20px' : '24px';
|
|
58
59
|
}, function (props) {
|
|
59
|
-
return props
|
|
60
|
+
return props.$size === Size.Large ? '28px' : props.$size === Size.Small ? '20px' : '24px';
|
|
60
61
|
}, function (props) {
|
|
61
|
-
return props
|
|
62
|
+
return props.$colorTheme === 'dark' ? COLORS.getColor('primary', props.theme) : COLORS.getColor('white', props.theme);
|
|
62
63
|
}, ButtonContentContainer, ButtonContentContainer, function (props) {
|
|
63
|
-
return props
|
|
64
|
+
return props.$colorTheme === 'teal' ? COLORS.getColor('accent1_700', props.theme) : (props === null || props === void 0 ? void 0 : props.$colorTheme) === 'dark' ? COLORS.getColor('primary_100', props.theme) : COLORS.getColor('primary_700', props.theme);
|
|
64
65
|
}, function (props) {
|
|
65
|
-
return (props === null || props === void 0 ? void 0 : props
|
|
66
|
+
return (props === null || props === void 0 ? void 0 : props.$colorTheme) === 'dark' ? COLORS.getColor('primary_600', props.theme) : COLORS.getColor('white', props.theme);
|
|
66
67
|
}, ButtonContentContainer, ButtonContentContainer, function (props) {
|
|
67
|
-
return props
|
|
68
|
+
return props.$colorTheme === 'teal' ? COLORS.getColor('accent1_800', props.theme) : (props === null || props === void 0 ? void 0 : props.$colorTheme) === 'dark' ? COLORS.getColor('primary_200', props.theme) : COLORS.getColor('primary_800', props.theme);
|
|
68
69
|
}, function (props) {
|
|
69
|
-
return (props === null || props === void 0 ? void 0 : props
|
|
70
|
+
return (props === null || props === void 0 ? void 0 : props.$colorTheme) === 'dark' ? COLORS.getColor('primary_800', props.theme) : COLORS.getColor('white', props.theme);
|
|
70
71
|
}, function (props) {
|
|
71
|
-
return props
|
|
72
|
+
return props.$invertFocus || props.$invertFocus === undefined && props.$colorTheme === 'dark' ? invertedFocusStyles : focusStyles;
|
|
72
73
|
}, ButtonContentContainer, ButtonContentContainer, function (props) {
|
|
73
|
-
return props
|
|
74
|
+
return props.$colorTheme === 'dark' ? COLORS.getColor('primary_700', props.theme) : COLORS.getColor('neutral_100', props.theme);
|
|
74
75
|
}, function (props) {
|
|
75
|
-
return props
|
|
76
|
+
return props.$colorTheme === 'dark' ? COLORS.getColor('primary_800', props.theme) : COLORS.getColor('neutral_300', props.theme);
|
|
76
77
|
});
|
|
77
|
-
export var ButtonSecondaryStyled = styled(ButtonPrimaryStyled)(
|
|
78
|
-
return props
|
|
78
|
+
export var ButtonSecondaryStyled = styled(ButtonPrimaryStyled)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n ", " {\n color: ", ";\n background-color: transparent;\n div svg path {\n fill: ", ";\n }\n box-shadow: inset 0 0 0 2px ", ";\n \n padding: ", ";\n }\n\n &:hover > ", ",\n &.hover-state > ", " {\n color: ", ";\n box-shadow: inset 0 0 0 2px ", ";\n \n background-color: transparent;\n div {\n svg {\n path {\n fill: ", ";\n }\n }\n }\n }\n &:active > ", ",\n &.active-state > ", " {\n color: ", ";\n box-shadow: inset 0 0 0 2px ", ";\n \n background-color: transparent;\n div {\n svg {\n path {\n fill: ", ";\n }\n }\n }\n }\n\n &:disabled > ", ",\n &.disabled-state > ", " {\n background-color: transparent;\n color: ", ";\n box-shadow: inset 0 0 0 2px ", ";\n }\n"])), ButtonContentContainer, function (props) {
|
|
79
|
+
return props.$colorTheme === 'teal' ? COLORS.getColor('accent1', props.theme) : (props === null || props === void 0 ? void 0 : props.$colorTheme) === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary', props.theme);
|
|
79
80
|
}, function (props) {
|
|
80
|
-
return props
|
|
81
|
+
return props.$colorTheme === 'teal' ? COLORS.getColor('accent1', props.theme) : COLORS.getColor('primary', props.theme);
|
|
81
82
|
}, function (props) {
|
|
82
|
-
return props
|
|
83
|
+
return props.$colorTheme === 'teal' ? COLORS.getColor('accent1', props.theme) : (props === null || props === void 0 ? void 0 : props.$colorTheme) === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary', props.theme);
|
|
83
84
|
}, function (props) {
|
|
84
|
-
return props
|
|
85
|
+
return props.$size === Size.Large ? '12px 16px' : props.$size === Size.Small ? '4px 8px' : '6px 12px';
|
|
85
86
|
}, ButtonContentContainer, ButtonContentContainer, function (props) {
|
|
86
|
-
return props
|
|
87
|
+
return props.$colorTheme === 'teal' ? COLORS.getColor('accent1_700', props.theme) : (props === null || props === void 0 ? void 0 : props.$colorTheme) === 'dark' ? COLORS.getColor('primary_200', props.theme) : COLORS.getColor('primary_700', props.theme);
|
|
87
88
|
}, function (props) {
|
|
88
|
-
return props
|
|
89
|
+
return props.$colorTheme === 'teal' ? COLORS.getColor('accent1_700', props.theme) : (props === null || props === void 0 ? void 0 : props.$colorTheme) === 'dark' ? COLORS.getColor('primary_200', props.theme) : COLORS.getColor('primary_700', props.theme);
|
|
89
90
|
}, function (props) {
|
|
90
|
-
return props
|
|
91
|
+
return props.$colorTheme === 'teal' ? COLORS.getColor('accent1_700', props.theme) : COLORS.getColor('primary_700', props.theme);
|
|
91
92
|
}, ButtonContentContainer, ButtonContentContainer, function (props) {
|
|
92
|
-
return props
|
|
93
|
+
return props.$colorTheme === 'teal' ? COLORS.getColor('accent1_800', props.theme) : (props === null || props === void 0 ? void 0 : props.$colorTheme) === 'dark' ? COLORS.getColor('primary_300', props.theme) : COLORS.getColor('primary_800', props.theme);
|
|
93
94
|
}, function (props) {
|
|
94
|
-
return props
|
|
95
|
+
return props.$colorTheme === 'teal' ? COLORS.getColor('accent1_800', props.theme) : (props === null || props === void 0 ? void 0 : props.$colorTheme) === 'dark' ? COLORS.getColor('primary_300', props.theme) : COLORS.getColor('primary_800', props.theme);
|
|
95
96
|
}, function (props) {
|
|
96
|
-
return props
|
|
97
|
+
return props.$colorTheme === 'teal' ? COLORS.getColor('accent1_800', props.theme) : (props === null || props === void 0 ? void 0 : props.$colorTheme) === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary_800', props.theme);
|
|
97
98
|
}, ButtonContentContainer, ButtonContentContainer, function (props) {
|
|
98
|
-
return (props === null || props === void 0 ? void 0 : props
|
|
99
|
+
return (props === null || props === void 0 ? void 0 : props.$colorTheme) === 'dark' ? COLORS.getColor('primary_700', props.theme) : COLORS.getColor('neutral_300', props.theme);
|
|
99
100
|
}, function (props) {
|
|
100
|
-
return (props === null || props === void 0 ? void 0 : props
|
|
101
|
+
return (props === null || props === void 0 ? void 0 : props.$colorTheme) === 'dark' ? COLORS.getColor('primary_700', props.theme) : COLORS.getColor('neutral_100', props.theme);
|
|
101
102
|
});
|
|
102
|
-
export var ButtonTertiaryStyled = styled(ButtonPrimaryStyled)(
|
|
103
|
-
return props
|
|
103
|
+
export var ButtonTertiaryStyled = styled(ButtonPrimaryStyled)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n", " {\n color: ", ";\n background-color: transparent;\n\n div svg path {\n fill: ", ";\n }\n\n padding: ", ";\n }\n\n &:hover > ", ",\n &.hover-state > ", " {\n background-color: ", ";\n color: ", ";\n\n div {\n svg {\n path {\n fill: ", ";\n }\n }\n }\n }\n &:active > ", ",\n &.active-state > ", " {\n background-color: ", ";\n color: ", ";\n\n div {\n svg {\n path {\n fill: ", ";\n }\n }\n }\n }\n\n &:disabled > ", ",\n &.disabled-state > ", " {\n background-color: transparent !important;\n color: ", ";\n border-color: transparent !important;\n }\n"])), ButtonContentContainer, function (props) {
|
|
104
|
+
return props.$colorTheme === 'teal' ? COLORS.getColor('accent1', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary_500', props.theme);
|
|
104
105
|
}, function (props) {
|
|
105
|
-
return props
|
|
106
|
+
return props.$colorTheme === 'teal' ? COLORS.getColor('accent1', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary_500', props.theme);
|
|
106
107
|
}, function (props) {
|
|
107
|
-
return props
|
|
108
|
+
return props.$size === Size.Large ? '12px 16px' : props.$size === Size.Small ? '4px 8px' : '6px 12px';
|
|
108
109
|
}, ButtonContentContainer, ButtonContentContainer, function (props) {
|
|
109
|
-
return props
|
|
110
|
+
return props.$colorTheme === 'teal' ? COLORS.getColor('accent1_20', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('primary_700', props.theme) : COLORS.getColor('primary_20', props.theme);
|
|
110
111
|
}, function (props) {
|
|
111
|
-
return props
|
|
112
|
+
return props.$colorTheme === 'teal' ? COLORS.getColor('accent1_700', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary_700', props.theme);
|
|
112
113
|
}, function (props) {
|
|
113
|
-
return props
|
|
114
|
+
return props.$colorTheme === 'teal' ? COLORS.getColor('accent1_700', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary_700', props.theme);
|
|
114
115
|
}, ButtonContentContainer, ButtonContentContainer, function (props) {
|
|
115
|
-
return props
|
|
116
|
+
return props.$colorTheme === 'teal' ? COLORS.getColor('accent1_100', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('primary_600', props.theme) : COLORS.getColor('primary_100', props.theme);
|
|
116
117
|
}, function (props) {
|
|
117
|
-
return props
|
|
118
|
+
return props.$colorTheme === 'teal' ? COLORS.getColor('accent1_800', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary_800', props.theme);
|
|
118
119
|
}, function (props) {
|
|
119
|
-
return props
|
|
120
|
+
return props.$colorTheme === 'teal' ? COLORS.getColor('accent1_800', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary_800', props.theme);
|
|
120
121
|
}, ButtonContentContainer, ButtonContentContainer, function (props) {
|
|
121
122
|
return COLORS.getColor('primary_700', props.theme);
|
|
122
123
|
});
|
|
123
|
-
export var ButtonPositiveStyled = styled(ButtonPrimaryStyled)(
|
|
124
|
+
export var ButtonPositiveStyled = styled(ButtonPrimaryStyled)(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n ", " {\n color: white;\n background-color: ", ";\n }\n &:hover > ", ",\n &.hover-state > ", " {\n background-color: ", ";\n }\n &:active > ", ",\n &.active-state > ", " {\n background-color: ", ";\n }\n\n &:disabled > ", ",\n &.disabled-state > ", " {\n background-color: ", ";\n color: ", ";\n }\n"])), ButtonContentContainer, function (props) {
|
|
124
125
|
return COLORS.getColor('correct_500', props.theme);
|
|
125
126
|
}, ButtonContentContainer, ButtonContentContainer, function (props) {
|
|
126
127
|
return COLORS.getColor('correct_700', props.theme);
|
|
@@ -131,7 +132,7 @@ export var ButtonPositiveStyled = styled(ButtonPrimaryStyled)(_templateObject5 |
|
|
|
131
132
|
}, function (props) {
|
|
132
133
|
return COLORS.getColor('neutral_300', props.theme);
|
|
133
134
|
});
|
|
134
|
-
export var ButtonCriticalStyled = styled(ButtonPrimaryStyled)(
|
|
135
|
+
export var ButtonCriticalStyled = styled(ButtonPrimaryStyled)(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n ", " {\n color: white;\n background-color: ", ";\n }\n &:hover > ", ",\n &.hover-state > ", " {\n background-color: ", ";\n }\n &:active > ", ",\n &.active-state > ", " {\n background-color: ", ";\n }\n\n &:disabled > ", ",\n &.disabled-state > ", " {\n background-color: ", ";\n color: ", "; \n }\n"])), ButtonContentContainer, function (props) {
|
|
135
136
|
return COLORS.getColor('critical_500', props.theme);
|
|
136
137
|
}, ButtonContentContainer, ButtonContentContainer, function (props) {
|
|
137
138
|
return COLORS.getColor('critical_700', props.theme);
|
|
@@ -154,6 +155,8 @@ var Button = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
154
155
|
type = _ref$type === void 0 ? 'button' : _ref$type,
|
|
155
156
|
_ref$size = _ref.size,
|
|
156
157
|
size = _ref$size === void 0 ? Size.Medium : _ref$size,
|
|
158
|
+
colorTheme = _ref.colorTheme,
|
|
159
|
+
invertFocus = _ref.invertFocus,
|
|
157
160
|
_ref$width = _ref.width,
|
|
158
161
|
width = _ref$width === void 0 ? 'auto' : _ref$width,
|
|
159
162
|
testId = _ref.testId,
|
|
@@ -191,12 +194,14 @@ var Button = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
191
194
|
break;
|
|
192
195
|
}
|
|
193
196
|
return /*#__PURE__*/_jsx(ButtonStyled, _objectSpread(_objectSpread({}, renderProps), {}, {
|
|
197
|
+
$size: size,
|
|
198
|
+
$colorTheme: colorTheme,
|
|
199
|
+
$invertFocus: invertFocus,
|
|
194
200
|
ref: ref,
|
|
195
201
|
disabled: disabled,
|
|
196
|
-
iconOnly: !children,
|
|
202
|
+
$iconOnly: !children,
|
|
197
203
|
type: type,
|
|
198
|
-
|
|
199
|
-
flatEdge: flatEdge,
|
|
204
|
+
$flatEdge: flatEdge,
|
|
200
205
|
$width: width,
|
|
201
206
|
"data-testid": testId,
|
|
202
207
|
className: props.loading ? 'loading-state ' + props.className : ' ' + props.className,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.js","names":["React","styled","LoadingIndicator","ComponentLStyling","ComponentMStyling","ComponentSStyling","ComponentTextStyle","COLORS","focusStyles","invertedFocusStyles","Size","defaultOnMouseDownHandler","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","getBorderRadius","flatEdge","radius","concat","ButtonContentContainer","div","_templateObject","_taggedTemplateLiteral","ButtonPrimaryStyled","button","_templateObject2","props","size","Large","Bold","colorTheme","getColor","theme","Small","width","Medium","iconOnly","invertFocus","undefined","ButtonSecondaryStyled","_templateObject3","ButtonTertiaryStyled","_templateObject4","ButtonPositiveStyled","_templateObject5","ButtonCriticalStyled","_templateObject6","Button","forwardRef","_ref","ref","_ref$children","children","_ref$variant","variant","_ref$type","type","_ref$size","_ref$width","testId","disabled","icon","_objectWithoutProperties","_excluded","loading","renderProps","_excluded2","renderContent","className","ButtonStyled","_objectSpread","$width","onMouseDown","propTypes","_pt","oneOf","bool","oneOfType","string","node"],"sources":["../../src/Button/Button.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled, { css } from 'styled-components';\r\nimport { LoadingIndicator } from '../LoadingIndicator';\r\nimport { ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentTextStyle } from '../styles';\r\nimport { COLORS, focusStyles, invertedFocusStyles } from '../styles';\r\nimport { Size, Testable } from '../types';\r\nimport { defaultOnMouseDownHandler } from '../common';\r\n\r\nconst getBorderRadius = (flatEdge: string | undefined, radius: number) => {\r\n switch (flatEdge) {\r\n case 'left':\r\n return `0px ${radius}px ${radius}px 0px`;\r\n\r\n case 'right':\r\n return `${radius}px 0px 0px ${radius}px`;\r\n\r\n case 'none':\r\n default:\r\n return `${radius}px`;\r\n }\r\n};\r\n\r\nexport const ButtonContentContainer = styled.div`\r\n min-width: 64px;\r\n`;\r\n\r\nexport const ButtonPrimaryStyled = styled.button<ButtonProps & {iconOnly: boolean}>`\r\n border: none;\r\n background-color: transparent;\r\n cursor: pointer;\r\n padding: 0;\r\n margin: 0;\r\n position: relative;\r\n box-sizing: border-box;\r\n min-height: ${(props) => (props.size === Size.Large ? '56px' : '48px')};\r\n &.loading-state {\r\n cursor: wait;\r\n }\r\n ${ButtonContentContainer} {\r\n ${(props) =>\r\n props.size === Size.Large\r\n ? ComponentLStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.getColor('primary_800', props.theme) : COLORS.getColor('white', props.theme))\r\n : props.size === Size.Small\r\n ? ComponentSStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.getColor('primary_800', props.theme) : COLORS.getColor('white', props.theme))\r\n : ComponentMStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.getColor('primary_800', props.theme) : COLORS.getColor('white', props.theme))};\r\n\r\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.getColor('accent1', props.theme) : props?.colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary', props.theme))};\r\n border-radius: ${(props) => getBorderRadius(props.flatEdge, 8)};\r\n\r\n width: ${(props) => props.width};\r\n position: relative;\r\n\r\n min-height: ${(props) => (props.size === Size.Large ? '56px' : props.size === Size.Small ? '32px' : '40px')};\r\n\r\n box-sizing: border-box;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n padding: ${(props) => (props.size === Size.Large ? '14px 16px' : props.size === Size.Small ? '6px 8px' : '8px 12px')};\r\n\r\n span.icon:not(.loading) {\r\n pointer-events: none;\r\n }\r\n\r\n span.loading {\r\n opacity: 0;\r\n }\r\n\r\n .icon {\r\n margin: ${(props) => (props.size === Size.Medium ? props.iconOnly ? '-2px -8px' : '' : (props.size === Size.Small ? props.iconOnly ? '-2px -6px' : '' : '' ))};\r\n width: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\r\n height: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\r\n svg {\r\n width: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')} !important;\r\n height: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')} !important;\r\n }\r\n }\r\n\r\n .label {\r\n margin: 0 4px;\r\n }\r\n\r\n div {\r\n position: absolute;\r\n width: 100%;\r\n svg {\r\n height: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\r\n width: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\r\n path {\r\n fill: ${(props) => (props.colorTheme === 'dark' ? COLORS.getColor('primary', props.theme) : COLORS.getColor('white', props.theme))};\r\n }\r\n }\r\n }\r\n }\r\n &:hover > ${ButtonContentContainer},\r\n &.hover-state > ${ButtonContentContainer} {\r\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.getColor('accent1_700', props.theme) : props?.colorTheme === 'dark' ? COLORS.getColor('primary_100', props.theme) : COLORS.getColor('primary_700', props.theme))};\r\n color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.getColor('primary_600', props.theme) : COLORS.getColor('white', props.theme))};\r\n }\r\n &:active > ${ButtonContentContainer},\r\n &.active-state > ${ButtonContentContainer} {\r\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.getColor('accent1_800', props.theme) : props?.colorTheme === 'dark' ? COLORS.getColor('primary_200', props.theme) : COLORS.getColor('primary_800', props.theme))};\r\n color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.getColor('primary_800', props.theme) : COLORS.getColor('white', props.theme))};\r\n }\r\n\r\n &:focus,\r\n &.focus-state {\r\n ${(props) => (props.invertFocus || (props.invertFocus === undefined && props.colorTheme === 'dark') ? invertedFocusStyles : focusStyles)}\r\n }\r\n &:disabled,\r\n &.disabled-state {\r\n cursor: not-allowed;\r\n }\r\n &:disabled > ${ButtonContentContainer},\r\n &.disabled-state > ${ButtonContentContainer} {\r\n pointer-events: none;\r\n background-color: ${(props) => (props.colorTheme === 'dark' ? COLORS.getColor('primary_700', props.theme) : COLORS.getColor('neutral_100', props.theme))};\r\n color: ${(props) => (props.colorTheme === 'dark' ? COLORS.getColor('primary_800', props.theme) : COLORS.getColor('neutral_300', props.theme))};\r\n }\r\n`;\r\n\r\nexport const ButtonSecondaryStyled = styled(ButtonPrimaryStyled)<ButtonProps & {iconOnly: boolean}>`\r\n ${ButtonContentContainer} {\r\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.getColor('accent1', props.theme) : props?.colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary', props.theme))};\r\n background-color: transparent;\r\n div svg path {\r\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.getColor('accent1', props.theme) : COLORS.getColor('primary', props.theme))};\r\n }\r\n box-shadow: inset 0 0 0 2px ${(props) => (props.colorTheme === 'teal' ? COLORS.getColor('accent1', props.theme) : props?.colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary', props.theme))};\r\n \r\n padding: ${(props) => (props.size === Size.Large ? '12px 16px' : props.size === Size.Small ? '4px 8px' : '6px 12px')};\r\n }\r\n\r\n &:hover > ${ButtonContentContainer},\r\n &.hover-state > ${ButtonContentContainer} {\r\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.getColor('accent1_700', props.theme) : props?.colorTheme === 'dark' ? COLORS.getColor('primary_200', props.theme) : COLORS.getColor('primary_700', props.theme))};\r\n box-shadow: inset 0 0 0 2px ${(props) => (props.colorTheme === 'teal' ? COLORS.getColor('accent1_700', props.theme) : props?.colorTheme === 'dark' ? COLORS.getColor('primary_200', props.theme) : COLORS.getColor('primary_700', props.theme))};\r\n \r\n background-color: transparent;\r\n div {\r\n svg {\r\n path {\r\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.getColor('accent1_700', props.theme) : COLORS.getColor('primary_700', props.theme))};\r\n }\r\n }\r\n }\r\n }\r\n &:active > ${ButtonContentContainer},\r\n &.active-state > ${ButtonContentContainer} {\r\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.getColor('accent1_800', props.theme) : props?.colorTheme === 'dark' ? COLORS.getColor('primary_300', props.theme) : COLORS.getColor('primary_800', props.theme))};\r\n box-shadow: inset 0 0 0 2px ${(props) => (props.colorTheme === 'teal' ? COLORS.getColor('accent1_800', props.theme) : props?.colorTheme === 'dark' ? COLORS.getColor('primary_300', props.theme) : COLORS.getColor('primary_800', props.theme))};\r\n \r\n background-color: transparent;\r\n div {\r\n svg {\r\n path {\r\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.getColor('accent1_800', props.theme) : props?.colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary_800', props.theme))};\r\n }\r\n }\r\n }\r\n }\r\n\r\n &:disabled > ${ButtonContentContainer},\r\n &.disabled-state > ${ButtonContentContainer} {\r\n background-color: transparent;\r\n color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.getColor('primary_700', props.theme) : COLORS.getColor('neutral_300', props.theme))};\r\n box-shadow: inset 0 0 0 2px ${(props) => (props?.colorTheme === 'dark' ? COLORS.getColor('primary_700', props.theme) : COLORS.getColor('neutral_100', props.theme))};\r\n }\r\n`;\r\n\r\nexport const ButtonTertiaryStyled = styled(ButtonPrimaryStyled)<ButtonProps>`\r\n${ButtonContentContainer} {\r\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.getColor('accent1', props.theme) : props.colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary_500', props.theme))};\r\n background-color: transparent;\r\n\r\n div svg path {\r\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.getColor('accent1', props.theme) : props.colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary_500', props.theme))};\r\n }\r\n\r\n padding: ${(props) => (props.size === Size.Large ? '12px 16px' : props.size === Size.Small ? '4px 8px' : '6px 12px')};\r\n }\r\n\r\n &:hover > ${ButtonContentContainer},\r\n &.hover-state > ${ButtonContentContainer} {\r\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.getColor('accent1_20', props.theme) : props.colorTheme === 'dark' ? COLORS.getColor('primary_700', props.theme) : COLORS.getColor('primary_20', props.theme))};\r\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.getColor('accent1_700', props.theme) : props.colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary_700', props.theme))};\r\n\r\n div {\r\n svg {\r\n path {\r\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.getColor('accent1_700', props.theme) : props.colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary_700', props.theme))};\r\n }\r\n }\r\n }\r\n }\r\n &:active > ${ButtonContentContainer},\r\n &.active-state > ${ButtonContentContainer} {\r\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.getColor('accent1_100', props.theme) : props.colorTheme === 'dark' ? COLORS.getColor('primary_600', props.theme) : COLORS.getColor('primary_100', props.theme))};\r\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.getColor('accent1_800', props.theme) : props.colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary_800', props.theme))};\r\n\r\n div {\r\n svg {\r\n path {\r\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.getColor('accent1_800', props.theme) : props.colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary_800', props.theme))};\r\n }\r\n }\r\n }\r\n }\r\n\r\n &:disabled > ${ButtonContentContainer},\r\n &.disabled-state > ${ButtonContentContainer} {\r\n background-color: transparent !important;\r\n color: ${props => COLORS.getColor('primary_700', props.theme)};\r\n border-color: transparent !important;\r\n }\r\n`;\r\n\r\nexport const ButtonPositiveStyled = styled(ButtonPrimaryStyled)<ButtonProps>`\r\n ${ButtonContentContainer} {\r\n color: white;\r\n background-color: ${props => COLORS.getColor('correct_500', props.theme)};\r\n }\r\n &:hover > ${ButtonContentContainer},\r\n &.hover-state > ${ButtonContentContainer} {\r\n background-color: ${props => COLORS.getColor('correct_700', props.theme)};\r\n }\r\n &:active > ${ButtonContentContainer},\r\n &.active-state > ${ButtonContentContainer} {\r\n background-color: ${props => COLORS.getColor('correct_800', props.theme)};\r\n }\r\n\r\n &:disabled > ${ButtonContentContainer},\r\n &.disabled-state > ${ButtonContentContainer} {\r\n background-color: ${props => COLORS.getColor('neutral_100', props.theme)};\r\n color: ${props => COLORS.getColor('neutral_300', props.theme)};\r\n }\r\n`;\r\n\r\nexport const ButtonCriticalStyled = styled(ButtonPrimaryStyled)<ButtonProps>`\r\n ${ButtonContentContainer} {\r\n color: white;\r\n background-color: ${props => COLORS.getColor('critical_500', props.theme)};\r\n }\r\n &:hover > ${ButtonContentContainer},\r\n &.hover-state > ${ButtonContentContainer} {\r\n background-color: ${props => COLORS.getColor('critical_700', props.theme)};\r\n }\r\n &:active > ${ButtonContentContainer},\r\n &.active-state > ${ButtonContentContainer} {\r\n background-color: ${props => COLORS.getColor('critical_800', props.theme)};\r\n }\r\n\r\n &:disabled > ${ButtonContentContainer},\r\n &.disabled-state > ${ButtonContentContainer} {\r\n background-color: ${props => COLORS.getColor('neutral_100', props.theme)};\r\n color: ${props => COLORS.getColor('neutral_300', props.theme)}; \r\n }\r\n`;\r\n\r\nexport interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\r\n /** Look and feel variant of the component. Defaults to 'primary'. */\r\n variant?: 'primary' | 'secondary' | 'tertiary' | 'positive' | 'critical';\r\n /** Can be used in order to remove rounded corners on right or left edge of the button. Used by 'DualFunctionButton'. Defaults to 'undefined' */\r\n flatEdge?: 'right' | 'left' | 'none' | undefined;\r\n /** Size of the component. Small, Medium or Large. Defaults to 'medium' */\r\n size?: Size.Small | Size.Medium | Size.Large;\r\n /** Color theme altering of the component. By default there is no altering applied. */\r\n colorTheme?: 'teal' | 'dark';\r\n /** Allows using inverted colors for outlining focus rect. Shown when component focused by keyboard. */\r\n invertFocus?: boolean;\r\n /** Can be used to set custom value for width style. Value is set for 'ButtonContent' container. */\r\n width?: 'auto' | string;\r\n /** If set, then 'opacity' of children container will be set to 0, and loading indicator will be shown. */\r\n loading?: boolean;\r\n /** TestId. Will be set to the top level button component. */\r\n testId?: string;\r\n /** Icon that will be shown on the left of the children. */\r\n icon?: React.ReactNode;\r\n}\r\n\r\n/**\r\n * Button component\r\n */\r\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\r\n ({ children = '', variant = 'primary', type = 'button', size = Size.Medium, width: width = 'auto', testId, disabled, flatEdge, icon, ...props }, ref) => {\r\n // Let's filter out properties that we don't need to render.\r\n const { loading, ...renderProps } = props;\r\n\r\n const renderContent = () => (\r\n <>\r\n {icon && <span className={(children ? 'extramargin ' : '') + (loading ? 'icon loading' : 'icon')}>{icon}</span>}\r\n {children && <span className={loading ? 'label loading' : 'label'}>{children}</span>}\r\n {loading && <LoadingIndicator />}\r\n </>\r\n );\r\n\r\n let ButtonStyled: any = ButtonPrimaryStyled;\r\n switch (variant) {\r\n case 'secondary':\r\n ButtonStyled = ButtonSecondaryStyled;\r\n break;\r\n case 'tertiary':\r\n ButtonStyled = ButtonTertiaryStyled;\r\n break;\r\n case 'positive':\r\n ButtonStyled = ButtonPositiveStyled;\r\n break;\r\n case 'critical':\r\n ButtonStyled = ButtonCriticalStyled;\r\n break;\r\n }\r\n\r\n return (\r\n <ButtonStyled\r\n {...renderProps}\r\n ref={ref}\r\n disabled={disabled}\r\n iconOnly={!children}\r\n type={type}\r\n size={size}\r\n flatEdge={flatEdge}\r\n $width={width}\r\n data-testid={testId}\r\n className={props.loading ? 'loading-state ' + props.className : ' ' + props.className}\r\n onMouseDown={defaultOnMouseDownHandler}>\r\n <ButtonContentContainer>{renderContent()}</ButtonContentContainer>\r\n </ButtonStyled>\r\n );\r\n },\r\n);\r\n\r\nexport default Button;\r\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"Button.js","names":["React","styled","LoadingIndicator","ComponentLStyling","ComponentMStyling","ComponentSStyling","ComponentTextStyle","COLORS","focusStyles","invertedFocusStyles","Size","defaultOnMouseDownHandler","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","getBorderRadius","flatEdge","radius","concat","ButtonContentContainer","div","_templateObject","_taggedTemplateLiteral","ButtonBaseStyled","button","_templateObject2","ButtonPrimaryStyled","_templateObject3","props","$size","Large","Bold","$colorTheme","getColor","theme","Small","$flatEdge","$width","Medium","$iconOnly","$invertFocus","undefined","ButtonSecondaryStyled","_templateObject4","ButtonTertiaryStyled","_templateObject5","ButtonPositiveStyled","_templateObject6","ButtonCriticalStyled","_templateObject7","Button","forwardRef","_ref","ref","_ref$children","children","_ref$variant","variant","_ref$type","type","_ref$size","size","colorTheme","invertFocus","_ref$width","width","testId","disabled","icon","_objectWithoutProperties","_excluded","loading","renderProps","_excluded2","renderContent","className","ButtonStyled","_objectSpread","onMouseDown","propTypes","_pt","oneOf","bool","oneOfType","string","node"],"sources":["../../src/Button/Button.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled, { css } from 'styled-components';\r\nimport { LoadingIndicator } from '../LoadingIndicator';\r\nimport { ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentTextStyle } from '../styles';\r\nimport { COLORS, focusStyles, invertedFocusStyles } from '../styles';\r\nimport { Size, Testable } from '../types';\r\nimport { defaultOnMouseDownHandler } from '../common';\r\n\r\nconst getBorderRadius = (flatEdge: string | undefined, radius: number) => {\r\n switch (flatEdge) {\r\n case 'left':\r\n return `0px ${radius}px ${radius}px 0px`;\r\n\r\n case 'right':\r\n return `${radius}px 0px 0px ${radius}px`;\r\n\r\n case 'none':\r\n default:\r\n return `${radius}px`;\r\n }\r\n};\r\n\r\nexport const ButtonContentContainer = styled.div`\r\n min-width: 64px;\r\n`;\r\n\r\nconst ButtonBaseStyled = styled.button<{$iconOnly: boolean; $size: Size; $colorTheme: 'teal' | 'dark' | undefined; $flatEdge: string | undefined; $width: string; $invertFocus: boolean | undefined; }>``;\r\n\r\nexport const ButtonPrimaryStyled = styled(ButtonBaseStyled)`\r\n border: none;\r\n background-color: transparent;\r\n cursor: pointer;\r\n padding: 0;\r\n margin: 0;\r\n position: relative;\r\n box-sizing: border-box;\r\n min-height: ${(props) => (props.$size === Size.Large ? '56px' : '48px')};\r\n &.loading-state {\r\n cursor: wait;\r\n }\r\n ${ButtonContentContainer} {\r\n ${(props) =>\r\n props.$size === Size.Large\r\n ? ComponentLStyling(ComponentTextStyle.Bold, props?.$colorTheme === 'dark' ? COLORS.getColor('primary_800', props.theme) : COLORS.getColor('white', props.theme))\r\n : props.$size === Size.Small\r\n ? ComponentSStyling(ComponentTextStyle.Bold, props?.$colorTheme === 'dark' ? COLORS.getColor('primary_800', props.theme) : COLORS.getColor('white', props.theme))\r\n : ComponentMStyling(ComponentTextStyle.Bold, props?.$colorTheme === 'dark' ? COLORS.getColor('primary_800', props.theme) : COLORS.getColor('white', props.theme))};\r\n\r\n background-color: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary', props.theme))};\r\n border-radius: ${(props) => getBorderRadius(props.$flatEdge, 8)};\r\n\r\n width: ${(props) => props.$width};\r\n position: relative;\r\n\r\n min-height: ${(props) => (props.$size === Size.Large ? '56px' : props.$size === Size.Small ? '32px' : '40px')};\r\n\r\n box-sizing: border-box;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n padding: ${(props) => (props.$size === Size.Large ? '14px 16px' : props.$size === Size.Small ? '6px 8px' : '8px 12px')};\r\n\r\n span.icon:not(.loading) {\r\n pointer-events: none;\r\n }\r\n\r\n span.loading {\r\n opacity: 0;\r\n }\r\n\r\n .icon {\r\n margin: ${(props) => (props.$size === Size.Medium ? props.$iconOnly ? '-2px -8px' : '' : (props.$size === Size.Small ? props.$iconOnly ? '-2px -6px' : '' : '' ))};\r\n width: ${(props) => (props.$size === Size.Large ? '28px' : props.$size === Size.Small ? '20px' : '24px')};\r\n height: ${(props) => (props.$size === Size.Large ? '28px' : props.$size === Size.Small ? '20px' : '24px')};\r\n svg {\r\n width: ${(props) => (props.$size === Size.Large ? '28px' : props.$size === Size.Small ? '20px' : '24px')} !important;\r\n height: ${(props) => (props.$size === Size.Large ? '28px' : props.$size === Size.Small ? '20px' : '24px')} !important;\r\n }\r\n }\r\n\r\n .label {\r\n margin: 0 4px;\r\n }\r\n\r\n div {\r\n position: absolute;\r\n width: 100%;\r\n svg {\r\n height: ${(props) => (props.$size === Size.Large ? '28px' : props.$size === Size.Small ? '20px' : '24px')};\r\n width: ${(props) => (props.$size === Size.Large ? '28px' : props.$size === Size.Small ? '20px' : '24px')};\r\n path {\r\n fill: ${(props) => (props.$colorTheme === 'dark' ? COLORS.getColor('primary', props.theme) : COLORS.getColor('white', props.theme))};\r\n }\r\n }\r\n }\r\n }\r\n &:hover > ${ButtonContentContainer},\r\n &.hover-state > ${ButtonContentContainer} {\r\n background-color: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1_700', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('primary_100', props.theme) : COLORS.getColor('primary_700', props.theme))};\r\n color: ${(props) => (props?.$colorTheme === 'dark' ? COLORS.getColor('primary_600', props.theme) : COLORS.getColor('white', props.theme))};\r\n }\r\n &:active > ${ButtonContentContainer},\r\n &.active-state > ${ButtonContentContainer} {\r\n background-color: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1_800', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('primary_200', props.theme) : COLORS.getColor('primary_800', props.theme))};\r\n color: ${(props) => (props?.$colorTheme === 'dark' ? COLORS.getColor('primary_800', props.theme) : COLORS.getColor('white', props.theme))};\r\n }\r\n\r\n &:focus,\r\n &.focus-state {\r\n ${(props) => (props.$invertFocus || (props.$invertFocus === undefined && props.$colorTheme === 'dark') ? invertedFocusStyles : focusStyles)}\r\n }\r\n &:disabled,\r\n &.disabled-state {\r\n cursor: not-allowed;\r\n }\r\n &:disabled > ${ButtonContentContainer},\r\n &.disabled-state > ${ButtonContentContainer} {\r\n pointer-events: none;\r\n background-color: ${(props) => (props.$colorTheme === 'dark' ? COLORS.getColor('primary_700', props.theme) : COLORS.getColor('neutral_100', props.theme))};\r\n color: ${(props) => (props.$colorTheme === 'dark' ? COLORS.getColor('primary_800', props.theme) : COLORS.getColor('neutral_300', props.theme))};\r\n }\r\n`;\r\n\r\nexport const ButtonSecondaryStyled = styled(ButtonPrimaryStyled)`\r\n ${ButtonContentContainer} {\r\n color: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary', props.theme))};\r\n background-color: transparent;\r\n div svg path {\r\n fill: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1', props.theme) : COLORS.getColor('primary', props.theme))};\r\n }\r\n box-shadow: inset 0 0 0 2px ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary', props.theme))};\r\n \r\n padding: ${(props) => (props.$size === Size.Large ? '12px 16px' : props.$size === Size.Small ? '4px 8px' : '6px 12px')};\r\n }\r\n\r\n &:hover > ${ButtonContentContainer},\r\n &.hover-state > ${ButtonContentContainer} {\r\n color: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1_700', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('primary_200', props.theme) : COLORS.getColor('primary_700', props.theme))};\r\n box-shadow: inset 0 0 0 2px ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1_700', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('primary_200', props.theme) : COLORS.getColor('primary_700', props.theme))};\r\n \r\n background-color: transparent;\r\n div {\r\n svg {\r\n path {\r\n fill: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1_700', props.theme) : COLORS.getColor('primary_700', props.theme))};\r\n }\r\n }\r\n }\r\n }\r\n &:active > ${ButtonContentContainer},\r\n &.active-state > ${ButtonContentContainer} {\r\n color: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1_800', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('primary_300', props.theme) : COLORS.getColor('primary_800', props.theme))};\r\n box-shadow: inset 0 0 0 2px ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1_800', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('primary_300', props.theme) : COLORS.getColor('primary_800', props.theme))};\r\n \r\n background-color: transparent;\r\n div {\r\n svg {\r\n path {\r\n fill: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1_800', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary_800', props.theme))};\r\n }\r\n }\r\n }\r\n }\r\n\r\n &:disabled > ${ButtonContentContainer},\r\n &.disabled-state > ${ButtonContentContainer} {\r\n background-color: transparent;\r\n color: ${(props) => (props?.$colorTheme === 'dark' ? COLORS.getColor('primary_700', props.theme) : COLORS.getColor('neutral_300', props.theme))};\r\n box-shadow: inset 0 0 0 2px ${(props) => (props?.$colorTheme === 'dark' ? COLORS.getColor('primary_700', props.theme) : COLORS.getColor('neutral_100', props.theme))};\r\n }\r\n`;\r\n\r\nexport const ButtonTertiaryStyled = styled(ButtonPrimaryStyled)`\r\n${ButtonContentContainer} {\r\n color: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary_500', props.theme))};\r\n background-color: transparent;\r\n\r\n div svg path {\r\n fill: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary_500', props.theme))};\r\n }\r\n\r\n padding: ${(props) => (props.$size === Size.Large ? '12px 16px' : props.$size === Size.Small ? '4px 8px' : '6px 12px')};\r\n }\r\n\r\n &:hover > ${ButtonContentContainer},\r\n &.hover-state > ${ButtonContentContainer} {\r\n background-color: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1_20', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('primary_700', props.theme) : COLORS.getColor('primary_20', props.theme))};\r\n color: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1_700', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary_700', props.theme))};\r\n\r\n div {\r\n svg {\r\n path {\r\n fill: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1_700', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary_700', props.theme))};\r\n }\r\n }\r\n }\r\n }\r\n &:active > ${ButtonContentContainer},\r\n &.active-state > ${ButtonContentContainer} {\r\n background-color: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1_100', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('primary_600', props.theme) : COLORS.getColor('primary_100', props.theme))};\r\n color: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1_800', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary_800', props.theme))};\r\n\r\n div {\r\n svg {\r\n path {\r\n fill: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1_800', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary_800', props.theme))};\r\n }\r\n }\r\n }\r\n }\r\n\r\n &:disabled > ${ButtonContentContainer},\r\n &.disabled-state > ${ButtonContentContainer} {\r\n background-color: transparent !important;\r\n color: ${props => COLORS.getColor('primary_700', props.theme)};\r\n border-color: transparent !important;\r\n }\r\n`;\r\n\r\nexport const ButtonPositiveStyled = styled(ButtonPrimaryStyled)`\r\n ${ButtonContentContainer} {\r\n color: white;\r\n background-color: ${props => COLORS.getColor('correct_500', props.theme)};\r\n }\r\n &:hover > ${ButtonContentContainer},\r\n &.hover-state > ${ButtonContentContainer} {\r\n background-color: ${props => COLORS.getColor('correct_700', props.theme)};\r\n }\r\n &:active > ${ButtonContentContainer},\r\n &.active-state > ${ButtonContentContainer} {\r\n background-color: ${props => COLORS.getColor('correct_800', props.theme)};\r\n }\r\n\r\n &:disabled > ${ButtonContentContainer},\r\n &.disabled-state > ${ButtonContentContainer} {\r\n background-color: ${props => COLORS.getColor('neutral_100', props.theme)};\r\n color: ${props => COLORS.getColor('neutral_300', props.theme)};\r\n }\r\n`;\r\n\r\nexport const ButtonCriticalStyled = styled(ButtonPrimaryStyled)`\r\n ${ButtonContentContainer} {\r\n color: white;\r\n background-color: ${props => COLORS.getColor('critical_500', props.theme)};\r\n }\r\n &:hover > ${ButtonContentContainer},\r\n &.hover-state > ${ButtonContentContainer} {\r\n background-color: ${props => COLORS.getColor('critical_700', props.theme)};\r\n }\r\n &:active > ${ButtonContentContainer},\r\n &.active-state > ${ButtonContentContainer} {\r\n background-color: ${props => COLORS.getColor('critical_800', props.theme)};\r\n }\r\n\r\n &:disabled > ${ButtonContentContainer},\r\n &.disabled-state > ${ButtonContentContainer} {\r\n background-color: ${props => COLORS.getColor('neutral_100', props.theme)};\r\n color: ${props => COLORS.getColor('neutral_300', props.theme)}; \r\n }\r\n`;\r\n\r\nexport interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\r\n /** Look and feel variant of the component. Defaults to 'primary'. */\r\n variant?: 'primary' | 'secondary' | 'tertiary' | 'positive' | 'critical';\r\n /** Can be used in order to remove rounded corners on right or left edge of the button. Used by 'DualFunctionButton'. Defaults to 'undefined' */\r\n flatEdge?: 'right' | 'left' | 'none' | undefined;\r\n /** Size of the component. Small, Medium or Large. Defaults to 'medium' */\r\n size?: Size.Small | Size.Medium | Size.Large;\r\n /** Color theme altering of the component. By default there is no altering applied. */\r\n colorTheme?: 'teal' | 'dark';\r\n /** Allows using inverted colors for outlining focus rect. Shown when component focused by keyboard. */\r\n invertFocus?: boolean;\r\n /** Can be used to set custom value for width style. Value is set for 'ButtonContent' container. */\r\n width?: 'auto' | string;\r\n /** If set, then 'opacity' of children container will be set to 0, and loading indicator will be shown. */\r\n loading?: boolean;\r\n /** TestId. Will be set to the top level button component. */\r\n testId?: string;\r\n /** Icon that will be shown on the left of the children. */\r\n icon?: React.ReactNode;\r\n}\r\n\r\n/**\r\n * Button component\r\n */\r\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\r\n ({ children = '', variant = 'primary', type = 'button', size = Size.Medium, colorTheme, invertFocus, width: width = 'auto', testId, disabled, flatEdge, icon, ...props }, ref) => {\r\n // Let's filter out properties that we don't need to render.\r\n const { loading, ...renderProps } = props;\r\n\r\n const renderContent = () => (\r\n <>\r\n {icon && <span className={(children ? 'extramargin ' : '') + (loading ? 'icon loading' : 'icon')}>{icon}</span>}\r\n {children && <span className={loading ? 'label loading' : 'label'}>{children}</span>}\r\n {loading && <LoadingIndicator />}\r\n </>\r\n );\r\n\r\n let ButtonStyled = ButtonPrimaryStyled;\r\n switch (variant) {\r\n case 'secondary':\r\n ButtonStyled = ButtonSecondaryStyled;\r\n break;\r\n case 'tertiary':\r\n ButtonStyled = ButtonTertiaryStyled;\r\n break;\r\n case 'positive':\r\n ButtonStyled = ButtonPositiveStyled;\r\n break;\r\n case 'critical':\r\n ButtonStyled = ButtonCriticalStyled;\r\n break;\r\n }\r\n\r\n return (\r\n <ButtonStyled\r\n {...renderProps}\r\n $size={size}\r\n $colorTheme={colorTheme} \r\n $invertFocus={invertFocus} \r\n ref={ref}\r\n disabled={disabled}\r\n $iconOnly={!children}\r\n type={type}\r\n $flatEdge={flatEdge}\r\n $width={width}\r\n data-testid={testId}\r\n className={props.loading ? 'loading-state ' + props.className : ' ' + props.className}\r\n onMouseDown={defaultOnMouseDownHandler}>\r\n <ButtonContentContainer>{renderContent()}</ButtonContentContainer>\r\n </ButtonStyled>\r\n );\r\n },\r\n);\r\n\r\nexport default Button;\r\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -53,13 +53,17 @@ var RightSideNav = function RightSideNav(_ref) {
|
|
|
53
53
|
}), action && !action.tooltip && /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledButton, _objectSpread(_objectSpread({
|
|
54
54
|
variant: "secondary",
|
|
55
55
|
onClick: action === null || action === void 0 ? void 0 : action.action
|
|
56
|
-
}, action), {}, {
|
|
56
|
+
}, _objectSpread(_objectSpread({}, action), {}, {
|
|
57
|
+
action: undefined
|
|
58
|
+
})), {}, {
|
|
57
59
|
children: action.label
|
|
58
60
|
})), action && !!action.tooltip && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Tooltips.TooltipWrapper, _objectSpread(_objectSpread({}, action.tooltip), {}, {
|
|
59
61
|
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledButton, _objectSpread(_objectSpread({
|
|
60
62
|
variant: "secondary",
|
|
61
63
|
onClick: action === null || action === void 0 ? void 0 : action.action
|
|
62
|
-
}, action), {}, {
|
|
64
|
+
}, _objectSpread(_objectSpread({}, action), {}, {
|
|
65
|
+
action: undefined
|
|
66
|
+
})), {}, {
|
|
63
67
|
children: action.label
|
|
64
68
|
}))
|
|
65
69
|
}))]
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RightSideNav.cjs","names":["React","_interopRequireWildcard","require","_styledComponents","_interopRequireDefault","_reactRouterDom","_NavItem","_styles","_Button","_common","_Tooltips","_jsxRuntime","_templateObject","_templateObject2","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","_typeof","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ownKeys","keys","getOwnPropertySymbols","o","filter","enumerable","push","apply","_objectSpread","arguments","length","forEach","_defineProperty2","getOwnPropertyDescriptors","defineProperties","NavContainer","styled","div","_taggedTemplateLiteral2","BREAKPOINTS","MEDIUM","LARGE","StyledButton","Button","ComponentMStyling","ComponentTextStyle","Bold","RightSideNav","_ref","items","action","getNavItem","item","disabled","jsx","NavItem","as","className","children","label","NavLink","to","onMouseDown","defaultOnMouseDownHandler","onClick","jsxs","reverse","map","no","tooltip","variant","TooltipWrapper","propTypes","_propTypes","array","_default","exports"],"sources":["../../../src/GlobalNavigationBar/desktop/RightSideNav.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\nimport {NavLink} from 'react-router-dom';\r\n\r\nimport {NavItem} from '../../NavItem';\r\nimport {BREAKPOINTS, ComponentTextStyle} from '../../styles';\r\nimport {Button} from '../../Button';\r\nimport {ComponentMStyling} from '../../styles';\r\nimport {defaultOnMouseDownHandler} from '../../common';\r\nimport {MenuButton, MenuNavigationItemTypeItem} from '../types';\r\nimport {TooltipWrapper} from \"../../Tooltips\";\r\n\r\nconst NavContainer = styled.div`\r\n display: none;\r\n margin: auto 0 auto auto;\r\n align-items: center;\r\n height: 64px;\r\n\r\n a {\r\n text-decoration: none;\r\n }\r\n\r\n ${BREAKPOINTS.MEDIUM} {\r\n display: flex;\r\n }\r\n\r\n ${BREAKPOINTS.LARGE} {\r\n height: 80px;\r\n }\r\n\r\n button,\r\n div {\r\n &:hover {\r\n cursor: pointer;\r\n }\r\n }\r\n`;\r\n\r\nconst StyledButton = styled(Button)`\r\n height: 40px;\r\n margin: 0 8px;\r\n\r\n ${ComponentMStyling(ComponentTextStyle.Bold, 'unset')}\r\n`;\r\n\r\ntype Props = {\r\n items?: MenuNavigationItemTypeItem[];\r\n action?: MenuButton;\r\n};\r\n\r\nconst RightSideNav = ({items, action}: Props): React.ReactElement<Props> => {\r\n const getNavItem = (item: MenuNavigationItemTypeItem) => {\r\n if (item?.disabled) {\r\n return (\r\n <NavItem as={Button} className=\"disabled\" key={item?.label}>\r\n {item?.label}\r\n </NavItem>\r\n );\r\n } else {\r\n return (\r\n <NavItem\r\n as={NavLink}\r\n to={item?.to || ''}\r\n key={item?.label}\r\n onMouseDown={defaultOnMouseDownHandler}\r\n onClick={(e:React.MouseEvent) => item.action && item.action(e)}>\r\n {item?.label}\r\n </NavItem>\r\n );\r\n }\r\n };\r\n\r\n return (\r\n <NavContainer>\r\n {items?.reverse().map(no => getNavItem(no))}\r\n\r\n {\r\n action && !action.tooltip &&\r\n <StyledButton variant=\"secondary\" onClick={action?.action} {...action}>\r\n {action.label}\r\n </StyledButton>\r\n }\r\n {\r\n action && !!action.tooltip &&\r\n <TooltipWrapper {...action.tooltip}>\r\n <StyledButton variant=\"secondary\" onClick={action?.action} {...action}>\r\n {action.label}\r\n </StyledButton>\r\n </TooltipWrapper>\r\n }\r\n\r\n </NavContainer>\r\n );\r\n};\r\n\r\nexport default RightSideNav;\r\n"],"mappings":"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
|
|
1
|
+
{"version":3,"file":"RightSideNav.cjs","names":["React","_interopRequireWildcard","require","_styledComponents","_interopRequireDefault","_reactRouterDom","_NavItem","_styles","_Button","_common","_Tooltips","_jsxRuntime","_templateObject","_templateObject2","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","_typeof","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ownKeys","keys","getOwnPropertySymbols","o","filter","enumerable","push","apply","_objectSpread","arguments","length","forEach","_defineProperty2","getOwnPropertyDescriptors","defineProperties","NavContainer","styled","div","_taggedTemplateLiteral2","BREAKPOINTS","MEDIUM","LARGE","StyledButton","Button","ComponentMStyling","ComponentTextStyle","Bold","RightSideNav","_ref","items","action","getNavItem","item","disabled","jsx","NavItem","as","className","children","label","NavLink","to","onMouseDown","defaultOnMouseDownHandler","onClick","jsxs","reverse","map","no","tooltip","variant","undefined","TooltipWrapper","propTypes","_propTypes","array","_default","exports"],"sources":["../../../src/GlobalNavigationBar/desktop/RightSideNav.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\nimport {NavLink} from 'react-router-dom';\r\n\r\nimport {NavItem} from '../../NavItem';\r\nimport {BREAKPOINTS, ComponentTextStyle} from '../../styles';\r\nimport {Button} from '../../Button';\r\nimport {ComponentMStyling} from '../../styles';\r\nimport {defaultOnMouseDownHandler} from '../../common';\r\nimport {MenuButton, MenuNavigationItemTypeItem} from '../types';\r\nimport {TooltipWrapper} from \"../../Tooltips\";\r\n\r\nconst NavContainer = styled.div`\r\n display: none;\r\n margin: auto 0 auto auto;\r\n align-items: center;\r\n height: 64px;\r\n\r\n a {\r\n text-decoration: none;\r\n }\r\n\r\n ${BREAKPOINTS.MEDIUM} {\r\n display: flex;\r\n }\r\n\r\n ${BREAKPOINTS.LARGE} {\r\n height: 80px;\r\n }\r\n\r\n button,\r\n div {\r\n &:hover {\r\n cursor: pointer;\r\n }\r\n }\r\n`;\r\n\r\nconst StyledButton = styled(Button)`\r\n height: 40px;\r\n margin: 0 8px;\r\n\r\n ${ComponentMStyling(ComponentTextStyle.Bold, 'unset')}\r\n`;\r\n\r\ntype Props = {\r\n items?: MenuNavigationItemTypeItem[];\r\n action?: MenuButton;\r\n};\r\n\r\nconst RightSideNav = ({items, action}: Props): React.ReactElement<Props> => {\r\n const getNavItem = (item: MenuNavigationItemTypeItem) => {\r\n if (item?.disabled) {\r\n return (\r\n <NavItem as={Button} className=\"disabled\" key={item?.label}>\r\n {item?.label}\r\n </NavItem>\r\n );\r\n } else {\r\n return (\r\n <NavItem\r\n as={NavLink}\r\n to={item?.to || ''}\r\n key={item?.label}\r\n onMouseDown={defaultOnMouseDownHandler}\r\n onClick={(e:React.MouseEvent) => item.action && item.action(e)}>\r\n {item?.label}\r\n </NavItem>\r\n );\r\n }\r\n };\r\n\r\n\r\n\r\n return (\r\n <NavContainer>\r\n {items?.reverse().map(no => getNavItem(no))}\r\n\r\n {\r\n action && !action.tooltip &&\r\n <StyledButton variant=\"secondary\" onClick={action?.action} {...{...action, action: undefined}}>\r\n {action.label}\r\n </StyledButton>\r\n }\r\n {\r\n action && !!action.tooltip &&\r\n <TooltipWrapper {...action.tooltip}>\r\n <StyledButton variant=\"secondary\" onClick={action?.action} {...{...action, action: undefined}}>\r\n {action.label}\r\n </StyledButton>\r\n </TooltipWrapper>\r\n }\r\n\r\n </NavContainer>\r\n );\r\n};\r\n\r\nexport default RightSideNav;\r\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -45,13 +45,17 @@ var RightSideNav = function RightSideNav(_ref) {
|
|
|
45
45
|
}), action && !action.tooltip && /*#__PURE__*/_jsx(StyledButton, _objectSpread(_objectSpread({
|
|
46
46
|
variant: "secondary",
|
|
47
47
|
onClick: action === null || action === void 0 ? void 0 : action.action
|
|
48
|
-
}, action), {}, {
|
|
48
|
+
}, _objectSpread(_objectSpread({}, action), {}, {
|
|
49
|
+
action: undefined
|
|
50
|
+
})), {}, {
|
|
49
51
|
children: action.label
|
|
50
52
|
})), action && !!action.tooltip && /*#__PURE__*/_jsx(TooltipWrapper, _objectSpread(_objectSpread({}, action.tooltip), {}, {
|
|
51
53
|
children: /*#__PURE__*/_jsx(StyledButton, _objectSpread(_objectSpread({
|
|
52
54
|
variant: "secondary",
|
|
53
55
|
onClick: action === null || action === void 0 ? void 0 : action.action
|
|
54
|
-
}, action), {}, {
|
|
56
|
+
}, _objectSpread(_objectSpread({}, action), {}, {
|
|
57
|
+
action: undefined
|
|
58
|
+
})), {}, {
|
|
55
59
|
children: action.label
|
|
56
60
|
}))
|
|
57
61
|
}))]
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RightSideNav.js","names":["React","styled","NavLink","NavItem","BREAKPOINTS","ComponentTextStyle","Button","ComponentMStyling","defaultOnMouseDownHandler","TooltipWrapper","jsx","_jsx","jsxs","_jsxs","NavContainer","div","_templateObject","_taggedTemplateLiteral","MEDIUM","LARGE","StyledButton","_templateObject2","Bold","RightSideNav","_ref","items","action","getNavItem","item","disabled","as","className","children","label","to","onMouseDown","onClick","e","reverse","map","no","tooltip","_objectSpread","variant","propTypes","_pt","array"],"sources":["../../../src/GlobalNavigationBar/desktop/RightSideNav.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\nimport {NavLink} from 'react-router-dom';\r\n\r\nimport {NavItem} from '../../NavItem';\r\nimport {BREAKPOINTS, ComponentTextStyle} from '../../styles';\r\nimport {Button} from '../../Button';\r\nimport {ComponentMStyling} from '../../styles';\r\nimport {defaultOnMouseDownHandler} from '../../common';\r\nimport {MenuButton, MenuNavigationItemTypeItem} from '../types';\r\nimport {TooltipWrapper} from \"../../Tooltips\";\r\n\r\nconst NavContainer = styled.div`\r\n display: none;\r\n margin: auto 0 auto auto;\r\n align-items: center;\r\n height: 64px;\r\n\r\n a {\r\n text-decoration: none;\r\n }\r\n\r\n ${BREAKPOINTS.MEDIUM} {\r\n display: flex;\r\n }\r\n\r\n ${BREAKPOINTS.LARGE} {\r\n height: 80px;\r\n }\r\n\r\n button,\r\n div {\r\n &:hover {\r\n cursor: pointer;\r\n }\r\n }\r\n`;\r\n\r\nconst StyledButton = styled(Button)`\r\n height: 40px;\r\n margin: 0 8px;\r\n\r\n ${ComponentMStyling(ComponentTextStyle.Bold, 'unset')}\r\n`;\r\n\r\ntype Props = {\r\n items?: MenuNavigationItemTypeItem[];\r\n action?: MenuButton;\r\n};\r\n\r\nconst RightSideNav = ({items, action}: Props): React.ReactElement<Props> => {\r\n const getNavItem = (item: MenuNavigationItemTypeItem) => {\r\n if (item?.disabled) {\r\n return (\r\n <NavItem as={Button} className=\"disabled\" key={item?.label}>\r\n {item?.label}\r\n </NavItem>\r\n );\r\n } else {\r\n return (\r\n <NavItem\r\n as={NavLink}\r\n to={item?.to || ''}\r\n key={item?.label}\r\n onMouseDown={defaultOnMouseDownHandler}\r\n onClick={(e:React.MouseEvent) => item.action && item.action(e)}>\r\n {item?.label}\r\n </NavItem>\r\n );\r\n }\r\n };\r\n\r\n return (\r\n <NavContainer>\r\n {items?.reverse().map(no => getNavItem(no))}\r\n\r\n {\r\n action && !action.tooltip &&\r\n <StyledButton variant=\"secondary\" onClick={action?.action} {...action}>\r\n {action.label}\r\n </StyledButton>\r\n }\r\n {\r\n action && !!action.tooltip &&\r\n <TooltipWrapper {...action.tooltip}>\r\n <StyledButton variant=\"secondary\" onClick={action?.action} {...action}>\r\n {action.label}\r\n </StyledButton>\r\n </TooltipWrapper>\r\n }\r\n\r\n </NavContainer>\r\n );\r\n};\r\n\r\nexport default RightSideNav;\r\n"],"mappings":";;;;;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,OAAOC,MAAM,MAAM,mBAAmB;AACtC,SAAQC,OAAO,QAAO,kBAAkB;AAExC,SAAQC,OAAO,QAAO,eAAe;AACrC,SAAQC,WAAW,EAAEC,kBAAkB,QAAO,cAAc;AAC5D,SAAQC,MAAM,QAAO,cAAc;AACnC,SAAQC,iBAAiB,QAAO,cAAc;AAC9C,SAAQC,yBAAyB,QAAO,cAAc;AAEtD,SAAQC,cAAc,QAAO,gBAAgB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAE9C,IAAMC,YAAY,GAAGb,MAAM,CAACc,GAAG,CAAAC,eAAA,KAAAA,eAAA,GAAAC,sBAAA,+RAU3Bb,WAAW,CAACc,MAAM,EAIlBd,WAAW,CAACe,KAAK,CAUpB;AAED,IAAMC,YAAY,GAAGnB,MAAM,CAACK,MAAM,CAAC,CAAAe,gBAAA,KAAAA,gBAAA,GAAAJ,sBAAA,wDAI/BV,iBAAiB,CAACF,kBAAkB,CAACiB,IAAI,EAAE,OAAO,CAAC,CACtD;AAOD,IAAMC,YAAY,GAAG,SAAfA,YAAYA,CAAAC,IAAA,EAA0D;EAAA,IAArDC,KAAK,GAAAD,IAAA,CAALC,KAAK;IAAEC,MAAM,GAAAF,IAAA,CAANE,MAAM;EAClC,IAAMC,UAAU,GAAG,SAAbA,UAAUA,CAAIC,IAAgC,EAAK;IACvD,IAAIA,IAAI,aAAJA,IAAI,eAAJA,IAAI,CAAEC,QAAQ,EAAE;MAClB,oBACElB,IAAA,CAACR,OAAO;QAAC2B,EAAE,EAAExB,MAAO;QAACyB,SAAS,EAAC,UAAU;QAAAC,QAAA,EACtCJ,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEK;MAAK,GADiCL,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEK,KAE5C,CAAC;IAEd,CAAC,MAAM;MACL,oBACEtB,IAAA,CAACR,OAAO;QACN2B,EAAE,EAAE5B,OAAQ;QACZgC,EAAE,EAAE,CAAAN,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEM,EAAE,KAAI,EAAG;QAEnBC,WAAW,EAAE3B,yBAA0B;QACvC4B,OAAO,EAAE,SAAAA,QAACC,CAAkB;UAAA,OAAKT,IAAI,CAACF,MAAM,IAAIE,IAAI,CAACF,MAAM,CAACW,CAAC,CAAC;QAAA,CAAC;QAAAL,QAAA,EAC9DJ,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEK;MAAK,GAHPL,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEK,KAIJ,CAAC;IAEd;EACF,CAAC;
|
|
1
|
+
{"version":3,"file":"RightSideNav.js","names":["React","styled","NavLink","NavItem","BREAKPOINTS","ComponentTextStyle","Button","ComponentMStyling","defaultOnMouseDownHandler","TooltipWrapper","jsx","_jsx","jsxs","_jsxs","NavContainer","div","_templateObject","_taggedTemplateLiteral","MEDIUM","LARGE","StyledButton","_templateObject2","Bold","RightSideNav","_ref","items","action","getNavItem","item","disabled","as","className","children","label","to","onMouseDown","onClick","e","reverse","map","no","tooltip","_objectSpread","variant","undefined","propTypes","_pt","array"],"sources":["../../../src/GlobalNavigationBar/desktop/RightSideNav.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\nimport {NavLink} from 'react-router-dom';\r\n\r\nimport {NavItem} from '../../NavItem';\r\nimport {BREAKPOINTS, ComponentTextStyle} from '../../styles';\r\nimport {Button} from '../../Button';\r\nimport {ComponentMStyling} from '../../styles';\r\nimport {defaultOnMouseDownHandler} from '../../common';\r\nimport {MenuButton, MenuNavigationItemTypeItem} from '../types';\r\nimport {TooltipWrapper} from \"../../Tooltips\";\r\n\r\nconst NavContainer = styled.div`\r\n display: none;\r\n margin: auto 0 auto auto;\r\n align-items: center;\r\n height: 64px;\r\n\r\n a {\r\n text-decoration: none;\r\n }\r\n\r\n ${BREAKPOINTS.MEDIUM} {\r\n display: flex;\r\n }\r\n\r\n ${BREAKPOINTS.LARGE} {\r\n height: 80px;\r\n }\r\n\r\n button,\r\n div {\r\n &:hover {\r\n cursor: pointer;\r\n }\r\n }\r\n`;\r\n\r\nconst StyledButton = styled(Button)`\r\n height: 40px;\r\n margin: 0 8px;\r\n\r\n ${ComponentMStyling(ComponentTextStyle.Bold, 'unset')}\r\n`;\r\n\r\ntype Props = {\r\n items?: MenuNavigationItemTypeItem[];\r\n action?: MenuButton;\r\n};\r\n\r\nconst RightSideNav = ({items, action}: Props): React.ReactElement<Props> => {\r\n const getNavItem = (item: MenuNavigationItemTypeItem) => {\r\n if (item?.disabled) {\r\n return (\r\n <NavItem as={Button} className=\"disabled\" key={item?.label}>\r\n {item?.label}\r\n </NavItem>\r\n );\r\n } else {\r\n return (\r\n <NavItem\r\n as={NavLink}\r\n to={item?.to || ''}\r\n key={item?.label}\r\n onMouseDown={defaultOnMouseDownHandler}\r\n onClick={(e:React.MouseEvent) => item.action && item.action(e)}>\r\n {item?.label}\r\n </NavItem>\r\n );\r\n }\r\n };\r\n\r\n\r\n\r\n return (\r\n <NavContainer>\r\n {items?.reverse().map(no => getNavItem(no))}\r\n\r\n {\r\n action && !action.tooltip &&\r\n <StyledButton variant=\"secondary\" onClick={action?.action} {...{...action, action: undefined}}>\r\n {action.label}\r\n </StyledButton>\r\n }\r\n {\r\n action && !!action.tooltip &&\r\n <TooltipWrapper {...action.tooltip}>\r\n <StyledButton variant=\"secondary\" onClick={action?.action} {...{...action, action: undefined}}>\r\n {action.label}\r\n </StyledButton>\r\n </TooltipWrapper>\r\n }\r\n\r\n </NavContainer>\r\n );\r\n};\r\n\r\nexport default RightSideNav;\r\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -91,7 +91,7 @@ var Checkbox = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
91
91
|
var cls = "".concat(size, " ").concat(className || '', " ").concat(disabled ? ' disabled' : '', " ").concat(readOnly ? ' readonly' : '');
|
|
92
92
|
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(StyledCheckBox, _objectSpread(_objectSpread({
|
|
93
93
|
ref: ref,
|
|
94
|
-
|
|
94
|
+
disabled: disabled,
|
|
95
95
|
className: cls,
|
|
96
96
|
"aria-checked": selected,
|
|
97
97
|
$selected: selected,
|