@skbkontur/react-ui 0.0.0-a18e664e8f → 0.0.0-a2ba583fb2

package/components/Clickable/ClickableButton.mixins/ClickableButton.mixins.js

@@ -0,0 +1,81 @@
+import _taggedTemplateLiteralLoose from "@babel/runtime/helpers/esm/taggedTemplateLiteralLoose";
+
+var _templateObject, _templateObject2, _templateObject3, _templateObject4;
+
+import { shift } from "../../../lib/styles/DimensionFunctions";
+import { css } from "../../../lib/theming/Emotion";
+import { buttonGlobalClasses } from "../ClickableButton.styles";
+
+var getButtonPadding = function getButtonPadding(_ref) {
+  var fontSize = _ref.fontSize,
+      paddingY = _ref.paddingY,
+      paddingX = _ref.paddingX,
+      fontFamilyCompensation = _ref.fontFamilyCompensation,
+      _ref$additionalOffset = _ref.additionalOffset,
+      additionalOffset = _ref$additionalOffset === void 0 ? 0 : _ref$additionalOffset;
+  var paddingTop = paddingY;
+  var paddingBottom = paddingY;
+  var offset = parseInt(fontFamilyCompensation) || 0;
+
+  var shiftUp = function shiftUp(top, bottom, offset) {
+    return [shift(top, "" + -offset), shift(bottom, "" + offset)];
+  };
+
+  if (fontSize === '16px' && offset) {
+    var _shiftUp = shiftUp(paddingTop, paddingBottom, offset);
+
+    paddingTop = _shiftUp[0];
+    paddingBottom = _shiftUp[1];
+  }
+
+  if (additionalOffset && offset) {
+    var _shiftUp2 = shiftUp(paddingTop, paddingBottom, additionalOffset);
+
+    paddingTop = _shiftUp2[0];
+    paddingBottom = _shiftUp2[1];
+  }
+
+  return paddingTop + " " + paddingX + " " + paddingBottom;
+};
+
+export var buttonUseMixin = function buttonUseMixin(_ref2) {
+  var btnBackground = _ref2.btnBackground,
+      btnBackgroundStart = _ref2.btnBackgroundStart,
+      btnBackgroundEnd = _ref2.btnBackgroundEnd,
+      color = _ref2.color,
+      borderColor = _ref2.borderColor,
+      borderBottomColor = _ref2.borderBottomColor,
+      borderWidth = _ref2.borderWidth;
+  var hasGradient = btnBackgroundStart !== btnBackgroundEnd;
+  return css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n    background-color: ", ";\n    background-image: ", ";\n    color: ", ";\n    box-shadow: 0 0 0 ", " ", "", ";\n\n    &[aria-disabled='false'],\n    :hover {\n      .", " svg,\n      .", " svg {\n        color: ", ";\n      }\n    }\n  "])), hasGradient ? "initial" : btnBackground, hasGradient ? "linear-gradient(" + btnBackgroundStart + ", " + btnBackgroundEnd + ")" : "none", color, borderWidth, borderColor, borderBottomColor ? ", 0 " + borderWidth + " 0 0 " + borderBottomColor : "", buttonGlobalClasses.icon, buttonGlobalClasses.arrow, color);
+};
+export var buttonHoverMixin = function buttonHoverMixin(_ref3) {
+  var btnBackground = _ref3.btnBackground,
+      btnBackgroundStart = _ref3.btnBackgroundStart,
+      btnBackgroundEnd = _ref3.btnBackgroundEnd,
+      borderColor = _ref3.borderColor,
+      borderBottomColor = _ref3.borderBottomColor,
+      borderWidth = _ref3.borderWidth;
+  var hasGradient = btnBackgroundStart !== btnBackgroundEnd;
+  return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n    background-color: ", ";\n    background-image: ", ";\n    box-shadow: 0 0 0 ", " ", "", ";\n  "])), hasGradient ? "initial" : btnBackground, hasGradient ? "linear-gradient(" + btnBackgroundStart + ", " + btnBackgroundEnd + ")" : "none", borderWidth, borderColor, borderBottomColor ? ", 0 " + borderWidth + " 0 0 " + borderBottomColor : "");
+};
+export var buttonActiveMixin = function buttonActiveMixin(_ref4) {
+  var btnBackground = _ref4.btnBackground,
+      borderColor = _ref4.borderColor,
+      borderTopColor = _ref4.borderTopColor,
+      borderWidth = _ref4.borderWidth;
+  return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n    &,\n    &:hover {\n      background-image: none !important; // override :hover styles\n      background-color: ", " !important; // override :hover styles\n      box-shadow: 0 0 0 ", " ", "", " !important; // override :hover styles\n    }\n  "])), btnBackground, borderWidth, borderColor, borderTopColor ? ", 0 -" + borderWidth + " 0 0 " + borderTopColor : "");
+};
+export var buttonSizeMixin = function buttonSizeMixin(_ref5) {
+  var fontSize = _ref5.fontSize,
+      lineHeight = _ref5.lineHeight,
+      paddingX = _ref5.paddingX,
+      paddingY = _ref5.paddingY,
+      fontFamilyCompensation = _ref5.fontFamilyCompensation;
+  return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n    font-size: ", ";\n    box-sizing: border-box;\n    padding: ", ";\n    line-height: ", ";\n  "])), fontSize, getButtonPadding({
+    fontSize: fontSize,
+    paddingY: paddingY,
+    paddingX: paddingX,
+    fontFamilyCompensation: fontFamilyCompensation
+  }), lineHeight);
+};

package/components/Clickable/ClickableButton.mixins/ClickableButton.mixins.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["ClickableButton.mixins.ts"],"names":["shift","css","buttonGlobalClasses","getButtonPadding","fontSize","paddingY","paddingX","fontFamilyCompensation","additionalOffset","paddingTop","paddingBottom","offset","parseInt","shiftUp","top","bottom","buttonUseMixin","btnBackground","btnBackgroundStart","btnBackgroundEnd","color","borderColor","borderBottomColor","borderWidth","hasGradient","icon","arrow","buttonHoverMixin","buttonActiveMixin","borderTopColor","buttonSizeMixin","lineHeight"],"mappings":"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","sourcesContent":["import { shift } from '../../lib/styles/DimensionFunctions';\nimport { css } from '../../lib/theming/Emotion';\n\nimport { buttonGlobalClasses } from './ClickableButton.styles';\n\nconst getButtonPadding = ({\n  fontSize,\n  paddingY,\n  paddingX,\n  fontFamilyCompensation,\n  additionalOffset = 0,\n}: {\n  fontSize: string;\n  paddingY: string;\n  paddingX: string;\n  fontFamilyCompensation: string;\n  additionalOffset?: number;\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,\n  btnBackgroundStart,\n  btnBackgroundEnd,\n  color,\n  borderColor,\n  borderBottomColor,\n  borderWidth,\n}: {\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    &[aria-disabled='false'],\n    :hover {\n      .${buttonGlobalClasses.icon} svg,\n      .${buttonGlobalClasses.arrow} svg {\n        color: ${color};\n      }\n    }\n  `;\n};\n\nexport const buttonHoverMixin = ({\n  btnBackground,\n  btnBackgroundStart,\n  btnBackgroundEnd,\n  borderColor,\n  borderBottomColor,\n  borderWidth,\n}: {\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};\n\nexport const buttonActiveMixin = ({\n  btnBackground,\n  borderColor,\n  borderTopColor,\n  borderWidth,\n}: {\n  btnBackground: string;\n  borderColor: string;\n  borderTopColor?: string;\n  borderWidth: string;\n}) => {\n  return css`\n    &,\n    &:hover {\n      background-image: none !important; // override :hover styles\n      background-color: ${btnBackground} !important; // override :hover styles\n      box-shadow: 0 0 0 ${borderWidth} ${borderColor}${borderTopColor ? `, 0 -${borderWidth} 0 0 ${borderTopColor}` : ``} !important; // override :hover styles\n    }\n  `;\n};\n\nexport const buttonSizeMixin = ({\n  fontSize,\n  lineHeight,\n  paddingX,\n  paddingY,\n  fontFamilyCompensation,\n}: {\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: ${getButtonPadding({ fontSize, paddingY, paddingX, fontFamilyCompensation })};\n    line-height: ${lineHeight};\n  `;\n};\n"]}

package/components/Clickable/ClickableButton.mixins/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../../cjs/components/Clickable/ClickableButton.mixins.js",
+  "module": "ClickableButton.mixins",
+  "types": "../ClickableButton.mixins.d.ts",
+  "sideEffects": false
+}

package/components/Clickable/ClickableButton.mixins.d.ts

@@ -0,0 +1,30 @@
+export declare const buttonUseMixin: ({ btnBackground, btnBackgroundStart, btnBackgroundEnd, color, borderColor, borderBottomColor, borderWidth, }: {
+    btnBackground: string;
+    btnBackgroundStart?: string | undefined;
+    btnBackgroundEnd?: string | undefined;
+    color: string;
+    borderColor: string;
+    borderBottomColor?: string | undefined;
+    borderWidth: string;
+}) => string;
+export declare const buttonHoverMixin: ({ btnBackground, btnBackgroundStart, btnBackgroundEnd, borderColor, borderBottomColor, borderWidth, }: {
+    btnBackground: string;
+    btnBackgroundStart?: string | undefined;
+    btnBackgroundEnd?: string | undefined;
+    borderColor: string;
+    borderBottomColor?: string | undefined;
+    borderWidth: string;
+}) => string;
+export declare const buttonActiveMixin: ({ btnBackground, borderColor, borderTopColor, borderWidth, }: {
+    btnBackground: string;
+    borderColor: string;
+    borderTopColor?: string | undefined;
+    borderWidth: string;
+}) => string;
+export declare const buttonSizeMixin: ({ fontSize, lineHeight, paddingX, paddingY, fontFamilyCompensation, }: {
+    fontSize: string;
+    lineHeight: string;
+    paddingX: string;
+    paddingY: string;
+    fontFamilyCompensation: string;
+}) => string;

package/components/Clickable/ClickableButton.styles/ClickableButton.styles.js

@@ -0,0 +1,313 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _taggedTemplateLiteralLoose from "@babel/runtime/helpers/esm/taggedTemplateLiteralLoose";
+
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23, _templateObject24, _templateObject25, _templateObject26, _templateObject27, _templateObject28, _templateObject29, _templateObject30, _templateObject31, _templateObject32, _templateObject33, _templateObject34, _templateObject35, _templateObject36, _templateObject37, _templateObject38, _templateObject39;
+
+import { css, cx, memoizeStyle, prefix } from "../../../lib/theming/Emotion";
+import { buttonActiveMixin, buttonHoverMixin, buttonSizeMixin, buttonUseMixin } from "../ClickableButton.mixins";
+export var buttonGlobalClasses = prefix('clickable-button')({
+  arrow: 'arrow',
+  icon: 'icon'
+});
+export var buttonStyles = memoizeStyle({
+  buttonRoot: function buttonRoot(t) {
+    return css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n      transition: background-color ", " ", "\n        ", ";\n\n      background-clip: ", ";\n      background-position: center;\n      background-repeat: no-repeat;\n      background-size: contain;\n      display: inline-block;\n      position: relative;\n      text-align: center;\n      width: 100%;\n\n      &::-moz-focus-inner {\n        border: 0;\n        padding: 0;\n      }\n      &::after {\n        content: '';\n        display: inline-block;\n        vertical-align: baseline;\n        width: 0;\n      }\n\n      &:hover svg {\n        color: ", ";\n      }\n      &[aria-disabled='true'] svg {\n        color: ", ";\n      }\n      & svg {\n        color: ", ";\n      }\n    "])), t.transitionDuration, t.transitionTimingFunction, t.btnBorderColorTransition ? ", " + t.btnBorderColorTransition : '', t.btnBackgroundClip, t.btnIconHoverColor, t.btnIconDisabledColor, t.btnIconColor);
+  },
+  buttonDefault: function buttonDefault(t) {
+    return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n      ", ";\n\n      &:hover {\n        ", ";\n      }\n\n      &:active {\n        ", ";\n      }\n    "])), buttonUseMixin({
+      btnBackground: t.btnDefaultBg,
+      btnBackgroundStart: t.btnDefaultBgStart,
+      btnBackgroundEnd: t.btnDefaultBgEnd,
+      color: t.btnDefaultTextColor,
+      borderColor: t.btnDefaultBorderColor,
+      borderBottomColor: t.btnDefaultBorderBottomColor,
+      borderWidth: t.btnBorderWidth
+    }), buttonHoverMixin({
+      btnBackground: t.btnDefaultHoverBg,
+      btnBackgroundStart: t.btnDefaultHoverBgStart,
+      btnBackgroundEnd: t.btnDefaultHoverBgEnd,
+      borderColor: t.btnDefaultHoverBorderColor,
+      borderBottomColor: t.btnDefaultHoverBorderBottomColor,
+      borderWidth: t.btnBorderWidth
+    }), buttonActiveStyles.buttonDefault(t));
+  },
+  buttonPrimary: function buttonPrimary(t) {
+    return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n      ", ";\n\n      &:hover {\n        ", ";\n      }\n\n      &:active {\n        ", "\n      }\n    "])), buttonUseMixin({
+      btnBackground: t.btnPrimaryBg,
+      btnBackgroundStart: t.btnPrimaryBgStart,
+      btnBackgroundEnd: t.btnPrimaryBgEnd,
+      color: t.btnPrimaryTextColor,
+      borderColor: t.btnPrimaryBorderColor,
+      borderBottomColor: t.btnPrimaryBorderBottomColor,
+      borderWidth: t.btnBorderWidth
+    }), buttonHoverMixin({
+      btnBackground: t.btnPrimaryHoverBg,
+      btnBackgroundStart: t.btnPrimaryHoverBgStart,
+      btnBackgroundEnd: t.btnPrimaryHoverBgEnd,
+      borderColor: t.btnPrimaryHoverBorderColor,
+      borderBottomColor: t.btnPrimaryHoverBorderBottomColor,
+      borderWidth: t.btnBorderWidth
+    }), buttonActiveStyles.buttonPrimary(t));
+  },
+  buttonSuccess: function buttonSuccess(t) {
+    return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n      ", ";\n\n      &:hover {\n        ", ";\n      }\n\n      &:active {\n        ", "\n      }\n    "])), buttonUseMixin({
+      btnBackground: t.btnSuccessBg,
+      btnBackgroundStart: t.btnSuccessBgStart,
+      btnBackgroundEnd: t.btnSuccessBgEnd,
+      color: t.btnSuccessTextColor,
+      borderColor: t.btnSuccessBorderColor,
+      borderBottomColor: t.btnSuccessBorderBottomColor,
+      borderWidth: t.btnBorderWidth
+    }), buttonHoverMixin({
+      btnBackground: t.btnSuccessHoverBg,
+      btnBackgroundStart: t.btnSuccessHoverBgStart,
+      btnBackgroundEnd: t.btnSuccessHoverBgEnd,
+      borderColor: t.btnSuccessHoverBorderColor,
+      borderBottomColor: t.btnSuccessHoverBorderBottomColor,
+      borderWidth: t.btnBorderWidth
+    }), buttonActiveStyles.buttonSuccess(t));
+  },
+  buttonDanger: function buttonDanger(t) {
+    return css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n      ", ";\n\n      &:hover {\n        ", ";\n      }\n\n      &:active {\n        ", "\n      }\n    "])), buttonUseMixin({
+      btnBackground: t.btnDangerBg,
+      btnBackgroundStart: t.btnDangerBgStart,
+      btnBackgroundEnd: t.btnDangerBgEnd,
+      color: t.btnDangerTextColor,
+      borderColor: t.btnDangerBorderColor,
+      borderBottomColor: t.btnDangerBorderBottomColor,
+      borderWidth: t.btnBorderWidth
+    }), buttonHoverMixin({
+      btnBackground: t.btnDangerHoverBg,
+      btnBackgroundStart: t.btnDangerHoverBgStart,
+      btnBackgroundEnd: t.btnDangerHoverBgEnd,
+      borderColor: t.btnDangerHoverBorderColor,
+      borderBottomColor: t.btnDangerHoverBorderBottomColor,
+      borderWidth: t.btnBorderWidth
+    }), buttonActiveStyles.buttonDanger(t));
+  },
+  buttonPay: function buttonPay(t) {
+    return css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n      ", ";\n\n      &:hover {\n        ", ";\n      }\n\n      &:active {\n        ", "\n      }\n    "])), buttonUseMixin({
+      btnBackground: t.btnPayBg,
+      btnBackgroundStart: t.btnPayBgStart,
+      btnBackgroundEnd: t.btnPayBgEnd,
+      color: t.btnPayTextColor,
+      borderColor: t.btnPayBorderColor,
+      borderBottomColor: t.btnPayBorderBottomColor,
+      borderWidth: t.btnBorderWidth
+    }), buttonHoverMixin({
+      btnBackground: t.btnPayHoverBg,
+      btnBackgroundStart: t.btnPayHoverBgStart,
+      btnBackgroundEnd: t.btnPayHoverBgEnd,
+      borderColor: t.btnPayHoverBorderColor,
+      borderBottomColor: t.btnPayHoverBorderBottomColor,
+      borderWidth: t.btnBorderWidth
+    }), buttonActiveStyles.buttonPay(t));
+  },
+  buttonText: function buttonText(t) {
+    return css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["\n      &,\n      &:hover {\n        box-shadow: none;\n      }\n\n      ", ";\n\n      &:hover {\n        ", ";\n      }\n\n      &:active {\n        ", "\n      }\n    "])), buttonUseMixin({
+      btnBackground: t.btnTextBg,
+      color: t.btnTextTextColor,
+      borderColor: t.btnTextBorderColor,
+      borderWidth: t.btnBorderWidth
+    }), buttonHoverMixin({
+      btnBackground: t.btnTextHoverBg,
+      borderColor: t.btnTextHoverBorderColor,
+      borderWidth: t.btnBorderWidth
+    }), buttonActiveStyles.buttonText(t));
+  },
+  buttonBackless: function buttonBackless(t) {
+    return css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n      ", ";\n\n      color: ", ";\n      background: transparent;\n\n      &:hover {\n        ", ";\n      }\n\n      &:active {\n        ", "\n      }\n    "])), buttonUseMixin({
+      btnBackground: t.btnBacklessBg,
+      color: t.btnBacklessTextColor,
+      borderColor: t.btnBacklessBorderColor,
+      borderWidth: t.btnBorderWidth
+    }), t.btnDefaultTextColor, buttonHoverMixin({
+      btnBackground: t.btnBacklessHoverBg,
+      borderColor: t.btnBacklessHoverBorderColor,
+      borderWidth: t.btnBorderWidth
+    }), buttonActiveStyles.buttonBackless(t));
+  },
+  buttonBorderless: function buttonBorderless() {
+    return css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteralLoose(["\n      &,\n      &:active:hover,\n      &:hover {\n        box-shadow: none !important; // override root:hover style\n      }\n    "])));
+  },
+  buttonSizeSmall: function buttonSizeSmall(t) {
+    return css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteralLoose(["\n      border-radius: ", ";\n\n      ", ";\n    "])), t.btnBorderRadiusSmall, buttonSizeMixin({
+      fontSize: t.btnFontSizeSmall,
+      lineHeight: t.btnLineHeightSmall,
+      paddingX: t.btnPaddingXSmall,
+      paddingY: t.btnPaddingYSmall,
+      fontFamilyCompensation: t.fontFamilyCompensationBaseline
+    }));
+  },
+  buttonSizeMedium: function buttonSizeMedium(t) {
+    return css(_templateObject11 || (_templateObject11 = _taggedTemplateLiteralLoose(["\n      border-radius: ", ";\n\n      ", ";\n    "])), t.btnBorderRadiusMedium, buttonSizeMixin({
+      fontSize: t.btnFontSizeMedium,
+      lineHeight: t.btnLineHeightMedium,
+      paddingX: t.btnPaddingXMedium,
+      paddingY: t.btnPaddingYMedium,
+      fontFamilyCompensation: t.fontFamilyCompensationBaseline
+    }));
+  },
+  buttonSizeLarge: function buttonSizeLarge(t) {
+    return css(_templateObject12 || (_templateObject12 = _taggedTemplateLiteralLoose(["\n      border-radius: ", ";\n\n      ", ";\n    "])), t.btnBorderRadiusLarge, buttonSizeMixin({
+      fontSize: t.btnFontSizeLarge,
+      lineHeight: t.btnLineHeightLarge,
+      paddingX: t.btnPaddingXLarge,
+      paddingY: t.btnPaddingYLarge,
+      fontFamilyCompensation: t.fontFamilyCompensationBaseline
+    }));
+  },
+  buttonSizeSmallWithLeftIcon: function buttonSizeSmallWithLeftIcon(t) {
+    return css(_templateObject13 || (_templateObject13 = _taggedTemplateLiteralLoose(["\n      padding-left: ", ";\n    "])), t.btnWithIconPaddingLeftSmall);
+  },
+  buttonSizeSmallWithRightIcon: function buttonSizeSmallWithRightIcon(t) {
+    return css(_templateObject14 || (_templateObject14 = _taggedTemplateLiteralLoose(["\n      padding-right: ", ";\n    "])), t.btnWithIconPaddingRightSmall);
+  },
+  buttonSizeSmallWithIconWithoutText: function buttonSizeSmallWithIconWithoutText(t) {
+    return css(_templateObject15 || (_templateObject15 = _taggedTemplateLiteralLoose(["\n      padding-left: ", ";\n      padding-right: ", ";\n    "])), t.btnWithIconPaddingLeftSmall, t.btnWithIconPaddingRightSmall);
+  },
+  buttonSizeMediumWithLeftIcon: function buttonSizeMediumWithLeftIcon(t) {
+    return css(_templateObject16 || (_templateObject16 = _taggedTemplateLiteralLoose(["\n      padding-left: ", ";\n    "])), t.btnWithIconPaddingLeftMedium);
+  },
+  buttonSizeMediumWithRightIcon: function buttonSizeMediumWithRightIcon(t) {
+    return css(_templateObject17 || (_templateObject17 = _taggedTemplateLiteralLoose(["\n      padding-right: ", ";\n    "])), t.btnWithIconPaddingRightMedium);
+  },
+  buttonSizeMediumWithIconWithoutText: function buttonSizeMediumWithIconWithoutText(t) {
+    return css(_templateObject18 || (_templateObject18 = _taggedTemplateLiteralLoose(["\n      padding-left: ", ";\n      padding-right: ", ";\n    "])), t.btnWithIconPaddingLeftMedium, t.btnWithIconPaddingRightMedium);
+  },
+  buttonSizeLargeWithLeftIcon: function buttonSizeLargeWithLeftIcon(t) {
+    return css(_templateObject19 || (_templateObject19 = _taggedTemplateLiteralLoose(["\n      padding-left: ", ";\n    "])), t.btnWithIconPaddingLeftLarge);
+  },
+  buttonSizeLargeWithRightIcon: function buttonSizeLargeWithRightIcon(t) {
+    return css(_templateObject20 || (_templateObject20 = _taggedTemplateLiteralLoose(["\n      padding-right: ", ";\n    "])), t.btnWithIconPaddingRightLarge);
+  },
+  buttonSizeLargeWithIconWithoutText: function buttonSizeLargeWithIconWithoutText(t) {
+    return css(_templateObject21 || (_templateObject21 = _taggedTemplateLiteralLoose(["\n      padding-left: ", ";\n      padding-right: ", ";\n    "])), t.btnWithIconPaddingLeftLarge, t.btnWithIconPaddingRightLarge);
+  },
+  buttonNarrow: function buttonNarrow() {
+    return css(_templateObject22 || (_templateObject22 = _taggedTemplateLiteralLoose(["\n      padding-left: 5px;\n      padding-right: 5px;\n    "])));
+  },
+  buttonDisabled: function buttonDisabled(t) {
+    return css(_templateObject23 || (_templateObject23 = _taggedTemplateLiteralLoose(["\n      cursor: default;\n      pointer-events: none;\n\n      box-shadow: 0 0 0 ", " ", ";\n\n      background-image: none;\n      background-color: ", ";\n      color: ", ";\n    "])), t.btnBorderWidth, t.btnDisabledBorderColor, t.btnDisabledBg, t.btnDisabledTextColor);
+  },
+  buttonDisabledWithoutOutline: function buttonDisabledWithoutOutline(t) {
+    return css(_templateObject24 || (_templateObject24 = _taggedTemplateLiteralLoose(["\n      box-shadow: 0 0 0 ", " ", ";\n    "])), t.btnBorderWidth, t.btnDisabledBg);
+  },
+  buttonFocus: function buttonFocus(t) {
+    return css(_templateObject25 || (_templateObject25 = _taggedTemplateLiteralLoose(["\n      position: relative;\n      z-index: 2;\n\n      &,\n      &:hover,\n      &:active,\n      &:active:hover {\n        box-shadow: inset 0 0 0 ", " ", ",\n          0 0 0 ", " ", " !important; // override root:hover style\n      }\n    "])), t.btnInsetWidth, t.btnOutlineColorFocus, t.btnFocusShadowWidth, t.btnBorderColorFocus);
+  },
+  buttonWithArrowIconRightSmall: function buttonWithArrowIconRightSmall(t) {
+    return css(_templateObject26 || (_templateObject26 = _taggedTemplateLiteralLoose(["\n      padding-right: calc(", " + ", " + ", ");\n    "])), t.btnIconSizeSmall, t.btnWithIconPaddingLeftSmall, t.btnWithIconPaddingLeftSmall);
+  },
+  buttonWithArrowIconRightMedium: function buttonWithArrowIconRightMedium(t) {
+    return css(_templateObject27 || (_templateObject27 = _taggedTemplateLiteralLoose(["\n      padding-right: calc(\n        ", " + ", " + ", "\n      );\n    "])), t.btnIconSizeMedium, t.btnWithIconPaddingLeftMedium, t.btnWithIconPaddingLeftMedium);
+  },
+  buttonWithArrowIconRightLarge: function buttonWithArrowIconRightLarge(t) {
+    return css(_templateObject28 || (_templateObject28 = _taggedTemplateLiteralLoose(["\n      padding-right: calc(", " + ", " + ", ");\n    "])), t.btnIconSizeLarge, t.btnWithIconPaddingLeftLarge, t.btnWithIconPaddingLeftLarge);
+  },
+  buttonWithArrowIconLeftSmall: function buttonWithArrowIconLeftSmall(t) {
+    return css(_templateObject29 || (_templateObject29 = _taggedTemplateLiteralLoose(["\n      padding-left: calc(", " + ", " + ", ");\n    "])), t.btnIconSizeSmall, t.btnWithIconPaddingLeftSmall, t.btnWithIconPaddingLeftSmall);
+  },
+  buttonWithArrowIconLeftMedium: function buttonWithArrowIconLeftMedium(t) {
+    return css(_templateObject30 || (_templateObject30 = _taggedTemplateLiteralLoose(["\n      padding-left: calc(\n        ", " + ", " + ", "\n      );\n    "])), t.btnIconSizeMedium, t.btnWithIconPaddingLeftMedium, t.btnWithIconPaddingLeftMedium);
+  },
+  buttonWithArrowIconLeftLarge: function buttonWithArrowIconLeftLarge(t) {
+    return css(_templateObject31 || (_templateObject31 = _taggedTemplateLiteralLoose(["\n      padding-left: calc(", " + ", " + ", ");\n    "])), t.btnIconSizeLarge, t.btnWithIconPaddingLeftLarge, t.btnWithIconPaddingLeftLarge);
+  }
+});
+export var buttonActiveStyles = memoizeStyle({
+  buttonDefault: function buttonDefault(t) {
+    return css(_templateObject32 || (_templateObject32 = _taggedTemplateLiteralLoose(["\n      & {\n        ", ";\n      }\n    "])), buttonActiveMixin({
+      btnBackground: t.btnDefaultActiveBg,
+      borderColor: t.btnDefaultActiveBorderColor,
+      borderTopColor: t.btnDefaultActiveBorderTopColor,
+      borderWidth: t.btnBorderWidth
+    }));
+  },
+  buttonPrimary: function buttonPrimary(t) {
+    return css(_templateObject33 || (_templateObject33 = _taggedTemplateLiteralLoose(["\n      & {\n        ", ";\n      }\n    "])), buttonActiveMixin({
+      btnBackground: t.btnPrimaryActiveBg,
+      borderColor: t.btnPrimaryActiveBorderColor,
+      borderTopColor: t.btnPrimaryActiveBorderTopColor,
+      borderWidth: t.btnBorderWidth
+    }));
+  },
+  buttonSuccess: function buttonSuccess(t) {
+    return css(_templateObject34 || (_templateObject34 = _taggedTemplateLiteralLoose(["\n      & {\n        ", ";\n      }\n    "])), buttonActiveMixin({
+      btnBackground: t.btnSuccessActiveBg,
+      borderColor: t.btnSuccessActiveBorderColor,
+      borderTopColor: t.btnSuccessActiveBorderTopColor,
+      borderWidth: t.btnBorderWidth
+    }));
+  },
+  buttonDanger: function buttonDanger(t) {
+    return css(_templateObject35 || (_templateObject35 = _taggedTemplateLiteralLoose(["\n      & {\n        ", ";\n      }\n    "])), buttonActiveMixin({
+      btnBackground: t.btnDangerActiveBg,
+      borderColor: t.btnDangerActiveBorderColor,
+      borderTopColor: t.btnDangerActiveBorderTopColor,
+      borderWidth: t.btnBorderWidth
+    }));
+  },
+  buttonPay: function buttonPay(t) {
+    return css(_templateObject36 || (_templateObject36 = _taggedTemplateLiteralLoose(["\n      & {\n        ", ";\n      }\n    "])), buttonActiveMixin({
+      btnBackground: t.btnPayActiveBg,
+      borderColor: t.btnPayActiveBorderColor,
+      borderTopColor: t.btnPayActiveBorderTopColor,
+      borderWidth: t.btnBorderWidth
+    }));
+  },
+  buttonLink: function buttonLink(t) {
+    return css(_templateObject37 || (_templateObject37 = _taggedTemplateLiteralLoose(["\n      & {\n        color: ", ";\n      }\n    "])), t.btnLinkActiveColor);
+  },
+  buttonText: function buttonText(t) {
+    return css(_templateObject38 || (_templateObject38 = _taggedTemplateLiteralLoose(["\n      & {\n        ", ";\n      }\n    "])), buttonActiveMixin({
+      btnBackground: t.btnTextActiveBg,
+      borderColor: t.btnTextActiveBg,
+      borderWidth: t.btnBorderWidth
+    }));
+  },
+  buttonBackless: function buttonBackless(t) {
+    return css(_templateObject39 || (_templateObject39 = _taggedTemplateLiteralLoose(["\n      &,\n      &:hover {\n        background: ", ";\n      }\n    "])), t.btnBacklessActiveBg);
+  }
+});
+export var getButtonSize = function getButtonSize(_ref) {
+  var _ref4;
+
+  var size = _ref.size,
+      leftIcon = _ref.leftIcon,
+      rightIcon = _ref.rightIcon,
+      children = _ref.children,
+      theme = _ref.theme;
+  var hasIconAndNoContent = (!!leftIcon || !!rightIcon) && !children;
+
+  if (size === 'large') {
+    var _ref2;
+
+    return _ref2 = {}, _ref2[buttonStyles.buttonSizeLarge(theme)] = true, _ref2[buttonStyles.buttonSizeLargeWithLeftIcon(theme)] = !!leftIcon, _ref2[buttonStyles.buttonSizeLargeWithRightIcon(theme)] = !!rightIcon, _ref2[buttonStyles.buttonSizeLargeWithIconWithoutText(theme)] = hasIconAndNoContent, _ref2;
+  }
+
+  if (size === 'medium') {
+    var _ref3;
+
+    return _ref3 = {}, _ref3[buttonStyles.buttonSizeMedium(theme)] = true, _ref3[buttonStyles.buttonSizeMediumWithLeftIcon(theme)] = !!leftIcon, _ref3[buttonStyles.buttonSizeMediumWithRightIcon(theme)] = !!rightIcon, _ref3[buttonStyles.buttonSizeMediumWithIconWithoutText(theme)] = hasIconAndNoContent, _ref3;
+  }
+
+  return _ref4 = {}, _ref4[buttonStyles.buttonSizeSmall(theme)] = true, _ref4[buttonStyles.buttonSizeSmallWithLeftIcon(theme)] = !!leftIcon, _ref4[buttonStyles.buttonSizeSmallWithRightIcon(theme)] = !!rightIcon, _ref4[buttonStyles.buttonSizeSmallWithIconWithoutText(theme)] = hasIconAndNoContent, _ref4;
+};
+export var getButtonStyles = function getButtonStyles(_ref5) {
+  var _extends2, _extends3;
+
+  var use = _ref5.use,
+      buttonSize = _ref5.buttonSize,
+      theme = _ref5.theme,
+      arrow = _ref5.arrow,
+      size = _ref5.size,
+      isNarrow = _ref5.isNarrow,
+      isBorderless = _ref5.isBorderless,
+      isFocused = _ref5.isFocused,
+      isActive = _ref5.isActive,
+      isNotInteractive = _ref5.isNotInteractive;
+  var active = !isNotInteractive && isActive;
+  var isUseStateWithoutOutlineInDisabledState = !['default', 'backless'].includes(use != null ? use : '');
+  return cx(_extends((_extends2 = {}, _extends2[buttonStyles.buttonRoot(theme)] = true, _extends2[buttonStyles.buttonDefault(theme)] = use === 'default' || use === undefined, _extends2[buttonStyles.buttonPrimary(theme)] = use === 'primary', _extends2[buttonStyles.buttonSuccess(theme)] = use === 'success', _extends2[buttonStyles.buttonDanger(theme)] = use === 'danger', _extends2[buttonStyles.buttonPay(theme)] = use === 'pay', _extends2[buttonStyles.buttonText(theme)] = use === 'text', _extends2[buttonStyles.buttonBackless(theme)] = use === 'backless', _extends2[buttonActiveStyles.buttonDefault(theme)] = (use === 'default' || use === undefined) && active, _extends2[buttonActiveStyles.buttonPrimary(theme)] = use === 'primary' && active, _extends2[buttonActiveStyles.buttonSuccess(theme)] = use === 'success' && active, _extends2[buttonActiveStyles.buttonDanger(theme)] = use === 'danger' && active, _extends2[buttonActiveStyles.buttonPay(theme)] = use === 'pay' && active, _extends2[buttonActiveStyles.buttonText(theme)] = use === 'text' && active, _extends2[buttonActiveStyles.buttonBackless(theme)] = use === 'backless' && active, _extends2[buttonStyles.buttonFocus(theme)] = isFocused, _extends2), buttonSize, (_extends3 = {}, _extends3[buttonStyles.buttonNarrow()] = isNarrow, _extends3[buttonStyles.buttonWithArrowIconRightSmall(theme)] = arrow === 'right' && size === 'small', _extends3[buttonStyles.buttonWithArrowIconRightMedium(theme)] = arrow === 'right' && size === 'medium', _extends3[buttonStyles.buttonWithArrowIconRightLarge(theme)] = arrow === 'right' && size === 'large', _extends3[buttonStyles.buttonWithArrowIconLeftSmall(theme)] = arrow === 'left' && size === 'small', _extends3[buttonStyles.buttonWithArrowIconLeftMedium(theme)] = arrow === 'left' && size === 'medium', _extends3[buttonStyles.buttonWithArrowIconLeftLarge(theme)] = arrow === 'left' && size === 'large', _extends3[buttonStyles.buttonDisabled(theme)] = isNotInteractive, _extends3[buttonStyles.buttonDisabledWithoutOutline(theme)] = isUseStateWithoutOutlineInDisabledState && isNotInteractive, _extends3[buttonStyles.buttonBorderless()] = isBorderless && (!isFocused || isNotInteractive), _extends3)));
+};

package/components/Clickable/ClickableButton.styles/ClickableButton.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["ClickableButton.styles.ts"],"names":["css","cx","memoizeStyle","prefix","buttonActiveMixin","buttonHoverMixin","buttonSizeMixin","buttonUseMixin","buttonGlobalClasses","arrow","icon","buttonStyles","buttonRoot","t","transitionDuration","transitionTimingFunction","btnBorderColorTransition","btnBackgroundClip","btnIconHoverColor","btnIconDisabledColor","btnIconColor","buttonDefault","btnBackground","btnDefaultBg","btnBackgroundStart","btnDefaultBgStart","btnBackgroundEnd","btnDefaultBgEnd","color","btnDefaultTextColor","borderColor","btnDefaultBorderColor","borderBottomColor","btnDefaultBorderBottomColor","borderWidth","btnBorderWidth","btnDefaultHoverBg","btnDefaultHoverBgStart","btnDefaultHoverBgEnd","btnDefaultHoverBorderColor","btnDefaultHoverBorderBottomColor","buttonActiveStyles","buttonPrimary","btnPrimaryBg","btnPrimaryBgStart","btnPrimaryBgEnd","btnPrimaryTextColor","btnPrimaryBorderColor","btnPrimaryBorderBottomColor","btnPrimaryHoverBg","btnPrimaryHoverBgStart","btnPrimaryHoverBgEnd","btnPrimaryHoverBorderColor","btnPrimaryHoverBorderBottomColor","buttonSuccess","btnSuccessBg","btnSuccessBgStart","btnSuccessBgEnd","btnSuccessTextColor","btnSuccessBorderColor","btnSuccessBorderBottomColor","btnSuccessHoverBg","btnSuccessHoverBgStart","btnSuccessHoverBgEnd","btnSuccessHoverBorderColor","btnSuccessHoverBorderBottomColor","buttonDanger","btnDangerBg","btnDangerBgStart","btnDangerBgEnd","btnDangerTextColor","btnDangerBorderColor","btnDangerBorderBottomColor","btnDangerHoverBg","btnDangerHoverBgStart","btnDangerHoverBgEnd","btnDangerHoverBorderColor","btnDangerHoverBorderBottomColor","buttonPay","btnPayBg","btnPayBgStart","btnPayBgEnd","btnPayTextColor","btnPayBorderColor","btnPayBorderBottomColor","btnPayHoverBg","btnPayHoverBgStart","btnPayHoverBgEnd","btnPayHoverBorderColor","btnPayHoverBorderBottomColor","buttonText","btnTextBg","btnTextTextColor","btnTextBorderColor","btnTextHoverBg","btnTextHoverBorderColor","buttonBackless","btnBacklessBg","btnBacklessTextColor","btnBacklessBorderColor","btnBacklessHoverBg","btnBacklessHoverBorderColor","buttonBorderless","buttonSizeSmall","btnBorderRadiusSmall","fontSize","btnFontSizeSmall","lineHeight","btnLineHeightSmall","paddingX","btnPaddingXSmall","paddingY","btnPaddingYSmall","fontFamilyCompensation","fontFamilyCompensationBaseline","buttonSizeMedium","btnBorderRadiusMedium","btnFontSizeMedium","btnLineHeightMedium","btnPaddingXMedium","btnPaddingYMedium","buttonSizeLarge","btnBorderRadiusLarge","btnFontSizeLarge","btnLineHeightLarge","btnPaddingXLarge","btnPaddingYLarge","buttonSizeSmallWithLeftIcon","btnWithIconPaddingLeftSmall","buttonSizeSmallWithRightIcon","btnWithIconPaddingRightSmall","buttonSizeSmallWithIconWithoutText","buttonSizeMediumWithLeftIcon","btnWithIconPaddingLeftMedium","buttonSizeMediumWithRightIcon","btnWithIconPaddingRightMedium","buttonSizeMediumWithIconWithoutText","buttonSizeLargeWithLeftIcon","btnWithIconPaddingLeftLarge","buttonSizeLargeWithRightIcon","btnWithIconPaddingRightLarge","buttonSizeLargeWithIconWithoutText","buttonNarrow","buttonDisabled","btnDisabledBorderColor","btnDisabledBg","btnDisabledTextColor","buttonDisabledWithoutOutline","buttonFocus","btnInsetWidth","btnOutlineColorFocus","btnFocusShadowWidth","btnBorderColorFocus","buttonWithArrowIconRightSmall","btnIconSizeSmall","buttonWithArrowIconRightMedium","btnIconSizeMedium","buttonWithArrowIconRightLarge","btnIconSizeLarge","buttonWithArrowIconLeftSmall","buttonWithArrowIconLeftMedium","buttonWithArrowIconLeftLarge","btnDefaultActiveBg","btnDefaultActiveBorderColor","borderTopColor","btnDefaultActiveBorderTopColor","btnPrimaryActiveBg","btnPrimaryActiveBorderColor","btnPrimaryActiveBorderTopColor","btnSuccessActiveBg","btnSuccessActiveBorderColor","btnSuccessActiveBorderTopColor","btnDangerActiveBg","btnDangerActiveBorderColor","btnDangerActiveBorderTopColor","btnPayActiveBg","btnPayActiveBorderColor","btnPayActiveBorderTopColor","buttonLink","btnLinkActiveColor","btnTextActiveBg","btnBacklessActiveBg","getButtonSize","size","leftIcon","rightIcon","children","theme","hasIconAndNoContent","getButtonStyles","use","buttonSize","isNarrow","isBorderless","isFocused","isActive","isNotInteractive","active","isUseStateWithoutOutlineInDisabledState","includes","undefined"],"mappings":"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","sourcesContent":["import { Theme } from '../../lib/theming/Theme';\nimport { css, cx, memoizeStyle, prefix } from '../../lib/theming/Emotion';\n\nimport { GetStylesBase } from './Clickable.styles';\nimport { ClickableProps } from './Clickable';\nimport { buttonActiveMixin, buttonHoverMixin, buttonSizeMixin, buttonUseMixin } from './ClickableButton.mixins';\n\nexport const buttonGlobalClasses = prefix('clickable-button')({\n  arrow: 'arrow',\n  icon: 'icon',\n});\n\nexport const buttonStyles = memoizeStyle({\n  buttonRoot(t: Theme) {\n    return css`\n      transition: background-color ${t.transitionDuration} ${t.transitionTimingFunction}\n        ${t.btnBorderColorTransition ? `, ${t.btnBorderColorTransition}` : ''};\n\n      background-clip: ${t.btnBackgroundClip};\n      background-position: center;\n      background-repeat: no-repeat;\n      background-size: contain;\n      display: inline-block;\n      position: relative;\n      text-align: center;\n      width: 100%;\n\n      &::-moz-focus-inner {\n        border: 0;\n        padding: 0;\n      }\n      &::after {\n        content: '';\n        display: inline-block;\n        vertical-align: baseline;\n        width: 0;\n      }\n\n      &:hover svg {\n        color: ${t.btnIconHoverColor};\n      }\n      &[aria-disabled='true'] svg {\n        color: ${t.btnIconDisabledColor};\n      }\n      & svg {\n        color: ${t.btnIconColor};\n      }\n    `;\n  },\n\n  buttonDefault(t: Theme) {\n    return css`\n      ${buttonUseMixin({\n        btnBackground: t.btnDefaultBg,\n        btnBackgroundStart: t.btnDefaultBgStart,\n        btnBackgroundEnd: t.btnDefaultBgEnd,\n        color: t.btnDefaultTextColor,\n        borderColor: t.btnDefaultBorderColor,\n        borderBottomColor: t.btnDefaultBorderBottomColor,\n        borderWidth: t.btnBorderWidth,\n      })};\n\n      &:hover {\n        ${buttonHoverMixin({\n          btnBackground: t.btnDefaultHoverBg,\n          btnBackgroundStart: t.btnDefaultHoverBgStart,\n          btnBackgroundEnd: t.btnDefaultHoverBgEnd,\n          borderColor: t.btnDefaultHoverBorderColor,\n          borderBottomColor: t.btnDefaultHoverBorderBottomColor,\n          borderWidth: t.btnBorderWidth,\n        })};\n      }\n\n      &:active {\n        ${buttonActiveStyles.buttonDefault(t)};\n      }\n    `;\n  },\n  buttonPrimary(t: Theme) {\n    return css`\n      ${buttonUseMixin({\n        btnBackground: t.btnPrimaryBg,\n        btnBackgroundStart: t.btnPrimaryBgStart,\n        btnBackgroundEnd: t.btnPrimaryBgEnd,\n        color: t.btnPrimaryTextColor,\n        borderColor: t.btnPrimaryBorderColor,\n        borderBottomColor: t.btnPrimaryBorderBottomColor,\n        borderWidth: t.btnBorderWidth,\n      })};\n\n      &:hover {\n        ${buttonHoverMixin({\n          btnBackground: t.btnPrimaryHoverBg,\n          btnBackgroundStart: t.btnPrimaryHoverBgStart,\n          btnBackgroundEnd: t.btnPrimaryHoverBgEnd,\n          borderColor: t.btnPrimaryHoverBorderColor,\n          borderBottomColor: t.btnPrimaryHoverBorderBottomColor,\n          borderWidth: t.btnBorderWidth,\n        })};\n      }\n\n      &:active {\n        ${buttonActiveStyles.buttonPrimary(t)}\n      }\n    `;\n  },\n  buttonSuccess(t: Theme) {\n    return css`\n      ${buttonUseMixin({\n        btnBackground: t.btnSuccessBg,\n        btnBackgroundStart: t.btnSuccessBgStart,\n        btnBackgroundEnd: t.btnSuccessBgEnd,\n        color: t.btnSuccessTextColor,\n        borderColor: t.btnSuccessBorderColor,\n        borderBottomColor: t.btnSuccessBorderBottomColor,\n        borderWidth: t.btnBorderWidth,\n      })};\n\n      &:hover {\n        ${buttonHoverMixin({\n          btnBackground: t.btnSuccessHoverBg,\n          btnBackgroundStart: t.btnSuccessHoverBgStart,\n          btnBackgroundEnd: t.btnSuccessHoverBgEnd,\n          borderColor: t.btnSuccessHoverBorderColor,\n          borderBottomColor: t.btnSuccessHoverBorderBottomColor,\n          borderWidth: t.btnBorderWidth,\n        })};\n      }\n\n      &:active {\n        ${buttonActiveStyles.buttonSuccess(t)}\n      }\n    `;\n  },\n  buttonDanger(t: Theme) {\n    return css`\n      ${buttonUseMixin({\n        btnBackground: t.btnDangerBg,\n        btnBackgroundStart: t.btnDangerBgStart,\n        btnBackgroundEnd: t.btnDangerBgEnd,\n        color: t.btnDangerTextColor,\n        borderColor: t.btnDangerBorderColor,\n        borderBottomColor: t.btnDangerBorderBottomColor,\n        borderWidth: t.btnBorderWidth,\n      })};\n\n      &:hover {\n        ${buttonHoverMixin({\n          btnBackground: t.btnDangerHoverBg,\n          btnBackgroundStart: t.btnDangerHoverBgStart,\n          btnBackgroundEnd: t.btnDangerHoverBgEnd,\n          borderColor: t.btnDangerHoverBorderColor,\n          borderBottomColor: t.btnDangerHoverBorderBottomColor,\n          borderWidth: t.btnBorderWidth,\n        })};\n      }\n\n      &:active {\n        ${buttonActiveStyles.buttonDanger(t)}\n      }\n    `;\n  },\n  buttonPay(t: Theme) {\n    return css`\n      ${buttonUseMixin({\n        btnBackground: t.btnPayBg,\n        btnBackgroundStart: t.btnPayBgStart,\n        btnBackgroundEnd: t.btnPayBgEnd,\n        color: t.btnPayTextColor,\n        borderColor: t.btnPayBorderColor,\n        borderBottomColor: t.btnPayBorderBottomColor,\n        borderWidth: t.btnBorderWidth,\n      })};\n\n      &:hover {\n        ${buttonHoverMixin({\n          btnBackground: t.btnPayHoverBg,\n          btnBackgroundStart: t.btnPayHoverBgStart,\n          btnBackgroundEnd: t.btnPayHoverBgEnd,\n          borderColor: t.btnPayHoverBorderColor,\n          borderBottomColor: t.btnPayHoverBorderBottomColor,\n          borderWidth: t.btnBorderWidth,\n        })};\n      }\n\n      &:active {\n        ${buttonActiveStyles.buttonPay(t)}\n      }\n    `;\n  },\n  buttonText(t: Theme) {\n    return css`\n      &,\n      &:hover {\n        box-shadow: none;\n      }\n\n      ${buttonUseMixin({\n        btnBackground: t.btnTextBg,\n        color: t.btnTextTextColor,\n        borderColor: t.btnTextBorderColor,\n        borderWidth: t.btnBorderWidth,\n      })};\n\n      &:hover {\n        ${buttonHoverMixin({\n          btnBackground: t.btnTextHoverBg,\n          borderColor: t.btnTextHoverBorderColor,\n          borderWidth: t.btnBorderWidth,\n        })};\n      }\n\n      &:active {\n        ${buttonActiveStyles.buttonText(t)}\n      }\n    `;\n  },\n  buttonBackless(t: Theme) {\n    return css`\n      ${buttonUseMixin({\n        btnBackground: t.btnBacklessBg,\n        color: t.btnBacklessTextColor,\n        borderColor: t.btnBacklessBorderColor,\n        borderWidth: t.btnBorderWidth,\n      })};\n\n      color: ${t.btnDefaultTextColor};\n      background: transparent;\n\n      &:hover {\n        ${buttonHoverMixin({\n          btnBackground: t.btnBacklessHoverBg,\n          borderColor: t.btnBacklessHoverBorderColor,\n          borderWidth: t.btnBorderWidth,\n        })};\n      }\n\n      &:active {\n        ${buttonActiveStyles.buttonBackless(t)}\n      }\n    `;\n  },\n  buttonBorderless() {\n    return css`\n      &,\n      &:active:hover,\n      &:hover {\n        box-shadow: none !important; // override root:hover style\n      }\n    `;\n  },\n\n  buttonSizeSmall(t: Theme) {\n    return css`\n      border-radius: ${t.btnBorderRadiusSmall};\n\n      ${buttonSizeMixin({\n        fontSize: t.btnFontSizeSmall,\n        lineHeight: t.btnLineHeightSmall,\n        paddingX: t.btnPaddingXSmall,\n        paddingY: t.btnPaddingYSmall,\n        fontFamilyCompensation: t.fontFamilyCompensationBaseline,\n      })};\n    `;\n  },\n  buttonSizeMedium(t: Theme) {\n    return css`\n      border-radius: ${t.btnBorderRadiusMedium};\n\n      ${buttonSizeMixin({\n        fontSize: t.btnFontSizeMedium,\n        lineHeight: t.btnLineHeightMedium,\n        paddingX: t.btnPaddingXMedium,\n        paddingY: t.btnPaddingYMedium,\n        fontFamilyCompensation: t.fontFamilyCompensationBaseline,\n      })};\n    `;\n  },\n  buttonSizeLarge(t: Theme) {\n    return css`\n      border-radius: ${t.btnBorderRadiusLarge};\n\n      ${buttonSizeMixin({\n        fontSize: t.btnFontSizeLarge,\n        lineHeight: t.btnLineHeightLarge,\n        paddingX: t.btnPaddingXLarge,\n        paddingY: t.btnPaddingYLarge,\n        fontFamilyCompensation: t.fontFamilyCompensationBaseline,\n      })};\n    `;\n  },\n\n  buttonSizeSmallWithLeftIcon(t: Theme) {\n    return css`\n      padding-left: ${t.btnWithIconPaddingLeftSmall};\n    `;\n  },\n  buttonSizeSmallWithRightIcon(t: Theme) {\n    return css`\n      padding-right: ${t.btnWithIconPaddingRightSmall};\n    `;\n  },\n  buttonSizeSmallWithIconWithoutText(t: Theme) {\n    return css`\n      padding-left: ${t.btnWithIconPaddingLeftSmall};\n      padding-right: ${t.btnWithIconPaddingRightSmall};\n    `;\n  },\n\n  buttonSizeMediumWithLeftIcon(t: Theme) {\n    return css`\n      padding-left: ${t.btnWithIconPaddingLeftMedium};\n    `;\n  },\n  buttonSizeMediumWithRightIcon(t: Theme) {\n    return css`\n      padding-right: ${t.btnWithIconPaddingRightMedium};\n    `;\n  },\n  buttonSizeMediumWithIconWithoutText(t: Theme) {\n    return css`\n      padding-left: ${t.btnWithIconPaddingLeftMedium};\n      padding-right: ${t.btnWithIconPaddingRightMedium};\n    `;\n  },\n\n  buttonSizeLargeWithLeftIcon(t: Theme) {\n    return css`\n      padding-left: ${t.btnWithIconPaddingLeftLarge};\n    `;\n  },\n  buttonSizeLargeWithRightIcon(t: Theme) {\n    return css`\n      padding-right: ${t.btnWithIconPaddingRightLarge};\n    `;\n  },\n  buttonSizeLargeWithIconWithoutText(t: Theme) {\n    return css`\n      padding-left: ${t.btnWithIconPaddingLeftLarge};\n      padding-right: ${t.btnWithIconPaddingRightLarge};\n    `;\n  },\n\n  buttonNarrow() {\n    return css`\n      padding-left: 5px;\n      padding-right: 5px;\n    `;\n  },\n\n  buttonDisabled(t: Theme) {\n    return css`\n      cursor: default;\n      pointer-events: none;\n\n      box-shadow: 0 0 0 ${t.btnBorderWidth} ${t.btnDisabledBorderColor};\n\n      background-image: none;\n      background-color: ${t.btnDisabledBg};\n      color: ${t.btnDisabledTextColor};\n    `;\n  },\n  buttonDisabledWithoutOutline(t: Theme) {\n    return css`\n      box-shadow: 0 0 0 ${t.btnBorderWidth} ${t.btnDisabledBg};\n    `;\n  },\n\n  buttonFocus(t: Theme) {\n    return css`\n      position: relative;\n      z-index: 2;\n\n      &,\n      &:hover,\n      &:active,\n      &:active:hover {\n        box-shadow: inset 0 0 0 ${t.btnInsetWidth} ${t.btnOutlineColorFocus},\n          0 0 0 ${t.btnFocusShadowWidth} ${t.btnBorderColorFocus} !important; // override root:hover style\n      }\n    `;\n  },\n\n  buttonWithArrowIconRightSmall(t: Theme) {\n    return css`\n      padding-right: calc(${t.btnIconSizeSmall} + ${t.btnWithIconPaddingLeftSmall} + ${t.btnWithIconPaddingLeftSmall});\n    `;\n  },\n  buttonWithArrowIconRightMedium(t: Theme) {\n    return css`\n      padding-right: calc(\n        ${t.btnIconSizeMedium} + ${t.btnWithIconPaddingLeftMedium} + ${t.btnWithIconPaddingLeftMedium}\n      );\n    `;\n  },\n  buttonWithArrowIconRightLarge(t: Theme) {\n    return css`\n      padding-right: calc(${t.btnIconSizeLarge} + ${t.btnWithIconPaddingLeftLarge} + ${t.btnWithIconPaddingLeftLarge});\n    `;\n  },\n\n  buttonWithArrowIconLeftSmall(t: Theme) {\n    return css`\n      padding-left: calc(${t.btnIconSizeSmall} + ${t.btnWithIconPaddingLeftSmall} + ${t.btnWithIconPaddingLeftSmall});\n    `;\n  },\n  buttonWithArrowIconLeftMedium(t: Theme) {\n    return css`\n      padding-left: calc(\n        ${t.btnIconSizeMedium} + ${t.btnWithIconPaddingLeftMedium} + ${t.btnWithIconPaddingLeftMedium}\n      );\n    `;\n  },\n  buttonWithArrowIconLeftLarge(t: Theme) {\n    return css`\n      padding-left: calc(${t.btnIconSizeLarge} + ${t.btnWithIconPaddingLeftLarge} + ${t.btnWithIconPaddingLeftLarge});\n    `;\n  },\n});\n\nexport const buttonActiveStyles = memoizeStyle({\n  buttonDefault(t: Theme) {\n    return css`\n      & {\n        ${buttonActiveMixin({\n          btnBackground: t.btnDefaultActiveBg,\n          borderColor: t.btnDefaultActiveBorderColor,\n          borderTopColor: t.btnDefaultActiveBorderTopColor,\n          borderWidth: t.btnBorderWidth,\n        })};\n      }\n    `;\n  },\n  buttonPrimary(t: Theme) {\n    return css`\n      & {\n        ${buttonActiveMixin({\n          btnBackground: t.btnPrimaryActiveBg,\n          borderColor: t.btnPrimaryActiveBorderColor,\n          borderTopColor: t.btnPrimaryActiveBorderTopColor,\n          borderWidth: t.btnBorderWidth,\n        })};\n      }\n    `;\n  },\n  buttonSuccess(t: Theme) {\n    return css`\n      & {\n        ${buttonActiveMixin({\n          btnBackground: t.btnSuccessActiveBg,\n          borderColor: t.btnSuccessActiveBorderColor,\n          borderTopColor: t.btnSuccessActiveBorderTopColor,\n          borderWidth: t.btnBorderWidth,\n        })};\n      }\n    `;\n  },\n  buttonDanger(t: Theme) {\n    return css`\n      & {\n        ${buttonActiveMixin({\n          btnBackground: t.btnDangerActiveBg,\n          borderColor: t.btnDangerActiveBorderColor,\n          borderTopColor: t.btnDangerActiveBorderTopColor,\n          borderWidth: t.btnBorderWidth,\n        })};\n      }\n    `;\n  },\n  buttonPay(t: Theme) {\n    return css`\n      & {\n        ${buttonActiveMixin({\n          btnBackground: t.btnPayActiveBg,\n          borderColor: t.btnPayActiveBorderColor,\n          borderTopColor: t.btnPayActiveBorderTopColor,\n          borderWidth: t.btnBorderWidth,\n        })};\n      }\n    `;\n  },\n  buttonLink(t: Theme) {\n    return css`\n      & {\n        color: ${t.btnLinkActiveColor};\n      }\n    `;\n  },\n  buttonText(t: Theme) {\n    return css`\n      & {\n        ${buttonActiveMixin({\n          btnBackground: t.btnTextActiveBg,\n          borderColor: t.btnTextActiveBg,\n          borderWidth: t.btnBorderWidth,\n        })};\n      }\n    `;\n  },\n  buttonBackless(t: Theme) {\n    return css`\n      &,\n      &:hover {\n        background: ${t.btnBacklessActiveBg};\n      }\n    `;\n  },\n});\n\ninterface GetButtonSizeArgs extends Pick<ClickableProps, 'size' | 'leftIcon' | 'rightIcon' | 'children'> {\n  theme: Theme;\n}\n\nexport const getButtonSize = ({ size, leftIcon, rightIcon, children, theme }: GetButtonSizeArgs) => {\n  const hasIconAndNoContent = (!!leftIcon || !!rightIcon) && !children;\n\n  if (size === 'large') {\n    return {\n      [buttonStyles.buttonSizeLarge(theme)]: true,\n      [buttonStyles.buttonSizeLargeWithLeftIcon(theme)]: !!leftIcon,\n      [buttonStyles.buttonSizeLargeWithRightIcon(theme)]: !!rightIcon,\n      [buttonStyles.buttonSizeLargeWithIconWithoutText(theme)]: hasIconAndNoContent,\n    };\n  }\n\n  if (size === 'medium') {\n    return {\n      [buttonStyles.buttonSizeMedium(theme)]: true,\n      [buttonStyles.buttonSizeMediumWithLeftIcon(theme)]: !!leftIcon,\n      [buttonStyles.buttonSizeMediumWithRightIcon(theme)]: !!rightIcon,\n      [buttonStyles.buttonSizeMediumWithIconWithoutText(theme)]: hasIconAndNoContent,\n    };\n  }\n\n  return {\n    [buttonStyles.buttonSizeSmall(theme)]: true,\n    [buttonStyles.buttonSizeSmallWithLeftIcon(theme)]: !!leftIcon,\n    [buttonStyles.buttonSizeSmallWithRightIcon(theme)]: !!rightIcon,\n    [buttonStyles.buttonSizeSmallWithIconWithoutText(theme)]: hasIconAndNoContent,\n  };\n};\n\ninterface GetButtonStylesArgs\n  extends GetStylesBase,\n    Pick<ClickableProps, 'arrow' | 'size' | 'isNarrow' | 'isDisabled' | 'isLoading' | 'isBorderless' | 'isActive'> {\n  buttonSize: Record<string, boolean>;\n  isFocused: boolean;\n  isNotInteractive: boolean;\n}\n\nexport const getButtonStyles = ({\n  use,\n  buttonSize,\n  theme,\n  arrow,\n  size,\n  isNarrow,\n  isBorderless,\n  isFocused,\n  isActive,\n  isNotInteractive,\n}: GetButtonStylesArgs) => {\n  const active = !isNotInteractive && isActive;\n  const isUseStateWithoutOutlineInDisabledState = !['default', 'backless'].includes(use ?? '');\n\n  return cx({\n    // root\n    [buttonStyles.buttonRoot(theme)]: true,\n    // use\n    [buttonStyles.buttonDefault(theme)]: use === 'default' || use === undefined,\n    [buttonStyles.buttonPrimary(theme)]: use === 'primary',\n    [buttonStyles.buttonSuccess(theme)]: use === 'success',\n    [buttonStyles.buttonDanger(theme)]: use === 'danger',\n    [buttonStyles.buttonPay(theme)]: use === 'pay',\n    [buttonStyles.buttonText(theme)]: use === 'text',\n    [buttonStyles.buttonBackless(theme)]: use === 'backless',\n    // active\n    [buttonActiveStyles.buttonDefault(theme)]: (use === 'default' || use === undefined) && active,\n    [buttonActiveStyles.buttonPrimary(theme)]: use === 'primary' && active,\n    [buttonActiveStyles.buttonSuccess(theme)]: use === 'success' && active,\n    [buttonActiveStyles.buttonDanger(theme)]: use === 'danger' && active,\n    [buttonActiveStyles.buttonPay(theme)]: use === 'pay' && active,\n    [buttonActiveStyles.buttonText(theme)]: use === 'text' && active,\n    [buttonActiveStyles.buttonBackless(theme)]: use === 'backless' && active,\n    // focused\n    [buttonStyles.buttonFocus(theme)]: isFocused,\n    // size\n    ...buttonSize,\n    // narrow\n    [buttonStyles.buttonNarrow()]: isNarrow,\n    // arrow\n    [buttonStyles.buttonWithArrowIconRightSmall(theme)]: arrow === 'right' && size === 'small',\n    [buttonStyles.buttonWithArrowIconRightMedium(theme)]: arrow === 'right' && size === 'medium',\n    [buttonStyles.buttonWithArrowIconRightLarge(theme)]: arrow === 'right' && size === 'large',\n    [buttonStyles.buttonWithArrowIconLeftSmall(theme)]: arrow === 'left' && size === 'small',\n    [buttonStyles.buttonWithArrowIconLeftMedium(theme)]: arrow === 'left' && size === 'medium',\n    [buttonStyles.buttonWithArrowIconLeftLarge(theme)]: arrow === 'left' && size === 'large',\n    // disabled\n    [buttonStyles.buttonDisabled(theme)]: isNotInteractive,\n    [buttonStyles.buttonDisabledWithoutOutline(theme)]: isUseStateWithoutOutlineInDisabledState && isNotInteractive,\n    // borderless\n    [buttonStyles.buttonBorderless()]: isBorderless && (!isFocused || isNotInteractive),\n  });\n};\n"]}

package/components/Clickable/ClickableButton.styles/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../../cjs/components/Clickable/ClickableButton.styles.js",
+  "module": "ClickableButton.styles",
+  "types": "../ClickableButton.styles.d.ts",
+  "sideEffects": false
+}

package/components/Clickable/ClickableButton.styles.d.ts

@@ -0,0 +1,63 @@
+import { Theme } from '../../lib/theming/Theme';
+import { GetStylesBase } from './Clickable.styles';
+import { ClickableProps } from './Clickable';
+export declare const buttonGlobalClasses: {
+    arrow: string;
+    icon: string;
+};
+export declare const buttonStyles: {
+    buttonRoot(t: Theme): string;
+    buttonDefault(t: Theme): string;
+    buttonPrimary(t: Theme): string;
+    buttonSuccess(t: Theme): string;
+    buttonDanger(t: Theme): string;
+    buttonPay(t: Theme): string;
+    buttonText(t: Theme): string;
+    buttonBackless(t: Theme): string;
+    buttonBorderless(): string;
+    buttonSizeSmall(t: Theme): string;
+    buttonSizeMedium(t: Theme): string;
+    buttonSizeLarge(t: Theme): string;
+    buttonSizeSmallWithLeftIcon(t: Theme): string;
+    buttonSizeSmallWithRightIcon(t: Theme): string;
+    buttonSizeSmallWithIconWithoutText(t: Theme): string;
+    buttonSizeMediumWithLeftIcon(t: Theme): string;
+    buttonSizeMediumWithRightIcon(t: Theme): string;
+    buttonSizeMediumWithIconWithoutText(t: Theme): string;
+    buttonSizeLargeWithLeftIcon(t: Theme): string;
+    buttonSizeLargeWithRightIcon(t: Theme): string;
+    buttonSizeLargeWithIconWithoutText(t: Theme): string;
+    buttonNarrow(): string;
+    buttonDisabled(t: Theme): string;
+    buttonDisabledWithoutOutline(t: Theme): string;
+    buttonFocus(t: Theme): string;
+    buttonWithArrowIconRightSmall(t: Theme): string;
+    buttonWithArrowIconRightMedium(t: Theme): string;
+    buttonWithArrowIconRightLarge(t: Theme): string;
+    buttonWithArrowIconLeftSmall(t: Theme): string;
+    buttonWithArrowIconLeftMedium(t: Theme): string;
+    buttonWithArrowIconLeftLarge(t: Theme): string;
+};
+export declare const buttonActiveStyles: {
+    buttonDefault(t: Theme): string;
+    buttonPrimary(t: Theme): string;
+    buttonSuccess(t: Theme): string;
+    buttonDanger(t: Theme): string;
+    buttonPay(t: Theme): string;
+    buttonLink(t: Theme): string;
+    buttonText(t: Theme): string;
+    buttonBackless(t: Theme): string;
+};
+interface GetButtonSizeArgs extends Pick<ClickableProps, 'size' | 'leftIcon' | 'rightIcon' | 'children'> {
+    theme: Theme;
+}
+export declare const getButtonSize: ({ size, leftIcon, rightIcon, children, theme }: GetButtonSizeArgs) => {
+    [x: string]: boolean;
+};
+interface GetButtonStylesArgs extends GetStylesBase, Pick<ClickableProps, 'arrow' | 'size' | 'isNarrow' | 'isDisabled' | 'isLoading' | 'isBorderless' | 'isActive'> {
+    buttonSize: Record<string, boolean>;
+    isFocused: boolean;
+    isNotInteractive: boolean;
+}
+export declare const getButtonStyles: ({ use, buttonSize, theme, arrow, size, isNarrow, isBorderless, isFocused, isActive, isNotInteractive, }: GetButtonStylesArgs) => string;
+export {};