@laerdal/life-react-components 1.9.9-dev.2 → 1.9.9-dev.5

package/dist/Breadcrumb/Breadcrumb.cjs

@@ -9,64 +9,26 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
 var React = _interopRequireWildcard(require("react"));
 
-var _styledComponents = _interopRequireDefault(require("styled-components"));
-
 var _styles = require("../styles");
 
 var _ = require("..");
 
 var _reactRouter = require("react-router");
 
-var _typography = require("../styles/typography");
-
 var _DropdownButton = _interopRequireDefault(require("../Dropdown/DropdownButton"));
 
-var _jsxRuntime = require("react/jsx-runtime");
+var _styles2 = require("./styles");
 
-var _templateObject, _templateObject2;
+var _jsxRuntime = require("react/jsx-runtime");
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-var marginRight = function marginRight(size) {
-  return size == _.Size.Small || size == _.Size.Medium ? 'margin-right: 8px;' : 'margin-right: 4px;';
-};
-
-var BreadcrumbContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display:flex;\n  align-items: center;\n  min-height: 48px;\n    \n  a {\n    text-decoration: none;\n    ", "\n    ", "\n  }\n\n  .chevronicon {\n    ", "\n  }\n\n  a:hover {\n    color: ", ";\n  }\n  a:active {\n    color: ", ";\n  }\n"])), function (props) {
-  return FontStyles(props.size, _.ComponentTextStyle.Regular, _styles.COLORS.neutral_600);
-}, function (props) {
-  return marginRight(props.size);
-}, function (props) {
-  return marginRight(props.size);
-}, _styles.COLORS.primary_700, _styles.COLORS.primary_800);
-
-var FontStyles = function FontStyles(size, textStyle, color) {
-  switch (size) {
-    case _.Size.XSmall:
-      return (0, _typography.ComponentXXSStyling)(textStyle, color);
-
-    case _.Size.Medium:
-      return (0, _typography.ComponentMStyling)(textStyle, color);
-
-    case _.Size.Small:
-    default:
-      return (0, _typography.ComponentSStyling)(textStyle, color);
-  }
-};
-
-var LastBreadcrumbItem = _styledComponents.default.label(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  ", "\n  ", "\n"])), function (props) {
-  return FontStyles(props.size, _.ComponentTextStyle.Bold, _styles.COLORS.neutral_800);
-}, function (props) {
-  return marginRight(props.size);
-});
-
 var Breadcrumb = function Breadcrumb(_ref) {
   var items = _ref.items,
       _ref$size = _ref.size,
@@ -89,10 +51,12 @@ var Breadcrumb = function Breadcrumb(_ref) {
     history.push(links[0]);
   };
 
-  var chevronSize = size == _.Size.Medium ? "24px" : size == _.Size.Small ? "20px" : "16px";
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(BreadcrumbContainer, {
+  var chevronSize = size == _.Size.Medium ? '24px' : size == _.Size.Small ? '20px' : '16px';
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles2.BreadcrumbContainer, {
     size: size,
+    "data-testid": 'breacrumbContainer',
     children: [homeIcon ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_.IconButton, {
+      id: "homeIcon",
       variant: "secondary",
       shape: "circular",
       action: function action() {
@@ -102,7 +66,7 @@ var Breadcrumb = function Breadcrumb(_ref) {
         size: chevronSize
       })
     }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_.HyperLink, {
-      id: "homelink",
+      id: 'homelink',
       variant: "default",
       href: homeUrl,
       children: homeLabel
@@ -128,7 +92,7 @@ var Breadcrumb = function Breadcrumb(_ref) {
         color: _styles.COLORS.neutral_500,
         size: chevronSize
       }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.HyperLink, {
-        id: "link-item-" + (items.length - 3),
+        id: 'link-item-' + (items.length - 3),
         target: "_self",
         variant: "default",
         href: items[items.length - 3].url,
@@ -140,7 +104,7 @@ var Breadcrumb = function Breadcrumb(_ref) {
         color: _styles.COLORS.neutral_500,
         size: chevronSize
       }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.HyperLink, {
-        id: "link-item-" + (items.length - 2),
+        id: 'link-item-' + (items.length - 2),
         target: "_self",
         variant: "default",
         href: items[items.length - 2].url,
@@ -151,7 +115,7 @@ var Breadcrumb = function Breadcrumb(_ref) {
         className: "chevronicon",
         color: _styles.COLORS.neutral_500,
         size: chevronSize
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(LastBreadcrumbItem, {
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles2.LastBreadcrumbItem, {
         size: size,
         children: items[items.length - 1].label
       })]

package/dist/Breadcrumb/Breadcrumb.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Breadcrumb/Breadcrumb.tsx"],"names":["marginRight","size","Size","Small","Medium","BreadcrumbContainer","styled","div","props","FontStyles","ComponentTextStyle","Regular","COLORS","neutral_600","primary_700","primary_800","textStyle","color","XSmall","LastBreadcrumbItem","label","Bold","neutral_800","Breadcrumb","items","homeIcon","homeLabel","homeUrl","history","dropdownItems","slice","length","map","x","value","url","displayLabel","navigate","links","push","chevronSize","neutral_500"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\n\nimport {COLORS} from '../styles';\nimport {ComponentTextStyle, Size, SystemIcons} from '..';\nimport {useHistory} from 'react-router';\nimport { HyperLink, IconButton } from '..';\nimport {BreadcrumbItem} from '@laerdal/life-react-components/src/Breadcrumb/BreadcrumbItem';\nimport {ComponentMStyling, ComponentSStyling, ComponentXXSStyling} from '../styles/typography';\nimport DropdownButton from '../Dropdown/DropdownButton';\nimport { DropdownItem } from '../Dropdown/DropdownContent';\n\ntype BreadcrumbProps = {\n  homeIcon?: boolean;\n  homeLabel?: string;\n  homeUrl?: string;\n  items?: BreadcrumbItem[];\n  size?: Size;\n};\n\nconst marginRight = (size: Size | undefined) => {\n  return size == Size.Small || size == Size.Medium ? 'margin-right: 8px;' : 'margin-right: 4px;'\n}\n\nconst BreadcrumbContainer = styled.div<{size: Size | undefined}>`\n  display:flex;\n  align-items: center;\n  min-height: 48px;\n    \n  a {\n    text-decoration: none;\n    ${(props) => FontStyles(props.size, ComponentTextStyle.Regular, COLORS.neutral_600)}\n    ${(props) => marginRight(props.size) }\n  }\n\n  .chevronicon {\n    ${(props) => marginRight(props.size) }\n  }\n\n  a:hover {\n    color: ${COLORS.primary_700};\n  }\n  a:active {\n    color: ${COLORS.primary_800};\n  }\n`;\n\nconst FontStyles = (size: Size | undefined, textStyle: ComponentTextStyle, color: string) => {\n  switch (size) {\n    case Size.XSmall:\n      return ComponentXXSStyling(textStyle, color);\n    case Size.Medium:\n      return ComponentMStyling(textStyle, color);\n    case Size.Small:\n    default:\n      return ComponentSStyling(textStyle, color);\n  }\n}\n\nconst LastBreadcrumbItem = styled.label<{size: Size}>`\n  ${(props) => FontStyles(props.size, ComponentTextStyle.Bold, COLORS.neutral_800)}\n  ${(props) => marginRight(props.size) }\n`;\n\nconst Breadcrumb: React.FunctionComponent<BreadcrumbProps> = ({ \n    items, \n    size = Size.Small, \n    homeIcon = true, \n    homeLabel = 'Home', \n    homeUrl = '/' }) => {\n\n  const history = useHistory();\n  const dropdownItems: DropdownItem[] = items ? items.slice(0, items.length - 2).map(x => ({ value: x.url, displayLabel: x.label })) : [];\n  const navigate = (links: string[]) => {    \n    history.push(links[0]);\n  };\n\n  const chevronSize = size == Size.Medium ? \"24px\" : size == Size.Small ? \"20px\" : \"16px\";\n\n  return (\n    <BreadcrumbContainer size={size}>\n\n      {homeIcon ? \n        <IconButton variant=\"secondary\" shape=\"circular\" action={() => history.push(homeUrl)}>\n          <SystemIcons.Home size={chevronSize} />\n        </IconButton> : \n        <HyperLink id={\"homelink\"} variant=\"default\" href={homeUrl}>\n          {homeLabel}\n        </HyperLink>}\n\n      { !!items && items.length > 2 &&\n          (items.length > 3 ?\n          <>\n            <SystemIcons.ChevronRight className=\"chevronicon\" color={COLORS.neutral_500} size={chevronSize} />\n            <DropdownButton\n              type={'icon'}\n              alignLeft={true}\n              items={dropdownItems} \n              size={size}\n              icon={<SystemIcons.MoreHorizontal color={COLORS.neutral_600} size=\"20px\" />}\n              onClick={navigate} />\n          </> :\n          <>\n            <SystemIcons.ChevronRight className=\"chevronicon\" color={COLORS.neutral_500} size={chevronSize} />\n            <HyperLink id={\"link-item-\" + (items.length - 3)} target=\"_self\" variant=\"default\" href={items[items.length - 3].url}>\n              {items[items.length - 3].label}\n            </HyperLink>  \n          </>)\n      }\n\n      { !!items && items.length > 1 && \n        <>\n          <SystemIcons.ChevronRight className=\"chevronicon\" color={COLORS.neutral_500} size={chevronSize} />\n          <HyperLink id={\"link-item-\" + (items.length - 2)} target=\"_self\" variant=\"default\" href={items[items.length - 2].url}>\n            {items[items.length - 2].label}\n          </HyperLink>\n        </>\n      }\n\n      { !!items && items.length > 0 && \n        <>\n          <SystemIcons.ChevronRight className=\"chevronicon\" color={COLORS.neutral_500} size={chevronSize} />\n          <LastBreadcrumbItem size={size}>\n            {items[items.length - 1].label}\n          </LastBreadcrumbItem>\n        </>\n      }\n\n    </BreadcrumbContainer>);\n};\n\nexport default Breadcrumb;\n"],"file":"Breadcrumb.cjs"}
+{"version":3,"sources":["../../src/Breadcrumb/Breadcrumb.tsx"],"names":["Breadcrumb","items","size","Size","Small","homeIcon","homeLabel","homeUrl","history","dropdownItems","slice","length","map","x","value","url","displayLabel","label","navigate","links","push","chevronSize","Medium","COLORS","neutral_500","neutral_600"],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport { COLORS } from '../styles';\nimport { Size, SystemIcons } from '..';\nimport { useHistory } from 'react-router';\nimport { HyperLink, IconButton } from '..';\nimport { BreadcrumbItem } from '@laerdal/life-react-components/src/Breadcrumb/BreadcrumbItem';\nimport DropdownButton from '../Dropdown/DropdownButton';\nimport { DropdownItem } from '../Dropdown/DropdownContent';\nimport { BreadcrumbContainer, LastBreadcrumbItem } from './styles';\n\ntype BreadcrumbProps = {\n  homeIcon?: boolean;\n  homeLabel?: string;\n  homeUrl?: string;\n  items?: BreadcrumbItem[];\n  size?: Size;\n};\n\nconst Breadcrumb: React.FunctionComponent<BreadcrumbProps> = ({ items, size = Size.Small, homeIcon = true, homeLabel = 'Home', homeUrl = '/' }) => {\n  const history = useHistory();\n  const dropdownItems: DropdownItem[] = items ? items.slice(0, items.length - 2).map((x) => ({ value: x.url, displayLabel: x.label })) : [];\n  const navigate = (links: string[]) => {\n    history.push(links[0]);\n  };\n\n  const chevronSize = size == Size.Medium ? '24px' : size == Size.Small ? '20px' : '16px';\n\n  return (\n    <BreadcrumbContainer size={size} data-testid={'breacrumbContainer'}>\n      {homeIcon ? (\n        <IconButton id=\"homeIcon\" variant=\"secondary\" shape=\"circular\" action={() => history.push(homeUrl)}>\n          <SystemIcons.Home size={chevronSize} />\n        </IconButton>\n      ) : (\n        <HyperLink id={'homelink'} variant=\"default\" href={homeUrl}>\n          {homeLabel}\n        </HyperLink>\n      )}\n\n      {!!items &&\n        items.length > 2 &&\n        (items.length > 3 ? (\n          <>\n            <SystemIcons.ChevronRight className=\"chevronicon\" color={COLORS.neutral_500} size={chevronSize} />\n            <DropdownButton\n              type={'icon'}\n              alignLeft={true}\n              items={dropdownItems}\n              size={size}\n              icon={<SystemIcons.MoreHorizontal color={COLORS.neutral_600} size=\"20px\" />}\n              onClick={navigate}\n            />\n          </>\n        ) : (\n          <>\n            <SystemIcons.ChevronRight className=\"chevronicon\" color={COLORS.neutral_500} size={chevronSize} />\n            <HyperLink id={'link-item-' + (items.length - 3)} target=\"_self\" variant=\"default\" href={items[items.length - 3].url}>\n              {items[items.length - 3].label}\n            </HyperLink>\n          </>\n        ))}\n\n      {!!items && items.length > 1 && (\n        <>\n          <SystemIcons.ChevronRight className=\"chevronicon\" color={COLORS.neutral_500} size={chevronSize} />\n          <HyperLink id={'link-item-' + (items.length - 2)} target=\"_self\" variant=\"default\" href={items[items.length - 2].url}>\n            {items[items.length - 2].label}\n          </HyperLink>\n        </>\n      )}\n\n      {!!items && items.length > 0 && (\n        <>\n          <SystemIcons.ChevronRight className=\"chevronicon\" color={COLORS.neutral_500} size={chevronSize} />\n          <LastBreadcrumbItem size={size}>{items[items.length - 1].label}</LastBreadcrumbItem>\n        </>\n      )}\n    </BreadcrumbContainer>\n  );\n};\n\nexport default Breadcrumb;\n"],"file":"Breadcrumb.cjs"}

package/dist/Breadcrumb/Breadcrumb.js

@@ -1,52 +1,15 @@
-import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
 import _pt from "prop-types";
-
-var _templateObject, _templateObject2;
-
 import * as React from 'react';
-import styled from 'styled-components';
 import { COLORS } from '../styles';
-import { ComponentTextStyle, Size, SystemIcons } from '..';
+import { Size, SystemIcons } from '..';
 import { useHistory } from 'react-router';
 import { HyperLink, IconButton } from '..';
-import { ComponentMStyling, ComponentSStyling, ComponentXXSStyling } from '../styles/typography';
 import DropdownButton from '../Dropdown/DropdownButton';
+import { BreadcrumbContainer, LastBreadcrumbItem } from './styles';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Fragment as _Fragment } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 
-var marginRight = function marginRight(size) {
-  return size == Size.Small || size == Size.Medium ? 'margin-right: 8px;' : 'margin-right: 4px;';
-};
-
-var BreadcrumbContainer = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display:flex;\n  align-items: center;\n  min-height: 48px;\n    \n  a {\n    text-decoration: none;\n    ", "\n    ", "\n  }\n\n  .chevronicon {\n    ", "\n  }\n\n  a:hover {\n    color: ", ";\n  }\n  a:active {\n    color: ", ";\n  }\n"])), function (props) {
-  return FontStyles(props.size, ComponentTextStyle.Regular, COLORS.neutral_600);
-}, function (props) {
-  return marginRight(props.size);
-}, function (props) {
-  return marginRight(props.size);
-}, COLORS.primary_700, COLORS.primary_800);
-
-var FontStyles = function FontStyles(size, textStyle, color) {
-  switch (size) {
-    case Size.XSmall:
-      return ComponentXXSStyling(textStyle, color);
-
-    case Size.Medium:
-      return ComponentMStyling(textStyle, color);
-
-    case Size.Small:
-    default:
-      return ComponentSStyling(textStyle, color);
-  }
-};
-
-var LastBreadcrumbItem = styled.label(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  ", "\n  ", "\n"])), function (props) {
-  return FontStyles(props.size, ComponentTextStyle.Bold, COLORS.neutral_800);
-}, function (props) {
-  return marginRight(props.size);
-});
-
 var Breadcrumb = function Breadcrumb(_ref) {
   var items = _ref.items,
       _ref$size = _ref.size,
@@ -69,10 +32,12 @@ var Breadcrumb = function Breadcrumb(_ref) {
     history.push(links[0]);
   };
 
-  var chevronSize = size == Size.Medium ? "24px" : size == Size.Small ? "20px" : "16px";
+  var chevronSize = size == Size.Medium ? '24px' : size == Size.Small ? '20px' : '16px';
   return /*#__PURE__*/_jsxs(BreadcrumbContainer, {
     size: size,
+    "data-testid": 'breacrumbContainer',
     children: [homeIcon ? /*#__PURE__*/_jsx(IconButton, {
+      id: "homeIcon",
       variant: "secondary",
       shape: "circular",
       action: function action() {
@@ -82,7 +47,7 @@ var Breadcrumb = function Breadcrumb(_ref) {
         size: chevronSize
       })
     }) : /*#__PURE__*/_jsx(HyperLink, {
-      id: "homelink",
+      id: 'homelink',
       variant: "default",
       href: homeUrl,
       children: homeLabel
@@ -108,7 +73,7 @@ var Breadcrumb = function Breadcrumb(_ref) {
         color: COLORS.neutral_500,
         size: chevronSize
       }), /*#__PURE__*/_jsx(HyperLink, {
-        id: "link-item-" + (items.length - 3),
+        id: 'link-item-' + (items.length - 3),
         target: "_self",
         variant: "default",
         href: items[items.length - 3].url,
@@ -120,7 +85,7 @@ var Breadcrumb = function Breadcrumb(_ref) {
         color: COLORS.neutral_500,
         size: chevronSize
       }), /*#__PURE__*/_jsx(HyperLink, {
-        id: "link-item-" + (items.length - 2),
+        id: 'link-item-' + (items.length - 2),
         target: "_self",
         variant: "default",
         href: items[items.length - 2].url,

package/dist/Breadcrumb/Breadcrumb.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Breadcrumb/Breadcrumb.tsx"],"names":["React","styled","COLORS","ComponentTextStyle","Size","SystemIcons","useHistory","HyperLink","IconButton","ComponentMStyling","ComponentSStyling","ComponentXXSStyling","DropdownButton","marginRight","size","Small","Medium","BreadcrumbContainer","div","props","FontStyles","Regular","neutral_600","primary_700","primary_800","textStyle","color","XSmall","LastBreadcrumbItem","label","Bold","neutral_800","Breadcrumb","items","homeIcon","homeLabel","homeUrl","history","dropdownItems","slice","length","map","x","value","url","displayLabel","navigate","links","push","chevronSize","neutral_500"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\n\nimport {COLORS} from '../styles';\nimport {ComponentTextStyle, Size, SystemIcons} from '..';\nimport {useHistory} from 'react-router';\nimport { HyperLink, IconButton } from '..';\nimport {BreadcrumbItem} from '@laerdal/life-react-components/src/Breadcrumb/BreadcrumbItem';\nimport {ComponentMStyling, ComponentSStyling, ComponentXXSStyling} from '../styles/typography';\nimport DropdownButton from '../Dropdown/DropdownButton';\nimport { DropdownItem } from '../Dropdown/DropdownContent';\n\ntype BreadcrumbProps = {\n  homeIcon?: boolean;\n  homeLabel?: string;\n  homeUrl?: string;\n  items?: BreadcrumbItem[];\n  size?: Size;\n};\n\nconst marginRight = (size: Size | undefined) => {\n  return size == Size.Small || size == Size.Medium ? 'margin-right: 8px;' : 'margin-right: 4px;'\n}\n\nconst BreadcrumbContainer = styled.div<{size: Size | undefined}>`\n  display:flex;\n  align-items: center;\n  min-height: 48px;\n    \n  a {\n    text-decoration: none;\n    ${(props) => FontStyles(props.size, ComponentTextStyle.Regular, COLORS.neutral_600)}\n    ${(props) => marginRight(props.size) }\n  }\n\n  .chevronicon {\n    ${(props) => marginRight(props.size) }\n  }\n\n  a:hover {\n    color: ${COLORS.primary_700};\n  }\n  a:active {\n    color: ${COLORS.primary_800};\n  }\n`;\n\nconst FontStyles = (size: Size | undefined, textStyle: ComponentTextStyle, color: string) => {\n  switch (size) {\n    case Size.XSmall:\n      return ComponentXXSStyling(textStyle, color);\n    case Size.Medium:\n      return ComponentMStyling(textStyle, color);\n    case Size.Small:\n    default:\n      return ComponentSStyling(textStyle, color);\n  }\n}\n\nconst LastBreadcrumbItem = styled.label<{size: Size}>`\n  ${(props) => FontStyles(props.size, ComponentTextStyle.Bold, COLORS.neutral_800)}\n  ${(props) => marginRight(props.size) }\n`;\n\nconst Breadcrumb: React.FunctionComponent<BreadcrumbProps> = ({ \n    items, \n    size = Size.Small, \n    homeIcon = true, \n    homeLabel = 'Home', \n    homeUrl = '/' }) => {\n\n  const history = useHistory();\n  const dropdownItems: DropdownItem[] = items ? items.slice(0, items.length - 2).map(x => ({ value: x.url, displayLabel: x.label })) : [];\n  const navigate = (links: string[]) => {    \n    history.push(links[0]);\n  };\n\n  const chevronSize = size == Size.Medium ? \"24px\" : size == Size.Small ? \"20px\" : \"16px\";\n\n  return (\n    <BreadcrumbContainer size={size}>\n\n      {homeIcon ? \n        <IconButton variant=\"secondary\" shape=\"circular\" action={() => history.push(homeUrl)}>\n          <SystemIcons.Home size={chevronSize} />\n        </IconButton> : \n        <HyperLink id={\"homelink\"} variant=\"default\" href={homeUrl}>\n          {homeLabel}\n        </HyperLink>}\n\n      { !!items && items.length > 2 &&\n          (items.length > 3 ?\n          <>\n            <SystemIcons.ChevronRight className=\"chevronicon\" color={COLORS.neutral_500} size={chevronSize} />\n            <DropdownButton\n              type={'icon'}\n              alignLeft={true}\n              items={dropdownItems} \n              size={size}\n              icon={<SystemIcons.MoreHorizontal color={COLORS.neutral_600} size=\"20px\" />}\n              onClick={navigate} />\n          </> :\n          <>\n            <SystemIcons.ChevronRight className=\"chevronicon\" color={COLORS.neutral_500} size={chevronSize} />\n            <HyperLink id={\"link-item-\" + (items.length - 3)} target=\"_self\" variant=\"default\" href={items[items.length - 3].url}>\n              {items[items.length - 3].label}\n            </HyperLink>  \n          </>)\n      }\n\n      { !!items && items.length > 1 && \n        <>\n          <SystemIcons.ChevronRight className=\"chevronicon\" color={COLORS.neutral_500} size={chevronSize} />\n          <HyperLink id={\"link-item-\" + (items.length - 2)} target=\"_self\" variant=\"default\" href={items[items.length - 2].url}>\n            {items[items.length - 2].label}\n          </HyperLink>\n        </>\n      }\n\n      { !!items && items.length > 0 && \n        <>\n          <SystemIcons.ChevronRight className=\"chevronicon\" color={COLORS.neutral_500} size={chevronSize} />\n          <LastBreadcrumbItem size={size}>\n            {items[items.length - 1].label}\n          </LastBreadcrumbItem>\n        </>\n      }\n\n    </BreadcrumbContainer>);\n};\n\nexport default Breadcrumb;\n"],"file":"Breadcrumb.js"}
+{"version":3,"sources":["../../src/Breadcrumb/Breadcrumb.tsx"],"names":["React","COLORS","Size","SystemIcons","useHistory","HyperLink","IconButton","DropdownButton","BreadcrumbContainer","LastBreadcrumbItem","Breadcrumb","items","size","Small","homeIcon","homeLabel","homeUrl","history","dropdownItems","slice","length","map","x","value","url","displayLabel","label","navigate","links","push","chevronSize","Medium","neutral_500","neutral_600"],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport { COLORS } from '../styles';\nimport { Size, SystemIcons } from '..';\nimport { useHistory } from 'react-router';\nimport { HyperLink, IconButton } from '..';\nimport { BreadcrumbItem } from '@laerdal/life-react-components/src/Breadcrumb/BreadcrumbItem';\nimport DropdownButton from '../Dropdown/DropdownButton';\nimport { DropdownItem } from '../Dropdown/DropdownContent';\nimport { BreadcrumbContainer, LastBreadcrumbItem } from './styles';\n\ntype BreadcrumbProps = {\n  homeIcon?: boolean;\n  homeLabel?: string;\n  homeUrl?: string;\n  items?: BreadcrumbItem[];\n  size?: Size;\n};\n\nconst Breadcrumb: React.FunctionComponent<BreadcrumbProps> = ({ items, size = Size.Small, homeIcon = true, homeLabel = 'Home', homeUrl = '/' }) => {\n  const history = useHistory();\n  const dropdownItems: DropdownItem[] = items ? items.slice(0, items.length - 2).map((x) => ({ value: x.url, displayLabel: x.label })) : [];\n  const navigate = (links: string[]) => {\n    history.push(links[0]);\n  };\n\n  const chevronSize = size == Size.Medium ? '24px' : size == Size.Small ? '20px' : '16px';\n\n  return (\n    <BreadcrumbContainer size={size} data-testid={'breacrumbContainer'}>\n      {homeIcon ? (\n        <IconButton id=\"homeIcon\" variant=\"secondary\" shape=\"circular\" action={() => history.push(homeUrl)}>\n          <SystemIcons.Home size={chevronSize} />\n        </IconButton>\n      ) : (\n        <HyperLink id={'homelink'} variant=\"default\" href={homeUrl}>\n          {homeLabel}\n        </HyperLink>\n      )}\n\n      {!!items &&\n        items.length > 2 &&\n        (items.length > 3 ? (\n          <>\n            <SystemIcons.ChevronRight className=\"chevronicon\" color={COLORS.neutral_500} size={chevronSize} />\n            <DropdownButton\n              type={'icon'}\n              alignLeft={true}\n              items={dropdownItems}\n              size={size}\n              icon={<SystemIcons.MoreHorizontal color={COLORS.neutral_600} size=\"20px\" />}\n              onClick={navigate}\n            />\n          </>\n        ) : (\n          <>\n            <SystemIcons.ChevronRight className=\"chevronicon\" color={COLORS.neutral_500} size={chevronSize} />\n            <HyperLink id={'link-item-' + (items.length - 3)} target=\"_self\" variant=\"default\" href={items[items.length - 3].url}>\n              {items[items.length - 3].label}\n            </HyperLink>\n          </>\n        ))}\n\n      {!!items && items.length > 1 && (\n        <>\n          <SystemIcons.ChevronRight className=\"chevronicon\" color={COLORS.neutral_500} size={chevronSize} />\n          <HyperLink id={'link-item-' + (items.length - 2)} target=\"_self\" variant=\"default\" href={items[items.length - 2].url}>\n            {items[items.length - 2].label}\n          </HyperLink>\n        </>\n      )}\n\n      {!!items && items.length > 0 && (\n        <>\n          <SystemIcons.ChevronRight className=\"chevronicon\" color={COLORS.neutral_500} size={chevronSize} />\n          <LastBreadcrumbItem size={size}>{items[items.length - 1].label}</LastBreadcrumbItem>\n        </>\n      )}\n    </BreadcrumbContainer>\n  );\n};\n\nexport default Breadcrumb;\n"],"file":"Breadcrumb.js"}

package/dist/Breadcrumb/styles.cjs

@@ -0,0 +1,55 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.LastBreadcrumbItem = exports.BreadcrumbContainer = void 0;
+
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+
+var _styles = require("../styles");
+
+var _types = require("../types");
+
+var _templateObject, _templateObject2;
+
+var marginRight = function marginRight(size) {
+  return size == _types.Size.Small || size == _types.Size.Medium ? 'margin-right: 8px;' : 'margin-right: 4px;';
+};
+
+var FontStyles = function FontStyles(size, textStyle, color) {
+  switch (size) {
+    case _types.Size.XSmall:
+      return (0, _styles.ComponentXXSStyling)(textStyle, color);
+
+    case _types.Size.Medium:
+      return (0, _styles.ComponentMStyling)(textStyle, color);
+
+    case _types.Size.Small:
+    default:
+      return (0, _styles.ComponentSStyling)(textStyle, color);
+  }
+};
+
+var LastBreadcrumbItem = _styledComponents.default.label(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  ", "\n  ", "\n"])), function (props) {
+  return FontStyles(props.size, _styles.ComponentTextStyle.Bold, _styles.COLORS.neutral_800);
+}, function (props) {
+  return marginRight(props.size);
+});
+
+exports.LastBreadcrumbItem = LastBreadcrumbItem;
+
+var BreadcrumbContainer = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  align-items: center;\n  min-height: 48px;\n\n  a {\n    text-decoration: none;\n    ", "\n    ", "\n  }\n\n  .chevronicon {\n    ", "\n  }\n\n  a:hover {\n    color: ", ";\n  }\n  a:active {\n    color: ", ";\n  }\n"])), function (props) {
+  return FontStyles(props.size, _styles.ComponentTextStyle.Regular, _styles.COLORS.neutral_600);
+}, function (props) {
+  return marginRight(props.size);
+}, function (props) {
+  return marginRight(props.size);
+}, _styles.COLORS.primary_700, _styles.COLORS.primary_800);
+
+exports.BreadcrumbContainer = BreadcrumbContainer;
+//# sourceMappingURL=styles.cjs.map

package/dist/Breadcrumb/styles.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/Breadcrumb/styles.ts"],"names":["marginRight","size","Size","Small","Medium","FontStyles","textStyle","color","XSmall","LastBreadcrumbItem","styled","label","props","ComponentTextStyle","Bold","COLORS","neutral_800","BreadcrumbContainer","div","Regular","neutral_600","primary_700","primary_800"],"mappings":";;;;;;;;;;;AAAA;;AACA;;AACA;;;;AAEA,IAAMA,WAAW,GAAG,SAAdA,WAAc,CAACC,IAAD,EAA4B;AAC9C,SAAOA,IAAI,IAAIC,YAAKC,KAAb,IAAsBF,IAAI,IAAIC,YAAKE,MAAnC,GAA4C,oBAA5C,GAAmE,oBAA1E;AACD,CAFD;;AAIA,IAAMC,UAAU,GAAG,SAAbA,UAAa,CAACJ,IAAD,EAAyBK,SAAzB,EAAwDC,KAAxD,EAA0E;AAC3F,UAAQN,IAAR;AACE,SAAKC,YAAKM,MAAV;AACE,aAAO,iCAAoBF,SAApB,EAA+BC,KAA/B,CAAP;;AACF,SAAKL,YAAKE,MAAV;AACE,aAAO,+BAAkBE,SAAlB,EAA6BC,KAA7B,CAAP;;AACF,SAAKL,YAAKC,KAAV;AACA;AACE,aAAO,+BAAkBG,SAAlB,EAA6BC,KAA7B,CAAP;AAPJ;AASD,CAVD;;AAYO,IAAME,kBAAkB,GAAGC,0BAAOC,KAAV,sGAC3B,UAACC,KAAD;AAAA,SAAWP,UAAU,CAACO,KAAK,CAACX,IAAP,EAAaY,2BAAmBC,IAAhC,EAAsCC,eAAOC,WAA7C,CAArB;AAAA,CAD2B,EAE3B,UAACJ,KAAD;AAAA,SAAWZ,WAAW,CAACY,KAAK,CAACX,IAAP,CAAtB;AAAA,CAF2B,CAAxB;;;;AAKA,IAAMgB,mBAAmB,GAAGP,0BAAOQ,GAAV,mUAO1B,UAACN,KAAD;AAAA,SAAWP,UAAU,CAACO,KAAK,CAACX,IAAP,EAAaY,2BAAmBM,OAAhC,EAAyCJ,eAAOK,WAAhD,CAArB;AAAA,CAP0B,EAQ1B,UAACR,KAAD;AAAA,SAAWZ,WAAW,CAACY,KAAK,CAACX,IAAP,CAAtB;AAAA,CAR0B,EAY1B,UAACW,KAAD;AAAA,SAAWZ,WAAW,CAACY,KAAK,CAACX,IAAP,CAAtB;AAAA,CAZ0B,EAgBnBc,eAAOM,WAhBY,EAmBnBN,eAAOO,WAnBY,CAAzB","sourcesContent":["import styled from 'styled-components';\nimport { COLORS, ComponentMStyling, ComponentSStyling, ComponentTextStyle, ComponentXXSStyling } from '../styles';\nimport { Size } from '../types';\n\nconst marginRight = (size: Size | undefined) => {\n  return size == Size.Small || size == Size.Medium ? 'margin-right: 8px;' : 'margin-right: 4px;';\n};\n\nconst FontStyles = (size: Size | undefined, textStyle: ComponentTextStyle, color: string) => {\n  switch (size) {\n    case Size.XSmall:\n      return ComponentXXSStyling(textStyle, color);\n    case Size.Medium:\n      return ComponentMStyling(textStyle, color);\n    case Size.Small:\n    default:\n      return ComponentSStyling(textStyle, color);\n  }\n};\n\nexport const LastBreadcrumbItem = styled.label<{ size: Size }>`\n  ${(props) => FontStyles(props.size, ComponentTextStyle.Bold, COLORS.neutral_800)}\n  ${(props) => marginRight(props.size)}\n`;\n\nexport const BreadcrumbContainer = styled.div<{ size: Size | undefined }>`\n  display: flex;\n  align-items: center;\n  min-height: 48px;\n\n  a {\n    text-decoration: none;\n    ${(props) => FontStyles(props.size, ComponentTextStyle.Regular, COLORS.neutral_600)}\n    ${(props) => marginRight(props.size)}\n  }\n\n  .chevronicon {\n    ${(props) => marginRight(props.size)}\n  }\n\n  a:hover {\n    color: ${COLORS.primary_700};\n  }\n  a:active {\n    color: ${COLORS.primary_800};\n  }\n`;\n"],"file":"styles.cjs"}

package/dist/Breadcrumb/styles.d.ts

@@ -0,0 +1,7 @@
+import { Size } from '../types';
+export declare const LastBreadcrumbItem: import("styled-components").StyledComponent<"label", any, {
+    size: Size;
+}, never>;
+export declare const BreadcrumbContainer: import("styled-components").StyledComponent<"div", any, {
+    size: Size | undefined;
+}, never>;

package/dist/Breadcrumb/styles.js

@@ -0,0 +1,39 @@
+import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
+
+var _templateObject, _templateObject2;
+
+import styled from 'styled-components';
+import { COLORS, ComponentMStyling, ComponentSStyling, ComponentTextStyle, ComponentXXSStyling } from '../styles';
+import { Size } from '../types';
+
+var marginRight = function marginRight(size) {
+  return size == Size.Small || size == Size.Medium ? 'margin-right: 8px;' : 'margin-right: 4px;';
+};
+
+var FontStyles = function FontStyles(size, textStyle, color) {
+  switch (size) {
+    case Size.XSmall:
+      return ComponentXXSStyling(textStyle, color);
+
+    case Size.Medium:
+      return ComponentMStyling(textStyle, color);
+
+    case Size.Small:
+    default:
+      return ComponentSStyling(textStyle, color);
+  }
+};
+
+export var LastBreadcrumbItem = styled.label(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  ", "\n  ", "\n"])), function (props) {
+  return FontStyles(props.size, ComponentTextStyle.Bold, COLORS.neutral_800);
+}, function (props) {
+  return marginRight(props.size);
+});
+export var BreadcrumbContainer = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  min-height: 48px;\n\n  a {\n    text-decoration: none;\n    ", "\n    ", "\n  }\n\n  .chevronicon {\n    ", "\n  }\n\n  a:hover {\n    color: ", ";\n  }\n  a:active {\n    color: ", ";\n  }\n"])), function (props) {
+  return FontStyles(props.size, ComponentTextStyle.Regular, COLORS.neutral_600);
+}, function (props) {
+  return marginRight(props.size);
+}, function (props) {
+  return marginRight(props.size);
+}, COLORS.primary_700, COLORS.primary_800);
+//# sourceMappingURL=styles.js.map

package/dist/Breadcrumb/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/Breadcrumb/styles.ts"],"names":["styled","COLORS","ComponentMStyling","ComponentSStyling","ComponentTextStyle","ComponentXXSStyling","Size","marginRight","size","Small","Medium","FontStyles","textStyle","color","XSmall","LastBreadcrumbItem","label","props","Bold","neutral_800","BreadcrumbContainer","div","Regular","neutral_600","primary_700","primary_800"],"mappings":";;;;AAAA,OAAOA,MAAP,MAAmB,mBAAnB;AACA,SAASC,MAAT,EAAiBC,iBAAjB,EAAoCC,iBAApC,EAAuDC,kBAAvD,EAA2EC,mBAA3E,QAAsG,WAAtG;AACA,SAASC,IAAT,QAAqB,UAArB;;AAEA,IAAMC,WAAW,GAAG,SAAdA,WAAc,CAACC,IAAD,EAA4B;AAC9C,SAAOA,IAAI,IAAIF,IAAI,CAACG,KAAb,IAAsBD,IAAI,IAAIF,IAAI,CAACI,MAAnC,GAA4C,oBAA5C,GAAmE,oBAA1E;AACD,CAFD;;AAIA,IAAMC,UAAU,GAAG,SAAbA,UAAa,CAACH,IAAD,EAAyBI,SAAzB,EAAwDC,KAAxD,EAA0E;AAC3F,UAAQL,IAAR;AACE,SAAKF,IAAI,CAACQ,MAAV;AACE,aAAOT,mBAAmB,CAACO,SAAD,EAAYC,KAAZ,CAA1B;;AACF,SAAKP,IAAI,CAACI,MAAV;AACE,aAAOR,iBAAiB,CAACU,SAAD,EAAYC,KAAZ,CAAxB;;AACF,SAAKP,IAAI,CAACG,KAAV;AACA;AACE,aAAON,iBAAiB,CAACS,SAAD,EAAYC,KAAZ,CAAxB;AAPJ;AASD,CAVD;;AAYA,OAAO,IAAME,kBAAkB,GAAGf,MAAM,CAACgB,KAAV,wFAC3B,UAACC,KAAD;AAAA,SAAWN,UAAU,CAACM,KAAK,CAACT,IAAP,EAAaJ,kBAAkB,CAACc,IAAhC,EAAsCjB,MAAM,CAACkB,WAA7C,CAArB;AAAA,CAD2B,EAE3B,UAACF,KAAD;AAAA,SAAWV,WAAW,CAACU,KAAK,CAACT,IAAP,CAAtB;AAAA,CAF2B,CAAxB;AAKP,OAAO,IAAMY,mBAAmB,GAAGpB,MAAM,CAACqB,GAAV,qTAO1B,UAACJ,KAAD;AAAA,SAAWN,UAAU,CAACM,KAAK,CAACT,IAAP,EAAaJ,kBAAkB,CAACkB,OAAhC,EAAyCrB,MAAM,CAACsB,WAAhD,CAArB;AAAA,CAP0B,EAQ1B,UAACN,KAAD;AAAA,SAAWV,WAAW,CAACU,KAAK,CAACT,IAAP,CAAtB;AAAA,CAR0B,EAY1B,UAACS,KAAD;AAAA,SAAWV,WAAW,CAACU,KAAK,CAACT,IAAP,CAAtB;AAAA,CAZ0B,EAgBnBP,MAAM,CAACuB,WAhBY,EAmBnBvB,MAAM,CAACwB,WAnBY,CAAzB","sourcesContent":["import styled from 'styled-components';\nimport { COLORS, ComponentMStyling, ComponentSStyling, ComponentTextStyle, ComponentXXSStyling } from '../styles';\nimport { Size } from '../types';\n\nconst marginRight = (size: Size | undefined) => {\n  return size == Size.Small || size == Size.Medium ? 'margin-right: 8px;' : 'margin-right: 4px;';\n};\n\nconst FontStyles = (size: Size | undefined, textStyle: ComponentTextStyle, color: string) => {\n  switch (size) {\n    case Size.XSmall:\n      return ComponentXXSStyling(textStyle, color);\n    case Size.Medium:\n      return ComponentMStyling(textStyle, color);\n    case Size.Small:\n    default:\n      return ComponentSStyling(textStyle, color);\n  }\n};\n\nexport const LastBreadcrumbItem = styled.label<{ size: Size }>`\n  ${(props) => FontStyles(props.size, ComponentTextStyle.Bold, COLORS.neutral_800)}\n  ${(props) => marginRight(props.size)}\n`;\n\nexport const BreadcrumbContainer = styled.div<{ size: Size | undefined }>`\n  display: flex;\n  align-items: center;\n  min-height: 48px;\n\n  a {\n    text-decoration: none;\n    ${(props) => FontStyles(props.size, ComponentTextStyle.Regular, COLORS.neutral_600)}\n    ${(props) => marginRight(props.size)}\n  }\n\n  .chevronicon {\n    ${(props) => marginRight(props.size)}\n  }\n\n  a:hover {\n    color: ${COLORS.primary_700};\n  }\n  a:active {\n    color: ${COLORS.primary_800};\n  }\n`;\n"],"file":"styles.js"}

package/dist/Button/DualFunctionButton.cjs

@@ -156,6 +156,7 @@ var DualFunctionButton = function DualFunctionButton(_ref) {
           setKeyboardNavigated(true);
         }
       },
+      testId: 'options_toggleBtn',
       ref: dropdownButtonRef,
       disabled: disabled,
       type: type,

package/dist/Button/DualFunctionButton.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Button/DualFunctionButton.tsx"],"names":["ButtonsContainer","styled","div","props","size","Size","Large","Medium","DualFunctionButton","children","variant","type","width","testId","disabled","id","dropdownMenuValues","setDropdownMenuValues","dropdownCustomizationProps","loading","icon","onClick","renderProps","React","useState","isOpen","setIsOpen","focused","setFocused","keyboardNavigated","setKeyboardNavigated","dropdownContainerRef","useRef","selectedValues","setSelectedValues","dropdownContentRef","dropdownButtonRef","useEffect","itemsType","e","key","stopPropagation"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;;;;;;;;AAEA,IAAMA,gBAAgB,GAAGC,0BAAOC,GAAV,yPAUP,UAAAC,KAAK;AAAA,SAAIA,KAAK,CAACC,IAAN,IAAcC,YAAKC,KAAnB,GAA2B,UAA3B,GAAwCH,KAAK,CAACC,IAAN,IAAcC,YAAKE,MAAnB,GAA4B,UAA5B,GAAyC,UAArF;AAAA,CAVE,CAAtB;;AAwBA,IAAMC,kBAA4D,GAAG,SAA/DA,kBAA+D,OAaO;AAAA,2BAZJC,QAYI;AAAA,MAZJA,QAYI,8BAZO,gBAYP;AAAA,0BAXJC,OAWI;AAAA,MAXJA,OAWI,6BAXM,SAWN;AAAA,uBAVJC,IAUI;AAAA,MAVJA,IAUI,0BAVG,QAUH;AAAA,uBATJP,IASI;AAAA,MATJA,IASI,0BATGC,YAAKE,MASR;AAAA,wBARJK,KAQI;AAAA,MARJA,KAQI,2BARI,MAQJ;AAAA,MAPJC,MAOI,QAPJA,MAOI;AAAA,MANJC,QAMI,QANJA,QAMI;AAAA,MALJC,EAKI,QALJA,EAKI;AAAA,MAJJC,kBAII,QAJJA,kBAII;AAAA,MAHJC,qBAGI,QAHJA,qBAGI;AAAA,MAFJC,0BAEI,QAFJA,0BAEI;AAAA,MADDf,KACC;AAC1E;AACA,MAAOgB,OAAP,GAAiDhB,KAAjD,CAAOgB,OAAP;AAAA,MAAgBC,IAAhB,GAAiDjB,KAAjD,CAAgBiB,IAAhB;AAAA,MAAsBC,OAAtB,GAAiDlB,KAAjD,CAAsBkB,OAAtB;AAAA,MAAkCC,WAAlC,0CAAiDnB,KAAjD;;AACA,wBAA4BoB,KAAK,CAACC,QAAN,CAAwB,KAAxB,CAA5B;AAAA;AAAA,MAAOC,MAAP;AAAA,MAAeC,SAAf;;AACA,yBAA8BH,KAAK,CAACC,QAAN,CAA8B,IAA9B,CAA9B;AAAA;AAAA,MAAOG,OAAP;AAAA,MAAgBC,UAAhB;;AACA,yBAAkDL,KAAK,CAACC,QAAN,CAAwB,KAAxB,CAAlD;AAAA;AAAA,MAAOK,iBAAP;AAAA,MAA0BC,oBAA1B;;AACA,MAAMC,oBAAoB,GAAGR,KAAK,CAACS,MAAN,CAA6B,IAA7B,CAA7B;;AACA,yBAA4CT,KAAK,CAACC,QAAN,CAAyB,EAAzB,CAA5C;AAAA;AAAA,MAAOS,cAAP;AAAA,MAAuBC,iBAAvB;;AAEA,MAAMC,kBAAkB,GAAGZ,KAAK,CAACS,MAAN,CAA6B,IAA7B,CAA3B;AACA,MAAMI,iBAAiB,GAAG,gCAAmB;AAAA,WAAMV,SAAS,CAAC,KAAD,CAAf;AAAA,GAAnB,EAA2C,CAACK,oBAAD,CAA3C,EAAmE,gCAAmB;AAAA,WAAML,SAAS,CAAC,KAAD,CAAf;AAAA,GAAnB,EAA2C,CAACS,kBAAD,CAA3C,CAAnE,CAA1B;AAEAZ,EAAAA,KAAK,CAACc,SAAN,CAAgB,YAAM;AAAE,KAACZ,MAAD,IAAWK,oBAAoB,CAAC,KAAD,CAA/B;AAAyC,GAAjE,EAAmE,CAACL,MAAD,CAAnE;AAEA,sBAAO,sBAAC,gBAAD;AAAkB,IAAA,GAAG,EAAEM,oBAAvB;AAA6C,IAAA,IAAI,EAAE3B,IAAnD;AAAA,4BACL,sBAAC,uBAAD;AAAU,MAAA,QAAQ,EAAE,IAApB;AAA0B,MAAA,QAAQ,EAAE,KAApC;AAA2C,MAAA,QAAQ,EAAE,KAArD;AAA4D,MAAA,MAAM,EAAC,EAAnE;AAAA,8BACE,qBAAC,eAAD,kCACMkB,WADN;AAEE,QAAA,OAAO,EAAED,OAFX;AAGE,QAAA,QAAQ,EAAEP,QAHZ;AAIE,QAAA,IAAI,EAAEH,IAJR;AAKE,QAAA,OAAO,EAAEQ,OALX;AAME,QAAA,IAAI,EAAEC,IANR;AAOE,QAAA,IAAI,EAAEhB,IAPR;AAQE,QAAA,KAAK,EAAEQ,KART;AASE,QAAA,OAAO,EAAEF,OATX;AAUE,QAAA,QAAQ,EAAC,OAVX;AAAA,kBAWGD;AAXH,SADF,eAcE,qBAAC,wBAAD;AACE,QAAA,kBAAkB,EAAES,0BADtB;AAEE,QAAA,MAAM,EAAC,EAFT;AAGE,QAAA,GAAG,EAAEiB,kBAHP;AAIE,QAAA,cAAc,EAAEjB,0BAA0B,CAACoB,SAA3B,IAAwC,QAAxC,GAAmD,EAAnD,GAAyDtB,kBAAzD,aAAyDA,kBAAzD,cAAyDA,kBAAzD,GAA+EiB,cAJjG;AAKE,QAAA,iBAAiB,EAAEhB,qBAAqB,GAAGA,qBAAH,GAA2BiB,iBALrE;AAME,QAAA,QAAQ,EAAE,IANZ;AAOE,QAAA,SAAS,EAAER,SAPb;AAQE,QAAA,OAAO,EAAEC,OARX;AASE,QAAA,UAAU,EAAEC,UATd;AAUE,QAAA,IAAI,EAAExB,IAVR;AAWE,QAAA,OAAO,EAAEyB,iBAXX;AAYE,QAAA,MAAM,EAAEJ,MAZV;AAaE,QAAA,EAAE,EAAEV,EAAF,aAAEA,EAAF,cAAEA,EAAF,GAAQ,YAbZ;AAcE,QAAA,kBAAkB,EAAC,EAdrB;AAeE,QAAA,SAAS,EAAE;AAfb,QAdF;AAAA,MADK,eAgCL,qBAAC,eAAD;AAAQ,MAAA,OAAO,EAAEL;AAAjB,OACYY,WADZ;AAEQ,MAAA,UAAU,EAAE,oBAACiB,CAAD,EAAW;AACrB,YAAGd,MAAH,EACE;;AAEF,YAAIc,CAAC,CAACC,GAAF,KAAU,OAAV,IAAqBD,CAAC,CAACC,GAAF,KAAU,GAAnC,EAAuC;AACrCZ,UAAAA,UAAU,CAAC,CAAD,CAAV;AACAE,UAAAA,oBAAoB,CAAC,IAAD,CAApB;AACD;AACF,OAVT;AAWQ,MAAA,GAAG,EAAEM,iBAXb;AAYQ,MAAA,QAAQ,EAAEtB,QAZlB;AAaQ,MAAA,IAAI,EAAEH,IAbd;AAcQ,MAAA,IAAI,EAAEP,IAdd;AAeQ,MAAA,QAAQ,EAAE,OAflB;AAgBQ,MAAA,OAAO,EAAE,iBAACmC,CAAD,EAAQ;AAACA,QAAAA,CAAC,CAACE,eAAF;AAAqBf,QAAAA,SAAS,CAAC,CAACD,MAAF,CAAT;AAAoB,OAhBnE;AAiBQ,MAAA,IAAI,EAAEA,MAAM,gBAAG,qBAAC,wBAAD;AAAa,QAAA,IAAI,EAAC;AAAlB,QAAH,gBAAgC,qBAAC,0BAAD;AAAe,QAAA,IAAI,EAAC;AAApB,QAjBpD;AAkBQ,MAAA,QAAQ,EAAC;AAlBjB,OAhCK;AAAA,IAAP;AAoDD,CA/ED;;;AAJET,EAAAA,kB;AACAC,EAAAA,qB;;eAqFaT,kB","sourcesContent":["import * as React from 'react';\nimport Button, {ButtonProps} from './Button'\nimport {ArrowDropDown, ArrowDropUp} from '../icons/systemicons/SystemIcons';\nimport {Dropdown} from '../Dropdown/CommonStyling';\nimport {Size} from '../types';\nimport DropdownContent, {DropdownCustomizationProps} from '../Dropdown/DropdownContent';\nimport styled from 'styled-components';\nimport {useClickOutsideRef, useFocusOutsideRef} from '../common';\n\nconst ButtonsContainer = styled.div<{ size?: Size }>`\n  display: flex;\n  align-items: center;\n\n  button:first-child {\n    margin-right: 2px;\n  }\n\n  div.button-content {\n    gap: 0px;\n    padding: ${props => props.size == Size.Large ? '4px 18px' : props.size == Size.Medium ? '4px 14px' : '4px 10px'};\n  }\n`;\n\nexport interface ButtonOption {\n  label: string;\n}\n\nexport interface DualButtonProps extends ButtonProps {\n  dropdownCustomizationProps: DropdownCustomizationProps;\n  dropdownMenuValues?: string[];\n  setDropdownMenuValues?: (values: string[]) => void | boolean | undefined;\n}\n\nconst DualFunctionButton: React.FunctionComponent<DualButtonProps> = ({\n                                                                        children = 'Primary Button',\n                                                                        variant = 'primary',\n                                                                        type = 'button',\n                                                                        size = Size.Medium,\n                                                                        width = 'auto',\n                                                                        testId,\n                                                                        disabled,\n                                                                        id,\n                                                                        dropdownMenuValues,\n                                                                        setDropdownMenuValues,\n                                                                        dropdownCustomizationProps,\n                                                                        ...props\n                                                                      }) => {\n  // Let's filter out properties that we don't need to render.\n  const {loading, icon, onClick, ...renderProps} = props;\n  const [isOpen, setIsOpen] = React.useState<boolean>(false);\n  const [focused, setFocused] = React.useState<number | null>(null);\n  const [keyboardNavigated, setKeyboardNavigated] = React.useState<boolean>(false);\n  const dropdownContainerRef = React.useRef<HTMLDivElement>(null);\n  const [selectedValues, setSelectedValues] = React.useState<string[]>([]);\n\n  const dropdownContentRef = React.useRef<HTMLDivElement>(null);\n  const dropdownButtonRef = useClickOutsideRef(() => setIsOpen(false), [dropdownContainerRef], useFocusOutsideRef(() => setIsOpen(false), [dropdownContentRef]));\n\n  React.useEffect(() => { !isOpen && setKeyboardNavigated(false); }, [isOpen]);\n\n  return <ButtonsContainer ref={dropdownContainerRef} size={size}>\n    <Dropdown isButton={true} readOnly={false} disabled={false} margin=\"\">\n      <Button\n        {...renderProps}\n        onClick={onClick}\n        disabled={disabled}\n        type={type}\n        loading={loading}\n        icon={icon}\n        size={size}\n        width={width}\n        variant={variant}\n        flatEdge=\"right\">\n        {children}\n      </Button>\n      <DropdownContent\n        customizationProps={dropdownCustomizationProps}\n        filter=\"\"\n        ref={dropdownContentRef}\n        selectedValues={dropdownCustomizationProps.itemsType == 'normal' ? [] : (dropdownMenuValues ?? selectedValues)}\n        setSelectedValues={setDropdownMenuValues ? setDropdownMenuValues : setSelectedValues}\n        isButton={true}\n        setIsOpen={setIsOpen}\n        focused={focused}\n        setFocused={setFocused}\n        size={size}\n        outline={keyboardNavigated}\n        isOpen={isOpen}\n        id={id ?? 'dropdownId'}\n        messageOnNoResults=\"\"\n        alignLeft={true}/>\n    </Dropdown>\n    <Button variant={variant}\n            {...renderProps}\n            onKeyPress={(e:any) => {\n              if(isOpen)\n                return;\n\n              if (e.key === 'Enter' || e.key === ' '){\n                setFocused(0);\n                setKeyboardNavigated(true);\n              }\n            }}\n            ref={dropdownButtonRef}\n            disabled={disabled}\n            type={type}\n            size={size}\n            minWidth={'unset'}\n            onClick={(e) =>  {e.stopPropagation(); setIsOpen(!isOpen);}}\n            icon={isOpen ? <ArrowDropUp size=\"16px\"/> : <ArrowDropDown size=\"16px\"/>}\n            flatEdge=\"left\"/>\n  </ButtonsContainer>;\n};\n\n\nexport default DualFunctionButton;\n"],"file":"DualFunctionButton.cjs"}
+{"version":3,"sources":["../../src/Button/DualFunctionButton.tsx"],"names":["ButtonsContainer","styled","div","props","size","Size","Large","Medium","DualFunctionButton","children","variant","type","width","testId","disabled","id","dropdownMenuValues","setDropdownMenuValues","dropdownCustomizationProps","loading","icon","onClick","renderProps","React","useState","isOpen","setIsOpen","focused","setFocused","keyboardNavigated","setKeyboardNavigated","dropdownContainerRef","useRef","selectedValues","setSelectedValues","dropdownContentRef","dropdownButtonRef","useEffect","itemsType","e","key","stopPropagation"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport Button, { ButtonProps } from './Button';\nimport { ArrowDropDown, ArrowDropUp } from '../icons/systemicons/SystemIcons';\nimport { Dropdown } from '../Dropdown/CommonStyling';\nimport { Size } from '../types';\nimport DropdownContent, { DropdownCustomizationProps } from '../Dropdown/DropdownContent';\nimport styled from 'styled-components';\nimport { useClickOutsideRef, useFocusOutsideRef } from '../common';\n\nconst ButtonsContainer = styled.div<{ size?: Size }>`\n  display: flex;\n  align-items: center;\n\n  button:first-child {\n    margin-right: 2px;\n  }\n\n  div.button-content {\n    gap: 0px;\n    padding: ${(props) => (props.size == Size.Large ? '4px 18px' : props.size == Size.Medium ? '4px 14px' : '4px 10px')};\n  }\n`;\n\nexport interface ButtonOption {\n  label: string;\n}\n\nexport interface DualButtonProps extends ButtonProps {\n  dropdownCustomizationProps: DropdownCustomizationProps;\n  dropdownMenuValues?: string[];\n  setDropdownMenuValues?: (values: string[]) => void | boolean | undefined;\n}\n\nconst DualFunctionButton: React.FunctionComponent<DualButtonProps> = ({\n  children = 'Primary Button',\n  variant = 'primary',\n  type = 'button',\n  size = Size.Medium,\n  width = 'auto',\n  testId,\n  disabled,\n  id,\n  dropdownMenuValues,\n  setDropdownMenuValues,\n  dropdownCustomizationProps,\n  ...props\n}) => {\n  // Let's filter out properties that we don't need to render.\n  const { loading, icon, onClick, ...renderProps } = props;\n  const [isOpen, setIsOpen] = React.useState<boolean>(false);\n  const [focused, setFocused] = React.useState<number | null>(null);\n  const [keyboardNavigated, setKeyboardNavigated] = React.useState<boolean>(false);\n  const dropdownContainerRef = React.useRef<HTMLDivElement>(null);\n  const [selectedValues, setSelectedValues] = React.useState<string[]>([]);\n\n  const dropdownContentRef = React.useRef<HTMLDivElement>(null);\n  const dropdownButtonRef = useClickOutsideRef(\n    () => setIsOpen(false),\n    [dropdownContainerRef],\n    useFocusOutsideRef(() => setIsOpen(false), [dropdownContentRef]),\n  );\n\n  React.useEffect(() => {\n    !isOpen && setKeyboardNavigated(false);\n  }, [isOpen]);\n\n  return (\n    <ButtonsContainer ref={dropdownContainerRef} size={size}>\n      <Dropdown isButton={true} readOnly={false} disabled={false} margin=\"\">\n        <Button {...renderProps} onClick={onClick} disabled={disabled} type={type} loading={loading} icon={icon} size={size} width={width} variant={variant} flatEdge=\"right\">\n          {children}\n        </Button>\n        <DropdownContent\n          customizationProps={dropdownCustomizationProps}\n          filter=\"\"\n          ref={dropdownContentRef}\n          selectedValues={dropdownCustomizationProps.itemsType == 'normal' ? [] : dropdownMenuValues ?? selectedValues}\n          setSelectedValues={setDropdownMenuValues ? setDropdownMenuValues : setSelectedValues}\n          isButton={true}\n          setIsOpen={setIsOpen}\n          focused={focused}\n          setFocused={setFocused}\n          size={size}\n          outline={keyboardNavigated}\n          isOpen={isOpen}\n          id={id ?? 'dropdownId'}\n          messageOnNoResults=\"\"\n          alignLeft={true}\n        />\n      </Dropdown>\n      <Button\n        variant={variant}\n        {...renderProps}\n        onKeyPress={(e: any) => {\n          if (isOpen) return;\n\n          if (e.key === 'Enter' || e.key === ' ') {\n            setFocused(0);\n            setKeyboardNavigated(true);\n          }\n        }}\n        testId={'options_toggleBtn'}\n        ref={dropdownButtonRef}\n        disabled={disabled}\n        type={type}\n        size={size}\n        minWidth={'unset'}\n        onClick={(e) => {\n          e.stopPropagation();\n          setIsOpen(!isOpen);\n        }}\n        icon={isOpen ? <ArrowDropUp size=\"16px\" /> : <ArrowDropDown size=\"16px\" />}\n        flatEdge=\"left\"\n      />\n    </ButtonsContainer>\n  );\n};\n\nexport default DualFunctionButton;\n"],"file":"DualFunctionButton.cjs"}

package/dist/Button/DualFunctionButton.js

@@ -129,6 +129,7 @@ var DualFunctionButton = function DualFunctionButton(_ref) {
           setKeyboardNavigated(true);
         }
       },
+      testId: 'options_toggleBtn',
       ref: dropdownButtonRef,
       disabled: disabled,
       type: type,

package/dist/Button/DualFunctionButton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Button/DualFunctionButton.tsx"],"names":["React","Button","ArrowDropDown","ArrowDropUp","Dropdown","Size","DropdownContent","styled","useClickOutsideRef","useFocusOutsideRef","ButtonsContainer","div","props","size","Large","Medium","DualFunctionButton","children","variant","type","width","testId","disabled","id","dropdownMenuValues","setDropdownMenuValues","dropdownCustomizationProps","loading","icon","onClick","renderProps","useState","isOpen","setIsOpen","focused","setFocused","keyboardNavigated","setKeyboardNavigated","dropdownContainerRef","useRef","selectedValues","setSelectedValues","dropdownContentRef","dropdownButtonRef","useEffect","itemsType","e","key","stopPropagation"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport Button, {ButtonProps} from './Button'\nimport {ArrowDropDown, ArrowDropUp} from '../icons/systemicons/SystemIcons';\nimport {Dropdown} from '../Dropdown/CommonStyling';\nimport {Size} from '../types';\nimport DropdownContent, {DropdownCustomizationProps} from '../Dropdown/DropdownContent';\nimport styled from 'styled-components';\nimport {useClickOutsideRef, useFocusOutsideRef} from '../common';\n\nconst ButtonsContainer = styled.div<{ size?: Size }>`\n  display: flex;\n  align-items: center;\n\n  button:first-child {\n    margin-right: 2px;\n  }\n\n  div.button-content {\n    gap: 0px;\n    padding: ${props => props.size == Size.Large ? '4px 18px' : props.size == Size.Medium ? '4px 14px' : '4px 10px'};\n  }\n`;\n\nexport interface ButtonOption {\n  label: string;\n}\n\nexport interface DualButtonProps extends ButtonProps {\n  dropdownCustomizationProps: DropdownCustomizationProps;\n  dropdownMenuValues?: string[];\n  setDropdownMenuValues?: (values: string[]) => void | boolean | undefined;\n}\n\nconst DualFunctionButton: React.FunctionComponent<DualButtonProps> = ({\n                                                                        children = 'Primary Button',\n                                                                        variant = 'primary',\n                                                                        type = 'button',\n                                                                        size = Size.Medium,\n                                                                        width = 'auto',\n                                                                        testId,\n                                                                        disabled,\n                                                                        id,\n                                                                        dropdownMenuValues,\n                                                                        setDropdownMenuValues,\n                                                                        dropdownCustomizationProps,\n                                                                        ...props\n                                                                      }) => {\n  // Let's filter out properties that we don't need to render.\n  const {loading, icon, onClick, ...renderProps} = props;\n  const [isOpen, setIsOpen] = React.useState<boolean>(false);\n  const [focused, setFocused] = React.useState<number | null>(null);\n  const [keyboardNavigated, setKeyboardNavigated] = React.useState<boolean>(false);\n  const dropdownContainerRef = React.useRef<HTMLDivElement>(null);\n  const [selectedValues, setSelectedValues] = React.useState<string[]>([]);\n\n  const dropdownContentRef = React.useRef<HTMLDivElement>(null);\n  const dropdownButtonRef = useClickOutsideRef(() => setIsOpen(false), [dropdownContainerRef], useFocusOutsideRef(() => setIsOpen(false), [dropdownContentRef]));\n\n  React.useEffect(() => { !isOpen && setKeyboardNavigated(false); }, [isOpen]);\n\n  return <ButtonsContainer ref={dropdownContainerRef} size={size}>\n    <Dropdown isButton={true} readOnly={false} disabled={false} margin=\"\">\n      <Button\n        {...renderProps}\n        onClick={onClick}\n        disabled={disabled}\n        type={type}\n        loading={loading}\n        icon={icon}\n        size={size}\n        width={width}\n        variant={variant}\n        flatEdge=\"right\">\n        {children}\n      </Button>\n      <DropdownContent\n        customizationProps={dropdownCustomizationProps}\n        filter=\"\"\n        ref={dropdownContentRef}\n        selectedValues={dropdownCustomizationProps.itemsType == 'normal' ? [] : (dropdownMenuValues ?? selectedValues)}\n        setSelectedValues={setDropdownMenuValues ? setDropdownMenuValues : setSelectedValues}\n        isButton={true}\n        setIsOpen={setIsOpen}\n        focused={focused}\n        setFocused={setFocused}\n        size={size}\n        outline={keyboardNavigated}\n        isOpen={isOpen}\n        id={id ?? 'dropdownId'}\n        messageOnNoResults=\"\"\n        alignLeft={true}/>\n    </Dropdown>\n    <Button variant={variant}\n            {...renderProps}\n            onKeyPress={(e:any) => {\n              if(isOpen)\n                return;\n\n              if (e.key === 'Enter' || e.key === ' '){\n                setFocused(0);\n                setKeyboardNavigated(true);\n              }\n            }}\n            ref={dropdownButtonRef}\n            disabled={disabled}\n            type={type}\n            size={size}\n            minWidth={'unset'}\n            onClick={(e) =>  {e.stopPropagation(); setIsOpen(!isOpen);}}\n            icon={isOpen ? <ArrowDropUp size=\"16px\"/> : <ArrowDropDown size=\"16px\"/>}\n            flatEdge=\"left\"/>\n  </ButtonsContainer>;\n};\n\n\nexport default DualFunctionButton;\n"],"file":"DualFunctionButton.js"}
+{"version":3,"sources":["../../src/Button/DualFunctionButton.tsx"],"names":["React","Button","ArrowDropDown","ArrowDropUp","Dropdown","Size","DropdownContent","styled","useClickOutsideRef","useFocusOutsideRef","ButtonsContainer","div","props","size","Large","Medium","DualFunctionButton","children","variant","type","width","testId","disabled","id","dropdownMenuValues","setDropdownMenuValues","dropdownCustomizationProps","loading","icon","onClick","renderProps","useState","isOpen","setIsOpen","focused","setFocused","keyboardNavigated","setKeyboardNavigated","dropdownContainerRef","useRef","selectedValues","setSelectedValues","dropdownContentRef","dropdownButtonRef","useEffect","itemsType","e","key","stopPropagation"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport Button, { ButtonProps } from './Button';\nimport { ArrowDropDown, ArrowDropUp } from '../icons/systemicons/SystemIcons';\nimport { Dropdown } from '../Dropdown/CommonStyling';\nimport { Size } from '../types';\nimport DropdownContent, { DropdownCustomizationProps } from '../Dropdown/DropdownContent';\nimport styled from 'styled-components';\nimport { useClickOutsideRef, useFocusOutsideRef } from '../common';\n\nconst ButtonsContainer = styled.div<{ size?: Size }>`\n  display: flex;\n  align-items: center;\n\n  button:first-child {\n    margin-right: 2px;\n  }\n\n  div.button-content {\n    gap: 0px;\n    padding: ${(props) => (props.size == Size.Large ? '4px 18px' : props.size == Size.Medium ? '4px 14px' : '4px 10px')};\n  }\n`;\n\nexport interface ButtonOption {\n  label: string;\n}\n\nexport interface DualButtonProps extends ButtonProps {\n  dropdownCustomizationProps: DropdownCustomizationProps;\n  dropdownMenuValues?: string[];\n  setDropdownMenuValues?: (values: string[]) => void | boolean | undefined;\n}\n\nconst DualFunctionButton: React.FunctionComponent<DualButtonProps> = ({\n  children = 'Primary Button',\n  variant = 'primary',\n  type = 'button',\n  size = Size.Medium,\n  width = 'auto',\n  testId,\n  disabled,\n  id,\n  dropdownMenuValues,\n  setDropdownMenuValues,\n  dropdownCustomizationProps,\n  ...props\n}) => {\n  // Let's filter out properties that we don't need to render.\n  const { loading, icon, onClick, ...renderProps } = props;\n  const [isOpen, setIsOpen] = React.useState<boolean>(false);\n  const [focused, setFocused] = React.useState<number | null>(null);\n  const [keyboardNavigated, setKeyboardNavigated] = React.useState<boolean>(false);\n  const dropdownContainerRef = React.useRef<HTMLDivElement>(null);\n  const [selectedValues, setSelectedValues] = React.useState<string[]>([]);\n\n  const dropdownContentRef = React.useRef<HTMLDivElement>(null);\n  const dropdownButtonRef = useClickOutsideRef(\n    () => setIsOpen(false),\n    [dropdownContainerRef],\n    useFocusOutsideRef(() => setIsOpen(false), [dropdownContentRef]),\n  );\n\n  React.useEffect(() => {\n    !isOpen && setKeyboardNavigated(false);\n  }, [isOpen]);\n\n  return (\n    <ButtonsContainer ref={dropdownContainerRef} size={size}>\n      <Dropdown isButton={true} readOnly={false} disabled={false} margin=\"\">\n        <Button {...renderProps} onClick={onClick} disabled={disabled} type={type} loading={loading} icon={icon} size={size} width={width} variant={variant} flatEdge=\"right\">\n          {children}\n        </Button>\n        <DropdownContent\n          customizationProps={dropdownCustomizationProps}\n          filter=\"\"\n          ref={dropdownContentRef}\n          selectedValues={dropdownCustomizationProps.itemsType == 'normal' ? [] : dropdownMenuValues ?? selectedValues}\n          setSelectedValues={setDropdownMenuValues ? setDropdownMenuValues : setSelectedValues}\n          isButton={true}\n          setIsOpen={setIsOpen}\n          focused={focused}\n          setFocused={setFocused}\n          size={size}\n          outline={keyboardNavigated}\n          isOpen={isOpen}\n          id={id ?? 'dropdownId'}\n          messageOnNoResults=\"\"\n          alignLeft={true}\n        />\n      </Dropdown>\n      <Button\n        variant={variant}\n        {...renderProps}\n        onKeyPress={(e: any) => {\n          if (isOpen) return;\n\n          if (e.key === 'Enter' || e.key === ' ') {\n            setFocused(0);\n            setKeyboardNavigated(true);\n          }\n        }}\n        testId={'options_toggleBtn'}\n        ref={dropdownButtonRef}\n        disabled={disabled}\n        type={type}\n        size={size}\n        minWidth={'unset'}\n        onClick={(e) => {\n          e.stopPropagation();\n          setIsOpen(!isOpen);\n        }}\n        icon={isOpen ? <ArrowDropUp size=\"16px\" /> : <ArrowDropDown size=\"16px\" />}\n        flatEdge=\"left\"\n      />\n    </ButtonsContainer>\n  );\n};\n\nexport default DualFunctionButton;\n"],"file":"DualFunctionButton.js"}

package/dist/Card/HorizontalCard/HorizontalCard.cjs

@@ -31,7 +31,7 @@ var _templateObject, _templateObject2;
 
 var ContentContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  position: relative;\n  display: flex;\n  flex: 1;\n  flex-direction: row;\n  align-items: center;\n  background-color: ", ";\n  border-radius: 8px;\n"])), _styles.COLORS.white);
 
-var Container = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  flex: 1;\n\n  &.outline {\n    ", " {\n      box-shadow: inset 0 0 0 1px ", ";\n    }\n  }\n\n  &.elevated {\n    ", " {\n      box-shadow: ", ";\n    }\n  }\n\n  &.clickable {\n    cursor: pointer;\n\n    &:hover:not(.action-within):not(.disabled) {\n      &.outline {\n        ", " {\n          background-color: ", ";\n        }\n      }\n\n      &.elevated {\n        ", " {\n          box-shadow: ", ";\n        }\n      }\n    }\n\n    &:active:not(.action-within):not(.disabled) {\n      &.outline {\n        ", " {\n          background-color: ", ";\n        }\n      }\n\n      &.elevated {\n        ", " {\n          box-shadow: ", ";\n        }\n      }\n    }\n\n    &:focus {\n      ", "\n    }\n  }\n\n  &.disabled {\n    cursor: not-allowed;\n\n    ", " {\n      box-shadow: none;\n    }\n  }\n\n"])), ContentContainer, _styles.COLORS.neutral_200, ContentContainer, _styles.BOXSHADOWS.BOXSHADOW_L1, ContentContainer, _styles.COLORS.primary_20, ContentContainer, _styles.BOXSHADOWS.BOXSHADOW_L3, ContentContainer, _styles.COLORS.primary_100, ContentContainer, _styles.BOXSHADOWS.BOXSHADOW_L2, _styles.focusStyles, ContentContainer);
+var Container = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  flex: 1;\n\n  &.outline {\n    ", " {\n      box-shadow: inset 0 0 0 1px ", ";\n    }\n  }\n\n  &.elevated {\n    ", " {\n      box-shadow: ", ";\n    }\n  }\n\n  &.clickable {\n    cursor: pointer;\n\n    &:hover:not(.action-within):not(.disabled) {\n      &.outline {\n        ", " {\n          background-color: ", ";\n        }\n      }\n\n      &.elevated {\n        ", " {\n          box-shadow: ", ";\n        }\n      }\n    }\n\n    &:active:not(.action-within):not(.disabled) {\n      &.outline {\n        ", " {\n          background-color: ", ";\n        }\n      }\n\n      &.elevated {\n        ", " {\n          box-shadow: ", ";\n        }\n      }\n    }\n\n    &:focus {\n      ", "\n    }\n  }\n\n  &.disabled {\n    cursor: not-allowed;\n\n    &.elevated {\n      ", " {\n        box-shadow: ", ";\n      }\n    }\n\n    &.outline {\n      ", " {\n        box-shadow: inset 0 0 0 1px ", ";\n      }\n    }\n  }\n"])), ContentContainer, _styles.COLORS.neutral_200, ContentContainer, _styles.BOXSHADOWS.BOXSHADOW_L1, ContentContainer, _styles.COLORS.primary_20, ContentContainer, _styles.BOXSHADOWS.BOXSHADOW_L3, ContentContainer, _styles.COLORS.primary_100, ContentContainer, _styles.BOXSHADOWS.BOXSHADOW_L2, _styles.focusStyles, ContentContainer, _styles.BOXSHADOWS.BOXSHADOW_L1, ContentContainer, _styles.COLORS.neutral_100);
 
 var HorizontalCard = function HorizontalCard(_ref) {
   var title = _ref.title,