@laerdal/life-react-components 1.8.0-dev.9 → 1.9.0

package/dist/Tile/TileCommonItems.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Tile/TileCommonItems.tsx"],"names":["Button","IconButton","ToggleButton","DropdownButton","React","styled","COLORS","ComponentLStyling","ComponentMStyling","ComponentSStyling","ComponentTextStyle","ComponentXSStyling","ComponentXXSStyling","HyperLink","Size","TileNoteText","div","TileNoteIcon","TileNoteWrapper","neutral_600","Regular","TileHyperLinkIcon","TileHyperLinkText","TileHyperLinkWrapper","Bold","primary_500","RenderTileItem","item","size","key","undefined","componentType","action","disabled","icon","active","onChange","defaultState","activeState","items","itemsType","onClick","actionIcon","actionLabel","actionVariant","actionLoading","multiSelect","scrollable","pinTopItem","maxHeight","noteIcon","cloneElement","Large","noteText","linkText","linkIcon","rest","buttonText"],"mappings":"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","sourcesContent":["import {\n  TileDropdownButton,\n  TileHyperLink,\n  TileIconButton,\n  TileNote,\n  TileStandardButton,\n  TileToggleButton\n} from './TileTypes';\nimport {Button, IconButton} from '../Button';\nimport {ToggleButton} from '../Toggles';\nimport {DropdownButton} from '../Dropdown';\nimport React from 'react';\nimport styled from 'styled-components';\nimport {\n  COLORS, ComponentLStyling,\n  ComponentMStyling,\n  ComponentSStyling,\n  ComponentTextStyle,\n  ComponentXSStyling,\n  ComponentXXSStyling\n} from '../styles';\nimport {HyperLink} from '../HyperLink';\nimport {Size} from '../types';\n\n\nexport const TileNoteText = styled.div``;\nexport const TileNoteIcon = styled.div``;\nexport const TileNoteWrapper = styled.div`\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  color: ${COLORS.neutral_600};\n\n  &.small {\n    gap: 4px;\n\n    ${TileNoteIcon} {\n      width: 16px;\n      height: 16px;\n    }\n\n    ${TileNoteText} {\n      ${ComponentXXSStyling(ComponentTextStyle.Regular, null)}\n    }\n  }\n\n  &.medium {\n    gap: 6px;\n\n    ${TileNoteIcon} {\n      width: 16px;\n      height: 16px;\n    }\n\n    ${TileNoteText} {\n      ${ComponentXSStyling(ComponentTextStyle.Regular, null)}\n    }\n\n  }\n\n  &.large {\n    gap: 8px;\n\n    ${TileNoteIcon} {\n      width: 20px;\n      height: 20px;\n    }\n\n    ${TileNoteText} {\n      ${ComponentSStyling(ComponentTextStyle.Regular, null)}\n    }\n  }\n`;\n\n\nexport const TileHyperLinkIcon = styled.div``;\nexport const TileHyperLinkText = styled.div``;\n\nexport const TileHyperLinkWrapper = styled.div`\n  width: max-content;\n\n  ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.primary_500)}\n  a {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    gap: 4px;\n  }\n\n  &.small {\n    ${TileHyperLinkIcon} {\n      width: 24px;\n      height: 24px;\n    }\n\n    ${TileHyperLinkText} {\n      ${ComponentSStyling(ComponentTextStyle.Bold, null)}\n    }\n  }\n\n  &.medium {\n    ${TileHyperLinkIcon} {\n      width: 24px;\n      height: 24px;\n    }\n\n    ${TileHyperLinkText} {\n      ${ComponentMStyling(ComponentTextStyle.Bold, null)}\n    }\n  }\n\n  &.large {\n    ${TileHyperLinkIcon} {\n      width: 24px;\n      height: 24px;\n    }\n\n    ${TileHyperLinkText} {\n      ${ComponentLStyling(ComponentTextStyle.Bold, null)}\n    }\n  }\n`\n\nexport const RenderTileItem = (item: TileIconButton | TileToggleButton | TileDropdownButton | TileStandardButton | TileNote | TileHyperLink,\n                               size: Size,\n                               key: any | undefined = undefined) => {\n  switch (item.componentType) {\n    case 'icon': {\n      return <IconButton key={key}\n                         variant={'secondary'}\n                         useTransparentBackground={true}\n                         shape={'circular'}\n                         action={item.action}\n                         disabled={item.disabled}>\n        {item.icon}\n      </IconButton>\n    }\n    case 'toggle': {\n      return <ToggleButton key={key}\n                           active={item.active}\n                           onChange={item.onChange}\n                           defaultState={item.defaultState}\n                           activeState={item.activeState}\n                           disabled={item.disabled}/>\n    }\n    case 'dropdown': {\n      return <DropdownButton key={key}\n                             type={'icon'}\n                             items={item.items}\n                             itemsType={item.itemsType}\n                             onClick={item.onClick}\n                             icon={item.icon}\n                             action={item.action}\n                             actionIcon={item.actionIcon}\n                             actionLabel={item.actionLabel}\n                             actionVariant={item.actionVariant}\n                             actionLoading={item.actionLoading}\n                             multiSelect={item.multiSelect}\n                             scrollable={item.scrollable}\n                             pinTopItem={item.pinTopItem}\n                             maxHeight={item.maxHeight}\n                             disabled={item.disabled}/>\n\n    }\n    case 'note': {\n      return <TileNoteWrapper key={key} className={size}>\n        {\n          item.noteIcon &&\n          <TileNoteIcon>\n            {React.cloneElement(item.noteIcon as React.ReactElement, {size: size === Size.Large ? '20px' : '16'})}\n          </TileNoteIcon>\n        }\n        <TileNoteText>{item.noteText}</TileNoteText>\n      </TileNoteWrapper>\n\n    }\n    case 'link': {\n      const {linkText, componentType, linkIcon, ...rest} = item;\n      return <TileHyperLinkWrapper className={size} key={key}>\n        <HyperLink {...rest}>\n          <TileHyperLinkIcon>\n            {React.cloneElement(linkIcon as React.ReactElement, {size: size === Size.Large ? '28px' : '24px'})}\n          </TileHyperLinkIcon>\n          <TileHyperLinkText>{linkText}</TileHyperLinkText>\n        </HyperLink>\n      </TileHyperLinkWrapper>\n    }\n    case 'button': {\n      const {buttonText, componentType, ...rest} = item;\n      return <Button key={key}\n                     size={size}\n                     {...rest}>\n        {buttonText}\n      </Button>\n    }\n  }\n}\n"],"file":"TileCommonItems.js"}
+{"version":3,"sources":["../../src/Tile/TileCommonItems.tsx"],"names":["Button","IconButton","ToggleButton","DropdownButton","React","styled","COLORS","ComponentLStyling","ComponentMStyling","ComponentSStyling","ComponentTextStyle","ComponentXSStyling","ComponentXXSStyling","HyperLink","Size","TileNoteText","div","TileNoteIcon","TileNoteWrapper","neutral_600","Regular","TileHyperLinkIcon","TileHyperLinkText","TileHyperLinkWrapper","Bold","primary_500","RenderTileItem","item","size","key","undefined","componentType","action","disabled","icon","active","onChange","defaultState","activeState","items","itemsType","onClick","actionIcon","actionLabel","actionVariant","actionLoading","multiSelect","scrollable","pinTopItem","maxHeight","noteIcon","cloneElement","Large","noteText","linkText","linkIcon","rest","buttonText"],"mappings":"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","sourcesContent":["import {\n  TileDropdownButton,\n  TileHyperLink,\n  TileIconButton,\n  TileNote,\n  TileStandardButton,\n  TileToggleButton\n} from './TileTypes';\nimport {Button, IconButton} from '../Button';\nimport {ToggleButton} from '../Toggles';\nimport {DropdownButton} from '../Dropdown';\nimport React from 'react';\nimport styled from 'styled-components';\nimport {\n  COLORS, ComponentLStyling,\n  ComponentMStyling,\n  ComponentSStyling,\n  ComponentTextStyle,\n  ComponentXSStyling,\n  ComponentXXSStyling\n} from '../styles';\nimport {HyperLink} from '../HyperLink';\nimport {Size} from '../types';\n\n\nexport const TileNoteText = styled.div``;\nexport const TileNoteIcon = styled.div``;\nexport const TileNoteWrapper = styled.div`\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  color: ${COLORS.neutral_600};\n\n  &.small {\n    gap: 4px;\n\n    ${TileNoteIcon} {\n      width: 16px;\n      height: 16px;\n    }\n\n    ${TileNoteText} {\n      ${ComponentXXSStyling(ComponentTextStyle.Regular, null)}\n    }\n  }\n\n  &.medium {\n    gap: 6px;\n\n    ${TileNoteIcon} {\n      width: 16px;\n      height: 16px;\n    }\n\n    ${TileNoteText} {\n      ${ComponentXSStyling(ComponentTextStyle.Regular, null)}\n    }\n\n  }\n\n  &.large {\n    gap: 8px;\n\n    ${TileNoteIcon} {\n      width: 20px;\n      height: 20px;\n    }\n\n    ${TileNoteText} {\n      ${ComponentSStyling(ComponentTextStyle.Regular, null)}\n    }\n  }\n`;\n\n\nexport const TileHyperLinkIcon = styled.div``;\nexport const TileHyperLinkText = styled.div``;\n\nexport const TileHyperLinkWrapper = styled.div`\n  width: max-content;\n\n  ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.primary_500)}\n  a {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    gap: 4px;\n  }\n\n  &.small {\n    ${TileHyperLinkIcon} {\n      width: 24px;\n      height: 24px;\n    }\n\n    ${TileHyperLinkText} {\n      ${ComponentSStyling(ComponentTextStyle.Bold, null)}\n    }\n\n    a {\n      gap: 4px;\n    }\n  }\n\n  &.medium {\n    ${TileHyperLinkIcon} {\n      width: 24px;\n      height: 24px;\n    }\n\n    ${TileHyperLinkText} {\n      ${ComponentMStyling(ComponentTextStyle.Bold, null)}\n    }\n\n    a {\n      gap: 6px;\n    }\n  }\n\n  &.large {\n    ${TileHyperLinkIcon} {\n      width: 28px;\n      height: 28px;\n    }\n\n    ${TileHyperLinkText} {\n      ${ComponentLStyling(ComponentTextStyle.Bold, null)}\n    }\n\n    a {\n      gap: 8px;\n    }\n  }\n`\n\nexport const RenderTileItem = (item: TileIconButton | TileToggleButton | TileDropdownButton | TileStandardButton | TileNote | TileHyperLink,\n                               size: Size,\n                               key: any | undefined = undefined) => {\n  switch (item.componentType) {\n    case 'icon': {\n      return <IconButton key={key}\n                         variant={'secondary'}\n                         useTransparentBackground={true}\n                         shape={'circular'}\n                         action={item.action}\n                         disabled={item.disabled}>\n        {item.icon}\n      </IconButton>\n    }\n    case 'toggle': {\n      return <ToggleButton key={key}\n                           active={item.active}\n                           onChange={item.onChange}\n                           defaultState={item.defaultState}\n                           activeState={item.activeState}\n                           disabled={item.disabled}/>\n    }\n    case 'dropdown': {\n      return <DropdownButton key={key}\n                             type={'icon'}\n                             items={item.items}\n                             itemsType={item.itemsType}\n                             onClick={item.onClick}\n                             icon={item.icon}\n                             action={item.action}\n                             actionIcon={item.actionIcon}\n                             actionLabel={item.actionLabel}\n                             actionVariant={item.actionVariant}\n                             actionLoading={item.actionLoading}\n                             multiSelect={item.multiSelect}\n                             scrollable={item.scrollable}\n                             pinTopItem={item.pinTopItem}\n                             maxHeight={item.maxHeight}\n                             disabled={item.disabled}/>\n\n    }\n    case 'note': {\n      return <TileNoteWrapper key={key} className={size}>\n        {\n          item.noteIcon &&\n          <TileNoteIcon>\n            {React.cloneElement(item.noteIcon as React.ReactElement, {size: size === Size.Large ? '20px' : '16'})}\n          </TileNoteIcon>\n        }\n        <TileNoteText>{item.noteText}</TileNoteText>\n      </TileNoteWrapper>\n\n    }\n    case 'link': {\n      const {linkText, componentType, linkIcon, ...rest} = item;\n      return <TileHyperLinkWrapper className={size} key={key}>\n        <HyperLink {...rest}>\n          <TileHyperLinkIcon>\n            {React.cloneElement(linkIcon as React.ReactElement, {size: size === Size.Large ? '28px' : '24px'})}\n          </TileHyperLinkIcon>\n          <TileHyperLinkText>{linkText}</TileHyperLinkText>\n        </HyperLink>\n      </TileHyperLinkWrapper>\n    }\n    case 'button': {\n      const {buttonText, componentType, ...rest} = item;\n      return <Button key={key}\n                     size={size}\n                     {...rest}>\n        {buttonText}\n      </Button>\n    }\n  }\n}\n"],"file":"TileCommonItems.js"}

package/dist/Tile/TileFooter.cjs

@@ -21,7 +21,7 @@ var _jsxRuntime = require("react/jsx-runtime");
 
 var _templateObject, _templateObject2, _templateObject3;
 
-var Wrapper = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n\n  min-height: 56px;\n  box-sizing: border-box;\n\n  &.small {\n    padding: 0 16px;\n    min-height: 56px;\n    gap: 4px;\n  }\n\n  &.medium {\n    padding: 0 20px;\n    min-height: 64px;\n    gap: 4px;\n  }\n\n  &.large {\n    padding: 0 24px;\n    min-height: 72px;\n    gap: 8px;\n  }\n"])));
+var Wrapper = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n\n  min-height: 56px;\n  box-sizing: border-box;\n\n  &.small {\n    padding: 0 16px;\n    min-height: 56px;\n    gap: 4px;\n  }\n\n  &.medium {\n    padding: 0 20px;\n    min-height: 64px;\n    gap: 4px;\n  }\n\n  &.large {\n    padding: 0 24px;\n    min-height: 80px;\n    gap: 8px;\n  }\n"])));
 
 var LeftItemContainer = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  flex: 1\n"])));
 

package/dist/Tile/TileFooter.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Tile/TileFooter.tsx"],"names":["Wrapper","styled","div","LeftItemContainer","RightItemContainer","COLORS","neutral_600","TileFooter","buttons","leftItem","size","map","value","index"],"mappings":";;;;;;;;;;;AAAA;;AAGA;;AACA;;AACA;;;;;;AAEA,IAAMA,OAAO,GAAGC,0BAAOC,GAAV,0bAAb;;AA2BA,IAAMC,iBAAiB,GAAGF,0BAAOC,GAAV,kGAAvB;;AAIA,IAAME,kBAAkB,GAAGH,0BAAOC,GAAV,gLAIbG,eAAOC,WAJM,CAAxB;;AAOA,IAAMC,UAAqE,GAAG,SAAxEA,UAAwE,OAA+B;AAAA,MAA7BC,OAA6B,QAA7BA,OAA6B;AAAA,MAApBC,QAAoB,QAApBA,QAAoB;AAAA,MAAVC,IAAU,QAAVA,IAAU;AAE3G,sBACE,sBAAC,OAAD;AAAS,IAAA,SAAS,EAAEA,IAApB;AAAA,4BACE,qBAAC,iBAAD;AAAA,gBAAoBD,QAAQ,IAAI,qCAAeA,QAAf,EAAyBC,IAAzB;AAAhC,MADF,eAEE,qBAAC,kBAAD;AAAA,gBAAqBF,OAAO,IAAIA,OAAO,CAACG,GAAR,CAAY,UAACC,KAAD,EAAQC,KAAR;AAAA,eAAkB,qCAAeD,KAAf,EAAsBF,IAAtB,EAA4BG,KAA5B,CAAlB;AAAA,OAAZ;AAAhC,MAFF;AAAA,IADF;AAMD,CARD;;eAUeN,U","sourcesContent":["import React from 'react';\nimport {TileFooterProps} from './TileTypes';\nimport {Size} from '../types';\nimport styled from 'styled-components';\nimport {RenderTileItem} from './TileCommonItems';\nimport {COLORS} from '../styles';\n\nconst Wrapper = styled.div`\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n\n  min-height: 56px;\n  box-sizing: border-box;\n\n  &.small {\n    padding: 0 16px;\n    min-height: 56px;\n    gap: 4px;\n  }\n\n  &.medium {\n    padding: 0 20px;\n    min-height: 64px;\n    gap: 4px;\n  }\n\n  &.large {\n    padding: 0 24px;\n    min-height: 72px;\n    gap: 8px;\n  }\n`;\n\nconst LeftItemContainer = styled.div`\n  flex: 1\n`;\n\nconst RightItemContainer = styled.div`\n  display: flex;\n  flex-direction: row;\n  justify-content: flex-end;\n  color: ${COLORS.neutral_600};\n`;\n\nconst TileFooter: React.FunctionComponent<TileFooterProps & { size: Size }> = ({buttons, leftItem, size}) => {\n\n  return (\n    <Wrapper className={size}>\n      <LeftItemContainer>{leftItem && RenderTileItem(leftItem, size)}</LeftItemContainer>\n      <RightItemContainer>{buttons && buttons.map((value, index) => RenderTileItem(value, size, index))}</RightItemContainer>\n    </Wrapper>\n  )\n}\n\nexport default TileFooter;\n"],"file":"TileFooter.cjs"}
+{"version":3,"sources":["../../src/Tile/TileFooter.tsx"],"names":["Wrapper","styled","div","LeftItemContainer","RightItemContainer","COLORS","neutral_600","TileFooter","buttons","leftItem","size","map","value","index"],"mappings":";;;;;;;;;;;AAAA;;AAGA;;AACA;;AACA;;;;;;AAEA,IAAMA,OAAO,GAAGC,0BAAOC,GAAV,0bAAb;;AA2BA,IAAMC,iBAAiB,GAAGF,0BAAOC,GAAV,kGAAvB;;AAIA,IAAME,kBAAkB,GAAGH,0BAAOC,GAAV,gLAIbG,eAAOC,WAJM,CAAxB;;AAOA,IAAMC,UAAqE,GAAG,SAAxEA,UAAwE,OAA+B;AAAA,MAA7BC,OAA6B,QAA7BA,OAA6B;AAAA,MAApBC,QAAoB,QAApBA,QAAoB;AAAA,MAAVC,IAAU,QAAVA,IAAU;AAE3G,sBACE,sBAAC,OAAD;AAAS,IAAA,SAAS,EAAEA,IAApB;AAAA,4BACE,qBAAC,iBAAD;AAAA,gBAAoBD,QAAQ,IAAI,qCAAeA,QAAf,EAAyBC,IAAzB;AAAhC,MADF,eAEE,qBAAC,kBAAD;AAAA,gBAAqBF,OAAO,IAAIA,OAAO,CAACG,GAAR,CAAY,UAACC,KAAD,EAAQC,KAAR;AAAA,eAAkB,qCAAeD,KAAf,EAAsBF,IAAtB,EAA4BG,KAA5B,CAAlB;AAAA,OAAZ;AAAhC,MAFF;AAAA,IADF;AAMD,CARD;;eAUeN,U","sourcesContent":["import React from 'react';\nimport {TileFooterProps} from './TileTypes';\nimport {Size} from '../types';\nimport styled from 'styled-components';\nimport {RenderTileItem} from './TileCommonItems';\nimport {COLORS} from '../styles';\n\nconst Wrapper = styled.div`\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n\n  min-height: 56px;\n  box-sizing: border-box;\n\n  &.small {\n    padding: 0 16px;\n    min-height: 56px;\n    gap: 4px;\n  }\n\n  &.medium {\n    padding: 0 20px;\n    min-height: 64px;\n    gap: 4px;\n  }\n\n  &.large {\n    padding: 0 24px;\n    min-height: 80px;\n    gap: 8px;\n  }\n`;\n\nconst LeftItemContainer = styled.div`\n  flex: 1\n`;\n\nconst RightItemContainer = styled.div`\n  display: flex;\n  flex-direction: row;\n  justify-content: flex-end;\n  color: ${COLORS.neutral_600};\n`;\n\nconst TileFooter: React.FunctionComponent<TileFooterProps & { size: Size }> = ({buttons, leftItem, size}) => {\n\n  return (\n    <Wrapper className={size}>\n      <LeftItemContainer>{leftItem && RenderTileItem(leftItem, size)}</LeftItemContainer>\n      <RightItemContainer>{buttons && buttons.map((value, index) => RenderTileItem(value, size, index))}</RightItemContainer>\n    </Wrapper>\n  )\n}\n\nexport default TileFooter;\n"],"file":"TileFooter.cjs"}

package/dist/Tile/TileFooter.js

@@ -8,7 +8,7 @@ import { RenderTileItem } from './TileCommonItems';
 import { COLORS } from '../styles';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
-var Wrapper = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n\n  min-height: 56px;\n  box-sizing: border-box;\n\n  &.small {\n    padding: 0 16px;\n    min-height: 56px;\n    gap: 4px;\n  }\n\n  &.medium {\n    padding: 0 20px;\n    min-height: 64px;\n    gap: 4px;\n  }\n\n  &.large {\n    padding: 0 24px;\n    min-height: 72px;\n    gap: 8px;\n  }\n"])));
+var Wrapper = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n\n  min-height: 56px;\n  box-sizing: border-box;\n\n  &.small {\n    padding: 0 16px;\n    min-height: 56px;\n    gap: 4px;\n  }\n\n  &.medium {\n    padding: 0 20px;\n    min-height: 64px;\n    gap: 4px;\n  }\n\n  &.large {\n    padding: 0 24px;\n    min-height: 80px;\n    gap: 8px;\n  }\n"])));
 var LeftItemContainer = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  flex: 1\n"])));
 var RightItemContainer = styled.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  justify-content: flex-end;\n  color: ", ";\n"])), COLORS.neutral_600);
 

package/dist/Tile/TileFooter.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Tile/TileFooter.tsx"],"names":["React","styled","RenderTileItem","COLORS","Wrapper","div","LeftItemContainer","RightItemContainer","neutral_600","TileFooter","buttons","leftItem","size","map","value","index"],"mappings":";;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAGA,OAAOC,MAAP,MAAmB,mBAAnB;AACA,SAAQC,cAAR,QAA6B,mBAA7B;AACA,SAAQC,MAAR,QAAqB,WAArB;;;AAEA,IAAMC,OAAO,GAAGH,MAAM,CAACI,GAAV,4aAAb;AA2BA,IAAMC,iBAAiB,GAAGL,MAAM,CAACI,GAAV,oFAAvB;AAIA,IAAME,kBAAkB,GAAGN,MAAM,CAACI,GAAV,kKAIbF,MAAM,CAACK,WAJM,CAAxB;;AAOA,IAAMC,UAAqE,GAAG,SAAxEA,UAAwE,OAA+B;AAAA,MAA7BC,OAA6B,QAA7BA,OAA6B;AAAA,MAApBC,QAAoB,QAApBA,QAAoB;AAAA,MAAVC,IAAU,QAAVA,IAAU;AAE3G,sBACE,MAAC,OAAD;AAAS,IAAA,SAAS,EAAEA,IAApB;AAAA,4BACE,KAAC,iBAAD;AAAA,gBAAoBD,QAAQ,IAAIT,cAAc,CAACS,QAAD,EAAWC,IAAX;AAA9C,MADF,eAEE,KAAC,kBAAD;AAAA,gBAAqBF,OAAO,IAAIA,OAAO,CAACG,GAAR,CAAY,UAACC,KAAD,EAAQC,KAAR;AAAA,eAAkBb,cAAc,CAACY,KAAD,EAAQF,IAAR,EAAcG,KAAd,CAAhC;AAAA,OAAZ;AAAhC,MAFF;AAAA,IADF;AAMD,CARD;;AAUA,eAAeN,UAAf","sourcesContent":["import React from 'react';\nimport {TileFooterProps} from './TileTypes';\nimport {Size} from '../types';\nimport styled from 'styled-components';\nimport {RenderTileItem} from './TileCommonItems';\nimport {COLORS} from '../styles';\n\nconst Wrapper = styled.div`\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n\n  min-height: 56px;\n  box-sizing: border-box;\n\n  &.small {\n    padding: 0 16px;\n    min-height: 56px;\n    gap: 4px;\n  }\n\n  &.medium {\n    padding: 0 20px;\n    min-height: 64px;\n    gap: 4px;\n  }\n\n  &.large {\n    padding: 0 24px;\n    min-height: 72px;\n    gap: 8px;\n  }\n`;\n\nconst LeftItemContainer = styled.div`\n  flex: 1\n`;\n\nconst RightItemContainer = styled.div`\n  display: flex;\n  flex-direction: row;\n  justify-content: flex-end;\n  color: ${COLORS.neutral_600};\n`;\n\nconst TileFooter: React.FunctionComponent<TileFooterProps & { size: Size }> = ({buttons, leftItem, size}) => {\n\n  return (\n    <Wrapper className={size}>\n      <LeftItemContainer>{leftItem && RenderTileItem(leftItem, size)}</LeftItemContainer>\n      <RightItemContainer>{buttons && buttons.map((value, index) => RenderTileItem(value, size, index))}</RightItemContainer>\n    </Wrapper>\n  )\n}\n\nexport default TileFooter;\n"],"file":"TileFooter.js"}
+{"version":3,"sources":["../../src/Tile/TileFooter.tsx"],"names":["React","styled","RenderTileItem","COLORS","Wrapper","div","LeftItemContainer","RightItemContainer","neutral_600","TileFooter","buttons","leftItem","size","map","value","index"],"mappings":";;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAGA,OAAOC,MAAP,MAAmB,mBAAnB;AACA,SAAQC,cAAR,QAA6B,mBAA7B;AACA,SAAQC,MAAR,QAAqB,WAArB;;;AAEA,IAAMC,OAAO,GAAGH,MAAM,CAACI,GAAV,4aAAb;AA2BA,IAAMC,iBAAiB,GAAGL,MAAM,CAACI,GAAV,oFAAvB;AAIA,IAAME,kBAAkB,GAAGN,MAAM,CAACI,GAAV,kKAIbF,MAAM,CAACK,WAJM,CAAxB;;AAOA,IAAMC,UAAqE,GAAG,SAAxEA,UAAwE,OAA+B;AAAA,MAA7BC,OAA6B,QAA7BA,OAA6B;AAAA,MAApBC,QAAoB,QAApBA,QAAoB;AAAA,MAAVC,IAAU,QAAVA,IAAU;AAE3G,sBACE,MAAC,OAAD;AAAS,IAAA,SAAS,EAAEA,IAApB;AAAA,4BACE,KAAC,iBAAD;AAAA,gBAAoBD,QAAQ,IAAIT,cAAc,CAACS,QAAD,EAAWC,IAAX;AAA9C,MADF,eAEE,KAAC,kBAAD;AAAA,gBAAqBF,OAAO,IAAIA,OAAO,CAACG,GAAR,CAAY,UAACC,KAAD,EAAQC,KAAR;AAAA,eAAkBb,cAAc,CAACY,KAAD,EAAQF,IAAR,EAAcG,KAAd,CAAhC;AAAA,OAAZ;AAAhC,MAFF;AAAA,IADF;AAMD,CARD;;AAUA,eAAeN,UAAf","sourcesContent":["import React from 'react';\nimport {TileFooterProps} from './TileTypes';\nimport {Size} from '../types';\nimport styled from 'styled-components';\nimport {RenderTileItem} from './TileCommonItems';\nimport {COLORS} from '../styles';\n\nconst Wrapper = styled.div`\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n\n  min-height: 56px;\n  box-sizing: border-box;\n\n  &.small {\n    padding: 0 16px;\n    min-height: 56px;\n    gap: 4px;\n  }\n\n  &.medium {\n    padding: 0 20px;\n    min-height: 64px;\n    gap: 4px;\n  }\n\n  &.large {\n    padding: 0 24px;\n    min-height: 80px;\n    gap: 8px;\n  }\n`;\n\nconst LeftItemContainer = styled.div`\n  flex: 1\n`;\n\nconst RightItemContainer = styled.div`\n  display: flex;\n  flex-direction: row;\n  justify-content: flex-end;\n  color: ${COLORS.neutral_600};\n`;\n\nconst TileFooter: React.FunctionComponent<TileFooterProps & { size: Size }> = ({buttons, leftItem, size}) => {\n\n  return (\n    <Wrapper className={size}>\n      <LeftItemContainer>{leftItem && RenderTileItem(leftItem, size)}</LeftItemContainer>\n      <RightItemContainer>{buttons && buttons.map((value, index) => RenderTileItem(value, size, index))}</RightItemContainer>\n    </Wrapper>\n  )\n}\n\nexport default TileFooter;\n"],"file":"TileFooter.js"}

package/dist/Tile/TileHeader.cjs

@@ -37,7 +37,7 @@ var TextContainer = _styledComponents.default.div(_templateObject3 || (_template
 
 var ActionContainer = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  align-items: center;\n"])));
 
-var Wrapper = _styledComponents.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  align-items: center;\n\n  min-height: 56px;\n  box-sizing: border-box;\n\n  &.small {\n    padding: 4px 16px;\n    min-height: 56px;\n\n    ", " {\n      ", "\n    }\n\n    ", " {\n      ", "\n    }\n  }\n\n  &.medium {\n    padding: 8px 20px;\n    min-height: 64px;\n\n    ", " {\n      ", "\n    }\n\n    ", " {\n      ", "\n    }\n\n  }\n\n  &.large {\n    padding: 12px 24px;\n    min-height: 72px;\n\n    ", " {\n      ", "\n    }\n\n    ", " {\n      ", "\n    }\n\n  }\n"])), TagLineContainer, (0, _styles.ComponentXXSStyling)(_styles.ComponentTextStyle.Regular, null), TitleContainer, (0, _styles.ComponentSStyling)(_styles.ComponentTextStyle.Bold, null), TagLineContainer, (0, _styles.ComponentSStyling)(_styles.ComponentTextStyle.Regular, null), TitleContainer, (0, _styles.ComponentMStyling)(_styles.ComponentTextStyle.Bold, null), TagLineContainer, (0, _styles.ComponentSStyling)(_styles.ComponentTextStyle.Regular, null), TitleContainer, (0, _styles.ComponentLStyling)(_styles.ComponentTextStyle.Bold, null));
+var Wrapper = _styledComponents.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  align-items: center;\n\n  min-height: 56px;\n  box-sizing: border-box;\n\n  &.small {\n    padding: 4px 16px;\n    min-height: 56px;\n\n    ", " {\n      ", "\n    }\n\n    ", " {\n      ", "\n    }\n  }\n\n  &.medium {\n    padding: 8px 20px;\n    min-height: 64px;\n\n    ", " {\n      ", "\n    }\n\n    ", " {\n      ", "\n    }\n\n  }\n\n  &.large {\n    padding: 12px 24px;\n    min-height: 72px;\n\n    ", " {\n      ", "\n    }\n\n    ", " {\n      ", "\n    }\n\n  }\n"])), TagLineContainer, (0, _styles.ComponentXXSStyling)(_styles.ComponentTextStyle.Regular, null), TitleContainer, (0, _styles.ComponentSStyling)(_styles.ComponentTextStyle.Bold, null), TagLineContainer, (0, _styles.ComponentXSStyling)(_styles.ComponentTextStyle.Regular, null), TitleContainer, (0, _styles.ComponentMStyling)(_styles.ComponentTextStyle.Bold, null), TagLineContainer, (0, _styles.ComponentSStyling)(_styles.ComponentTextStyle.Regular, null), TitleContainer, (0, _styles.ComponentLStyling)(_styles.ComponentTextStyle.Bold, null));
 
 var TileHeader = function TileHeader(_ref) {
   var title = _ref.title,

package/dist/Tile/TileHeader.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Tile/TileHeader.tsx"],"names":["TagLineContainer","styled","div","COLORS","neutral_600","TitleContainer","black","TextContainer","ActionContainer","Wrapper","ComponentTextStyle","Regular","Bold","TileHeader","title","tagLine","tooltip","buttons","size","renderTooltip","Size","XSmall","cursor","map","item","index"],"mappings":";;;;;;;;;;;AAAA;;AAEA;;AACA;;AACA;;AAQA;;AACA;;AACA;;AACA;;;;;;AAEA,IAAMA,gBAAgB,GAAGC,0BAAOC,GAAV,sGACXC,eAAOC,WADI,CAAtB;;AAIA,IAAMC,cAAc,GAAGJ,0BAAOC,GAAV,wGACTC,eAAOG,KADE,CAApB;;AAIA,IAAMC,aAAa,GAAGN,0BAAOC,GAAV,4KAAnB;;AAOA,IAAMM,eAAe,GAAGP,0BAAOC,GAAV,iIAArB;;AAKA,IAAMO,OAAO,GAAGR,0BAAOC,GAAV,ykBAWPF,gBAXO,EAYL,iCAAoBU,2BAAmBC,OAAvC,EAAgD,IAAhD,CAZK,EAePN,cAfO,EAgBL,+BAAkBK,2BAAmBE,IAArC,EAA2C,IAA3C,CAhBK,EAwBPZ,gBAxBO,EAyBL,+BAAkBU,2BAAmBC,OAArC,EAA8C,IAA9C,CAzBK,EA4BPN,cA5BO,EA6BL,+BAAkBK,2BAAmBE,IAArC,EAA2C,IAA3C,CA7BK,EAsCPZ,gBAtCO,EAuCL,+BAAkBU,2BAAmBC,OAArC,EAA8C,IAA9C,CAvCK,EA0CPN,cA1CO,EA2CL,+BAAkBK,2BAAmBE,IAArC,EAA2C,IAA3C,CA3CK,CAAb;;AAkDA,IAAMC,UAAqE,GAAG,SAAxEA,UAAwE,OAMO;AAAA,MALJC,KAKI,QALJA,KAKI;AAAA,MAJJC,OAII,QAJJA,OAII;AAAA,MAHJC,OAGI,QAHJA,OAGI;AAAA,MAFJC,OAEI,QAFJA,OAEI;AAAA,MADJC,IACI,QADJA,IACI;;AAEnF,MAAMC,aAAa,GAAG,SAAhBA,aAAgB;AAAA,WACpB,CAAC,CAACH,OAAF,iBACA,qBAAC,wBAAD;AAAgB,MAAA,KAAK,EAAC,IAAtB;AAA2B,MAAA,IAAI,EAAEI,YAAKC,MAAtC;AACgB,MAAA,KAAK,EAAC,QADtB;AAEgB,MAAA,QAAQ,EAAC,QAFzB;AAGgB,MAAA,SAAS,EAAE,KAH3B;AAIgB,MAAA,KAAK,EAAEL,OAJvB;AAAA,6BAKE,qBAAC,kBAAD;AAAY,QAAA,OAAO,EAAC,WAApB;AACY,QAAA,KAAK,EAAC,UADlB;AAEY,QAAA,KAAK,EAAE;AAACM,UAAAA,MAAM,EAAE;AAAT,SAFnB;AAGY,QAAA,MAAM,EAAE,kBAAM,CACb,CAJb;AAAA,+BAKE,qBAAC,iBAAD;AAAM,UAAA,IAAI,EAAC,MAAX;AAAkB,UAAA,KAAK,EAAEnB,eAAOC;AAAhC;AALF;AALF,MAFoB;AAAA,GAAtB;;AAiBA,sBACE,sBAAC,OAAD;AAAS,IAAA,SAAS,EAAEc,IAApB;AAAA,4BACE,sBAAC,aAAD;AAAA,iBACGH,OAAO,iBAAI,qBAAC,gBAAD;AAAA,kBAAmBA;AAAnB,QADd,eAEE,qBAAC,cAAD;AAAA,kBAAiBD;AAAjB,QAFF;AAAA,MADF,eAKE,sBAAC,eAAD;AAAA,iBACGK,aAAa,EADhB,EAEGF,OAAO,IAAIA,OAAO,CAACM,GAAR,CAAY,UAACC,IAAD,EAAOC,KAAP;AAAA,eAAiB,qCAAeD,IAAf,EAAqBN,IAArB,EAA2BO,KAA3B,CAAjB;AAAA,OAAZ,CAFd;AAAA,MALF;AAAA,IADF;AAYD,CArCD;;eAuCeZ,U","sourcesContent":["import React from 'react';\nimport {TileHeaderProps} from './TileTypes';\nimport {Size} from '../types';\nimport styled from 'styled-components';\nimport {\n  COLORS,\n  ComponentLStyling,\n  ComponentMStyling,\n  ComponentSStyling,\n  ComponentTextStyle,\n  ComponentXXSStyling\n} from '../styles';\nimport {TooltipWrapper} from '../Tooltips';\nimport {IconButton} from '../Button';\nimport {Help} from '../icons/systemicons/SystemIcons';\nimport {RenderTileItem} from './TileCommonItems';\n\nconst TagLineContainer = styled.div`\n  color: ${COLORS.neutral_600};\n`;\n\nconst TitleContainer = styled.div`\n  color: ${COLORS.black};\n`;\n\nconst TextContainer = styled.div`\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  flex: 1;\n`;\n\nconst ActionContainer = styled.div`\n  display: flex;\n  align-items: center;\n`;\n\nconst Wrapper = styled.div`\n  display: flex;\n  align-items: center;\n\n  min-height: 56px;\n  box-sizing: border-box;\n\n  &.small {\n    padding: 4px 16px;\n    min-height: 56px;\n\n    ${TagLineContainer} {\n      ${ComponentXXSStyling(ComponentTextStyle.Regular, null)}\n    }\n\n    ${TitleContainer} {\n      ${ComponentSStyling(ComponentTextStyle.Bold, null)}\n    }\n  }\n\n  &.medium {\n    padding: 8px 20px;\n    min-height: 64px;\n\n    ${TagLineContainer} {\n      ${ComponentSStyling(ComponentTextStyle.Regular, null)}\n    }\n\n    ${TitleContainer} {\n      ${ComponentMStyling(ComponentTextStyle.Bold, null)}\n    }\n\n  }\n\n  &.large {\n    padding: 12px 24px;\n    min-height: 72px;\n\n    ${TagLineContainer} {\n      ${ComponentSStyling(ComponentTextStyle.Regular, null)}\n    }\n\n    ${TitleContainer} {\n      ${ComponentLStyling(ComponentTextStyle.Bold, null)}\n    }\n\n  }\n`;\n\n\nconst TileHeader: React.FunctionComponent<TileHeaderProps & { size: Size }> = ({\n                                                                                 title,\n                                                                                 tagLine,\n                                                                                 tooltip,\n                                                                                 buttons,\n                                                                                 size\n                                                                               }) => {\n\n  const renderTooltip = () =>\n    !!tooltip &&\n    <TooltipWrapper delay=\"0s\" size={Size.XSmall}\n                    align=\"center\"\n                    position=\"bottom\"\n                    withArrow={false}\n                    label={tooltip}>\n      <IconButton variant=\"secondary\"\n                  shape=\"circular\"\n                  style={{cursor: 'help'}}\n                  action={() => {\n                  }}>\n        <Help size=\"24px\" color={COLORS.neutral_600}/>\n      </IconButton>\n    </TooltipWrapper>;\n\n\n  return (\n    <Wrapper className={size}>\n      <TextContainer>\n        {tagLine && <TagLineContainer>{tagLine}</TagLineContainer>}\n        <TitleContainer>{title}</TitleContainer>\n      </TextContainer>\n      <ActionContainer>\n        {renderTooltip()}\n        {buttons && buttons.map((item, index) => RenderTileItem(item, size, index))}\n      </ActionContainer>\n    </Wrapper>\n  )\n}\n\nexport default TileHeader;\n"],"file":"TileHeader.cjs"}
+{"version":3,"sources":["../../src/Tile/TileHeader.tsx"],"names":["TagLineContainer","styled","div","COLORS","neutral_600","TitleContainer","black","TextContainer","ActionContainer","Wrapper","ComponentTextStyle","Regular","Bold","TileHeader","title","tagLine","tooltip","buttons","size","renderTooltip","Size","XSmall","cursor","map","item","index"],"mappings":";;;;;;;;;;;AAAA;;AAEA;;AACA;;AACA;;AAQA;;AACA;;AACA;;AACA;;;;;;AAEA,IAAMA,gBAAgB,GAAGC,0BAAOC,GAAV,sGACXC,eAAOC,WADI,CAAtB;;AAIA,IAAMC,cAAc,GAAGJ,0BAAOC,GAAV,wGACTC,eAAOG,KADE,CAApB;;AAIA,IAAMC,aAAa,GAAGN,0BAAOC,GAAV,4KAAnB;;AAOA,IAAMM,eAAe,GAAGP,0BAAOC,GAAV,iIAArB;;AAKA,IAAMO,OAAO,GAAGR,0BAAOC,GAAV,ykBAWPF,gBAXO,EAYL,iCAAoBU,2BAAmBC,OAAvC,EAAgD,IAAhD,CAZK,EAePN,cAfO,EAgBL,+BAAkBK,2BAAmBE,IAArC,EAA2C,IAA3C,CAhBK,EAwBPZ,gBAxBO,EAyBL,gCAAmBU,2BAAmBC,OAAtC,EAA+C,IAA/C,CAzBK,EA4BPN,cA5BO,EA6BL,+BAAkBK,2BAAmBE,IAArC,EAA2C,IAA3C,CA7BK,EAsCPZ,gBAtCO,EAuCL,+BAAkBU,2BAAmBC,OAArC,EAA8C,IAA9C,CAvCK,EA0CPN,cA1CO,EA2CL,+BAAkBK,2BAAmBE,IAArC,EAA2C,IAA3C,CA3CK,CAAb;;AAkDA,IAAMC,UAAqE,GAAG,SAAxEA,UAAwE,OAMO;AAAA,MALJC,KAKI,QALJA,KAKI;AAAA,MAJJC,OAII,QAJJA,OAII;AAAA,MAHJC,OAGI,QAHJA,OAGI;AAAA,MAFJC,OAEI,QAFJA,OAEI;AAAA,MADJC,IACI,QADJA,IACI;;AAEnF,MAAMC,aAAa,GAAG,SAAhBA,aAAgB;AAAA,WACpB,CAAC,CAACH,OAAF,iBACA,qBAAC,wBAAD;AAAgB,MAAA,KAAK,EAAC,IAAtB;AAA2B,MAAA,IAAI,EAAEI,YAAKC,MAAtC;AACgB,MAAA,KAAK,EAAC,QADtB;AAEgB,MAAA,QAAQ,EAAC,QAFzB;AAGgB,MAAA,SAAS,EAAE,KAH3B;AAIgB,MAAA,KAAK,EAAEL,OAJvB;AAAA,6BAKE,qBAAC,kBAAD;AAAY,QAAA,OAAO,EAAC,WAApB;AACY,QAAA,KAAK,EAAC,UADlB;AAEY,QAAA,KAAK,EAAE;AAACM,UAAAA,MAAM,EAAE;AAAT,SAFnB;AAGY,QAAA,MAAM,EAAE,kBAAM,CACb,CAJb;AAAA,+BAKE,qBAAC,iBAAD;AAAM,UAAA,IAAI,EAAC,MAAX;AAAkB,UAAA,KAAK,EAAEnB,eAAOC;AAAhC;AALF;AALF,MAFoB;AAAA,GAAtB;;AAiBA,sBACE,sBAAC,OAAD;AAAS,IAAA,SAAS,EAAEc,IAApB;AAAA,4BACE,sBAAC,aAAD;AAAA,iBACGH,OAAO,iBAAI,qBAAC,gBAAD;AAAA,kBAAmBA;AAAnB,QADd,eAEE,qBAAC,cAAD;AAAA,kBAAiBD;AAAjB,QAFF;AAAA,MADF,eAKE,sBAAC,eAAD;AAAA,iBACGK,aAAa,EADhB,EAEGF,OAAO,IAAIA,OAAO,CAACM,GAAR,CAAY,UAACC,IAAD,EAAOC,KAAP;AAAA,eAAiB,qCAAeD,IAAf,EAAqBN,IAArB,EAA2BO,KAA3B,CAAjB;AAAA,OAAZ,CAFd;AAAA,MALF;AAAA,IADF;AAYD,CArCD;;eAuCeZ,U","sourcesContent":["import React from 'react';\nimport {TileHeaderProps} from './TileTypes';\nimport {Size} from '../types';\nimport styled from 'styled-components';\nimport {\n  COLORS,\n  ComponentLStyling,\n  ComponentMStyling,\n  ComponentSStyling,\n  ComponentTextStyle, ComponentXSStyling,\n  ComponentXXSStyling\n} from '../styles';\nimport {TooltipWrapper} from '../Tooltips';\nimport {IconButton} from '../Button';\nimport {Help} from '../icons/systemicons/SystemIcons';\nimport {RenderTileItem} from './TileCommonItems';\n\nconst TagLineContainer = styled.div`\n  color: ${COLORS.neutral_600};\n`;\n\nconst TitleContainer = styled.div`\n  color: ${COLORS.black};\n`;\n\nconst TextContainer = styled.div`\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  flex: 1;\n`;\n\nconst ActionContainer = styled.div`\n  display: flex;\n  align-items: center;\n`;\n\nconst Wrapper = styled.div`\n  display: flex;\n  align-items: center;\n\n  min-height: 56px;\n  box-sizing: border-box;\n\n  &.small {\n    padding: 4px 16px;\n    min-height: 56px;\n\n    ${TagLineContainer} {\n      ${ComponentXXSStyling(ComponentTextStyle.Regular, null)}\n    }\n\n    ${TitleContainer} {\n      ${ComponentSStyling(ComponentTextStyle.Bold, null)}\n    }\n  }\n\n  &.medium {\n    padding: 8px 20px;\n    min-height: 64px;\n\n    ${TagLineContainer} {\n      ${ComponentXSStyling(ComponentTextStyle.Regular, null)}\n    }\n\n    ${TitleContainer} {\n      ${ComponentMStyling(ComponentTextStyle.Bold, null)}\n    }\n\n  }\n\n  &.large {\n    padding: 12px 24px;\n    min-height: 72px;\n\n    ${TagLineContainer} {\n      ${ComponentSStyling(ComponentTextStyle.Regular, null)}\n    }\n\n    ${TitleContainer} {\n      ${ComponentLStyling(ComponentTextStyle.Bold, null)}\n    }\n\n  }\n`;\n\n\nconst TileHeader: React.FunctionComponent<TileHeaderProps & { size: Size }> = ({\n                                                                                 title,\n                                                                                 tagLine,\n                                                                                 tooltip,\n                                                                                 buttons,\n                                                                                 size\n                                                                               }) => {\n\n  const renderTooltip = () =>\n    !!tooltip &&\n    <TooltipWrapper delay=\"0s\" size={Size.XSmall}\n                    align=\"center\"\n                    position=\"bottom\"\n                    withArrow={false}\n                    label={tooltip}>\n      <IconButton variant=\"secondary\"\n                  shape=\"circular\"\n                  style={{cursor: 'help'}}\n                  action={() => {\n                  }}>\n        <Help size=\"24px\" color={COLORS.neutral_600}/>\n      </IconButton>\n    </TooltipWrapper>;\n\n\n  return (\n    <Wrapper className={size}>\n      <TextContainer>\n        {tagLine && <TagLineContainer>{tagLine}</TagLineContainer>}\n        <TitleContainer>{title}</TitleContainer>\n      </TextContainer>\n      <ActionContainer>\n        {renderTooltip()}\n        {buttons && buttons.map((item, index) => RenderTileItem(item, size, index))}\n      </ActionContainer>\n    </Wrapper>\n  )\n}\n\nexport default TileHeader;\n"],"file":"TileHeader.cjs"}

package/dist/Tile/TileHeader.js

@@ -5,7 +5,7 @@ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _temp
 import React from 'react';
 import { Size } from '../types';
 import styled from 'styled-components';
-import { COLORS, ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentTextStyle, ComponentXXSStyling } from '../styles';
+import { COLORS, ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentTextStyle, ComponentXSStyling, ComponentXXSStyling } from '../styles';
 import { TooltipWrapper } from '../Tooltips';
 import { IconButton } from '../Button';
 import { Help } from '../icons/systemicons/SystemIcons';
@@ -16,7 +16,7 @@ var TagLineContainer = styled.div(_templateObject || (_templateObject = _taggedT
 var TitleContainer = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  color: ", ";\n"])), COLORS.black);
 var TextContainer = styled.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  flex: 1;\n"])));
 var ActionContainer = styled.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n"])));
-var Wrapper = styled.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n\n  min-height: 56px;\n  box-sizing: border-box;\n\n  &.small {\n    padding: 4px 16px;\n    min-height: 56px;\n\n    ", " {\n      ", "\n    }\n\n    ", " {\n      ", "\n    }\n  }\n\n  &.medium {\n    padding: 8px 20px;\n    min-height: 64px;\n\n    ", " {\n      ", "\n    }\n\n    ", " {\n      ", "\n    }\n\n  }\n\n  &.large {\n    padding: 12px 24px;\n    min-height: 72px;\n\n    ", " {\n      ", "\n    }\n\n    ", " {\n      ", "\n    }\n\n  }\n"])), TagLineContainer, ComponentXXSStyling(ComponentTextStyle.Regular, null), TitleContainer, ComponentSStyling(ComponentTextStyle.Bold, null), TagLineContainer, ComponentSStyling(ComponentTextStyle.Regular, null), TitleContainer, ComponentMStyling(ComponentTextStyle.Bold, null), TagLineContainer, ComponentSStyling(ComponentTextStyle.Regular, null), TitleContainer, ComponentLStyling(ComponentTextStyle.Bold, null));
+var Wrapper = styled.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n\n  min-height: 56px;\n  box-sizing: border-box;\n\n  &.small {\n    padding: 4px 16px;\n    min-height: 56px;\n\n    ", " {\n      ", "\n    }\n\n    ", " {\n      ", "\n    }\n  }\n\n  &.medium {\n    padding: 8px 20px;\n    min-height: 64px;\n\n    ", " {\n      ", "\n    }\n\n    ", " {\n      ", "\n    }\n\n  }\n\n  &.large {\n    padding: 12px 24px;\n    min-height: 72px;\n\n    ", " {\n      ", "\n    }\n\n    ", " {\n      ", "\n    }\n\n  }\n"])), TagLineContainer, ComponentXXSStyling(ComponentTextStyle.Regular, null), TitleContainer, ComponentSStyling(ComponentTextStyle.Bold, null), TagLineContainer, ComponentXSStyling(ComponentTextStyle.Regular, null), TitleContainer, ComponentMStyling(ComponentTextStyle.Bold, null), TagLineContainer, ComponentSStyling(ComponentTextStyle.Regular, null), TitleContainer, ComponentLStyling(ComponentTextStyle.Bold, null));
 
 var TileHeader = function TileHeader(_ref) {
   var title = _ref.title,

package/dist/Tile/TileHeader.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Tile/TileHeader.tsx"],"names":["React","Size","styled","COLORS","ComponentLStyling","ComponentMStyling","ComponentSStyling","ComponentTextStyle","ComponentXXSStyling","TooltipWrapper","IconButton","Help","RenderTileItem","TagLineContainer","div","neutral_600","TitleContainer","black","TextContainer","ActionContainer","Wrapper","Regular","Bold","TileHeader","title","tagLine","tooltip","buttons","size","renderTooltip","XSmall","cursor","map","item","index"],"mappings":"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","sourcesContent":["import React from 'react';\nimport {TileHeaderProps} from './TileTypes';\nimport {Size} from '../types';\nimport styled from 'styled-components';\nimport {\n  COLORS,\n  ComponentLStyling,\n  ComponentMStyling,\n  ComponentSStyling,\n  ComponentTextStyle,\n  ComponentXXSStyling\n} from '../styles';\nimport {TooltipWrapper} from '../Tooltips';\nimport {IconButton} from '../Button';\nimport {Help} from '../icons/systemicons/SystemIcons';\nimport {RenderTileItem} from './TileCommonItems';\n\nconst TagLineContainer = styled.div`\n  color: ${COLORS.neutral_600};\n`;\n\nconst TitleContainer = styled.div`\n  color: ${COLORS.black};\n`;\n\nconst TextContainer = styled.div`\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  flex: 1;\n`;\n\nconst ActionContainer = styled.div`\n  display: flex;\n  align-items: center;\n`;\n\nconst Wrapper = styled.div`\n  display: flex;\n  align-items: center;\n\n  min-height: 56px;\n  box-sizing: border-box;\n\n  &.small {\n    padding: 4px 16px;\n    min-height: 56px;\n\n    ${TagLineContainer} {\n      ${ComponentXXSStyling(ComponentTextStyle.Regular, null)}\n    }\n\n    ${TitleContainer} {\n      ${ComponentSStyling(ComponentTextStyle.Bold, null)}\n    }\n  }\n\n  &.medium {\n    padding: 8px 20px;\n    min-height: 64px;\n\n    ${TagLineContainer} {\n      ${ComponentSStyling(ComponentTextStyle.Regular, null)}\n    }\n\n    ${TitleContainer} {\n      ${ComponentMStyling(ComponentTextStyle.Bold, null)}\n    }\n\n  }\n\n  &.large {\n    padding: 12px 24px;\n    min-height: 72px;\n\n    ${TagLineContainer} {\n      ${ComponentSStyling(ComponentTextStyle.Regular, null)}\n    }\n\n    ${TitleContainer} {\n      ${ComponentLStyling(ComponentTextStyle.Bold, null)}\n    }\n\n  }\n`;\n\n\nconst TileHeader: React.FunctionComponent<TileHeaderProps & { size: Size }> = ({\n                                                                                 title,\n                                                                                 tagLine,\n                                                                                 tooltip,\n                                                                                 buttons,\n                                                                                 size\n                                                                               }) => {\n\n  const renderTooltip = () =>\n    !!tooltip &&\n    <TooltipWrapper delay=\"0s\" size={Size.XSmall}\n                    align=\"center\"\n                    position=\"bottom\"\n                    withArrow={false}\n                    label={tooltip}>\n      <IconButton variant=\"secondary\"\n                  shape=\"circular\"\n                  style={{cursor: 'help'}}\n                  action={() => {\n                  }}>\n        <Help size=\"24px\" color={COLORS.neutral_600}/>\n      </IconButton>\n    </TooltipWrapper>;\n\n\n  return (\n    <Wrapper className={size}>\n      <TextContainer>\n        {tagLine && <TagLineContainer>{tagLine}</TagLineContainer>}\n        <TitleContainer>{title}</TitleContainer>\n      </TextContainer>\n      <ActionContainer>\n        {renderTooltip()}\n        {buttons && buttons.map((item, index) => RenderTileItem(item, size, index))}\n      </ActionContainer>\n    </Wrapper>\n  )\n}\n\nexport default TileHeader;\n"],"file":"TileHeader.js"}
+{"version":3,"sources":["../../src/Tile/TileHeader.tsx"],"names":["React","Size","styled","COLORS","ComponentLStyling","ComponentMStyling","ComponentSStyling","ComponentTextStyle","ComponentXSStyling","ComponentXXSStyling","TooltipWrapper","IconButton","Help","RenderTileItem","TagLineContainer","div","neutral_600","TitleContainer","black","TextContainer","ActionContainer","Wrapper","Regular","Bold","TileHeader","title","tagLine","tooltip","buttons","size","renderTooltip","XSmall","cursor","map","item","index"],"mappings":";;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAEA,SAAQC,IAAR,QAAmB,UAAnB;AACA,OAAOC,MAAP,MAAmB,mBAAnB;AACA,SACEC,MADF,EAEEC,iBAFF,EAGEC,iBAHF,EAIEC,iBAJF,EAKEC,kBALF,EAKsBC,kBALtB,EAMEC,mBANF,QAOO,WAPP;AAQA,SAAQC,cAAR,QAA6B,aAA7B;AACA,SAAQC,UAAR,QAAyB,WAAzB;AACA,SAAQC,IAAR,QAAmB,kCAAnB;AACA,SAAQC,cAAR,QAA6B,mBAA7B;;;AAEA,IAAMC,gBAAgB,GAAGZ,MAAM,CAACa,GAAV,wFACXZ,MAAM,CAACa,WADI,CAAtB;AAIA,IAAMC,cAAc,GAAGf,MAAM,CAACa,GAAV,0FACTZ,MAAM,CAACe,KADE,CAApB;AAIA,IAAMC,aAAa,GAAGjB,MAAM,CAACa,GAAV,8JAAnB;AAOA,IAAMK,eAAe,GAAGlB,MAAM,CAACa,GAAV,mHAArB;AAKA,IAAMM,OAAO,GAAGnB,MAAM,CAACa,GAAV,2jBAWPD,gBAXO,EAYLL,mBAAmB,CAACF,kBAAkB,CAACe,OAApB,EAA6B,IAA7B,CAZd,EAePL,cAfO,EAgBLX,iBAAiB,CAACC,kBAAkB,CAACgB,IAApB,EAA0B,IAA1B,CAhBZ,EAwBPT,gBAxBO,EAyBLN,kBAAkB,CAACD,kBAAkB,CAACe,OAApB,EAA6B,IAA7B,CAzBb,EA4BPL,cA5BO,EA6BLZ,iBAAiB,CAACE,kBAAkB,CAACgB,IAApB,EAA0B,IAA1B,CA7BZ,EAsCPT,gBAtCO,EAuCLR,iBAAiB,CAACC,kBAAkB,CAACe,OAApB,EAA6B,IAA7B,CAvCZ,EA0CPL,cA1CO,EA2CLb,iBAAiB,CAACG,kBAAkB,CAACgB,IAApB,EAA0B,IAA1B,CA3CZ,CAAb;;AAkDA,IAAMC,UAAqE,GAAG,SAAxEA,UAAwE,OAMO;AAAA,MALJC,KAKI,QALJA,KAKI;AAAA,MAJJC,OAII,QAJJA,OAII;AAAA,MAHJC,OAGI,QAHJA,OAGI;AAAA,MAFJC,OAEI,QAFJA,OAEI;AAAA,MADJC,IACI,QADJA,IACI;;AAEnF,MAAMC,aAAa,GAAG,SAAhBA,aAAgB;AAAA,WACpB,CAAC,CAACH,OAAF,iBACA,KAAC,cAAD;AAAgB,MAAA,KAAK,EAAC,IAAtB;AAA2B,MAAA,IAAI,EAAE1B,IAAI,CAAC8B,MAAtC;AACgB,MAAA,KAAK,EAAC,QADtB;AAEgB,MAAA,QAAQ,EAAC,QAFzB;AAGgB,MAAA,SAAS,EAAE,KAH3B;AAIgB,MAAA,KAAK,EAAEJ,OAJvB;AAAA,6BAKE,KAAC,UAAD;AAAY,QAAA,OAAO,EAAC,WAApB;AACY,QAAA,KAAK,EAAC,UADlB;AAEY,QAAA,KAAK,EAAE;AAACK,UAAAA,MAAM,EAAE;AAAT,SAFnB;AAGY,QAAA,MAAM,EAAE,kBAAM,CACb,CAJb;AAAA,+BAKE,KAAC,IAAD;AAAM,UAAA,IAAI,EAAC,MAAX;AAAkB,UAAA,KAAK,EAAE7B,MAAM,CAACa;AAAhC;AALF;AALF,MAFoB;AAAA,GAAtB;;AAiBA,sBACE,MAAC,OAAD;AAAS,IAAA,SAAS,EAAEa,IAApB;AAAA,4BACE,MAAC,aAAD;AAAA,iBACGH,OAAO,iBAAI,KAAC,gBAAD;AAAA,kBAAmBA;AAAnB,QADd,eAEE,KAAC,cAAD;AAAA,kBAAiBD;AAAjB,QAFF;AAAA,MADF,eAKE,MAAC,eAAD;AAAA,iBACGK,aAAa,EADhB,EAEGF,OAAO,IAAIA,OAAO,CAACK,GAAR,CAAY,UAACC,IAAD,EAAOC,KAAP;AAAA,eAAiBtB,cAAc,CAACqB,IAAD,EAAOL,IAAP,EAAaM,KAAb,CAA/B;AAAA,OAAZ,CAFd;AAAA,MALF;AAAA,IADF;AAYD,CArCD;;AAuCA,eAAeX,UAAf","sourcesContent":["import React from 'react';\nimport {TileHeaderProps} from './TileTypes';\nimport {Size} from '../types';\nimport styled from 'styled-components';\nimport {\n  COLORS,\n  ComponentLStyling,\n  ComponentMStyling,\n  ComponentSStyling,\n  ComponentTextStyle, ComponentXSStyling,\n  ComponentXXSStyling\n} from '../styles';\nimport {TooltipWrapper} from '../Tooltips';\nimport {IconButton} from '../Button';\nimport {Help} from '../icons/systemicons/SystemIcons';\nimport {RenderTileItem} from './TileCommonItems';\n\nconst TagLineContainer = styled.div`\n  color: ${COLORS.neutral_600};\n`;\n\nconst TitleContainer = styled.div`\n  color: ${COLORS.black};\n`;\n\nconst TextContainer = styled.div`\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  flex: 1;\n`;\n\nconst ActionContainer = styled.div`\n  display: flex;\n  align-items: center;\n`;\n\nconst Wrapper = styled.div`\n  display: flex;\n  align-items: center;\n\n  min-height: 56px;\n  box-sizing: border-box;\n\n  &.small {\n    padding: 4px 16px;\n    min-height: 56px;\n\n    ${TagLineContainer} {\n      ${ComponentXXSStyling(ComponentTextStyle.Regular, null)}\n    }\n\n    ${TitleContainer} {\n      ${ComponentSStyling(ComponentTextStyle.Bold, null)}\n    }\n  }\n\n  &.medium {\n    padding: 8px 20px;\n    min-height: 64px;\n\n    ${TagLineContainer} {\n      ${ComponentXSStyling(ComponentTextStyle.Regular, null)}\n    }\n\n    ${TitleContainer} {\n      ${ComponentMStyling(ComponentTextStyle.Bold, null)}\n    }\n\n  }\n\n  &.large {\n    padding: 12px 24px;\n    min-height: 72px;\n\n    ${TagLineContainer} {\n      ${ComponentSStyling(ComponentTextStyle.Regular, null)}\n    }\n\n    ${TitleContainer} {\n      ${ComponentLStyling(ComponentTextStyle.Bold, null)}\n    }\n\n  }\n`;\n\n\nconst TileHeader: React.FunctionComponent<TileHeaderProps & { size: Size }> = ({\n                                                                                 title,\n                                                                                 tagLine,\n                                                                                 tooltip,\n                                                                                 buttons,\n                                                                                 size\n                                                                               }) => {\n\n  const renderTooltip = () =>\n    !!tooltip &&\n    <TooltipWrapper delay=\"0s\" size={Size.XSmall}\n                    align=\"center\"\n                    position=\"bottom\"\n                    withArrow={false}\n                    label={tooltip}>\n      <IconButton variant=\"secondary\"\n                  shape=\"circular\"\n                  style={{cursor: 'help'}}\n                  action={() => {\n                  }}>\n        <Help size=\"24px\" color={COLORS.neutral_600}/>\n      </IconButton>\n    </TooltipWrapper>;\n\n\n  return (\n    <Wrapper className={size}>\n      <TextContainer>\n        {tagLine && <TagLineContainer>{tagLine}</TagLineContainer>}\n        <TitleContainer>{title}</TitleContainer>\n      </TextContainer>\n      <ActionContainer>\n        {renderTooltip()}\n        {buttons && buttons.map((item, index) => RenderTileItem(item, size, index))}\n      </ActionContainer>\n    </Wrapper>\n  )\n}\n\nexport default TileHeader;\n"],"file":"TileHeader.js"}

package/dist/common/StackState.cjs

@@ -0,0 +1,47 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useStackState = void 0;
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var useStackState = function useStackState(initial) {
+  var _React$useState = _react.default.useState(initial ? [initial] : []),
+      _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
+      state = _React$useState2[0],
+      setState = _React$useState2[1];
+
+  var reset = _react.default.useCallback(function (value) {
+    return setState(!!value || !!initial ? [value !== null && value !== void 0 ? value : initial] : []);
+  }, [initial]);
+
+  var peek = _react.default.useCallback(function () {
+    return !!state.length ? state[state.length - 1] : undefined;
+  }, [state]);
+
+  var push = _react.default.useCallback(function (value) {
+    return setState(state.concat(value));
+  }, [state]);
+
+  var pop = _react.default.useCallback(function () {
+    return setState(state.slice(0, -1));
+  }, [state]);
+
+  var length = state.length;
+  return {
+    peek: peek,
+    push: push,
+    pop: pop,
+    reset: reset,
+    length: length
+  };
+};
+
+exports.useStackState = useStackState;
+//# sourceMappingURL=StackState.cjs.map

package/dist/common/StackState.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/common/StackState.ts"],"names":["useStackState","initial","React","useState","state","setState","reset","useCallback","value","peek","length","undefined","push","concat","pop","slice"],"mappings":";;;;;;;;;;;AAAA;;AAGO,IAAMA,aAAa,GAAG,SAAhBA,aAAgB,CAAIC,OAAJ,EAAoB;AAC/C,wBAA0BC,eAAMC,QAAN,CAAkCF,OAAO,GAAG,CAACA,OAAD,CAAH,GAAe,EAAxD,CAA1B;AAAA;AAAA,MAAOG,KAAP;AAAA,MAAcC,QAAd;;AAEA,MAAMC,KAAK,GAAGJ,eAAMK,WAAN,CAAkB,UAACC,KAAD;AAAA,WAAeH,QAAQ,CAAC,CAAC,CAACG,KAAF,IAAW,CAAC,CAACP,OAAb,GAAuB,CAACO,KAAD,aAACA,KAAD,cAACA,KAAD,GAAUP,OAAV,CAAvB,GAA4C,EAA7C,CAAvB;AAAA,GAAlB,EAA2F,CAACA,OAAD,CAA3F,CAAd;;AACA,MAAMQ,IAAI,GAAGP,eAAMK,WAAN,CAAkB;AAAA,WAAM,CAAC,CAACH,KAAK,CAACM,MAAR,GAAiBN,KAAK,CAACA,KAAK,CAACM,MAAN,GAAe,CAAhB,CAAtB,GAA2CC,SAAjD;AAAA,GAAlB,EAA8E,CAACP,KAAD,CAA9E,CAAb;;AACA,MAAMQ,IAAI,GAAGV,eAAMK,WAAN,CAAkB,UAACC,KAAD;AAAA,WAAcH,QAAQ,CAACD,KAAK,CAACS,MAAN,CAAaL,KAAb,CAAD,CAAtB;AAAA,GAAlB,EAA+D,CAACJ,KAAD,CAA/D,CAAb;;AACA,MAAMU,GAAG,GAAGZ,eAAMK,WAAN,CAAkB;AAAA,WAAMF,QAAQ,CAACD,KAAK,CAACW,KAAN,CAAY,CAAZ,EAAe,CAAC,CAAhB,CAAD,CAAd;AAAA,GAAlB,EAAsD,CAACX,KAAD,CAAtD,CAAZ;;AACA,MAAMM,MAAM,GAAGN,KAAK,CAACM,MAArB;AAEA,SAAO;AAACD,IAAAA,IAAI,EAAJA,IAAD;AAAOG,IAAAA,IAAI,EAAJA,IAAP;AAAaE,IAAAA,GAAG,EAAHA,GAAb;AAAkBR,IAAAA,KAAK,EAALA,KAAlB;AAAyBI,IAAAA,MAAM,EAANA;AAAzB,GAAP;AACD,CAVM","sourcesContent":["import React from 'react';\n\n\nexport const useStackState = <T>(initial?: T) => {\n  const [state, setState] = React.useState<(T | undefined)[]>(initial ? [initial] : []);\n\n  const reset = React.useCallback((value?: T) => setState(!!value || !!initial ? [value ?? initial] : []), [initial]);\n  const peek = React.useCallback(() => !!state.length ? state[state.length - 1] : undefined, [state]);\n  const push = React.useCallback((value: T) => setState(state.concat(value)), [state]);\n  const pop = React.useCallback(() => setState(state.slice(0, -1)), [state]);\n  const length = state.length;\n\n  return {peek, push, pop, reset, length};\n};\n"],"file":"StackState.cjs"}

package/dist/common/StackState.d.ts

@@ -0,0 +1,7 @@
+export declare const useStackState: <T>(initial?: T | undefined) => {
+    peek: () => T | undefined;
+    push: (value: T) => void;
+    pop: () => void;
+    reset: (value?: T | undefined) => void;
+    length: number;
+};

package/dist/common/StackState.js

@@ -0,0 +1,30 @@
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import React from 'react';
+export var useStackState = function useStackState(initial) {
+  var _React$useState = React.useState(initial ? [initial] : []),
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      state = _React$useState2[0],
+      setState = _React$useState2[1];
+
+  var reset = React.useCallback(function (value) {
+    return setState(!!value || !!initial ? [value !== null && value !== void 0 ? value : initial] : []);
+  }, [initial]);
+  var peek = React.useCallback(function () {
+    return !!state.length ? state[state.length - 1] : undefined;
+  }, [state]);
+  var push = React.useCallback(function (value) {
+    return setState(state.concat(value));
+  }, [state]);
+  var pop = React.useCallback(function () {
+    return setState(state.slice(0, -1));
+  }, [state]);
+  var length = state.length;
+  return {
+    peek: peek,
+    push: push,
+    pop: pop,
+    reset: reset,
+    length: length
+  };
+};
+//# sourceMappingURL=StackState.js.map

package/dist/common/StackState.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/common/StackState.ts"],"names":["React","useStackState","initial","useState","state","setState","reset","useCallback","value","peek","length","undefined","push","concat","pop","slice"],"mappings":";AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAGA,OAAO,IAAMC,aAAa,GAAG,SAAhBA,aAAgB,CAAIC,OAAJ,EAAoB;AAC/C,wBAA0BF,KAAK,CAACG,QAAN,CAAkCD,OAAO,GAAG,CAACA,OAAD,CAAH,GAAe,EAAxD,CAA1B;AAAA;AAAA,MAAOE,KAAP;AAAA,MAAcC,QAAd;;AAEA,MAAMC,KAAK,GAAGN,KAAK,CAACO,WAAN,CAAkB,UAACC,KAAD;AAAA,WAAeH,QAAQ,CAAC,CAAC,CAACG,KAAF,IAAW,CAAC,CAACN,OAAb,GAAuB,CAACM,KAAD,aAACA,KAAD,cAACA,KAAD,GAAUN,OAAV,CAAvB,GAA4C,EAA7C,CAAvB;AAAA,GAAlB,EAA2F,CAACA,OAAD,CAA3F,CAAd;AACA,MAAMO,IAAI,GAAGT,KAAK,CAACO,WAAN,CAAkB;AAAA,WAAM,CAAC,CAACH,KAAK,CAACM,MAAR,GAAiBN,KAAK,CAACA,KAAK,CAACM,MAAN,GAAe,CAAhB,CAAtB,GAA2CC,SAAjD;AAAA,GAAlB,EAA8E,CAACP,KAAD,CAA9E,CAAb;AACA,MAAMQ,IAAI,GAAGZ,KAAK,CAACO,WAAN,CAAkB,UAACC,KAAD;AAAA,WAAcH,QAAQ,CAACD,KAAK,CAACS,MAAN,CAAaL,KAAb,CAAD,CAAtB;AAAA,GAAlB,EAA+D,CAACJ,KAAD,CAA/D,CAAb;AACA,MAAMU,GAAG,GAAGd,KAAK,CAACO,WAAN,CAAkB;AAAA,WAAMF,QAAQ,CAACD,KAAK,CAACW,KAAN,CAAY,CAAZ,EAAe,CAAC,CAAhB,CAAD,CAAd;AAAA,GAAlB,EAAsD,CAACX,KAAD,CAAtD,CAAZ;AACA,MAAMM,MAAM,GAAGN,KAAK,CAACM,MAArB;AAEA,SAAO;AAACD,IAAAA,IAAI,EAAJA,IAAD;AAAOG,IAAAA,IAAI,EAAJA,IAAP;AAAaE,IAAAA,GAAG,EAAHA,GAAb;AAAkBR,IAAAA,KAAK,EAALA,KAAlB;AAAyBI,IAAAA,MAAM,EAANA;AAAzB,GAAP;AACD,CAVM","sourcesContent":["import React from 'react';\n\n\nexport const useStackState = <T>(initial?: T) => {\n  const [state, setState] = React.useState<(T | undefined)[]>(initial ? [initial] : []);\n\n  const reset = React.useCallback((value?: T) => setState(!!value || !!initial ? [value ?? initial] : []), [initial]);\n  const peek = React.useCallback(() => !!state.length ? state[state.length - 1] : undefined, [state]);\n  const push = React.useCallback((value: T) => setState(state.concat(value)), [state]);\n  const pop = React.useCallback(() => setState(state.slice(0, -1)), [state]);\n  const length = state.length;\n\n  return {peek, push, pop, reset, length};\n};\n"],"file":"StackState.js"}

package/dist/hooks/useClickOutside.cjs

@@ -16,9 +16,13 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 /**
  * Perform action if clicked on outside of referred element
  */
-function useClickOutside(ref, action) {
+function useClickOutside(ref, action, related) {
   function handleClickOutside(e) {
-    if (ref.current && !ref.current.contains(e.target)) {
+    if (ref.current && !ref.current.contains(e.target) && !(related !== null && related !== void 0 && related.some(function (dep) {
+      var _dep$current;
+
+      return dep === null || dep === void 0 ? void 0 : (_dep$current = dep.current) === null || _dep$current === void 0 ? void 0 : _dep$current.contains(e.target);
+    }))) {
       action();
     }
   }

package/dist/hooks/useClickOutside.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/hooks/useClickOutside.ts"],"names":["useClickOutside","ref","action","handleClickOutside","e","current","contains","target","document","addEventListener","removeEventListener"],"mappings":";;;;;;;;;AAAA;;;;;;AACA;AACA;AACA;AACe,SAASA,eAAT,CAAyBC,GAAzB,EAAgEC,MAAhE,EAAoF;AACjG,WAASC,kBAAT,CAA4BC,CAA5B,EAAoC;AAClC,QAAIH,GAAG,CAACI,OAAJ,IAAe,CAACJ,GAAG,CAACI,OAAJ,CAAYC,QAAZ,CAAqBF,CAAC,CAACG,MAAvB,CAApB,EAAoD;AAClDL,MAAAA,MAAM;AACP;AACF;;AACD,wBAAU,YAAM;AACd;AACAM,IAAAA,QAAQ,CAACC,gBAAT,CAA0B,OAA1B,EAAmCN,kBAAnC;AACA,WAAO,YAAM;AACX;AACAK,MAAAA,QAAQ,CAACE,mBAAT,CAA6B,OAA7B,EAAsCP,kBAAtC;AACD,KAHD;AAID,GAPD;AAQD","sourcesContent":["import { useEffect, MutableRefObject } from 'react';\n/**\n * Perform action if clicked on outside of referred element\n */\nexport default function useClickOutside(ref: MutableRefObject<Element | null>, action: () => void) {\n  function handleClickOutside(e: any) {\n    if (ref.current && !ref.current.contains(e.target)) {\n      action();\n    }\n  }\n  useEffect(() => {\n    // Bind the event listener\n    document.addEventListener('click', handleClickOutside);\n    return () => {\n      // Unbind the event listener on clean up\n      document.removeEventListener('click', handleClickOutside);\n    };\n  });\n}\n"],"file":"useClickOutside.cjs"}
+{"version":3,"sources":["../../src/hooks/useClickOutside.ts"],"names":["useClickOutside","ref","action","related","handleClickOutside","e","current","contains","target","some","dep","document","addEventListener","removeEventListener"],"mappings":";;;;;;;;;AAAA;;;;;;AAEA;AACA;AACA;AACe,SAASA,eAAT,CAAyBC,GAAzB,EAAgEC,MAAhE,EAAoFC,OAApF,EAA4J;AACzK,WAASC,kBAAT,CAA4BC,CAA5B,EAAoC;AAClC,QAAIJ,GAAG,CAACK,OAAJ,IAAe,CAACL,GAAG,CAACK,OAAJ,CAAYC,QAAZ,CAAqBF,CAAC,CAACG,MAAvB,CAAhB,IAAkD,EAACL,OAAD,aAACA,OAAD,eAACA,OAAO,CAAEM,IAAT,CAAc,UAACC,GAAD;AAAA;;AAAA,aAASA,GAAT,aAASA,GAAT,uCAASA,GAAG,CAAEJ,OAAd,iDAAS,aAAcC,QAAd,CAAuBF,CAAC,CAACG,MAAzB,CAAT;AAAA,KAAd,CAAD,CAAtD,EAAiH;AAC/GN,MAAAA,MAAM;AACP;AACF;;AAED,wBAAU,YAAM;AACd;AACAS,IAAAA,QAAQ,CAACC,gBAAT,CAA0B,OAA1B,EAAmCR,kBAAnC;AACA,WAAO,YAAM;AACX;AACAO,MAAAA,QAAQ,CAACE,mBAAT,CAA6B,OAA7B,EAAsCT,kBAAtC;AACD,KAHD;AAID,GAPD;AAQD","sourcesContent":["import {useEffect, MutableRefObject} from 'react';\n\n/**\n * Perform action if clicked on outside of referred element\n */\nexport default function useClickOutside(ref: MutableRefObject<Element | null>, action: () => void, related?: (MutableRefObject<Element | undefined | null> | undefined)[]) {\n  function handleClickOutside(e: any) {\n    if (ref.current && !ref.current.contains(e.target) && !related?.some((dep) => dep?.current?.contains(e.target))) {\n      action();\n    }\n  }\n\n  useEffect(() => {\n    // Bind the event listener\n    document.addEventListener('click', handleClickOutside);\n    return () => {\n      // Unbind the event listener on clean up\n      document.removeEventListener('click', handleClickOutside);\n    };\n  });\n}\n"],"file":"useClickOutside.cjs"}

package/dist/hooks/useClickOutside.d.ts

@@ -2,4 +2,4 @@ import { MutableRefObject } from 'react';
 /**
  * Perform action if clicked on outside of referred element
  */
-export default function useClickOutside(ref: MutableRefObject<Element | null>, action: () => void): void;
+export default function useClickOutside(ref: MutableRefObject<Element | null>, action: () => void, related?: (MutableRefObject<Element | undefined | null> | undefined)[]): void;

package/dist/hooks/useClickOutside.js

@@ -3,9 +3,13 @@ import React, { useEffect } from 'react';
  * Perform action if clicked on outside of referred element
  */
 
-export default function useClickOutside(ref, action) {
+export default function useClickOutside(ref, action, related) {
   function handleClickOutside(e) {
-    if (ref.current && !ref.current.contains(e.target)) {
+    if (ref.current && !ref.current.contains(e.target) && !(related !== null && related !== void 0 && related.some(function (dep) {
+      var _dep$current;
+
+      return dep === null || dep === void 0 ? void 0 : (_dep$current = dep.current) === null || _dep$current === void 0 ? void 0 : _dep$current.contains(e.target);
+    }))) {
       action();
     }
   }

package/dist/hooks/useClickOutside.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/hooks/useClickOutside.ts"],"names":["useEffect","useClickOutside","ref","action","handleClickOutside","e","current","contains","target","document","addEventListener","removeEventListener"],"mappings":"AAAA,gBAASA,SAAT,QAA4C,OAA5C;AACA;AACA;AACA;;AACA,eAAe,SAASC,eAAT,CAAyBC,GAAzB,EAAgEC,MAAhE,EAAoF;AACjG,WAASC,kBAAT,CAA4BC,CAA5B,EAAoC;AAClC,QAAIH,GAAG,CAACI,OAAJ,IAAe,CAACJ,GAAG,CAACI,OAAJ,CAAYC,QAAZ,CAAqBF,CAAC,CAACG,MAAvB,CAApB,EAAoD;AAClDL,MAAAA,MAAM;AACP;AACF;;AACDH,EAAAA,SAAS,CAAC,YAAM;AACd;AACAS,IAAAA,QAAQ,CAACC,gBAAT,CAA0B,OAA1B,EAAmCN,kBAAnC;AACA,WAAO,YAAM;AACX;AACAK,MAAAA,QAAQ,CAACE,mBAAT,CAA6B,OAA7B,EAAsCP,kBAAtC;AACD,KAHD;AAID,GAPQ,CAAT;AAQD","sourcesContent":["import { useEffect, MutableRefObject } from 'react';\n/**\n * Perform action if clicked on outside of referred element\n */\nexport default function useClickOutside(ref: MutableRefObject<Element | null>, action: () => void) {\n  function handleClickOutside(e: any) {\n    if (ref.current && !ref.current.contains(e.target)) {\n      action();\n    }\n  }\n  useEffect(() => {\n    // Bind the event listener\n    document.addEventListener('click', handleClickOutside);\n    return () => {\n      // Unbind the event listener on clean up\n      document.removeEventListener('click', handleClickOutside);\n    };\n  });\n}\n"],"file":"useClickOutside.js"}
+{"version":3,"sources":["../../src/hooks/useClickOutside.ts"],"names":["useEffect","useClickOutside","ref","action","related","handleClickOutside","e","current","contains","target","some","dep","document","addEventListener","removeEventListener"],"mappings":"AAAA,gBAAQA,SAAR,QAA0C,OAA1C;AAEA;AACA;AACA;;AACA,eAAe,SAASC,eAAT,CAAyBC,GAAzB,EAAgEC,MAAhE,EAAoFC,OAApF,EAA4J;AACzK,WAASC,kBAAT,CAA4BC,CAA5B,EAAoC;AAClC,QAAIJ,GAAG,CAACK,OAAJ,IAAe,CAACL,GAAG,CAACK,OAAJ,CAAYC,QAAZ,CAAqBF,CAAC,CAACG,MAAvB,CAAhB,IAAkD,EAACL,OAAD,aAACA,OAAD,eAACA,OAAO,CAAEM,IAAT,CAAc,UAACC,GAAD;AAAA;;AAAA,aAASA,GAAT,aAASA,GAAT,uCAASA,GAAG,CAAEJ,OAAd,iDAAS,aAAcC,QAAd,CAAuBF,CAAC,CAACG,MAAzB,CAAT;AAAA,KAAd,CAAD,CAAtD,EAAiH;AAC/GN,MAAAA,MAAM;AACP;AACF;;AAEDH,EAAAA,SAAS,CAAC,YAAM;AACd;AACAY,IAAAA,QAAQ,CAACC,gBAAT,CAA0B,OAA1B,EAAmCR,kBAAnC;AACA,WAAO,YAAM;AACX;AACAO,MAAAA,QAAQ,CAACE,mBAAT,CAA6B,OAA7B,EAAsCT,kBAAtC;AACD,KAHD;AAID,GAPQ,CAAT;AAQD","sourcesContent":["import {useEffect, MutableRefObject} from 'react';\n\n/**\n * Perform action if clicked on outside of referred element\n */\nexport default function useClickOutside(ref: MutableRefObject<Element | null>, action: () => void, related?: (MutableRefObject<Element | undefined | null> | undefined)[]) {\n  function handleClickOutside(e: any) {\n    if (ref.current && !ref.current.contains(e.target) && !related?.some((dep) => dep?.current?.contains(e.target))) {\n      action();\n    }\n  }\n\n  useEffect(() => {\n    // Bind the event listener\n    document.addEventListener('click', handleClickOutside);\n    return () => {\n      // Unbind the event listener on clean up\n      document.removeEventListener('click', handleClickOutside);\n    };\n  });\n}\n"],"file":"useClickOutside.js"}