@ntbjs/react-components 1.3.0-rc.59 → 1.3.0-rc.6-patch.1

package/.eslintrc

@@ -8,12 +8,13 @@
   "parserOptions": {
     "sourceType": "module"
   },
-  "ignorePatterns": ["build", "storybook-static"],
+  "ignorePatterns": [
+    "build",
+    "storybook-static"
+  ],
   "parser": "@babel/eslint-parser",
-  "extends": ["eslint:recommended", "plugin:react/recommended"],
-  "settings": {
-    "react": {
-      "version": "detect"
-    }
-  }
+  "extends": [
+    "eslint:recommended",
+    "plugin:react/recommended"
+  ]
 }

package/{ActionButton-b2345555.js → ActionButton-dea072f4.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var defaultTheme = require('./defaultTheme-cd01e6c2.js');
+var defaultTheme = require('./defaultTheme-44832997.js');
 var React = require('react');
 var styled = require('styled-components');
 var polished = require('polished');
@@ -11,12 +11,13 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
 
 var _templateObject, _templateObject2;
-var ActionButton$1 = styled__default["default"].button.attrs(defaultTheme.applyDefaultTheme)(_templateObject || (_templateObject = defaultTheme._taggedTemplateLiteral(["\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  border-radius: 50%;\n  width: ", ";\n  height: ", ";\n  border: 0;\n  color: inherit;\n  background-color: transparent;\n  ", "\n  background-position: center;\n  background-repeat: no-repeat;\n  background-size: 0 0;\n  transition: background-size 250ms ease;\n  cursor: pointer;\n\n  ", "\n\n  ", "\n\n  &:disabled {\n    opacity: 0.5;\n    color: inherit;\n    cursor: not-allowed;\n  }\n\n  svg {\n    width: 100%;\n    max-width: ", ";\n    max-height: ", ";\n\n    pointer-events: none;\n    transition: color 250ms;\n  }\n"])), function (props) {
-  return "".concat(props.actionWidthHeight[0], "px");
+var ActionButton$1 = styled__default['default'].button.attrs(defaultTheme.applyDefaultTheme)(_templateObject || (_templateObject = defaultTheme._taggedTemplateLiteral(["\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  border-radius: 50%;\n  width: ", ";\n  height: ", ";\n  border: 0;\n  color: inherit;\n  background-color: transparent;\n  ", "\n  background-position: center;\n  background-repeat: no-repeat;\n  background-size: 0 0;\n  transition: background-size 250ms ease;\n  cursor: pointer;\n\n  ", "\n\n  ", "\n\n  &:disabled {\n    opacity: 0.5;\n    color: inherit;\n    cursor: not-allowed;\n  }\n\n  svg {\n    width: 100%;\n    max-height: 20px;\n    max-width: 20px;\n    pointer-events: none;\n    transition: color 250ms;\n  }\n"])), function (props) {
+  return "".concat(props.buttonWidthHeight[0], "px");
 }, function (props) {
-  return "".concat(props.actionWidthHeight[1], "px");
+  return "".concat(props.buttonWidthHeight[1], "px");
 }, function (props) {
   var _props$backgroundColo, _props$backgroundColo2, _props$backgroundColo3, _props$backgroundColo4;
+
   var darkThemeBgColor = (_props$backgroundColo = props === null || props === void 0 ? void 0 : (_props$backgroundColo2 = props.backgroundColors) === null || _props$backgroundColo2 === void 0 ? void 0 : _props$backgroundColo2[0]) !== null && _props$backgroundColo !== void 0 ? _props$backgroundColo : props.theme.getColor('gray-600');
   var lightThemeBgColor = (_props$backgroundColo3 = props === null || props === void 0 ? void 0 : (_props$backgroundColo4 = props.backgroundColors) === null || _props$backgroundColo4 === void 0 ? void 0 : _props$backgroundColo4[1]) !== null && _props$backgroundColo3 !== void 0 ? _props$backgroundColo3 : props.theme.getColor('gray-200');
   return props.theme.themeProp('background-image', "radial-gradient(circle at center, ".concat(darkThemeBgColor, " 50%, transparent 50%)"), "radial-gradient(circle at center, ".concat(lightThemeBgColor, " 50%, transparent 50%)"));
@@ -26,26 +27,22 @@ var ActionButton$1 = styled__default["default"].button.attrs(defaultTheme.applyD
   });
 }, function (props) {
   return props.useShadow ? props.theme.themeProp('box-shadow', "0px 3px 6px ".concat(polished.rgba(props.theme.getColor('black'), 0.7)), "0px 3px 6px ".concat(props.theme.getColor('black'))) : null;
-}, function (props) {
-  return "".concat(props.actionWidthHeight[0] - 15, "px");
-}, function (props) {
-  return "".concat(props.actionWidthHeight[1] - 15, "px");
 });
 
-var _excluded = ["icon", "disabled", "active", "onClick", "actionWidthHeight"];
-var ActionButton = React__default["default"].forwardRef(function ActionButton(_ref, forwardedRef) {
+var ActionButton = React__default['default'].forwardRef(function ActionButton(_ref, forwardedRef) {
   var icon = _ref.icon,
-    disabled = _ref.disabled,
-    active = _ref.active,
-    onClick = _ref.onClick,
-    actionWidthHeight = _ref.actionWidthHeight,
-    props = defaultTheme._objectWithoutProperties(_ref, _excluded);
-  return React__default["default"].createElement(ActionButton$1, defaultTheme._extends({
+      disabled = _ref.disabled,
+      active = _ref.active,
+      onClick = _ref.onClick,
+      buttonWidthHeight = _ref.buttonWidthHeight,
+      props = defaultTheme._objectWithoutProperties(_ref, ["icon", "disabled", "active", "onClick", "buttonWidthHeight"]);
+
+  return React__default['default'].createElement(ActionButton$1, defaultTheme._extends({
     ref: forwardedRef,
     disabled: disabled,
     active: active,
     onClick: onClick,
-    actionWidthHeight: actionWidthHeight
+    buttonWidthHeight: buttonWidthHeight
   }, props), icon);
 });
 ActionButton.propTypes = process.env.NODE_ENV !== "production" ? {
@@ -54,11 +51,11 @@ ActionButton.propTypes = process.env.NODE_ENV !== "production" ? {
   active: defaultTheme.PropTypes.bool,
   onClick: defaultTheme.PropTypes.func,
   backgroundColors: defaultTheme.PropTypes.arrayOf(defaultTheme.PropTypes.string),
-  actionWidthHeight: defaultTheme.PropTypes.array
+  buttonWidthHeight: defaultTheme.PropTypes.array
 } : {};
 ActionButton.defaultProps = {
   onClick: function onClick() {},
-  actionWidthHeight: [40, 40]
+  buttonWidthHeight: [40, 40]
 };
 
 exports.ActionButton = ActionButton;

package/{Alert-d69a3f95.js → Alert-347a66eb.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var defaultTheme = require('./defaultTheme-cd01e6c2.js');
+var defaultTheme = require('./defaultTheme-44832997.js');
 var React = require('react');
 var styled = require('styled-components');
 var lodash = require('lodash');
@@ -11,8 +11,9 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
 
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
-var Alert$1 = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject || (_templateObject = defaultTheme._taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  padding: ", ";\n  width: ", ";\n  box-sizing: border-box;\n\n  ", "\n\n  ", "\n  \n  ", "\n  \n  text-align: ", ";\n"])), function (props) {
+var Alert$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject || (_templateObject = defaultTheme._taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  padding: ", ";\n  width: ", ";\n  box-sizing: border-box;\n\n  ", "\n\n  ", "\n  \n  ", "\n  \n  text-align: ", ";\n"])), function (props) {
   var _props$verticalPaddin, _props$horizontalPadd;
+
   var verticalPadding = (_props$verticalPaddin = props.verticalPadding) !== null && _props$verticalPaddin !== void 0 ? _props$verticalPaddin : 17;
   var horizontalPadding = (_props$horizontalPadd = props.horizontalPadding) !== null && _props$horizontalPadd !== void 0 ? _props$horizontalPadd : 30;
   return "".concat(verticalPadding, "px ").concat(horizontalPadding, "px");
@@ -27,7 +28,7 @@ var Alert$1 = styled__default["default"].div.attrs(defaultTheme.applyDefaultThem
 }, function (props) {
   return props.align === 'center' ? 'center' : 'left';
 });
-var AlertRender = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject5 || (_templateObject5 = defaultTheme._taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  word-break: break-word;\n  ", "\n  ", "\n  ", ";\n\n  svg {\n    width: 12px;\n    height: 12px;\n  }\n\n  span {\n    flex: 1;\n    padding-left: 5px;\n    ", ";\n  }\n"])), function (props) {
+var AlertRender = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject5 || (_templateObject5 = defaultTheme._taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  word-break: break-word;\n  ", "\n  ", "\n  ", ";\n\n  svg {\n    width: 12px;\n    height: 12px;\n  }\n\n  span {\n    flex: 1;\n    padding-left: 5px;\n    ", ";\n  }\n"])), function (props) {
   return props.lineHeight ? "line-height: ".concat(props.lineHeight, "px;") : null;
 }, function (props) {
   return props.fontSize ? "font-size: ".concat(props.fontSize, "px;") : null;
@@ -37,24 +38,25 @@ var AlertRender = styled__default["default"].div.attrs(defaultTheme.applyDefault
   return props.lineClamp ? styled.css(_templateObject6 || (_templateObject6 = defaultTheme._taggedTemplateLiteral(["\n            display: -webkit-box;\n            -webkit-line-clamp: ", ";\n            -webkit-box-orient: vertical;\n            overflow: hidden;\n            text-overflow: ellipsis;\n          "])), props.lineClamp) : null;
 });
 
-var _excluded = ["warning", "error", "type", "alertMessage", "align", "icon", "fontSize", "lineHeight", "lineClamp", "verticalPadding", "horizontalPadding", "width"];
-var Alert = React__default["default"].forwardRef(function Alert(_ref, forwardedRef) {
+var Alert = React__default['default'].forwardRef(function Alert(_ref, forwardedRef) {
   var warning = _ref.warning,
-    error = _ref.error,
-    type = _ref.type,
-    alertMessage = _ref.alertMessage,
-    align = _ref.align,
-    icon = _ref.icon,
-    fontSize = _ref.fontSize,
-    lineHeight = _ref.lineHeight,
-    lineClamp = _ref.lineClamp,
-    verticalPadding = _ref.verticalPadding,
-    horizontalPadding = _ref.horizontalPadding,
-    width = _ref.width,
-    props = defaultTheme._objectWithoutProperties(_ref, _excluded);
+      error = _ref.error,
+      type = _ref.type,
+      alertMessage = _ref.alertMessage,
+      align = _ref.align,
+      icon = _ref.icon,
+      fontSize = _ref.fontSize,
+      lineHeight = _ref.lineHeight,
+      lineClamp = _ref.lineClamp,
+      verticalPadding = _ref.verticalPadding,
+      horizontalPadding = _ref.horizontalPadding,
+      width = _ref.width,
+      props = defaultTheme._objectWithoutProperties(_ref, ["warning", "error", "type", "alertMessage", "align", "icon", "fontSize", "lineHeight", "lineClamp", "verticalPadding", "horizontalPadding", "width"]);
+
   var isWarning = false;
   var isError = false;
   var isInfo = true;
+
   if (!lodash.isEmpty(type)) {
     if (type === 'warning') {
       isWarning = true;
@@ -66,11 +68,13 @@ var Alert = React__default["default"].forwardRef(function Alert(_ref, forwardedR
   } else {
     isWarning = warning;
     isError = error;
+
     if (isWarning || isError) {
       isInfo = false;
     }
   }
-  return React__default["default"].createElement(Alert$1, defaultTheme._extends({
+
+  return React__default['default'].createElement(Alert$1, defaultTheme._extends({
     ref: forwardedRef,
     alertMessage: alertMessage,
     warning: isWarning,
@@ -80,11 +84,11 @@ var Alert = React__default["default"].forwardRef(function Alert(_ref, forwardedR
     verticalPadding: verticalPadding,
     horizontalPadding: horizontalPadding,
     width: width
-  }, props), React__default["default"].createElement(AlertRender, {
+  }, props), React__default['default'].createElement(AlertRender, {
     fontSize: fontSize,
     lineHeight: lineHeight,
     lineClamp: lineClamp
-  }, icon, " ", React__default["default"].createElement("span", null, alertMessage)));
+  }, icon, " ", React__default['default'].createElement("span", null, alertMessage)));
 });
 Alert.propTypes = process.env.NODE_ENV !== "production" ? {
   warning: defaultTheme.PropTypes.bool,