@taikai/rocket-kit 3.0.0-beta.4 → 3.0.0-beta.5
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.
- package/dist/rocket-kit.cjs.development.js +15 -12
- package/dist/rocket-kit.cjs.development.js.map +1 -1
- package/dist/rocket-kit.cjs.production.min.js +3 -3
- package/dist/rocket-kit.cjs.production.min.js.map +1 -1
- package/dist/rocket-kit.esm.js +15 -12
- package/dist/rocket-kit.esm.js.map +1 -1
- package/package.json +1 -1
|
@@ -268,11 +268,11 @@ const ButtonWrapper = /*#__PURE__*/_styled__default.button.withConfig({
|
|
|
268
268
|
var _props$color;
|
|
269
269
|
return useColor((_props$color = props.color) != null ? _props$color : 'black').color;
|
|
270
270
|
}, props => {
|
|
271
|
-
var _props$txtColor;
|
|
272
|
-
return useColor((_props$txtColor = props.txtColor) != null ? _props$txtColor : '
|
|
271
|
+
var _props$color2, _props$txtColor;
|
|
272
|
+
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;
|
|
273
273
|
}, props => {
|
|
274
|
-
var _props$
|
|
275
|
-
return props.color === 'white' ? colors.grey100 : props.color === 'black' ? colors.grey900 : useColor((_props$
|
|
274
|
+
var _props$color3;
|
|
275
|
+
return props.color === 'white' ? colors.grey100 : props.color === 'black' ? colors.grey900 : useColor((_props$color3 = props.color) != null ? _props$color3 : 'black').hover;
|
|
276
276
|
}, 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);
|
|
277
277
|
|
|
278
278
|
const Button = props => {
|
|
@@ -280,7 +280,7 @@ const Button = props => {
|
|
|
280
280
|
variant = 'solid',
|
|
281
281
|
rounded = false,
|
|
282
282
|
color = 'purple500',
|
|
283
|
-
txtColor
|
|
283
|
+
txtColor,
|
|
284
284
|
type,
|
|
285
285
|
className = 'button',
|
|
286
286
|
style,
|
|
@@ -426,11 +426,11 @@ const ButtonLinkStyle = /*#__PURE__*/_styled__default.a.withConfig({
|
|
|
426
426
|
var _props$color;
|
|
427
427
|
return useColor((_props$color = props.color) != null ? _props$color : 'black').color;
|
|
428
428
|
}, props => {
|
|
429
|
-
var _props$txtColor;
|
|
430
|
-
return useColor((_props$txtColor = props.txtColor) != null ? _props$txtColor : '
|
|
429
|
+
var _props$color2, _props$txtColor;
|
|
430
|
+
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;
|
|
431
431
|
}, props => {
|
|
432
|
-
var _props$
|
|
433
|
-
return props.color === 'white' ? colors.grey100 : props.color === 'black' ? colors.grey900 : useColor((_props$
|
|
432
|
+
var _props$color3;
|
|
433
|
+
return props.color === 'white' ? colors.grey100 : props.color === 'black' ? colors.grey900 : useColor((_props$color3 = props.color) != null ? _props$color3 : 'black').hover;
|
|
434
434
|
}, 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);
|
|
435
435
|
|
|
436
436
|
const ButtonLink = props => {
|
|
@@ -438,7 +438,7 @@ const ButtonLink = props => {
|
|
|
438
438
|
variant = 'solid',
|
|
439
439
|
rounded = false,
|
|
440
440
|
color = 'purple500',
|
|
441
|
-
txtColor
|
|
441
|
+
txtColor,
|
|
442
442
|
className = 'button-link',
|
|
443
443
|
style,
|
|
444
444
|
action = () => {},
|
|
@@ -2553,7 +2553,7 @@ const ModalFooter = props => {
|
|
|
2553
2553
|
style: style
|
|
2554
2554
|
}, /*#__PURE__*/React__default.createElement(Button, {
|
|
2555
2555
|
variant: "outline",
|
|
2556
|
-
color: "
|
|
2556
|
+
color: "grey300",
|
|
2557
2557
|
action: closeAction,
|
|
2558
2558
|
value: closeValue
|
|
2559
2559
|
}), children);
|
|
@@ -5840,7 +5840,7 @@ const Modal = props => {
|
|
|
5840
5840
|
className: "modal"
|
|
5841
5841
|
}, /*#__PURE__*/React__default.createElement(ModalHeader, null, title && /*#__PURE__*/React__default.createElement("h2", null, title), /*#__PURE__*/React__default.createElement(Button, {
|
|
5842
5842
|
color: "white",
|
|
5843
|
-
txtColor: "
|
|
5843
|
+
txtColor: "grey300",
|
|
5844
5844
|
icon: "cross",
|
|
5845
5845
|
ariaLabel: "Close",
|
|
5846
5846
|
action: hide,
|
|
@@ -5904,6 +5904,9 @@ const ModalDrawer = props => {
|
|
|
5904
5904
|
} else {
|
|
5905
5905
|
document.documentElement.style.overflow = '';
|
|
5906
5906
|
}
|
|
5907
|
+
return () => {
|
|
5908
|
+
document.documentElement.style.overflow = '';
|
|
5909
|
+
};
|
|
5907
5910
|
}, [isShowing]);
|
|
5908
5911
|
React.useEffect(() => {
|
|
5909
5912
|
const fixViewport = () => {
|