@dnanpm/styleguide 3.12.3 → 4.0.0

package/build/es/components/Modal/Modal.d.ts

@@ -63,11 +63,6 @@ interface Props {
      * Allows to set property `aria-label` for content element
      */
     contentLabel?: string;
-    /**
-     * Allows changing CSS property `max-width` for Modal content wrapper element.
-     * @deprecated Replaced with 'size' property
-     */
-    maxWidth?: string;
     /**
      * Allows to change the size of the component.
      * Size in mobile view is always 100% of the window size

package/build/es/components/ReadMore/ReadMore.d.ts

@@ -17,12 +17,6 @@ interface Props {
      * @default false
      */
     isExpanded?: boolean;
-    /**
-     * Allows to show component in expanded state on init and immediately close after load
-     *
-     * @deprecated Use `isExpanded` property
-     */
-    seoInitExpanded?: boolean;
     /**
      * On ButtonIcon mouse click callback.
      */
@@ -46,20 +40,6 @@ interface Props {
      * @default '10rem'
      */
     collapsedSize?: string;
-    /**
-     * Allows to change the label of ButtonIcon.
-     * Note: Ignored when `isStateless` is set to true
-     *
-     * @deprecated Use `buttonLabel` property
-     */
-    showMoreText?: string;
-    /**
-     * Allows to change the label of ButtonIcon.
-     * Note: Ignored when `isStateless` is set to true
-     *
-     * @deprecated Use `buttonLabel` property
-     */
-    showLessText?: string;
     /**
      * Allows to pass a custom className
      */

package/build/es/components/ReadMore/ReadMore.js

@@ -36,14 +36,13 @@ const StyledButtonIcon = styled(ButtonIcon) `
 /** @visibleName Read More */
 const ReadMore = (_a) => {
     var { collapsedSize = '10rem', 'data-testid': dataTestId } = _a, props = __rest(_a, ["collapsedSize", 'data-testid']);
-    const [expanded, setExpanded] = useState(props.seoInitExpanded === true || false);
+    const [expanded, setExpanded] = useState(false);
     const contentRef = useRef(null);
     const buttonRef = useRef(null);
     const userInteractedRef = useRef(false);
     // TODO: Remove once https://jira.dna.fi/browse/STYLE-662 is done
     const temporaryIsStatelessFlag = typeof props.isExpanded !== 'undefined';
     const temporaryStateManagement = temporaryIsStatelessFlag ? props.isExpanded : expanded;
-    const temporaryButtonLabel = temporaryStateManagement ? props.showLessText : props.showMoreText;
     const handleOnClick = (event) => {
         if (props.onClick) {
             props.onClick(event);
@@ -53,11 +52,6 @@ const ReadMore = (_a) => {
         }
         userInteractedRef.current = true;
     };
-    useEffect(() => {
-        if (props.seoInitExpanded) {
-            setExpanded(false);
-        }
-    }, [props.seoInitExpanded]);
     useEffect(() => {
         var _a, _b;
         if (userInteractedRef.current) {
@@ -84,7 +78,7 @@ const ReadMore = (_a) => {
     return (React__default.createElement(Container, { id: props.id, className: props.className, "data-testid": dataTestId, "aria-label": props.ariaLabel, role: "region" },
         React__default.createElement(Content, { ref: contentRef, "$isExpanded": temporaryStateManagement, "$collapsedSize": collapsedSize, "data-testid": dataTestId && `${dataTestId}-content`, "aria-hidden": temporaryStateManagement ? 'false' : 'true', tabIndex: temporaryStateManagement ? 0 : -1 }, Children.map(props.children, forceTabIndexOnTextLinks)),
         React__default.createElement(ButtonWrapper, { "$buttonPosition": props.buttonPosition },
-            React__default.createElement(StyledButtonIcon, { ref: buttonRef, icon: temporaryStateManagement ? ChevronUp : ChevronDown, onClick: handleOnClick, "aria-expanded": temporaryStateManagement }, temporaryButtonLabel || props.buttonLabel))));
+            React__default.createElement(StyledButtonIcon, { ref: buttonRef, icon: temporaryStateManagement ? ChevronUp : ChevronDown, onClick: handleOnClick, "aria-expanded": temporaryStateManagement }, props.buttonLabel))));
 };
 
 export { ReadMore as default };

package/build/es/components/Tab/Tab.d.ts

@@ -1,10 +1,6 @@
 import type { MouseEvent, ReactNode } from 'react';
 import React from 'react';
 type Type = 'box' | 'panel' | 'underlined';
-/**
- * @deprecated Use `box`, `panel` or `underlined` types
- */
-type TypeDeprecated = 'default' | 'gray';
 export interface Props {
     /**
      * Unique ID for the component
@@ -21,45 +17,21 @@ export interface Props {
      * @param {Type} panel Content container remains unstyled
      * @param {Type} underlined Tab label is visually similar to anchor, with content container unstyled
      *
-     * @param {TypeDeprecated} default DEPRECATED Use `box` type
-     * @param {TypeDeprecated} gray DEPRECATED Use `box`, `panel` or `underlined` types
-     *
      * @default 'box'
      */
-    type?: Type | TypeDeprecated;
-    /**
-     * Style of the tab
-     *
-     * @deprecated Use `type` property
-     */
-    tabStyle?: Type;
+    type?: Type;
     /**
      * Content of the component
      */
     children?: ReactNode;
-    /**
-     * Allows to define currently active tab
-     *
-     * @deprecated Use `isActive` property
-     */
-    activeTab?: string;
     /**
      * Allows to set tab as active
      */
     isActive?: boolean;
-    /**
-     * Allows to enable updated internal state management.
-     * Note: In updated internal state management, this component acts as truly stateless and can be controlled with `isActive` property.
-     *
-     * @deprecated Will be removed in next major release
-     */
-    isStateless?: boolean;
     /**
      * On tab label click callback
-     *
-     * @deprecated Parameter `tab` has been deprecated. Use `e` parameter instead
      */
-    onClick?: (tab: string, e?: MouseEvent<HTMLElement>) => void;
+    onClick?: (label: string, e?: MouseEvent<HTMLElement>) => void;
     /**
      * Allows to pass testid string for testing purposes
      */

package/build/es/components/Tab/Tab.js

@@ -3,8 +3,6 @@ import React__default from 'react';
 import { styled } from 'styled-components';
 import theme from '../../themes/theme.js';
 import { getMultipliedSize } from '../../utils/styledUtils.js';
-import Box from '../Box/Box.js';
-import Divider from '../Divider/Divider.js';
 
 // TODO: Change to button HTML element as a part of https://jira.dna.fi/browse/STYLE-622
 const TabLabel = styled.li `
@@ -56,26 +54,6 @@ const TabStyle = styled.li `
             background-color: transparent;
         `}
 `;
-const ContentContainer = styled.div `
-    ${({ $type }) => {
-    if ($type === 'box' || $type === 'default') {
-        return `
-                border-top-left-radius: 0;
-            `;
-    }
-    if ($type === 'panel') {
-        return `
-                border-top: 1px solid ${theme.color.line.L03};
-            `;
-    }
-    if ($type === 'underlined' || $type === 'gray') {
-        return `
-                margin-top: ${theme.grid.gutter};
-            `;
-    }
-    return '';
-}}
-`;
 /** @visibleName Tab */
 const Tab = (_a) => {
     var { type = 'box', 'data-testid': dataTestId } = _a, props = __rest(_a, ["type", 'data-testid']);
@@ -84,17 +62,8 @@ const Tab = (_a) => {
             props.onClick(props.label, e);
         }
     };
-    const isActive = props.activeTab ? props.activeTab === props.label : props.isActive;
-    return type === 'box' || type === 'default' || type === 'panel' ? (React__default.createElement(React__default.Fragment, null,
-        React__default.createElement(TabLabel, { role: "tab", id: props.id, "$type": type, "aria-selected": isActive, "$isActive": isActive, onClick: onClickHandler, tabIndex: isActive ? 0 : -1 }, props.label),
-        props.isStateless &&
-            (props.children && (props.activeTab === props.label || props.isActive) ? (React__default.createElement(ContentContainer, { role: "tabpanel", "$type": props.tabStyle || type, as: (type === 'box' || type === 'default') && !props.tabStyle
-                    ? Box
-                    : undefined }, props.children)) : (React__default.createElement(Divider, { margin: "0" }))))) : (React__default.createElement(React__default.Fragment, null,
-        React__default.createElement(TabStyle, { role: "tab", id: props.id, "$type": props.tabStyle || type, "aria-selected": isActive, "$isActive": isActive, onClick: onClickHandler, tabIndex: isActive ? 0 : -1 }, props.label),
-        props.isStateless &&
-            props.children &&
-            (props.activeTab === props.label || props.isActive) && (React__default.createElement(ContentContainer, { role: "tabpanel", "$type": props.tabStyle || type }, props.children))));
+    const { isActive } = props;
+    return type === 'box' || type === 'panel' ? (React__default.createElement(TabLabel, { role: "tab", "data-testid": dataTestId, id: props.id, "$type": type, "aria-selected": isActive, "$isActive": isActive, onClick: onClickHandler, tabIndex: isActive ? 0 : -1 }, props.label)) : (React__default.createElement(TabStyle, { role: "tab", "data-testid": dataTestId, id: props.id, "$type": type, "aria-selected": isActive, "$isActive": isActive, onClick: onClickHandler, tabIndex: isActive ? 0 : -1 }, props.label));
 };
 
 export { Tab as default };

package/build/es/components/Tabs/Tabs.d.ts

@@ -1,7 +1,7 @@
 import type { MouseEvent, ReactNode } from 'react';
 import React from 'react';
 import type { Props as TabProps } from '../Tab/Tab';
-interface Props extends Omit<TabProps, 'label' | 'children' | 'activeTab' | 'onClick'> {
+interface Props extends Omit<TabProps, 'label' | 'children' | 'activeTab' | 'onClick' | 'tabStyle' | 'isStateless'> {
     /**
      * Content of the component
      *
@@ -22,20 +22,12 @@ interface Props extends Omit<TabProps, 'label' | 'children' | 'activeTab' | 'onC
      * Allows to reduce gap between tabs in `underlined` type
      */
     isNarrowUnderlined?: boolean;
-    /**
-     * On tab change callback
-     *
-     * @deprecated Use `onClick` property
-     */
-    onChange?: (tab: string) => void;
     /**
      * Allows to pass common mouse click callback to all children
      */
     onClick?: (e: MouseEvent<HTMLElement>) => void;
     /**
      * Allows to pass a custom className
-     *
-     * @deprecated Prefix 'tabs' is deprecated and will be removed in next major version
      */
     className?: string;
 }

package/build/es/components/Tabs/Tabs.js

@@ -21,7 +21,7 @@ const Tablist = styled.ul `
     `}
 
     ${({ $type, $isNarrowUnderlined }) => {
-    if ($type === 'box' || $type === 'default' || $type === 'panel') {
+    if ($type === 'box' || $type === 'panel') {
         return `
                 margin: 0;
                 
@@ -47,17 +47,12 @@ const Tablist = styled.ul `
                 border-bottom: 1px solid ${theme.color.line.L02};
             `;
     }
-    if ($type === 'gray') {
-        return `
-                gap: 1.25rem;
-            `;
-    }
     return '';
 }}
 `;
 const ContentContainer = styled.div `
     ${({ $type, $isFullWidth }) => {
-    if ($type === 'box' || $type === 'default') {
+    if ($type === 'box') {
         return `
                 border-top-left-radius: 0;
                 ${$isFullWidth ? 'border-top-right-radius: 0;' : ''}
@@ -68,7 +63,7 @@ const ContentContainer = styled.div `
                 border-top: 1px solid ${theme.color.line.L03};
             `;
     }
-    if ($type === 'underlined' || $type === 'gray') {
+    if ($type === 'underlined') {
         return `
                 margin-top: ${theme.grid.gutter};
             `;
@@ -84,9 +79,6 @@ const Tabs = (_a) => {
     const onClickTabItem = (tab, e) => {
         setActiveTab(tab);
         if (tab !== activeTab) {
-            if (props.onChange) {
-                props.onChange(tab);
-            }
             if (props.onClick && e) {
                 props.onClick(e);
             }
@@ -107,16 +99,16 @@ const Tabs = (_a) => {
     if (!tabs) {
         return null;
     }
-    const outerActiveTab = tabs.find(child => child.props.isActive || child.props.activeTab === child.props.label);
+    const outerActiveTab = tabs.find(child => child.props.isActive);
     if (!activeTab) {
         setActiveTab((outerActiveTab === null || outerActiveTab === void 0 ? void 0 : outerActiveTab.props.label) || tabs[0].props.label);
     }
-    return (React__default.createElement("div", { className: props.className ? `tabs ${props.className}` : 'tabs', "data-testid": dataTestId },
-        React__default.createElement(Tablist, { role: "tablist", "$type": props.tabStyle || type, "$isFullWidth": props.isFullWidth, "$isNarrowUnderlined": props.isNarrowUnderlined, onKeyDown: onKeyDown }, Children.map(props.children, tab => isValidElement(tab) &&
-            tab.type === Tab && (React__default.createElement(Tab, { id: tab.props.id, key: tab.props.label, label: tab.props.label, type: props.tabStyle || type, isActive: tab.props.isActive
+    return (React__default.createElement("div", { className: props.className, "data-testid": dataTestId },
+        React__default.createElement(Tablist, { role: "tablist", "$type": type, "$isFullWidth": props.isFullWidth, "$isNarrowUnderlined": props.isNarrowUnderlined, onKeyDown: onKeyDown }, Children.map(props.children, tab => isValidElement(tab) &&
+            tab.type === Tab && (React__default.createElement(Tab, { id: tab.props.id, key: tab.props.label, label: tab.props.label, type: type, isActive: tab.props.isActive
                 ? tab.props.isActive
-                : activeTab === tab.props.label, activeTab: tab.props.activeTab, onClick: onClickTabItem, className: tab.props.className, "data-testid": tab.props['data-testid'] })))),
-        React__default.createElement(ContentContainer, { role: "tabpanel", "$type": props.tabStyle || type, "$isFullWidth": props.isFullWidth, as: (type === 'box' || type === 'default') && !props.tabStyle ? Box : undefined }, Children.map(props.children, tab => isValidElement(tab) &&
+                : activeTab === tab.props.label, onClick: onClickTabItem, className: tab.props.className, "data-testid": tab.props['data-testid'] })))),
+        React__default.createElement(ContentContainer, { role: "tabpanel", "$type": type, "$isFullWidth": props.isFullWidth, as: type === 'box' ? Box : undefined }, Children.map(props.children, tab => isValidElement(tab) &&
             tab.type === Tab &&
             (tab.props.isActive || tab.props.label === activeTab) &&
             tab.props.children))));

package/build/es/components/index.d.ts

@@ -9,7 +9,6 @@ export { default as ButtonCard } from './ButtonCard/ButtonCard';
 export { default as ButtonClose } from './ButtonClose/ButtonClose';
 export { default as ButtonIcon } from './ButtonIcon/ButtonIcon';
 export { default as ButtonPrimary } from './ButtonPrimary/ButtonPrimary';
-export { default as ButtonRound } from './ButtonRound/ButtonRound';
 export { default as ButtonSecondary } from './ButtonSecondary/ButtonSecondary';
 export { default as Carousel } from './Carousel/Carousel';
 export { default as Checkbox } from './Checkbox/Checkbox';
@@ -31,7 +30,6 @@ export { default as Input } from './Input/Input';
 export { default as Label } from './Label/Label';
 export { default as LabelText } from './LabelText/LabelText';
 export { default as MainHeaderNavigation } from './MainHeaderNavigation/MainHeaderNavigation';
-export { default as MainNavigation } from './MainNavigation/MainNavigation';
 export { default as Modal } from './Modal/Modal';
 export { default as Notification } from './Notification/Notification';
 export { default as NotificationBadge } from './NotificationBadge/NotificationBadge';
@@ -45,7 +43,6 @@ export { default as ProgressIndicator } from './ProgressIndicator/ProgressIndica
 export { default as RadioButton } from './RadioButton/RadioButton';
 export { default as ReadMore } from './ReadMore/ReadMore';
 export { default as Search } from './Search/Search';
-export { default as SecondaryNavigation } from './SecondaryNavigation/SecondaryNavigation';
 export { default as Selectbox } from './Selectbox/Selectbox';
 export { default as Skeleton } from './Skeleton/Skeleton';
 export { default as Switch } from './Switch/Switch';
@@ -54,4 +51,3 @@ export { default as Tabs } from './Tabs/Tabs';
 export { default as Textarea } from './Textarea/Textarea';
 export { default as Toaster } from './Toaster/Toaster';
 export { default as Tooltip } from './Tooltip/Tooltip';
-export { default as TooltipMenu } from './TooltipMenu/TooltipMenu';

package/build/es/hooks/useCloseOutsideOrElementClicked.js

@@ -19,7 +19,7 @@ const useCloseOutsideOrElementClicked = ({ ref, closeWhenTagClicked }, callback)
             return tag === ((_b = target.tagName) === null || _b === void 0 ? void 0 : _b.toLowerCase()) || tag === ((_c = parent.tagName) === null || _c === void 0 ? void 0 : _c.toLowerCase());
         });
         if ((ref.current && !ref.current.contains(target)) ||
-            (isElementInList && !target.dataset.noClose)) {
+            (isElementInList && !target.closest('.no-close'))) {
             callback();
         }
     };

package/build/es/index.js

@@ -9,7 +9,6 @@ export { default as ButtonCard } from './components/ButtonCard/ButtonCard.js';
 export { default as ButtonClose } from './components/ButtonClose/ButtonClose.js';
 export { default as ButtonIcon } from './components/ButtonIcon/ButtonIcon.js';
 export { default as ButtonPrimary } from './components/ButtonPrimary/ButtonPrimary.js';
-export { default as ButtonRound } from './components/ButtonRound/ButtonRound.js';
 export { default as ButtonSecondary } from './components/ButtonSecondary/ButtonSecondary.js';
 export { default as Carousel } from './components/Carousel/Carousel.js';
 export { default as Checkbox } from './components/Checkbox/Checkbox.js';
@@ -139,7 +138,6 @@ export { default as Input } from './components/Input/Input.js';
 export { default as Label } from './components/Label/Label.js';
 export { default as LabelText } from './components/LabelText/LabelText.js';
 export { default as MainHeaderNavigation } from './components/MainHeaderNavigation/MainHeaderNavigation.js';
-export { default as MainNavigation } from './components/MainNavigation/MainNavigation.js';
 export { default as Modal } from './components/Modal/Modal.js';
 export { default as Notification } from './components/Notification/Notification.js';
 export { default as NotificationBadge } from './components/NotificationBadge/NotificationBadge.js';
@@ -153,7 +151,6 @@ export { default as ProgressIndicator } from './components/ProgressIndicator/Pro
 export { default as RadioButton } from './components/RadioButton/RadioButton.js';
 export { default as ReadMore } from './components/ReadMore/ReadMore.js';
 export { default as Search } from './components/Search/Search.js';
-export { default as SecondaryNavigation } from './components/SecondaryNavigation/SecondaryNavigation.js';
 export { default as Selectbox } from './components/Selectbox/Selectbox.js';
 export { default as Skeleton } from './components/Skeleton/Skeleton.js';
 export { default as Switch } from './components/Switch/Switch.js';
@@ -162,7 +159,6 @@ export { default as Tabs } from './components/Tabs/Tabs.js';
 export { default as Textarea } from './components/Textarea/Textarea.js';
 export { default as Toaster } from './components/Toaster/Toaster.js';
 export { default as Tooltip } from './components/Tooltip/Tooltip.js';
-export { default as TooltipMenu } from './components/TooltipMenu/TooltipMenu.js';
 export { default as createStyled } from './utils/createStyled.js';
 export { styled } from 'styled-components';
 export { default as theme } from './themes/theme.js';

package/build/es/themes/themeComponents/navigation.js

@@ -10,8 +10,6 @@ const headerLogoSize = '3.75rem';
 const mobileLogoSize = '3.75em';
 const desktopLogoSize = '5.25em';
 const menuItemMargin = '1rem';
-const ribbonHeight = '1.5625rem';
-const wideMenuBreakpoint = 1280;
 const IconContainerWidth = '3.75rem'; // 60px
 const IconContainerMinWidth = '2.5rem'; // 40px
 const navMaxHeight = '3.75rem'; // 60px
@@ -32,4 +30,4 @@ const navigation = {
     headerMaxHeight,
 };
 
-export { IconContainerMinWidth, IconContainerWidth, navigation as default, desktopLogoSize, desktopNavMaxHeight, headerLogoSize, headerMaxHeight, menuItemMargin, menuLevelsAmount, mobileLogoSize, mobileNavMaxHeight, mobileNavMaxWidth, navIconSize, navIconSizeMobile, navMaxHeight, ribbonHeight, subMenuWidth, subMenuWidthXl, wideMenuBreakpoint };
+export { IconContainerMinWidth, IconContainerWidth, navigation as default, desktopLogoSize, desktopNavMaxHeight, headerLogoSize, headerMaxHeight, menuItemMargin, menuLevelsAmount, mobileLogoSize, mobileNavMaxHeight, mobileNavMaxWidth, navIconSize, navIconSizeMobile, navMaxHeight, subMenuWidth, subMenuWidthXl };

package/package.json

@@ -1,7 +1,7 @@
 {
     "name": "@dnanpm/styleguide",
     "sideEffects": false,
-    "version": "v3.12.3",
+    "version": "v4.0.0",
     "main": "build/cjs/index.js",
     "module": "build/es/index.js",
     "jsnext:main": "build/es/index.js",
@@ -49,9 +49,12 @@
         "@babel/preset-react": "^7.26.3",
         "@babel/preset-typescript": "^7.28.5",
         "@dnanpm/icons": "^2.0.9",
+        "@eslint/eslintrc": "^3.3.1",
+        "@eslint/js": "^9.39.1",
         "@rollup/plugin-commonjs": "^29.0.0",
         "@rollup/plugin-node-resolve": "^16.0.3",
         "@rollup/plugin-typescript": "^12.3.0",
+        "@stylistic/eslint-plugin": "^5.5.0",
         "@testing-library/jest-dom": "^6.6.3",
         "@testing-library/react": "^16.3.0",
         "@testing-library/user-event": "^14.5.2",
@@ -62,21 +65,18 @@
         "@types/react-dom": "^18.3.1",
         "@types/react-modal": "^3.13.1",
         "@types/resize-observer-browser": "^0.1.8",
-        "@typescript-eslint/eslint-plugin": "^5.62.0",
-        "@typescript-eslint/parser": "^5.62.0",
+        "@typescript-eslint/eslint-plugin": "^8.46.4",
+        "@typescript-eslint/parser": "^8.46.4",
         "babel-loader": "^9.2.1",
         "cross-env": "^10.0.0",
         "css-loader": "^6.11.0",
-        "eslint": "^8.57.1",
-        "eslint-config-airbnb": "^19.0.4",
-        "eslint-config-airbnb-typescript": "^17.1.0",
+        "eslint": "^9.39.1",
         "eslint-config-prettier": "^10.1.8",
-        "eslint-plugin-import": "2.32.0",
-        "eslint-plugin-jsdoc": "^61.1.12",
+        "eslint-plugin-import": "^2.32.0",
+        "eslint-plugin-jsdoc": "^61.2.0",
         "eslint-plugin-jsx-a11y": "^6.10.2",
-        "eslint-plugin-prefer-arrow": "^1.2.3",
-        "eslint-plugin-react": "^7.37.4",
-        "eslint-plugin-react-hooks": "^4.6.2",
+        "eslint-plugin-react": "^7.37.5",
+        "eslint-plugin-react-hooks": "^7.0.1",
         "eslint-plugin-transient-props": "file:eslint-plugins/eslint-plugin-transient-props",
         "jest": "^30.0.5",
         "jest-environment-jsdom": "^29.7.0",
@@ -100,7 +100,7 @@
     },
     "dependencies": {
         "ramda": "^0.32.0",
-        "react-datepicker": "8.8.0",
+        "react-datepicker": "8.9.0",
         "react-modal": "^3.16.1",
         "react-select": "^5.8.1",
         "react-spring": "^8.0.27",

package/build/cjs/components/ButtonRound/ButtonRound.d.ts

@@ -1,10 +0,0 @@
-import React from 'react';
-import type { Props as ButtonProps } from '../Button/Button';
-type Props = Omit<ButtonProps, 'small' | 'fullWidth' | 'loading'>;
-/**
- * @visibleName Button Round
- * @deprecated Use `ButtonArrow` component
- */
-declare const ButtonRound: ({ "data-testid": dataTestId, "data-no-close": dataNoClose, "data-track-value": dataTrackValue, ...props }: Props) => React.JSX.Element;
-/** @component */
-export default ButtonRound;

package/build/cjs/components/ButtonRound/ButtonRound.js

@@ -1,37 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var tslib = require('tslib');
-var React = require('react');
-var styledComponents = require('styled-components');
-var theme = require('../../themes/theme.js');
-var styledUtils = require('../../utils/styledUtils.js');
-var ButtonPrimary = require('../ButtonPrimary/ButtonPrimary.js');
-
-function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
-
-var React__default = /*#__PURE__*/_interopDefaultCompat(React);
-
-const ButtonElement = styledComponents.styled(ButtonPrimary.default) `
-    display: flex;
-    min-width: initial;
-    width: ${styledUtils.getMultipliedSize(theme.default.base.baseWidth, 3.2)};
-    height: ${styledUtils.getMultipliedSize(theme.default.base.baseHeight, 3.2)};
-    border-radius: ${theme.default.radius.circle};
-    padding: initial;
-    text-align: center;
-    vertical-align: middle;
-    justify-content: center;
-    align-items: center;
-`;
-/**
- * @visibleName Button Round
- * @deprecated Use `ButtonArrow` component
- */
-const ButtonRound = (_a) => {
-    var { 'data-testid': dataTestId, 'data-no-close': dataNoClose, 'data-track-value': dataTrackValue } = _a, props = tslib.__rest(_a, ['data-testid', 'data-no-close', 'data-track-value']);
-    return (React__default.default.createElement(ButtonElement, { id: props.id, name: props.name, type: props.type, onClick: props.onClick, onMouseDown: props.onMouseDown, darkBg: props.darkBg, disabled: props.disabled, className: props.className, "data-testid": dataTestId, "data-no-close": dataNoClose, "data-track-value": dataTrackValue }, props.children));
-};
-
-exports.default = ButtonRound;