@dnanpm/styleguide 3.9.0 → 3.9.1

package/build/cjs/components/DateTimePicker/DateTimePicker.js

@@ -12,6 +12,12 @@ var styledUtils = require('../../utils/styledUtils.js');
 var ButtonIcon = require('../ButtonIcon/ButtonIcon.js');
 var Input = require('../Input/Input.js');
 
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var ReactDatePicker__default = /*#__PURE__*/_interopDefaultCompat(ReactDatePicker);
+var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
+
 /**
  * Customized local copy of date-fns/locale/fi object to avoid importing unnecessary libraries
  * Contains only used and functionality wise necessary properties
@@ -52,7 +58,7 @@ const localeData = {
 };
 const sentenceCase = (string) => `${string[0].toUpperCase()}${string.slice(1)}`;
 // TODO: change `& .react-datepicker` value back to `1` after z-index of Footer removed
-const Wrapper = styled.div `
+const Wrapper = styled__default.default.div `
     position: relative;
 
     & .react-datepicker {
@@ -215,7 +221,7 @@ const Wrapper = styled.div `
         }
     }
 `;
-const MonthSelector = styled.div `
+const MonthSelector = styled__default.default.div `
     display: flex;
     align-items: center;
     justify-content: space-between;
@@ -224,18 +230,18 @@ const MonthSelector = styled.div `
         fill: ${theme.default.color.text.gray};
     }
 `;
-const CurrentMonth = styled.div `
+const CurrentMonth = styled__default.default.div `
     font-size: ${theme.default.fontSize.default};
     line-height: ${theme.default.lineHeight.default};
     font-weight: ${theme.default.fontWeight.bold};
 `;
-const DateTimePickerCustomHeader = ({ date, decreaseMonth, increaseMonth, locale, }) => (React.createElement(MonthSelector, null,
-    React.createElement(ButtonIcon.default, { icon: icons.ChevronLeft, onClick: decreaseMonth }),
-    React.createElement(CurrentMonth, null, sentenceCase(date.toLocaleString(locale, {
+const DateTimePickerCustomHeader = ({ date, decreaseMonth, increaseMonth, locale, }) => (React__default.default.createElement(MonthSelector, null,
+    React__default.default.createElement(ButtonIcon.default, { icon: icons.ChevronLeft, onClick: decreaseMonth }),
+    React__default.default.createElement(CurrentMonth, null, sentenceCase(date.toLocaleString(locale, {
         month: 'long',
         year: 'numeric',
     }))),
-    React.createElement(ButtonIcon.default, { icon: icons.ChevronRight, onClick: increaseMonth })));
+    React__default.default.createElement(ButtonIcon.default, { icon: icons.ChevronRight, onClick: increaseMonth })));
 /** @visibleName DateTime Picker */
 const DateTimePicker = (_a) => {
     var _b;
@@ -275,9 +281,9 @@ const DateTimePicker = (_a) => {
     }))))
         .join(' - ');
     const getDateTimePickerCustomHeader = (args) => DateTimePickerCustomHeader(Object.assign(Object.assign({}, args), { locale }));
-    return (React.createElement(Wrapper, { id: props.id, className: props.className, "data-testid": dataTestId },
-        React.createElement(Input.default, { id: `datetimepicker-input-${props.id}`, name: `datetimepicker-input-${props.id}`, label: props.label, placeholder: props.placeholder, value: formatInputValue, onFocus: handleOnInputFocus, onChange: handleOnInputChange, onKeyDown: handleOnKeyDown, onClearableButtonClick: props.isClearable ? handleClearable : undefined, className: "react-datepicker-ignore-onclickoutside", "data-testid": dataTestId && `${dataTestId}-datetimepicker-input`, disabled: props.isDisabled, required: props.isRequired, readonly: !props.isEditable, status: props.isInError ? 'error' : undefined, errorMessage: props.errorMessage }),
-        showReactDatePicker && (React.createElement(ReactDatePicker, { inline: true, selected: startDate, startDate: startDate, maxDate: props.maxDate, minDate: props.minDate, endDate: props.endDate, onChange: handleOnReactDatePickerChange, selectsRange: props.endDate !== undefined, showTimeSelect: props.endDate === undefined && isTimePicker, showTimeSelectOnly: props.endDate === undefined && !isDatePicker && isTimePicker, timeCaption: (_b = localeData[locale]) === null || _b === void 0 ? void 0 : _b.localize.timeCaption, timeIntervals: timeInterval, onClickOutside: handleOnReactDatePickerClickOutside, locale: localeData[locale], 
+    return (React__default.default.createElement(Wrapper, { id: props.id, className: props.className, "data-testid": dataTestId },
+        React__default.default.createElement(Input.default, { id: `datetimepicker-input-${props.id}`, name: `datetimepicker-input-${props.id}`, label: props.label, placeholder: props.placeholder, value: formatInputValue, onFocus: handleOnInputFocus, onChange: handleOnInputChange, onKeyDown: handleOnKeyDown, onClearableButtonClick: props.isClearable ? handleClearable : undefined, className: "react-datepicker-ignore-onclickoutside", "data-testid": dataTestId && `${dataTestId}-datetimepicker-input`, disabled: props.isDisabled, required: props.isRequired, readonly: !props.isEditable, status: props.isInError ? 'error' : undefined, errorMessage: props.errorMessage }),
+        showReactDatePicker && (React__default.default.createElement(ReactDatePicker__default.default, { inline: true, selected: startDate, startDate: startDate, maxDate: props.maxDate, minDate: props.minDate, endDate: props.endDate, onChange: handleOnReactDatePickerChange, selectsRange: props.endDate !== undefined, showTimeSelect: props.endDate === undefined && isTimePicker, showTimeSelectOnly: props.endDate === undefined && !isDatePicker && isTimePicker, timeCaption: (_b = localeData[locale]) === null || _b === void 0 ? void 0 : _b.localize.timeCaption, timeIntervals: timeInterval, onClickOutside: handleOnReactDatePickerClickOutside, locale: localeData[locale], 
             // Used to format the date/time in internal ReactDatePicker input
             // Currently ignored as date/time is shown in Styleguide Input instead, and formatted by using Intl.DateTimeFormat
             dateFormat: [isDatePicker && 'P', isTimePicker && 'p'].filter(Boolean).join(''), renderCustomHeader: getDateTimePickerCustomHeader }))));

package/build/cjs/components/Divider/Divider.js

@@ -8,7 +8,12 @@ var styled = require('styled-components');
 var theme = require('../../themes/theme.js');
 var styledUtils = require('../../utils/styledUtils.js');
 
-const DividerWrapper = styled.div `
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
+
+const DividerWrapper = styled__default.default.div `
     display: flex;
     justify-content: center;
     align-items: center;
@@ -21,7 +26,7 @@ const DividerWrapper = styled.div `
 `;
 const Divider = (_a) => {
     var { 'data-testid': dataTestId } = _a, props = tslib.__rest(_a, ['data-testid']);
-    return (React.createElement(DividerWrapper, { id: props.id, margin: props.margin, padding: props.padding, className: props.className, "data-testid": dataTestId }, props.children));
+    return (React__default.default.createElement(DividerWrapper, { id: props.id, margin: props.margin, padding: props.padding, className: props.className, "data-testid": dataTestId }, props.children));
 };
 
 exports.default = Divider;

package/build/cjs/components/DnaLogo/DnaLogo.js

@@ -6,6 +6,10 @@ var tslib = require('tslib');
 var React = require('react');
 var styled = require('../../themes/styled.js');
 
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
 const colorVariationsMap = {
     default: {
         background: '#FF007D',
@@ -38,20 +42,20 @@ const Container = styled.default.span `
 `;
 const Emblem = ({ type }) => {
     const currentVariation = colorVariationsMap[type];
-    return (React.createElement("svg", { viewBox: "0 0 666.7 666.7" },
-        React.createElement("g", null,
-            React.createElement("path", { fill: currentVariation.background, d: "M0,0v666.7h666.7V0H0z" }),
-            React.createElement("path", { fill: currentVariation.text, d: "M403,451h-41.9V285.5c0-15.7-12.7-28.4-28.4-28.4h-29.4V451h-41.9V215.2h71.3c38.8,0,70.3,31.5,70.3,70.3V451z\n                " }),
-            React.createElement("path", { fill: currentVariation.text, d: "M226.4,286.2c0-39.2-31.8-71-71-71H84.9V451h70.6c39.2,0,71-31.8,71-71L226.4,286.2z M184.5,380.7\n                c0,15.7-12.8,28.5-28.5,28.5h-29.3v-152H156c15.7,0,28.5,12.8,28.5,28.5V380.7z" }),
-            React.createElement("path", { fill: currentVariation.text, d: "M511.5,213.6h-1c-38.8,0-70.3,31.5-70.3,70.3V451h41.9v-84.4h57.8V451h41.9V283.9\n                C581.8,245.2,550.3,213.6,511.5,213.6z M539.9,327.2h-57.8v-43.3c0-15.7,12.7-28.4,28.4-28.4h1c15.7,0,28.4,12.7,28.4,28.4V327.2z" }))));
+    return (React__default.default.createElement("svg", { viewBox: "0 0 666.7 666.7" },
+        React__default.default.createElement("g", null,
+            React__default.default.createElement("path", { fill: currentVariation.background, d: "M0,0v666.7h666.7V0H0z" }),
+            React__default.default.createElement("path", { fill: currentVariation.text, d: "M403,451h-41.9V285.5c0-15.7-12.7-28.4-28.4-28.4h-29.4V451h-41.9V215.2h71.3c38.8,0,70.3,31.5,70.3,70.3V451z\n                " }),
+            React__default.default.createElement("path", { fill: currentVariation.text, d: "M226.4,286.2c0-39.2-31.8-71-71-71H84.9V451h70.6c39.2,0,71-31.8,71-71L226.4,286.2z M184.5,380.7\n                c0,15.7-12.8,28.5-28.5,28.5h-29.3v-152H156c15.7,0,28.5,12.8,28.5,28.5V380.7z" }),
+            React__default.default.createElement("path", { fill: currentVariation.text, d: "M511.5,213.6h-1c-38.8,0-70.3,31.5-70.3,70.3V451h41.9v-84.4h57.8V451h41.9V283.9\n                C581.8,245.2,550.3,213.6,511.5,213.6z M539.9,327.2h-57.8v-43.3c0-15.7,12.7-28.4,28.4-28.4h1c15.7,0,28.4,12.7,28.4,28.4V327.2z" }))));
 };
 const Logotype = ({ type }) => {
     const currentVariation = colorVariationsMap[type];
-    return (React.createElement("svg", { viewBox: "0 0 600 286.6" },
-        React.createElement("g", null,
-            React.createElement("path", { fill: currentVariation.text, d: "M299.3,3.3h-85.2v281.8h50.1V53.4h35.1c18.8,0,34,15.2,34,34v197.8h50.1V87.3C383.3,41,345.6,3.3,299.3,3.3z" }),
-            React.createElement("path", { fill: currentVariation.text, d: "M87.4,3.3H3v281.9h84.4c46.8,0,84.8-38,84.8-84.8l0-112.2C172.2,41.3,134.2,3.3,87.4,3.3z M122.1,201.1\n                    c0,18.8-15.3,34.1-34.1,34.1h-35V53.4h35c18.8,0,34.1,15.3,34.1,34.1L122.1,201.1z" }),
-            React.createElement("path", { fill: currentVariation.text, d: "M513,1.4h-1.2c-46.3,0-84,37.7-84,84v199.8h50.1V183.4l69.1,0v101.8H597V85.4C597,39.1,559.3,1.4,513,1.4z\n                    M546.9,137.2h-69.1V85.4c0-18.7,15.2-34,34-34h1.2c18.7,0,34,15.2,34,34V137.2z" }))));
+    return (React__default.default.createElement("svg", { viewBox: "0 0 600 286.6" },
+        React__default.default.createElement("g", null,
+            React__default.default.createElement("path", { fill: currentVariation.text, d: "M299.3,3.3h-85.2v281.8h50.1V53.4h35.1c18.8,0,34,15.2,34,34v197.8h50.1V87.3C383.3,41,345.6,3.3,299.3,3.3z" }),
+            React__default.default.createElement("path", { fill: currentVariation.text, d: "M87.4,3.3H3v281.9h84.4c46.8,0,84.8-38,84.8-84.8l0-112.2C172.2,41.3,134.2,3.3,87.4,3.3z M122.1,201.1\n                    c0,18.8-15.3,34.1-34.1,34.1h-35V53.4h35c18.8,0,34.1,15.3,34.1,34.1L122.1,201.1z" }),
+            React__default.default.createElement("path", { fill: currentVariation.text, d: "M513,1.4h-1.2c-46.3,0-84,37.7-84,84v199.8h50.1V183.4l69.1,0v101.8H597V85.4C597,39.1,559.3,1.4,513,1.4z\n                    M546.9,137.2h-69.1V85.4c0-18.7,15.2-34,34-34h1.2c18.7,0,34,15.2,34,34V137.2z" }))));
 };
 /** @visibleName DNA Logo */
 const DnaLogo = (_a) => {
@@ -61,7 +65,7 @@ const DnaLogo = (_a) => {
         const matches = /(\d+)(.+)/.exec(size);
         margin = matches && `${Number(matches[1]) * 0.25}${matches[2]}`;
     }
-    return (React.createElement(Container, { size: size, margin: margin, className: props.className, onClick: props.onClick }, type.indexOf('logotype') === -1 ? React.createElement(Emblem, { type: type }) : React.createElement(Logotype, { type: type })));
+    return (React__default.default.createElement(Container, { size: size, margin: margin, className: props.className, onClick: props.onClick }, type.indexOf('logotype') === -1 ? React__default.default.createElement(Emblem, { type: type }) : React__default.default.createElement(Logotype, { type: type })));
 };
 
 exports.default = DnaLogo;

package/build/cjs/components/Drawer/Drawer.js

@@ -15,6 +15,11 @@ var ButtonClose = require('../ButtonClose/ButtonClose.js');
 var Floater = require('../Floater/Floater.js');
 var Icon = require('../Icon/Icon.js');
 
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var ReactModal__default = /*#__PURE__*/_interopDefaultCompat(ReactModal);
+
 const sizeMap = {
     small: '375px',
     medium: '768px',
@@ -43,7 +48,7 @@ const slideIn = styled.keyframes `
         transform: translateX(0%);
     }
 `;
-const StyledReactModal = styled.default(ReactModal) `
+const StyledReactModal = styled.default(ReactModal__default.default) `
     position: fixed;
     top: 0;
     ${({ side }) => (side === 'left' ? 'left: 0' : 'right: 0')};
@@ -161,29 +166,29 @@ const Footer = styled.default.div `
 
     ${common.default({ elevation: 'high', shadow: '1 0 0 0' })};
 `;
-const ModalOverlay = ({ ref, onClick, onMouseDown, className }, contentElement) => (React.createElement(StyledReactModalOverlay, { ref: ref, onClick: onClick, onMouseDown: onMouseDown, className: className }, contentElement));
+const ModalOverlay = ({ ref, onClick, onMouseDown, className }, contentElement) => (React__default.default.createElement(StyledReactModalOverlay, { ref: ref, onClick: onClick, onMouseDown: onMouseDown, className: className }, contentElement));
 const ModalContent = (_a, children) => {
     var { id, ref, tabIndex, role, onKeyDown, onMouseDown, onMouseUp, onClick, className } = _a, contentProps = tslib.__rest(_a, ["id", "ref", "tabIndex", "role", "onKeyDown", "onMouseDown", "onMouseUp", "onClick", "className"]);
-    return (React.createElement(StyledReactModalContent, { id: id, ref: ref, tabIndex: tabIndex, role: role, onKeyDown: onKeyDown, onMouseDown: onMouseDown, onMouseUp: onMouseUp, onClick: onClick, "aria-label": contentProps['aria-label'], "aria-modal": contentProps['aria-modal'], className: className }, children));
+    return (React__default.default.createElement(StyledReactModalContent, { id: id, ref: ref, tabIndex: tabIndex, role: role, onKeyDown: onKeyDown, onMouseDown: onMouseDown, onMouseUp: onMouseUp, onClick: onClick, "aria-label": contentProps['aria-label'], "aria-modal": contentProps['aria-modal'], className: className }, children));
 };
 const Drawer = (_a) => {
     var { appElement = '#__next', size = 'medium', side = 'right', variant = 'light', padding = '1.25rem', closeButton = true, isClosable = true, 'data-testid': dataTestId } = _a, props = tslib.__rest(_a, ["appElement", "size", "side", "variant", "padding", "closeButton", "isClosable", 'data-testid']);
-    ReactModal.setAppElement(appElement);
-    return (React.createElement(React.Fragment, null,
-        React.createElement(StyledReactModal, { id: props.id, isOpen: props.isOpen, overlayElement: ModalOverlay, contentElement: ModalContent, onRequestClose: props.onRequestClose, portalClassName: props.className, contentLabel: props.contentLabel, shouldCloseOnEsc: isClosable, shouldCloseOnOverlayClick: isClosable, closeTimeoutMS: 300, size: size, side: side },
-            React.createElement(StyledBox, { elevation: "extraHigh", margin: props.margin, "data-testid": dataTestId },
-                React.createElement("div", null,
-                    React.createElement(Floater.default, null, closeButton && isClosable && (React.createElement(CloseButton, { onClick: props.onRequestClose, "aria-label": props.closeLabel, "data-testid": dataTestId && `${dataTestId}-close-button`, variant: variant },
-                        React.createElement(Icon.default, { icon: icons.Close, color: variant === 'light'
+    ReactModal__default.default.setAppElement(appElement);
+    return (React__default.default.createElement(React__default.default.Fragment, null,
+        React__default.default.createElement(StyledReactModal, { id: props.id, isOpen: props.isOpen, overlayElement: ModalOverlay, contentElement: ModalContent, onRequestClose: props.onRequestClose, portalClassName: props.className, contentLabel: props.contentLabel, shouldCloseOnEsc: isClosable, shouldCloseOnOverlayClick: isClosable, closeTimeoutMS: 300, size: size, side: side },
+            React__default.default.createElement(StyledBox, { elevation: "extraHigh", margin: props.margin, "data-testid": dataTestId },
+                React__default.default.createElement("div", null,
+                    React__default.default.createElement(Floater.default, null, closeButton && isClosable && (React__default.default.createElement(CloseButton, { onClick: props.onRequestClose, "aria-label": props.closeLabel, "data-testid": dataTestId && `${dataTestId}-close-button`, variant: variant },
+                        React__default.default.createElement(Icon.default, { icon: icons.Close, color: variant === 'light'
                                 ? theme.default.color.default.plum
                                 : theme.default.color.default.white })))),
-                    React.createElement(Header, { variant: variant, "data-testid": dataTestId && `${dataTestId}-header` },
-                        React.createElement(Title, { size: size, variant: variant }, props.title),
-                        props.subtitle && (React.createElement(Subtitle, { size: size, variant: variant }, props.subtitle))),
-                    React.createElement(Content, { "data-testid": dataTestId && `${dataTestId}-content`, padding: padding }, props.children)),
-                props.footer && (React.createElement(Floater.default, { position: "bottom" },
-                    React.createElement(Footer, { "data-testid": dataTestId && `${dataTestId}-footer` }, props.footer))))),
-        React.createElement(GlobalStyle, null)));
+                    React__default.default.createElement(Header, { variant: variant, "data-testid": dataTestId && `${dataTestId}-header` },
+                        React__default.default.createElement(Title, { size: size, variant: variant }, props.title),
+                        props.subtitle && (React__default.default.createElement(Subtitle, { size: size, variant: variant }, props.subtitle))),
+                    React__default.default.createElement(Content, { "data-testid": dataTestId && `${dataTestId}-content`, padding: padding }, props.children)),
+                props.footer && (React__default.default.createElement(Floater.default, { position: "bottom" },
+                    React__default.default.createElement(Footer, { "data-testid": dataTestId && `${dataTestId}-footer` }, props.footer))))),
+        React__default.default.createElement(GlobalStyle, null)));
 };
 
 exports.default = Drawer;

package/build/cjs/components/EmptyState/EmptyState.js

@@ -11,6 +11,10 @@ var styledUtils = require('../../utils/styledUtils.js');
 var Box = require('../Box/Box.js');
 var Icon = require('../Icon/Icon.js');
 
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
 const ContentWrapper = styled.default.div `
     display: grid;
     grid-gap: ${styledUtils.getMultipliedSize(theme.default.base.baseWidth, 2)};
@@ -20,10 +24,10 @@ const ContentWrapper = styled.default.div `
 /** @visibleName Empty State */
 const EmptyState = (_a) => {
     var { icon = icons.Info, iconSize = '2rem', 'data-testid': dataTestId } = _a, props = tslib.__rest(_a, ["icon", "iconSize", 'data-testid']);
-    return (React.createElement(Box.default, { id: props.id, padding: "1.875rem", className: props.className, "data-testid": dataTestId },
-        React.createElement(ContentWrapper, null,
-            React.createElement(Icon.default, { icon: icon, size: iconSize, color: theme.default.color.default.pink }),
-            React.createElement("div", null, props.children))));
+    return (React__default.default.createElement(Box.default, { id: props.id, padding: "1.875rem", className: props.className, "data-testid": dataTestId },
+        React__default.default.createElement(ContentWrapper, null,
+            React__default.default.createElement(Icon.default, { icon: icon, size: iconSize, color: theme.default.color.default.pink }),
+            React__default.default.createElement("div", null, props.children))));
 };
 
 exports.default = EmptyState;

package/build/cjs/components/Expander/Expander.js

@@ -9,6 +9,10 @@ var styled = require('../../themes/styled.js');
 var theme = require('../../themes/theme.js');
 var ButtonIcon = require('../ButtonIcon/ButtonIcon.js');
 
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
 const Container = styled.default.div `
     display: flex;
     flex-direction: column;
@@ -36,11 +40,11 @@ const Content = styled.default.div `
 `;
 const Expander = (_a) => {
     var { 'data-testid': dataTestId } = _a, props = tslib.__rest(_a, ['data-testid']);
-    return (React.createElement(Container, { id: props.id, className: props.className, "data-testid": dataTestId },
-        React.createElement(StyledButtonIcon, { icon: props.isExpanded ? icons.ChevronUp : icons.ChevronDown, onClick: props.onClick, isReversed: true }, props.buttonLabel),
-        props.isExpanded && (React.createElement(ContentWrapper, null,
-            React.createElement(Content, { "data-testid": dataTestId && `${dataTestId}-content` }, props.children),
-            props.closeButtonLabel && (React.createElement(StyledButtonIcon, { icon: icons.Close, onClick: props.onClick, "data-testid": dataTestId && `${dataTestId}-close-button` }, props.closeButtonLabel))))));
+    return (React__default.default.createElement(Container, { id: props.id, className: props.className, "data-testid": dataTestId },
+        React__default.default.createElement(StyledButtonIcon, { icon: props.isExpanded ? icons.ChevronUp : icons.ChevronDown, onClick: props.onClick, isReversed: true }, props.buttonLabel),
+        props.isExpanded && (React__default.default.createElement(ContentWrapper, null,
+            React__default.default.createElement(Content, { "data-testid": dataTestId && `${dataTestId}-content` }, props.children),
+            props.closeButtonLabel && (React__default.default.createElement(StyledButtonIcon, { icon: icons.Close, onClick: props.onClick, "data-testid": dataTestId && `${dataTestId}-close-button` }, props.closeButtonLabel))))));
 };
 
 exports.default = Expander;

package/build/cjs/components/Floater/Floater.js

@@ -6,6 +6,11 @@ var tslib = require('tslib');
 var React = require('react');
 var styled = require('styled-components');
 
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
+
 const getInset = ({ position, offset }) => {
     const insetConfig = {
         top: [offset, 'auto', 'auto'],
@@ -13,14 +18,14 @@ const getInset = ({ position, offset }) => {
     };
     return `inset: ${insetConfig[position].join(' ')};`;
 };
-const Element = styled.div `
+const Element = styled__default.default.div `
     position: sticky;
     ${({ zIndex }) => zIndex && `z-index: ${zIndex}`};
     ${({ position, offset }) => getInset({ position, offset })}
 `;
 const Floater = (_a) => {
     var { position = 'top', offset = '0', 'data-testid': dataTestId } = _a, props = tslib.__rest(_a, ["position", "offset", 'data-testid']);
-    return (React.createElement(Element, { id: props.id, position: position, offset: offset, zIndex: props.zIndex, className: props.className, "data-testid": dataTestId }, props.children));
+    return (React__default.default.createElement(Element, { id: props.id, position: position, offset: offset, zIndex: props.zIndex, className: props.className, "data-testid": dataTestId }, props.children));
 };
 
 exports.default = Floater;

package/build/cjs/components/Footer/Components/FooterComponents.js

@@ -9,6 +9,10 @@ var ButtonIcon = require('../../ButtonIcon/ButtonIcon.js');
 var Icon = require('../../Icon/Icon.js');
 var FooterContext = require('../context/FooterContext.js');
 
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
 /* eslint-disable react/no-array-index-key */
 const LinksListEl = styled.default.li `
     a {
@@ -174,13 +178,13 @@ const mapCorporateSelector = (languagesObject) => Object.keys(languagesObject.ur
 }));
 const TopSection = ({ topSection }) => {
     const { collapseSize, language } = React.useContext(FooterContext.default);
-    return (React.createElement(BasicContainer, { collapseSize: collapseSize }, topSection === null || topSection === void 0 ? void 0 : topSection.map((section, index) => (React.createElement("div", { key: `service-section-${index}`, "data-testid": `service-section-${index}` },
-        section.svgIconName[language] === 'user' && React.createElement(Icon.default, { icon: icons.User, size: "3rem" }),
-        section.svgIconName[language] === 'headset' && (React.createElement(Icon.default, { icon: icons.Headset, size: "3rem" })),
-        section.svgIconName[language] === 'shop' && React.createElement(Icon.default, { icon: icons.Shop, size: "3rem" }),
-        React.createElement("h4", null, section.title[language]),
-        React.createElement("ul", null, section.linkItems.map((item, i) => (React.createElement(LinksListEl, { key: `category-link-${i}`, "data-testid": `category-link-${i}` }, item.openChat[language] ? (React.createElement(ButtonIcon.default, { darkBg: true, icon: icons.ArrowRight, className: "js-dna-chatbot-cta-btn" }, item.linkText[language])) : (React.createElement("a", { href: item.linkURL[language] },
-            React.createElement(Icon.default, { icon: icons.ArrowRight }),
+    return (React__default.default.createElement(BasicContainer, { collapseSize: collapseSize }, topSection === null || topSection === void 0 ? void 0 : topSection.map((section, index) => (React__default.default.createElement("div", { key: `service-section-${index}`, "data-testid": `service-section-${index}` },
+        section.svgIconName[language] === 'user' && React__default.default.createElement(Icon.default, { icon: icons.User, size: "3rem" }),
+        section.svgIconName[language] === 'headset' && (React__default.default.createElement(Icon.default, { icon: icons.Headset, size: "3rem" })),
+        section.svgIconName[language] === 'shop' && React__default.default.createElement(Icon.default, { icon: icons.Shop, size: "3rem" }),
+        React__default.default.createElement("h4", null, section.title[language]),
+        React__default.default.createElement("ul", null, section.linkItems.map((item, i) => (React__default.default.createElement(LinksListEl, { key: `category-link-${i}`, "data-testid": `category-link-${i}` }, item.openChat[language] ? (React__default.default.createElement(ButtonIcon.default, { darkBg: true, icon: icons.ArrowRight, className: "js-dna-chatbot-cta-btn" }, item.linkText[language])) : (React__default.default.createElement("a", { href: item.linkURL[language] },
+            React__default.default.createElement(Icon.default, { icon: icons.ArrowRight }),
             item.linkText[language])))))))))));
 };
 const Categories = ({ categories }) => {
@@ -190,12 +194,12 @@ const Categories = ({ categories }) => {
             setIsCollapsed(Object.assign(Object.assign({}, isCollapsed), { [currentIndex]: !isCollapsed[currentIndex] }));
         }
     };
-    return (React.createElement(CategoryContainer, { collapseSize: collapseSize, "data-testid": "category-container" }, categories === null || categories === void 0 ? void 0 : categories.map((category, index) => (React.createElement(CategoryWrapper, { active: isCollapsed[index], collapseSize: collapseSize, "data-testid": `category-${index}`, key: `category-${index}` },
-        React.createElement(CategoryHeader, { onClick: () => toggleCollapse(index) },
+    return (React__default.default.createElement(CategoryContainer, { collapseSize: collapseSize, "data-testid": "category-container" }, categories === null || categories === void 0 ? void 0 : categories.map((category, index) => (React__default.default.createElement(CategoryWrapper, { active: isCollapsed[index], collapseSize: collapseSize, "data-testid": `category-${index}`, key: `category-${index}` },
+        React__default.default.createElement(CategoryHeader, { onClick: () => toggleCollapse(index) },
             category.description[language],
-            React.createElement(Icon.default, { icon: icons.ChevronDown })),
-        React.createElement(CategoryLinks, { active: isMobileFooter ? isCollapsed[index] : true, collapseSize: collapseSize }, category.category.map((categoryLink, linkIndex) => (React.createElement(LinksListEl, { key: `category-${index}-link-${linkIndex}`, "data-testid": `category-${index}-link-${linkIndex}` },
-            React.createElement("a", { href: categoryLink.urls[language] }, categoryLink.titles[language]))))))))));
+            React__default.default.createElement(Icon.default, { icon: icons.ChevronDown })),
+        React__default.default.createElement(CategoryLinks, { active: isMobileFooter ? isCollapsed[index] : true, collapseSize: collapseSize }, category.category.map((categoryLink, linkIndex) => (React__default.default.createElement(LinksListEl, { key: `category-${index}-link-${linkIndex}`, "data-testid": `category-${index}-link-${linkIndex}` },
+            React__default.default.createElement("a", { href: categoryLink.urls[language] }, categoryLink.titles[language]))))))))));
 };
 const GeneralInformation = ({ generalInformation }) => {
     const { language } = React.useContext(FooterContext.default);
@@ -208,14 +212,14 @@ const GeneralInformation = ({ generalInformation }) => {
         cookie: 'ot-sdk-show-settings',
     };
     const orderedGeneralInformation = orderMap.map(id => new Map(Object.entries(generalInformation)).get(id));
-    return (React.createElement(GeneralInformationContainer, { "data-testid": "general-information-section" },
-        orderedGeneralInformation.map((item, index) => item && (React.createElement(GeneralInformationLink, { href: (item.urls && item.urls[language]) || '#!', className: item.type && typeToClassMap[item.type], key: `general-information-link-${index}` }, item.titles[language]))),
+    return (React__default.default.createElement(GeneralInformationContainer, { "data-testid": "general-information-section" },
+        orderedGeneralInformation.map((item, index) => item && (React__default.default.createElement(GeneralInformationLink, { href: (item.urls && item.urls[language]) || '#!', className: item.type && typeToClassMap[item.type], key: `general-information-link-${index}` }, item.titles[language]))),
         "DNA ",
         currentYear));
 };
 const SocialMediaLinks = ({ socialMedia }) => {
     const { language } = React.useContext(FooterContext.default);
-    return (React.createElement(SocialMediaLinksContainer, { "data-testid": "social-media-section" }, socialMedia &&
+    return (React__default.default.createElement(SocialMediaLinksContainer, { "data-testid": "social-media-section" }, socialMedia &&
         Object.keys(socialMedia || {}).map(socialMediaKey => {
             if (socialMediaKey === '__typename') {
                 return null;
@@ -224,8 +228,8 @@ const SocialMediaLinks = ({ socialMedia }) => {
                 socialMediaKey.toLowerCase().slice(1);
             const currentObject = socialMedia[socialMediaKey];
             const currentMediaUrl = currentObject === null || currentObject === void 0 ? void 0 : currentObject.urls[language];
-            return (React.createElement("a", { href: currentMediaUrl, key: `social-media-link-${socialMediaKey}`, "aria-label": socialMediaName },
-                React.createElement(Icon.default, { icon: socialMediaIcons[socialMediaKey.toLowerCase()] })));
+            return (React__default.default.createElement("a", { href: currentMediaUrl, key: `social-media-link-${socialMediaKey}`, "aria-label": socialMediaName },
+                React__default.default.createElement(Icon.default, { icon: socialMediaIcons[socialMediaKey.toLowerCase()] })));
         })));
 };
 

package/build/cjs/components/Footer/Footer.js

@@ -12,6 +12,10 @@ var FooterComponents = require('./Components/FooterComponents.js');
 var FooterContext = require('./context/FooterContext.js');
 var BusinessMenu = require('../MainHeaderNavigation/ChildComponents/BusinessMenu.js');
 
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
 const TopContainer = styled.default.div `
     background-color: ${theme.default.color.background.plum.E01};
     ul {
@@ -191,7 +195,7 @@ const initialCollapse = {
     1: false,
     2: false,
 };
-const LanguageLinks = ({ languages }) => (React.createElement(LangLinksContainer, { "data-testid": "language-selector-section" }, languages.map(language => (React.createElement(LangLink, { href: language.url, 
+const LanguageLinks = ({ languages }) => (React__default.default.createElement(LangLinksContainer, { "data-testid": "language-selector-section" }, languages.map(language => (React__default.default.createElement(LangLink, { href: language.url, 
     // not currently in use
     // isActive={currentLanguage === language.title.toLowerCase()}
     key: language.title }, language.title)))));
@@ -235,26 +239,26 @@ const Footer = ({ items = { businessId: 'NONE', footerNavigation: {} }, language
         setIsCollapsed,
         isMobileFooter: isMobile,
     }), [collapseSize, isCollapsed, isMobile, language]);
-    return (React.createElement(FooterContainer, { zIndex: zIndex, collapseSize: collapseSize },
-        React.createElement(FooterContext.default.Provider, { value: footerContextData },
-            Boolean(topSection.length) && (React.createElement(TopContainer, null,
-                React.createElement(FooterWrapper, null,
-                    React.createElement(FooterComponents.TopSection, { topSection: topSection })))),
-            React.createElement(FooterWrapper, null,
-                Boolean(categories.length) && React.createElement(FooterComponents.Categories, { categories: categories }),
-                React.createElement(BottomContainer, { collapseSize: collapseSize, "data-testid": "bottom-section" },
-                    Boolean(languages.length) && (React.createElement(LanguageLinks, { currentLanguage: language, languages: languages })),
-                    React.createElement(BottomCenter, null,
-                        socialMedia && React.createElement(FooterComponents.SocialMediaLinks, { socialMedia: socialMedia }),
-                        React.createElement(BusinessMenu.default, { items: (_b = (_a = items === null || items === void 0 ? void 0 : items.footerNavigation) === null || _a === void 0 ? void 0 : _a.businessSelector) === null || _b === void 0 ? void 0 : _b.items, currentBusinessId: items.businessId, lang: language }),
-                        generalInformation && (React.createElement(FooterComponents.GeneralInformation, { generalInformation: generalInformation }))),
-                    applicationLinks && (React.createElement(AppSection, null,
-                        React.createElement("p", null, applicationLinks === null || applicationLinks === void 0 ? void 0 : applicationLinks.title[language]),
-                        React.createElement(AppList, null,
-                            Boolean((_c = applicationLinks === null || applicationLinks === void 0 ? void 0 : applicationLinks.appStoreURL[language]) === null || _c === void 0 ? void 0 : _c.length) && (React.createElement("a", { "aria-label": appStoreLabel[language], href: applicationLinks.appStoreURL[language], target: "_blank", rel: "noreferrer" },
-                                React.createElement("img", { src: "https://res.cloudinary.com/dnaoyj/image/upload/dpr_2,f_auto,q_auto,w_142/v1/Assets/Icons%20and%20logos/Other%20icons/App_Store_Badge.png", alt: "" }))),
-                            Boolean((_d = applicationLinks === null || applicationLinks === void 0 ? void 0 : applicationLinks.googlePlayURL[language]) === null || _d === void 0 ? void 0 : _d.length) && (React.createElement("a", { "aria-label": googlePlayLabel[language], href: applicationLinks.googlePlayURL[language], target: "_blank", rel: "noreferrer" },
-                                React.createElement("img", { src: "https://res.cloudinary.com/dnaoyj/image/upload/dpr_2,f_auto,q_auto,w_142/v1/Assets/Icons%20and%20logos/Other%20icons/Google_Play_Badge.png", alt: "" })))))))))));
+    return (React__default.default.createElement(FooterContainer, { zIndex: zIndex, collapseSize: collapseSize },
+        React__default.default.createElement(FooterContext.default.Provider, { value: footerContextData },
+            Boolean(topSection.length) && (React__default.default.createElement(TopContainer, null,
+                React__default.default.createElement(FooterWrapper, null,
+                    React__default.default.createElement(FooterComponents.TopSection, { topSection: topSection })))),
+            React__default.default.createElement(FooterWrapper, null,
+                Boolean(categories.length) && React__default.default.createElement(FooterComponents.Categories, { categories: categories }),
+                React__default.default.createElement(BottomContainer, { collapseSize: collapseSize, "data-testid": "bottom-section" },
+                    Boolean(languages.length) && (React__default.default.createElement(LanguageLinks, { currentLanguage: language, languages: languages })),
+                    React__default.default.createElement(BottomCenter, null,
+                        socialMedia && React__default.default.createElement(FooterComponents.SocialMediaLinks, { socialMedia: socialMedia }),
+                        React__default.default.createElement(BusinessMenu.default, { items: (_b = (_a = items === null || items === void 0 ? void 0 : items.footerNavigation) === null || _a === void 0 ? void 0 : _a.businessSelector) === null || _b === void 0 ? void 0 : _b.items, currentBusinessId: items.businessId, lang: language }),
+                        generalInformation && (React__default.default.createElement(FooterComponents.GeneralInformation, { generalInformation: generalInformation }))),
+                    applicationLinks && (React__default.default.createElement(AppSection, null,
+                        React__default.default.createElement("p", null, applicationLinks === null || applicationLinks === void 0 ? void 0 : applicationLinks.title[language]),
+                        React__default.default.createElement(AppList, null,
+                            Boolean((_c = applicationLinks === null || applicationLinks === void 0 ? void 0 : applicationLinks.appStoreURL[language]) === null || _c === void 0 ? void 0 : _c.length) && (React__default.default.createElement("a", { "aria-label": appStoreLabel[language], href: applicationLinks.appStoreURL[language], target: "_blank", rel: "noreferrer" },
+                                React__default.default.createElement("img", { src: "https://res.cloudinary.com/dnaoyj/image/upload/dpr_2,f_auto,q_auto,w_142/v1/Assets/Icons%20and%20logos/Other%20icons/App_Store_Badge.png", alt: "" }))),
+                            Boolean((_d = applicationLinks === null || applicationLinks === void 0 ? void 0 : applicationLinks.googlePlayURL[language]) === null || _d === void 0 ? void 0 : _d.length) && (React__default.default.createElement("a", { "aria-label": googlePlayLabel[language], href: applicationLinks.googlePlayURL[language], target: "_blank", rel: "noreferrer" },
+                                React__default.default.createElement("img", { src: "https://res.cloudinary.com/dnaoyj/image/upload/dpr_2,f_auto,q_auto,w_142/v1/Assets/Icons%20and%20logos/Other%20icons/Google_Play_Badge.png", alt: "" })))))))))));
 };
 
 exports.default = Footer;

package/build/cjs/components/Icon/Icon.js

@@ -9,6 +9,10 @@ var theme = require('../../themes/theme.js');
 var styledUtils = require('../../utils/styledUtils.js');
 var index = require('../Icons/index.js');
 
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
 const IconsList = index;
 const IconContainer = styled.default.span `
     display: inline-flex;
@@ -34,11 +38,11 @@ const Icon = (_a) => {
     var { name, icon: IconParam, color = 'currentColor', size = '1.5rem', 'data-testid': dataTestId } = _a, props = tslib.__rest(_a, ["name", "icon", "color", "size", 'data-testid']);
     // TODO: Remove once https://jira.dna.fi/browse/STYLE-334 is done
     const RenderIcon = name && IconsList[name];
-    return (React.createElement(React.Fragment, null,
-        RenderIcon && (React.createElement(IconContainer, { position: props.position, size: size, className: "dnasg-icon", "data-testid": dataTestId },
-            React.createElement(RenderIcon, Object.assign({}, props, { size: size, color: color })))),
-        IconParam && (React.createElement(IconContainer, { onClick: props.onClick, position: props.position, size: size, className: `dnasg-icon ${props.className || ''}`.trim(), "data-testid": dataTestId },
-            React.createElement(IconParam, { size: size, color: color })))));
+    return (React__default.default.createElement(React__default.default.Fragment, null,
+        RenderIcon && (React__default.default.createElement(IconContainer, { position: props.position, size: size, className: "dnasg-icon", "data-testid": dataTestId },
+            React__default.default.createElement(RenderIcon, Object.assign({}, props, { size: size, color: color })))),
+        IconParam && (React__default.default.createElement(IconContainer, { onClick: props.onClick, position: props.position, size: size, className: `dnasg-icon ${props.className || ''}`.trim(), "data-testid": dataTestId },
+            React__default.default.createElement(IconParam, { size: size, color: color })))));
 };
 
 exports.default = Icon;

package/build/cjs/components/Icons/Small/hlArrowBackSmall.js

@@ -5,10 +5,14 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var tslib = require('tslib');
 var React = require('react');
 
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
 const hlArrowBackSmall = (_a) => {
     var { size, color } = _a, props = tslib.__rest(_a, ["size", "color"]);
-    return (React.createElement("svg", Object.assign({ viewBox: "0 0 12 12", fill: color }, props),
-        React.createElement("path", { d: "M3.25 5.4L4.62 4a.6.6 0 1 0-.85-.85l-2.4 2.4L1 6l.42.42 2.4 2.4a.6.6 0 1 0 .8-.82L3.25 6.6H9.6v1.2a.6.6 0 0 0 1.2 0V5.4z" })));
+    return (React__default.default.createElement("svg", Object.assign({ viewBox: "0 0 12 12", fill: color }, props),
+        React__default.default.createElement("path", { d: "M3.25 5.4L4.62 4a.6.6 0 1 0-.85-.85l-2.4 2.4L1 6l.42.42 2.4 2.4a.6.6 0 1 0 .8-.82L3.25 6.6H9.6v1.2a.6.6 0 0 0 1.2 0V5.4z" })));
 };
 
 exports.default = hlArrowBackSmall;

package/build/cjs/components/Icons/Small/hlArrowForwardSmall.js

@@ -5,10 +5,14 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var tslib = require('tslib');
 var React = require('react');
 
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
 const hlArrowForwardSmall = (_a) => {
     var { size, color } = _a, props = tslib.__rest(_a, ["size", "color"]);
-    return (React.createElement("svg", Object.assign({ viewBox: "0 0 12 12", fill: color }, props),
-        React.createElement("path", { d: "M10.62 6.42L11 6l-.42-.42-2.4-2.4a.6.6 0 0 0-.8.82l1.37 1.4h-7a.6.6 0 1 0 0 1.2h7L7.38 8a.6.6 0 1 0 .85.85l2.4-2.4z" })));
+    return (React__default.default.createElement("svg", Object.assign({ viewBox: "0 0 12 12", fill: color }, props),
+        React__default.default.createElement("path", { d: "M10.62 6.42L11 6l-.42-.42-2.4-2.4a.6.6 0 0 0-.8.82l1.37 1.4h-7a.6.6 0 1 0 0 1.2h7L7.38 8a.6.6 0 1 0 .85.85l2.4-2.4z" })));
 };
 
 exports.default = hlArrowForwardSmall;

package/build/cjs/components/Icons/Small/hlArrowUnderSmall.js

@@ -5,10 +5,14 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var tslib = require('tslib');
 var React = require('react');
 
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
 const hlArrowUnderSmall = (_a) => {
     var { size, color } = _a, props = tslib.__rest(_a, ["size", "color"]);
-    return (React.createElement("svg", Object.assign({ viewBox: "0 0 10 7", fill: color }, props),
-        React.createElement("path", { d: "M7.75 4.6L6.38 6a.601.601 0 10.85.85l2.4-2.4L10 4l-.42-.42-2.4-2.4a.6.6 0 10-.8.82l1.37 1.4H1.4V2.2a.6.6 0 10-1.2 0v2.4h7.55z" })));
+    return (React__default.default.createElement("svg", Object.assign({ viewBox: "0 0 10 7", fill: color }, props),
+        React__default.default.createElement("path", { d: "M7.75 4.6L6.38 6a.601.601 0 10.85.85l2.4-2.4L10 4l-.42-.42-2.4-2.4a.6.6 0 10-.8.82l1.37 1.4H1.4V2.2a.6.6 0 10-1.2 0v2.4h7.55z" })));
 };
 
 exports.default = hlArrowUnderSmall;

package/build/cjs/components/Icons/Small/hlCalendarSmall.js

@@ -5,10 +5,14 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var tslib = require('tslib');
 var React = require('react');
 
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
 const hlCalendarSmall = (_a) => {
     var { size, color } = _a, props = tslib.__rest(_a, ["size", "color"]);
-    return (React.createElement("svg", Object.assign({ viewBox: "0 0 10 10", fill: color }, props),
-        React.createElement("path", { d: "M7.4 1.4V.8a.6.6 0 10-1.2 0v.6H3.8V.8a.6.6 0 10-1.2 0v.6H.2v8.4h9.6V1.4H7.4zm1.2 7.2H1.4v-6h1.2v.6a.6.6 0 101.2 0v-.6h2.4v.6a.6.6 0 101.2 0v-.6h1.2v6z" })));
+    return (React__default.default.createElement("svg", Object.assign({ viewBox: "0 0 10 10", fill: color }, props),
+        React__default.default.createElement("path", { d: "M7.4 1.4V.8a.6.6 0 10-1.2 0v.6H3.8V.8a.6.6 0 10-1.2 0v.6H.2v8.4h9.6V1.4H7.4zm1.2 7.2H1.4v-6h1.2v.6a.6.6 0 101.2 0v-.6h2.4v.6a.6.6 0 101.2 0v-.6h1.2v6z" })));
 };
 
 exports.default = hlCalendarSmall;

package/build/cjs/components/Icons/Small/hlChevronDownSmall.js

@@ -5,10 +5,14 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var tslib = require('tslib');
 var React = require('react');
 
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
 const hlChevronDownSmall = (_a) => {
     var { size, color } = _a, props = tslib.__rest(_a, ["size", "color"]);
-    return (React.createElement("svg", Object.assign({ viewBox: "0 0 12 12", fill: color }, props),
-        React.createElement("path", { d: "M6,9.25 L1.38,4.62 C1.14527898,4.38527898 1.14527898,4.00472102 1.38,3.77 C1.61472102,3.53527898 1.99527898,3.53527898 2.23,3.77 L6,7.55 L9.78,3.78 C9.93183788,3.62816212 10.1531464,3.56886268 10.3605608,3.6244392 C10.5679752,3.68001572 10.7299843,3.84202481 10.7855608,4.0494392 C10.8411373,4.2568536 10.7818379,4.47816212 10.63,4.63 L6,9.25 Z" })));
+    return (React__default.default.createElement("svg", Object.assign({ viewBox: "0 0 12 12", fill: color }, props),
+        React__default.default.createElement("path", { d: "M6,9.25 L1.38,4.62 C1.14527898,4.38527898 1.14527898,4.00472102 1.38,3.77 C1.61472102,3.53527898 1.99527898,3.53527898 2.23,3.77 L6,7.55 L9.78,3.78 C9.93183788,3.62816212 10.1531464,3.56886268 10.3605608,3.6244392 C10.5679752,3.68001572 10.7299843,3.84202481 10.7855608,4.0494392 C10.8411373,4.2568536 10.7818379,4.47816212 10.63,4.63 L6,9.25 Z" })));
 };
 
 exports.default = hlChevronDownSmall;