@skbkontur/react-ui 4.5.2 → 4.5.3-theme2022.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (173) hide show
  1. package/CHANGELOG.md +11 -0
  2. package/LICENSE +21 -21
  3. package/cjs/components/Button/Button.d.ts +10 -1
  4. package/cjs/components/Button/Button.js +81 -3
  5. package/cjs/components/Button/Button.js.map +1 -1
  6. package/cjs/components/Button/Button.mixins.js +5 -4
  7. package/cjs/components/Button/Button.mixins.js.map +1 -1
  8. package/cjs/components/Button/Button.styles.d.ts +23 -0
  9. package/cjs/components/Button/Button.styles.js +331 -73
  10. package/cjs/components/Button/Button.styles.js.map +1 -1
  11. package/cjs/components/Checkbox/Checkbox.js +1 -1
  12. package/cjs/components/Checkbox/Checkbox.js.map +1 -1
  13. package/cjs/components/Checkbox/Checkbox.styles.d.ts +1 -1
  14. package/cjs/components/Checkbox/Checkbox.styles.js +6 -4
  15. package/cjs/components/Checkbox/Checkbox.styles.js.map +1 -1
  16. package/cjs/components/CurrencyLabel/CurrencyLabel.md +23 -23
  17. package/cjs/components/Dropdown/Dropdown.d.ts +1 -0
  18. package/cjs/components/Dropdown/Dropdown.js +21 -3
  19. package/cjs/components/Dropdown/Dropdown.js.map +1 -1
  20. package/cjs/components/FileUploader/FileUploader.md +6 -1
  21. package/cjs/components/Gapped/Gapped.md +43 -43
  22. package/cjs/components/Link/Link.d.ts +3 -0
  23. package/cjs/components/Link/Link.js +31 -8
  24. package/cjs/components/Link/Link.js.map +1 -1
  25. package/cjs/components/Link/Link.mixins.d.ts +1 -0
  26. package/cjs/components/Link/Link.mixins.js +44 -6
  27. package/cjs/components/Link/Link.mixins.js.map +1 -1
  28. package/cjs/components/Link/Link.styles.d.ts +6 -0
  29. package/cjs/components/Link/Link.styles.js +86 -17
  30. package/cjs/components/Link/Link.styles.js.map +1 -1
  31. package/cjs/components/MenuSeparator/MenuSeparator.styles.js +2 -2
  32. package/cjs/components/MenuSeparator/MenuSeparator.styles.js.map +1 -1
  33. package/cjs/components/Modal/Modal.styles.d.ts +3 -0
  34. package/cjs/components/Modal/Modal.styles.js +32 -10
  35. package/cjs/components/Modal/Modal.styles.js.map +1 -1
  36. package/cjs/components/Modal/ModalFooter.js +6 -2
  37. package/cjs/components/Modal/ModalFooter.js.map +1 -1
  38. package/cjs/components/Modal/ModalHeader.js +9 -3
  39. package/cjs/components/Modal/ModalHeader.js.map +1 -1
  40. package/cjs/components/Modal/ModalSeparator.d.ts +5 -0
  41. package/cjs/components/Modal/ModalSeparator.js +21 -0
  42. package/cjs/components/Modal/ModalSeparator.js.map +1 -0
  43. package/cjs/components/PasswordInput/PasswordInput.md +9 -9
  44. package/cjs/components/RadioGroup/RadioGroup.md +43 -43
  45. package/cjs/components/Select/selectTheme.js +2 -0
  46. package/cjs/components/Select/selectTheme.js.map +1 -1
  47. package/cjs/components/Token/Token.md +112 -112
  48. package/cjs/internal/FakeUserActions/FakeUserActions.d.ts +7 -0
  49. package/cjs/internal/FakeUserActions/FakeUserActions.js +29 -0
  50. package/cjs/internal/FakeUserActions/FakeUserActions.js.map +1 -0
  51. package/cjs/internal/FakeUserActions/FakeUserActionsTable.d.ts +6 -0
  52. package/cjs/internal/FakeUserActions/FakeUserActionsTable.js +216 -0
  53. package/cjs/internal/FakeUserActions/FakeUserActionsTable.js.map +1 -0
  54. package/cjs/internal/FakeUserActions/Selectors.d.ts +6 -0
  55. package/cjs/internal/FakeUserActions/Selectors.js +20 -0
  56. package/cjs/internal/FakeUserActions/Selectors.js.map +1 -0
  57. package/cjs/internal/FakeUserActions/hasFakeUserAction.d.ts +3 -0
  58. package/cjs/internal/FakeUserActions/hasFakeUserAction.js +9 -0
  59. package/cjs/internal/FakeUserActions/hasFakeUserAction.js.map +1 -0
  60. package/cjs/internal/Menu/Menu.styles.js +1 -2
  61. package/cjs/internal/Menu/Menu.styles.js.map +1 -1
  62. package/cjs/internal/ThemeShowcase/ThemeShowcase.md +13 -13
  63. package/cjs/internal/ThemeShowcase/VariablesCollector.d.ts +1 -1
  64. package/cjs/internal/icons/16px/BaseIcon.d.ts +8 -0
  65. package/cjs/internal/icons/16px/BaseIcon.js +33 -0
  66. package/cjs/internal/icons/16px/BaseIcon.js.map +1 -0
  67. package/cjs/internal/icons/16px/index.d.ts +3 -0
  68. package/cjs/internal/icons/16px/index.js +22 -8
  69. package/cjs/internal/icons/16px/index.js.map +1 -1
  70. package/cjs/internal/themes/DefaultTheme.d.ts +41 -0
  71. package/cjs/internal/themes/DefaultTheme.js +87 -3
  72. package/cjs/internal/themes/DefaultTheme.js.map +1 -1
  73. package/cjs/internal/themes/Theme2022.d.ts +60 -4
  74. package/cjs/internal/themes/Theme2022.js +156 -63
  75. package/cjs/internal/themes/Theme2022.js.map +1 -1
  76. package/cjs/internal/themes/Theme2022Dark.d.ts +9 -0
  77. package/cjs/internal/themes/Theme2022Dark.js +15 -1
  78. package/cjs/internal/themes/Theme2022Dark.js.map +1 -1
  79. package/cjs/lib/theming/ThemeHelpers.d.ts +3 -0
  80. package/cjs/lib/theming/ThemeHelpers.js +17 -1
  81. package/cjs/lib/theming/ThemeHelpers.js.map +1 -1
  82. package/cjs/lib/theming/themes/Theme2022.js +2 -1
  83. package/cjs/lib/theming/themes/Theme2022.js.map +1 -1
  84. package/cjs/typings/utility-types.d.ts +1 -1
  85. package/components/Button/Button/Button.js +61 -11
  86. package/components/Button/Button/Button.js.map +1 -1
  87. package/components/Button/Button.d.ts +10 -1
  88. package/components/Button/Button.mixins/Button.mixins.js +2 -2
  89. package/components/Button/Button.mixins/Button.mixins.js.map +1 -1
  90. package/components/Button/Button.styles/Button.styles.js +130 -62
  91. package/components/Button/Button.styles/Button.styles.js.map +1 -1
  92. package/components/Button/Button.styles.d.ts +23 -0
  93. package/components/Checkbox/Checkbox/Checkbox.js +1 -1
  94. package/components/Checkbox/Checkbox/Checkbox.js.map +1 -1
  95. package/components/Checkbox/Checkbox.styles/Checkbox.styles.js +2 -2
  96. package/components/Checkbox/Checkbox.styles/Checkbox.styles.js.map +1 -1
  97. package/components/Checkbox/Checkbox.styles.d.ts +1 -1
  98. package/components/CurrencyLabel/CurrencyLabel.md +23 -23
  99. package/components/Dropdown/Dropdown/Dropdown.js +18 -5
  100. package/components/Dropdown/Dropdown/Dropdown.js.map +1 -1
  101. package/components/Dropdown/Dropdown.d.ts +1 -0
  102. package/components/FileUploader/FileUploader.md +6 -1
  103. package/components/Gapped/Gapped.md +43 -43
  104. package/components/Link/Link/Link.js +26 -4
  105. package/components/Link/Link/Link.js.map +1 -1
  106. package/components/Link/Link.d.ts +3 -0
  107. package/components/Link/Link.mixins/Link.mixins.js +11 -3
  108. package/components/Link/Link.mixins/Link.mixins.js.map +1 -1
  109. package/components/Link/Link.mixins.d.ts +1 -0
  110. package/components/Link/Link.styles/Link.styles.js +26 -14
  111. package/components/Link/Link.styles/Link.styles.js.map +1 -1
  112. package/components/Link/Link.styles.d.ts +6 -0
  113. package/components/MenuSeparator/MenuSeparator.styles/MenuSeparator.styles.js +1 -1
  114. package/components/MenuSeparator/MenuSeparator.styles/MenuSeparator.styles.js.map +1 -1
  115. package/components/Modal/Modal.styles/Modal.styles.js +14 -5
  116. package/components/Modal/Modal.styles/Modal.styles.js.map +1 -1
  117. package/components/Modal/Modal.styles.d.ts +3 -0
  118. package/components/Modal/ModalFooter/ModalFooter.js +5 -2
  119. package/components/Modal/ModalFooter/ModalFooter.js.map +1 -1
  120. package/components/Modal/ModalHeader/ModalHeader.js +5 -2
  121. package/components/Modal/ModalHeader/ModalHeader.js.map +1 -1
  122. package/components/Modal/ModalSeparator/ModalSeparator.js +14 -0
  123. package/components/Modal/ModalSeparator/ModalSeparator.js.map +1 -0
  124. package/components/Modal/ModalSeparator/package.json +6 -0
  125. package/components/Modal/ModalSeparator.d.ts +5 -0
  126. package/components/PasswordInput/PasswordInput.md +9 -9
  127. package/components/RadioGroup/RadioGroup.md +43 -43
  128. package/components/Select/selectTheme/selectTheme.js +1 -0
  129. package/components/Select/selectTheme/selectTheme.js.map +1 -1
  130. package/components/Token/Token.md +112 -112
  131. package/internal/FakeUserActions/FakeUserActions/FakeUserActions.js +33 -0
  132. package/internal/FakeUserActions/FakeUserActions/FakeUserActions.js.map +1 -0
  133. package/internal/FakeUserActions/FakeUserActions/package.json +6 -0
  134. package/internal/FakeUserActions/FakeUserActions.d.ts +7 -0
  135. package/internal/FakeUserActions/FakeUserActionsTable/FakeUserActionsTable.js +171 -0
  136. package/internal/FakeUserActions/FakeUserActionsTable/FakeUserActionsTable.js.map +1 -0
  137. package/internal/FakeUserActions/FakeUserActionsTable/package.json +6 -0
  138. package/internal/FakeUserActions/FakeUserActionsTable.d.ts +6 -0
  139. package/internal/FakeUserActions/Selectors/Selectors.js +29 -0
  140. package/internal/FakeUserActions/Selectors/Selectors.js.map +1 -0
  141. package/internal/FakeUserActions/Selectors/package.json +6 -0
  142. package/internal/FakeUserActions/Selectors.d.ts +6 -0
  143. package/internal/FakeUserActions/hasFakeUserAction/hasFakeUserAction.js +6 -0
  144. package/internal/FakeUserActions/hasFakeUserAction/hasFakeUserAction.js.map +1 -0
  145. package/internal/FakeUserActions/hasFakeUserAction/package.json +6 -0
  146. package/internal/FakeUserActions/hasFakeUserAction.d.ts +3 -0
  147. package/internal/Menu/Menu.styles/Menu.styles.js +1 -1
  148. package/internal/Menu/Menu.styles/Menu.styles.js.map +1 -1
  149. package/internal/ThemeShowcase/ThemeShowcase.md +13 -13
  150. package/internal/ThemeShowcase/VariablesCollector.d.ts +1 -1
  151. package/internal/icons/16px/BaseIcon/BaseIcon.js +28 -0
  152. package/internal/icons/16px/BaseIcon/BaseIcon.js.map +1 -0
  153. package/internal/icons/16px/BaseIcon/package.json +6 -0
  154. package/internal/icons/16px/BaseIcon.d.ts +8 -0
  155. package/internal/icons/16px/index/index.js +19 -5
  156. package/internal/icons/16px/index/index.js.map +1 -1
  157. package/internal/icons/16px/index.d.ts +3 -0
  158. package/internal/themes/DefaultTheme/DefaultTheme.js +119 -2
  159. package/internal/themes/DefaultTheme/DefaultTheme.js.map +1 -1
  160. package/internal/themes/DefaultTheme.d.ts +41 -0
  161. package/internal/themes/Theme2022/Theme2022.js +90 -4
  162. package/internal/themes/Theme2022/Theme2022.js.map +1 -1
  163. package/internal/themes/Theme2022.d.ts +60 -4
  164. package/internal/themes/Theme2022Dark/Theme2022Dark.js +9 -0
  165. package/internal/themes/Theme2022Dark/Theme2022Dark.js.map +1 -1
  166. package/internal/themes/Theme2022Dark.d.ts +9 -0
  167. package/lib/theming/ThemeHelpers/ThemeHelpers.js +14 -0
  168. package/lib/theming/ThemeHelpers/ThemeHelpers.js.map +1 -1
  169. package/lib/theming/ThemeHelpers.d.ts +3 -0
  170. package/lib/theming/themes/Theme2022/Theme2022.js +2 -1
  171. package/lib/theming/themes/Theme2022/Theme2022.js.map +1 -1
  172. package/package.json +3 -5
  173. package/typings/utility-types.d.ts +1 -1
@@ -12,7 +12,11 @@ import { Spinner } from "../../Spinner";
12
12
  import { CommonWrapper } from "../../../internal/CommonWrapper";
13
13
  import { cx } from "../../../lib/theming/Emotion";
14
14
  import { rootNode } from "../../../lib/rootNode";
15
+ import { ThemeFactory } from "../../../lib/theming/ThemeFactory";
15
16
  import { createPropsGetter } from "../../../lib/createPropsGetter";
17
+ import { hasFakeUserAction } from "../../../internal/FakeUserActions/hasFakeUserAction";
18
+ import { ArrowALeftIcon, ArrowARightIcon } from "../../../internal/icons/16px";
19
+ import { getThemeName } from "../../../lib/theming/ThemeHelpers";
16
20
  import { styles, activeStyles, globalClasses } from "../Button.styles";
17
21
  export var ButtonDataTids = {
18
22
  root: 'Button__root'
@@ -109,7 +113,7 @@ export var Button = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (
109
113
  var _this2 = this;
110
114
 
111
115
  return /*#__PURE__*/React.createElement(ThemeContext.Consumer, null, function (theme) {
112
- _this2.theme = theme;
116
+ _this2.theme = _this2.props.theme ? ThemeFactory.create(_this2.props.theme, theme) : theme;
113
117
  return _this2.renderMain();
114
118
  });
115
119
  };
@@ -147,14 +151,15 @@ export var Button = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (
147
151
  type = _this$getProps.type;
148
152
 
149
153
  var sizeClass = this.getSizeClassName();
150
- var isFocused = this.state.focusedByTab || visuallyFocused;
154
+ var isFocused = this.state.focusedByTab || visuallyFocused || hasFakeUserAction(this, 'focus');
151
155
  var isLink = use === 'link';
156
+ var isTheme2022 = getThemeName(this.theme) === 'THEME_2022';
152
157
  var rootProps = {
153
158
  // By default the type attribute is 'submit'. IE8 will fire a click event
154
159
  // on this button if somewhere on the page user presses Enter while some
155
160
  // input is focused. So we set type to 'button' by default.
156
161
  type: type,
157
- className: cx((_cx = {}, _cx[styles.root(this.theme)] = true, _cx[styles[use](this.theme)] = true, _cx[activeStyles[use](this.theme)] = active, _cx[sizeClass] = true, _cx[styles.focus(this.theme)] = isFocused, _cx[styles.checked(this.theme)] = checked, _cx[styles.checkedFocused(this.theme)] = checked && isFocused, _cx[styles.disabled(this.theme)] = disabled || loading, _cx[styles.checkedDisabled(this.theme)] = checked && disabled, _cx[styles.borderless()] = borderless && !disabled && !loading && !checked && !isFocused && !active, _cx[styles.narrow()] = narrow, _cx[styles.noPadding()] = _noPadding, _cx[styles.noRightPadding()] = _noRightPadding, _cx)),
162
+ className: cx((_cx = {}, _cx[styles.root(this.theme)] = true, _cx[styles.simulatedPress()] = !isTheme2022, _cx[styles[use](this.theme)] = true, _cx[activeStyles[use](this.theme)] = active, _cx[sizeClass] = true, _cx[styles.focus(this.theme)] = isFocused, _cx[styles.checked(this.theme)] = checked && !disabled, _cx[styles.checkedFocused(this.theme)] = checked && isFocused && !disabled, _cx[styles.disabled(this.theme)] = disabled || loading, _cx[styles.checkedDisabled(this.theme)] = checked && disabled, _cx[styles.borderless()] = borderless && !disabled && !loading && !checked && !isFocused && !active, _cx[styles.narrow()] = narrow, _cx[styles.noPadding()] = _noPadding, _cx[styles.noRightPadding()] = _noRightPadding, _cx)),
158
163
  style: _extends({
159
164
  textAlign: align
160
165
  }, corners),
@@ -170,7 +175,7 @@ export var Button = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (
170
175
  title: this.props.title
171
176
  };
172
177
  var wrapProps = {
173
- className: cx((_cx2 = {}, _cx2[styles.wrap(this.theme)] = true, _cx2[styles.wrapArrow()] = arrow === true, _cx2[styles.wrapArrowLeft()] = arrow === 'left', _cx2[this.getSizeWrapClassName()] = true, _cx2)),
178
+ className: cx((_cx2 = {}, _cx2[styles.wrap(this.theme)] = true, _cx2[styles.wrapArrow()] = arrow === true && use !== 'text' && use !== 'backless', _cx2[styles.wrapArrowLeft()] = arrow === 'left' && use !== 'text' && use !== 'backless', _cx2[this.getSizeWrapClassName()] = true, _cx2)),
174
179
  style: {
175
180
  width: width
176
181
  }
@@ -208,23 +213,43 @@ export var Button = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (
208
213
 
209
214
  var arrowNode = null;
210
215
 
211
- if (arrow) {
216
+ if (arrow && use !== 'text' && use !== 'backless') {
212
217
  var _cx5;
213
218
 
214
219
  arrowNode = /*#__PURE__*/React.createElement("div", {
215
- className: cx((_cx5 = {}, _cx5[styles.arrow()] = true, _cx5[styles.arrowWarning(this.theme)] = !checked && warning, _cx5[styles.arrowError(this.theme)] = !checked && error, _cx5[styles.arrowFocus(this.theme)] = !checked && isFocused, _cx5[styles.arrowLeft()] = arrow === 'left', _cx5))
220
+ className: cx((_cx5 = {}, _cx5[styles.arrow()] = true, _cx5[styles.arrowWarning(this.theme)] = !checked && warning && !disabled, _cx5[styles.arrowError(this.theme)] = !checked && error && !disabled, _cx5[styles.arrowFocus(this.theme)] = !checked && isFocused && !disabled, _cx5[styles.arrowLeft()] = arrow === 'left', _cx5))
216
221
  }, /*#__PURE__*/React.createElement("div", {
217
222
  className: cx(globalClasses.arrowHelper, globalClasses.arrowHelperTop)
218
223
  }), /*#__PURE__*/React.createElement("div", {
219
224
  className: cx(globalClasses.arrowHelper, globalClasses.arrowHelperBottom)
220
225
  }));
226
+
227
+ if (isTheme2022) {
228
+ var sizeIcon = this.theme.btnIconSizeSmall;
229
+
230
+ if (this.props.size === 'medium') {
231
+ sizeIcon = this.theme.btnIconSizeMedium;
232
+ } else if (this.props.size === 'large') {
233
+ sizeIcon = this.theme.btnIconSizeLarge;
234
+ }
235
+
236
+ rootProps.className = cx(rootProps.className, this.getRootWithArrowIconClassName());
237
+ var arrowIcon = arrow === 'left' ? /*#__PURE__*/React.createElement(ArrowALeftIcon, {
238
+ size: parseInt(sizeIcon)
239
+ }) : /*#__PURE__*/React.createElement(ArrowARightIcon, {
240
+ size: parseInt(sizeIcon)
241
+ });
242
+ arrowNode = /*#__PURE__*/React.createElement("div", {
243
+ className: this.getArrowIconRootClassName()
244
+ }, arrowIcon);
245
+ }
221
246
  } // Force disable all props and features, that cannot be use with Link
222
247
 
223
248
 
224
249
  if (isLink) {
225
250
  var _cx6;
226
251
 
227
- rootProps.className = cx((_cx6 = {}, _cx6[styles.root(this.theme)] = true, _cx6[sizeClass] = true, _cx6[styles.link(this.theme)] = true, _cx6[styles.linkFocus(this.theme)] = isFocused, _cx6[styles.linkDisabled(this.theme)] = disabled || loading, _cx6));
252
+ rootProps.className = cx((_cx6 = {}, _cx6[styles.root(this.theme)] = true, _cx6[sizeClass] = true, _cx6[this.getLinkClassName(isFocused, Boolean(disabled || loading))] = true, _cx6));
228
253
  Object.assign(wrapProps, {
229
254
  className: cx(styles.wrap(this.theme), styles.wrapLink()),
230
255
  style: {
@@ -243,7 +268,7 @@ export var Button = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (
243
268
  }, rootProps), innerShadowNode, outlineNode, loadingNode, arrowNode, /*#__PURE__*/React.createElement("div", {
244
269
  className: cx(styles.caption(), globalClasses.caption, (_cx7 = {}, _cx7[styles.captionTranslated()] = active || checked, _cx7[styles.captionLink()] = isLink, _cx7[styles.captionDisabled()] = !checked && disabled, _cx7))
245
270
  }, iconNode, /*#__PURE__*/React.createElement("span", {
246
- className: cx((_cx8 = {}, _cx8[styles.visibilityHidden()] = !!loadingNode, _cx8))
271
+ className: cx(globalClasses.text, (_cx8 = {}, _cx8[styles.visibilityHidden()] = !!loadingNode, _cx8))
247
272
  }, children)))));
248
273
  };
249
274
 
@@ -260,14 +285,14 @@ export var Button = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (
260
285
 
261
286
  switch (this.getProps().size) {
262
287
  case 'large':
263
- return cx(styles.sizeLarge(this.theme), (_cx9 = {}, _cx9[styles.sizeLargeIE11(this.theme)] = isIE11 || isEdge, _cx9));
288
+ return cx(styles.sizeLarge(this.theme), (_cx9 = {}, _cx9[styles.sizeLargeIE11(this.theme)] = isIE11 || isEdge, _cx9[styles.sizeLargeWithIcon(this.theme)] = !!this.props.icon, _cx9));
264
289
 
265
290
  case 'medium':
266
- return cx(styles.sizeMedium(this.theme), (_cx10 = {}, _cx10[styles.sizeMediumIE11(this.theme)] = isIE11 || isEdge, _cx10));
291
+ return cx(styles.sizeMedium(this.theme), (_cx10 = {}, _cx10[styles.sizeMediumIE11(this.theme)] = isIE11 || isEdge, _cx10[styles.sizeMediumWithIcon(this.theme)] = !!this.props.icon, _cx10));
267
292
 
268
293
  case 'small':
269
294
  default:
270
- return cx(styles.sizeSmall(this.theme), (_cx11 = {}, _cx11[styles.sizeSmallIE11(this.theme)] = isIE11 || isEdge, _cx11));
295
+ return cx(styles.sizeSmall(this.theme), (_cx11 = {}, _cx11[styles.sizeSmallIE11(this.theme)] = isIE11 || isEdge, _cx11[styles.sizeSmallWithIcon(this.theme)] = !!this.props.icon, _cx11));
271
296
  }
272
297
  };
273
298
 
@@ -299,6 +324,31 @@ export var Button = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (
299
324
  }
300
325
  };
301
326
 
327
+ _proto.getLinkClassName = function getLinkClassName(focused, disabled) {
328
+ var _cx12, _cx13;
329
+
330
+ var isBorderBottom = parseInt(this.theme.btnLinkLineBorderBottomWidth) > 0;
331
+ return !isBorderBottom ? cx(styles.link(this.theme), (_cx12 = {}, _cx12[styles.linkFocus(this.theme)] = focused, _cx12[styles.linkDisabled(this.theme)] = disabled, _cx12)) : cx(styles.link(this.theme), styles.linkLine(this.theme), (_cx13 = {}, _cx13[styles.linkLineFocus(this.theme)] = focused, _cx13[styles.linkLineDisabled(this.theme)] = disabled, _cx13));
332
+ };
333
+
334
+ _proto.getRootWithArrowIconClassName = function getRootWithArrowIconClassName() {
335
+ var _cx14;
336
+
337
+ var _this$props2 = this.props,
338
+ arrow = _this$props2.arrow,
339
+ size = _this$props2.size;
340
+ return cx((_cx14 = {}, _cx14[styles.withArrowIconRightSmall(this.theme)] = arrow !== 'left' && size === 'small', _cx14[styles.withArrowIconRightMedium(this.theme)] = arrow !== 'left' && size === 'medium', _cx14[styles.withArrowIconRightLarge(this.theme)] = arrow !== 'left' && size === 'large', _cx14[styles.withArrowIconLeftSmall(this.theme)] = arrow === 'left' && size === 'small', _cx14[styles.withArrowIconLeftMedium(this.theme)] = arrow === 'left' && size === 'medium', _cx14[styles.withArrowIconLeftLarge(this.theme)] = arrow === 'left' && size === 'large', _cx14));
341
+ };
342
+
343
+ _proto.getArrowIconRootClassName = function getArrowIconRootClassName() {
344
+ var _cx15;
345
+
346
+ var _this$props3 = this.props,
347
+ arrow = _this$props3.arrow,
348
+ size = _this$props3.size;
349
+ return cx(styles.arrowIconRoot(), (_cx15 = {}, _cx15[styles.arrowIconRootSmall(this.theme)] = size === 'small', _cx15[styles.arrowIconRootMedium(this.theme)] = size === 'medium', _cx15[styles.arrowIconRootLarge(this.theme)] = size === 'large', _cx15[styles.arrowIconLeft()] = arrow === 'left', _cx15));
350
+ };
351
+
302
352
  return Button;
303
353
  }(React.Component), _class2.__KONTUR_REACT_UI__ = 'Button', _class2.__BUTTON__ = true, _class2.defaultProps = {
304
354
  use: 'default',
@@ -1 +1 @@
1
- {"version":3,"sources":["Button.tsx"],"names":["React","isReactUIComponent","isIE11","isEdge","keyListener","ThemeContext","Spinner","CommonWrapper","cx","rootNode","createPropsGetter","styles","activeStyles","globalClasses","ButtonDataTids","root","Button","getProps","defaultProps","state","focusedByTab","node","handleFocus","e","props","disabled","disableFocus","requestAnimationFrame","isTabPressed","setState","onFocus","handleBlur","onBlur","_ref","componentDidMount","autoFocus","focus","getDerivedStateFromProps","loading","blur","render","theme","renderMain","corners","active","borderless","checked","error","warning","arrow","narrow","icon","_noPadding","_noRightPadding","visuallyFocused","align","onMouseEnter","onMouseLeave","onMouseOver","onKeyDown","onClick","width","children","use","type","sizeClass","getSizeClassName","isFocused","isLink","rootProps","className","checkedFocused","checkedDisabled","noPadding","noRightPadding","style","textAlign","tabIndex","title","wrapProps","wrap","wrapArrow","wrapArrowLeft","getSizeWrapClassName","innerShadowNode","innerShadow","outlineNode","outline","outlineWarning","outlineError","outlineLink","outlineLinkWarning","outlineLinkError","loadingNode","getLoadingSpinner","iconNode","getSizeIconClassName","iconNoRightMargin","iconLink","arrowNode","arrowWarning","arrowError","arrowFocus","arrowLeft","arrowHelper","arrowHelperTop","arrowHelperBottom","link","linkFocus","linkDisabled","Object","assign","wrapLink","undefined","setRootNode","caption","captionTranslated","captionLink","captionDisabled","visibilityHidden","size","sizeLarge","sizeLargeIE11","sizeMedium","sizeMediumIE11","sizeSmall","sizeSmallIE11","iconLarge","iconMedium","iconSmall","wrapLarge","wrapMedium","wrapSmall","Component","__KONTUR_REACT_UI__","__BUTTON__","isButton"],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport { isReactUIComponent } from '../../lib/utils';\nimport { isIE11, isEdge } from '../../lib/client';\nimport { keyListener } from '../../lib/events/keyListener';\nimport { Theme } from '../../lib/theming/Theme';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Spinner } from '../Spinner';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\n\nimport { styles, activeStyles, globalClasses } from './Button.styles';\n\nexport type ButtonSize = 'small' | 'medium' | 'large';\nexport type ButtonType = 'button' | 'submit' | 'reset';\nexport type ButtonUse = 'default' | 'primary' | 'success' | 'danger' | 'pay' | 'link';\n\nexport interface ButtonProps extends CommonProps {\n /** @ignore */\n _noPadding?: boolean;\n\n /** @ignore */\n _noRightPadding?: boolean;\n\n /**\n * Применяет к кнопке стили псевдокласса `:active`.\n */\n active?: boolean;\n\n /**\n * CSS-свойство `text-align`.\n */\n align?: React.CSSProperties['textAlign'];\n\n /**\n * Превращает обычную кнопку в кнопку со стрелкой.\n */\n arrow?: boolean | 'left';\n\n /**\n * Даёт кнопке фокус после окончания загрузки страницы.\n */\n autoFocus?: boolean;\n\n /**\n * Убирает обводку у кнопки.\n */\n borderless?: boolean;\n\n /**\n * @ignore\n */\n checked?: boolean;\n\n children?: React.ReactNode;\n\n /** @ignore */\n corners?: React.CSSProperties;\n\n /**\n * Отключенное состояние кнопки.\n */\n disabled?: boolean;\n\n /** @ignore */\n disableFocus?: boolean;\n\n /**\n * Состояние валидации при ошибке.\n */\n error?: boolean;\n\n /**\n * Иконка слева от текста кнопки.\n */\n icon?: React.ReactElement<any>;\n\n /**\n * Переводит кнопку в состояние загрузки.\n */\n loading?: boolean;\n\n /**\n * Сужает кнопку.\n */\n narrow?: boolean;\n\n /**\n * HTML-событие `onblur`.\n */\n onBlur?: React.FocusEventHandler<HTMLButtonElement>;\n\n /**\n * HTML-событие `onclick`.\n */\n onClick?: React.MouseEventHandler<HTMLButtonElement>;\n\n /**\n * HTML-событие `onfocus`.\n */\n onFocus?: React.FocusEventHandler<HTMLButtonElement>;\n\n /**\n * HTML-событие `keydown`.\n */\n onKeyDown?: React.KeyboardEventHandler<HTMLButtonElement>;\n\n /**\n * HTML-событие `onmouseenter`.\n */\n onMouseEnter?: React.MouseEventHandler<HTMLButtonElement>;\n\n /**\n * HTML-событие `mouseleave`.\n */\n onMouseLeave?: React.MouseEventHandler<HTMLButtonElement>;\n\n /**\n * HTML-событие `onmouseover`.\n */\n onMouseOver?: React.MouseEventHandler<HTMLButtonElement>;\n\n /**\n * Задаёт размер кнопки.\n *\n * **Допустимые значения**: `\"small\"`, `\"medium\"`, `\"large\"`.\n */\n size?: ButtonSize;\n\n /**\n * HTML-атрибут `type`.\n */\n type?: ButtonType;\n\n /**\n * HTML-атрибут `title`.\n */\n title?: string;\n\n /**\n * Стиль кнопки.\n *\n * **Допустимые значения**: `\"default\"`, `\"primary\"`, `\"success\"`, `\"danger\"`, `\"pay\"`, `\"link\"`.\n */\n use?: ButtonUse;\n\n /** @ignore */\n visuallyFocused?: boolean;\n\n /**\n * Состояние валидации при предупреждении.\n */\n warning?: boolean;\n\n /**\n * CSS-свойство `width`.\n */\n width?: number | string;\n}\n\nexport interface ButtonState {\n focusedByTab: boolean;\n}\n\nexport const ButtonDataTids = {\n root: 'Button__root',\n} as const;\n\ntype DefaultProps = Required<Pick<ButtonProps, 'use' | 'size' | 'type'>>;\n\n@rootNode\nexport class Button extends React.Component<ButtonProps, ButtonState> {\n public static __KONTUR_REACT_UI__ = 'Button';\n public static __BUTTON__ = true;\n\n public static defaultProps: DefaultProps = {\n use: 'default',\n size: 'small',\n type: 'button',\n };\n\n private getProps = createPropsGetter(Button.defaultProps);\n\n public state = {\n focusedByTab: false,\n };\n\n private theme!: Theme;\n private node: HTMLButtonElement | null = null;\n private setRootNode!: TSetRootNode;\n\n public componentDidMount() {\n if (this.props.autoFocus) {\n keyListener.isTabPressed = true;\n this.focus();\n }\n }\n\n public static getDerivedStateFromProps(props: ButtonProps) {\n if (props.loading || props.disabled) {\n return { focusedByTab: false };\n }\n return null;\n }\n\n /**\n * @public\n */\n public focus() {\n this.node?.focus();\n }\n\n /**\n * @public\n */\n public blur() {\n this.node?.blur();\n }\n\n public render(): JSX.Element {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return this.renderMain();\n }}\n </ThemeContext.Consumer>\n );\n }\n\n private renderMain() {\n const {\n corners,\n active,\n disabled,\n borderless,\n checked,\n error,\n warning,\n loading,\n arrow,\n narrow,\n icon,\n _noPadding,\n _noRightPadding,\n visuallyFocused,\n align,\n disableFocus,\n onMouseEnter,\n onMouseLeave,\n onMouseOver,\n onKeyDown,\n onClick,\n width,\n children,\n } = this.props;\n const { use, type } = this.getProps();\n const sizeClass = this.getSizeClassName();\n\n const isFocused = this.state.focusedByTab || visuallyFocused;\n const isLink = use === 'link';\n const rootProps = {\n // By default the type attribute is 'submit'. IE8 will fire a click event\n // on this button if somewhere on the page user presses Enter while some\n // input is focused. So we set type to 'button' by default.\n type,\n className: cx({\n [styles.root(this.theme)]: true,\n [styles[use](this.theme)]: true,\n [activeStyles[use](this.theme)]: active,\n [sizeClass]: true,\n [styles.focus(this.theme)]: isFocused,\n [styles.checked(this.theme)]: checked,\n [styles.checkedFocused(this.theme)]: checked && isFocused,\n [styles.disabled(this.theme)]: disabled || loading,\n [styles.checkedDisabled(this.theme)]: checked && disabled,\n [styles.borderless()]: borderless && !disabled && !loading && !checked && !isFocused && !active,\n [styles.narrow()]: narrow,\n [styles.noPadding()]: _noPadding,\n [styles.noRightPadding()]: _noRightPadding,\n }),\n style: {\n textAlign: align,\n ...corners,\n },\n disabled: disabled || loading,\n onClick,\n onFocus: this.handleFocus,\n onBlur: this.handleBlur,\n onKeyDown,\n onMouseEnter,\n onMouseLeave,\n onMouseOver,\n tabIndex: disableFocus ? -1 : 0,\n title: this.props.title,\n };\n\n const wrapProps = {\n className: cx({\n [styles.wrap(this.theme)]: true,\n [styles.wrapArrow()]: arrow === true,\n [styles.wrapArrowLeft()]: arrow === 'left',\n [this.getSizeWrapClassName()]: true,\n }),\n style: {\n width,\n },\n };\n\n const innerShadowNode = <div className={globalClasses.innerShadow} />;\n\n let outlineNode = null;\n if (!isFocused || isLink) {\n outlineNode = (\n <div\n className={cx(styles.outline(), {\n [styles.outlineWarning(this.theme)]: warning,\n [styles.outlineError(this.theme)]: error,\n [styles.outlineLink()]: isLink,\n [styles.outlineLinkWarning(this.theme)]: isLink && warning,\n [styles.outlineLinkError(this.theme)]: isLink && error,\n })}\n />\n );\n }\n\n let loadingNode = null;\n if (loading && !icon) {\n loadingNode = <div className={styles.loading()}>{this.getLoadingSpinner()}</div>;\n }\n\n let iconNode = null;\n if (icon) {\n iconNode = (\n <span\n className={cx(styles.icon(), this.getSizeIconClassName(), {\n [styles.iconNoRightMargin()]: !children,\n [styles.iconLink(this.theme)]: isLink,\n })}\n >\n {loading ? this.getLoadingSpinner() : icon}\n </span>\n );\n }\n\n let arrowNode = null;\n if (arrow) {\n arrowNode = (\n <div\n className={cx({\n [styles.arrow()]: true,\n [styles.arrowWarning(this.theme)]: !checked && warning,\n [styles.arrowError(this.theme)]: !checked && error,\n [styles.arrowFocus(this.theme)]: !checked && isFocused,\n [styles.arrowLeft()]: arrow === 'left',\n })}\n >\n <div className={cx(globalClasses.arrowHelper, globalClasses.arrowHelperTop)} />\n <div className={cx(globalClasses.arrowHelper, globalClasses.arrowHelperBottom)} />\n </div>\n );\n }\n\n // Force disable all props and features, that cannot be use with Link\n if (isLink) {\n rootProps.className = cx({\n [styles.root(this.theme)]: true,\n [sizeClass]: true,\n [styles.link(this.theme)]: true,\n [styles.linkFocus(this.theme)]: isFocused,\n [styles.linkDisabled(this.theme)]: disabled || loading,\n });\n Object.assign(wrapProps, {\n className: cx(styles.wrap(this.theme), styles.wrapLink()),\n style: { width: wrapProps.style.width },\n });\n rootProps.style.textAlign = undefined;\n arrowNode = null;\n }\n\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <span {...wrapProps}>\n <button data-tid={ButtonDataTids.root} ref={this._ref} {...rootProps}>\n {innerShadowNode}\n {outlineNode}\n {loadingNode}\n {arrowNode}\n <div\n className={cx(styles.caption(), globalClasses.caption, {\n [styles.captionTranslated()]: active || checked,\n [styles.captionLink()]: isLink,\n [styles.captionDisabled()]: !checked && disabled,\n })}\n >\n {iconNode}\n <span className={cx({ [styles.visibilityHidden()]: !!loadingNode })}>{children}</span>\n </div>\n </button>\n </span>\n </CommonWrapper>\n );\n }\n\n private getLoadingSpinner() {\n return <Spinner caption={null} dimmed type=\"mini\" />;\n }\n\n private getSizeClassName() {\n switch (this.getProps().size) {\n case 'large':\n return cx(styles.sizeLarge(this.theme), { [styles.sizeLargeIE11(this.theme)]: isIE11 || isEdge });\n case 'medium':\n return cx(styles.sizeMedium(this.theme), { [styles.sizeMediumIE11(this.theme)]: isIE11 || isEdge });\n case 'small':\n default:\n return cx(styles.sizeSmall(this.theme), { [styles.sizeSmallIE11(this.theme)]: isIE11 || isEdge });\n }\n }\n\n private getSizeIconClassName() {\n switch (this.getProps().size) {\n case 'large':\n return styles.iconLarge(this.theme);\n case 'medium':\n return styles.iconMedium(this.theme);\n case 'small':\n default:\n return styles.iconSmall(this.theme);\n }\n }\n\n private getSizeWrapClassName() {\n switch (this.getProps().size) {\n case 'large':\n return styles.wrapLarge(this.theme);\n case 'medium':\n return styles.wrapMedium(this.theme);\n case 'small':\n default:\n return styles.wrapSmall(this.theme);\n }\n }\n\n private handleFocus = (e: React.FocusEvent<HTMLButtonElement>) => {\n if (!this.props.disabled && !this.props.disableFocus) {\n // focus event fires before keyDown eventlistener\n // so we should check tabPressed in async way\n requestAnimationFrame(() => {\n if (keyListener.isTabPressed) {\n this.setState({ focusedByTab: true });\n }\n });\n this.props.onFocus?.(e);\n }\n };\n\n private handleBlur = (e: React.FocusEvent<HTMLButtonElement>) => {\n this.setState({ focusedByTab: false });\n if (!this.props.disabled && !this.props.disableFocus) {\n this.props.onBlur?.(e);\n }\n };\n\n private _ref = (node: HTMLButtonElement | null) => {\n this.node = node;\n };\n}\n\nexport const isButton = isReactUIComponent<ButtonProps>('Button');\n"]}
1
+ {"version":3,"sources":["Button.tsx"],"names":["React","isReactUIComponent","isIE11","isEdge","keyListener","ThemeContext","Spinner","CommonWrapper","cx","rootNode","ThemeFactory","createPropsGetter","hasFakeUserAction","ArrowALeftIcon","ArrowARightIcon","getThemeName","styles","activeStyles","globalClasses","ButtonDataTids","root","Button","getProps","defaultProps","state","focusedByTab","node","handleFocus","e","props","disabled","disableFocus","requestAnimationFrame","isTabPressed","setState","onFocus","handleBlur","onBlur","_ref","componentDidMount","autoFocus","focus","getDerivedStateFromProps","loading","blur","render","theme","create","renderMain","corners","active","borderless","checked","error","warning","arrow","narrow","icon","_noPadding","_noRightPadding","visuallyFocused","align","onMouseEnter","onMouseLeave","onMouseOver","onKeyDown","onClick","width","children","use","type","sizeClass","getSizeClassName","isFocused","isLink","isTheme2022","rootProps","className","simulatedPress","checkedFocused","checkedDisabled","noPadding","noRightPadding","style","textAlign","tabIndex","title","wrapProps","wrap","wrapArrow","wrapArrowLeft","getSizeWrapClassName","innerShadowNode","innerShadow","outlineNode","outline","outlineWarning","outlineError","outlineLink","outlineLinkWarning","outlineLinkError","loadingNode","getLoadingSpinner","iconNode","getSizeIconClassName","iconNoRightMargin","iconLink","arrowNode","arrowWarning","arrowError","arrowFocus","arrowLeft","arrowHelper","arrowHelperTop","arrowHelperBottom","sizeIcon","btnIconSizeSmall","size","btnIconSizeMedium","btnIconSizeLarge","getRootWithArrowIconClassName","arrowIcon","parseInt","getArrowIconRootClassName","getLinkClassName","Boolean","Object","assign","wrapLink","undefined","setRootNode","caption","captionTranslated","captionLink","captionDisabled","text","visibilityHidden","sizeLarge","sizeLargeIE11","sizeLargeWithIcon","sizeMedium","sizeMediumIE11","sizeMediumWithIcon","sizeSmall","sizeSmallIE11","sizeSmallWithIcon","iconLarge","iconMedium","iconSmall","wrapLarge","wrapMedium","wrapSmall","focused","isBorderBottom","btnLinkLineBorderBottomWidth","link","linkFocus","linkDisabled","linkLine","linkLineFocus","linkLineDisabled","withArrowIconRightSmall","withArrowIconRightMedium","withArrowIconRightLarge","withArrowIconLeftSmall","withArrowIconLeftMedium","withArrowIconLeftLarge","arrowIconRoot","arrowIconRootSmall","arrowIconRootMedium","arrowIconRootLarge","arrowIconLeft","Component","__KONTUR_REACT_UI__","__BUTTON__","isButton"],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport { isReactUIComponent } from '../../lib/utils';\nimport { isIE11, isEdge } from '../../lib/client';\nimport { keyListener } from '../../lib/events/keyListener';\nimport { Theme, ThemeIn } from '../../lib/theming/Theme';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Spinner } from '../Spinner';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\nimport { hasFakeUserAction } from '../../internal/FakeUserActions/hasFakeUserAction';\nimport { ArrowALeftIcon, ArrowARightIcon } from '../../internal/icons/16px';\nimport { getThemeName } from '../../lib/theming/ThemeHelpers';\n\nimport { styles, activeStyles, globalClasses } from './Button.styles';\n\nexport type ButtonSize = 'small' | 'medium' | 'large';\nexport type ButtonType = 'button' | 'submit' | 'reset';\nexport type ButtonUse = 'default' | 'primary' | 'success' | 'danger' | 'pay' | 'link' | 'text' | 'backless';\n\nexport interface ButtonProps extends CommonProps {\n /** @ignore */\n _noPadding?: boolean;\n\n /** @ignore */\n _noRightPadding?: boolean;\n\n /**\n * Применяет к кнопке стили псевдокласса `:active`.\n */\n active?: boolean;\n\n /**\n * CSS-свойство `text-align`.\n */\n align?: React.CSSProperties['textAlign'];\n\n /**\n * Превращает обычную кнопку в кнопку со стрелкой.\n */\n arrow?: boolean | 'left';\n\n /**\n * Даёт кнопке фокус после окончания загрузки страницы.\n */\n autoFocus?: boolean;\n\n /**\n * Убирает обводку у кнопки.\n */\n borderless?: boolean;\n\n /**\n * Убирает фон у кнопки.\n */\n backless?: boolean;\n\n /**\n * @ignore\n */\n checked?: boolean;\n\n children?: React.ReactNode;\n\n /** @ignore */\n corners?: React.CSSProperties;\n\n /**\n * Отключенное состояние кнопки.\n */\n disabled?: boolean;\n\n /** @ignore */\n disableFocus?: boolean;\n\n /**\n * Состояние валидации при ошибке.\n */\n error?: boolean;\n\n /**\n * Иконка слева от текста кнопки.\n */\n icon?: React.ReactElement<any>;\n\n /**\n * Переводит кнопку в состояние загрузки.\n */\n loading?: boolean;\n\n /**\n * Сужает кнопку.\n */\n narrow?: boolean;\n\n /**\n * HTML-событие `onblur`.\n */\n onBlur?: React.FocusEventHandler<HTMLButtonElement>;\n\n /**\n * HTML-событие `onclick`.\n */\n onClick?: React.MouseEventHandler<HTMLButtonElement>;\n\n /**\n * HTML-событие `onfocus`.\n */\n onFocus?: React.FocusEventHandler<HTMLButtonElement>;\n\n /**\n * HTML-событие `keydown`.\n */\n onKeyDown?: React.KeyboardEventHandler<HTMLButtonElement>;\n\n /**\n * HTML-событие `onmouseenter`.\n */\n onMouseEnter?: React.MouseEventHandler<HTMLButtonElement>;\n\n /**\n * HTML-событие `mouseleave`.\n */\n onMouseLeave?: React.MouseEventHandler<HTMLButtonElement>;\n\n /**\n * HTML-событие `onmouseover`.\n */\n onMouseOver?: React.MouseEventHandler<HTMLButtonElement>;\n\n /**\n * Задаёт размер кнопки.\n *\n * **Допустимые значения**: `\"small\"`, `\"medium\"`, `\"large\"`.\n */\n size?: ButtonSize;\n\n /**\n * HTML-атрибут `type`.\n */\n type?: ButtonType;\n\n /**\n * HTML-атрибут `title`.\n */\n title?: string;\n\n /**\n * Стиль кнопки.\n *\n * **Допустимые значения**: `\"default\"`, `\"primary\"`, `\"success\"`, `\"danger\"`, `\"pay\"`, `\"link\"`.\n */\n use?: ButtonUse;\n\n /** @ignore */\n visuallyFocused?: boolean;\n\n /**\n * Состояние валидации при предупреждении.\n */\n warning?: boolean;\n\n /**\n * CSS-свойство `width`.\n */\n width?: number | string;\n theme?: ThemeIn;\n}\n\nexport interface ButtonState {\n focusedByTab: boolean;\n}\n\nexport const ButtonDataTids = {\n root: 'Button__root',\n} as const;\n\ntype DefaultProps = Required<Pick<ButtonProps, 'use' | 'size' | 'type'>>;\n\n@rootNode\nexport class Button extends React.Component<ButtonProps, ButtonState> {\n public static __KONTUR_REACT_UI__ = 'Button';\n public static __BUTTON__ = true;\n\n public static defaultProps: DefaultProps = {\n use: 'default',\n size: 'small',\n type: 'button',\n };\n\n private getProps = createPropsGetter(Button.defaultProps);\n\n public state = {\n focusedByTab: false,\n };\n\n private theme!: Theme;\n private node: HTMLButtonElement | null = null;\n private setRootNode!: TSetRootNode;\n\n public componentDidMount() {\n if (this.props.autoFocus) {\n keyListener.isTabPressed = true;\n this.focus();\n }\n }\n\n public static getDerivedStateFromProps(props: ButtonProps) {\n if (props.loading || props.disabled) {\n return { focusedByTab: false };\n }\n return null;\n }\n\n /**\n * @public\n */\n public focus() {\n this.node?.focus();\n }\n\n /**\n * @public\n */\n public blur() {\n this.node?.blur();\n }\n\n public render(): JSX.Element {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = this.props.theme ? ThemeFactory.create(this.props.theme as Theme, theme) : theme;\n return this.renderMain();\n }}\n </ThemeContext.Consumer>\n );\n }\n\n private renderMain() {\n const {\n corners,\n active,\n disabled,\n borderless,\n checked,\n error,\n warning,\n loading,\n arrow,\n narrow,\n icon,\n _noPadding,\n _noRightPadding,\n visuallyFocused,\n align,\n disableFocus,\n onMouseEnter,\n onMouseLeave,\n onMouseOver,\n onKeyDown,\n onClick,\n width,\n children,\n } = this.props;\n const { use, type } = this.getProps();\n const sizeClass = this.getSizeClassName();\n\n const isFocused = this.state.focusedByTab || visuallyFocused || hasFakeUserAction(this, 'focus');\n const isLink = use === 'link';\n const isTheme2022 = getThemeName(this.theme) === 'THEME_2022';\n const rootProps = {\n // By default the type attribute is 'submit'. IE8 will fire a click event\n // on this button if somewhere on the page user presses Enter while some\n // input is focused. So we set type to 'button' by default.\n type,\n className: cx({\n [styles.root(this.theme)]: true,\n [styles.simulatedPress()]: !isTheme2022,\n [styles[use](this.theme)]: true,\n [activeStyles[use](this.theme)]: active,\n [sizeClass]: true,\n [styles.focus(this.theme)]: isFocused,\n [styles.checked(this.theme)]: checked && !disabled,\n [styles.checkedFocused(this.theme)]: checked && isFocused && !disabled,\n [styles.disabled(this.theme)]: disabled || loading,\n [styles.checkedDisabled(this.theme)]: checked && disabled,\n [styles.borderless()]: borderless && !disabled && !loading && !checked && !isFocused && !active,\n [styles.narrow()]: narrow,\n [styles.noPadding()]: _noPadding,\n [styles.noRightPadding()]: _noRightPadding,\n }),\n style: {\n textAlign: align,\n ...corners,\n },\n disabled: disabled || loading,\n onClick,\n onFocus: this.handleFocus,\n onBlur: this.handleBlur,\n onKeyDown,\n onMouseEnter,\n onMouseLeave,\n onMouseOver,\n tabIndex: disableFocus ? -1 : 0,\n title: this.props.title,\n };\n\n const wrapProps = {\n className: cx({\n [styles.wrap(this.theme)]: true,\n [styles.wrapArrow()]: arrow === true && use !== 'text' && use !== 'backless',\n [styles.wrapArrowLeft()]: arrow === 'left' && use !== 'text' && use !== 'backless',\n [this.getSizeWrapClassName()]: true,\n }),\n style: {\n width,\n },\n };\n\n const innerShadowNode = <div className={globalClasses.innerShadow} />;\n\n let outlineNode = null;\n if (!isFocused || isLink) {\n outlineNode = (\n <div\n className={cx(styles.outline(), {\n [styles.outlineWarning(this.theme)]: warning,\n [styles.outlineError(this.theme)]: error,\n [styles.outlineLink()]: isLink,\n [styles.outlineLinkWarning(this.theme)]: isLink && warning,\n [styles.outlineLinkError(this.theme)]: isLink && error,\n })}\n />\n );\n }\n\n let loadingNode = null;\n if (loading && !icon) {\n loadingNode = <div className={styles.loading()}>{this.getLoadingSpinner()}</div>;\n }\n\n let iconNode = null;\n if (icon) {\n iconNode = (\n <span\n className={cx(styles.icon(), this.getSizeIconClassName(), {\n [styles.iconNoRightMargin()]: !children,\n [styles.iconLink(this.theme)]: isLink,\n })}\n >\n {loading ? this.getLoadingSpinner() : icon}\n </span>\n );\n }\n\n let arrowNode = null;\n if (arrow && use !== 'text' && use !== 'backless') {\n arrowNode = (\n <div\n className={cx({\n [styles.arrow()]: true,\n [styles.arrowWarning(this.theme)]: !checked && warning && !disabled,\n [styles.arrowError(this.theme)]: !checked && error && !disabled,\n [styles.arrowFocus(this.theme)]: !checked && isFocused && !disabled,\n [styles.arrowLeft()]: arrow === 'left',\n })}\n >\n <div className={cx(globalClasses.arrowHelper, globalClasses.arrowHelperTop)} />\n <div className={cx(globalClasses.arrowHelper, globalClasses.arrowHelperBottom)} />\n </div>\n );\n\n if (isTheme2022) {\n let sizeIcon = this.theme.btnIconSizeSmall;\n if (this.props.size === 'medium') {\n sizeIcon = this.theme.btnIconSizeMedium;\n } else if (this.props.size === 'large') {\n sizeIcon = this.theme.btnIconSizeLarge;\n }\n rootProps.className = cx(rootProps.className, this.getRootWithArrowIconClassName());\n const arrowIcon =\n arrow === 'left' ? (\n <ArrowALeftIcon size={parseInt(sizeIcon)} />\n ) : (\n <ArrowARightIcon size={parseInt(sizeIcon)} />\n );\n arrowNode = <div className={this.getArrowIconRootClassName()}>{arrowIcon}</div>;\n }\n }\n\n // Force disable all props and features, that cannot be use with Link\n if (isLink) {\n rootProps.className = cx({\n [styles.root(this.theme)]: true,\n [sizeClass]: true,\n [this.getLinkClassName(isFocused, Boolean(disabled || loading))]: true,\n });\n Object.assign(wrapProps, {\n className: cx(styles.wrap(this.theme), styles.wrapLink()),\n style: { width: wrapProps.style.width },\n });\n rootProps.style.textAlign = undefined;\n arrowNode = null;\n }\n\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <span {...wrapProps}>\n <button data-tid={ButtonDataTids.root} ref={this._ref} {...rootProps}>\n {innerShadowNode}\n {outlineNode}\n {loadingNode}\n {arrowNode}\n <div\n className={cx(styles.caption(), globalClasses.caption, {\n [styles.captionTranslated()]: active || checked,\n [styles.captionLink()]: isLink,\n [styles.captionDisabled()]: !checked && disabled,\n })}\n >\n {iconNode}\n <span\n className={cx(globalClasses.text, {\n [styles.visibilityHidden()]: !!loadingNode,\n })}\n >\n {children}\n </span>\n </div>\n </button>\n </span>\n </CommonWrapper>\n );\n }\n\n private getLoadingSpinner() {\n return <Spinner caption={null} dimmed type=\"mini\" />;\n }\n\n private getSizeClassName() {\n switch (this.getProps().size) {\n case 'large':\n return cx(styles.sizeLarge(this.theme), {\n [styles.sizeLargeIE11(this.theme)]: isIE11 || isEdge,\n [styles.sizeLargeWithIcon(this.theme)]: !!this.props.icon,\n });\n case 'medium':\n return cx(styles.sizeMedium(this.theme), {\n [styles.sizeMediumIE11(this.theme)]: isIE11 || isEdge,\n [styles.sizeMediumWithIcon(this.theme)]: !!this.props.icon,\n });\n case 'small':\n default:\n return cx(styles.sizeSmall(this.theme), {\n [styles.sizeSmallIE11(this.theme)]: isIE11 || isEdge,\n [styles.sizeSmallWithIcon(this.theme)]: !!this.props.icon,\n });\n }\n }\n\n private getSizeIconClassName() {\n switch (this.getProps().size) {\n case 'large':\n return styles.iconLarge(this.theme);\n case 'medium':\n return styles.iconMedium(this.theme);\n case 'small':\n default:\n return styles.iconSmall(this.theme);\n }\n }\n\n private getSizeWrapClassName() {\n switch (this.getProps().size) {\n case 'large':\n return styles.wrapLarge(this.theme);\n case 'medium':\n return styles.wrapMedium(this.theme);\n case 'small':\n default:\n return styles.wrapSmall(this.theme);\n }\n }\n\n private getLinkClassName(focused: boolean, disabled: boolean): string {\n const isBorderBottom = parseInt(this.theme.btnLinkLineBorderBottomWidth) > 0;\n\n return !isBorderBottom\n ? cx(styles.link(this.theme), {\n [styles.linkFocus(this.theme)]: focused,\n [styles.linkDisabled(this.theme)]: disabled,\n })\n : cx(styles.link(this.theme), styles.linkLine(this.theme), {\n [styles.linkLineFocus(this.theme)]: focused,\n [styles.linkLineDisabled(this.theme)]: disabled,\n });\n }\n\n private getRootWithArrowIconClassName() {\n const { arrow, size } = this.props;\n return cx({\n [styles.withArrowIconRightSmall(this.theme)]: arrow !== 'left' && size === 'small',\n [styles.withArrowIconRightMedium(this.theme)]: arrow !== 'left' && size === 'medium',\n [styles.withArrowIconRightLarge(this.theme)]: arrow !== 'left' && size === 'large',\n [styles.withArrowIconLeftSmall(this.theme)]: arrow === 'left' && size === 'small',\n [styles.withArrowIconLeftMedium(this.theme)]: arrow === 'left' && size === 'medium',\n [styles.withArrowIconLeftLarge(this.theme)]: arrow === 'left' && size === 'large',\n });\n }\n\n private getArrowIconRootClassName() {\n const { arrow, size } = this.props;\n return cx(styles.arrowIconRoot(), {\n [styles.arrowIconRootSmall(this.theme)]: size === 'small',\n [styles.arrowIconRootMedium(this.theme)]: size === 'medium',\n [styles.arrowIconRootLarge(this.theme)]: size === 'large',\n [styles.arrowIconLeft()]: arrow === 'left',\n });\n }\n\n private handleFocus = (e: React.FocusEvent<HTMLButtonElement>) => {\n if (!this.props.disabled && !this.props.disableFocus) {\n // focus event fires before keyDown eventlistener\n // so we should check tabPressed in async way\n requestAnimationFrame(() => {\n if (keyListener.isTabPressed) {\n this.setState({ focusedByTab: true });\n }\n });\n this.props.onFocus?.(e);\n }\n };\n\n private handleBlur = (e: React.FocusEvent<HTMLButtonElement>) => {\n this.setState({ focusedByTab: false });\n if (!this.props.disabled && !this.props.disableFocus) {\n this.props.onBlur?.(e);\n }\n };\n\n private _ref = (node: HTMLButtonElement | null) => {\n this.node = node;\n };\n}\n\nexport const isButton = isReactUIComponent<ButtonProps>('Button');\n"]}
@@ -1,8 +1,9 @@
1
1
  import React from 'react';
2
+ import { ThemeIn } from '../../lib/theming/Theme';
2
3
  import { CommonProps } from '../../internal/CommonWrapper';
3
4
  export declare type ButtonSize = 'small' | 'medium' | 'large';
4
5
  export declare type ButtonType = 'button' | 'submit' | 'reset';
5
- export declare type ButtonUse = 'default' | 'primary' | 'success' | 'danger' | 'pay' | 'link';
6
+ export declare type ButtonUse = 'default' | 'primary' | 'success' | 'danger' | 'pay' | 'link' | 'text' | 'backless';
6
7
  export interface ButtonProps extends CommonProps {
7
8
  /** @ignore */
8
9
  _noPadding?: boolean;
@@ -28,6 +29,10 @@ export interface ButtonProps extends CommonProps {
28
29
  * Убирает обводку у кнопки.
29
30
  */
30
31
  borderless?: boolean;
32
+ /**
33
+ * Убирает фон у кнопки.
34
+ */
35
+ backless?: boolean;
31
36
  /**
32
37
  * @ignore
33
38
  */
@@ -115,6 +120,7 @@ export interface ButtonProps extends CommonProps {
115
120
  * CSS-свойство `width`.
116
121
  */
117
122
  width?: number | string;
123
+ theme?: ThemeIn;
118
124
  }
119
125
  export interface ButtonState {
120
126
  focusedByTab: boolean;
@@ -152,6 +158,9 @@ export declare class Button extends React.Component<ButtonProps, ButtonState> {
152
158
  private getSizeClassName;
153
159
  private getSizeIconClassName;
154
160
  private getSizeWrapClassName;
161
+ private getLinkClassName;
162
+ private getRootWithArrowIconClassName;
163
+ private getArrowIconRootClassName;
155
164
  private handleFocus;
156
165
  private handleBlur;
157
166
  private _ref;
@@ -42,10 +42,10 @@ export var buttonUseMixin = function buttonUseMixin(btnBackground, btnBackground
42
42
  };
43
43
  export var buttonHoverMixin = function buttonHoverMixin(btnBackground, btnBackgroundStart, btnBackgroundEnd, borderColor, borderBottomColor, borderWidth) {
44
44
  var hasGradient = btnBackgroundStart !== btnBackgroundEnd;
45
- return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n &:hover:enabled {\n background-color: ", ";\n background-image: ", ";\n box-shadow: 0 0 0 ", " ", "", ";\n\n .", " {\n box-shadow: ", " 0 0 ", ";\n }\n }\n "])), hasGradient ? "initial" : btnBackground, hasGradient ? "linear-gradient(" + btnBackgroundStart + ", " + btnBackgroundEnd + ")" : "none", borderWidth, borderColor, borderBottomColor ? ", 0 " + borderWidth + " 0 0 " + borderBottomColor : "", globalClasses.arrowHelper, borderWidth, borderColor);
45
+ return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n background-color: ", ";\n background-image: ", ";\n box-shadow: 0 0 0 ", " ", "", ";\n\n .", " {\n box-shadow: ", " 0 0 ", ";\n }\n "])), hasGradient ? "initial" : btnBackground, hasGradient ? "linear-gradient(" + btnBackgroundStart + ", " + btnBackgroundEnd + ")" : "none", borderWidth, borderColor, borderBottomColor ? ", 0 " + borderWidth + " 0 0 " + borderBottomColor : "", globalClasses.arrowHelper, borderWidth, borderColor);
46
46
  };
47
47
  export var buttonActiveMixin = function buttonActiveMixin(btnBackground, btnShadow, borderColor, borderTopColor, borderWidth, arrowBgImage) {
48
- return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n background-image: none;\n background-color: ", ";\n box-shadow: 0 0 0 ", " ", "", ";\n\n .", " {\n box-shadow: ", ";\n }\n\n .", " {\n box-shadow: ", " 0 0 ", ";\n\n &.", " {\n background-image: ", ";\n }\n }\n "])), btnBackground, borderWidth, borderColor, borderTopColor ? ", 0 -" + borderWidth + " 0 0 " + borderTopColor : "", globalClasses.innerShadow, btnShadow, globalClasses.arrowHelper, borderWidth, borderColor, globalClasses.arrowHelperTop, arrowBgImage);
48
+ return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n &,\n &:hover {\n background-image: none;\n background-color: ", ";\n box-shadow: 0 0 0 ", " ", "", ";\n\n .", " {\n box-shadow: ", ";\n }\n\n .", " {\n box-shadow: ", " 0 0 ", ";\n\n &.", " {\n background-image: ", ";\n }\n }\n }\n "])), btnBackground, borderWidth, borderColor, borderTopColor ? ", 0 -" + borderWidth + " 0 0 " + borderTopColor : "", globalClasses.innerShadow, btnShadow, globalClasses.arrowHelper, borderWidth, borderColor, globalClasses.arrowHelperTop, arrowBgImage);
49
49
  };
50
50
  export var buttonSizeMixin = function buttonSizeMixin(fontSize, lineHeight, paddingX, paddingY, fontFamilyCompensation) {
51
51
  return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n font-size: ", ";\n box-sizing: border-box;\n padding: ", ";\n line-height: ", ";\n "])), fontSize, getBtnPadding(fontSize, paddingY, paddingX, fontFamilyCompensation), lineHeight);
@@ -1 +1 @@
1
- {"version":3,"sources":["Button.mixins.ts"],"names":["css","shift","globalClasses","getBtnPadding","fontSize","paddingY","paddingX","fontFamilyCompensation","additionalOffset","paddingTop","paddingBottom","offset","parseInt","shiftUp","top","bottom","buttonUseMixin","btnBackground","btnBackgroundStart","btnBackgroundEnd","color","borderColor","borderBottomColor","borderWidth","hasGradient","arrowHelper","buttonHoverMixin","buttonActiveMixin","btnShadow","borderTopColor","arrowBgImage","innerShadow","arrowHelperTop","buttonSizeMixin","lineHeight","buttonSizeMixinIE11","arrowOutlineMixin","insetWidth","outlineColor","outlineWidth","insetColor","arrowHelperBottom"],"mappings":"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","sourcesContent":["import { css } from '../../lib/theming/Emotion';\nimport { shift } from '../../lib/styles/DimensionFunctions';\n\nimport { globalClasses } from './Button.styles';\n\nconst getBtnPadding = (\n fontSize: string,\n paddingY: string,\n paddingX: string,\n fontFamilyCompensation: string,\n additionalOffset = 0,\n): string => {\n let paddingTop = paddingY;\n let paddingBottom = paddingY;\n const offset = parseInt(fontFamilyCompensation) || 0;\n\n const shiftUp = (top: string, bottom: string, offset: number) => {\n return [shift(top, `${-offset}`), shift(bottom, `${offset}`)];\n };\n\n if (fontSize === '16px' && offset) {\n [paddingTop, paddingBottom] = shiftUp(paddingTop, paddingBottom, offset);\n }\n if (additionalOffset && offset) {\n [paddingTop, paddingBottom] = shiftUp(paddingTop, paddingBottom, additionalOffset);\n }\n\n return `${paddingTop} ${paddingX} ${paddingBottom}`;\n};\n\nexport const buttonUseMixin = (\n btnBackground: string,\n btnBackgroundStart: string,\n btnBackgroundEnd: string,\n color: string,\n borderColor: string,\n borderBottomColor: string,\n borderWidth: string,\n) => {\n const hasGradient = btnBackgroundStart !== btnBackgroundEnd;\n return css`\n background-color: ${hasGradient ? `initial` : btnBackground};\n background-image: ${hasGradient ? `linear-gradient(${btnBackgroundStart}, ${btnBackgroundEnd})` : `none`};\n color: ${color};\n box-shadow: 0 0 0 ${borderWidth} ${borderColor}${borderBottomColor ? `, 0 ${borderWidth} 0 0 ${borderBottomColor}` : ``};\n\n .${globalClasses.arrowHelper} {\n box-shadow: ${borderWidth} 0 0 0 ${borderColor};\n }\n `;\n};\n\nexport const buttonHoverMixin = (\n btnBackground: string,\n btnBackgroundStart: string,\n btnBackgroundEnd: string,\n borderColor: string,\n borderBottomColor: string,\n borderWidth: string,\n) => {\n const hasGradient = btnBackgroundStart !== btnBackgroundEnd;\n return css`\n &:hover:enabled {\n background-color: ${hasGradient ? `initial` : btnBackground};\n background-image: ${hasGradient ? `linear-gradient(${btnBackgroundStart}, ${btnBackgroundEnd})` : `none`};\n box-shadow: 0 0 0 ${borderWidth} ${borderColor}${borderBottomColor ? `, 0 ${borderWidth} 0 0 ${borderBottomColor}` : ``};\n\n .${globalClasses.arrowHelper} {\n box-shadow: ${borderWidth} 0 0 ${borderColor};\n }\n }\n `;\n};\n\nexport const buttonActiveMixin = (\n btnBackground: string,\n btnShadow: string,\n borderColor: string,\n borderTopColor: string,\n borderWidth: string,\n arrowBgImage: string,\n) => {\n return css`\n background-image: none;\n background-color: ${btnBackground};\n box-shadow: 0 0 0 ${borderWidth} ${borderColor}${borderTopColor ? `, 0 -${borderWidth} 0 0 ${borderTopColor}` : ``};\n\n .${globalClasses.innerShadow} {\n box-shadow: ${btnShadow};\n }\n\n .${globalClasses.arrowHelper} {\n box-shadow: ${borderWidth} 0 0 ${borderColor};\n\n &.${globalClasses.arrowHelperTop} {\n background-image: ${arrowBgImage};\n }\n }\n `;\n};\n\nexport const buttonSizeMixin = (\n fontSize: string,\n lineHeight: string,\n paddingX: string,\n paddingY: string,\n fontFamilyCompensation: string,\n) => {\n return css`\n font-size: ${fontSize};\n box-sizing: border-box;\n padding: ${getBtnPadding(fontSize, paddingY, paddingX, fontFamilyCompensation)};\n line-height: ${lineHeight};\n `;\n};\n\nexport const buttonSizeMixinIE11 = (\n fontSize: string,\n paddingX: string,\n paddingY: string,\n fontFamilyCompensation: string,\n) => {\n return css`\n padding: ${getBtnPadding(fontSize, paddingY, paddingX, fontFamilyCompensation, 1)};\n line-height: normal;\n `;\n};\n\nexport const arrowOutlineMixin = (\n insetWidth: string,\n outlineColor: string,\n outlineWidth: string,\n insetColor: string,\n) => {\n return css`\n .${globalClasses.arrowHelper} {\n &.${globalClasses.arrowHelperTop} {\n box-shadow: inset -${insetWidth} ${insetWidth} 0 0 ${insetColor}, ${outlineWidth} 0 0 0 ${outlineColor} !important; // override :active styles\n }\n\n &.${globalClasses.arrowHelperBottom} {\n box-shadow: inset -${insetWidth} -${insetWidth} 0 0 ${insetColor}, ${outlineWidth} 0 0 0 ${outlineColor} !important; // override :active styles\n }\n\n // don't hide inner outline\n // and keep the middle-line fix\n &:before {\n top: ${insetWidth};\n right: ${insetWidth};\n left: ${insetWidth};\n }\n &.${globalClasses.arrowHelperBottom}:before {\n bottom: ${insetWidth};\n }\n }\n `;\n};\n"]}
1
+ {"version":3,"sources":["Button.mixins.ts"],"names":["css","shift","globalClasses","getBtnPadding","fontSize","paddingY","paddingX","fontFamilyCompensation","additionalOffset","paddingTop","paddingBottom","offset","parseInt","shiftUp","top","bottom","buttonUseMixin","btnBackground","btnBackgroundStart","btnBackgroundEnd","color","borderColor","borderBottomColor","borderWidth","hasGradient","arrowHelper","buttonHoverMixin","buttonActiveMixin","btnShadow","borderTopColor","arrowBgImage","innerShadow","arrowHelperTop","buttonSizeMixin","lineHeight","buttonSizeMixinIE11","arrowOutlineMixin","insetWidth","outlineColor","outlineWidth","insetColor","arrowHelperBottom"],"mappings":"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","sourcesContent":["import { css } from '../../lib/theming/Emotion';\nimport { shift } from '../../lib/styles/DimensionFunctions';\n\nimport { globalClasses } from './Button.styles';\n\nconst getBtnPadding = (\n fontSize: string,\n paddingY: string,\n paddingX: string,\n fontFamilyCompensation: string,\n additionalOffset = 0,\n): string => {\n let paddingTop = paddingY;\n let paddingBottom = paddingY;\n const offset = parseInt(fontFamilyCompensation) || 0;\n\n const shiftUp = (top: string, bottom: string, offset: number) => {\n return [shift(top, `${-offset}`), shift(bottom, `${offset}`)];\n };\n\n if (fontSize === '16px' && offset) {\n [paddingTop, paddingBottom] = shiftUp(paddingTop, paddingBottom, offset);\n }\n if (additionalOffset && offset) {\n [paddingTop, paddingBottom] = shiftUp(paddingTop, paddingBottom, additionalOffset);\n }\n\n return `${paddingTop} ${paddingX} ${paddingBottom}`;\n};\n\nexport const buttonUseMixin = (\n btnBackground: string,\n btnBackgroundStart: string,\n btnBackgroundEnd: string,\n color: string,\n borderColor: string,\n borderBottomColor: string,\n borderWidth: string,\n) => {\n const hasGradient = btnBackgroundStart !== btnBackgroundEnd;\n return css`\n background-color: ${hasGradient ? `initial` : btnBackground};\n background-image: ${hasGradient ? `linear-gradient(${btnBackgroundStart}, ${btnBackgroundEnd})` : `none`};\n color: ${color};\n box-shadow: 0 0 0 ${borderWidth} ${borderColor}${borderBottomColor ? `, 0 ${borderWidth} 0 0 ${borderBottomColor}` : ``};\n\n .${globalClasses.arrowHelper} {\n box-shadow: ${borderWidth} 0 0 0 ${borderColor};\n }\n `;\n};\n\nexport const buttonHoverMixin = (\n btnBackground: string,\n btnBackgroundStart: string,\n btnBackgroundEnd: string,\n borderColor: string,\n borderBottomColor: string,\n borderWidth: string,\n) => {\n const hasGradient = btnBackgroundStart !== btnBackgroundEnd;\n return css`\n background-color: ${hasGradient ? `initial` : btnBackground};\n background-image: ${hasGradient ? `linear-gradient(${btnBackgroundStart}, ${btnBackgroundEnd})` : `none`};\n box-shadow: 0 0 0 ${borderWidth} ${borderColor}${borderBottomColor ? `, 0 ${borderWidth} 0 0 ${borderBottomColor}` : ``};\n\n .${globalClasses.arrowHelper} {\n box-shadow: ${borderWidth} 0 0 ${borderColor};\n }\n `;\n};\n\nexport const buttonActiveMixin = (\n btnBackground: string,\n btnShadow: string,\n borderColor: string,\n borderTopColor: string,\n borderWidth: string,\n arrowBgImage: string,\n) => {\n return css`\n &,\n &:hover {\n background-image: none;\n background-color: ${btnBackground};\n box-shadow: 0 0 0 ${borderWidth} ${borderColor}${borderTopColor ? `, 0 -${borderWidth} 0 0 ${borderTopColor}` : ``};\n\n .${globalClasses.innerShadow} {\n box-shadow: ${btnShadow};\n }\n\n .${globalClasses.arrowHelper} {\n box-shadow: ${borderWidth} 0 0 ${borderColor};\n\n &.${globalClasses.arrowHelperTop} {\n background-image: ${arrowBgImage};\n }\n }\n }\n `;\n};\n\nexport const buttonSizeMixin = (\n fontSize: string,\n lineHeight: string,\n paddingX: string,\n paddingY: string,\n fontFamilyCompensation: string,\n) => {\n return css`\n font-size: ${fontSize};\n box-sizing: border-box;\n padding: ${getBtnPadding(fontSize, paddingY, paddingX, fontFamilyCompensation)};\n line-height: ${lineHeight};\n `;\n};\n\nexport const buttonSizeMixinIE11 = (\n fontSize: string,\n paddingX: string,\n paddingY: string,\n fontFamilyCompensation: string,\n) => {\n return css`\n padding: ${getBtnPadding(fontSize, paddingY, paddingX, fontFamilyCompensation, 1)};\n line-height: normal;\n `;\n};\n\nexport const arrowOutlineMixin = (\n insetWidth: string,\n outlineColor: string,\n outlineWidth: string,\n insetColor: string,\n) => {\n return css`\n .${globalClasses.arrowHelper} {\n &.${globalClasses.arrowHelperTop} {\n box-shadow: inset -${insetWidth} ${insetWidth} 0 0 ${insetColor}, ${outlineWidth} 0 0 0 ${outlineColor} !important; // override :active styles\n }\n\n &.${globalClasses.arrowHelperBottom} {\n box-shadow: inset -${insetWidth} -${insetWidth} 0 0 ${insetColor}, ${outlineWidth} 0 0 0 ${outlineColor} !important; // override :active styles\n }\n\n // don't hide inner outline\n // and keep the middle-line fix\n &:before {\n top: ${insetWidth};\n right: ${insetWidth};\n left: ${insetWidth};\n }\n &.${globalClasses.arrowHelperBottom}:before {\n bottom: ${insetWidth};\n }\n }\n `;\n};\n"]}