@coinswap-app/uikit 1.0.7 → 1.0.8

package/dist/index.cjs.js

@@ -8434,7 +8434,7 @@ var Heading = styledComponents.styled(Text).attrs(function (_ref) {
   var _ref$as = _ref.as,
     as = _ref$as === void 0 ? tags.H2 : _ref$as;
   return {
-    bold: true,
+    $bold: true,
     as: as
   };
 })(_templateObject$1$ || (_templateObject$1$ = _taggedTemplateLiteral(["\n  font-size: ", ";\n  font-weight: 600;\n  line-height: 1.1;\n\n  ", " {\n    font-size: ", ";\n  }\n"])), function (_ref2) {
@@ -9515,7 +9515,11 @@ var getButtonVariantProp$2 = function getButtonVariantProp(prop) {
     return theme.button[variant][prop];
   };
 };
-var StyledButton$1 = styledComponents.styled.button(_templateObject$1R || (_templateObject$1R = _taggedTemplateLiteral(["\n  align-items: center;\n  background-color: transparent;\n  border: none;\n  border-radius: 10px;\n  cursor: pointer;\n  display: flex;\n  flex-direction: column;\n  font-family: inherit;\n  font-size: 16px;\n  font-weight: 700;\n  color: white;\n  /* max-content instead of auto for Safari fix */\n  width: ", ";\n  height: ", ";\n  line-height: 1;\n  letter-spacing: 0.03em;\n  justify-content: center;\n  outline: 0;\n  padding: ", ";\n  transition: all 0.5s;\n\n  .dot {\n    margin-top: 10px;\n    height: ", ";\n    width: ", ";\n    border-radius: ", ";\n    display: inline-block;\n    background-color: ", ";\n  }\n\n  &:hover:not(:disabled):not(.button--disabled):not(:active) {\n    border-color: ", ";\n    color: ", ";\n  }\n\n  &:active {\n    background-color: transparent;\n    color: ", ";\n  }\n\n  ", "\n  ", "\n  ", "\n"])), function (_ref4) {
+var StyledButton$1 = styledComponents.styled.button.withConfig({
+  shouldForwardProp: function shouldForwardProp(prop) {
+    return !['variant', 'isLoading', 'fullWidth', 'lined', 'active', 'isActive'].includes(prop);
+  }
+})(_templateObject$1R || (_templateObject$1R = _taggedTemplateLiteral(["\n  align-items: center;\n  background-color: transparent;\n  border: none;\n  border-radius: 10px;\n  cursor: pointer;\n  display: flex;\n  flex-direction: column;\n  font-family: inherit;\n  font-size: 16px;\n  font-weight: 700;\n  color: white;\n  /* max-content instead of auto for Safari fix */\n  width: ", ";\n  height: ", ";\n  line-height: 1;\n  letter-spacing: 0.03em;\n  justify-content: center;\n  outline: 0;\n  padding: ", ";\n  transition: all 0.5s;\n\n  .dot {\n    margin-top: 10px;\n    height: ", ";\n    width: ", ";\n    border-radius: ", ";\n    display: inline-block;\n    background-color: ", ";\n  }\n\n  &:hover:not(:disabled):not(.button--disabled):not(:active) {\n    border-color: ", ";\n    color: ", ";\n  }\n\n  &:active {\n    background-color: transparent;\n    color: ", ";\n  }\n\n  ", "\n  ", "\n  ", "\n"])), function (_ref4) {
   var fullWidth = _ref4.fullWidth;
   return fullWidth ? "100%" : "max-content";
 }, function (_ref5) {
@@ -9555,16 +9559,14 @@ var Button = function Button(_ref) {
     _ref$isLoading = _ref.isLoading,
     isLoading = _ref$isLoading === void 0 ? false : _ref$isLoading,
     _ref$disabled = _ref.disabled,
-    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-    lined = _ref.lined,
-    props = _objectWithoutProperties(_ref, _excluded$m);
+    disabled = _ref$disabled === void 0 ? false : _ref$disabled;
+    _ref.lined;
+    var props = _objectWithoutProperties(_ref, _excluded$m);
   var internalProps = external ? getExternalLinkProps() : {};
   var isDisabled = isLoading || disabled;
   return /*#__PURE__*/jsxRuntime.jsxs(StyledButton$1, _objectSpread2(_objectSpread2(_objectSpread2({}, internalProps), props), {}, {
-    isLoading: isLoading,
     disabled: isDisabled,
     style: style,
-    lined: lined,
     children: [/*#__PURE__*/React.isValidElement(startIcon) && /*#__PURE__*/React.cloneElement(startIcon, {
       mr: "0.5rem"
     }), children, /*#__PURE__*/React.isValidElement(endIcon) && /*#__PURE__*/React.cloneElement(endIcon, {
@@ -9600,13 +9602,14 @@ var StyledTag = styledComponents.styled.div(_templateObject$1Q || (_templateObje
   return getColor(variant, theme);
 }, getThemeTextColor, getThemeTextColor);
 
-var _excluded$l = ["isActive", "size", "variant", "as", "children", "tag", "hide"];
+var _excluded$l = ["isActive", "size", "variant", "as", "children", "tag", "hide"],
+  _excluded2$1 = ["isActive"];
 var _templateObject$1P, _templateObject2$Z, _templateObject3$L;
 var ButtonBody = styledComponents.styled.div(_templateObject$1P || (_templateObject$1P = _taggedTemplateLiteral(["\n  display: inline-flex;\n  align-items: center;\n"])));
 var ButtonTag = styledComponents.styled(StyledTag)(_templateObject2$Z || (_templateObject2$Z = _taggedTemplateLiteral(["\n  margin-left: 7px;\n  font-weight: bold;\n  font-size: 11px;\n  padding: 1px 5px;\n  height: unset;\n  border-width: 1px;\n"])));
 var InactiveButton$1 = styledComponents.styled(Button).withConfig({
   shouldForwardProp: function shouldForwardProp(prop) {
-    return prop !== 'colorKey';
+    return prop !== 'colorKey' && prop !== 'isActive';
   }
 })(_templateObject3$L || (_templateObject3$L = _taggedTemplateLiteral(["\n  background-color: transparent;\n  color: #535459;\n  .dot {\n    background-color: transparent;\n  }\n\n  &:hover:not(:disabled):not(:active) {\n    background-color: transparent;\n  }\n"])));
 var ButtonMenuItem = function ButtonMenuItem(_ref) {
@@ -9621,13 +9624,16 @@ var ButtonMenuItem = function ButtonMenuItem(_ref) {
     tag = _ref.tag,
     hide = _ref.hide,
     props = _objectWithoutProperties(_ref, _excluded$l);
+  // Remove isActive from props to prevent it from being passed to DOM
+  props.isActive;
+    var buttonProps = _objectWithoutProperties(props, _excluded2$1);
   if (!isActive) {
     return /*#__PURE__*/jsxRuntime.jsx(InactiveButton$1, _objectSpread2(_objectSpread2({
       forwardedAs: as,
       size: size,
       variant: "tertiary",
       colorKey: variant === variants$2.PRIMARY ? "primary" : "textSubtle"
-    }, props), {}, {
+    }, buttonProps), {}, {
       style: {
         display: hide ? "none" : "flex"
       },
@@ -9643,7 +9649,7 @@ var ButtonMenuItem = function ButtonMenuItem(_ref) {
     as: as,
     size: size,
     variant: variant
-  }, props), {}, {
+  }, buttonProps), {}, {
     style: {
       display: hide ? "none" : "flex"
     },

package/dist/index.esm.js

@@ -8412,7 +8412,7 @@ var Heading = styled(Text).attrs(function (_ref) {
   var _ref$as = _ref.as,
     as = _ref$as === void 0 ? tags.H2 : _ref$as;
   return {
-    bold: true,
+    $bold: true,
     as: as
   };
 })(_templateObject$1$ || (_templateObject$1$ = _taggedTemplateLiteral(["\n  font-size: ", ";\n  font-weight: 600;\n  line-height: 1.1;\n\n  ", " {\n    font-size: ", ";\n  }\n"])), function (_ref2) {
@@ -9493,7 +9493,11 @@ var getButtonVariantProp$2 = function getButtonVariantProp(prop) {
     return theme.button[variant][prop];
   };
 };
-var StyledButton$1 = styled.button(_templateObject$1R || (_templateObject$1R = _taggedTemplateLiteral(["\n  align-items: center;\n  background-color: transparent;\n  border: none;\n  border-radius: 10px;\n  cursor: pointer;\n  display: flex;\n  flex-direction: column;\n  font-family: inherit;\n  font-size: 16px;\n  font-weight: 700;\n  color: white;\n  /* max-content instead of auto for Safari fix */\n  width: ", ";\n  height: ", ";\n  line-height: 1;\n  letter-spacing: 0.03em;\n  justify-content: center;\n  outline: 0;\n  padding: ", ";\n  transition: all 0.5s;\n\n  .dot {\n    margin-top: 10px;\n    height: ", ";\n    width: ", ";\n    border-radius: ", ";\n    display: inline-block;\n    background-color: ", ";\n  }\n\n  &:hover:not(:disabled):not(.button--disabled):not(:active) {\n    border-color: ", ";\n    color: ", ";\n  }\n\n  &:active {\n    background-color: transparent;\n    color: ", ";\n  }\n\n  ", "\n  ", "\n  ", "\n"])), function (_ref4) {
+var StyledButton$1 = styled.button.withConfig({
+  shouldForwardProp: function shouldForwardProp(prop) {
+    return !['variant', 'isLoading', 'fullWidth', 'lined', 'active', 'isActive'].includes(prop);
+  }
+})(_templateObject$1R || (_templateObject$1R = _taggedTemplateLiteral(["\n  align-items: center;\n  background-color: transparent;\n  border: none;\n  border-radius: 10px;\n  cursor: pointer;\n  display: flex;\n  flex-direction: column;\n  font-family: inherit;\n  font-size: 16px;\n  font-weight: 700;\n  color: white;\n  /* max-content instead of auto for Safari fix */\n  width: ", ";\n  height: ", ";\n  line-height: 1;\n  letter-spacing: 0.03em;\n  justify-content: center;\n  outline: 0;\n  padding: ", ";\n  transition: all 0.5s;\n\n  .dot {\n    margin-top: 10px;\n    height: ", ";\n    width: ", ";\n    border-radius: ", ";\n    display: inline-block;\n    background-color: ", ";\n  }\n\n  &:hover:not(:disabled):not(.button--disabled):not(:active) {\n    border-color: ", ";\n    color: ", ";\n  }\n\n  &:active {\n    background-color: transparent;\n    color: ", ";\n  }\n\n  ", "\n  ", "\n  ", "\n"])), function (_ref4) {
   var fullWidth = _ref4.fullWidth;
   return fullWidth ? "100%" : "max-content";
 }, function (_ref5) {
@@ -9533,16 +9537,14 @@ var Button = function Button(_ref) {
     _ref$isLoading = _ref.isLoading,
     isLoading = _ref$isLoading === void 0 ? false : _ref$isLoading,
     _ref$disabled = _ref.disabled,
-    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-    lined = _ref.lined,
-    props = _objectWithoutProperties(_ref, _excluded$m);
+    disabled = _ref$disabled === void 0 ? false : _ref$disabled;
+    _ref.lined;
+    var props = _objectWithoutProperties(_ref, _excluded$m);
   var internalProps = external ? getExternalLinkProps() : {};
   var isDisabled = isLoading || disabled;
   return /*#__PURE__*/jsxs(StyledButton$1, _objectSpread2(_objectSpread2(_objectSpread2({}, internalProps), props), {}, {
-    isLoading: isLoading,
     disabled: isDisabled,
     style: style,
-    lined: lined,
     children: [/*#__PURE__*/React__default.isValidElement(startIcon) && /*#__PURE__*/React__default.cloneElement(startIcon, {
       mr: "0.5rem"
     }), children, /*#__PURE__*/React__default.isValidElement(endIcon) && /*#__PURE__*/React__default.cloneElement(endIcon, {
@@ -9578,13 +9580,14 @@ var StyledTag = styled.div(_templateObject$1Q || (_templateObject$1Q = _taggedTe
   return getColor(variant, theme);
 }, getThemeTextColor, getThemeTextColor);
 
-var _excluded$l = ["isActive", "size", "variant", "as", "children", "tag", "hide"];
+var _excluded$l = ["isActive", "size", "variant", "as", "children", "tag", "hide"],
+  _excluded2$1 = ["isActive"];
 var _templateObject$1P, _templateObject2$Z, _templateObject3$L;
 var ButtonBody = styled.div(_templateObject$1P || (_templateObject$1P = _taggedTemplateLiteral(["\n  display: inline-flex;\n  align-items: center;\n"])));
 var ButtonTag = styled(StyledTag)(_templateObject2$Z || (_templateObject2$Z = _taggedTemplateLiteral(["\n  margin-left: 7px;\n  font-weight: bold;\n  font-size: 11px;\n  padding: 1px 5px;\n  height: unset;\n  border-width: 1px;\n"])));
 var InactiveButton$1 = styled(Button).withConfig({
   shouldForwardProp: function shouldForwardProp(prop) {
-    return prop !== 'colorKey';
+    return prop !== 'colorKey' && prop !== 'isActive';
   }
 })(_templateObject3$L || (_templateObject3$L = _taggedTemplateLiteral(["\n  background-color: transparent;\n  color: #535459;\n  .dot {\n    background-color: transparent;\n  }\n\n  &:hover:not(:disabled):not(:active) {\n    background-color: transparent;\n  }\n"])));
 var ButtonMenuItem = function ButtonMenuItem(_ref) {
@@ -9599,13 +9602,16 @@ var ButtonMenuItem = function ButtonMenuItem(_ref) {
     tag = _ref.tag,
     hide = _ref.hide,
     props = _objectWithoutProperties(_ref, _excluded$l);
+  // Remove isActive from props to prevent it from being passed to DOM
+  props.isActive;
+    var buttonProps = _objectWithoutProperties(props, _excluded2$1);
   if (!isActive) {
     return /*#__PURE__*/jsx(InactiveButton$1, _objectSpread2(_objectSpread2({
       forwardedAs: as,
       size: size,
       variant: "tertiary",
       colorKey: variant === variants$2.PRIMARY ? "primary" : "textSubtle"
-    }, props), {}, {
+    }, buttonProps), {}, {
       style: {
         display: hide ? "none" : "flex"
       },
@@ -9621,7 +9627,7 @@ var ButtonMenuItem = function ButtonMenuItem(_ref) {
     as: as,
     size: size,
     variant: variant
-  }, props), {}, {
+  }, buttonProps), {}, {
     style: {
       display: hide ? "none" : "flex"
     },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coinswap-app/uikit",
-  "version": "1.0.7",
+  "version": "1.0.8",
   "description": "Set of UI components for CoinSwap projects",
   "main": "dist/index.cjs.js",
   "module": "dist/index.esm.js",