@laerdal/life-react-components 3.0.1-dev.9.full → 3.1.0-dev.1

package/dist/Breadcrumb/BreadcrumbItem.d.ts

@@ -1,4 +1,4 @@
-export interface BreadcrumbItem {
-    label: string;
-    url: string;
-}
+export interface BreadcrumbItem {
+    label: string;
+    url: string;
+}

package/dist/Breadcrumb/BreadcrumbItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"BreadcrumbItem.js","names":[],"sources":["../../src/Breadcrumb/BreadcrumbItem.tsx"],"sourcesContent":["export interface BreadcrumbItem {\r\n    label: string;\r\n    url: string;\r\n}\r\n  "],"mappings":""}
+{"version":3,"file":"BreadcrumbItem.js","names":[],"sources":["../../src/Breadcrumb/BreadcrumbItem.tsx"],"sourcesContent":["export interface BreadcrumbItem {\n    label: string;\n    url: string;\n}\n  "],"mappings":""}

package/dist/Breadcrumb/index.cjs

@@ -1,14 +1,54 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+var _exportNames = {
+  Breadcrumb: true
+};
 Object.defineProperty(exports, "Breadcrumb", {
   enumerable: true,
   get: function get() {
     return _Breadcrumb.default;
   }
 });
-var _Breadcrumb = _interopRequireDefault(require("./Breadcrumb"));
+var _Breadcrumb = _interopRequireWildcard(require("./Breadcrumb"));
+Object.keys(_Breadcrumb).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _Breadcrumb[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _Breadcrumb[key];
+    }
+  });
+});
+var _BreadcrumbItem = require("./BreadcrumbItem");
+Object.keys(_BreadcrumbItem).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _BreadcrumbItem[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _BreadcrumbItem[key];
+    }
+  });
+});
+var _styles = require("./styles");
+Object.keys(_styles).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _styles[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _styles[key];
+    }
+  });
+});
+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; }
 //# sourceMappingURL=index.cjs.map

package/dist/Breadcrumb/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","names":[],"sources":["../../src/Breadcrumb/index.ts"],"sourcesContent":["export { default as Breadcrumb } from './Breadcrumb';\r\n"],"mappings":";;;;;;;;;;;;AAAA"}
+{"version":3,"file":"index.cjs","names":[],"sources":["../../src/Breadcrumb/index.ts"],"sourcesContent":["export { default as Breadcrumb } from './Breadcrumb';\nexport * from './Breadcrumb';\nexport * from './BreadcrumbItem';\nexport * from './styles';"],"mappings":";;;;;;;;;;;;;;;AAAA;AACA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;AACA;AAAA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;AACA;AAAA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;AAAyB;AAAA"}

package/dist/Breadcrumb/index.d.ts

@@ -1 +1,4 @@
-export { default as Breadcrumb } from './Breadcrumb';
+export { default as Breadcrumb } from './Breadcrumb';
+export * from './Breadcrumb';
+export * from './BreadcrumbItem';
+export * from './styles';

package/dist/Breadcrumb/index.js

@@ -1,2 +1,5 @@
 export { default as Breadcrumb } from './Breadcrumb';
+export * from './Breadcrumb';
+export * from './BreadcrumbItem';
+export * from './styles';
 //# sourceMappingURL=index.js.map

package/dist/Breadcrumb/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["default","Breadcrumb"],"sources":["../../src/Breadcrumb/index.ts"],"sourcesContent":["export { default as Breadcrumb } from './Breadcrumb';\r\n"],"mappings":"AAAA,SAASA,OAAO,IAAIC,UAAU,QAAQ,cAAc"}
+{"version":3,"file":"index.js","names":["default","Breadcrumb"],"sources":["../../src/Breadcrumb/index.ts"],"sourcesContent":["export { default as Breadcrumb } from './Breadcrumb';\nexport * from './Breadcrumb';\nexport * from './BreadcrumbItem';\nexport * from './styles';"],"mappings":"AAAA,SAASA,OAAO,IAAIC,UAAU,QAAQ,cAAc;AACpD,cAAc,cAAc;AAC5B,cAAc,kBAAkB;AAChC,cAAc,UAAU"}

package/dist/Breadcrumb/styles.cjs

@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.LastBreadcrumbItem = exports.BreadcrumbContainer = void 0;
+exports.BreadcrumbItemLastStyles = exports.BreadcrumbContainerStyles = void 0;
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var _styledComponents = _interopRequireDefault(require("styled-components"));
 var _styles = require("../styles");
@@ -24,18 +24,18 @@ var FontStyles = function FontStyles(size, textStyle, color) {
       return (0, _styles.ComponentSStyling)(textStyle, color);
   }
 };
-var LastBreadcrumbItem = _styledComponents.default.label(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  ", "\n  ", "\n"])), function (props) {
+var BreadcrumbItemLastStyles = _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) {
+exports.BreadcrumbItemLastStyles = BreadcrumbItemLastStyles;
+var BreadcrumbContainerStyles = _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;
+exports.BreadcrumbContainerStyles = BreadcrumbContainerStyles;
 //# sourceMappingURL=styles.cjs.map

package/dist/Breadcrumb/styles.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"styles.cjs","names":["marginRight","size","Size","Small","Medium","FontStyles","textStyle","color","XSmall","ComponentXXSStyling","ComponentMStyling","ComponentSStyling","LastBreadcrumbItem","styled","label","props","ComponentTextStyle","Bold","COLORS","neutral_800","BreadcrumbContainer","div","Regular","neutral_600","primary_700","primary_800"],"sources":["../../src/Breadcrumb/styles.ts"],"sourcesContent":["import styled from 'styled-components';\r\nimport { COLORS, ComponentMStyling, ComponentSStyling, ComponentTextStyle, ComponentXXSStyling } from '../styles';\r\nimport { Size } from '../types';\r\n\r\nconst marginRight = (size: Size | undefined) => {\r\n  return size == Size.Small || size == Size.Medium ? 'margin-right: 8px;' : 'margin-right: 4px;';\r\n};\r\n\r\nconst FontStyles = (size: Size | undefined, textStyle: ComponentTextStyle, color: string) => {\r\n  switch (size) {\r\n    case Size.XSmall:\r\n      return ComponentXXSStyling(textStyle, color);\r\n    case Size.Medium:\r\n      return ComponentMStyling(textStyle, color);\r\n    case Size.Small:\r\n    default:\r\n      return ComponentSStyling(textStyle, color);\r\n  }\r\n};\r\n\r\nexport const LastBreadcrumbItem = styled.label<{ size: Size }>`\r\n  ${(props) => FontStyles(props.size, ComponentTextStyle.Bold, COLORS.neutral_800)}\r\n  ${(props) => marginRight(props.size)}\r\n`;\r\n\r\nexport const BreadcrumbContainer = styled.div<{ size: Size | undefined }>`\r\n  display: flex;\r\n  align-items: center;\r\n  min-height: 48px;\r\n\r\n  a {\r\n    text-decoration: none;\r\n    ${(props) => FontStyles(props.size, ComponentTextStyle.Regular, COLORS.neutral_600)}\r\n    ${(props) => marginRight(props.size)}\r\n  }\r\n\r\n  .chevronicon {\r\n    ${(props) => marginRight(props.size)}\r\n  }\r\n\r\n  a:hover {\r\n    color: ${COLORS.primary_700};\r\n  }\r\n  a:active {\r\n    color: ${COLORS.primary_800};\r\n  }\r\n`;\r\n"],"mappings":";;;;;;;;AAAA;AACA;AACA;AAAgC;AAEhC,IAAMA,WAAW,GAAG,SAAdA,WAAW,CAAIC,IAAsB,EAAK;EAC9C,OAAOA,IAAI,IAAIC,WAAI,CAACC,KAAK,IAAIF,IAAI,IAAIC,WAAI,CAACE,MAAM,GAAG,oBAAoB,GAAG,oBAAoB;AAChG,CAAC;AAED,IAAMC,UAAU,GAAG,SAAbA,UAAU,CAAIJ,IAAsB,EAAEK,SAA6B,EAAEC,KAAa,EAAK;EAC3F,QAAQN,IAAI;IACV,KAAKC,WAAI,CAACM,MAAM;MACd,OAAO,IAAAC,2BAAmB,EAACH,SAAS,EAAEC,KAAK,CAAC;IAC9C,KAAKL,WAAI,CAACE,MAAM;MACd,OAAO,IAAAM,yBAAiB,EAACJ,SAAS,EAAEC,KAAK,CAAC;IAC5C,KAAKL,WAAI,CAACC,KAAK;IACf;MACE,OAAO,IAAAQ,yBAAiB,EAACL,SAAS,EAAEC,KAAK,CAAC;EAAC;AAEjD,CAAC;AAEM,IAAMK,kBAAkB,GAAGC,yBAAM,CAACC,KAAK,sGAC1C,UAACC,KAAK;EAAA,OAAKV,UAAU,CAACU,KAAK,CAACd,IAAI,EAAEe,0BAAkB,CAACC,IAAI,EAAEC,cAAM,CAACC,WAAW,CAAC;AAAA,GAC9E,UAACJ,KAAK;EAAA,OAAKf,WAAW,CAACe,KAAK,CAACd,IAAI,CAAC;AAAA,EACrC;AAAC;AAEK,IAAMmB,mBAAmB,GAAGP,yBAAM,CAACQ,GAAG,mUAOvC,UAACN,KAAK;EAAA,OAAKV,UAAU,CAACU,KAAK,CAACd,IAAI,EAAEe,0BAAkB,CAACM,OAAO,EAAEJ,cAAM,CAACK,WAAW,CAAC;AAAA,GACjF,UAACR,KAAK;EAAA,OAAKf,WAAW,CAACe,KAAK,CAACd,IAAI,CAAC;AAAA,GAIlC,UAACc,KAAK;EAAA,OAAKf,WAAW,CAACe,KAAK,CAACd,IAAI,CAAC;AAAA,GAI3BiB,cAAM,CAACM,WAAW,EAGlBN,cAAM,CAACO,WAAW,CAE9B;AAAC"}
+{"version":3,"file":"styles.cjs","names":["marginRight","size","Size","Small","Medium","FontStyles","textStyle","color","XSmall","ComponentXXSStyling","ComponentMStyling","ComponentSStyling","BreadcrumbItemLastStyles","styled","label","props","ComponentTextStyle","Bold","COLORS","neutral_800","BreadcrumbContainerStyles","div","Regular","neutral_600","primary_700","primary_800"],"sources":["../../src/Breadcrumb/styles.ts"],"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 BreadcrumbItemLastStyles = styled.label<{ size: Size }>`\n  ${(props) => FontStyles(props.size, ComponentTextStyle.Bold, COLORS.neutral_800)}\n  ${(props) => marginRight(props.size)}\n`;\n\nexport const BreadcrumbContainerStyles = 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"],"mappings":";;;;;;;;AAAA;AACA;AACA;AAAgC;AAEhC,IAAMA,WAAW,GAAG,SAAdA,WAAW,CAAIC,IAAsB,EAAK;EAC9C,OAAOA,IAAI,IAAIC,WAAI,CAACC,KAAK,IAAIF,IAAI,IAAIC,WAAI,CAACE,MAAM,GAAG,oBAAoB,GAAG,oBAAoB;AAChG,CAAC;AAED,IAAMC,UAAU,GAAG,SAAbA,UAAU,CAAIJ,IAAsB,EAAEK,SAA6B,EAAEC,KAAa,EAAK;EAC3F,QAAQN,IAAI;IACV,KAAKC,WAAI,CAACM,MAAM;MACd,OAAO,IAAAC,2BAAmB,EAACH,SAAS,EAAEC,KAAK,CAAC;IAC9C,KAAKL,WAAI,CAACE,MAAM;MACd,OAAO,IAAAM,yBAAiB,EAACJ,SAAS,EAAEC,KAAK,CAAC;IAC5C,KAAKL,WAAI,CAACC,KAAK;IACf;MACE,OAAO,IAAAQ,yBAAiB,EAACL,SAAS,EAAEC,KAAK,CAAC;EAAC;AAEjD,CAAC;AAEM,IAAMK,wBAAwB,GAAGC,yBAAM,CAACC,KAAK,sGAChD,UAACC,KAAK;EAAA,OAAKV,UAAU,CAACU,KAAK,CAACd,IAAI,EAAEe,0BAAkB,CAACC,IAAI,EAAEC,cAAM,CAACC,WAAW,CAAC;AAAA,GAC9E,UAACJ,KAAK;EAAA,OAAKf,WAAW,CAACe,KAAK,CAACd,IAAI,CAAC;AAAA,EACrC;AAAC;AAEK,IAAMmB,yBAAyB,GAAGP,yBAAM,CAACQ,GAAG,mUAO7C,UAACN,KAAK;EAAA,OAAKV,UAAU,CAACU,KAAK,CAACd,IAAI,EAAEe,0BAAkB,CAACM,OAAO,EAAEJ,cAAM,CAACK,WAAW,CAAC;AAAA,GACjF,UAACR,KAAK;EAAA,OAAKf,WAAW,CAACe,KAAK,CAACd,IAAI,CAAC;AAAA,GAIlC,UAACc,KAAK;EAAA,OAAKf,WAAW,CAACe,KAAK,CAACd,IAAI,CAAC;AAAA,GAI3BiB,cAAM,CAACM,WAAW,EAGlBN,cAAM,CAACO,WAAW,CAE9B;AAAC"}

package/dist/Breadcrumb/styles.d.ts

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

package/dist/Breadcrumb/styles.js

@@ -17,12 +17,12 @@ var FontStyles = function FontStyles(size, textStyle, color) {
       return ComponentSStyling(textStyle, color);
   }
 };
-export var LastBreadcrumbItem = styled.label(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  ", "\n  ", "\n"])), function (props) {
+export var BreadcrumbItemLastStyles = 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) {
+export var BreadcrumbContainerStyles = 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);

package/dist/Breadcrumb/styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"styles.js","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"],"sources":["../../src/Breadcrumb/styles.ts"],"sourcesContent":["import styled from 'styled-components';\r\nimport { COLORS, ComponentMStyling, ComponentSStyling, ComponentTextStyle, ComponentXXSStyling } from '../styles';\r\nimport { Size } from '../types';\r\n\r\nconst marginRight = (size: Size | undefined) => {\r\n  return size == Size.Small || size == Size.Medium ? 'margin-right: 8px;' : 'margin-right: 4px;';\r\n};\r\n\r\nconst FontStyles = (size: Size | undefined, textStyle: ComponentTextStyle, color: string) => {\r\n  switch (size) {\r\n    case Size.XSmall:\r\n      return ComponentXXSStyling(textStyle, color);\r\n    case Size.Medium:\r\n      return ComponentMStyling(textStyle, color);\r\n    case Size.Small:\r\n    default:\r\n      return ComponentSStyling(textStyle, color);\r\n  }\r\n};\r\n\r\nexport const LastBreadcrumbItem = styled.label<{ size: Size }>`\r\n  ${(props) => FontStyles(props.size, ComponentTextStyle.Bold, COLORS.neutral_800)}\r\n  ${(props) => marginRight(props.size)}\r\n`;\r\n\r\nexport const BreadcrumbContainer = styled.div<{ size: Size | undefined }>`\r\n  display: flex;\r\n  align-items: center;\r\n  min-height: 48px;\r\n\r\n  a {\r\n    text-decoration: none;\r\n    ${(props) => FontStyles(props.size, ComponentTextStyle.Regular, COLORS.neutral_600)}\r\n    ${(props) => marginRight(props.size)}\r\n  }\r\n\r\n  .chevronicon {\r\n    ${(props) => marginRight(props.size)}\r\n  }\r\n\r\n  a:hover {\r\n    color: ${COLORS.primary_700};\r\n  }\r\n  a:active {\r\n    color: ${COLORS.primary_800};\r\n  }\r\n`;\r\n"],"mappings":";;AAAA,OAAOA,MAAM,MAAM,mBAAmB;AACtC,SAASC,MAAM,EAAEC,iBAAiB,EAAEC,iBAAiB,EAAEC,kBAAkB,EAAEC,mBAAmB,QAAQ,WAAW;AACjH,SAASC,IAAI,QAAQ,UAAU;AAE/B,IAAMC,WAAW,GAAG,SAAdA,WAAW,CAAIC,IAAsB,EAAK;EAC9C,OAAOA,IAAI,IAAIF,IAAI,CAACG,KAAK,IAAID,IAAI,IAAIF,IAAI,CAACI,MAAM,GAAG,oBAAoB,GAAG,oBAAoB;AAChG,CAAC;AAED,IAAMC,UAAU,GAAG,SAAbA,UAAU,CAAIH,IAAsB,EAAEI,SAA6B,EAAEC,KAAa,EAAK;EAC3F,QAAQL,IAAI;IACV,KAAKF,IAAI,CAACQ,MAAM;MACd,OAAOT,mBAAmB,CAACO,SAAS,EAAEC,KAAK,CAAC;IAC9C,KAAKP,IAAI,CAACI,MAAM;MACd,OAAOR,iBAAiB,CAACU,SAAS,EAAEC,KAAK,CAAC;IAC5C,KAAKP,IAAI,CAACG,KAAK;IACf;MACE,OAAON,iBAAiB,CAACS,SAAS,EAAEC,KAAK,CAAC;EAAC;AAEjD,CAAC;AAED,OAAO,IAAME,kBAAkB,GAAGf,MAAM,CAACgB,KAAK,wFAC1C,UAACC,KAAK;EAAA,OAAKN,UAAU,CAACM,KAAK,CAACT,IAAI,EAAEJ,kBAAkB,CAACc,IAAI,EAAEjB,MAAM,CAACkB,WAAW,CAAC;AAAA,GAC9E,UAACF,KAAK;EAAA,OAAKV,WAAW,CAACU,KAAK,CAACT,IAAI,CAAC;AAAA,EACrC;AAED,OAAO,IAAMY,mBAAmB,GAAGpB,MAAM,CAACqB,GAAG,qTAOvC,UAACJ,KAAK;EAAA,OAAKN,UAAU,CAACM,KAAK,CAACT,IAAI,EAAEJ,kBAAkB,CAACkB,OAAO,EAAErB,MAAM,CAACsB,WAAW,CAAC;AAAA,GACjF,UAACN,KAAK;EAAA,OAAKV,WAAW,CAACU,KAAK,CAACT,IAAI,CAAC;AAAA,GAIlC,UAACS,KAAK;EAAA,OAAKV,WAAW,CAACU,KAAK,CAACT,IAAI,CAAC;AAAA,GAI3BP,MAAM,CAACuB,WAAW,EAGlBvB,MAAM,CAACwB,WAAW,CAE9B"}
+{"version":3,"file":"styles.js","names":["styled","COLORS","ComponentMStyling","ComponentSStyling","ComponentTextStyle","ComponentXXSStyling","Size","marginRight","size","Small","Medium","FontStyles","textStyle","color","XSmall","BreadcrumbItemLastStyles","label","props","Bold","neutral_800","BreadcrumbContainerStyles","div","Regular","neutral_600","primary_700","primary_800"],"sources":["../../src/Breadcrumb/styles.ts"],"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 BreadcrumbItemLastStyles = styled.label<{ size: Size }>`\n  ${(props) => FontStyles(props.size, ComponentTextStyle.Bold, COLORS.neutral_800)}\n  ${(props) => marginRight(props.size)}\n`;\n\nexport const BreadcrumbContainerStyles = 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"],"mappings":";;AAAA,OAAOA,MAAM,MAAM,mBAAmB;AACtC,SAASC,MAAM,EAAEC,iBAAiB,EAAEC,iBAAiB,EAAEC,kBAAkB,EAAEC,mBAAmB,QAAQ,WAAW;AACjH,SAASC,IAAI,QAAQ,UAAU;AAE/B,IAAMC,WAAW,GAAG,SAAdA,WAAW,CAAIC,IAAsB,EAAK;EAC9C,OAAOA,IAAI,IAAIF,IAAI,CAACG,KAAK,IAAID,IAAI,IAAIF,IAAI,CAACI,MAAM,GAAG,oBAAoB,GAAG,oBAAoB;AAChG,CAAC;AAED,IAAMC,UAAU,GAAG,SAAbA,UAAU,CAAIH,IAAsB,EAAEI,SAA6B,EAAEC,KAAa,EAAK;EAC3F,QAAQL,IAAI;IACV,KAAKF,IAAI,CAACQ,MAAM;MACd,OAAOT,mBAAmB,CAACO,SAAS,EAAEC,KAAK,CAAC;IAC9C,KAAKP,IAAI,CAACI,MAAM;MACd,OAAOR,iBAAiB,CAACU,SAAS,EAAEC,KAAK,CAAC;IAC5C,KAAKP,IAAI,CAACG,KAAK;IACf;MACE,OAAON,iBAAiB,CAACS,SAAS,EAAEC,KAAK,CAAC;EAAC;AAEjD,CAAC;AAED,OAAO,IAAME,wBAAwB,GAAGf,MAAM,CAACgB,KAAK,wFAChD,UAACC,KAAK;EAAA,OAAKN,UAAU,CAACM,KAAK,CAACT,IAAI,EAAEJ,kBAAkB,CAACc,IAAI,EAAEjB,MAAM,CAACkB,WAAW,CAAC;AAAA,GAC9E,UAACF,KAAK;EAAA,OAAKV,WAAW,CAACU,KAAK,CAACT,IAAI,CAAC;AAAA,EACrC;AAED,OAAO,IAAMY,yBAAyB,GAAGpB,MAAM,CAACqB,GAAG,qTAO7C,UAACJ,KAAK;EAAA,OAAKN,UAAU,CAACM,KAAK,CAACT,IAAI,EAAEJ,kBAAkB,CAACkB,OAAO,EAAErB,MAAM,CAACsB,WAAW,CAAC;AAAA,GACjF,UAACN,KAAK;EAAA,OAAKV,WAAW,CAACU,KAAK,CAACT,IAAI,CAAC;AAAA,GAIlC,UAACS,KAAK;EAAA,OAAKV,WAAW,CAACU,KAAK,CAACT,IAAI,CAAC;AAAA,GAI3BP,MAAM,CAACuB,WAAW,EAGlBvB,MAAM,CAACwB,WAAW,CAE9B"}

package/dist/Button/BackButton.cjs

@@ -23,7 +23,7 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 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; }
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-var Button = _styledComponents.default.button(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  box-sizing: border-box;\n  min-height: 48px;\n  padding: 0;\n  margin: 0;\n  outline:none;\n  max-width: max-content;\n  display: flex;\n  align-items: center;\n  border: none;\n  background-color: transparent;\n  cursor: pointer;\n\n  ", ";\n  font-feature-settings: 'liga' off;\n\n  & > .button-content {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    justify-content: flex-start;\n    max-width: max-content;\n    padding: 4px 4px 4px 0;\n    border-radius: 4px;\n    cursor: inherit;\n    min-width: 64px;\n\n  }\n\n  & > .button-content > span {\n    display: flex;\n    cursor: inherit;\n  }\n  & > .button-content > label {\n    display: flex;\n    cursor: inherit;\n    flex-grow: 1;\n    justify-content: center;\n  }\n\n  &:hover > .button-content,\n  &.hover-state > .button-content {\n    background-color: ", ";\n    color: ", ";\n  }\n  &:focus > .button-content,\n  &.focus-state > .button-content {\n    ", "\n  }\n  &:active > .button-content,\n  &.active-state > .button-content {\n    background-color: ", ";\n    color: ", ";\n  }\n  &:disabled {\n    cursor: not-allowed;\n  }\n  &:disabled > .button-content {\n    color: ", " !important;\n    background-color: transparent !important;\n  }\n"])), function (props) {
+var BackButtonContainerStyles = _styledComponents.default.button(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  box-sizing: border-box;\n  min-height: 48px;\n  padding: 0;\n  margin: 0;\n  outline:none;\n  max-width: max-content;\n  display: flex;\n  align-items: center;\n  border: none;\n  background-color: transparent;\n  cursor: pointer;\n\n  ", ";\n  font-feature-settings: 'liga' off;\n\n  & > .button-content {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    justify-content: flex-start;\n    max-width: max-content;\n    padding: 4px 4px 4px 0;\n    border-radius: 4px;\n    cursor: inherit;\n    min-width: 64px;\n\n  }\n\n  & > .button-content > span {\n    display: flex;\n    cursor: inherit;\n  }\n  & > .button-content > label {\n    display: flex;\n    cursor: inherit;\n    flex-grow: 1;\n    justify-content: center;\n  }\n\n  &:hover > .button-content,\n  &.hover-state > .button-content {\n    background-color: ", ";\n    color: ", ";\n  }\n  &:focus > .button-content,\n  &.focus-state > .button-content {\n    ", "\n  }\n  &:active > .button-content,\n  &.active-state > .button-content {\n    background-color: ", ";\n    color: ", ";\n  }\n  &:disabled {\n    cursor: not-allowed;\n  }\n  &:disabled > .button-content {\n    color: ", " !important;\n    background-color: transparent !important;\n  }\n"])), function (props) {
   return props.size === _types.Size.XSmall ? (0, _styles.ComponentXSStyling)(_styles.ComponentTextStyle.Bold, _styles.COLORS.neutral_600) : (0, _styles.ComponentSStyling)(_styles.ComponentTextStyle.Bold, _styles.COLORS.neutral_600);
 }, _styles.COLORS.primary_20, _styles.COLORS.primary_700, _styles.focusStyles, _styles.COLORS.primary_100, _styles.COLORS.primary_800, _styles.COLORS.neutral_300);
 var BackButton = function BackButton(_ref) {
@@ -32,7 +32,7 @@ var BackButton = function BackButton(_ref) {
     size = _ref$size === void 0 ? _types.Size.Small : _ref$size,
     dataTestId = _ref.dataTestId,
     props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(Button, _objectSpread(_objectSpread({}, props), {}, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(BackButtonContainerStyles, _objectSpread(_objectSpread({}, props), {}, {
     size: size,
     onMouseDown: _common.defaultOnMouseDownHandler,
     dataTestId: dataTestId,

package/dist/Button/BackButton.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"BackButton.cjs","names":["Button","styled","button","props","size","Size","XSmall","ComponentXSStyling","ComponentTextStyle","Bold","COLORS","neutral_600","ComponentSStyling","primary_20","primary_700","focusStyles","primary_100","primary_800","neutral_300","BackButton","children","Small","dataTestId","defaultOnMouseDownHandler","disabled"],"sources":["../../src/Button/BackButton.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\nimport {COLORS, focusStyles} from '../styles';\r\nimport { Size, Testable } from '../types';\r\nimport { SystemIcons } from '../icons';\r\nimport { ComponentTextStyle, ComponentSStyling, ComponentXSStyling } from '../styles';\r\nimport {defaultOnMouseDownHandler} from '../common';\r\n\r\nconst Button = styled.button<BackButtonProps>`\r\n  box-sizing: border-box;\r\n  min-height: 48px;\r\n  padding: 0;\r\n  margin: 0;\r\n  outline:none;\r\n  max-width: max-content;\r\n  display: flex;\r\n  align-items: center;\r\n  border: none;\r\n  background-color: transparent;\r\n  cursor: pointer;\r\n\r\n  ${(props) => (props.size === Size.XSmall ? ComponentXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600) : ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600))};\r\n  font-feature-settings: 'liga' off;\r\n\r\n  & > .button-content {\r\n    display: flex;\r\n    flex-direction: row;\r\n    align-items: center;\r\n    justify-content: flex-start;\r\n    max-width: max-content;\r\n    padding: 4px 4px 4px 0;\r\n    border-radius: 4px;\r\n    cursor: inherit;\r\n    min-width: 64px;\r\n\r\n  }\r\n\r\n  & > .button-content > span {\r\n    display: flex;\r\n    cursor: inherit;\r\n  }\r\n  & > .button-content > label {\r\n    display: flex;\r\n    cursor: inherit;\r\n    flex-grow: 1;\r\n    justify-content: center;\r\n  }\r\n\r\n  &:hover > .button-content,\r\n  &.hover-state > .button-content {\r\n    background-color: ${COLORS.primary_20};\r\n    color: ${COLORS.primary_700};\r\n  }\r\n  &:focus > .button-content,\r\n  &.focus-state > .button-content {\r\n    ${focusStyles}\r\n  }\r\n  &:active > .button-content,\r\n  &.active-state > .button-content {\r\n    background-color: ${COLORS.primary_100};\r\n    color: ${COLORS.primary_800};\r\n  }\r\n  &:disabled {\r\n    cursor: not-allowed;\r\n  }\r\n  &:disabled > .button-content {\r\n    color: ${COLORS.neutral_300} !important;\r\n    background-color: transparent !important;\r\n  }\r\n`;\r\n\r\ninterface BackButtonProps extends Testable, React.ButtonHTMLAttributes<HTMLButtonElement> {\r\n  size: Size.Small | Size.XSmall;\r\n  disabled?: boolean;\r\n}\r\nconst BackButton: React.FunctionComponent<BackButtonProps> = ({ children, size = Size.Small, dataTestId, ...props }) => {\r\n  return (\r\n    <Button {...props} size={size} onMouseDown={defaultOnMouseDownHandler} dataTestId={dataTestId}>\r\n      <div className={'button-content'}>\r\n        <span aria-hidden=\"true\">\r\n          <SystemIcons.ArrowLineLeft size={size === Size.XSmall ? '20' : '24'} />\r\n        </span>\r\n        <label>{children}</label>\r\n      </div>\r\n    </Button>\r\n  );\r\n};\r\n\r\nexport default BackButton;\r\n"],"mappings":";;;;;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AAEA;AAAoD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEpD,IAAMA,MAAM,GAAGC,yBAAM,CAACC,MAAM,ozCAaxB,UAACC,KAAK;EAAA,OAAMA,KAAK,CAACC,IAAI,KAAKC,WAAI,CAACC,MAAM,GAAG,IAAAC,0BAAkB,EAACC,0BAAkB,CAACC,IAAI,EAAEC,cAAM,CAACC,WAAW,CAAC,GAAG,IAAAC,yBAAiB,EAACJ,0BAAkB,CAACC,IAAI,EAAEC,cAAM,CAACC,WAAW,CAAC;AAAA,CAAC,EA6BtJD,cAAM,CAACG,UAAU,EAC5BH,cAAM,CAACI,WAAW,EAIzBC,mBAAW,EAIOL,cAAM,CAACM,WAAW,EAC7BN,cAAM,CAACO,WAAW,EAMlBP,cAAM,CAACQ,WAAW,CAG9B;AAMD,IAAMC,UAAoD,GAAG,SAAvDA,UAAoD,OAA8D;EAAA,IAAxDC,QAAQ,QAARA,QAAQ;IAAA,iBAAEhB,IAAI;IAAJA,IAAI,0BAAGC,WAAI,CAACgB,KAAK;IAAEC,UAAU,QAAVA,UAAU;IAAKnB,KAAK;EAC/G,oBACE,qBAAC,MAAM,kCAAKA,KAAK;IAAE,IAAI,EAAEC,IAAK;IAAC,WAAW,EAAEmB,iCAA0B;IAAC,UAAU,EAAED,UAAW;IAAA,uBAC5F;MAAK,SAAS,EAAE,gBAAiB;MAAA,wBAC/B;QAAM,eAAY,MAAM;QAAA,uBACtB,qBAAC,kBAAW,CAAC,aAAa;UAAC,IAAI,EAAElB,IAAI,KAAKC,WAAI,CAACC,MAAM,GAAG,IAAI,GAAG;QAAK;MAAG,EAClE,eACP;QAAA,UAAQc;MAAQ,EAAS;IAAA;EACrB,GACC;AAEb,CAAC;AAAC;EAbAI,QAAQ;AAAA;AAAA,eAeKL,UAAU;AAAA"}
+{"version":3,"file":"BackButton.cjs","names":["BackButtonContainerStyles","styled","button","props","size","Size","XSmall","ComponentXSStyling","ComponentTextStyle","Bold","COLORS","neutral_600","ComponentSStyling","primary_20","primary_700","focusStyles","primary_100","primary_800","neutral_300","BackButton","children","Small","dataTestId","defaultOnMouseDownHandler","disabled"],"sources":["../../src/Button/BackButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {COLORS, focusStyles} from '../styles';\nimport { Size, Testable } from '../types';\nimport { SystemIcons } from '../icons';\nimport { ComponentTextStyle, ComponentSStyling, ComponentXSStyling } from '../styles';\nimport {defaultOnMouseDownHandler} from '../common';\n\nconst BackButtonContainerStyles = styled.button<BackButtonProps>`\n  box-sizing: border-box;\n  min-height: 48px;\n  padding: 0;\n  margin: 0;\n  outline:none;\n  max-width: max-content;\n  display: flex;\n  align-items: center;\n  border: none;\n  background-color: transparent;\n  cursor: pointer;\n\n  ${(props) => (props.size === Size.XSmall ? ComponentXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600) : ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600))};\n  font-feature-settings: 'liga' off;\n\n  & > .button-content {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    justify-content: flex-start;\n    max-width: max-content;\n    padding: 4px 4px 4px 0;\n    border-radius: 4px;\n    cursor: inherit;\n    min-width: 64px;\n\n  }\n\n  & > .button-content > span {\n    display: flex;\n    cursor: inherit;\n  }\n  & > .button-content > label {\n    display: flex;\n    cursor: inherit;\n    flex-grow: 1;\n    justify-content: center;\n  }\n\n  &:hover > .button-content,\n  &.hover-state > .button-content {\n    background-color: ${COLORS.primary_20};\n    color: ${COLORS.primary_700};\n  }\n  &:focus > .button-content,\n  &.focus-state > .button-content {\n    ${focusStyles}\n  }\n  &:active > .button-content,\n  &.active-state > .button-content {\n    background-color: ${COLORS.primary_100};\n    color: ${COLORS.primary_800};\n  }\n  &:disabled {\n    cursor: not-allowed;\n  }\n  &:disabled > .button-content {\n    color: ${COLORS.neutral_300} !important;\n    background-color: transparent !important;\n  }\n`;\n\nexport interface BackButtonProps extends Testable, React.ButtonHTMLAttributes<HTMLButtonElement> {\n  size: Size.Small | Size.XSmall;\n  disabled?: boolean;\n}\nconst BackButton: React.FunctionComponent<BackButtonProps> = ({ children, size = Size.Small, dataTestId, ...props }) => {\n  return (\n    <BackButtonContainerStyles {...props} size={size} onMouseDown={defaultOnMouseDownHandler} dataTestId={dataTestId}>\n      <div className={'button-content'}>\n        <span aria-hidden=\"true\">\n          <SystemIcons.ArrowLineLeft size={size === Size.XSmall ? '20' : '24'} />\n        </span>\n        <label>{children}</label>\n      </div>\n    </BackButtonContainerStyles>\n  );\n};\n\nexport default BackButton;\n"],"mappings":";;;;;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AAEA;AAAoD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEpD,IAAMA,yBAAyB,GAAGC,yBAAM,CAACC,MAAM,ozCAa3C,UAACC,KAAK;EAAA,OAAMA,KAAK,CAACC,IAAI,KAAKC,WAAI,CAACC,MAAM,GAAG,IAAAC,0BAAkB,EAACC,0BAAkB,CAACC,IAAI,EAAEC,cAAM,CAACC,WAAW,CAAC,GAAG,IAAAC,yBAAiB,EAACJ,0BAAkB,CAACC,IAAI,EAAEC,cAAM,CAACC,WAAW,CAAC;AAAA,CAAC,EA6BtJD,cAAM,CAACG,UAAU,EAC5BH,cAAM,CAACI,WAAW,EAIzBC,mBAAW,EAIOL,cAAM,CAACM,WAAW,EAC7BN,cAAM,CAACO,WAAW,EAMlBP,cAAM,CAACQ,WAAW,CAG9B;AAMD,IAAMC,UAAoD,GAAG,SAAvDA,UAAoD,OAA8D;EAAA,IAAxDC,QAAQ,QAARA,QAAQ;IAAA,iBAAEhB,IAAI;IAAJA,IAAI,0BAAGC,WAAI,CAACgB,KAAK;IAAEC,UAAU,QAAVA,UAAU;IAAKnB,KAAK;EAC/G,oBACE,qBAAC,yBAAyB,kCAAKA,KAAK;IAAE,IAAI,EAAEC,IAAK;IAAC,WAAW,EAAEmB,iCAA0B;IAAC,UAAU,EAAED,UAAW;IAAA,uBAC/G;MAAK,SAAS,EAAE,gBAAiB;MAAA,wBAC/B;QAAM,eAAY,MAAM;QAAA,uBACtB,qBAAC,kBAAW,CAAC,aAAa;UAAC,IAAI,EAAElB,IAAI,KAAKC,WAAI,CAACC,MAAM,GAAG,IAAI,GAAG;QAAK;MAAG,EAClE,eACP;QAAA,UAAQc;MAAQ,EAAS;IAAA;EACrB,GACoB;AAEhC,CAAC;AAAC;EAbAI,QAAQ;AAAA;AAAA,eAeKL,UAAU;AAAA"}

package/dist/Button/BackButton.d.ts

@@ -1,8 +1,8 @@
-import * as React from 'react';
-import { Size, Testable } from '../types';
-interface BackButtonProps extends Testable, React.ButtonHTMLAttributes<HTMLButtonElement> {
-    size: Size.Small | Size.XSmall;
-    disabled?: boolean;
-}
-declare const BackButton: React.FunctionComponent<BackButtonProps>;
-export default BackButton;
+import * as React from 'react';
+import { Size, Testable } from '../types';
+export interface BackButtonProps extends Testable, React.ButtonHTMLAttributes<HTMLButtonElement> {
+    size: Size.Small | Size.XSmall;
+    disabled?: boolean;
+}
+declare const BackButton: React.FunctionComponent<BackButtonProps>;
+export default BackButton;

package/dist/Button/BackButton.js

@@ -15,7 +15,7 @@ import { ComponentTextStyle, ComponentSStyling, ComponentXSStyling } from '../st
 import { defaultOnMouseDownHandler } from '../common';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
-var Button = styled.button(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  box-sizing: border-box;\n  min-height: 48px;\n  padding: 0;\n  margin: 0;\n  outline:none;\n  max-width: max-content;\n  display: flex;\n  align-items: center;\n  border: none;\n  background-color: transparent;\n  cursor: pointer;\n\n  ", ";\n  font-feature-settings: 'liga' off;\n\n  & > .button-content {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    justify-content: flex-start;\n    max-width: max-content;\n    padding: 4px 4px 4px 0;\n    border-radius: 4px;\n    cursor: inherit;\n    min-width: 64px;\n\n  }\n\n  & > .button-content > span {\n    display: flex;\n    cursor: inherit;\n  }\n  & > .button-content > label {\n    display: flex;\n    cursor: inherit;\n    flex-grow: 1;\n    justify-content: center;\n  }\n\n  &:hover > .button-content,\n  &.hover-state > .button-content {\n    background-color: ", ";\n    color: ", ";\n  }\n  &:focus > .button-content,\n  &.focus-state > .button-content {\n    ", "\n  }\n  &:active > .button-content,\n  &.active-state > .button-content {\n    background-color: ", ";\n    color: ", ";\n  }\n  &:disabled {\n    cursor: not-allowed;\n  }\n  &:disabled > .button-content {\n    color: ", " !important;\n    background-color: transparent !important;\n  }\n"])), function (props) {
+var BackButtonContainerStyles = styled.button(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  box-sizing: border-box;\n  min-height: 48px;\n  padding: 0;\n  margin: 0;\n  outline:none;\n  max-width: max-content;\n  display: flex;\n  align-items: center;\n  border: none;\n  background-color: transparent;\n  cursor: pointer;\n\n  ", ";\n  font-feature-settings: 'liga' off;\n\n  & > .button-content {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    justify-content: flex-start;\n    max-width: max-content;\n    padding: 4px 4px 4px 0;\n    border-radius: 4px;\n    cursor: inherit;\n    min-width: 64px;\n\n  }\n\n  & > .button-content > span {\n    display: flex;\n    cursor: inherit;\n  }\n  & > .button-content > label {\n    display: flex;\n    cursor: inherit;\n    flex-grow: 1;\n    justify-content: center;\n  }\n\n  &:hover > .button-content,\n  &.hover-state > .button-content {\n    background-color: ", ";\n    color: ", ";\n  }\n  &:focus > .button-content,\n  &.focus-state > .button-content {\n    ", "\n  }\n  &:active > .button-content,\n  &.active-state > .button-content {\n    background-color: ", ";\n    color: ", ";\n  }\n  &:disabled {\n    cursor: not-allowed;\n  }\n  &:disabled > .button-content {\n    color: ", " !important;\n    background-color: transparent !important;\n  }\n"])), function (props) {
   return props.size === Size.XSmall ? ComponentXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600) : ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600);
 }, COLORS.primary_20, COLORS.primary_700, focusStyles, COLORS.primary_100, COLORS.primary_800, COLORS.neutral_300);
 var BackButton = function BackButton(_ref) {
@@ -24,7 +24,7 @@ var BackButton = function BackButton(_ref) {
     size = _ref$size === void 0 ? Size.Small : _ref$size,
     dataTestId = _ref.dataTestId,
     props = _objectWithoutProperties(_ref, _excluded);
-  return /*#__PURE__*/_jsx(Button, _objectSpread(_objectSpread({}, props), {}, {
+  return /*#__PURE__*/_jsx(BackButtonContainerStyles, _objectSpread(_objectSpread({}, props), {}, {
     size: size,
     onMouseDown: defaultOnMouseDownHandler,
     dataTestId: dataTestId,

package/dist/Button/BackButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"BackButton.js","names":["React","styled","COLORS","focusStyles","Size","SystemIcons","ComponentTextStyle","ComponentSStyling","ComponentXSStyling","defaultOnMouseDownHandler","Button","button","props","size","XSmall","Bold","neutral_600","primary_20","primary_700","primary_100","primary_800","neutral_300","BackButton","children","Small","dataTestId","disabled"],"sources":["../../src/Button/BackButton.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\nimport {COLORS, focusStyles} from '../styles';\r\nimport { Size, Testable } from '../types';\r\nimport { SystemIcons } from '../icons';\r\nimport { ComponentTextStyle, ComponentSStyling, ComponentXSStyling } from '../styles';\r\nimport {defaultOnMouseDownHandler} from '../common';\r\n\r\nconst Button = styled.button<BackButtonProps>`\r\n  box-sizing: border-box;\r\n  min-height: 48px;\r\n  padding: 0;\r\n  margin: 0;\r\n  outline:none;\r\n  max-width: max-content;\r\n  display: flex;\r\n  align-items: center;\r\n  border: none;\r\n  background-color: transparent;\r\n  cursor: pointer;\r\n\r\n  ${(props) => (props.size === Size.XSmall ? ComponentXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600) : ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600))};\r\n  font-feature-settings: 'liga' off;\r\n\r\n  & > .button-content {\r\n    display: flex;\r\n    flex-direction: row;\r\n    align-items: center;\r\n    justify-content: flex-start;\r\n    max-width: max-content;\r\n    padding: 4px 4px 4px 0;\r\n    border-radius: 4px;\r\n    cursor: inherit;\r\n    min-width: 64px;\r\n\r\n  }\r\n\r\n  & > .button-content > span {\r\n    display: flex;\r\n    cursor: inherit;\r\n  }\r\n  & > .button-content > label {\r\n    display: flex;\r\n    cursor: inherit;\r\n    flex-grow: 1;\r\n    justify-content: center;\r\n  }\r\n\r\n  &:hover > .button-content,\r\n  &.hover-state > .button-content {\r\n    background-color: ${COLORS.primary_20};\r\n    color: ${COLORS.primary_700};\r\n  }\r\n  &:focus > .button-content,\r\n  &.focus-state > .button-content {\r\n    ${focusStyles}\r\n  }\r\n  &:active > .button-content,\r\n  &.active-state > .button-content {\r\n    background-color: ${COLORS.primary_100};\r\n    color: ${COLORS.primary_800};\r\n  }\r\n  &:disabled {\r\n    cursor: not-allowed;\r\n  }\r\n  &:disabled > .button-content {\r\n    color: ${COLORS.neutral_300} !important;\r\n    background-color: transparent !important;\r\n  }\r\n`;\r\n\r\ninterface BackButtonProps extends Testable, React.ButtonHTMLAttributes<HTMLButtonElement> {\r\n  size: Size.Small | Size.XSmall;\r\n  disabled?: boolean;\r\n}\r\nconst BackButton: React.FunctionComponent<BackButtonProps> = ({ children, size = Size.Small, dataTestId, ...props }) => {\r\n  return (\r\n    <Button {...props} size={size} onMouseDown={defaultOnMouseDownHandler} dataTestId={dataTestId}>\r\n      <div className={'button-content'}>\r\n        <span aria-hidden=\"true\">\r\n          <SystemIcons.ArrowLineLeft size={size === Size.XSmall ? '20' : '24'} />\r\n        </span>\r\n        <label>{children}</label>\r\n      </div>\r\n    </Button>\r\n  );\r\n};\r\n\r\nexport default BackButton;\r\n"],"mappings":";;;;;;;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,OAAOC,MAAM,MAAM,mBAAmB;AACtC,SAAQC,MAAM,EAAEC,WAAW,QAAO,WAAW;AAC7C,SAASC,IAAI,QAAkB,UAAU;AACzC,SAASC,WAAW,QAAQ,UAAU;AACtC,SAASC,kBAAkB,EAAEC,iBAAiB,EAAEC,kBAAkB,QAAQ,WAAW;AACrF,SAAQC,yBAAyB,QAAO,WAAW;AAAC;AAAA;AAEpD,IAAMC,MAAM,GAAGT,MAAM,CAACU,MAAM,syCAaxB,UAACC,KAAK;EAAA,OAAMA,KAAK,CAACC,IAAI,KAAKT,IAAI,CAACU,MAAM,GAAGN,kBAAkB,CAACF,kBAAkB,CAACS,IAAI,EAAEb,MAAM,CAACc,WAAW,CAAC,GAAGT,iBAAiB,CAACD,kBAAkB,CAACS,IAAI,EAAEb,MAAM,CAACc,WAAW,CAAC;AAAA,CAAC,EA6BtJd,MAAM,CAACe,UAAU,EAC5Bf,MAAM,CAACgB,WAAW,EAIzBf,WAAW,EAIOD,MAAM,CAACiB,WAAW,EAC7BjB,MAAM,CAACkB,WAAW,EAMlBlB,MAAM,CAACmB,WAAW,CAG9B;AAMD,IAAMC,UAAoD,GAAG,SAAvDA,UAAoD,OAA8D;EAAA,IAAxDC,QAAQ,QAARA,QAAQ;IAAA,iBAAEV,IAAI;IAAJA,IAAI,0BAAGT,IAAI,CAACoB,KAAK;IAAEC,UAAU,QAAVA,UAAU;IAAKb,KAAK;EAC/G,oBACE,KAAC,MAAM,kCAAKA,KAAK;IAAE,IAAI,EAAEC,IAAK;IAAC,WAAW,EAAEJ,yBAA0B;IAAC,UAAU,EAAEgB,UAAW;IAAA,uBAC5F;MAAK,SAAS,EAAE,gBAAiB;MAAA,wBAC/B;QAAM,eAAY,MAAM;QAAA,uBACtB,KAAC,WAAW,CAAC,aAAa;UAAC,IAAI,EAAEZ,IAAI,KAAKT,IAAI,CAACU,MAAM,GAAG,IAAI,GAAG;QAAK;MAAG,EAClE,eACP;QAAA,UAAQS;MAAQ,EAAS;IAAA;EACrB,GACC;AAEb,CAAC;AAAC;EAbAG,QAAQ;AAAA;AAeV,eAAeJ,UAAU"}
+{"version":3,"file":"BackButton.js","names":["React","styled","COLORS","focusStyles","Size","SystemIcons","ComponentTextStyle","ComponentSStyling","ComponentXSStyling","defaultOnMouseDownHandler","BackButtonContainerStyles","button","props","size","XSmall","Bold","neutral_600","primary_20","primary_700","primary_100","primary_800","neutral_300","BackButton","children","Small","dataTestId","disabled"],"sources":["../../src/Button/BackButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {COLORS, focusStyles} from '../styles';\nimport { Size, Testable } from '../types';\nimport { SystemIcons } from '../icons';\nimport { ComponentTextStyle, ComponentSStyling, ComponentXSStyling } from '../styles';\nimport {defaultOnMouseDownHandler} from '../common';\n\nconst BackButtonContainerStyles = styled.button<BackButtonProps>`\n  box-sizing: border-box;\n  min-height: 48px;\n  padding: 0;\n  margin: 0;\n  outline:none;\n  max-width: max-content;\n  display: flex;\n  align-items: center;\n  border: none;\n  background-color: transparent;\n  cursor: pointer;\n\n  ${(props) => (props.size === Size.XSmall ? ComponentXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600) : ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600))};\n  font-feature-settings: 'liga' off;\n\n  & > .button-content {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    justify-content: flex-start;\n    max-width: max-content;\n    padding: 4px 4px 4px 0;\n    border-radius: 4px;\n    cursor: inherit;\n    min-width: 64px;\n\n  }\n\n  & > .button-content > span {\n    display: flex;\n    cursor: inherit;\n  }\n  & > .button-content > label {\n    display: flex;\n    cursor: inherit;\n    flex-grow: 1;\n    justify-content: center;\n  }\n\n  &:hover > .button-content,\n  &.hover-state > .button-content {\n    background-color: ${COLORS.primary_20};\n    color: ${COLORS.primary_700};\n  }\n  &:focus > .button-content,\n  &.focus-state > .button-content {\n    ${focusStyles}\n  }\n  &:active > .button-content,\n  &.active-state > .button-content {\n    background-color: ${COLORS.primary_100};\n    color: ${COLORS.primary_800};\n  }\n  &:disabled {\n    cursor: not-allowed;\n  }\n  &:disabled > .button-content {\n    color: ${COLORS.neutral_300} !important;\n    background-color: transparent !important;\n  }\n`;\n\nexport interface BackButtonProps extends Testable, React.ButtonHTMLAttributes<HTMLButtonElement> {\n  size: Size.Small | Size.XSmall;\n  disabled?: boolean;\n}\nconst BackButton: React.FunctionComponent<BackButtonProps> = ({ children, size = Size.Small, dataTestId, ...props }) => {\n  return (\n    <BackButtonContainerStyles {...props} size={size} onMouseDown={defaultOnMouseDownHandler} dataTestId={dataTestId}>\n      <div className={'button-content'}>\n        <span aria-hidden=\"true\">\n          <SystemIcons.ArrowLineLeft size={size === Size.XSmall ? '20' : '24'} />\n        </span>\n        <label>{children}</label>\n      </div>\n    </BackButtonContainerStyles>\n  );\n};\n\nexport default BackButton;\n"],"mappings":";;;;;;;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,OAAOC,MAAM,MAAM,mBAAmB;AACtC,SAAQC,MAAM,EAAEC,WAAW,QAAO,WAAW;AAC7C,SAASC,IAAI,QAAkB,UAAU;AACzC,SAASC,WAAW,QAAQ,UAAU;AACtC,SAASC,kBAAkB,EAAEC,iBAAiB,EAAEC,kBAAkB,QAAQ,WAAW;AACrF,SAAQC,yBAAyB,QAAO,WAAW;AAAC;AAAA;AAEpD,IAAMC,yBAAyB,GAAGT,MAAM,CAACU,MAAM,syCAa3C,UAACC,KAAK;EAAA,OAAMA,KAAK,CAACC,IAAI,KAAKT,IAAI,CAACU,MAAM,GAAGN,kBAAkB,CAACF,kBAAkB,CAACS,IAAI,EAAEb,MAAM,CAACc,WAAW,CAAC,GAAGT,iBAAiB,CAACD,kBAAkB,CAACS,IAAI,EAAEb,MAAM,CAACc,WAAW,CAAC;AAAA,CAAC,EA6BtJd,MAAM,CAACe,UAAU,EAC5Bf,MAAM,CAACgB,WAAW,EAIzBf,WAAW,EAIOD,MAAM,CAACiB,WAAW,EAC7BjB,MAAM,CAACkB,WAAW,EAMlBlB,MAAM,CAACmB,WAAW,CAG9B;AAMD,IAAMC,UAAoD,GAAG,SAAvDA,UAAoD,OAA8D;EAAA,IAAxDC,QAAQ,QAARA,QAAQ;IAAA,iBAAEV,IAAI;IAAJA,IAAI,0BAAGT,IAAI,CAACoB,KAAK;IAAEC,UAAU,QAAVA,UAAU;IAAKb,KAAK;EAC/G,oBACE,KAAC,yBAAyB,kCAAKA,KAAK;IAAE,IAAI,EAAEC,IAAK;IAAC,WAAW,EAAEJ,yBAA0B;IAAC,UAAU,EAAEgB,UAAW;IAAA,uBAC/G;MAAK,SAAS,EAAE,gBAAiB;MAAA,wBAC/B;QAAM,eAAY,MAAM;QAAA,uBACtB,KAAC,WAAW,CAAC,aAAa;UAAC,IAAI,EAAEZ,IAAI,KAAKT,IAAI,CAACU,MAAM,GAAG,IAAI,GAAG;QAAK;MAAG,EAClE,eACP;QAAA,UAAQS;MAAQ,EAAS;IAAA;EACrB,GACoB;AAEhC,CAAC;AAAC;EAbAG,QAAQ;AAAA;AAeV,eAAeJ,UAAU"}

package/dist/Button/Button.cjs

@@ -5,7 +5,7 @@ var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
+exports.default = exports.ButtonTertiaryStyled = exports.ButtonSecondaryStyled = exports.ButtonPrimaryStyled = exports.ButtonPositiveStyled = exports.ButtonCriticalStyled = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
@@ -35,7 +35,7 @@ var getBorderRadius = function getBorderRadius(flatEdge, radius) {
       return "".concat(radius, "px");
   }
 };
-var Primary = _styledComponents.default.button(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  border: none;\n  background-color: transparent;\n  cursor: pointer;\n  padding: 0;\n  margin: 0;\n  position: relative;\n  box-sizing: border-box;\n  min-height: ", ";\n  &.loading-state {\n    cursor: wait;\n  }\n  div.button-content {\n    ", ";\n\n    background-color: ", ";\n    border-radius: ", ";\n\n    width: ", ";\n    position: relative;\n\n    min-height: ", ";\n    min-width: ", ";\n\n    box-sizing: border-box;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: ", ";\n\n    span.icon:not(.loading) {\n      pointer-events: none;\n    }\n\n    span.loading {\n      opacity: 0;\n    }\n\n    .icon {\n      margin: ", ";\n      width: ", ";\n      height: ", ";\n      svg {\n        width: ", " !important;\n        height: ", " !important;\n      }\n    }\n\n    .label {\n      margin: 0 4px;\n    }\n\n    div {\n      position: absolute;\n      width: 100%;\n      svg {\n        height: ", ";\n        width: ", ";\n        path {\n          fill: ", ";\n        }\n      }\n    }\n  }\n  &:hover > div.button-content,\n  &.hover-state > div.button-content {\n    background-color: ", ";\n    color: ", ";\n  }\n  &:active > div.button-content,\n  &.active-state > div.button-content {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  &:focus,\n  &.focus-state {\n    ", "\n  }\n  &:disabled,\n  &.disabled-state {\n    cursor: not-allowed;\n  }\n  &:disabled > div.button-content,\n  &.disabled-state > div.button-content {\n    pointer-events: none;\n    background-color: ", ";\n    color: ", ";\n  }\n"])), function (props) {
+var ButtonPrimaryStyled = _styledComponents.default.button(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  border: none;\n  background-color: transparent;\n  cursor: pointer;\n  padding: 0;\n  margin: 0;\n  position: relative;\n  box-sizing: border-box;\n  min-height: ", ";\n  &.loading-state {\n    cursor: wait;\n  }\n  div.button-content {\n    ", ";\n\n    background-color: ", ";\n    border-radius: ", ";\n\n    width: ", ";\n    position: relative;\n\n    min-height: ", ";\n    min-width: ", ";\n\n    box-sizing: border-box;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: ", ";\n\n    span.icon:not(.loading) {\n      pointer-events: none;\n    }\n\n    span.loading {\n      opacity: 0;\n    }\n\n    .icon {\n      margin: ", ";\n      width: ", ";\n      height: ", ";\n      svg {\n        width: ", " !important;\n        height: ", " !important;\n      }\n    }\n\n    .label {\n      margin: 0 4px;\n    }\n\n    div {\n      position: absolute;\n      width: 100%;\n      svg {\n        height: ", ";\n        width: ", ";\n        path {\n          fill: ", ";\n        }\n      }\n    }\n  }\n  &:hover > div.button-content,\n  &.hover-state > div.button-content {\n    background-color: ", ";\n    color: ", ";\n  }\n  &:active > div.button-content,\n  &.active-state > div.button-content {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  &:focus,\n  &.focus-state {\n    ", "\n  }\n  &:disabled,\n  &.disabled-state {\n    cursor: not-allowed;\n  }\n  &:disabled > div.button-content,\n  &.disabled-state > div.button-content {\n    pointer-events: none;\n    background-color: ", ";\n    color: ", ";\n  }\n"])), function (props) {
   return props.size === _types.Size.Large ? '56px' : '48px';
 }, function (props) {
   return props.size === _types.Size.Large ? (0, _styles.ComponentLStyling)(_styles.ComponentTextStyle.Bold, (props === null || props === void 0 ? void 0 : props.colorTheme) === 'dark' ? _styles.COLORS.primary_800 : _styles.COLORS.white) : props.size === _types.Size.Small ? (0, _styles.ComponentSStyling)(_styles.ComponentTextStyle.Bold, (props === null || props === void 0 ? void 0 : props.colorTheme) === 'dark' ? _styles.COLORS.primary_800 : _styles.COLORS.white) : (0, _styles.ComponentMStyling)(_styles.ComponentTextStyle.Bold, (props === null || props === void 0 ? void 0 : props.colorTheme) === 'dark' ? _styles.COLORS.primary_800 : _styles.COLORS.white);
@@ -82,7 +82,8 @@ var Primary = _styledComponents.default.button(_templateObject || (_templateObje
 }, function (props) {
   return props.colorTheme === 'dark' ? _styles.COLORS.primary_800 : _styles.COLORS.neutral_300;
 });
-var Secondary = (0, _styledComponents.default)(Primary)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  div.button-content {\n    color: ", ";\n    background-color: transparent;\n    div svg path {\n      fill: ", ";\n    }\n    box-shadow: inset 0 0 0 2px ", ";\n    \n    padding: ", ";\n  }\n\n  &:hover > div.button-content,\n  &.hover-state > div.button-content {\n    color: ", ";\n    box-shadow: inset 0 0 0 2px ", ";\n    \n    background-color: transparent;\n    div {\n      svg {\n        path {\n          fill: ", ";\n        }\n      }\n    }\n  }\n  &:active > div.button-content,\n  &.active-state > div.button-content {\n    color: ", ";\n    box-shadow: inset 0 0 0 2px ", ";\n    \n    background-color: transparent;\n    div {\n      svg {\n        path {\n          fill: ", ";\n        }\n      }\n    }\n  }\n\n  &:disabled > div.button-content,\n  &.disabled-state > div.button-content {\n    background-color: transparent;\n    color: ", ";\n    box-shadow: inset 0 0 0 2px ", ";\n  }\n"])), function (props) {
+exports.ButtonPrimaryStyled = ButtonPrimaryStyled;
+var ButtonSecondaryStyled = (0, _styledComponents.default)(ButtonPrimaryStyled)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  div.button-content {\n    color: ", ";\n    background-color: transparent;\n    div svg path {\n      fill: ", ";\n    }\n    box-shadow: inset 0 0 0 2px ", ";\n    \n    padding: ", ";\n  }\n\n  &:hover > div.button-content,\n  &.hover-state > div.button-content {\n    color: ", ";\n    box-shadow: inset 0 0 0 2px ", ";\n    \n    background-color: transparent;\n    div {\n      svg {\n        path {\n          fill: ", ";\n        }\n      }\n    }\n  }\n  &:active > div.button-content,\n  &.active-state > div.button-content {\n    color: ", ";\n    box-shadow: inset 0 0 0 2px ", ";\n    \n    background-color: transparent;\n    div {\n      svg {\n        path {\n          fill: ", ";\n        }\n      }\n    }\n  }\n\n  &:disabled > div.button-content,\n  &.disabled-state > div.button-content {\n    background-color: transparent;\n    color: ", ";\n    box-shadow: inset 0 0 0 2px ", ";\n  }\n"])), function (props) {
   return props.colorTheme === 'teal' ? _styles.COLORS.accent1 : (props === null || props === void 0 ? void 0 : props.colorTheme) === 'dark' ? _styles.COLORS.white : _styles.COLORS.primary;
 }, function (props) {
   return props.colorTheme === 'teal' ? _styles.COLORS.accent1 : _styles.COLORS.primary;
@@ -107,27 +108,31 @@ var Secondary = (0, _styledComponents.default)(Primary)(_templateObject2 || (_te
 }, function (props) {
   return (props === null || props === void 0 ? void 0 : props.colorTheme) === 'dark' ? _styles.COLORS.primary_700 : _styles.COLORS.neutral_100;
 });
-var Tertiary = (0, _styledComponents.default)(Primary)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  div.button-content {\n    color: ", ";\n    background-color: transparent;\n    div svg path {\n      fill: ", ";\n    }\n    padding: ", ";\n  }\n  &:hover > div.button-content,\n  &.hover-state > div.button-content {\n    background-color: ", ";\n    color: ", ";\n    div {\n      svg {\n        path {\n          fill: ", ";\n        }\n      }\n    }\n  }\n  &:active > div.button-content,\n  &.active-state > div.button-content {\n    background-color: ", ";\n    color: ", ";\n    div {\n      svg {\n        path {\n          fill: ", ";\n        }\n      }\n    }\n  }\n\n  &:disabled > div.button-content,\n  &.disabled-state > div.button-content {\n    background-color: white !important;\n    color: ", ";\n    border-color: transparent !important;\n  }\n"])), function (props) {
-  return props.colorTheme === 'teal' ? _styles.COLORS.accent1 : _styles.COLORS.primary_500;
+exports.ButtonSecondaryStyled = ButtonSecondaryStyled;
+var ButtonTertiaryStyled = (0, _styledComponents.default)(ButtonPrimaryStyled)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  div.button-content {\n    color: ", ";\n    background-color: transparent;\n    div svg path {\n      fill: ", ";\n    }\n    padding: ", ";\n  }\n  &:hover > div.button-content,\n  &.hover-state > div.button-content {\n    background-color: ", ";\n    color: ", ";\n    div {\n      svg {\n        path {\n          fill: ", ";\n        }\n      }\n    }\n  }\n  &:active > div.button-content,\n  &.active-state > div.button-content {\n    background-color: ", ";\n    color: ", ";\n    div {\n      svg {\n        path {\n          fill: ", ";\n        }\n      }\n    }\n  }\n\n  &:disabled > div.button-content,\n  &.disabled-state > div.button-content {\n    background-color: transparent !important;\n    color: ", ";\n    border-color: transparent !important;\n  }\n"])), function (props) {
+  return props.colorTheme === 'teal' ? _styles.COLORS.accent1 : _styles.COLORS.white;
 }, function (props) {
-  return props.colorTheme === 'teal' ? _styles.COLORS.accent1 : _styles.COLORS.primary;
+  return props.colorTheme === 'teal' ? _styles.COLORS.accent1 : _styles.COLORS.white;
 }, function (props) {
   return props.size === _types.Size.Large ? '12px 16px' : props.size === _types.Size.Small ? '4px 8px' : '6px 12px';
 }, function (props) {
-  return props.colorTheme === 'teal' ? _styles.COLORS.accent1_20 : _styles.COLORS.primary_20;
+  return props.colorTheme === 'teal' ? _styles.COLORS.accent1_20 : _styles.COLORS.primary_700;
 }, function (props) {
-  return props.colorTheme === 'teal' ? _styles.COLORS.accent1_700 : _styles.COLORS.primary_700;
+  return props.colorTheme === 'teal' ? _styles.COLORS.accent1_700 : _styles.COLORS.white;
 }, function (props) {
-  return props.colorTheme === 'teal' ? _styles.COLORS.accent1_700 : _styles.COLORS.primary_700;
+  return props.colorTheme === 'teal' ? _styles.COLORS.accent1_700 : _styles.COLORS.white;
 }, function (props) {
-  return props.colorTheme === 'teal' ? _styles.COLORS.accent1_100 : _styles.COLORS.primary_100;
+  return props.colorTheme === 'teal' ? _styles.COLORS.accent1_100 : _styles.COLORS.primary_600;
 }, function (props) {
-  return props.colorTheme === 'teal' ? _styles.COLORS.accent1_800 : _styles.COLORS.primary_800;
+  return props.colorTheme === 'teal' ? _styles.COLORS.accent1_800 : _styles.COLORS.white;
 }, function (props) {
-  return props.colorTheme === 'teal' ? _styles.COLORS.accent1_800 : _styles.COLORS.primary_800;
-}, _styles.COLORS.neutral_300);
-var Positive = (0, _styledComponents.default)(Primary)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  div.button-content {\n    color: white;\n    background-color: ", ";\n  }\n  &:hover > div.button-content,\n  &.hover-state > div.button-content {\n    background-color: ", ";\n  }\n  &:active > div.button-content,\n  &.active-state > div.button-content {\n    background-color: ", ";\n  }\n\n  &:disabled > div.button-content,\n  &.disabled-state > div.button-content {\n    background-color: ", ";\n    color: ", ";\n  }\n"])), _styles.COLORS.correct_500, _styles.COLORS.correct_700, _styles.COLORS.correct_800, _styles.COLORS.neutral_100, _styles.COLORS.neutral_300);
-var Critical = (0, _styledComponents.default)(Primary)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n  div.button-content {\n    color: white;\n    background-color: ", ";\n  }\n  &:hover > div.button-content,\n  &.hover-state > div.button-content {\n    background-color: ", ";\n  }\n  &:active > div.button-content,\n  &.active-state > div.button-content {\n    background-color: ", ";\n  }\n\n  &:disabled > div.button-content,\n  &.disabled-state > div.button-content {\n    background-color: ", ";\n    color: ", ";    \n  }\n"])), _styles.COLORS.critical_500, _styles.COLORS.critical_700, _styles.COLORS.critical_800, _styles.COLORS.neutral_100, _styles.COLORS.neutral_300);
+  return props.colorTheme === 'teal' ? _styles.COLORS.accent1_800 : _styles.COLORS.white;
+}, _styles.COLORS.primary_700);
+exports.ButtonTertiaryStyled = ButtonTertiaryStyled;
+var ButtonPositiveStyled = (0, _styledComponents.default)(ButtonPrimaryStyled)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  div.button-content {\n    color: white;\n    background-color: ", ";\n  }\n  &:hover > div.button-content,\n  &.hover-state > div.button-content {\n    background-color: ", ";\n  }\n  &:active > div.button-content,\n  &.active-state > div.button-content {\n    background-color: ", ";\n  }\n\n  &:disabled > div.button-content,\n  &.disabled-state > div.button-content {\n    background-color: ", ";\n    color: ", ";\n  }\n"])), _styles.COLORS.correct_500, _styles.COLORS.correct_700, _styles.COLORS.correct_800, _styles.COLORS.neutral_100, _styles.COLORS.neutral_300);
+exports.ButtonPositiveStyled = ButtonPositiveStyled;
+var ButtonCriticalStyled = (0, _styledComponents.default)(ButtonPrimaryStyled)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n  div.button-content {\n    color: white;\n    background-color: ", ";\n  }\n  &:hover > div.button-content,\n  &.hover-state > div.button-content {\n    background-color: ", ";\n  }\n  &:active > div.button-content,\n  &.active-state > div.button-content {\n    background-color: ", ";\n  }\n\n  &:disabled > div.button-content,\n  &.disabled-state > div.button-content {\n    background-color: ", ";\n    color: ", ";    \n  }\n"])), _styles.COLORS.critical_500, _styles.COLORS.critical_700, _styles.COLORS.critical_800, _styles.COLORS.neutral_100, _styles.COLORS.neutral_300);
+exports.ButtonCriticalStyled = ButtonCriticalStyled;
 var Button = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var _ref$children = _ref.children,
     children = _ref$children === void 0 ? '' : _ref$children,
@@ -160,19 +165,19 @@ var Button = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       }), loading && /*#__PURE__*/(0, _jsxRuntime.jsx)(_LoadingIndicator.LoadingIndicator, {})]
     });
   };
-  var ButtonStyled = Primary;
+  var ButtonStyled = ButtonPrimaryStyled;
   switch (variant) {
     case 'secondary':
-      ButtonStyled = Secondary;
+      ButtonStyled = ButtonSecondaryStyled;
       break;
     case 'tertiary':
-      ButtonStyled = Tertiary;
+      ButtonStyled = ButtonTertiaryStyled;
       break;
     case 'positive':
-      ButtonStyled = Positive;
+      ButtonStyled = ButtonPositiveStyled;
       break;
     case 'critical':
-      ButtonStyled = Critical;
+      ButtonStyled = ButtonCriticalStyled;
       break;
   }
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(ButtonStyled, _objectSpread(_objectSpread({}, renderProps), {}, {

package/dist/Button/Button.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Button.cjs","names":["getBorderRadius","flatEdge","radius","Primary","styled","button","props","size","Size","Large","ComponentLStyling","ComponentTextStyle","Bold","colorTheme","COLORS","primary_800","white","Small","ComponentSStyling","ComponentMStyling","accent1","primary","width","minWidth","Medium","iconOnly","accent1_700","primary_100","primary_700","primary_600","accent1_800","primary_200","invertFocus","undefined","invertedFocusStyles","focusStyles","neutral_100","neutral_300","Secondary","primary_300","Tertiary","primary_500","accent1_20","primary_20","accent1_100","Positive","correct_500","correct_700","correct_800","Critical","critical_500","critical_700","critical_800","Button","React","forwardRef","ref","children","variant","type","testId","disabled","icon","loading","renderProps","renderContent","ButtonStyled","className","defaultOnMouseDownHandler","role","title"],"sources":["../../src/Button/Button.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled, { css } from 'styled-components';\r\nimport { LoadingIndicator } from '../LoadingIndicator';\r\nimport { ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentTextStyle } from '../styles';\r\nimport { COLORS, focusStyles, invertedFocusStyles } from '../styles';\r\nimport { Size, Testable } from '../types';\r\nimport { defaultOnMouseDownHandler } from '../common';\r\n\r\nconst getBorderRadius = (flatEdge: string | undefined, radius: number) => {\r\n  switch (flatEdge) {\r\n    case 'left':\r\n      return `0px ${radius}px ${radius}px 0px`;\r\n\r\n    case 'right':\r\n      return `${radius}px 0px 0px ${radius}px`;\r\n\r\n    case 'none':\r\n    default:\r\n      return `${radius}px`;\r\n  }\r\n};\r\n\r\nconst Primary = styled.button<ButtonProps>`\r\n  border: none;\r\n  background-color: transparent;\r\n  cursor: pointer;\r\n  padding: 0;\r\n  margin: 0;\r\n  position: relative;\r\n  box-sizing: border-box;\r\n  min-height: ${(props) => (props.size === Size.Large ? '56px' : '48px')};\r\n  &.loading-state {\r\n    cursor: wait;\r\n  }\r\n  div.button-content {\r\n    ${(props) =>\r\n      props.size === Size.Large\r\n        ? ComponentLStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)\r\n        : props.size === Size.Small\r\n        ? ComponentSStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)\r\n        : ComponentMStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)};\r\n\r\n    background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\r\n    border-radius: ${(props) => getBorderRadius(props.flatEdge, 8)};\r\n\r\n    width: ${(props) => props.width};\r\n    position: relative;\r\n\r\n    min-height: ${(props) => (props.size === Size.Large ? '56px' : props.size === Size.Small ? '32px' : '40px')};\r\n    min-width: ${(props) => props.minWidth};\r\n\r\n    box-sizing: border-box;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    padding: ${(props) => (props.size === Size.Large ? '14px 16px' : props.size === Size.Small ? '6px 8px' : '8px 12px')};\r\n\r\n    span.icon:not(.loading) {\r\n      pointer-events: none;\r\n    }\r\n\r\n    span.loading {\r\n      opacity: 0;\r\n    }\r\n\r\n    .icon {\r\n      margin: ${(props) => (props.size === Size.Medium ? props.iconOnly ? '-2px -8px' : '' : (props.size === Size.Small ? props.iconOnly ? '-2px -6px' : '' : '' ))};\r\n      width: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\r\n      height: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\r\n      svg {\r\n        width: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')} !important;\r\n        height: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')} !important;\r\n      }\r\n    }\r\n\r\n    .label {\r\n      margin: 0 4px;\r\n    }\r\n\r\n    div {\r\n      position: absolute;\r\n      width: 100%;\r\n      svg {\r\n        height: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\r\n        width: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\r\n        path {\r\n          fill: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary : COLORS.white)};\r\n        }\r\n      }\r\n    }\r\n  }\r\n  &:hover > div.button-content,\r\n  &.hover-state > div.button-content {\r\n    background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_100 : COLORS.primary_700)};\r\n    color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_600 : COLORS.white)};\r\n  }\r\n  &:active > div.button-content,\r\n  &.active-state > div.button-content {\r\n    background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_800)};\r\n    color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)};\r\n  }\r\n\r\n  &:focus,\r\n  &.focus-state {\r\n    ${(props) => (props.invertFocus || (props.invertFocus === undefined && props.colorTheme === 'dark') ? invertedFocusStyles : focusStyles)}\r\n  }\r\n  &:disabled,\r\n  &.disabled-state {\r\n    cursor: not-allowed;\r\n  }\r\n  &:disabled > div.button-content,\r\n  &.disabled-state > div.button-content {\r\n    pointer-events: none;\r\n    background-color: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_100)};\r\n    color: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.neutral_300)};\r\n  }\r\n`;\r\n\r\nconst Secondary = styled(Primary)<ButtonProps>`\r\n  div.button-content {\r\n    color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\r\n    background-color: transparent;\r\n    div svg path {\r\n      fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary)};\r\n    }\r\n    box-shadow: inset 0 0 0 2px ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\r\n    \r\n    padding: ${(props) => (props.size === Size.Large ? '12px 16px' : props.size === Size.Small ? '4px 8px' : '6px 12px')};\r\n  }\r\n\r\n  &:hover > div.button-content,\r\n  &.hover-state > div.button-content {\r\n    color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_700)};\r\n    box-shadow: inset 0 0 0 2px ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_700)};\r\n    \r\n    background-color: transparent;\r\n    div {\r\n      svg {\r\n        path {\r\n          fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.primary_700)};\r\n        }\r\n      }\r\n    }\r\n  }\r\n  &:active > div.button-content,\r\n  &.active-state > div.button-content {\r\n    color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_300 : COLORS.primary_800)};\r\n    box-shadow: inset 0 0 0 2px ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_300 : COLORS.primary_800)};\r\n    \r\n    background-color: transparent;\r\n    div {\r\n      svg {\r\n        path {\r\n          fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary_800)};\r\n        }\r\n      }\r\n    }\r\n  }\r\n\r\n  &:disabled > div.button-content,\r\n  &.disabled-state > div.button-content {\r\n    background-color: transparent;\r\n    color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_300)};\r\n    box-shadow: inset 0 0 0 2px ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_100)};\r\n  }\r\n`;\r\n\r\nconst Tertiary = styled(Primary)<ButtonProps>`\r\n  div.button-content {\r\n    color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary_500)};\r\n    background-color: transparent;\r\n    div svg path {\r\n      fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary)};\r\n    }\r\n    padding: ${(props) => (props.size === Size.Large ? '12px 16px' : props.size === Size.Small ? '4px 8px' : '6px 12px')};\r\n  }\r\n  &:hover > div.button-content,\r\n  &.hover-state > div.button-content {\r\n    background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_20 : COLORS.primary_20)};\r\n    color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.primary_700)};\r\n    div {\r\n      svg {\r\n        path {\r\n          fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.primary_700)};\r\n        }\r\n      }\r\n    }\r\n  }\r\n  &:active > div.button-content,\r\n  &.active-state > div.button-content {\r\n    background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_100 : COLORS.primary_100)};\r\n    color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : COLORS.primary_800)};\r\n    div {\r\n      svg {\r\n        path {\r\n          fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : COLORS.primary_800)};\r\n        }\r\n      }\r\n    }\r\n  }\r\n\r\n  &:disabled > div.button-content,\r\n  &.disabled-state > div.button-content {\r\n    background-color: white !important;\r\n    color: ${COLORS.neutral_300};\r\n    border-color: transparent !important;\r\n  }\r\n`;\r\n\r\nconst Positive = styled(Primary)<ButtonProps>`\r\n  div.button-content {\r\n    color: white;\r\n    background-color: ${COLORS.correct_500};\r\n  }\r\n  &:hover > div.button-content,\r\n  &.hover-state > div.button-content {\r\n    background-color: ${COLORS.correct_700};\r\n  }\r\n  &:active > div.button-content,\r\n  &.active-state > div.button-content {\r\n    background-color: ${COLORS.correct_800};\r\n  }\r\n\r\n  &:disabled > div.button-content,\r\n  &.disabled-state > div.button-content {\r\n    background-color: ${COLORS.neutral_100};\r\n    color: ${COLORS.neutral_300};\r\n  }\r\n`;\r\n\r\nconst Critical = styled(Primary)<ButtonProps>`\r\n  div.button-content {\r\n    color: white;\r\n    background-color: ${COLORS.critical_500};\r\n  }\r\n  &:hover > div.button-content,\r\n  &.hover-state > div.button-content {\r\n    background-color: ${COLORS.critical_700};\r\n  }\r\n  &:active > div.button-content,\r\n  &.active-state > div.button-content {\r\n    background-color: ${COLORS.critical_800};\r\n  }\r\n\r\n  &:disabled > div.button-content,\r\n  &.disabled-state > div.button-content {\r\n    background-color: ${COLORS.neutral_100};\r\n    color: ${COLORS.neutral_300};    \r\n  }\r\n`;\r\n\r\nexport interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\r\n  variant?: 'primary' | 'secondary' | 'tertiary' | 'positive' | 'critical';\r\n  flatEdge?: 'right' | 'left' | 'none' | undefined;\r\n  role?: 'button' | string;\r\n  title?: string;\r\n  size?: Size;\r\n  colorTheme?: 'teal' | 'dark';\r\n  invertFocus?: boolean;\r\n  width?: 'auto' | string;\r\n  loading?: boolean;\r\n  testId?: string;\r\n  icon?: React.ReactNode;\r\n  minWidth?: string;\r\n  iconOnly?: boolean;\r\n}\r\n\r\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\r\n  ({ children = '', variant = 'primary', type = 'button', size = Size.Medium, width = 'auto', minWidth = '64px', testId, disabled, flatEdge, icon, ...props }, ref) => {\r\n    // Let's filter out properties that we don't need to render.\r\n    const { loading, ...renderProps } = props;\r\n\r\n    const renderContent = () => (\r\n      <>\r\n        {icon && <span className={(children ? 'extramargin ' : '') + (loading ? 'icon loading' : 'icon')}>{icon}</span>}\r\n        {children && <span className={loading ? 'label loading' : 'label'}>{children}</span>}\r\n        {loading && <LoadingIndicator />}\r\n      </>\r\n    );\r\n\r\n    let ButtonStyled = Primary;\r\n    switch (variant) {\r\n      case 'secondary':\r\n        ButtonStyled = Secondary;\r\n        break;\r\n      case 'tertiary':\r\n        ButtonStyled = Tertiary;\r\n        break;\r\n      case 'positive':\r\n        ButtonStyled = Positive;\r\n        break;\r\n      case 'critical':\r\n        ButtonStyled = Critical;\r\n        break;\r\n    }\r\n\r\n    return (\r\n      <ButtonStyled\r\n        {...renderProps}\r\n        ref={ref}\r\n        disabled={disabled}\r\n        iconOnly={!children}\r\n        type={type}\r\n        size={size}\r\n        flatEdge={flatEdge}\r\n        width={width}\r\n        minWidth={minWidth}\r\n        data-testid={testId}\r\n        className={props.loading ? 'loading-state ' + props.className : ' ' + props.className}\r\n        onMouseDown={defaultOnMouseDownHandler}>\r\n        <div className=\"button-content\">{renderContent()}</div>\r\n      </ButtonStyled>\r\n    );\r\n  },\r\n);\r\n\r\nexport default Button;\r\n"],"mappings":"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"}
+{"version":3,"file":"Button.cjs","names":["getBorderRadius","flatEdge","radius","ButtonPrimaryStyled","styled","button","props","size","Size","Large","ComponentLStyling","ComponentTextStyle","Bold","colorTheme","COLORS","primary_800","white","Small","ComponentSStyling","ComponentMStyling","accent1","primary","width","minWidth","Medium","iconOnly","accent1_700","primary_100","primary_700","primary_600","accent1_800","primary_200","invertFocus","undefined","invertedFocusStyles","focusStyles","neutral_100","neutral_300","ButtonSecondaryStyled","primary_300","ButtonTertiaryStyled","accent1_20","accent1_100","ButtonPositiveStyled","correct_500","correct_700","correct_800","ButtonCriticalStyled","critical_500","critical_700","critical_800","Button","React","forwardRef","ref","children","variant","type","testId","disabled","icon","loading","renderProps","renderContent","ButtonStyled","className","defaultOnMouseDownHandler","role","title"],"sources":["../../src/Button/Button.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled, { css } from 'styled-components';\nimport { LoadingIndicator } from '../LoadingIndicator';\nimport { ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentTextStyle } from '../styles';\nimport { COLORS, focusStyles, invertedFocusStyles } from '../styles';\nimport { Size, Testable } from '../types';\nimport { defaultOnMouseDownHandler } from '../common';\n\nconst getBorderRadius = (flatEdge: string | undefined, radius: number) => {\n  switch (flatEdge) {\n    case 'left':\n      return `0px ${radius}px ${radius}px 0px`;\n\n    case 'right':\n      return `${radius}px 0px 0px ${radius}px`;\n\n    case 'none':\n    default:\n      return `${radius}px`;\n  }\n};\n\nexport const ButtonPrimaryStyled = styled.button<ButtonProps>`\n  border: none;\n  background-color: transparent;\n  cursor: pointer;\n  padding: 0;\n  margin: 0;\n  position: relative;\n  box-sizing: border-box;\n  min-height: ${(props) => (props.size === Size.Large ? '56px' : '48px')};\n  &.loading-state {\n    cursor: wait;\n  }\n  div.button-content {\n    ${(props) =>\n      props.size === Size.Large\n        ? ComponentLStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)\n        : props.size === Size.Small\n        ? ComponentSStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)\n        : ComponentMStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)};\n\n    background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\n    border-radius: ${(props) => getBorderRadius(props.flatEdge, 8)};\n\n    width: ${(props) => props.width};\n    position: relative;\n\n    min-height: ${(props) => (props.size === Size.Large ? '56px' : props.size === Size.Small ? '32px' : '40px')};\n    min-width: ${(props) => props.minWidth};\n\n    box-sizing: border-box;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: ${(props) => (props.size === Size.Large ? '14px 16px' : props.size === Size.Small ? '6px 8px' : '8px 12px')};\n\n    span.icon:not(.loading) {\n      pointer-events: none;\n    }\n\n    span.loading {\n      opacity: 0;\n    }\n\n    .icon {\n      margin: ${(props) => (props.size === Size.Medium ? props.iconOnly ? '-2px -8px' : '' : (props.size === Size.Small ? props.iconOnly ? '-2px -6px' : '' : '' ))};\n      width: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n      height: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n      svg {\n        width: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')} !important;\n        height: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')} !important;\n      }\n    }\n\n    .label {\n      margin: 0 4px;\n    }\n\n    div {\n      position: absolute;\n      width: 100%;\n      svg {\n        height: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n        width: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n        path {\n          fill: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary : COLORS.white)};\n        }\n      }\n    }\n  }\n  &:hover > div.button-content,\n  &.hover-state > div.button-content {\n    background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_100 : COLORS.primary_700)};\n    color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_600 : COLORS.white)};\n  }\n  &:active > div.button-content,\n  &.active-state > div.button-content {\n    background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_800)};\n    color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)};\n  }\n\n  &:focus,\n  &.focus-state {\n    ${(props) => (props.invertFocus || (props.invertFocus === undefined && props.colorTheme === 'dark') ? invertedFocusStyles : focusStyles)}\n  }\n  &:disabled,\n  &.disabled-state {\n    cursor: not-allowed;\n  }\n  &:disabled > div.button-content,\n  &.disabled-state > div.button-content {\n    pointer-events: none;\n    background-color: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_100)};\n    color: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.neutral_300)};\n  }\n`;\n\nexport const ButtonSecondaryStyled = styled(ButtonPrimaryStyled)<ButtonProps>`\n  div.button-content {\n    color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\n    background-color: transparent;\n    div svg path {\n      fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary)};\n    }\n    box-shadow: inset 0 0 0 2px ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\n    \n    padding: ${(props) => (props.size === Size.Large ? '12px 16px' : props.size === Size.Small ? '4px 8px' : '6px 12px')};\n  }\n\n  &:hover > div.button-content,\n  &.hover-state > div.button-content {\n    color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_700)};\n    box-shadow: inset 0 0 0 2px ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_700)};\n    \n    background-color: transparent;\n    div {\n      svg {\n        path {\n          fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.primary_700)};\n        }\n      }\n    }\n  }\n  &:active > div.button-content,\n  &.active-state > div.button-content {\n    color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_300 : COLORS.primary_800)};\n    box-shadow: inset 0 0 0 2px ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_300 : COLORS.primary_800)};\n    \n    background-color: transparent;\n    div {\n      svg {\n        path {\n          fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary_800)};\n        }\n      }\n    }\n  }\n\n  &:disabled > div.button-content,\n  &.disabled-state > div.button-content {\n    background-color: transparent;\n    color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_300)};\n    box-shadow: inset 0 0 0 2px ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_100)};\n  }\n`;\n\nexport const ButtonTertiaryStyled = styled(ButtonPrimaryStyled)<ButtonProps>`\n  div.button-content {\n    color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.white)};\n    background-color: transparent;\n    div svg path {\n      fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.white)};\n    }\n    padding: ${(props) => (props.size === Size.Large ? '12px 16px' : props.size === Size.Small ? '4px 8px' : '6px 12px')};\n  }\n  &:hover > div.button-content,\n  &.hover-state > div.button-content {\n    background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_20 : COLORS.primary_700)};\n    color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.white)};\n    div {\n      svg {\n        path {\n          fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.white)};\n        }\n      }\n    }\n  }\n  &:active > div.button-content,\n  &.active-state > div.button-content {\n    background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_100 : COLORS.primary_600)};\n    color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : COLORS.white)};\n    div {\n      svg {\n        path {\n          fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : COLORS.white)};\n        }\n      }\n    }\n  }\n\n  &:disabled > div.button-content,\n  &.disabled-state > div.button-content {\n    background-color: transparent !important;\n    color: ${COLORS.primary_700};\n    border-color: transparent !important;\n  }\n`;\n\nexport const ButtonPositiveStyled = styled(ButtonPrimaryStyled)<ButtonProps>`\n  div.button-content {\n    color: white;\n    background-color: ${COLORS.correct_500};\n  }\n  &:hover > div.button-content,\n  &.hover-state > div.button-content {\n    background-color: ${COLORS.correct_700};\n  }\n  &:active > div.button-content,\n  &.active-state > div.button-content {\n    background-color: ${COLORS.correct_800};\n  }\n\n  &:disabled > div.button-content,\n  &.disabled-state > div.button-content {\n    background-color: ${COLORS.neutral_100};\n    color: ${COLORS.neutral_300};\n  }\n`;\n\nexport const ButtonCriticalStyled = styled(ButtonPrimaryStyled)<ButtonProps>`\n  div.button-content {\n    color: white;\n    background-color: ${COLORS.critical_500};\n  }\n  &:hover > div.button-content,\n  &.hover-state > div.button-content {\n    background-color: ${COLORS.critical_700};\n  }\n  &:active > div.button-content,\n  &.active-state > div.button-content {\n    background-color: ${COLORS.critical_800};\n  }\n\n  &:disabled > div.button-content,\n  &.disabled-state > div.button-content {\n    background-color: ${COLORS.neutral_100};\n    color: ${COLORS.neutral_300};    \n  }\n`;\n\nexport interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  variant?: 'primary' | 'secondary' | 'tertiary' | 'positive' | 'critical';\n  flatEdge?: 'right' | 'left' | 'none' | undefined;\n  role?: 'button' | string;\n  title?: string;\n  size?: Size;\n  colorTheme?: 'teal' | 'dark';\n  invertFocus?: boolean;\n  width?: 'auto' | string;\n  loading?: boolean;\n  testId?: string;\n  icon?: React.ReactNode;\n  minWidth?: string;\n  iconOnly?: boolean;\n}\n\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n  ({ children = '', variant = 'primary', type = 'button', size = Size.Medium, width = 'auto', minWidth = '64px', testId, disabled, flatEdge, icon, ...props }, ref) => {\n    // Let's filter out properties that we don't need to render.\n    const { loading, ...renderProps } = props;\n\n    const renderContent = () => (\n      <>\n        {icon && <span className={(children ? 'extramargin ' : '') + (loading ? 'icon loading' : 'icon')}>{icon}</span>}\n        {children && <span className={loading ? 'label loading' : 'label'}>{children}</span>}\n        {loading && <LoadingIndicator />}\n      </>\n    );\n\n    let ButtonStyled = ButtonPrimaryStyled;\n    switch (variant) {\n      case 'secondary':\n        ButtonStyled = ButtonSecondaryStyled;\n        break;\n      case 'tertiary':\n        ButtonStyled = ButtonTertiaryStyled;\n        break;\n      case 'positive':\n        ButtonStyled = ButtonPositiveStyled;\n        break;\n      case 'critical':\n        ButtonStyled = ButtonCriticalStyled;\n        break;\n    }\n\n    return (\n      <ButtonStyled\n        {...renderProps}\n        ref={ref}\n        disabled={disabled}\n        iconOnly={!children}\n        type={type}\n        size={size}\n        flatEdge={flatEdge}\n        width={width}\n        minWidth={minWidth}\n        data-testid={testId}\n        className={props.loading ? 'loading-state ' + props.className : ' ' + props.className}\n        onMouseDown={defaultOnMouseDownHandler}>\n        <div className=\"button-content\">{renderContent()}</div>\n      </ButtonStyled>\n    );\n  },\n);\n\nexport default Button;\n"],"mappings":"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"}