@ntbjs/react-components 2.0.0-rc.13 → 2.0.0-rc.27

package/cjs/components/data/VerificationStatusIcon/VerificationStatusIcon.styled.js

@@ -1,88 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var styled = require('styled-components');
-var defaultTheme = require('../../../utils/defaultTheme.js');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
-
-let _ = t => t,
-  _t,
-  _t2,
-  _t3,
-  _t4;
-const shouldForwardProp = prop => {
-  return prop !== 'theme' && !prop.startsWith('$');
-};
-const VerificationIconWrapper = styled__default["default"].div.withConfig({
-  shouldForwardProp
-}).attrs(defaultTheme.applyDefaultTheme)(_t || (_t = _`
-  ${0};
-`), props => props.$background && styled.css(_t2 || (_t2 = _`
-    background-color: #000 !important;
-    width: fit-content;
-    padding: 6px 14px 6px 9px;
-    border-radius: 15px;
-}
-    `)));
-const VerificationStatusIcon = styled__default["default"].div.withConfig({
-  shouldForwardProp
-}).attrs(defaultTheme.applyDefaultTheme)(_t3 || (_t3 = _`
-  display: flex;
-  position: relative;
-  font: normal normal normal 12px/16px Roboto;
-  ${0};
-
-  ${0};
-
-  svg {
-    height: ${0}px;
-  }
-`), props => props.theme.themeProp('color', props.theme.getColor('gray-300'), props.theme.getColor('gray-700')), props => props.$background && props.theme.themeProp('color', props.theme.getColor('gray-100'), props.theme.getColor('gray-100')), props => {
-  var _props$iconHeight;
-  return (_props$iconHeight = props.iconHeight) !== null && _props$iconHeight !== void 0 ? _props$iconHeight : 15;
-});
-const VerificationStatusColor = styled__default["default"].div.withConfig({
-  shouldForwardProp
-}).attrs(defaultTheme.applyDefaultTheme)(_t4 || (_t4 = _`
-  position: absolute;
-  bottom: 0;
-  left: ${0}px;
-  width: ${0}px;
-  height: ${0}px;
-  border-radius: 50%;
-  ${0};
-`), props => {
-  var _props$$iconHeight;
-  return ((_props$$iconHeight = props.$iconHeight) !== null && _props$$iconHeight !== void 0 ? _props$$iconHeight : 15) * 2 / 3;
-}, props => {
-  var _props$$iconHeight2;
-  return ((_props$$iconHeight2 = props.$iconHeight) !== null && _props$$iconHeight2 !== void 0 ? _props$$iconHeight2 : 15) * 2 / 3;
-}, props => {
-  var _props$$iconHeight3;
-  return ((_props$$iconHeight3 = props.$iconHeight) !== null && _props$$iconHeight3 !== void 0 ? _props$$iconHeight3 : 15) * 2 / 3;
-}, props => {
-  let darkThemeColor = props.theme.getColor('gray-100');
-  let lightThemeColor = props.theme.getColor('gray-500');
-  if (props.$status === 'verified') {
-    darkThemeColor = props.theme.getColor('emerald-500');
-    lightThemeColor = props.theme.getColor('emerald-500');
-  } else if (props.$status === 'pending') {
-    darkThemeColor = props.theme.getColor('signal-yellow-500');
-    lightThemeColor = props.theme.getColor('signal-yellow-500');
-  } else if (props.$status === 'rejected') {
-    darkThemeColor = props.theme.getColor('red-600');
-    lightThemeColor = props.theme.getColor('red-600');
-  } else if (props.$status === 'mixed') {
-    darkThemeColor = '#008CDB';
-    lightThemeColor = '#008CDB';
-  }
-  return props.theme.themeProp('background-color', darkThemeColor, lightThemeColor);
-});
-
-exports.VerificationIconWrapper = VerificationIconWrapper;
-exports.VerificationStatusColor = VerificationStatusColor;
-exports.VerificationStatusIcon = VerificationStatusIcon;

package/cjs/components/data/data/index.js

@@ -1,21 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var Alert = require('../Alert/Alert.js');
-var Badge = require('../Badge/Badge.js');
-var Popover = require('../Popover/Popover.js');
-var Tab = require('../Tab/Tab.js');
-var Tabs = require('../Tabs/Tabs.js');
-var Tooltip = require('../Tooltip/Tooltip.js');
-var VerificationStatusIcon = require('../VerificationStatusIcon/VerificationStatusIcon.js');
-
-
-
-exports.Alert = Alert["default"];
-exports.Badge = Badge["default"];
-exports.Popover = Popover["default"];
-exports.Tab = Tab["default"];
-exports.Tabs = Tabs["default"];
-exports.Tooltip = Tooltip["default"];
-exports.VerificationStatusIcon = VerificationStatusIcon["default"];

package/cjs/components/inputs/ActionButton/ActionButton.js

@@ -1,44 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
-var index = require('../../../node_modules/react/index.js');
-var index$1 = require('../../../node_modules/prop-types/index.js');
-var ActionButton_styled = require('./ActionButton.styled.js');
-
-const _excluded = ["icon", "disabled", "active", "onClick", "actionWidthHeight", "backgroundColors"];
-const ActionButton = index["default"].forwardRef(function ActionButton(_ref, forwardedRef) {
-  let {
-      icon,
-      disabled,
-      active,
-      onClick,
-      actionWidthHeight,
-      backgroundColors
-    } = _ref,
-    props = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
-  return index["default"].createElement(ActionButton_styled.ActionButton, _rollupPluginBabelHelpers["extends"]({
-    ref: forwardedRef,
-    disabled: disabled,
-    active: active,
-    onClick: onClick,
-    actionWidthHeight: actionWidthHeight,
-    backgroundColors: backgroundColors
-  }, props), icon);
-});
-ActionButton.propTypes = process.env.NODE_ENV !== "production" ? {
-  icon: index$1["default"].element.isRequired,
-  disabled: index$1["default"].bool,
-  active: index$1["default"].bool,
-  onClick: index$1["default"].func,
-  backgroundColors: index$1["default"].arrayOf(index$1["default"].string),
-  actionWidthHeight: index$1["default"].array
-} : {};
-ActionButton.defaultProps = {
-  onClick: () => {},
-  actionWidthHeight: [40, 40]
-};
-var ActionButton$1 = ActionButton;
-
-exports["default"] = ActionButton$1;

package/cjs/components/inputs/ActionButton/ActionButton.styled.js

@@ -1,75 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var styled = require('styled-components');
-var polished = require('polished');
-var defaultTheme = require('../../../utils/defaultTheme.js');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
-
-let _ = t => t,
-  _t,
-  _t2;
-const ActionButton = styled__default["default"].button.attrs(defaultTheme.applyDefaultTheme)(_t || (_t = _`
-  display: inline-flex;
-  justify-content: center;
-  align-items: center;
-  border-radius: 50%;
-  width: ${0};
-  height: ${0};
-  border: 0;
-  color: inherit;
-  background-color: transparent;
-
-  background-position: center;
-  background-repeat: no-repeat;
-  background-size: 0 0;
-  transition: background-size 250ms ease;
-  cursor: pointer;
-
-  ${0}
-
-  &:hover:not(:disabled) {
-    background-size: ${0}px
-      ${0}px;
-
-    svg {
-      ${0};
-    }
-  }
-
-  ${0}
-
-  ${0}
-
-  &:disabled {
-    opacity: 0.5;
-    color: inherit;
-    cursor: not-allowed;
-  }
-
-  svg {
-    width: 100%;
-    max-width: ${0};
-    max-height: ${0};
-    pointer-events: none;
-    transition: color 250ms;
-  }
-`), props => `${props.actionWidthHeight[0]}px`, props => `${props.actionWidthHeight[1]}px`, props => {
-  var _props$backgroundColo, _props$backgroundColo2, _props$backgroundColo3, _props$backgroundColo4;
-  const darkThemeBgColor = (_props$backgroundColo = props === null || props === 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');
-  const lightThemeBgColor = (_props$backgroundColo3 = props === null || props === 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, ${darkThemeBgColor} 50%, transparent 51%)`, `radial-gradient(circle at center, ${lightThemeBgColor} 50%, transparent 51%)`);
-}, props => Math.max(props.actionWidthHeight[0], props.actionWidthHeight[1]) * 2, props => Math.max(props.actionWidthHeight[0], props.actionWidthHeight[1]) * 2, props => props.theme.themeProp('color', props.theme.getColor('gray-100'), props.theme.getColor('gray-700')), props => props.active && styled.css(_t2 || (_t2 = _`
-      background-size: ${0}px
-        ${0}px;
-
-      svg {
-        ${0};
-      }
-    `), Math.max(props.actionWidthHeight[0], props.actionWidthHeight[1]) * 2, Math.max(props.actionWidthHeight[0], props.actionWidthHeight[1]) * 2, props.theme.themeProp('color', props.theme.getColor('gray-100'), props.theme.getColor('gray-700'))), props => props.useShadow ? props.theme.themeProp('box-shadow', `0px 3px 6px ${polished.rgba(props.theme.getColor('black'), 0.7)}`, `0px 3px 6px ${props.theme.getColor('black')}`) : null, props => `${props.actionWidthHeight[0] - 15}px`, props => `${props.actionWidthHeight[1] - 15}px`);
-
-exports.ActionButton = ActionButton;

package/cjs/components/inputs/ActionButton/inputs/ActionButton/index.js

@@ -1,9 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var ActionButton = require('../../ActionButton.js');
-
-
-
-exports["default"] = ActionButton["default"];

package/cjs/components/inputs/Button/Button.js

@@ -1,195 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
-var index = require('../../../node_modules/react/index.js');
-var index$2 = require('../../../node_modules/prop-types/index.js');
-var Button_styled = require('./Button.styled.js');
-var expandMore = require('../../../icons/expand-more.svg.js');
-var index$1 = require('../../../_virtual/index.js');
-var Popover = require('../../data/Popover/Popover.js');
-var ContextMenu = require('../../widgets/ContextMenu/ContextMenu.js');
-
-const _excluded = ["onClickEffect", "singleAction", "activeDropdown", "dropdownItems", "secondary", "outlined", "block", "icon", "size", "disabled", "loading", "className", "children", "singleActionGap", "width", "border"];
-const Button = index["default"].forwardRef(function Button(_ref, forwardedRef) {
-  let {
-      onClickEffect,
-      singleAction = false,
-      activeDropdown = false,
-      dropdownItems,
-      secondary,
-      outlined,
-      block = false,
-      icon,
-      size = 'normal',
-      disabled,
-      loading,
-      className,
-      children,
-      singleActionGap = 34,
-      width,
-      border = 2
-    } = _ref,
-    props = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
-  const [loadingState, setLoadingState] = index$1.react.exports.useState(loading || false);
-  const [loadingStep, setLoadingStep] = index$1.react.exports.useState(113);
-  const loadingInterval = index$1.react.exports.useRef(0);
-  const [dropdownIsActive, setDropdownIsActive] = index$1.react.exports.useState(false);
-  const enableLoading = () => {
-    loadingInterval.current = setInterval(() => {
-      setLoadingStep(currentLoadingStep => {
-        const newLoadingStep = Math.round(currentLoadingStep - 15 * currentLoadingStep / 100);
-        if (newLoadingStep === currentLoadingStep) {
-          clearInterval(loadingInterval.current);
-        }
-        return newLoadingStep;
-      });
-    }, 300);
-    setLoadingState(true);
-  };
-  const disableLoading = () => {
-    clearInterval(loadingInterval.current);
-    setLoadingStep(0);
-    setTimeout(() => {
-      setLoadingState(false);
-      setLoadingStep(113);
-    }, 500);
-  };
-  index$1.react.exports.useEffect(() => {
-    if (loading) {
-      enableLoading();
-    } else {
-      disableLoading();
-    }
-    return () => clearInterval(loadingInterval.current);
-  }, [loading]);
-  const handleDropdownButtonClick = () => {
-    setDropdownIsActive(true);
-  };
-  const handleDropdownClose = () => {
-    setDropdownIsActive(false);
-  };
-  return index["default"].createElement(Button_styled.ButtonWrapper, null, !singleAction ? index["default"].createElement(Button_styled.MainButtonWrapper, {
-    $activeDropdown: activeDropdown,
-    $dropdownItems: dropdownItems,
-    $outlined: outlined,
-    $secondary: secondary,
-    $block: block
-  }, index["default"].createElement(Button_styled.MainButtonContainer, {
-    $dropdownItems: dropdownItems,
-    $secondary: secondary,
-    $outlined: outlined,
-    $block: block
-  }, index["default"].createElement(Button_styled.Button, _rollupPluginBabelHelpers["extends"]({
-    ref: forwardedRef,
-    onClick: onClickEffect,
-    $border: border,
-    $singleaction: singleAction,
-    $dropdownItems: dropdownItems,
-    $secondary: secondary,
-    $outlined: outlined,
-    $block: block,
-    size: size,
-    disabled: disabled,
-    className: className,
-    "aria-busy": disabled,
-    $width: width
-  }, props), index["default"].createElement(Button_styled.ButtonContent, {
-    $loading: loadingState,
-    size: size
-  }, icon, children), index["default"].createElement(Button_styled.LoadingIndicator, {
-    $loading: loadingState,
-    style: {
-      opacity: loadingState ? 1 : 0
-    }
-  }, index["default"].createElement(Button_styled.LoadingIndicatorSvg, {
-    viewBox: "22 22 44 44"
-  }, index["default"].createElement(Button_styled.LoadingIndicatorSvgCircle, {
-    cx: "44",
-    cy: "44",
-    r: "18",
-    fill: "none",
-    strokeWidth: "4",
-    stroke: "currentColor",
-    style: {
-      strokeDashoffset: `${loadingStep}px`
-    }
-  }))))), (activeDropdown || dropdownItems) && index["default"].createElement(Button_styled.DropdownButtonContainer, {
-    $dropdownItems: dropdownItems,
-    $secondary: secondary,
-    $outlined: outlined
-  }, index["default"].createElement(Popover["default"], {
-    content: index["default"].createElement(ContextMenu["default"], null, dropdownItems),
-    placement: 'bottom-end',
-    arrow: false,
-    contextMenu: true,
-    onHide: handleDropdownClose
-  }, index["default"].createElement(Button_styled.Button, {
-    ref: forwardedRef,
-    $singleaction: singleAction,
-    $singleactiongap: singleActionGap,
-    $dropdownItems: dropdownItems,
-    $secondary: secondary,
-    $outlined: outlined,
-    $border: border,
-    $block: block,
-    size: size,
-    disabled: disabled,
-    onClick: handleDropdownButtonClick,
-    className: dropdownIsActive ? 'dropdown-is-active' : '',
-    $width: width
-  }, index["default"].createElement(expandMore.ReactComponent, null))))) : index["default"].createElement(index["default"].Fragment, null, index["default"].createElement(Button_styled.MainButtonContainerSingle, {
-    $dropdownItems: dropdownItems,
-    $secondary: secondary,
-    $outlined: outlined,
-    className: className
-  }, index["default"].createElement(Button_styled.DropdownButtonContainer, {
-    $singleaction: singleAction
-  }, index["default"].createElement(Popover["default"], {
-    content: index["default"].createElement(ContextMenu["default"], null, dropdownItems),
-    placement: 'bottom-end',
-    arrow: false,
-    contextMenu: true,
-    onHide: handleDropdownClose
-  }, index["default"].createElement(Button_styled.Button, {
-    ref: forwardedRef,
-    $singleaction: singleAction,
-    $singleactiongap: singleActionGap,
-    $dropdownItems: dropdownItems,
-    $secondary: secondary,
-    $outlined: outlined,
-    $border: border,
-    $block: block,
-    size: size,
-    disabled: disabled,
-    onClick: handleDropdownButtonClick,
-    className: dropdownIsActive ? 'dropdown-is-active' : '',
-    $width: width
-  }, index["default"].createElement(Button_styled.ButtonContent, {
-    $loading: loadingState,
-    size: size,
-    $singleaction: singleAction
-  }, icon, children), index["default"].createElement(expandMore.ReactComponent, null)))))));
-});
-Button.propTypes = process.env.NODE_ENV !== "production" ? {
-  onClickEffect: index$2["default"].func,
-  singleAction: index$2["default"].bool,
-  activeDropdown: index$2["default"].bool,
-  dropdownItems: index$2["default"].node,
-  secondary: index$2["default"].bool,
-  outlined: index$2["default"].bool,
-  border: index$2["default"].number,
-  block: index$2["default"].bool,
-  icon: index$2["default"].element,
-  size: index$2["default"].oneOf(['x-small', 'small', 'normal', 'large']),
-  disabled: index$2["default"].bool,
-  loading: index$2["default"].bool,
-  className: index$2["default"].string,
-  children: index$2["default"].any.isRequired,
-  singleActionGap: index$2["default"].number,
-  width: index$2["default"].number
-} : {};
-var Button$1 = Button;
-
-exports["default"] = Button$1;