@ntbjs/react-components 2.0.0-rc.26 → 2.0.0-rc.28

package/build/{Badge-aa4cd9c1.js → Badge-d93586a9.js}

@@ -1,16 +1,9 @@
-'use strict';
+import { _ as _extends } from './_rollupPluginBabelHelpers-c245b26a.js';
+import { a as applyDefaultTheme, P as PropTypes } from './defaultTheme-1bcc2541.js';
+import React__default from 'react';
+import styled, { css } from 'styled-components';
 
-var _rollupPluginBabelHelpers = require('./_rollupPluginBabelHelpers-4b342fad.js');
-var defaultTheme = require('./defaultTheme-d9a7342e.js');
-var React = require('react');
-var styled = require('styled-components');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
-
-const Badge$1 = styled__default["default"].span.attrs(defaultTheme.applyDefaultTheme)`
+const Badge$1 = styled.span.attrs(applyDefaultTheme)`
   align-content: center;
   display: ${props => props.elevated || !props.hasChildren ? 'inline-flex' : 'flex'};
   font-family: ${props => props.theme.primaryFontFamily};
@@ -20,12 +13,12 @@ const Badge$1 = styled__default["default"].span.attrs(defaultTheme.applyDefaultT
   position: relative;
   width: ${props => props.elevated ? 'fit-content' : 'initial'};
 `;
-const BadgeChildrenContainer = styled__default["default"].span.attrs(defaultTheme.applyDefaultTheme)`
+const BadgeChildrenContainer = styled.span.attrs(applyDefaultTheme)`
   align-self: center;
   height: fit-content;
   margin-right: 8px;
 `;
-const BadgeLabel = styled__default["default"].span.attrs(defaultTheme.applyDefaultTheme)`
+const BadgeLabel = styled.span.attrs(applyDefaultTheme)`
   border-radius: ${props => props.elevated ? '12px' : '14px'};
   display: flex;
   align-items: center;
@@ -48,15 +41,15 @@ const BadgeLabel = styled__default["default"].span.attrs(defaultTheme.applyDefau
   right: 0;
   transform: ${props => props.elevated ? 'translate(33%, -8px)' : 'initial'};
 
-  ${props => props.width ? styled.css`
+  ${props => props.width ? css`
           width: ${props.width}px;
         ` : null}
 
-  ${props => props.minWidth ? styled.css`
+  ${props => props.minWidth ? css`
           min-width: ${props.minWidth}px;
         ` : null}
 
-  ${props => props.minHeight ? styled.css`
+  ${props => props.minHeight ? css`
           min-height: ${props.minHeight}px;
         ` : null}
       
@@ -64,7 +57,7 @@ const BadgeLabel = styled__default["default"].span.attrs(defaultTheme.applyDefau
   ${props => {
   const verticalPadding = props.verticalPadding ? `${props.verticalPadding}px` : props.elevated ? '4px' : '6px';
   const horizontalPadding = props.horizontalPadding ? `${props.horizontalPadding}px` : props.elevated ? '7px' : '10px';
-  return styled.css`
+  return css`
       padding: ${verticalPadding} ${horizontalPadding};
     `;
 }}
@@ -129,7 +122,7 @@ const BadgeLabel = styled__default["default"].span.attrs(defaultTheme.applyDefau
   }
 })}
 `;
-const BadgeIcon = styled__default["default"].span.attrs(defaultTheme.applyDefaultTheme)`
+const BadgeIcon = styled.span.attrs(applyDefaultTheme)`
   display: flex;
   align-items: center;
   margin-right: ${props => props.useGutter ? '4px' : 0};
@@ -138,7 +131,7 @@ const BadgeIcon = styled__default["default"].span.attrs(defaultTheme.applyDefaul
   }
 `;
 
-const Badge = React__default["default"].forwardRef(function Badge({
+const Badge = React__default.forwardRef(function Badge({
   badgeContent,
   badgeIcon,
   children,
@@ -164,11 +157,11 @@ const Badge = React__default["default"].forwardRef(function Badge({
       notation: 'compact'
     }).format(badgeContent);
   }
-  return React__default["default"].createElement(Badge$1, _rollupPluginBabelHelpers._extends({
+  return React__default.createElement(Badge$1, _extends({
     ref: forwardedRef,
     elevated: elevated,
     hasChildren: Boolean(children)
-  }, props), children && React__default["default"].createElement(BadgeChildrenContainer, null, children), (badgeIcon || badgeContent) && React__default["default"].createElement(BadgeLabel, {
+  }, props), children && React__default.createElement(BadgeChildrenContainer, null, children), (badgeIcon || badgeContent) && React__default.createElement(BadgeLabel, {
     backgroundColors: backgroundColors,
     colors: colors,
     elevated: elevated,
@@ -184,29 +177,29 @@ const Badge = React__default["default"].forwardRef(function Badge({
     minHeight: minHeight,
     width: width,
     minWidth: minWidth
-  }, badgeIcon && React__default["default"].createElement(BadgeIcon, {
+  }, badgeIcon && React__default.createElement(BadgeIcon, {
     useGutter: !!badgeContent
   }, badgeIcon), badgeContent));
 });
 Badge.propTypes = process.env.NODE_ENV !== "production" ? {
-  badgeIcon: defaultTheme.PropTypes.node,
-  badgeContent: defaultTheme.PropTypes.oneOfType([defaultTheme.PropTypes.string, defaultTheme.PropTypes.number, defaultTheme.PropTypes.func, defaultTheme.PropTypes.element]),
-  children: defaultTheme.PropTypes.oneOfType([defaultTheme.PropTypes.node, defaultTheme.PropTypes.string]),
-  elevated: defaultTheme.PropTypes.bool,
-  active: defaultTheme.PropTypes.bool,
-  error: defaultTheme.PropTypes.bool,
-  warning: defaultTheme.PropTypes.bool,
-  fontSize: defaultTheme.PropTypes.oneOfType([defaultTheme.PropTypes.number, defaultTheme.PropTypes.string]),
-  fontWeight: defaultTheme.PropTypes.oneOfType([defaultTheme.PropTypes.number, defaultTheme.PropTypes.string]),
-  lineHeight: defaultTheme.PropTypes.oneOfType([defaultTheme.PropTypes.number, defaultTheme.PropTypes.string]),
-  colors: defaultTheme.PropTypes.arrayOf(defaultTheme.PropTypes.string),
-  backgroundColors: defaultTheme.PropTypes.arrayOf(defaultTheme.PropTypes.string),
-  verticalPadding: defaultTheme.PropTypes.number,
-  horizontalPadding: defaultTheme.PropTypes.number,
-  height: defaultTheme.PropTypes.number,
-  minHeight: defaultTheme.PropTypes.number,
-  width: defaultTheme.PropTypes.number,
-  minWidth: defaultTheme.PropTypes.number
+  badgeIcon: PropTypes.node,
+  badgeContent: PropTypes.oneOfType([PropTypes.string, PropTypes.number, PropTypes.func, PropTypes.element]),
+  children: PropTypes.oneOfType([PropTypes.node, PropTypes.string]),
+  elevated: PropTypes.bool,
+  active: PropTypes.bool,
+  error: PropTypes.bool,
+  warning: PropTypes.bool,
+  fontSize: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
+  fontWeight: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
+  lineHeight: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
+  colors: PropTypes.arrayOf(PropTypes.string),
+  backgroundColors: PropTypes.arrayOf(PropTypes.string),
+  verticalPadding: PropTypes.number,
+  horizontalPadding: PropTypes.number,
+  height: PropTypes.number,
+  minHeight: PropTypes.number,
+  width: PropTypes.number,
+  minWidth: PropTypes.number
 } : {};
 Badge.defaultProps = {
   elevated: false,
@@ -218,4 +211,4 @@ Badge.defaultProps = {
   lineHeight: 'normal'
 };
 
-exports.Badge = Badge;
+export { Badge as B };

package/build/{Button-2e26f5da.js → Button-179a2fe4.js}

@@ -1,19 +1,12 @@
-'use strict';
-
-var _rollupPluginBabelHelpers = require('./_rollupPluginBabelHelpers-4b342fad.js');
-var React = require('react');
-var defaultTheme = require('./defaultTheme-d9a7342e.js');
-var styled = require('styled-components');
-var Popover = require('./Popover-c4be47ea.js');
-var ContextMenu = require('./ContextMenu-82f9d728.js');
-var expandMore = require('./expand-more-d74e2bd2.js');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
-
-const Button$1 = styled__default["default"].button.attrs(defaultTheme.applyDefaultTheme)`
+import { _ as _extends } from './_rollupPluginBabelHelpers-c245b26a.js';
+import React__default, { useState, useRef, useEffect } from 'react';
+import { a as applyDefaultTheme, P as PropTypes } from './defaultTheme-1bcc2541.js';
+import styled, { css } from 'styled-components';
+import { P as Popover } from './Popover-20050b91.js';
+import ContextMenu from './widgets/ContextMenu/ContextMenu.js';
+import { S as SvgExpandMore } from './expand-more-c5523c46.js';
+
+const Button$1 = styled.button.attrs(applyDefaultTheme)`
   position: relative;
   border-radius: 3px;
   font-family: inherit;
@@ -34,7 +27,7 @@ const Button$1 = styled__default["default"].button.attrs(defaultTheme.applyDefau
   ${props => props.theme.themeProp('color', props.theme.getColor('white'), props.theme.getColor('white'))}
 
   && {
-    ${props => props.secondary && styled.css`
+    ${props => props.secondary && css`
         background: ${props => props.theme.getColor('gray-200')};
         border-color: ${props => props.theme.getColor('gray-200')};
 
@@ -49,7 +42,7 @@ const Button$1 = styled__default["default"].button.attrs(defaultTheme.applyDefau
   }
 
   && {
-    ${props => props.outlined && styled.css`
+    ${props => props.outlined && css`
         background: transparent;
         transition: none;
 
@@ -69,7 +62,7 @@ const Button$1 = styled__default["default"].button.attrs(defaultTheme.applyDefau
   }
 
   && {
-    ${props => props.outlined && props.secondary && styled.css`
+    ${props => props.outlined && props.secondary && css`
         ${props.theme.themeProp('border-color', props.theme.getColor('gray-400'), props.theme.getColor('gray-700'))}
 
         ${props.theme.themeProp('color', props.theme.getColor('gray-200'), props.theme.getColor('gray-700'))}
@@ -86,7 +79,7 @@ const Button$1 = styled__default["default"].button.attrs(defaultTheme.applyDefau
   }
 
   && {
-    ${props => props.outlined && props.secondary && props.dropdownItems && styled.css`
+    ${props => props.outlined && props.secondary && props.dropdownItems && css`
         &:hover,
         &.dropdown-is-active {
           ${props.theme.themeProp('border-color', props.theme.getColor('gray-300'), props.theme.getColor('gray-300'))}
@@ -94,30 +87,30 @@ const Button$1 = styled__default["default"].button.attrs(defaultTheme.applyDefau
       `};
   }
 
-  ${props => props.block && styled.css`
+  ${props => props.block && css`
       width: 100%;
     `};
 
-  ${props => props.disabled && styled.css`
+  ${props => props.disabled && css`
       opacity: 0.5;
       cursor: not-allowed;
       pointer-events: none;
     `};
 
-  ${props => props.size === 'x-small' && styled.css`
+  ${props => props.size === 'x-small' && css`
       padding: 1px 16px;
       height: 24px;
     `};
 
-  ${props => props.size === 'small' && styled.css`
+  ${props => props.size === 'small' && css`
       padding: 6px 16px;
     `};
 
-  ${props => props.size === 'large' && styled.css`
+  ${props => props.size === 'large' && css`
       padding: 16px 16px;
     `};
 
-  ${props => props.singleAction && styled.css`
+  ${props => props.singleAction && css`
       display: flex;
       align-items: center;
       gap: ${props.singleActionGap}px;
@@ -125,12 +118,12 @@ const Button$1 = styled__default["default"].button.attrs(defaultTheme.applyDefau
       transition: all 250ms, opacity 200ms;
     `};
 
-  ${props => props.width && styled.css`
+  ${props => props.width && css`
       min-width: ${props.width}px;
       justify-content: center;
     `};
 `;
-const ButtonContent = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)`
+const ButtonContent = styled.div.attrs(applyDefaultTheme)`
   display: flex;
   justify-content: center;
   align-items: center;
@@ -144,23 +137,23 @@ const ButtonContent = styled__default["default"].div.attrs(defaultTheme.applyDef
     max-height: 16px;
     margin-right: 8px;
 
-    ${props => props.size === 'small' && styled.css`
+    ${props => props.size === 'small' && css`
         max-width: 13px;
         max-height: 13px;
       `};
 
-    ${props => props.size === 'x-small' && styled.css`
+    ${props => props.size === 'x-small' && css`
         max-width: 11px;
         max-height: 11px;
       `};
   }
 
-  ${props => props.$loading && styled.css`
+  ${props => props.$loading && css`
       transform: scale(0.95);
       opacity: 0;
     `}
 
-  ${props => props.singleAction && styled.css`
+  ${props => props.singleAction && css`
       svg {
         width: 100% !important;
         height: 100% !important;
@@ -168,7 +161,7 @@ const ButtonContent = styled__default["default"].div.attrs(defaultTheme.applyDef
       }
     `};
 `;
-const LoadingIndicator = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)`
+const LoadingIndicator = styled.div.attrs(applyDefaultTheme)`
   position: absolute;
   height: 100%;
   width: 100%;
@@ -180,62 +173,62 @@ const LoadingIndicator = styled__default["default"].div.attrs(defaultTheme.apply
   transition: opacity 200ms;
   box-sizing: border-box;
 
-  ${props => props.$loading && styled.css`
+  ${props => props.$loading && css`
       opacity: 1;
     `}
 `;
-const LoadingIndicatorSvg = styled__default["default"].svg.attrs(defaultTheme.applyDefaultTheme)`
+const LoadingIndicatorSvg = styled.svg.attrs(applyDefaultTheme)`
   height: 100%;
   color: inherit;
   transform: rotate(-88deg);
 `;
-const LoadingIndicatorSvgCircle = styled__default["default"].circle.attrs(defaultTheme.applyDefaultTheme)`
+const LoadingIndicatorSvgCircle = styled.circle.attrs(applyDefaultTheme)`
   transition: stroke-dashoffset 300ms linear;
   stroke-dasharray: 113;
 `;
-const ButtonWrapper = styled__default["default"].span.attrs(defaultTheme.applyDefaultTheme)`
+const ButtonWrapper = styled.span.attrs(applyDefaultTheme)`
   white-space: nowrap;
   display: flex;
-  ${props => props.block && styled.css`
+  ${props => props.block && css`
       width: 100%;
     `}
 `;
-const MainButtonWrapper = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)`
+const MainButtonWrapper = styled.div.attrs(applyDefaultTheme)`
   border-radius: 3px;
-  ${props => props.block && styled.css`
+  ${props => props.block && css`
       width: 100%;
       display: flex;
     `}
 
   ${props => {
-  return (props.activeDropdown || props.dropdownItems) && !props.outlined && styled.css`
+  return (props.activeDropdown || props.dropdownItems) && !props.outlined && css`
         background: ${props.secondary ? props.theme.getColor('gray-200') : props.theme.getColor('emerald-500')};
       `;
 }};
 `;
-const MainButtonContainer = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)`
+const MainButtonContainer = styled.div.attrs(applyDefaultTheme)`
   display: inline-block;
 
-  ${props => props.block && styled.css`
+  ${props => props.block && css`
       flex: 1;
       width: 100%;
     `}
 
   button {
-    ${props => (props.activeDropdown || props.dropdownItems) && styled.css`
+    ${props => (props.activeDropdown || props.dropdownItems) && css`
         border-bottom-right-radius: 0;
         border-top-right-radius: 0;
       `};
 
-    ${props => (props.activeDropdown || props.dropdownItems) && props.outlined && styled.css`
+    ${props => (props.activeDropdown || props.dropdownItems) && props.outlined && css`
         border-right: none;
       `};
   }
 `;
-const MainButtonContainerSingle = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)`
+const MainButtonContainerSingle = styled.div.attrs(applyDefaultTheme)`
   display: inline-block;
   width: 100%;
-  ${props => props.singleAction && styled.css`
+  ${props => props.singleAction && css`
       display: flex;
       align-items: center;
       border-radius: 3px !important;
@@ -243,13 +236,13 @@ const MainButtonContainerSingle = styled__default["default"].div.attrs(defaultTh
     `};
 
   button {
-    ${props => (props.activeDropdown || props.dropdownItems) && styled.css`
+    ${props => (props.activeDropdown || props.dropdownItems) && css`
         border-bottom-right-radius: 0;
         border-top-right-radius: 0;
       `};
   }
 `;
-const DropdownButtonContainer = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)`
+const DropdownButtonContainer = styled.div.attrs(applyDefaultTheme)`
   display: inline-block;
 
   button {
@@ -268,7 +261,7 @@ const DropdownButtonContainer = styled__default["default"].div.attrs(defaultThem
   }
 `;
 
-const Button = React__default["default"].forwardRef(function Button({
+const Button = React__default.forwardRef(function Button({
   onClickEffect,
   singleAction = false,
   activeDropdown = false,
@@ -287,10 +280,10 @@ const Button = React__default["default"].forwardRef(function Button({
   border = 2,
   ...props
 }, forwardedRef) {
-  const [loadingState, setLoadingState] = React.useState(loading || false);
-  const [loadingStep, setLoadingStep] = React.useState(113);
-  const loadingInterval = React.useRef(0);
-  const [dropdownIsActive, setDropdownIsActive] = React.useState(false);
+  const [loadingState, setLoadingState] = useState(loading || false);
+  const [loadingStep, setLoadingStep] = useState(113);
+  const loadingInterval = useRef(0);
+  const [dropdownIsActive, setDropdownIsActive] = useState(false);
   const enableLoading = () => {
     loadingInterval.current = setInterval(() => {
       setLoadingStep(currentLoadingStep => {
@@ -311,7 +304,7 @@ const Button = React__default["default"].forwardRef(function Button({
       setLoadingStep(113);
     }, 500);
   };
-  React.useEffect(() => {
+  useEffect(() => {
     if (loading) {
       enableLoading();
     } else {
@@ -325,18 +318,18 @@ const Button = React__default["default"].forwardRef(function Button({
   const handleDropdownClose = () => {
     setDropdownIsActive(false);
   };
-  return React__default["default"].createElement(ButtonWrapper, null, !singleAction ? React__default["default"].createElement(MainButtonWrapper, {
+  return React__default.createElement(ButtonWrapper, null, !singleAction ? React__default.createElement(MainButtonWrapper, {
     activeDropdown: activeDropdown,
     dropdownItems: dropdownItems,
     outlined: outlined,
     secondary: secondary,
     block: block
-  }, React__default["default"].createElement(MainButtonContainer, {
+  }, React__default.createElement(MainButtonContainer, {
     dropdownItems: dropdownItems,
     secondary: secondary,
     outlined: outlined,
     block: block
-  }, React__default["default"].createElement(Button$1, _rollupPluginBabelHelpers._extends({
+  }, React__default.createElement(Button$1, _extends({
     ref: forwardedRef,
     onClick: onClickEffect,
     border: border,
@@ -350,17 +343,17 @@ const Button = React__default["default"].forwardRef(function Button({
     className: className,
     "aria-busy": disabled,
     width: width
-  }, props), React__default["default"].createElement(ButtonContent, {
+  }, props), React__default.createElement(ButtonContent, {
     $loading: loadingState,
     size: size
-  }, icon, children), React__default["default"].createElement(LoadingIndicator, {
+  }, icon, children), React__default.createElement(LoadingIndicator, {
     $loading: loadingState,
     style: {
       opacity: loadingState ? 1 : 0
     }
-  }, React__default["default"].createElement(LoadingIndicatorSvg, {
+  }, React__default.createElement(LoadingIndicatorSvg, {
     viewBox: "22 22 44 44"
-  }, React__default["default"].createElement(LoadingIndicatorSvgCircle, {
+  }, React__default.createElement(LoadingIndicatorSvgCircle, {
     cx: "44",
     cy: "44",
     r: "18",
@@ -370,17 +363,17 @@ const Button = React__default["default"].forwardRef(function Button({
     style: {
       strokeDashoffset: `${loadingStep}px`
     }
-  }))))), (activeDropdown || dropdownItems) && React__default["default"].createElement(DropdownButtonContainer, {
+  }))))), (activeDropdown || dropdownItems) && React__default.createElement(DropdownButtonContainer, {
     dropdownItems: dropdownItems,
     secondary: secondary,
     outlined: outlined
-  }, React__default["default"].createElement(Popover.Popover, {
-    content: React__default["default"].createElement(ContextMenu.ContextMenu, null, dropdownItems),
+  }, React__default.createElement(Popover, {
+    content: React__default.createElement(ContextMenu, null, dropdownItems),
     placement: 'bottom-end',
     arrow: false,
     contextMenu: true,
     onHide: handleDropdownClose
-  }, React__default["default"].createElement(Button$1, {
+  }, React__default.createElement(Button$1, {
     ref: forwardedRef,
     singleAction: singleAction,
     singleActionGap: singleActionGap,
@@ -394,20 +387,20 @@ const Button = React__default["default"].forwardRef(function Button({
     onClick: handleDropdownButtonClick,
     className: dropdownIsActive ? 'dropdown-is-active' : '',
     width: width
-  }, React__default["default"].createElement(expandMore.SvgExpandMore, null))))) : React__default["default"].createElement(React__default["default"].Fragment, null, React__default["default"].createElement(MainButtonContainerSingle, {
+  }, React__default.createElement(SvgExpandMore, null))))) : React__default.createElement(React__default.Fragment, null, React__default.createElement(MainButtonContainerSingle, {
     dropdownItems: dropdownItems,
     secondary: secondary,
     outlined: outlined,
     className: className
-  }, React__default["default"].createElement(DropdownButtonContainer, {
+  }, React__default.createElement(DropdownButtonContainer, {
     singleAction: singleAction
-  }, React__default["default"].createElement(Popover.Popover, {
-    content: React__default["default"].createElement(ContextMenu.ContextMenu, null, dropdownItems),
+  }, React__default.createElement(Popover, {
+    content: React__default.createElement(ContextMenu, null, dropdownItems),
     placement: 'bottom-end',
     arrow: false,
     contextMenu: true,
     onHide: handleDropdownClose
-  }, React__default["default"].createElement(Button$1, {
+  }, React__default.createElement(Button$1, {
     ref: forwardedRef,
     singleAction: singleAction,
     singleActionGap: singleActionGap,
@@ -421,29 +414,29 @@ const Button = React__default["default"].forwardRef(function Button({
     onClick: handleDropdownButtonClick,
     className: dropdownIsActive ? 'dropdown-is-active' : '',
     width: width
-  }, React__default["default"].createElement(ButtonContent, {
+  }, React__default.createElement(ButtonContent, {
     $loading: loadingState,
     size: size,
     singleAction: singleAction
-  }, icon, children), React__default["default"].createElement(expandMore.SvgExpandMore, null)))))));
+  }, icon, children), React__default.createElement(SvgExpandMore, null)))))));
 });
 Button.propTypes = process.env.NODE_ENV !== "production" ? {
-  onClickEffect: defaultTheme.PropTypes.func,
-  singleAction: defaultTheme.PropTypes.bool,
-  activeDropdown: defaultTheme.PropTypes.bool,
-  dropdownItems: defaultTheme.PropTypes.node,
-  secondary: defaultTheme.PropTypes.bool,
-  outlined: defaultTheme.PropTypes.bool,
-  border: defaultTheme.PropTypes.number,
-  block: defaultTheme.PropTypes.bool,
-  icon: defaultTheme.PropTypes.element,
-  size: defaultTheme.PropTypes.oneOf(['x-small', 'small', 'normal', 'large']),
-  disabled: defaultTheme.PropTypes.bool,
-  loading: defaultTheme.PropTypes.bool,
-  className: defaultTheme.PropTypes.string,
-  children: defaultTheme.PropTypes.any.isRequired,
-  singleActionGap: defaultTheme.PropTypes.number,
-  width: defaultTheme.PropTypes.number
+  onClickEffect: PropTypes.func,
+  singleAction: PropTypes.bool,
+  activeDropdown: PropTypes.bool,
+  dropdownItems: PropTypes.node,
+  secondary: PropTypes.bool,
+  outlined: PropTypes.bool,
+  border: PropTypes.number,
+  block: PropTypes.bool,
+  icon: PropTypes.element,
+  size: PropTypes.oneOf(['x-small', 'small', 'normal', 'large']),
+  disabled: PropTypes.bool,
+  loading: PropTypes.bool,
+  className: PropTypes.string,
+  children: PropTypes.any.isRequired,
+  singleActionGap: PropTypes.number,
+  width: PropTypes.number
 } : {};
 
-exports.Button = Button;
+export { Button as B };