@taikai/rocket-kit 3.0.0-beta.4 → 3.0.0-beta.5

package/dist/rocket-kit.cjs.development.js

@@ -268,11 +268,11 @@ const ButtonWrapper = /*#__PURE__*/_styled__default.button.withConfig({
   var _props$color;
   return useColor((_props$color = props.color) != null ? _props$color : 'black').color;
 }, props => {
-  var _props$txtColor;
-  return useColor((_props$txtColor = props.txtColor) != null ? _props$txtColor : 'black').color;
+  var _props$color2, _props$txtColor;
+  return props.variant === 'outline' && !props.txtColor ? useColor((_props$color2 = props.color) != null ? _props$color2 : 'black').color : useColor((_props$txtColor = props.txtColor) != null ? _props$txtColor : 'white').color;
 }, props => {
-  var _props$color2;
-  return props.color === 'white' ? colors.grey100 : props.color === 'black' ? colors.grey900 : useColor((_props$color2 = props.color) != null ? _props$color2 : 'black').hover;
+  var _props$color3;
+  return props.color === 'white' ? colors.grey100 : props.color === 'black' ? colors.grey900 : useColor((_props$color3 = props.color) != null ? _props$color3 : 'black').hover;
 }, props => props.variant === 'outline' ? button.borderWidth : 0, props => props.variant === 'text' ? 0 : props.rounded ? '999px' : button.borderRadius, props => props.variant === 'solid' ? 'var(--bg)' : 'transparent', props => props.value ? polished.rem('80px') : polished.rem('42px'), button.height, props => props.value ? `0 ${button.padding}` : 0, misc.transitionDuration, props => props.variant === 'solid' ? '' : 'var(--hover)', props => props.variant === 'solid' ? 'var(--hover)' : 'transparent', props => props.variant === 'solid' ? '' : 'var(--hover)', props => props.variant === 'solid' ? '' : 'var(--hover)', props => props.variant === 'solid' ? 'var(--bg)' : 'transparent', props => props.iconPosition === 'right' ? button.iconSpacing : 0, props => props.iconPosition === 'left' ? button.iconSpacing : 0, props => props.variant === 'solid' ? '' : 'var(--button)', /*#__PURE__*/polished.rem(typography.defaultSize), typography.medium, /*#__PURE__*/polished.rem(typography.defaultSize), props => props.variant === 'solid' || props.variant === 'outline' ? 'var(--txt)' : 'var(--bg)', misc.transitionDuration, props => props.iconPosition === 'left' ? 2 : 1, props => props.iconPosition === 'left' ? 1 : 2, button.iconSize, button.iconSize, props => props.variant === 'solid' || props.variant === 'outline' ? 'var(--txt)' : 'var(--bg)', misc.transitionDuration);
 
 const Button = props => {
@@ -280,7 +280,7 @@ const Button = props => {
     variant = 'solid',
     rounded = false,
     color = 'purple500',
-    txtColor = 'white',
+    txtColor,
     type,
     className = 'button',
     style,
@@ -426,11 +426,11 @@ const ButtonLinkStyle = /*#__PURE__*/_styled__default.a.withConfig({
   var _props$color;
   return useColor((_props$color = props.color) != null ? _props$color : 'black').color;
 }, props => {
-  var _props$txtColor;
-  return useColor((_props$txtColor = props.txtColor) != null ? _props$txtColor : 'black').color;
+  var _props$color2, _props$txtColor;
+  return props.variant === 'outline' && !props.txtColor ? useColor((_props$color2 = props.color) != null ? _props$color2 : 'black').color : useColor((_props$txtColor = props.txtColor) != null ? _props$txtColor : 'white').color;
 }, props => {
-  var _props$color2;
-  return props.color === 'white' ? colors.grey100 : props.color === 'black' ? colors.grey900 : useColor((_props$color2 = props.color) != null ? _props$color2 : 'black').hover;
+  var _props$color3;
+  return props.color === 'white' ? colors.grey100 : props.color === 'black' ? colors.grey900 : useColor((_props$color3 = props.color) != null ? _props$color3 : 'black').hover;
 }, props => props.variant === 'outline' ? button.borderWidth : 0, props => props.variant === 'text' ? 0 : props.rounded ? '999px' : button.borderRadius, props => props.variant === 'solid' ? 'var(--bg)' : 'transparent', props => props.value ? polished.rem('80px') : polished.rem('42px'), button.height, props => props.value ? `0 ${button.padding}` : 0, misc.transitionDuration, props => props.variant === 'solid' ? '' : 'var(--hover)', props => props.variant === 'solid' ? 'var(--hover)' : 'transparent', props => props.variant === 'solid' ? '' : 'var(--hover)', props => props.variant === 'solid' ? '' : 'var(--hover)', props => props.iconPosition === 'right' ? button.iconSpacing : 0, props => props.iconPosition === 'left' ? button.iconSpacing : 0, /*#__PURE__*/polished.rem(typography.defaultSize), typography.medium, /*#__PURE__*/polished.rem(typography.defaultSize), props => props.variant === 'solid' || props.variant === 'outline' ? 'var(--txt)' : 'var(--bg)', misc.transitionDuration, props => props.iconPosition === 'left' ? 2 : 1, props => props.iconPosition === 'left' ? 1 : 2, button.iconSize, button.iconSize, props => props.variant === 'solid' || props.variant === 'outline' ? 'var(--txt)' : 'var(--bg)', misc.transitionDuration);
 
 const ButtonLink = props => {
@@ -438,7 +438,7 @@ const ButtonLink = props => {
     variant = 'solid',
     rounded = false,
     color = 'purple500',
-    txtColor = 'white',
+    txtColor,
     className = 'button-link',
     style,
     action = () => {},
@@ -2553,7 +2553,7 @@ const ModalFooter = props => {
     style: style
   }, /*#__PURE__*/React__default.createElement(Button, {
     variant: "outline",
-    color: "grey",
+    color: "grey300",
     action: closeAction,
     value: closeValue
   }), children);
@@ -5840,7 +5840,7 @@ const Modal = props => {
     className: "modal"
   }, /*#__PURE__*/React__default.createElement(ModalHeader, null, title && /*#__PURE__*/React__default.createElement("h2", null, title), /*#__PURE__*/React__default.createElement(Button, {
     color: "white",
-    txtColor: "grey200",
+    txtColor: "grey300",
     icon: "cross",
     ariaLabel: "Close",
     action: hide,
@@ -5904,6 +5904,9 @@ const ModalDrawer = props => {
     } else {
       document.documentElement.style.overflow = '';
     }
+    return () => {
+      document.documentElement.style.overflow = '';
+    };
   }, [isShowing]);
   React.useEffect(() => {
     const fixViewport = () => {