glints-aries 4.1.0 → 4.1.3

package/es/Display/Swipeable/SwipeableItem.js

@@ -1,15 +0,0 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
-var _excluded = ["children", "className"];
-import * as React from 'react';
-import classNames from 'classnames';
-import { SwipeableItemWrapper } from './SwipeableStyle';
-var SwipeableItem = function SwipeableItem(props) {
-  var children = props.children,
-    className = props.className,
-    defaultProps = _objectWithoutPropertiesLoose(props, _excluded);
-  return /*#__PURE__*/React.createElement(SwipeableItemWrapper, _extends({
-    className: classNames('swipeable-itemwrapper', className)
-  }, defaultProps), children);
-};
-export default SwipeableItem;

package/es/Display/Swipeable/SwipeableStyle.d.ts

@@ -1,3 +0,0 @@
-export declare const SwipeableContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const SwipeableItemWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const SwipeableCardExample: import("styled-components").StyledComponent<"div", any, {}, never>;

package/es/Display/Swipeable/SwipeableStyle.js

@@ -1,16 +0,0 @@
-import styled from 'styled-components';
-import { ScreenSize } from '../../Utils/StyleConfig';
-import { Greyscale } from '../../Utils/Colors';
-import { Shadow } from '../../Utils/Shadow';
-export var SwipeableContainer = styled.div.withConfig({
-  displayName: "SwipeableStyle__SwipeableContainer",
-  componentId: "sc-xvh6jb-0"
-})(["display:flex;position:relative;overflow-x:auto;&::-webkit-scrollbar{appearance:none;height:7px;}&::-webkit-scrollbar-thumb{border-radius:4px;background-color:rgba(0,0,0,0.25);}@media (max-width:", "px){scrollbar-width:none;&::-webkit-scrollbar{display:none;}}"], ScreenSize.desktopS);
-export var SwipeableItemWrapper = styled.div.withConfig({
-  displayName: "SwipeableStyle__SwipeableItemWrapper",
-  componentId: "sc-xvh6jb-1"
-})(["display:inline-flex;margin:0 1em;padding:1em 0;&:first-child{margin-left:0;}&:last-child{margin-right:0;}"]);
-export var SwipeableCardExample = styled.div.withConfig({
-  displayName: "SwipeableStyle__SwipeableCardExample",
-  componentId: "sc-xvh6jb-2"
-})(["width:150px;height:150px;background:", ";box-shadow:", ";display:flex;justify-content:center;align-items:center;"], Greyscale.white, Shadow.down1);

package/es/Display/Swipeable/index.d.ts

@@ -1,2 +0,0 @@
-import Swipeable from './Swipeable';
-export default Swipeable;

package/es/Display/Swipeable/index.js

@@ -1,2 +0,0 @@
-import Swipeable from './Swipeable';
-export default Swipeable;

package/es/Display/Tabs/TabPane.d.ts

@@ -1,10 +0,0 @@
-import * as React from 'react';
-import { TabsContent } from './TabsStyle';
-declare const TabPane: React.FunctionComponent<Props>;
-export declare type Props = React.ComponentPropsWithoutRef<typeof TabsContent> & {
-    children?: React.ReactNode;
-    tab?: string | React.ReactNode;
-    label?: string | number;
-    tabClassName?: string;
-};
-export default TabPane;

package/es/Display/Tabs/TabPane.js

@@ -1,14 +0,0 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
-var _excluded = ["children", "className"];
-import * as React from 'react';
-import { TabsContent } from './TabsStyle';
-var TabPane = function TabPane(props) {
-  var children = props.children,
-    className = props.className,
-    defaultProps = _objectWithoutPropertiesLoose(props, _excluded);
-  return /*#__PURE__*/React.createElement(TabsContent, _extends({
-    className: className
-  }, defaultProps), children);
-};
-export default TabPane;

package/es/Display/Tabs/Tabs.d.ts

@@ -1,21 +0,0 @@
-import * as React from 'react';
-import TabPane from './TabPane';
-export declare const Tabs: TabsType;
-export declare type Alignment = 'horizontal' | 'vertical';
-export declare type Theme = 'blue' | 'black';
-export interface Props {
-    children: React.ReactNode;
-    /** Sets alignment of Tab. The vertical tabs are changed to horizontal ones for screen size below 768 */
-    alignment?: Alignment;
-    /** Sets the theme for the tabs */
-    theme?: Theme;
-    /** Controls the currently active tab (index) */
-    activeTab?: string | number;
-    /** Called when a tab gets clicked. Called with the index of the tab. */
-    onTabClick?(tab: React.ReactText | React.ReactNode): void;
-    className?: string;
-}
-declare type TabsType = React.FunctionComponent<Props> & {
-    Pane: typeof TabPane;
-};
-export default Tabs;

package/es/Display/Tabs/Tabs.js

@@ -1,66 +0,0 @@
-import * as React from 'react';
-import classNames from 'classnames';
-import TabPane from './TabPane';
-import { TabsContainer, TabsHeader, TabsBody } from './TabsStyle';
-export var Tabs = function Tabs(_ref) {
-  var activeTab = _ref.activeTab,
-    onTabClick = _ref.onTabClick,
-    children = _ref.children,
-    className = _ref.className,
-    _ref$alignment = _ref.alignment,
-    alignment = _ref$alignment === void 0 ? 'horizontal' : _ref$alignment,
-    _ref$theme = _ref.theme,
-    theme = _ref$theme === void 0 ? 'black' : _ref$theme;
-  var _React$useState = React.useState(0),
-    currentIndex = _React$useState[0],
-    setCurrentIndex = _React$useState[1];
-  var activeTabOrIndex = activeTab || currentIndex;
-  var childrenArray = React.Children.toArray(children);
-  var currentChild = childrenArray[currentIndex];
-  var handleTabClick = function handleTabClick(index, tab) {
-    var listener = function listener() {
-      setCurrentIndex(index);
-      if (onTabClick) {
-        onTabClick(tab);
-      }
-    };
-    return listener;
-  };
-  return /*#__PURE__*/React.createElement(TabsContainer, {
-    className: classNames(alignment + "-aries-tabs", 'aries-tabs', className)
-  }, /*#__PURE__*/React.createElement(TabsHeader, {
-    className: classNames(alignment + "-tabs-header", 'tabs-header'),
-    theme: theme,
-    alignment: alignment
-  }, /*#__PURE__*/React.createElement("ul", {
-    className: classNames(alignment + "-tabs-list", 'tabs-list'),
-    role: "tablist"
-  }, React.Children.map(children, function (data, index) {
-    var tabLabel = data.props.label || index;
-    var tabClassName = data.props.tabClassName || '';
-    return /*#__PURE__*/React.createElement("li", {
-      className: classNames("tab-" + tabLabel, {
-        active: activeTabOrIndex === tabLabel
-      }, alignment + "-tab", "" + tabClassName),
-      key: index,
-      role: "tab",
-      "aria-selected": activeTabOrIndex === tabLabel && true,
-      "aria-controls": "tab-item-" + tabLabel,
-      tabIndex: -1
-    }, /*#__PURE__*/React.createElement("button", {
-      type: "button",
-      onClick: handleTabClick(index, tabLabel),
-      role: "tab-button"
-    }, data.props.tab));
-  }))), /*#__PURE__*/React.createElement(TabsBody, {
-    className: "tabs-body",
-    tabIndex: 0
-  }, /*#__PURE__*/React.createElement(TabPane, {
-    className: classNames('tabs-item', "tab-item-" + activeTabOrIndex, "tabs-item-" + alignment, 'tabs-item'),
-    role: "tabpanel",
-    "aria-labelledby": "tab-" + activeTabOrIndex,
-    tabIndex: -1
-  }, /*#__PURE__*/React.isValidElement(currentChild) && currentChild.props.children)));
-};
-Tabs.Pane = TabPane;
-export default Tabs;

package/es/Display/Tabs/Tabs.stories.d.ts

@@ -1,7 +0,0 @@
-import { Meta } from '@storybook/react';
-declare const _default: Meta<import("@storybook/react").Args>;
-export default _default;
-export declare const Interactive: any;
-export declare const Alignment: any;
-export declare const Theme: any;
-export declare const OverflowEffect: any;

package/es/Display/Tabs/Tabs.test.d.ts

@@ -1,2 +0,0 @@
-import 'jest-styled-components';
-import '@testing-library/jest-dom/extend-expect';

package/es/Display/Tabs/TabsStyle.d.ts

@@ -1,10 +0,0 @@
-import { Alignment, Theme } from './Tabs';
-interface TabHeader {
-    alignment: Alignment;
-    theme: Theme;
-}
-export declare const TabsContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const TabsHeader: import("styled-components").StyledComponent<"div", any, TabHeader, never>;
-export declare const TabsContent: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const TabsBody: import("styled-components").StyledComponent<"div", any, {}, never>;
-export {};

package/es/Display/Tabs/TabsStyle.js

@@ -1,50 +0,0 @@
-import styled from 'styled-components';
-import { ScreenSize, ETabThemeVariant, ETabAlignment } from '../../Utils/StyleConfig';
-import { SecondaryColor, Greyscale } from '../../Utils/Colors';
-var isNewTab = function isNewTab(theme) {
-  return theme !== ETabThemeVariant.BLACK;
-};
-export var TabsContainer = styled.div.withConfig({
-  displayName: "TabsStyle__TabsContainer",
-  componentId: "sc-t1kk7p-0"
-})(["position:relative;&.vertical-aries-tabs{@media (min-width:", "px){display:flex;max-width:100%;}}"], ScreenSize.tablet);
-export var TabsHeader = styled.div.withConfig({
-  displayName: "TabsStyle__TabsHeader",
-  componentId: "sc-t1kk7p-1"
-})(["position:relative;&.vertical-tabs-header{@media (min-width:", "px){width:20%;}}.vertical-tabs-list{@media (min-width:", "px){border-right:1px solid ", ";border-bottom:none;flex-direction:column;}}ul{border-bottom:1px solid ", ";display:flex;position:relative;white-space:nowrap;overflow:auto;font-size:1em;padding:0;margin:0;background-image:linear-gradient(to right,white,white),linear-gradient(to right,white,white),linear-gradient( to right,rgba(198,198,198,0.3),rgba(255,255,255,0) ),linear-gradient(to left,rgba(198,198,198,0.3),rgba(255,255,255,0));background-position:left center,right center,left center,right center;background-repeat:no-repeat;background-size:15px 100%,15px 100%,15px 100%,15px 100%;background-attachment:local,local,scroll,scroll;&::-webkit-scrollbar{display:none;}.horizontal-tab{margin:", ";}.vertical-tab{margin:0 10px;@media (min-width:", "px){margin:0;padding-left:15px;}}li{text-transform:uppercase;list-style-type:none;&:first-child.horizontal-tab{margin-left:0;}&:last-child.horizontal-tab{margin-right:0;}&:first-child.vertical-tab{margin-top:0;}&:last-child.vertical-tab{margin-bottom:0;}&.active.horizontal-tab,&.active.vertical-tab{border-bottom:", ";button{font-weight:bold;text-transform:uppercase;color:", ";}button:hover{border:0;}}&.active.vertical-tab{@media (min-width:", "px){border-right:", ";border-bottom:none;}button{font-weight:bold;text-transform:uppercase;}}}svg{margin-right:10px;height:15px;width:15px;}&:focus{outline:none;}.vertical-tab button{text-align:left;}button{width:100%;padding:20px 0;background:transparent;border:none;cursor:pointer;outline:none;text-transform:uppercase;", ";}button:hover{", ";", ";}}@media ", "{li{margin:0 15px;}}"], ScreenSize.tablet, ScreenSize.tablet, Greyscale.softgrey, Greyscale.softgrey, function (_ref) {
-  var theme = _ref.theme;
-  return isNewTab(theme) ? '0 15px' : '0 10px';
-}, ScreenSize.tablet, function (_ref2) {
-  var theme = _ref2.theme;
-  return isNewTab(theme) ? "4px solid " + SecondaryColor.actionblue : "2px solid " + Greyscale.black;
-}, function (_ref3) {
-  var theme = _ref3.theme;
-  return isNewTab(theme) ? "" + SecondaryColor.actionblue : "" + Greyscale.black;
-}, ScreenSize.tablet, function (_ref4) {
-  var theme = _ref4.theme;
-  return isNewTab(theme) ? "4px solid " + SecondaryColor.actionblue : "2px solid " + Greyscale.black;
-}, function (_ref5) {
-  var theme = _ref5.theme;
-  if (isNewTab(theme)) {
-    return "\n            letter-spacing: 1px;\n            font-weight: 500;\n            color: " + Greyscale.grey + ";\n          ";
-  }
-}, function (_ref6) {
-  var theme = _ref6.theme;
-  if (isNewTab(theme)) {
-    return "\n          color: " + SecondaryColor.actionblue + ";\n          border-bottom: 4px solid rgba(1, 126, 183, 0.5);\n          ";
-  }
-}, function (_ref7) {
-  var alignment = _ref7.alignment,
-    theme = _ref7.theme;
-  if (alignment === ETabAlignment.VERTICAL && isNewTab(theme)) {
-    return "\n            @media (min-width: " + ScreenSize.tablet + "px) {\n              border-bottom: 0;\n              border-right: 4px solid rgba(1, 126, 183, 0.5);\n            }\n          ";
-  }
-}, "(min-width: " + ScreenSize.desktopS + "px)");
-export var TabsContent = styled.div.withConfig({
-  displayName: "TabsStyle__TabsContent",
-  componentId: "sc-t1kk7p-2"
-})(["position:relative;outline:none;@media (min-width:", "px){&.tabs-item-vertical{margin-left:60px;}}"], ScreenSize.tablet);
-export var TabsBody = styled.div.withConfig({
-  displayName: "TabsStyle__TabsBody",
-  componentId: "sc-t1kk7p-3"
-})(["position:relative;padding-top:1.2em;&:focus{outline:none;}&:focus > ", "{outline:5px auto -webkit-focus-ring-color;}"], TabsContent);

package/es/Display/Tabs/index.d.ts

@@ -1,2 +0,0 @@
-import Tabs from './Tabs';
-export default Tabs;

package/es/Display/Tabs/index.js

@@ -1,2 +0,0 @@
-import Tabs from './Tabs';
-export default Tabs;

package/es/Display/Tooltip/Tooltip.d.ts

@@ -1,22 +0,0 @@
-import React, { HTMLAttributes, FC } from 'react';
-export declare const Tooltip: FC<Props>;
-export interface Classes {
-    container?: string;
-    content?: string;
-    message?: string;
-}
-export declare type Position = 'top' | 'right' | 'bottom' | 'left';
-interface BaseProps extends HTMLAttributes<HTMLHeadingElement> {
-    classes?: Classes;
-    position?: Position;
-}
-export interface StringTooltip extends BaseProps {
-    text: string;
-    textAsString?: string;
-}
-export interface HtmlTooltip extends BaseProps {
-    text: React.ReactNode;
-    textAsString: string;
-}
-export declare type Props = StringTooltip | HtmlTooltip;
-export default Tooltip;

package/es/Display/Tooltip/Tooltip.js

@@ -1,62 +0,0 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
-var _excluded = ["classes", "children", "text", "textAsString", "position"];
-import React, { useRef, useState, useCallback } from 'react';
-import classNames from 'classnames';
-import { TooltipContainer, TooltipContent, TooltipMessage } from './TooltipStyle';
-export var Tooltip = function Tooltip(_ref) {
-  var _ref$classes = _ref.classes,
-    classes = _ref$classes === void 0 ? {} : _ref$classes,
-    children = _ref.children,
-    text = _ref.text,
-    textAsString = _ref.textAsString,
-    _ref$position = _ref.position,
-    position = _ref$position === void 0 ? 'top' : _ref$position,
-    defaultProps = _objectWithoutPropertiesLoose(_ref, _excluded);
-  var contentRef = useRef(null);
-  var _useState = useState(false),
-    isShow = _useState[0],
-    setIsShow = _useState[1];
-  var showTooltip = function showTooltip() {
-    return setIsShow(true);
-  };
-  var hideTooltip = function hideTooltip() {
-    return setIsShow(false);
-  };
-  var hideTooltipIfTouchOutside = useCallback(function (event) {
-    var hasTouchedOutsideOfTooltipContent = contentRef.current && !contentRef.current.contains(event.target);
-    if (hasTouchedOutsideOfTooltipContent) {
-      hideTooltip();
-      document.removeEventListener('touchstart', hideTooltipIfTouchOutside);
-    }
-  }, []);
-  var handleTouchStart = function handleTouchStart() {
-    if (!isShow) {
-      showTooltip();
-      document.addEventListener('touchstart', hideTooltipIfTouchOutside);
-    }
-  };
-  var arialLabel = typeof text === 'string' ? text : textAsString;
-  return /*#__PURE__*/React.createElement(TooltipContainer, _extends({
-    className: classNames('aries-tooltip', classes.container),
-    role: "tooltip",
-    "aria-hidden": isShow ? 'false' : 'true',
-    "aria-label": arialLabel
-    // The tooltip does not close on iOS devices because of this issue https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event#Safari_Mobile
-    // Adding onTouchStart and onTouchEnd as a workaround
-    // On mobile, it shows the tooltip on touch and hides the tooltip when the touch is released
-    ,
-    onTouchStart: handleTouchStart,
-    onMouseOver: showTooltip,
-    onMouseLeave: hideTooltip
-  }, defaultProps), isShow && /*#__PURE__*/React.createElement(TooltipContent, {
-    ref: contentRef,
-    className: classNames('aries-tooltip-content', classes.content),
-    text: text,
-    textAsString: textAsString,
-    position: position
-  }, /*#__PURE__*/React.createElement(TooltipMessage, {
-    className: classNames('aries-tooltip-message', classes.message)
-  }, text)), children);
-};
-export default Tooltip;

package/es/Display/Tooltip/Tooltip.stories.d.ts

@@ -1,6 +0,0 @@
-import { Meta } from '@storybook/react';
-declare const _default: Meta<import("@storybook/react").Args>;
-export default _default;
-export declare const Interactive: any;
-export declare const DifferentPosition: any;
-export declare const WithHtmlContent: any;

package/es/Display/Tooltip/Tooltip.test.d.ts

@@ -1,2 +0,0 @@
-import 'jest-styled-components';
-import '@testing-library/jest-dom/extend-expect';

package/es/Display/Tooltip/TooltipStyle.d.ts

@@ -1,3 +0,0 @@
-export declare const TooltipContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const TooltipContent: import("styled-components").StyledComponent<"div", any, import("./Tooltip").StringTooltip | import("./Tooltip").HtmlTooltip, never>;
-export declare const TooltipMessage: import("styled-components").StyledComponent<"div", any, {}, never>;

package/es/Display/Tooltip/TooltipStyle.js

@@ -1,26 +0,0 @@
-import styled from 'styled-components';
-import { Greyscale } from '../../Utils/Colors';
-export var TooltipContainer = styled.div.withConfig({
-  displayName: "TooltipStyle__TooltipContainer",
-  componentId: "sc-16e8edg-0"
-})(["position:relative;display:inline-flex;"]);
-export var TooltipContent = styled.div.withConfig({
-  displayName: "TooltipStyle__TooltipContent",
-  componentId: "sc-16e8edg-1"
-})(["position:absolute;z-index:10;width:100%;", " &:after{content:'';position:absolute;}"], function (_ref) {
-  var position = _ref.position;
-  switch (position) {
-    case 'bottom':
-      return "\n          top: 100%;\n          left: 50%;\n          padding-top: 9px;\n          transform: translateX(-50%);\n\n          &:after {\n            border-left: 9px solid transparent;\n            border-right: 9px solid transparent;\n            border-bottom: 9px solid " + Greyscale.black + ";\n            top: 0;\n            left: 50%;\n            transform: translateX(-50%);\n          }\n        ";
-    case 'left':
-      return "\n          top: 50%;\n          right: 100%;\n          padding-right: 9px;\n          transform: translateY(-50%);\n          \n          &:after {\n            border-left: 9px solid " + Greyscale.black + ";\n            border-top: 9px solid transparent;\n            border-bottom: 9px solid transparent;\n            top: 50%;\n            right: 0;\n            transform: translateY(-50%);\n          }\n        ";
-    case 'right':
-      return "\n          top: 50%;\n          left: 100%;\n          padding-left: 9px;\n          transform: translateY(-50%);\n          \n          &::after {\n            border-right: 9px solid " + Greyscale.black + ";\n            border-top: 9px solid transparent;\n            border-bottom: 9px solid transparent;\n            top: 50%;\n            left: 0;\n            transform: translateY(-50%);\n          }\n        ";
-    default:
-      return "\n          bottom: 100%;\n          left: 50%;\n          padding-bottom: 9px;\n          transform: translateX(-50%);\n\n          &:after {\n            border-left: 9px solid transparent;\n            border-right: 9px solid transparent;\n            border-top: 9px solid " + Greyscale.black + ";\n            bottom: 0;\n            left: 50%;\n            transform: translateX(-50%);\n          }\n        ";
-  }
-});
-export var TooltipMessage = styled.div.withConfig({
-  displayName: "TooltipStyle__TooltipMessage",
-  componentId: "sc-16e8edg-2"
-})(["background:", ";border-radius:3px;color:", ";line-height:1.5;font-size:12px;padding:10px;text-align:center;"], Greyscale.black, Greyscale.white);

package/es/Display/Tooltip/index.d.ts

@@ -1,3 +0,0 @@
-import Tooltip from './Tooltip';
-export { Tooltip };
-export default Tooltip;

package/es/Display/Tooltip/index.js

@@ -1,3 +0,0 @@
-import Tooltip from './Tooltip';
-export { Tooltip };
-export default Tooltip;

package/es/General/Alert/Alert.d.ts

@@ -1,18 +0,0 @@
-/// <reference types="react" />
-export declare const Alert: ({ isOpen: externalIsVisible, autoClose, onClose: externalOnClose, type, className, message, }: Props) => JSX.Element;
-export declare type AlertType = 'success' | 'warning' | 'danger' | 'info';
-export interface Props {
-    /** Set Alert's style. */
-    type?: AlertType;
-    /** Set message for Alert. */
-    message: string;
-    /** A function to close Alert. onClose will be triggered if the close icon is clicked or the Alert has ran its autoClose duration or ESC/Enter is pressed */
-    onClose(): void;
-    /** Set Alert to show. */
-    isOpen?: boolean;
-    /** Set classname for Alert. */
-    className?: string;
-    /** Set period for Alert to close by itself. The value is in millisecond. */
-    autoClose?: number;
-}
-export default Alert;

package/es/General/Alert/Alert.js

@@ -1,101 +0,0 @@
-import * as React from 'react';
-import classNames from 'classnames';
-import isUndefined from 'lodash/isUndefined';
-import { CheckmarkSolidIcon, WarningCircleSolidIcon, InfoSolidIcon, CloseIcon } from '../Icon/components';
-import { AlertClose, AlertContainer, AlertIcon, AlertMessage } from './AlertStyle';
-import { Greyscale, PrimaryColor, SecondaryColor } from '../../Utils/Colors';
-import { DelayedUnmount } from '../../Utils/DelayedUnmount';
-export var Alert = function Alert(_ref) {
-  var externalIsVisible = _ref.isOpen,
-    autoClose = _ref.autoClose,
-    externalOnClose = _ref.onClose,
-    _ref$type = _ref.type,
-    type = _ref$type === void 0 ? 'info' : _ref$type,
-    className = _ref.className,
-    message = _ref.message;
-  var _React$useState = React.useState(true),
-    internalIsVisible = _React$useState[0],
-    setInternalIsVisible = _React$useState[1];
-  var isVisible = isUndefined(externalIsVisible) ? internalIsVisible : externalIsVisible;
-  var internalOnClose = function internalOnClose() {
-    return setInternalIsVisible(false);
-  };
-  var onClose = isUndefined(externalOnClose) ? internalOnClose : externalOnClose;
-  React.useEffect(function () {
-    if (isVisible && autoClose) {
-      var timeout = setTimeout(onClose, autoClose);
-      return function () {
-        return clearTimeout(timeout);
-      };
-    }
-  }, [isVisible, autoClose, onClose]);
-  var handleKeyDown = React.useCallback(function (onClose) {
-    var listener = function listener(e) {
-      if (e.keyCode === 13 || e.keyCode === 27) {
-        onClose();
-      }
-    };
-    return listener;
-  }, []);
-  var _React$useMemo = React.useMemo(function () {
-      switch (type) {
-        case 'success':
-          return {
-            AlertTypeIcon: CheckmarkSolidIcon,
-            alertColor: SecondaryColor.darkgreen
-          };
-        case 'warning':
-          return {
-            AlertTypeIcon: WarningCircleSolidIcon,
-            alertColor: SecondaryColor.orange
-          };
-        case 'danger':
-          return {
-            AlertTypeIcon: WarningCircleSolidIcon,
-            alertColor: PrimaryColor.glintsred
-          };
-        case 'info':
-        default:
-          return {
-            AlertTypeIcon: InfoSolidIcon,
-            alertColor: SecondaryColor.actionblue
-          };
-      }
-    }, [type]),
-    AlertTypeIcon = _React$useMemo.AlertTypeIcon,
-    alertColor = _React$useMemo.alertColor;
-  return (
-    /*#__PURE__*/
-    // The delay is set to 290ms because the fade-out animation takes 300ms.
-    // Setting them to the same value creates a visual glitch.
-    React.createElement(DelayedUnmount, {
-      mount: isVisible,
-      delay: 290
-    }, /*#__PURE__*/React.createElement(AlertContainer, {
-      className: classNames('aries-alert', className),
-      "data-type": type,
-      role: "alertdialog",
-      "aria-hidden": !isVisible,
-      "data-open": isVisible,
-      "aria-describedby": "alert-message",
-      tabIndex: 0,
-      onKeyDown: handleKeyDown(onClose),
-      ref: function ref(node) {
-        return node && node.focus();
-      }
-    }, /*#__PURE__*/React.createElement(AlertIcon, null, /*#__PURE__*/React.createElement(AlertTypeIcon, {
-      color: alertColor
-    })), /*#__PURE__*/React.createElement(AlertMessage, {
-      className: "alert-message"
-    }, message), /*#__PURE__*/React.createElement(AlertClose, {
-      className: "alert-close",
-      role: "button",
-      "aria-label": "Press Escape or Enter button to close alert",
-      title: "Close alert",
-      onClick: onClose
-    }, /*#__PURE__*/React.createElement(CloseIcon, {
-      color: Greyscale.devilsgrey
-    }))))
-  );
-};
-export default Alert;

package/es/General/Alert/Alert.stories.d.ts

@@ -1,4 +0,0 @@
-import { Meta } from '@storybook/react';
-declare const _default: Meta<import("@storybook/react").Args>;
-export default _default;
-export declare const Interactive: any;

package/es/General/Alert/Alert.test.d.ts

@@ -1 +0,0 @@
-import '@testing-library/jest-dom/extend-expect';

package/es/General/Alert/AlertStyle.d.ts

@@ -1,4 +0,0 @@
-export declare const AlertContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const AlertIcon: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const AlertMessage: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const AlertClose: import("styled-components").StyledComponent<"div", any, {}, never>;

package/es/General/Alert/AlertStyle.js

@@ -1,21 +0,0 @@
-import styled, { keyframes } from 'styled-components';
-import { ScreenSize } from '../../Utils/StyleConfig';
-import { Shadow } from '../../Utils/Shadow';
-var fadeDown = keyframes(["0%{transform:translateY(-100%);top:0;}100%{transform:translateY(0%);top:16px;}"]);
-var fadeUp = keyframes(["0%{transform:translateY(0%);top:12px;}100%{transform:translateY(-100%);top:0;}"]);
-export var AlertContainer = styled.div.withConfig({
-  displayName: "AlertStyle__AlertContainer",
-  componentId: "sc-fcjw72-0"
-})(["position:fixed;left:0;right:0;margin:0 auto;top:16px;animation:", " 0.3s ease-in-out;&[aria-hidden='true']{top:0;animation:", " 0.3s ease-in-out;}display:flex;align-items:center;box-shadow:", ";padding:12px;border-radius:4px;z-index:5000;min-width:296px;max-width:", "px;outline:none;line-height:1.5;font-size:14px;color:#454545;@media (max-width:", "px){max-width:95%;}background:#c5ecfa;&[data-type='success']{background:#c2e2da;}&[data-type='warning']{background:#fde9cc;}&[data-type='danger']{background:#facbcc;}"], fadeDown, fadeUp, Shadow.down4, ScreenSize.tablet, ScreenSize.tablet);
-export var AlertIcon = styled.div.withConfig({
-  displayName: "AlertStyle__AlertIcon",
-  componentId: "sc-fcjw72-1"
-})(["margin-right:8px;line-height:1;svg{display:block;}"]);
-export var AlertMessage = styled.div.withConfig({
-  displayName: "AlertStyle__AlertMessage",
-  componentId: "sc-fcjw72-2"
-})(["margin-right:8px;flex-grow:1;"]);
-export var AlertClose = styled.div.withConfig({
-  displayName: "AlertStyle__AlertClose",
-  componentId: "sc-fcjw72-3"
-})(["line-height:1;cursor:pointer;font-size:10px;"]);

package/es/General/Alert/index.d.ts

@@ -1,3 +0,0 @@
-import Alert from './Alert';
-export { Alert };
-export default Alert;

package/es/General/Alert/index.js

@@ -1,3 +0,0 @@
-import Alert from './Alert';
-export { Alert };
-export default Alert;

package/es/General/Badge/Badge.d.ts

@@ -1,11 +0,0 @@
-import * as React from 'react';
-import { BadgeContainer } from './BadgeStyle';
-export declare const Badge: React.FunctionComponent<Props>;
-export declare type BadgeType = 'dimmed' | 'default' | 'white' | 'blue';
-export declare type Props = React.ComponentPropsWithoutRef<typeof BadgeContainer> & {
-    /** Sets the label of Badge. */
-    label: string | number;
-    /** Sets the variant of the Badge. */
-    variant?: BadgeType;
-};
-export default Badge;

package/es/General/Badge/Badge.js

@@ -1,23 +0,0 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
-var _excluded = ["label", "variant", "className"];
-import * as React from 'react';
-import classNames from 'classnames';
-import { isNil } from 'lodash-es';
-import { BadgeContainer } from './BadgeStyle';
-import { BadgeVariant } from './BadgeVariant';
-export var Badge = function Badge(_ref) {
-  var label = _ref.label,
-    _ref$variant = _ref.variant,
-    variant = _ref$variant === void 0 ? BadgeVariant.DEFAULT : _ref$variant,
-    className = _ref.className,
-    defaultProps = _objectWithoutPropertiesLoose(_ref, _excluded);
-  return /*#__PURE__*/React.createElement(React.Fragment, null, !isNil(label) && /*#__PURE__*/React.createElement(BadgeContainer, _extends({
-    className: classNames('aries-badge', className),
-    role: "presentation",
-    variant: variant
-  }, defaultProps), /*#__PURE__*/React.createElement("span", {
-    className: "badge-content"
-  }, label)));
-};
-export default Badge;

package/es/General/Badge/Badge.stories.d.ts

@@ -1,6 +0,0 @@
-import { Story, Meta } from '@storybook/react';
-import { Props } from './Badge';
-declare const _default: Meta<import("@storybook/react").Args>;
-export default _default;
-export declare const Interactive: any;
-export declare const Variants: Story<Props>;

package/es/General/Badge/Badge.test.d.ts

@@ -1,2 +0,0 @@
-import 'jest-styled-components';
-import '@testing-library/jest-dom/extend-expect';

package/es/General/Badge/BadgeStyle.d.ts

@@ -1,5 +0,0 @@
-export declare const BadgeContainer: import("styled-components").StyledComponent<"div", any, BadgeContainerProps, never>;
-interface BadgeContainerProps {
-    variant?: string;
-}
-export {};