@laerdal/life-react-components 1.0.1-dev.22.full → 1.0.1-dev.29.full

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.
Files changed (176) hide show
  1. package/dist/esm/Banners/Banner.js +11 -8
  2. package/dist/esm/Banners/Banner.js.map +1 -1
  3. package/dist/esm/Button/Anchor.js +76 -0
  4. package/dist/esm/Button/Anchor.js.map +1 -0
  5. package/dist/esm/Button/BackButton.js +1 -1
  6. package/dist/esm/Button/BackButton.js.map +1 -1
  7. package/dist/esm/Button/Button.js +46 -19
  8. package/dist/esm/Button/Button.js.map +1 -1
  9. package/dist/esm/Button/DualFunctionButton.js +111 -0
  10. package/dist/esm/Button/DualFunctionButton.js.map +1 -0
  11. package/dist/esm/Button/Iconbutton.js +21 -1
  12. package/dist/esm/Button/Iconbutton.js.map +1 -1
  13. package/dist/esm/Button/__tests__/Button.test.js +2 -1
  14. package/dist/esm/Button/__tests__/Button.test.js.map +1 -1
  15. package/dist/esm/Button/index.js +1 -0
  16. package/dist/esm/Button/index.js.map +1 -1
  17. package/dist/esm/Dropdown/BasicDropdown.js +60 -127
  18. package/dist/esm/Dropdown/BasicDropdown.js.map +1 -1
  19. package/dist/esm/Dropdown/ChipDropdownInput.js +41 -132
  20. package/dist/esm/Dropdown/ChipDropdownInput.js.map +1 -1
  21. package/dist/esm/Dropdown/CommonStyling.js +20 -15
  22. package/dist/esm/Dropdown/CommonStyling.js.map +1 -1
  23. package/dist/esm/Dropdown/DropdownButton.js +2 -2
  24. package/dist/esm/Dropdown/DropdownButton.js.map +1 -1
  25. package/dist/esm/Dropdown/DropdownContent.js +424 -0
  26. package/dist/esm/Dropdown/DropdownContent.js.map +1 -0
  27. package/dist/esm/Dropdown/DropdownFilter.js +42 -151
  28. package/dist/esm/Dropdown/DropdownFilter.js.map +1 -1
  29. package/dist/esm/GlobalNavigationBar/UserMenu/UserMenu.js +15 -17
  30. package/dist/esm/GlobalNavigationBar/UserMenu/UserMenu.js.map +1 -1
  31. package/dist/esm/InputFields/Checkbox.js +19 -10
  32. package/dist/esm/InputFields/Checkbox.js.map +1 -1
  33. package/dist/esm/InputFields/QuickSearch.js +22 -12
  34. package/dist/esm/InputFields/QuickSearch.js.map +1 -1
  35. package/dist/esm/InputFields/RadioButton.js +18 -11
  36. package/dist/esm/InputFields/RadioButton.js.map +1 -1
  37. package/dist/esm/InputFields/components/SearchBarInput.js +1 -1
  38. package/dist/esm/InputFields/components/SearchBarInput.js.map +1 -1
  39. package/dist/esm/Modals/ModalDialog.js +14 -14
  40. package/dist/esm/Modals/ModalDialog.js.map +1 -1
  41. package/dist/esm/Modals/ModalStyles.js +3 -2
  42. package/dist/esm/Modals/ModalStyles.js.map +1 -1
  43. package/dist/esm/Paginator/Paginator.js +18 -8
  44. package/dist/esm/Paginator/Paginator.js.map +1 -1
  45. package/dist/esm/Paginator/__tests__/Paginator.test.js +1 -1
  46. package/dist/esm/Paginator/__tests__/Paginator.test.js.map +1 -1
  47. package/dist/esm/Table/Table.js +2 -1
  48. package/dist/esm/Table/Table.js.map +1 -1
  49. package/dist/esm/Tabs/TabLink.js +1 -1
  50. package/dist/esm/Tabs/TabLink.js.map +1 -1
  51. package/dist/esm/Toasters/Toast.js +2 -1
  52. package/dist/esm/Toasters/Toast.js.map +1 -1
  53. package/dist/esm/types.js +8 -0
  54. package/dist/esm/types.js.map +1 -1
  55. package/dist/js/Banners/Banner.js +13 -11
  56. package/dist/js/Banners/Banner.js.map +1 -1
  57. package/dist/js/Button/Anchor.d.ts +7 -0
  58. package/dist/js/Button/Anchor.js +66 -0
  59. package/dist/js/Button/Anchor.js.map +1 -0
  60. package/dist/js/Button/BackButton.js +1 -1
  61. package/dist/js/Button/BackButton.js.map +1 -1
  62. package/dist/js/Button/Button.d.ts +4 -1
  63. package/dist/js/Button/Button.js +44 -18
  64. package/dist/js/Button/Button.js.map +1 -1
  65. package/dist/js/Button/DualFunctionButton.d.ts +12 -0
  66. package/dist/js/Button/DualFunctionButton.js +148 -0
  67. package/dist/js/Button/DualFunctionButton.js.map +1 -0
  68. package/dist/js/Button/Iconbutton.d.ts +1 -0
  69. package/dist/js/Button/Iconbutton.js +23 -3
  70. package/dist/js/Button/Iconbutton.js.map +1 -1
  71. package/dist/js/Button/__tests__/Button.test.js +3 -1
  72. package/dist/js/Button/__tests__/Button.test.js.map +1 -1
  73. package/dist/js/Button/index.d.ts +1 -0
  74. package/dist/js/Button/index.js +8 -0
  75. package/dist/js/Button/index.js.map +1 -1
  76. package/dist/js/Dropdown/BasicDropdown.d.ts +9 -2
  77. package/dist/js/Dropdown/BasicDropdown.js +67 -133
  78. package/dist/js/Dropdown/BasicDropdown.js.map +1 -1
  79. package/dist/js/Dropdown/ChipDropdownInput.js +45 -138
  80. package/dist/js/Dropdown/ChipDropdownInput.js.map +1 -1
  81. package/dist/js/Dropdown/CommonStyling.d.ts +6 -2
  82. package/dist/js/Dropdown/CommonStyling.js +17 -6
  83. package/dist/js/Dropdown/CommonStyling.js.map +1 -1
  84. package/dist/js/Dropdown/DropdownButton.js +1 -1
  85. package/dist/js/Dropdown/DropdownButton.js.map +1 -1
  86. package/dist/js/Dropdown/DropdownContent.d.ts +45 -0
  87. package/dist/js/Dropdown/DropdownContent.js +476 -0
  88. package/dist/js/Dropdown/DropdownContent.js.map +1 -0
  89. package/dist/js/Dropdown/DropdownFilter.js +59 -186
  90. package/dist/js/Dropdown/DropdownFilter.js.map +1 -1
  91. package/dist/js/GlobalNavigationBar/UserMenu/UserMenu.js +7 -17
  92. package/dist/js/GlobalNavigationBar/UserMenu/UserMenu.js.map +1 -1
  93. package/dist/js/InputFields/Checkbox.d.ts +5 -3
  94. package/dist/js/InputFields/Checkbox.js +16 -9
  95. package/dist/js/InputFields/Checkbox.js.map +1 -1
  96. package/dist/js/InputFields/QuickSearch.js +24 -6
  97. package/dist/js/InputFields/QuickSearch.js.map +1 -1
  98. package/dist/js/InputFields/RadioButton.d.ts +4 -2
  99. package/dist/js/InputFields/RadioButton.js +15 -10
  100. package/dist/js/InputFields/RadioButton.js.map +1 -1
  101. package/dist/js/InputFields/components/SearchBarInput.js +1 -1
  102. package/dist/js/InputFields/components/SearchBarInput.js.map +1 -1
  103. package/dist/js/Modals/ModalDialog.d.ts +2 -1
  104. package/dist/js/Modals/ModalDialog.js +15 -14
  105. package/dist/js/Modals/ModalDialog.js.map +1 -1
  106. package/dist/js/Modals/ModalStyles.d.ts +4 -3
  107. package/dist/js/Modals/ModalStyles.js +4 -2
  108. package/dist/js/Modals/ModalStyles.js.map +1 -1
  109. package/dist/js/Paginator/Paginator.js +7 -5
  110. package/dist/js/Paginator/Paginator.js.map +1 -1
  111. package/dist/js/Paginator/__tests__/Paginator.test.js +1 -1
  112. package/dist/js/Paginator/__tests__/Paginator.test.js.map +1 -1
  113. package/dist/js/Table/Table.js +3 -1
  114. package/dist/js/Table/Table.js.map +1 -1
  115. package/dist/js/Tabs/TabLink.js +1 -1
  116. package/dist/js/Tabs/TabLink.js.map +1 -1
  117. package/dist/js/Toasters/Toast.js +1 -1
  118. package/dist/js/Toasters/Toast.js.map +1 -1
  119. package/dist/js/types.d.ts +5 -0
  120. package/dist/js/types.js +10 -1
  121. package/dist/js/types.js.map +1 -1
  122. package/dist/umd/Banners/Banner.js +11 -8
  123. package/dist/umd/Banners/Banner.js.map +1 -1
  124. package/dist/umd/Button/Anchor.js +201 -0
  125. package/dist/umd/Button/Anchor.js.map +1 -0
  126. package/dist/umd/Button/BackButton.js +1 -1
  127. package/dist/umd/Button/BackButton.js.map +1 -1
  128. package/dist/umd/Button/Button.js +48 -22
  129. package/dist/umd/Button/Button.js.map +1 -1
  130. package/dist/umd/Button/DualFunctionButton.js +237 -0
  131. package/dist/umd/Button/DualFunctionButton.js.map +1 -0
  132. package/dist/umd/Button/Iconbutton.js +21 -1
  133. package/dist/umd/Button/Iconbutton.js.map +1 -1
  134. package/dist/umd/Button/__tests__/Button.test.js +5 -5
  135. package/dist/umd/Button/__tests__/Button.test.js.map +1 -1
  136. package/dist/umd/Button/index.js +10 -4
  137. package/dist/umd/Button/index.js.map +1 -1
  138. package/dist/umd/Dropdown/BasicDropdown.js +64 -131
  139. package/dist/umd/Dropdown/BasicDropdown.js.map +1 -1
  140. package/dist/umd/Dropdown/ChipDropdownInput.js +44 -134
  141. package/dist/umd/Dropdown/ChipDropdownInput.js.map +1 -1
  142. package/dist/umd/Dropdown/CommonStyling.js +23 -19
  143. package/dist/umd/Dropdown/CommonStyling.js.map +1 -1
  144. package/dist/umd/Dropdown/DropdownButton.js +1 -1
  145. package/dist/umd/Dropdown/DropdownButton.js.map +1 -1
  146. package/dist/umd/Dropdown/DropdownContent.js +458 -0
  147. package/dist/umd/Dropdown/DropdownContent.js.map +1 -0
  148. package/dist/umd/Dropdown/DropdownFilter.js +47 -155
  149. package/dist/umd/Dropdown/DropdownFilter.js.map +1 -1
  150. package/dist/umd/GlobalNavigationBar/UserMenu/UserMenu.js +18 -21
  151. package/dist/umd/GlobalNavigationBar/UserMenu/UserMenu.js.map +1 -1
  152. package/dist/umd/InputFields/Checkbox.js +22 -14
  153. package/dist/umd/InputFields/Checkbox.js.map +1 -1
  154. package/dist/umd/InputFields/QuickSearch.js +22 -12
  155. package/dist/umd/InputFields/QuickSearch.js.map +1 -1
  156. package/dist/umd/InputFields/RadioButton.js +21 -15
  157. package/dist/umd/InputFields/RadioButton.js.map +1 -1
  158. package/dist/umd/InputFields/components/SearchBarInput.js +1 -1
  159. package/dist/umd/InputFields/components/SearchBarInput.js.map +1 -1
  160. package/dist/umd/Modals/ModalDialog.js +17 -18
  161. package/dist/umd/Modals/ModalDialog.js.map +1 -1
  162. package/dist/umd/Modals/ModalStyles.js +6 -6
  163. package/dist/umd/Modals/ModalStyles.js.map +1 -1
  164. package/dist/umd/Paginator/Paginator.js +18 -8
  165. package/dist/umd/Paginator/Paginator.js.map +1 -1
  166. package/dist/umd/Paginator/__tests__/Paginator.test.js +1 -1
  167. package/dist/umd/Paginator/__tests__/Paginator.test.js.map +1 -1
  168. package/dist/umd/Table/Table.js +5 -5
  169. package/dist/umd/Table/Table.js.map +1 -1
  170. package/dist/umd/Tabs/TabLink.js +1 -1
  171. package/dist/umd/Tabs/TabLink.js.map +1 -1
  172. package/dist/umd/Toasters/Toast.js +1 -1
  173. package/dist/umd/Toasters/Toast.js.map +1 -1
  174. package/dist/umd/types.js +8 -0
  175. package/dist/umd/types.js.map +1 -1
  176. package/package.json +1 -1
@@ -1,16 +1,16 @@
1
1
  (function (global, factory) {
2
2
  if (typeof define === "function" && define.amd) {
3
- define(["exports", "prop-types", "react", "styled-components", "../LoadingIndicator", "../styles", "../styles/typography"], factory);
3
+ define(["exports", "prop-types", "react", "styled-components", "../LoadingIndicator", "../styles/typography", "../styles", "../types"], factory);
4
4
  } else if (typeof exports !== "undefined") {
5
- factory(exports, require("prop-types"), require("react"), require("styled-components"), require("../LoadingIndicator"), require("../styles"), require("../styles/typography"));
5
+ factory(exports, require("prop-types"), require("react"), require("styled-components"), require("../LoadingIndicator"), require("../styles/typography"), require("../styles"), require("../types"));
6
6
  } else {
7
7
  var mod = {
8
8
  exports: {}
9
9
  };
10
- factory(mod.exports, global.propTypes, global.react, global.styledComponents, global.LoadingIndicator, global.styles, global.typography);
10
+ factory(mod.exports, global.propTypes, global.react, global.styledComponents, global.LoadingIndicator, global.typography, global.styles, global.types);
11
11
  global.undefined = mod.exports;
12
12
  }
13
- })(this, function (exports, _propTypes, _react, _styledComponents, _LoadingIndicator, _styles, _typography) {
13
+ })(this, function (exports, _propTypes, _react, _styledComponents, _LoadingIndicator, _typography, _styles, _types) {
14
14
  "use strict";
15
15
 
16
16
  Object.defineProperty(exports, "__esModule", {
@@ -79,7 +79,7 @@
79
79
  };
80
80
  }
81
81
 
82
- const _excluded = ["children", "variant", "type", "size", "width", "testId", "disabled", "icon"],
82
+ const _excluded = ["children", "variant", "type", "size", "width", "imageExtraMargin", "testId", "disabled", "flatEdge", "icon"],
83
83
  _excluded2 = ["loading"];
84
84
 
85
85
  function _extends() {
@@ -136,6 +136,20 @@
136
136
  return target;
137
137
  }
138
138
 
139
+ const getBorderRadius = (flatEdge, radius) => {
140
+ switch (flatEdge) {
141
+ case 'left':
142
+ return `0px ${radius}px ${radius}px 0px`;
143
+
144
+ case 'right':
145
+ return `${radius}px 0px 0px ${radius}px`;
146
+
147
+ case 'none':
148
+ default:
149
+ return `${radius}px`;
150
+ }
151
+ };
152
+
139
153
  const tabbedHereStyle = (variant, colorTheme) => {
140
154
  switch (variant) {
141
155
  case 'primary':
@@ -146,7 +160,7 @@
146
160
  box-shadow: 0px 4px 12px ${_styles.COLORS.focus_25}, 0px 0px 8px ${_styles.COLORS.focus} !important;
147
161
  background-color: ${colorTheme === 'teal' ? _styles.COLORS.accent1_700 : colorTheme === 'dark' ? _styles.COLORS.primary_100 : _styles.COLORS.primary_700};
148
162
  border-color: ${colorTheme === 'teal' ? _styles.COLORS.accent1_700 : colorTheme === 'dark' ? _styles.COLORS.primary_100 : _styles.COLORS.primary_700};
149
- color: ${colorTheme === 'dark' ? _styles.COLORS.primary_500 : _styles.COLORS.white};
163
+ color: ${colorTheme === 'dark' ? _styles.COLORS.primary_600 : _styles.COLORS.white};
150
164
  }
151
165
  `;
152
166
 
@@ -195,19 +209,19 @@
195
209
  padding: 0;
196
210
  margin: 0;
197
211
  box-sizing: border-box;
198
- min-height: ${props => props.size === 'big' ? '56px' : '48px'};
212
+ min-height: ${props => props.size === _types.Size.Large ? '56px' : '48px'};
199
213
  &.loading-state {
200
214
  cursor: wait;
201
215
  }
202
216
  &:focus:not(:focus-visible),
203
217
  &:focus:not(:focus-visible) > div.button-content {
204
- outline: 0 !important;
218
+ outline: none !important;
205
219
  }
206
220
  div.button-content {
207
- ${props => props.size === 'big' ? (0, _typography.ComponentLStyling)(_typography.ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? _styles.COLORS.primary_800 : _styles.COLORS.white) : props.size === 'small' ? (0, _typography.ComponentSStyling)(_typography.ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? _styles.COLORS.primary_800 : _styles.COLORS.white) : (0, _typography.ComponentMStyling)(_typography.ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? _styles.COLORS.primary_800 : _styles.COLORS.white)};
221
+ ${props => props.size === _types.Size.Large ? (0, _typography.ComponentLStyling)(_typography.ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? _styles.COLORS.primary_800 : _styles.COLORS.white) : props.size === _types.Size.Small ? (0, _typography.ComponentSStyling)(_typography.ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? _styles.COLORS.primary_800 : _styles.COLORS.white) : (0, _typography.ComponentMStyling)(_typography.ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? _styles.COLORS.primary_800 : _styles.COLORS.white)};
208
222
 
209
223
  background-color: ${props => props.colorTheme === 'teal' ? _styles.COLORS.accent1 : props?.colorTheme === 'dark' ? _styles.COLORS.white : _styles.COLORS.primary};
210
- border-radius: 8px;
224
+ border-radius: ${props => getBorderRadius(props.flatEdge, 8)};
211
225
  border-width: 2px;
212
226
  border-style: solid;
213
227
  border-color: ${props => props.colorTheme === 'teal' ? _styles.COLORS.accent1 : props?.colorTheme === 'dark' ? _styles.COLORS.white : _styles.COLORS.primary};
@@ -215,14 +229,14 @@
215
229
  width: ${props => props.width};
216
230
  position: relative;
217
231
 
218
- min-height: ${props => props.size === 'big' ? '56px' : props.size === 'small' ? '32px' : '40px'};
232
+ min-height: ${props => props.size === _types.Size.Large ? '56px' : props.size === _types.Size.Small ? '32px' : '40px'};
219
233
  box-sizing: border-box;
220
234
  display: flex;
221
235
  align-items: center;
222
236
  justify-content: center;
223
237
  gap: 4px;
224
238
  // paddings have -2px for border
225
- padding: ${props => props.size === 'big' ? '14px 18px' : props.size === 'small' ? '4px 10px' : '6px 14px'};
239
+ padding: ${props => props.size === _types.Size.Large ? '14px 18px' : props.size === _types.Size.Small ? '4px 10px' : '6px 14px'};
226
240
 
227
241
  span.loading {
228
242
  opacity: 0;
@@ -231,20 +245,24 @@
231
245
  margin-left: -4px;
232
246
  margin-top: -2px;
233
247
  margin-bottom: -2px;
234
- width: ${props => props.size === 'big' ? '28px' : props.size === 'small' ? '20px' : '24px'};
235
- height: ${props => props.size === 'big' ? '28px' : props.size === 'small' ? '20px' : '24px'};
248
+ width: ${props => props.size === _types.Size.Large ? '28px' : props.size === _types.Size.Small ? '20px' : '24px'};
249
+ height: ${props => props.size === _types.Size.Large ? '28px' : props.size === _types.Size.Small ? '20px' : '24px'};
236
250
  svg {
237
- width: ${props => props.size === 'big' ? '28px' : props.size === 'small' ? '20px' : '24px'} !important;
238
- height: ${props => props.size === 'big' ? '28px' : props.size === 'small' ? '20px' : '24px'} !important;
251
+ width: ${props => props.size === _types.Size.Large ? '28px' : props.size === _types.Size.Small ? '20px' : '24px'} !important;
252
+ height: ${props => props.size === _types.Size.Large ? '28px' : props.size === _types.Size.Small ? '20px' : '24px'} !important;
239
253
  }
240
254
  }
241
255
 
256
+ .extramargin {
257
+ margin-right: 9px;
258
+ }
259
+
242
260
  div {
243
261
  position: absolute;
244
262
  width: 100%;
245
263
  svg {
246
- height: ${props => props.size === 'big' ? '28px' : props.size === 'small' ? '20px' : '24px'};
247
- width: ${props => props.size === 'big' ? '28px' : props.size === 'small' ? '20px' : '24px'};
264
+ height: ${props => props.size === _types.Size.Large ? '28px' : props.size === _types.Size.Small ? '20px' : '24px'};
265
+ width: ${props => props.size === _types.Size.Large ? '28px' : props.size === _types.Size.Small ? '20px' : '24px'};
248
266
  path {
249
267
  fill: ${props => props.colorTheme === 'dark' ? _styles.COLORS.primary : _styles.COLORS.white};
250
268
  }
@@ -487,7 +505,7 @@
487
505
  cursor: pointer;
488
506
 
489
507
  text-decoration: underline;
490
- ${props => props.size === 'big' ? (0, _typography.ComponentLStyling)(_typography.ComponentTextStyle.Bold, props.colorTheme === 'teal' ? _styles.COLORS.accent1 : _styles.COLORS.primary) : props.size === 'small' ? (0, _typography.ComponentSStyling)(_typography.ComponentTextStyle.Bold, props.colorTheme === 'teal' ? _styles.COLORS.accent1 : _styles.COLORS.primary) : (0, _typography.ComponentMStyling)(_typography.ComponentTextStyle.Bold, props.colorTheme === 'teal' ? _styles.COLORS.accent1 : _styles.COLORS.primary)};
508
+ ${props => props.size === _types.Size.Large ? (0, _typography.ComponentLStyling)(_typography.ComponentTextStyle.Bold, props.colorTheme === 'teal' ? _styles.COLORS.accent1 : _styles.COLORS.primary) : props.size === _types.Size.Small ? (0, _typography.ComponentSStyling)(_typography.ComponentTextStyle.Bold, props.colorTheme === 'teal' ? _styles.COLORS.accent1 : _styles.COLORS.primary) : (0, _typography.ComponentMStyling)(_typography.ComponentTextStyle.Bold, props.colorTheme === 'teal' ? _styles.COLORS.accent1 : _styles.COLORS.primary)};
491
509
 
492
510
  &:hover,
493
511
  &:focus,
@@ -514,10 +532,12 @@
514
532
  children = 'Primary Button',
515
533
  variant = 'primary',
516
534
  type = 'button',
517
- size = 'normal',
535
+ size = _types.Size.Medium,
518
536
  width = 'auto',
537
+ imageExtraMargin,
519
538
  testId,
520
539
  disabled,
540
+ flatEdge,
521
541
  icon
522
542
  } = _ref,
523
543
  props = _objectWithoutProperties(_ref, _excluded); // Let's filter out properties that we don't need to render.
@@ -532,7 +552,7 @@
532
552
  const [tabbedHere, setTabbedHere] = React.useState(false);
533
553
 
534
554
  const renderContent = () => /*#__PURE__*/React.createElement(React.Fragment, null, icon && /*#__PURE__*/React.createElement("span", {
535
- className: loading ? 'icon loading' : 'icon'
555
+ className: (imageExtraMargin ? 'extramargin ' : '') + (loading ? 'icon loading' : 'icon')
536
556
  }, icon), /*#__PURE__*/React.createElement("span", {
537
557
  className: loading ? 'label loading' : 'label'
538
558
  }, children), loading && /*#__PURE__*/React.createElement(_LoadingIndicator.LoadingIndicator, null)); // Let's render button
@@ -544,6 +564,7 @@
544
564
  disabled: disabled,
545
565
  type: type,
546
566
  size: size,
567
+ flatEdge: flatEdge,
547
568
  width: width,
548
569
  "data-testid": testId,
549
570
  className: props.loading ? 'loading-state ' + props.className : ' ' + props.className,
@@ -566,6 +587,7 @@
566
587
  disabled: disabled,
567
588
  type: type,
568
589
  size: size,
590
+ flatEdge: flatEdge,
569
591
  width: width,
570
592
  "data-testid": testId,
571
593
  className: props.loading ? 'loading-state ' + props.className : ' ' + props.className,
@@ -587,6 +609,7 @@
587
609
  return /*#__PURE__*/React.createElement(Tertiary, _extends({}, renderProps, {
588
610
  disabled: disabled,
589
611
  type: type,
612
+ flatEdge: flatEdge,
590
613
  size: size,
591
614
  width: width,
592
615
  "data-testid": testId,
@@ -619,6 +642,7 @@
619
642
  disabled: disabled,
620
643
  type: type,
621
644
  size: size,
645
+ flatEdge: flatEdge,
622
646
  width: width,
623
647
  "data-testid": testId,
624
648
  className: props.loading ? 'loading-state ' + props.className : ' ' + props.className,
@@ -639,6 +663,7 @@
639
663
  case 'critical':
640
664
  return /*#__PURE__*/React.createElement(Critical, _extends({}, renderProps, {
641
665
  disabled: disabled,
666
+ flatEdge: flatEdge,
642
667
  type: type,
643
668
  size: size,
644
669
  width: width,
@@ -660,6 +685,7 @@
660
685
 
661
686
  default:
662
687
  return /*#__PURE__*/React.createElement(Primary, _extends({}, renderProps, {
688
+ flatEdge: flatEdge,
663
689
  disabled: disabled,
664
690
  type: type,
665
691
  size: size,
@@ -686,7 +712,7 @@
686
712
  variant: _propTypes2.default.oneOf(['primary', 'secondary', 'tertiary', 'text', 'correct', 'critical']),
687
713
  role: _propTypes2.default.oneOfType([_propTypes2.default.oneOf(['button']), _propTypes2.default.string]),
688
714
  title: _propTypes2.default.string,
689
- size: _propTypes2.default.oneOf(['small', 'normal', 'big']),
715
+ imageExtraMargin: _propTypes2.default.bool,
690
716
  colorTheme: _propTypes2.default.oneOf(['teal', 'dark']),
691
717
  width: _propTypes2.default.oneOfType([_propTypes2.default.oneOf(['auto']), _propTypes2.default.string]),
692
718
  loading: _propTypes2.default.bool,
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/Button/Button.tsx"],"names":["tabbedHereStyle","css","COLORS","focus_25","focus","colorTheme","primary_700","white","primary","primary_500","Primary","styled","button","props","ComponentLStyling","ComponentTextStyle","ComponentSStyling","ComponentMStyling","width","primary_800","neutral_100","neutral_300","Secondary","Tertiary","primary_20","primary_100","Correct","correct_500","correct_700","correct_800","Critical","critical_500","critical_700","critical_800","Text","neutral_500","variant","role","title","size","loading","testId","tabbedHere","icon","Button","children","type","renderProps","supressFocusRef","React","renderContent","e","setTabbedHere"],"mappings":";;;;;;;;;;;;;;;;;;;;;MAAA,K;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAMA,QAAMA,eAAe,GAAG,CAAA,OAAA,EAAA,UAAA,KAA0C;AAChE,YAAA,OAAA;AACE,WAAA,SAAA;AACE,eAAOC,qBAAI;AACjB;AACA;AACA;AACA,qCAAqCC,eAAOC,QAAS,iBAAgBD,eAAOE,KAAM;AAClF,8BAA8BC,UAAU,KAAVA,MAAAA,GAAwBH,eAAxBG,WAAAA,GAA6CA,UAAU,KAAVA,MAAAA,GAAwBH,eAAxBG,WAAAA,GAA6CH,eAAOI,WAAY;AAC3I,0BAA0BD,UAAU,KAAVA,MAAAA,GAAwBH,eAAxBG,WAAAA,GAA6CA,UAAU,KAAVA,MAAAA,GAAwBH,eAAxBG,WAAAA,GAA6CH,eAAOI,WAAY;AACvI,mBAAmBD,UAAU,KAAVA,MAAAA,GAAwBH,eAAxBG,WAAAA,GAA6CH,eAAOK,KAAM;AAC7E;AARM,OAAA;;AAUF,WAAA,WAAA;AACE,eAAON,qBAAI;AACjB;AACA;AACA;AACA,qCAAqCC,eAAOC,QAAS,iBAAgBD,eAAOE,KAAM;AAClF,8BAA8BC,UAAU,KAAVA,MAAAA,GAAAA,aAAAA,GAAwCH,eAAOK,KAAM;AACnF,0BAA0BF,UAAU,KAAVA,MAAAA,GAAwBH,eAAxBG,OAAAA,GAAyCA,UAAU,KAAVA,MAAAA,GAAwBH,eAAxBG,WAAAA,GAA6CH,eAAOM,OAAQ;AAC/H,mBAAmBH,UAAU,KAAVA,MAAAA,GAAwBH,eAAxBG,KAAAA,GAAuCH,eAAOO,WAAY;AAC7E;AARM,OAAA;;AAUF,WAAA,UAAA;AACE,eAAOR,qBAAI;AACjB;AACA;AACA;AACA,qCAAqCC,eAAOC,QAAS,iBAAgBD,eAAOE,KAAM;AAClF,8BAA8BF,eAAOK,KAAM;AAC3C,0BAA0BF,UAAU,KAAVA,MAAAA,GAAwBH,eAAxBG,OAAAA,GAAyCH,eAAOM,OAAQ;AAClF,mBAAmBH,UAAU,KAAVA,MAAAA,GAAwBH,eAAxBG,WAAAA,GAA6CH,eAAOO,WAAY;AACnF;AARM,OAAA;;AAWF;AACE,eAAOR,qBAAI;AACjB;AACA;AACA;AACA,qCAAqCC,eAAOC,QAAS,iBAAgBD,eAAOE,KAAM;AAClF,8BAA8BC,UAAU,KAAVA,MAAAA,GAAwBH,eAAxBG,WAAAA,GAA6CA,UAAU,KAAVA,MAAAA,GAAwBH,eAAxBG,WAAAA,GAA6CH,eAAOI,WAAY;AAC3I,0BAA0BD,UAAU,KAAVA,MAAAA,GAAwBH,eAAxBG,WAAAA,GAA6CA,UAAU,KAAVA,MAAAA,GAAwBH,eAAxBG,WAAAA,GAA6CH,eAAOI,WAAY;AACvI,mBAAmBD,UAAU,KAAVA,MAAAA,GAAwBH,eAAxBG,WAAAA,GAA6CH,eAAOK,KAAM;AAC7E;AARM,OAAA;AApCJ;AADF,GAAA;;AAkDA,QAAMG,OAAO,GAAGC,2BAAOC,MAAoB;AAC3C;AACA;AACA;AACA;AACA;AACA;AACA,gBAAiBC,KAAD,IAAYA,KAAK,CAALA,IAAAA,KAAAA,KAAAA,GAAAA,MAAAA,GAAgC,MAAQ;AACpE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAOA,KAAD,IACAA,KAAK,CAALA,IAAAA,KAAAA,KAAAA,GACIC,mCAAkBC,+BAAD,IAAjBD,EAA2CD,KAAK,EAALA,UAAAA,KAAAA,MAAAA,GAA+BX,eAA/BW,WAAAA,GAAoDX,eADnGW,KACIC,CADJD,GAEIA,KAAK,CAALA,IAAAA,KAAAA,OAAAA,GACAG,mCAAkBD,+BAAD,IAAjBC,EAA2CH,KAAK,EAALA,UAAAA,KAAAA,MAAAA,GAA+BX,eAA/BW,WAAAA,GAAoDX,eAD/FW,KACAG,CADAH,GAEAI,mCAAkBF,+BAAD,IAAjBE,EAA2CJ,KAAK,EAALA,UAAAA,KAAAA,MAAAA,GAA+BX,eAA/BW,WAAAA,GAAoDX,eAA9E,KAAjBe,CAA6G;AACvH;AACA,wBAAyBJ,KAAD,IAAYA,KAAK,CAALA,UAAAA,KAAAA,MAAAA,GAA8BX,eAA9BW,OAAAA,GAA+CA,KAAK,EAALA,UAAAA,KAAAA,MAAAA,GAA+BX,eAA/BW,KAAAA,GAA8CX,eAAOM,OAAS;AACjJ;AACA;AACA;AACA,oBAAqBK,KAAD,IAAYA,KAAK,CAALA,UAAAA,KAAAA,MAAAA,GAA8BX,eAA9BW,OAAAA,GAA+CA,KAAK,EAALA,UAAAA,KAAAA,MAAAA,GAA+BX,eAA/BW,KAAAA,GAA8CX,eAAOM,OAAS;AAC7I;AACA,aAAcK,KAAD,IAAWA,KAAK,CAACK,KAAM;AACpC;AACA;AACA,kBAAmBL,KAAD,IAAYA,KAAK,CAALA,IAAAA,KAAAA,KAAAA,GAAAA,MAAAA,GAAgCA,KAAK,CAALA,IAAAA,KAAAA,OAAAA,GAAAA,MAAAA,GAAkC,MAAQ;AACxG;AACA;AACA;AACA;AACA;AACA;AACA,eAAgBA,KAAD,IAAYA,KAAK,CAALA,IAAAA,KAAAA,KAAAA,GAAAA,WAAAA,GAAqCA,KAAK,CAALA,IAAAA,KAAAA,OAAAA,GAAAA,UAAAA,GAAsC,UAAY;AAClH;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAgBA,KAAD,IAAYA,KAAK,CAALA,IAAAA,KAAAA,KAAAA,GAAAA,MAAAA,GAAgCA,KAAK,CAALA,IAAAA,KAAAA,OAAAA,GAAAA,MAAAA,GAAkC,MAAQ;AACrG,gBAAiBA,KAAD,IAAYA,KAAK,CAALA,IAAAA,KAAAA,KAAAA,GAAAA,MAAAA,GAAgCA,KAAK,CAALA,IAAAA,KAAAA,OAAAA,GAAAA,MAAAA,GAAkC,MAAQ;AACtG;AACA,iBAAkBA,KAAD,IAAYA,KAAK,CAALA,IAAAA,KAAAA,KAAAA,GAAAA,MAAAA,GAAgCA,KAAK,CAALA,IAAAA,KAAAA,OAAAA,GAAAA,MAAAA,GAAkC,MAAQ;AACvG,kBAAmBA,KAAD,IAAYA,KAAK,CAALA,IAAAA,KAAAA,KAAAA,GAAAA,MAAAA,GAAgCA,KAAK,CAALA,IAAAA,KAAAA,OAAAA,GAAAA,MAAAA,GAAkC,MAAQ;AACxG;AACA;AACA;AACA;AACA;AACA;AACA;AACA,kBAAmBA,KAAD,IAAYA,KAAK,CAALA,IAAAA,KAAAA,KAAAA,GAAAA,MAAAA,GAAgCA,KAAK,CAALA,IAAAA,KAAAA,OAAAA,GAAAA,MAAAA,GAAkC,MAAQ;AACxG,iBAAkBA,KAAD,IAAYA,KAAK,CAALA,IAAAA,KAAAA,KAAAA,GAAAA,MAAAA,GAAgCA,KAAK,CAALA,IAAAA,KAAAA,OAAAA,GAAAA,MAAAA,GAAkC,MAAQ;AACvG;AACA,kBAAmBA,KAAD,IAAYA,KAAK,CAALA,UAAAA,KAAAA,MAAAA,GAA8BX,eAA9BW,OAAAA,GAA+CX,eAAOK,KAAO;AAC3F;AACA;AACA;AACA;AACA;AACA;AACA,wBAAyBM,KAAD,IAAYA,KAAK,CAALA,UAAAA,KAAAA,MAAAA,GAA8BX,eAA9BW,WAAAA,GAAmDA,KAAK,EAALA,UAAAA,KAAAA,MAAAA,GAA+BX,eAA/BW,WAAAA,GAAoDX,eAAOI,WAAa;AAC/J,oBAAqBO,KAAD,IAAYA,KAAK,CAALA,UAAAA,KAAAA,MAAAA,GAA8BX,eAA9BW,WAAAA,GAAmDA,KAAK,EAALA,UAAAA,KAAAA,MAAAA,GAA+BX,eAA/BW,WAAAA,GAAoDX,eAAOI,WAAa;AAC3J,aAAcO,KAAD,IAAYA,KAAK,EAALA,UAAAA,KAAAA,MAAAA,GAA+BX,eAA/BW,WAAAA,GAAoDX,eAAOK,KAAO;AAC3F;AACA;AACA;AACA,wBAAyBM,KAAD,IAAYA,KAAK,CAALA,UAAAA,KAAAA,MAAAA,GAA8BX,eAA9BW,WAAAA,GAAmDA,KAAK,EAALA,UAAAA,KAAAA,MAAAA,GAA+BX,eAA/BW,WAAAA,GAAoDX,eAAOiB,WAAa;AAC/J,oBAAqBN,KAAD,IAAYA,KAAK,CAALA,UAAAA,KAAAA,MAAAA,GAA8BX,eAA9BW,WAAAA,GAAmDA,KAAK,EAALA,UAAAA,KAAAA,MAAAA,GAA+BX,eAA/BW,WAAAA,GAAoDX,eAAOiB,WAAa;AAC3J;AACA,aAAcN,KAAD,IAAYA,KAAK,EAALA,UAAAA,KAAAA,MAAAA,GAA+BX,eAA/BW,WAAAA,GAAoDX,eAAOK,KAAO;AAC3F;AACA,IAAKM,KAAD,IAAYA,KAAK,CAALA,UAAAA,GAAmBb,eAAe,CAAA,SAAA,EAAYa,KAAK,CAAnDA,UAAkC,CAAlCA,GAAkE,EAAI;AACtF;AACA,MAAOA,KAAD,IAAWb,eAAe,CAAA,SAAA,EAAYa,KAAK,EAAjB,UAAA,CAA+B;AAC/D;AACA;AACA;AACA;AACA;AACA;AACA;AACA,wBAAyBA,KAAD,IAAYA,KAAK,CAALA,UAAAA,KAAAA,MAAAA,GAA8BX,eAA9BW,WAAAA,GAAmDX,eAAOkB,WAAa;AAC3G,aAAcP,KAAD,IAAYA,KAAK,CAALA,UAAAA,KAAAA,MAAAA,GAA8BX,eAA9BW,WAAAA,GAAmDX,eAAOmB,WAAa;AAChG,oBAAqBR,KAAD,IAAYA,KAAK,CAALA,UAAAA,KAAAA,MAAAA,GAA8BX,eAA9BW,WAAAA,GAAmDX,eAAOkB,WAAa;AACvG;AACA;AACA;AACA,0BAA2BP,KAAD,IAAYA,KAAK,CAALA,UAAAA,KAAAA,MAAAA,GAA8BX,eAA9BW,WAAAA,GAAmDX,eAAOkB,WAAa;AAC7G,eAAgBP,KAAD,IAAYA,KAAK,CAALA,UAAAA,KAAAA,MAAAA,GAA8BX,eAA9BW,WAAAA,GAAmDX,eAAOmB,WAAa;AAClG,sBAAuBR,KAAD,IAAYA,KAAK,CAALA,UAAAA,KAAAA,MAAAA,GAA8BX,eAA9BW,WAAAA,GAAmDX,eAAOkB,WAAa;AACzG;AACA;AArGA,CAAA;AAwGA,QAAME,SAAS,GAAGX,gCAAM,OAANA,CAA6B;AAC/C;AACA,aAAcE,KAAD,IAAYA,KAAK,CAALA,UAAAA,KAAAA,MAAAA,GAA8BX,eAA9BW,OAAAA,GAA+CA,KAAK,EAALA,UAAAA,KAAAA,MAAAA,GAA+BX,eAA/BW,KAAAA,GAA8CX,eAAOM,OAAS;AACtI,oBAAqBK,KAAD,IAAYA,KAAK,CAALA,UAAAA,KAAAA,MAAAA,GAA8BX,eAA9BW,OAAAA,GAA+CA,KAAK,EAALA,UAAAA,KAAAA,MAAAA,GAA+BX,eAA/BW,KAAAA,GAA8CX,eAAOM,OAAS;AAC7I;AACA;AACA,cAAeK,KAAD,IAAYA,KAAK,CAALA,UAAAA,KAAAA,MAAAA,GAA8BX,eAA9BW,OAAAA,GAA+CX,eAAOM,OAAS;AACzF;AACA;AACA;AACA;AACA,aAAcK,KAAD,IAAYA,KAAK,CAALA,UAAAA,KAAAA,MAAAA,GAA8BX,eAA9BW,WAAAA,GAAmDA,KAAK,EAALA,UAAAA,KAAAA,MAAAA,GAA+BX,eAA/BW,WAAAA,GAAoDX,eAAOI,WAAa;AACpJ,oBAAqBO,KAAD,IAAYA,KAAK,CAALA,UAAAA,KAAAA,MAAAA,GAA8BX,eAA9BW,WAAAA,GAAmDA,KAAK,EAALA,UAAAA,KAAAA,MAAAA,GAA+BX,eAA/BW,WAAAA,GAAoDX,eAAOI,WAAa;AAC3J;AACA;AACA;AACA;AACA,kBAAmBO,KAAD,IAAYA,KAAK,CAALA,UAAAA,KAAAA,MAAAA,GAA8BX,eAA9BW,WAAAA,GAAmDX,eAAOI,WAAa;AACrG;AACA;AACA;AACA;AACA;AACA;AACA;AACA,aAAcO,KAAD,IAAYA,KAAK,CAALA,UAAAA,KAAAA,MAAAA,GAA8BX,eAA9BW,WAAAA,GAAmDA,KAAK,EAALA,UAAAA,KAAAA,MAAAA,GAA+BX,eAA/BW,WAAAA,GAAoDX,eAAOiB,WAAa;AACpJ,oBAAqBN,KAAD,IAAYA,KAAK,CAALA,UAAAA,KAAAA,MAAAA,GAA8BX,eAA9BW,WAAAA,GAAmDA,KAAK,EAALA,UAAAA,KAAAA,MAAAA,GAA+BX,eAA/BW,WAAAA,GAAoDX,eAAOiB,WAAa;AAC3J;AACA;AACA;AACA;AACA,kBAAmBN,KAAD,IAAYA,KAAK,CAALA,UAAAA,KAAAA,MAAAA,GAA8BX,eAA9BW,WAAAA,GAAmDA,KAAK,EAALA,UAAAA,KAAAA,MAAAA,GAA+BX,eAA/BW,KAAAA,GAA8CX,eAAOiB,WAAa;AACnJ;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,aAAcN,KAAD,IAAYA,KAAK,EAALA,UAAAA,KAAAA,MAAAA,GAA+BX,eAA/BW,WAAAA,GAAoDX,eAAOmB,WAAa;AACjG,oBAAqBR,KAAD,IAAYA,KAAK,EAALA,UAAAA,KAAAA,MAAAA,GAA+BX,eAA/BW,WAAAA,GAAoDX,eAAOkB,WAAa;AACxG;AACA;AACA,IAAKP,KAAD,IAAYA,KAAK,CAALA,UAAAA,GAAmBb,eAAe,CAAA,WAAA,EAAca,KAAK,CAArDA,UAAkC,CAAlCA,GAAoE,EAAI;AACxF;AACA,MAAOA,KAAD,IAAWb,eAAe,CAAA,WAAA,EAAca,KAAK,EAAnB,UAAA,CAAiC;AACjE;AAlDA,CAAA;AAqDA,QAAMU,QAAQ,GAAGZ,gCAAM,OAANA,CAA6B;AAC9C;AACA,aAAcE,KAAD,IAAYA,KAAK,CAALA,UAAAA,KAAAA,MAAAA,GAA8BX,eAA9BW,OAAAA,GAA+CX,eAAOO,WAAa;AAC5F;AACA;AACA;AACA;AACA,cAAeI,KAAD,IAAYA,KAAK,CAALA,UAAAA,KAAAA,MAAAA,GAA8BX,eAA9BW,OAAAA,GAA+CX,eAAOM,OAAS;AACzF;AACA;AACA;AACA;AACA,wBAAyBK,KAAD,IAAYA,KAAK,CAALA,UAAAA,KAAAA,MAAAA,GAA8BX,eAA9BW,UAAAA,GAAkDX,eAAOsB,UAAY;AACzG,aAAcX,KAAD,IAAYA,KAAK,CAALA,UAAAA,KAAAA,MAAAA,GAA8BX,eAA9BW,WAAAA,GAAmDX,eAAOI,WAAa;AAChG,oBAAqBO,KAAD,IAAYA,KAAK,CAALA,UAAAA,KAAAA,MAAAA,GAA8BX,eAA9BW,UAAAA,GAAkDX,eAAOsB,UAAY;AACrG;AACA;AACA;AACA,kBAAmBX,KAAD,IAAYA,KAAK,CAALA,UAAAA,KAAAA,MAAAA,GAA8BX,eAA9BW,WAAAA,GAAmDX,eAAOI,WAAa;AACrG;AACA;AACA;AACA;AACA;AACA;AACA,wBAAyBO,KAAD,IAAYA,KAAK,CAALA,UAAAA,KAAAA,MAAAA,GAA8BX,eAA9BW,WAAAA,GAAmDX,eAAOuB,WAAa;AAC3G,aAAcZ,KAAD,IAAYA,KAAK,CAALA,UAAAA,KAAAA,MAAAA,GAA8BX,eAA9BW,WAAAA,GAAmDX,eAAOiB,WAAa;AAChG,oBAAqBN,KAAD,IAAYA,KAAK,CAALA,UAAAA,KAAAA,MAAAA,GAA8BX,eAA9BW,WAAAA,GAAmDX,eAAOuB,WAAa;AACvG;AACA;AACA;AACA,kBAAmBZ,KAAD,IAAYA,KAAK,CAALA,UAAAA,KAAAA,MAAAA,GAA8BX,eAA9BW,WAAAA,GAAmDX,eAAOiB,WAAa;AACrG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,aAAajB,eAAOmB,WAAY;AAChC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,aAAanB,eAAOmB,WAAY;AAChC;AACA;AACA;AACA,IAAKR,KAAD,IAAYA,KAAK,CAALA,UAAAA,GAAmBb,eAAe,CAAA,UAAA,EAAaa,KAAK,CAApDA,UAAkC,CAAlCA,GAAmE,EAAI;AACvF;AACA,MAAOA,KAAD,IAAWb,eAAe,CAAA,UAAA,EAAaa,KAAK,EAAlB,UAAA,CAAgC;AAChE;AA7DA,CAAA;AAgEA,QAAMa,OAAO,GAAGf,gCAAM,OAANA,CAA6B;AAC7C;AACA;AACA,oBAAoBT,eAAOyB,WAAY;AACvC,wBAAwBzB,eAAOyB,WAAY;AAC3C;AACA;AACA;AACA,oBAAoBzB,eAAO0B,WAAY;AACvC,wBAAwB1B,eAAO0B,WAAY;AAC3C;AACA;AACA;AACA,oBAAoB1B,eAAO0B,WAAY;AACvC,wBAAwB1B,eAAO0B,WAAY;AAC3C;AACA;AACA;AACA,oBAAoB1B,eAAO2B,WAAY;AACvC,wBAAwB3B,eAAO2B,WAAY;AAC3C;AACA;AACA;AACA;AACA;AACA;AACA;AACA,wBAAwB3B,eAAOkB,WAAY;AAC3C,aAAalB,eAAOmB,WAAY;AAChC,oBAAoBnB,eAAOkB,WAAY;AACvC;AACA;AACA;AACA,0BAA0BlB,eAAOkB,WAAY;AAC7C,eAAelB,eAAOmB,WAAY;AAClC,sBAAsBnB,eAAOkB,WAAY;AACzC;AACA;AArCA,CAAA;AAwCA,QAAMU,QAAQ,GAAGnB,gCAAM,OAANA,CAA6B;AAC9C;AACA;AACA,oBAAoBT,eAAO6B,YAAa;AACxC,wBAAwB7B,eAAO6B,YAAa;AAC5C;AACA;AACA;AACA,oBAAoB7B,eAAO8B,YAAa;AACxC,wBAAwB9B,eAAO8B,YAAa;AAC5C;AACA;AACA;AACA,oBAAoB9B,eAAO8B,YAAa;AACxC,wBAAwB9B,eAAO8B,YAAa;AAC5C;AACA;AACA;AACA,oBAAoB9B,eAAO+B,YAAa;AACxC,wBAAwB/B,eAAO+B,YAAa;AAC5C;AACA;AACA;AACA;AACA;AACA;AACA;AACA,wBAAwB/B,eAAOkB,WAAY;AAC3C,aAAalB,eAAOmB,WAAY;AAChC,oBAAoBnB,eAAOkB,WAAY;AACvC;AACA;AACA;AACA,0BAA0BlB,eAAOkB,WAAY;AAC7C,eAAelB,eAAOmB,WAAY;AAClC,sBAAsBnB,eAAOkB,WAAY;AACzC;AACA;AArCA,CAAA;AAwCA,QAAMc,IAAI,GAAGvB,2BAAOC,MAAoB;AACxC,WAAYC,KAAD,IAAYA,KAAK,CAALA,UAAAA,KAAAA,MAAAA,GAA8BX,eAA9BW,OAAAA,GAA+CX,eAAOM,OAAS;AACtF;AACA;AACA;AACA;AACA;AACA;AACA,IAAKK,KAAD,IACAA,KAAK,CAALA,IAAAA,KAAAA,KAAAA,GACIC,mCAAkBC,+BAAD,IAAjBD,EAA2CD,KAAK,CAALA,UAAAA,KAAAA,MAAAA,GAA8BX,eAA9BW,OAAAA,GAA+CX,eAD9FW,OACIC,CADJD,GAEIA,KAAK,CAALA,IAAAA,KAAAA,OAAAA,GACAG,mCAAkBD,+BAAD,IAAjBC,EAA2CH,KAAK,CAALA,UAAAA,KAAAA,MAAAA,GAA8BX,eAA9BW,OAAAA,GAA+CX,eAD1FW,OACAG,CADAH,GAEAI,mCAAkBF,+BAAD,IAAjBE,EAA2CJ,KAAK,CAALA,UAAAA,KAAAA,MAAAA,GAA8BX,eAA9BW,OAAAA,GAA+CX,eAAzE,OAAjBe,CAA0G;AAClH;AACA;AACA;AACA;AACA;AACA,aAAcJ,KAAD,IAAYA,KAAK,CAALA,UAAAA,KAAAA,MAAAA,GAA8BX,eAA9BW,WAAAA,GAAmDX,eAAOI,WAAa;AAChG;AACA;AACA;AACA;AACA,aAAcO,KAAD,IAAYA,KAAK,CAALA,UAAAA,KAAAA,MAAAA,GAA8BX,eAA9BW,WAAAA,GAAmDX,eAAOiB,WAAa;AAChG;AACA;AACA;AACA;AACA,aAAajB,eAAOiC,WAAY;AAChC;AACA;AACA;AAhCA,CAAA;;AAgDA,QAAMS,MAA4C,GAAG,IAAA,IAU/C;AAAA,QAVgD;AACpDC,MAAAA,QAAQ,GAD4C,gBAAA;AAEpDT,MAAAA,OAAO,GAF6C,SAAA;AAGpDU,MAAAA,IAAI,GAHgD,QAAA;AAIpDP,MAAAA,IAAI,GAJgD,QAAA;AAKpDrB,MAAAA,KAAK,GAL+C,MAAA;AAAA,MAAA,MAAA;AAAA,MAAA,QAAA;AAQpDyB,MAAAA;AARoD,QAUhD,IAAA;AAAA,QADD9B,KACC,GAAA,wBAAA,CAAA,IAAA,EAAA,SAAA,CAAA,CAAA,CACJ;;;AACA,UAAM;AAAE2B,MAAAA;AAAF,QAAN,KAAA;AAAA,UAAoBO,WAApB,GAAA,wBAAA,CAAA,KAAA,EAAA,UAAA,CAAA;;AACA,UAAMC,eAAe,GAAGC,KAAK,CAALA,MAAAA,CAAxB,IAAwBA,CAAxB;AACA,UAAM,CAAA,UAAA,EAAA,aAAA,IAA8BA,KAAK,CAALA,QAAAA,CAApC,KAAoCA,CAApC;;AAEA,UAAMC,aAAa,GAAG,MAAA,aACpB,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA,EACGP,IAAI,IAAA,aAAI,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA;AAAM,MAAA,SAAS,EAAEH,OAAO,GAAA,cAAA,GAAoB;AAA5C,KAAA,EADX,IACW,CADX,EAAA,aAEE,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA;AAAM,MAAA,SAAS,EAAEA,OAAO,GAAA,eAAA,GAAqB;AAA7C,KAAA,EAFF,QAEE,CAFF,EAGGA,OAAO,IAAA,aAAI,KAAA,CAAA,aAAA,CAAA,kCAAA,EAVZ,IAUY,CAHd,CADF,CANI,CAcJ;;;AACA,YAAA,OAAA;AACE,WAAA,SAAA;AACE,eAAA,aACE,KAAA,CAAA,aAAA,CAAA,OAAA,EAAA,QAAA,CAAA,EAAA,EAAA,WAAA,EAAA;AAEE,UAAA,QAAQ,EAFV,QAAA;AAGE,UAAA,IAAI,EAHN,IAAA;AAIE,UAAA,IAAI,EAJN,IAAA;AAKE,UAAA,KAAK,EALP,KAAA;AAME,yBANF,MAAA;AAOE,UAAA,SAAS,EAAE3B,KAAK,CAALA,OAAAA,GAAgB,mBAAmBA,KAAK,CAAxCA,SAAAA,GAAqD,MAAMA,KAAK,CAP7E,SAAA;AAQE,UAAA,WAAW,EAAGsC,CAAD,IAAY;AACvB,gBAAI,CAAA,QAAA,IAAa,CAAjB,UAAA,EAA8BH,eAAe,CAAfA,OAAAA,GAAAA,IAAAA;AATlC,WAAA;AAWE,UAAA,OAAO,EAAGG,CAAD,IAAY;AACnB,gBAAI,CAAJ,QAAA,EAAe;AACb,kBAAI,CAACH,eAAe,CAApB,OAAA,EAA8BI,aAAa,CAA3C,IAA2C,CAAbA,CAA9B,KACKJ,eAAe,CAAfA,OAAAA,GAAAA,KAAAA;AACN;AAfL,WAAA;AAiBE,UAAA,MAAM,EAAE,MAAMI,aAAa,CAjB7B,KAiB6B,CAjB7B;AAkBE,UAAA,UAAU,EAAEV;AAlBd,SAAA,CAAA,EAAA,aAmBE,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAK,UAAA,SAAS,EAAC;AAAf,SAAA,EAAiCQ,aApBrC,EAoBI,CAnBF,CADF;;AAuBF,WAAA,WAAA;AACE,eAAA,aACE,KAAA,CAAA,aAAA,CAAA,SAAA,EAAA,QAAA,CAAA,EAAA,EAAA,WAAA,EAAA;AAEE,UAAA,QAAQ,EAFV,QAAA;AAGE,UAAA,IAAI,EAHN,IAAA;AAIE,UAAA,IAAI,EAJN,IAAA;AAKE,UAAA,KAAK,EALP,KAAA;AAME,yBANF,MAAA;AAOE,UAAA,SAAS,EAAErC,KAAK,CAALA,OAAAA,GAAgB,mBAAmBA,KAAK,CAAxCA,SAAAA,GAAqD,MAAMA,KAAK,CAP7E,SAAA;AAQE,UAAA,WAAW,EAAGsC,CAAD,IAAY;AACvB,gBAAI,CAAA,QAAA,IAAa,CAAjB,UAAA,EAA8BH,eAAe,CAAfA,OAAAA,GAAAA,IAAAA;AATlC,WAAA;AAWE,UAAA,OAAO,EAAGG,CAAD,IAAY;AACnB,gBAAI,CAAJ,QAAA,EAAe;AACb,kBAAI,CAACH,eAAe,CAApB,OAAA,EAA8BI,aAAa,CAA3C,IAA2C,CAAbA,CAA9B,KACKJ,eAAe,CAAfA,OAAAA,GAAAA,KAAAA;AACN;AAfL,WAAA;AAiBE,UAAA,MAAM,EAAE,MAAMI,aAAa,CAjB7B,KAiB6B,CAjB7B;AAkBE,UAAA,UAAU,EAAEV;AAlBd,SAAA,CAAA,EAAA,aAmBE,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAK,UAAA,SAAS,EAAC;AAAf,SAAA,EAAiCQ,aApBrC,EAoBI,CAnBF,CADF;;AAuBF,WAAA,UAAA;AACE,eAAA,aACE,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA,QAAA,CAAA,EAAA,EAAA,WAAA,EAAA;AAEE,UAAA,QAAQ,EAFV,QAAA;AAGE,UAAA,IAAI,EAHN,IAAA;AAIE,UAAA,IAAI,EAJN,IAAA;AAKE,UAAA,KAAK,EALP,KAAA;AAME,yBANF,MAAA;AAOE,UAAA,SAAS,EAAErC,KAAK,CAALA,OAAAA,GAAgB,mBAAmBA,KAAK,CAAxCA,SAAAA,GAAqD,MAAMA,KAAK,CAP7E,SAAA;AAQE,UAAA,WAAW,EAAGsC,CAAD,IAAY;AACvB,gBAAI,CAAA,QAAA,IAAa,CAAjB,UAAA,EAA8BH,eAAe,CAAfA,OAAAA,GAAAA,IAAAA;AATlC,WAAA;AAWE,UAAA,OAAO,EAAGG,CAAD,IAAY;AACnB,gBAAI,CAAJ,QAAA,EAAe;AACb,kBAAI,CAACH,eAAe,CAApB,OAAA,EAA8BI,aAAa,CAA3C,IAA2C,CAAbA,CAA9B,KACKJ,eAAe,CAAfA,OAAAA,GAAAA,KAAAA;AACN;AAfL,WAAA;AAiBE,UAAA,MAAM,EAAE,MAAMI,aAAa,CAjB7B,KAiB6B,CAjB7B;AAkBE,UAAA,UAAU,EAAEV;AAlBd,SAAA,CAAA,EAAA,aAmBE,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAK,UAAA,SAAS,EAAC;AAAf,SAAA,EAAiCQ,aApBrC,EAoBI,CAnBF,CADF;;AAuBF,WAAA,MAAA;AACE,eAAA,aACE,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA,QAAA,CAAA,EAAA,EAAA,WAAA,EAAA;AAAuB,UAAA,QAAQ,EAA/B,QAAA;AAA2C,UAAA,IAAI,EAA/C,IAAA;AAAuD,UAAA,IAAI,EAA3D,IAAA;AAAmE,UAAA,KAAK,EAAxE,KAAA;AAAiF,yBAAaT;AAA9F,SAAA,CAAA,EADF,QACE,CADF;;AAKF,WAAA,SAAA;AACE,eAAA,aACE,KAAA,CAAA,aAAA,CAAA,OAAA,EAAA,QAAA,CAAA,EAAA,EAAA,WAAA,EAAA;AAEE,UAAA,QAAQ,EAFV,QAAA;AAGE,UAAA,IAAI,EAHN,IAAA;AAIE,UAAA,IAAI,EAJN,IAAA;AAKE,UAAA,KAAK,EALP,KAAA;AAME,yBANF,MAAA;AAOE,UAAA,SAAS,EAAE5B,KAAK,CAALA,OAAAA,GAAgB,mBAAmBA,KAAK,CAAxCA,SAAAA,GAAqD,MAAMA,KAAK,CAP7E,SAAA;AAQE,UAAA,WAAW,EAAGsC,CAAD,IAAY;AACvB,gBAAI,CAAA,QAAA,IAAa,CAAjB,UAAA,EAA8BH,eAAe,CAAfA,OAAAA,GAAAA,IAAAA;AATlC,WAAA;AAWE,UAAA,OAAO,EAAGG,CAAD,IAAY;AACnB,gBAAI,CAAJ,QAAA,EAAe;AACb,kBAAI,CAACH,eAAe,CAApB,OAAA,EAA8BI,aAAa,CAA3C,IAA2C,CAAbA,CAA9B,KACKJ,eAAe,CAAfA,OAAAA,GAAAA,KAAAA;AACN;AAfL,WAAA;AAiBE,UAAA,MAAM,EAAE,MAAMI,aAAa,CAjB7B,KAiB6B,CAjB7B;AAkBE,UAAA,UAAU,EAAEV;AAlBd,SAAA,CAAA,EAAA,aAmBE,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAK,UAAA,SAAS,EAAC;AAAf,SAAA,EAAiCQ,aApBrC,EAoBI,CAnBF,CADF;;AAuBF,WAAA,UAAA;AACE,eAAA,aACE,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA,QAAA,CAAA,EAAA,EAAA,WAAA,EAAA;AAEE,UAAA,QAAQ,EAFV,QAAA;AAGE,UAAA,IAAI,EAHN,IAAA;AAIE,UAAA,IAAI,EAJN,IAAA;AAKE,UAAA,KAAK,EALP,KAAA;AAME,yBANF,MAAA;AAOE,UAAA,SAAS,EAAErC,KAAK,CAALA,OAAAA,GAAgB,mBAAmBA,KAAK,CAAxCA,SAAAA,GAAqD,MAAMA,KAAK,CAP7E,SAAA;AAQE,UAAA,WAAW,EAAGsC,CAAD,IAAY;AACvB,gBAAI,CAAA,QAAA,IAAa,CAAjB,UAAA,EAA8BH,eAAe,CAAfA,OAAAA,GAAAA,IAAAA;AATlC,WAAA;AAWE,UAAA,OAAO,EAAGG,CAAD,IAAY;AACnB,gBAAI,CAAJ,QAAA,EAAe;AACb,kBAAI,CAACH,eAAe,CAApB,OAAA,EAA8BI,aAAa,CAA3C,IAA2C,CAAbA,CAA9B,KACKJ,eAAe,CAAfA,OAAAA,GAAAA,KAAAA;AACN;AAfL,WAAA;AAiBE,UAAA,MAAM,EAAE,MAAMI,aAAa,CAjB7B,KAiB6B,CAjB7B;AAkBE,UAAA,UAAU,EAAEV;AAlBd,SAAA,CAAA,EAAA,aAmBE,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAK,UAAA,SAAS,EAAC;AAAf,SAAA,EAAiCQ,aApBrC,EAoBI,CAnBF,CADF;;AAuBF;AACE,eAAA,aACE,KAAA,CAAA,aAAA,CAAA,OAAA,EAAA,QAAA,CAAA,EAAA,EAAA,WAAA,EAAA;AAEE,UAAA,QAAQ,EAFV,QAAA;AAGE,UAAA,IAAI,EAHN,IAAA;AAIE,UAAA,IAAI,EAJN,IAAA;AAKE,UAAA,KAAK,EALP,KAAA;AAME,yBANF,MAAA;AAOE,UAAA,SAAS,EAAErC,KAAK,CAALA,OAAAA,GAAgB,mBAAmBA,KAAK,CAAxCA,SAAAA,GAAqD,MAAMA,KAAK,CAP7E,SAAA;AAQE,UAAA,WAAW,EAAGsC,CAAD,IAAY;AACvB,gBAAI,CAAA,QAAA,IAAa,CAAjB,UAAA,EAA8BH,eAAe,CAAfA,OAAAA,GAAAA,IAAAA;AATlC,WAAA;AAWE,UAAA,OAAO,EAAGG,CAAD,IAAY;AACnB,gBAAI,CAAJ,QAAA,EAAe;AACb,kBAAI,CAACH,eAAe,CAApB,OAAA,EAA8BI,aAAa,CAA3C,IAA2C,CAAbA,CAA9B,KACKJ,eAAe,CAAfA,OAAAA,GAAAA,KAAAA;AACN;AAfL,WAAA;AAiBE,UAAA,MAAM,EAAE,MAAMI,aAAa,CAjB7B,KAiB6B,CAjB7B;AAkBE,UAAA,UAAU,EAAEV;AAlBd,SAAA,CAAA,EAAA,aAmBE,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAK,UAAA,SAAS,EAAC;AAAf,SAAA,EAAiCQ,aApBrC,EAoBI,CAnBF,CADF;AAhIJ;AAzBF,GAAA;;;AAZEd,IAAAA,O,6BAAU,S,EAAY,W,EAAc,U,EAAa,M,EAAS,S,EAAY,U;AACtEC,IAAAA,I,4DAAO,Q;AACPC,IAAAA,K;AACAC,IAAAA,I,6BAAO,O,EAAU,Q,EAAW,K;AAC5BlC,IAAAA,U,6BAAa,M,EAAS,M;AACtBa,IAAAA,K,4DAAQ,M;AACRsB,IAAAA,O;AACAC,IAAAA,M;AACAC,IAAAA,U;AACAC,IAAAA,I;;oBAsLF,M","sourcesContent":["import * as React from 'react';\nimport styled, { css } from 'styled-components';\nimport { LoadingIndicator } from '../LoadingIndicator';\nimport { COLORS, TYPOGRAPHY } from '../styles';\nimport { ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentTextStyle } from '../styles/typography';\n\nconst tabbedHereStyle = (variant: string, colorTheme?: string) => {\n switch (variant) {\n case 'primary':\n return css`\n outline: none;\n div {\n outline: none;\n box-shadow: 0px 4px 12px ${COLORS.focus_25}, 0px 0px 8px ${COLORS.focus} !important;\n background-color: ${colorTheme === 'teal' ? COLORS.accent1_700 : colorTheme === 'dark' ? COLORS.primary_100 : COLORS.primary_700};\n border-color: ${colorTheme === 'teal' ? COLORS.accent1_700 : colorTheme === 'dark' ? COLORS.primary_100 : COLORS.primary_700};\n color: ${colorTheme === 'dark' ? COLORS.primary_500 : COLORS.white};\n }\n `;\n case 'secondary':\n return css`\n outline: none;\n div {\n outline: none;\n box-shadow: 0px 4px 12px ${COLORS.focus_25}, 0px 0px 8px ${COLORS.focus} !important;\n background-color: ${colorTheme === 'dark' ? 'transparent' : COLORS.white};\n border-color: ${colorTheme === 'teal' ? COLORS.accent1 : colorTheme === 'dark' ? COLORS.primary_800 : COLORS.primary};\n color: ${colorTheme === 'dark' ? COLORS.white : COLORS.primary_500};\n }\n `;\n case 'tertiary':\n return css`\n outline: none;\n div {\n outline: none;\n box-shadow: 0px 4px 12px ${COLORS.focus_25}, 0px 0px 8px ${COLORS.focus} !important;\n background-color: ${COLORS.white};\n border-color: ${colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary};\n color: ${colorTheme === 'teal' ? COLORS.accent1_500 : COLORS.primary_500};\n }\n `;\n\n default:\n return css`\n outline: none;\n div {\n outline: none;\n box-shadow: 0px 4px 12px ${COLORS.focus_25}, 0px 0px 8px ${COLORS.focus} !important;\n background-color: ${colorTheme === 'teal' ? COLORS.accent1_700 : colorTheme === 'dark' ? COLORS.primary_100 : COLORS.primary_700};\n border-color: ${colorTheme === 'teal' ? COLORS.accent1_700 : colorTheme === 'dark' ? COLORS.primary_100 : COLORS.primary_700};\n color: ${colorTheme === 'dark' ? COLORS.primary_500 : COLORS.white};\n }\n `;\n }\n};\n\nconst Primary = styled.button<ButtonProps>`\n border: none;\n background-color: transparent;\n cursor: pointer;\n padding: 0;\n margin: 0;\n box-sizing: border-box;\n min-height: ${(props) => (props.size === 'big' ? '56px' : '48px')};\n &.loading-state {\n cursor: wait;\n }\n &:focus:not(:focus-visible),\n &:focus:not(:focus-visible) > div.button-content {\n outline: 0 !important;\n }\n div.button-content {\n ${(props) =>\n props.size === 'big'\n ? ComponentLStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)\n : props.size === 'small'\n ? ComponentSStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)\n : ComponentMStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)};\n\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\n border-radius: 8px;\n border-width: 2px;\n border-style: solid;\n border-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\n\n width: ${(props) => props.width};\n position: relative;\n\n min-height: ${(props) => (props.size === 'big' ? '56px' : props.size === 'small' ? '32px' : '40px')};\n box-sizing: border-box;\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 4px;\n // paddings have -2px for border\n padding: ${(props) => (props.size === 'big' ? '14px 18px' : props.size === 'small' ? '4px 10px' : '6px 14px')};\n\n span.loading {\n opacity: 0;\n }\n .icon {\n margin-left: -4px;\n margin-top: -2px;\n margin-bottom: -2px;\n width: ${(props) => (props.size === 'big' ? '28px' : props.size === 'small' ? '20px' : '24px')};\n height: ${(props) => (props.size === 'big' ? '28px' : props.size === 'small' ? '20px' : '24px')};\n svg {\n width: ${(props) => (props.size === 'big' ? '28px' : props.size === 'small' ? '20px' : '24px')} !important;\n height: ${(props) => (props.size === 'big' ? '28px' : props.size === 'small' ? '20px' : '24px')} !important;\n }\n }\n\n div {\n position: absolute;\n width: 100%;\n svg {\n height: ${(props) => (props.size === 'big' ? '28px' : props.size === 'small' ? '20px' : '24px')};\n width: ${(props) => (props.size === 'big' ? '28px' : props.size === 'small' ? '20px' : '24px')};\n path {\n fill: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary : COLORS.white)};\n }\n }\n }\n }\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_100 : COLORS.primary_700)};\n border-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_100 : COLORS.primary_700)};\n color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_600 : COLORS.white)};\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_800)};\n border-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_800)};\n box-shadow: none !important;\n color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)};\n }\n ${(props) => (props.tabbedHere ? tabbedHereStyle('primary', props.colorTheme) : '')}\n &.focus-state {\n ${(props) => tabbedHereStyle('primary', props?.colorTheme)};\n }\n &:disabled,\n &.disabled-state {\n cursor: not-allowed;\n }\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_100)};\n color: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.neutral_300)};\n border-color: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_100)};\n cursor: not-allowed;\n &:hover,\n &:active {\n background-color: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_100)};\n color: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.neutral_300)};\n border-color: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_100)};\n }\n }\n`;\n\nconst Secondary = styled(Primary)<ButtonProps>`\n div.button-content {\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\n border-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\n background-color: transparent;\n div svg path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary)};\n }\n }\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_700)};\n border-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_700)};\n background-color: transparent;\n div {\n svg {\n path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.primary_700)};\n }\n }\n }\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n background-color: white;\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_300 : COLORS.primary_800)};\n border-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_300 : COLORS.primary_800)};\n background-color: transparent;\n div {\n svg {\n path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary_800)};\n }\n }\n }\n }\n &:disabled,\n &.disabled-state {\n cursor: not-allowed;\n }\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: transparent;\n color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_300)};\n border-color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_100)};\n cursor: not-allowed;\n }\n ${(props) => (props.tabbedHere ? tabbedHereStyle('secondary', props.colorTheme) : '')}\n &.focus-state {\n ${(props) => tabbedHereStyle('secondary', props?.colorTheme)};\n }\n`;\n\nconst Tertiary = styled(Primary)<ButtonProps>`\n div.button-content {\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary_500)};\n border-color: transparent;\n background-color: transparent;\n border-width: 1px;\n div svg path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary)};\n }\n }\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_20 : COLORS.primary_20)};\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.primary_700)};\n border-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_20 : COLORS.primary_20)};\n div {\n svg {\n path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.primary_700)};\n }\n }\n }\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_100 : COLORS.primary_100)};\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : COLORS.primary_800)};\n border-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_100 : COLORS.primary_100)};\n div {\n svg {\n path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : COLORS.primary_800)};\n }\n }\n }\n }\n &:disabled,\n &.disabled-state {\n cursor: not-allowed;\n }\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: white !important;\n color: ${COLORS.neutral_300};\n border-color: transparent;\n cursor: not-allowed;\n }\n &:disabled,\n &.disabled-state {\n cursor: not-allowed;\n }\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: white !important;\n color: ${COLORS.neutral_300};\n border-color: transparent !important;\n cursor: not-allowed;\n }\n ${(props) => (props.tabbedHere ? tabbedHereStyle('tertiary', props.colorTheme) : '')}\n &.focus-state {\n ${(props) => tabbedHereStyle('tertiary', props?.colorTheme)};\n }\n`;\n\nconst Correct = styled(Primary)<ButtonProps>`\n div.button-content {\n color: white;\n border-color: ${COLORS.correct_500};\n background-color: ${COLORS.correct_500};\n }\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n border-color: ${COLORS.correct_700};\n background-color: ${COLORS.correct_700};\n }\n &:focus > div.button-content,\n &.focus-state > div.button-content {\n border-color: ${COLORS.correct_700};\n background-color: ${COLORS.correct_700};\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n border-color: ${COLORS.correct_800};\n background-color: ${COLORS.correct_800};\n }\n &:disabled,\n &.disabled-state {\n cursor: not-allowed;\n }\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: ${COLORS.neutral_100};\n color: ${COLORS.neutral_300};\n border-color: ${COLORS.neutral_100};\n cursor: not-allowed;\n &:hover,\n &:active {\n background-color: ${COLORS.neutral_100};\n color: ${COLORS.neutral_300};\n border-color: ${COLORS.neutral_100};\n }\n }\n`;\n\nconst Critical = styled(Primary)<ButtonProps>`\n div.button-content {\n color: white;\n border-color: ${COLORS.critical_500};\n background-color: ${COLORS.critical_500};\n }\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n border-color: ${COLORS.critical_700};\n background-color: ${COLORS.critical_700};\n }\n &:focus > div.button-content,\n &.focus-state > div.button-content {\n border-color: ${COLORS.critical_700};\n background-color: ${COLORS.critical_700};\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n border-color: ${COLORS.critical_800};\n background-color: ${COLORS.critical_800};\n }\n &:disabled,\n &.disabled-state {\n cursor: not-allowed;\n }\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: ${COLORS.neutral_100};\n color: ${COLORS.neutral_300};\n border-color: ${COLORS.neutral_100};\n cursor: not-allowed;\n &:hover,\n &:active {\n background-color: ${COLORS.neutral_100};\n color: ${COLORS.neutral_300};\n border-color: ${COLORS.neutral_100};\n }\n }\n`;\n\nconst Text = styled.button<ButtonProps>`\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary)};\n background-color: transparent;\n padding: 0;\n border: none;\n cursor: pointer;\n\n text-decoration: underline;\n ${(props) =>\n props.size === 'big'\n ? ComponentLStyling(ComponentTextStyle.Bold, props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary)\n : props.size === 'small'\n ? ComponentSStyling(ComponentTextStyle.Bold, props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary)\n : ComponentMStyling(ComponentTextStyle.Bold, props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary)};\n\n &:hover,\n &:focus,\n &.hover-state,\n &.focus-state {\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.primary_700)};\n background: transparent;\n }\n &:active,\n &.active-state {\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : COLORS.primary_800)};\n background: transparent;\n }\n &:disabled,\n &.disabled-state {\n color: ${COLORS.neutral_500};\n background: transparent;\n cursor: not-allowed;\n }\n`;\n\nexport interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n variant?: 'primary' | 'secondary' | 'tertiary' | 'text' | 'correct' | 'critical';\n role?: 'button' | string;\n title?: string;\n size?: 'small' | 'normal' | 'big';\n colorTheme?: 'teal' | 'dark';\n width?: 'auto' | string;\n loading?: boolean;\n testId?: string;\n tabbedHere?: boolean;\n icon?: React.ReactNode;\n}\n\nconst Button: React.FunctionComponent<ButtonProps> = ({\n children = 'Primary Button',\n variant = 'primary',\n type = 'button',\n size = 'normal',\n width = 'auto',\n testId,\n disabled,\n icon,\n ...props\n}) => {\n // Let's filter out properties that we don't need to render.\n const { loading, ...renderProps } = props;\n const supressFocusRef = React.useRef<any>(null);\n const [tabbedHere, setTabbedHere] = React.useState<boolean>(false);\n\n const renderContent = () => (\n <>\n {icon && <span className={loading ? 'icon loading' : 'icon'}>{icon}</span>}\n <span className={loading ? 'label loading' : 'label'}>{children}</span>\n {loading && <LoadingIndicator></LoadingIndicator>}\n </>\n );\n\n // Let's render button\n switch (variant) {\n case 'primary':\n return (\n <Primary\n {...renderProps}\n disabled={disabled}\n type={type}\n size={size}\n width={width}\n data-testid={testId}\n className={props.loading ? 'loading-state ' + props.className : ' ' + props.className}\n onMouseDown={(e: any) => {\n if (!disabled && !tabbedHere) supressFocusRef.current = true;\n }}\n onFocus={(e: any) => {\n if (!disabled) {\n if (!supressFocusRef.current) setTabbedHere(true);\n else supressFocusRef.current = false;\n }\n }}\n onBlur={() => setTabbedHere(false)}\n tabbedHere={tabbedHere}>\n <div className=\"button-content\">{renderContent()}</div>\n </Primary>\n );\n case 'secondary':\n return (\n <Secondary\n {...renderProps}\n disabled={disabled}\n type={type}\n size={size}\n width={width}\n data-testid={testId}\n className={props.loading ? 'loading-state ' + props.className : ' ' + props.className}\n onMouseDown={(e: any) => {\n if (!disabled && !tabbedHere) supressFocusRef.current = true;\n }}\n onFocus={(e: any) => {\n if (!disabled) {\n if (!supressFocusRef.current) setTabbedHere(true);\n else supressFocusRef.current = false;\n }\n }}\n onBlur={() => setTabbedHere(false)}\n tabbedHere={tabbedHere}>\n <div className=\"button-content\">{renderContent()}</div>\n </Secondary>\n );\n case 'tertiary':\n return (\n <Tertiary\n {...renderProps}\n disabled={disabled}\n type={type}\n size={size}\n width={width}\n data-testid={testId}\n className={props.loading ? 'loading-state ' + props.className : ' ' + props.className}\n onMouseDown={(e: any) => {\n if (!disabled && !tabbedHere) supressFocusRef.current = true;\n }}\n onFocus={(e: any) => {\n if (!disabled) {\n if (!supressFocusRef.current) setTabbedHere(true);\n else supressFocusRef.current = false;\n }\n }}\n onBlur={() => setTabbedHere(false)}\n tabbedHere={tabbedHere}>\n <div className=\"button-content\">{renderContent()}</div>\n </Tertiary>\n );\n case 'text':\n return (\n <Text {...renderProps} disabled={disabled} type={type} size={size} width={width} data-testid={testId}>\n {children}\n </Text>\n );\n case 'correct':\n return (\n <Correct\n {...renderProps}\n disabled={disabled}\n type={type}\n size={size}\n width={width}\n data-testid={testId}\n className={props.loading ? 'loading-state ' + props.className : ' ' + props.className}\n onMouseDown={(e: any) => {\n if (!disabled && !tabbedHere) supressFocusRef.current = true;\n }}\n onFocus={(e: any) => {\n if (!disabled) {\n if (!supressFocusRef.current) setTabbedHere(true);\n else supressFocusRef.current = false;\n }\n }}\n onBlur={() => setTabbedHere(false)}\n tabbedHere={tabbedHere}>\n <div className=\"button-content\">{renderContent()}</div>\n </Correct>\n );\n case 'critical':\n return (\n <Critical\n {...renderProps}\n disabled={disabled}\n type={type}\n size={size}\n width={width}\n data-testid={testId}\n className={props.loading ? 'loading-state ' + props.className : ' ' + props.className}\n onMouseDown={(e: any) => {\n if (!disabled && !tabbedHere) supressFocusRef.current = true;\n }}\n onFocus={(e: any) => {\n if (!disabled) {\n if (!supressFocusRef.current) setTabbedHere(true);\n else supressFocusRef.current = false;\n }\n }}\n onBlur={() => setTabbedHere(false)}\n tabbedHere={tabbedHere}>\n <div className=\"button-content\">{renderContent()}</div>\n </Critical>\n );\n default:\n return (\n <Primary\n {...renderProps}\n disabled={disabled}\n type={type}\n size={size}\n width={width}\n data-testid={testId}\n className={props.loading ? 'loading-state ' + props.className : ' ' + props.className}\n onMouseDown={(e: any) => {\n if (!disabled && !tabbedHere) supressFocusRef.current = true;\n }}\n onFocus={(e: any) => {\n if (!disabled) {\n if (!supressFocusRef.current) setTabbedHere(true);\n else supressFocusRef.current = false;\n }\n }}\n onBlur={() => setTabbedHere(false)}\n tabbedHere={tabbedHere}>\n <div className=\"button-content\">{renderContent()}</div>\n </Primary>\n );\n }\n};\n\nexport default Button;\n"],"file":"Button.js"}
1
+ {"version":3,"sources":["../../../src/Button/Button.tsx"],"names":["getBorderRadius","radius","tabbedHereStyle","css","COLORS","focus_25","focus","colorTheme","primary_700","white","primary","primary_500","Primary","styled","button","props","Size","ComponentLStyling","ComponentTextStyle","ComponentSStyling","ComponentMStyling","width","primary_800","neutral_100","neutral_300","Secondary","Tertiary","primary_20","primary_100","Correct","correct_500","correct_700","correct_800","Critical","critical_500","critical_700","critical_800","Text","neutral_500","variant","role","title","imageExtraMargin","loading","testId","tabbedHere","icon","Button","children","type","size","renderProps","supressFocusRef","React","renderContent","e","setTabbedHere"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled, { css } from 'styled-components';\nimport { LoadingIndicator } from '../LoadingIndicator';\nimport { ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentTextStyle } from '../styles/typography';\nimport { COLORS, TYPOGRAPHY } from '../styles';\nimport { Size } from '../types';\n\nconst getBorderRadius = (flatEdge : string | undefined, radius: number) => {\n switch(flatEdge)\n {\n case 'left':\n return `0px ${radius}px ${radius}px 0px`;\n \n case 'right':\n return `${radius}px 0px 0px ${radius}px`;\n\n case 'none':\n default:\n return `${radius}px`;\n }\n}\n\n\nconst tabbedHereStyle = (variant: string, colorTheme?: string) => {\n switch (variant) {\n case 'primary':\n return css`\n outline: none;\n div {\n outline: none;\n box-shadow: 0px 4px 12px ${COLORS.focus_25}, 0px 0px 8px ${COLORS.focus} !important;\n background-color: ${colorTheme === 'teal' ? COLORS.accent1_700 : colorTheme === 'dark' ? COLORS.primary_100 : COLORS.primary_700};\n border-color: ${colorTheme === 'teal' ? COLORS.accent1_700 : colorTheme === 'dark' ? COLORS.primary_100 : COLORS.primary_700};\n color: ${colorTheme === 'dark' ? COLORS.primary_600 : COLORS.white};\n }\n `;\n case 'secondary':\n return css`\n outline: none;\n div {\n outline: none;\n box-shadow: 0px 4px 12px ${COLORS.focus_25}, 0px 0px 8px ${COLORS.focus} !important;\n background-color: ${colorTheme === 'dark' ? 'transparent' : COLORS.white};\n border-color: ${colorTheme === 'teal' ? COLORS.accent1 : colorTheme === 'dark' ? COLORS.primary_800 : COLORS.primary};\n color: ${colorTheme === 'dark' ? COLORS.white : COLORS.primary_500};\n }\n `;\n case 'tertiary':\n return css`\n outline: none;\n div {\n outline: none;\n box-shadow: 0px 4px 12px ${COLORS.focus_25}, 0px 0px 8px ${COLORS.focus} !important;\n background-color: ${COLORS.white};\n border-color: ${colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary};\n color: ${colorTheme === 'teal' ? COLORS.accent1_500 : COLORS.primary_500};\n }\n `;\n\n default:\n return css`\n outline: none;\n div {\n outline: none;\n box-shadow: 0px 4px 12px ${COLORS.focus_25}, 0px 0px 8px ${COLORS.focus} !important;\n background-color: ${colorTheme === 'teal' ? COLORS.accent1_700 : colorTheme === 'dark' ? COLORS.primary_100 : COLORS.primary_700};\n border-color: ${colorTheme === 'teal' ? COLORS.accent1_700 : colorTheme === 'dark' ? COLORS.primary_100 : COLORS.primary_700};\n color: ${colorTheme === 'dark' ? COLORS.primary_500 : COLORS.white};\n }\n `;\n }\n};\n\nconst Primary = styled.button<ButtonProps>`\n border: none;\n background-color: transparent;\n cursor: pointer;\n padding: 0;\n margin: 0;\n box-sizing: border-box;\n min-height: ${(props) => (props.size === Size.Large ? '56px' : '48px')};\n &.loading-state {\n cursor: wait;\n }\n &:focus:not(:focus-visible),\n &:focus:not(:focus-visible) > div.button-content {\n outline: none !important;\n }\n div.button-content {\n ${(props) =>\n props.size === Size.Large\n ? ComponentLStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)\n : props.size === Size.Small\n ? ComponentSStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)\n : ComponentMStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)};\n\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\n border-radius: ${props => getBorderRadius(props.flatEdge, 8)};\n border-width: 2px;\n border-style: solid;\n border-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\n\n width: ${(props) => props.width};\n position: relative;\n\n min-height: ${(props) => (props.size === Size.Large ? '56px' : props.size === Size.Small ? '32px' : '40px')};\n box-sizing: border-box;\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 4px;\n // paddings have -2px for border\n padding: ${(props) => (props.size === Size.Large ? '14px 18px' : props.size === Size.Small ? '4px 10px' : '6px 14px')};\n\n span.loading {\n opacity: 0;\n }\n .icon {\n margin-left: -4px;\n margin-top: -2px;\n margin-bottom: -2px;\n width: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n height: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n svg {\n width: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')} !important;\n height: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')} !important;\n }\n }\n\n .extramargin {\n margin-right: 9px;\n }\n\n div {\n position: absolute;\n width: 100%;\n svg {\n height: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n width: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n path {\n fill: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary : COLORS.white)};\n }\n }\n }\n }\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_100 : COLORS.primary_700)};\n border-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_100 : COLORS.primary_700)};\n color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_600 : COLORS.white)};\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_800)};\n border-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_800)};\n box-shadow: none !important;\n color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)};\n }\n ${(props) => (props.tabbedHere ? tabbedHereStyle('primary', props.colorTheme) : '')}\n &.focus-state {\n ${(props) => tabbedHereStyle('primary', props?.colorTheme)};\n }\n &:disabled,\n &.disabled-state {\n cursor: not-allowed;\n }\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_100)};\n color: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.neutral_300)};\n border-color: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_100)};\n cursor: not-allowed;\n &:hover,\n &:active {\n background-color: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_100)};\n color: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.neutral_300)};\n border-color: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_100)};\n }\n }\n`;\n\nconst Secondary = styled(Primary)<ButtonProps>`\n div.button-content {\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\n border-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\n background-color: transparent;\n div svg path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary)};\n }\n }\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_700)};\n border-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_700)};\n background-color: transparent;\n div {\n svg {\n path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.primary_700)};\n }\n }\n }\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n background-color: white;\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_300 : COLORS.primary_800)};\n border-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_300 : COLORS.primary_800)};\n background-color: transparent;\n div {\n svg {\n path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary_800)};\n }\n }\n }\n }\n &:disabled,\n &.disabled-state {\n cursor: not-allowed;\n }\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: transparent;\n color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_300)};\n border-color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_100)};\n cursor: not-allowed;\n }\n ${(props) => (props.tabbedHere ? tabbedHereStyle('secondary', props.colorTheme) : '')}\n &.focus-state {\n ${(props) => tabbedHereStyle('secondary', props?.colorTheme)};\n }\n`;\n\nconst Tertiary = styled(Primary)<ButtonProps>`\n div.button-content {\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary_500)};\n border-color: transparent;\n background-color: transparent;\n border-width: 1px;\n div svg path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary)};\n }\n }\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_20 : COLORS.primary_20)};\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.primary_700)};\n border-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_20 : COLORS.primary_20)};\n div {\n svg {\n path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.primary_700)};\n }\n }\n }\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_100 : COLORS.primary_100)};\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : COLORS.primary_800)};\n border-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_100 : COLORS.primary_100)};\n div {\n svg {\n path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : COLORS.primary_800)};\n }\n }\n }\n }\n &:disabled,\n &.disabled-state {\n cursor: not-allowed;\n }\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: white !important;\n color: ${COLORS.neutral_300};\n border-color: transparent;\n cursor: not-allowed;\n }\n &:disabled,\n &.disabled-state {\n cursor: not-allowed;\n }\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: white !important;\n color: ${COLORS.neutral_300};\n border-color: transparent !important;\n cursor: not-allowed;\n }\n ${(props) => (props.tabbedHere ? tabbedHereStyle('tertiary', props.colorTheme) : '')}\n &.focus-state {\n ${(props) => tabbedHereStyle('tertiary', props?.colorTheme)};\n }\n`;\n\nconst Correct = styled(Primary)<ButtonProps>`\n div.button-content {\n color: white;\n border-color: ${COLORS.correct_500};\n background-color: ${COLORS.correct_500};\n }\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n border-color: ${COLORS.correct_700};\n background-color: ${COLORS.correct_700};\n }\n &:focus > div.button-content,\n &.focus-state > div.button-content {\n border-color: ${COLORS.correct_700};\n background-color: ${COLORS.correct_700};\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n border-color: ${COLORS.correct_800};\n background-color: ${COLORS.correct_800};\n }\n &:disabled,\n &.disabled-state {\n cursor: not-allowed;\n }\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: ${COLORS.neutral_100};\n color: ${COLORS.neutral_300};\n border-color: ${COLORS.neutral_100};\n cursor: not-allowed;\n &:hover,\n &:active {\n background-color: ${COLORS.neutral_100};\n color: ${COLORS.neutral_300};\n border-color: ${COLORS.neutral_100};\n }\n }\n`;\n\nconst Critical = styled(Primary)<ButtonProps>`\n div.button-content {\n color: white;\n border-color: ${COLORS.critical_500};\n background-color: ${COLORS.critical_500};\n }\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n border-color: ${COLORS.critical_700};\n background-color: ${COLORS.critical_700};\n }\n &:focus > div.button-content,\n &.focus-state > div.button-content {\n border-color: ${COLORS.critical_700};\n background-color: ${COLORS.critical_700};\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n border-color: ${COLORS.critical_800};\n background-color: ${COLORS.critical_800};\n }\n &:disabled,\n &.disabled-state {\n cursor: not-allowed;\n }\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: ${COLORS.neutral_100};\n color: ${COLORS.neutral_300};\n border-color: ${COLORS.neutral_100};\n cursor: not-allowed;\n &:hover,\n &:active {\n background-color: ${COLORS.neutral_100};\n color: ${COLORS.neutral_300};\n border-color: ${COLORS.neutral_100};\n }\n }\n`;\n\nconst Text = styled.button<ButtonProps>`\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary)};\n background-color: transparent;\n padding: 0;\n border: none;\n cursor: pointer;\n\n text-decoration: underline;\n ${(props) =>\n props.size === Size.Large\n ? ComponentLStyling(ComponentTextStyle.Bold, props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary)\n : props.size === Size.Small\n ? ComponentSStyling(ComponentTextStyle.Bold, props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary)\n : ComponentMStyling(ComponentTextStyle.Bold, props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary)};\n\n &:hover,\n &:focus,\n &.hover-state,\n &.focus-state {\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.primary_700)};\n background: transparent;\n }\n &:active,\n &.active-state {\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : COLORS.primary_800)};\n background: transparent;\n }\n &:disabled,\n &.disabled-state {\n color: ${COLORS.neutral_500};\n background: transparent;\n cursor: not-allowed;\n }\n`;\n\nexport interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n variant?: 'primary' | 'secondary' | 'tertiary' | 'text' | 'correct' | 'critical';\n flatEdge?: 'right' | 'left' | 'none' | undefined;\n role?: 'button' | string;\n title?: string;\n size?: Size;\n imageExtraMargin?: boolean;\n colorTheme?: 'teal' | 'dark';\n width?: 'auto' | string;\n loading?: boolean;\n testId?: string;\n tabbedHere?: boolean;\n icon?: React.ReactNode;\n}\n\nconst Button: React.FunctionComponent<ButtonProps> = ({\n children = 'Primary Button',\n variant = 'primary',\n type = 'button',\n size = Size.Medium,\n width = 'auto',\n imageExtraMargin,\n testId,\n disabled,\n flatEdge,\n icon,\n ...props\n}) => {\n // Let's filter out properties that we don't need to render.\n const { loading, ...renderProps } = props;\n const supressFocusRef = React.useRef<any>(null);\n const [tabbedHere, setTabbedHere] = React.useState<boolean>(false);\n\n const renderContent = () => (\n <>\n {icon && <span className={(imageExtraMargin ? 'extramargin ' : '') + (loading ? 'icon loading' : 'icon')}>{icon}</span>}\n <span className={loading ? 'label loading' : 'label'}>{children}</span>\n {loading && <LoadingIndicator></LoadingIndicator>}\n </>\n );\n\n // Let's render button\n switch (variant) {\n case 'primary':\n return (\n <Primary\n {...renderProps}\n disabled={disabled}\n type={type}\n size={size}\n flatEdge={flatEdge}\n width={width}\n data-testid={testId}\n className={props.loading ? 'loading-state ' + props.className : ' ' + props.className}\n onMouseDown={(e: any) => {\n if (!disabled && !tabbedHere) supressFocusRef.current = true;\n }}\n onFocus={(e: any) => {\n if (!disabled) {\n if (!supressFocusRef.current) setTabbedHere(true);\n else supressFocusRef.current = false;\n }\n }}\n onBlur={() => setTabbedHere(false)}\n tabbedHere={tabbedHere}>\n <div className=\"button-content\">{renderContent()}</div>\n </Primary>\n );\n case 'secondary':\n return (\n <Secondary\n {...renderProps}\n disabled={disabled}\n type={type}\n size={size}\n flatEdge={flatEdge}\n width={width}\n data-testid={testId}\n className={props.loading ? 'loading-state ' + props.className : ' ' + props.className}\n onMouseDown={(e: any) => {\n if (!disabled && !tabbedHere) supressFocusRef.current = true;\n }}\n onFocus={(e: any) => {\n if (!disabled) {\n if (!supressFocusRef.current) setTabbedHere(true);\n else supressFocusRef.current = false;\n }\n }}\n onBlur={() => setTabbedHere(false)}\n tabbedHere={tabbedHere}>\n <div className=\"button-content\">{renderContent()}</div>\n </Secondary>\n );\n case 'tertiary':\n return (\n <Tertiary\n {...renderProps}\n disabled={disabled}\n type={type}\n flatEdge={flatEdge}\n size={size}\n width={width}\n data-testid={testId}\n className={props.loading ? 'loading-state ' + props.className : ' ' + props.className}\n onMouseDown={(e: any) => {\n if (!disabled && !tabbedHere) supressFocusRef.current = true;\n }}\n onFocus={(e: any) => {\n if (!disabled) {\n if (!supressFocusRef.current) setTabbedHere(true);\n else supressFocusRef.current = false;\n }\n }}\n onBlur={() => setTabbedHere(false)}\n tabbedHere={tabbedHere}>\n <div className=\"button-content\">{renderContent()}</div>\n </Tertiary>\n );\n case 'text':\n return (\n <Text {...renderProps} disabled={disabled} type={type} size={size} width={width} data-testid={testId}>\n {children}\n </Text>\n );\n case 'correct':\n return (\n <Correct\n {...renderProps}\n disabled={disabled}\n type={type}\n size={size}\n flatEdge={flatEdge}\n width={width}\n data-testid={testId}\n className={props.loading ? 'loading-state ' + props.className : ' ' + props.className}\n onMouseDown={(e: any) => {\n if (!disabled && !tabbedHere) supressFocusRef.current = true;\n }}\n onFocus={(e: any) => {\n if (!disabled) {\n if (!supressFocusRef.current) setTabbedHere(true);\n else supressFocusRef.current = false;\n }\n }}\n onBlur={() => setTabbedHere(false)}\n tabbedHere={tabbedHere}>\n <div className=\"button-content\">{renderContent()}</div>\n </Correct>\n );\n case 'critical':\n return (\n <Critical\n {...renderProps}\n disabled={disabled}\n flatEdge={flatEdge}\n type={type}\n size={size}\n width={width}\n data-testid={testId}\n className={props.loading ? 'loading-state ' + props.className : ' ' + props.className}\n onMouseDown={(e: any) => {\n if (!disabled && !tabbedHere) supressFocusRef.current = true;\n }}\n onFocus={(e: any) => {\n if (!disabled) {\n if (!supressFocusRef.current) setTabbedHere(true);\n else supressFocusRef.current = false;\n }\n }}\n onBlur={() => setTabbedHere(false)}\n tabbedHere={tabbedHere}>\n <div className=\"button-content\">{renderContent()}</div>\n </Critical>\n );\n default:\n return (\n <Primary\n {...renderProps}\n flatEdge={flatEdge}\n disabled={disabled}\n type={type}\n size={size}\n width={width}\n data-testid={testId}\n className={props.loading ? 'loading-state ' + props.className : ' ' + props.className}\n onMouseDown={(e: any) => {\n if (!disabled && !tabbedHere) supressFocusRef.current = true;\n }}\n onFocus={(e: any) => {\n if (!disabled) {\n if (!supressFocusRef.current) setTabbedHere(true);\n else supressFocusRef.current = false;\n }\n }}\n onBlur={() => setTabbedHere(false)}\n tabbedHere={tabbedHere}>\n <div className=\"button-content\">{renderContent()}</div>\n </Primary>\n );\n }\n};\n\nexport default Button;\n"],"file":"Button.js"}