@laerdal/life-react-components 5.0.9 → 5.1.0

package/dist/Card/HorizontalCard/HorizontalCardActions.js.map

@@ -1 +1 @@
-{"version":3,"file":"HorizontalCardActions.js","names":["React","IconButton","ToggleButton","DropdownButton","styled","jsx","_jsx","Fragment","_Fragment","Container","div","_templateObject","_taggedTemplateLiteral","HorizontalCardActions","forwardRef","_ref","ref","actions","disabled","_React$useState","useState","_React$useState2","_slicedToArray","elRefs","setElRefs","length","useEffect","Array","fill","map","createRef","useImperativeHandle","renderAction","item","index","componentType","content","_item$disabled","variant","useTransparentBackground","shape","action","tooltip","children","icon","_item$disabled2","active","onChange","defaultState","activeState","_item$disabled3","type","items","itemsType","onClick","actionIcon","actionLabel","actionVariant","actionLoading","multiSelect","scrollable","pinTopItem","maxHeight"],"sources":["../../../src/Card/HorizontalCard/HorizontalCardActions.tsx"],"sourcesContent":["import React from 'react';\r\nimport {\r\n  HorizontalCardCustomContent,\r\n  HorizontalCardDropdownButton,\r\n  HorizontalCardIconButton,\r\n  HorizontalCardProps,\r\n  HorizontalCardToggleButton\r\n} from './types';\r\nimport {IconButton} from '../../Button';\r\nimport {ToggleButton} from '../../Toggles';\r\nimport {DropdownButton} from '../../Dropdown';\r\nimport styled from 'styled-components';\r\n\r\nconst Container = styled.div`\r\n  display: flex;\r\n`;\r\n\r\ntype Props = Pick<HorizontalCardProps, 'actions' | 'disabled'>;\r\n\r\nexport const HorizontalCardActions = React.forwardRef(({actions, disabled}: Props,\r\n                                                       ref: React.Ref<React.RefObject<HTMLButtonElement>[]>) => {\r\n\r\n  const [elRefs, setElRefs] = React.useState<React.RefObject<HTMLButtonElement>[]>([]);\r\n  const length = actions?.length || 0;\r\n\r\n  React.useEffect(() => {\r\n    setElRefs(Array(length || 0).fill(null).map(() => React.createRef<HTMLButtonElement>()));\r\n  }, [length]);\r\n\r\n  React.useImperativeHandle(ref, () => elRefs, [elRefs]);\r\n\r\n  const renderAction = (item: HorizontalCardIconButton | HorizontalCardToggleButton | HorizontalCardDropdownButton | HorizontalCardCustomContent,\r\n                        index: number) => {\r\n    switch (item.componentType) {\r\n      case 'custom': {\r\n        return item.content\r\n      }\r\n      case 'icon': {\r\n        return <IconButton ref={elRefs[index]}\r\n                           key={index}\r\n                           variant={'secondary'}\r\n                           useTransparentBackground={true}\r\n                           shape={'circular'}\r\n                           action={item.action}\r\n                           tooltip={item.tooltip}\r\n                           disabled={item.disabled ?? disabled}>\r\n          {item.icon}\r\n        </IconButton>\r\n      }\r\n      case 'toggle': {\r\n        return <ToggleButton ref={elRefs[index]}\r\n                             key={index}\r\n                             active={item.active}\r\n                             onChange={item.onChange}\r\n                             defaultState={item.defaultState}\r\n                             activeState={item.activeState}\r\n                             disabled={item.disabled ?? disabled}/>\r\n      }\r\n      case 'dropdown': {\r\n        return <DropdownButton ref={elRefs[index]}\r\n                               key={index}\r\n                               type={'icon'}\r\n                               items={item.items}\r\n                               itemsType={item.itemsType}\r\n                               onClick={item.onClick}\r\n                               icon={item.icon}\r\n                               action={item.action}\r\n                               actionIcon={item.actionIcon}\r\n                               actionLabel={item.actionLabel}\r\n                               actionVariant={item.actionVariant}\r\n                               actionLoading={item.actionLoading}\r\n                               multiSelect={item.multiSelect}\r\n                               scrollable={item.scrollable}\r\n                               pinTopItem={item.pinTopItem}\r\n                               maxHeight={item.maxHeight}\r\n                               disabled={item.disabled ?? disabled}/>\r\n      }\r\n    }\r\n  }\r\n\r\n\r\n  return (\r\n    <>\r\n      {\r\n        actions?.length &&\r\n        <Container>\r\n          {actions?.map((item, index) => renderAction(item, index))}\r\n        </Container>\r\n      }\r\n    </>\r\n  )\r\n});\r\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"HorizontalCardActions.js","names":["React","IconButton","ToggleButton","DropdownButton","styled","jsx","_jsx","Fragment","_Fragment","Container","div","_templateObject","_taggedTemplateLiteral","HorizontalCardActions","forwardRef","_ref","ref","actions","disabled","elRefs","setElRefs","useState","length","useEffect","Array","fill","map","createRef","useImperativeHandle","renderAction","item","index","componentType","content","_item$disabled","variant","useTransparentBackground","shape","action","tooltip","children","icon","_item$disabled2","active","onChange","defaultState","activeState","_item$disabled3","type","items","itemsType","onClick","actionIcon","actionLabel","actionVariant","actionLoading","multiSelect","scrollable","pinTopItem","maxHeight"],"sources":["../../../src/Card/HorizontalCard/HorizontalCardActions.tsx"],"sourcesContent":["import React from 'react';\r\nimport {\r\n  HorizontalCardCustomContent,\r\n  HorizontalCardDropdownButton,\r\n  HorizontalCardIconButton,\r\n  HorizontalCardProps,\r\n  HorizontalCardToggleButton\r\n} from './types';\r\nimport {IconButton} from '../../Button';\r\nimport {ToggleButton} from '../../Toggles';\r\nimport {DropdownButton} from '../../Dropdown';\r\nimport styled from 'styled-components';\r\n\r\nconst Container = styled.div`\r\n  display: flex;\r\n`;\r\n\r\ntype Props = Pick<HorizontalCardProps, 'actions' | 'disabled'>;\r\n\r\nexport const HorizontalCardActions = React.forwardRef(({actions, disabled}: Props,\r\n                                                       ref: React.Ref<React.RefObject<HTMLButtonElement>[]>) => {\r\n\r\n  const [elRefs, setElRefs] = React.useState<React.RefObject<HTMLButtonElement>[]>([]);\r\n  const length = actions?.length || 0;\r\n\r\n  React.useEffect(() => {\r\n    setElRefs(Array(length || 0).fill(null).map(() => React.createRef<HTMLButtonElement>()));\r\n  }, [length]);\r\n\r\n  React.useImperativeHandle(ref, () => elRefs, [elRefs]);\r\n\r\n  const renderAction = (item: HorizontalCardIconButton | HorizontalCardToggleButton | HorizontalCardDropdownButton | HorizontalCardCustomContent,\r\n                        index: number) => {\r\n    switch (item.componentType) {\r\n      case 'custom': {\r\n        return item.content\r\n      }\r\n      case 'icon': {\r\n        return <IconButton ref={elRefs[index]}\r\n                           key={index}\r\n                           variant={'secondary'}\r\n                           useTransparentBackground={true}\r\n                           shape={'circular'}\r\n                           action={item.action}\r\n                           tooltip={item.tooltip}\r\n                           disabled={item.disabled ?? disabled}>\r\n          {item.icon}\r\n        </IconButton>\r\n      }\r\n      case 'toggle': {\r\n        return <ToggleButton ref={elRefs[index]}\r\n                             key={index}\r\n                             active={item.active}\r\n                             onChange={item.onChange}\r\n                             defaultState={item.defaultState}\r\n                             activeState={item.activeState}\r\n                             disabled={item.disabled ?? disabled}/>\r\n      }\r\n      case 'dropdown': {\r\n        return <DropdownButton ref={elRefs[index]}\r\n                               key={index}\r\n                               type={'icon'}\r\n                               items={item.items}\r\n                               itemsType={item.itemsType}\r\n                               onClick={item.onClick}\r\n                               icon={item.icon}\r\n                               action={item.action}\r\n                               actionIcon={item.actionIcon}\r\n                               actionLabel={item.actionLabel}\r\n                               actionVariant={item.actionVariant}\r\n                               actionLoading={item.actionLoading}\r\n                               multiSelect={item.multiSelect}\r\n                               scrollable={item.scrollable}\r\n                               pinTopItem={item.pinTopItem}\r\n                               maxHeight={item.maxHeight}\r\n                               disabled={item.disabled ?? disabled}/>\r\n      }\r\n    }\r\n  }\r\n\r\n\r\n  return (\r\n    <>\r\n      {\r\n        actions?.length &&\r\n        <Container>\r\n          {actions?.map((item, index) => renderAction(item, index))}\r\n        </Container>\r\n      }\r\n    </>\r\n  )\r\n});\r\n"],"mappings":"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","ignoreList":[]}

package/dist/Card/HorizontalCard/HorizontalCardBody.cjs

@@ -13,38 +13,28 @@ var _LinearProgress = require("../../LinearProgress");
 var _Tag = require("../../Tag");
 var _jsxRuntime = require("react/jsx-runtime");
 var _templateObject, _templateObject2, _templateObject3, _templateObject4;
-var HorizontalCardBodyContainer = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n  display: flex;\n  flex: 1;\n  flex-direction: column;\n  gap: 8px;\n  padding: 16px;\n"])));
-exports.HorizontalCardBodyContainer = HorizontalCardBodyContainer;
-var HorizontalCardBodyTitle = _styledComponents["default"].div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n  ", "\n  .disabled & {\n    color: ", ";\n  }\n"])), function (props) {
-  return (0, _styles.ComponentMStyling)(_styles.ComponentTextStyle.Bold, _styles.COLORS.getColor('black', props.theme));
-}, function (props) {
-  return _styles.COLORS.getColor('neutral_500', props.theme);
-});
-exports.HorizontalCardBodyTitle = HorizontalCardBodyTitle;
-var HorizontalCardBodyDescription = _styledComponents["default"].div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["\n  ", "\n"])), function (props) {
-  return (0, _styles.ComponentXSStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.getColor('neutral_600', props.theme));
-});
-exports.HorizontalCardBodyDescription = HorizontalCardBodyDescription;
-var HorizontalCardBodyTagsContainer = _styledComponents["default"].div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["\n  display: flex;\n  flex-direction: row;\n  flex-wrap: wrap;\n  padding: 4px 0;\n  gap: 4px;\n"])));
-exports.HorizontalCardBodyTagsContainer = HorizontalCardBodyTagsContainer;
-var HorizontalCardBody = function HorizontalCardBody(_ref) {
-  var title = _ref.title,
-    description = _ref.description,
-    progress = _ref.progress,
-    tags = _ref.tags;
+const HorizontalCardBodyContainer = exports.HorizontalCardBodyContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  flex: 1;\n  flex-direction: column;\n  gap: 8px;\n  padding: 16px;\n"])));
+const HorizontalCardBodyTitle = exports.HorizontalCardBodyTitle = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  ", "\n  .disabled & {\n    color: ", ";\n  }\n"])), props => (0, _styles.ComponentMStyling)(_styles.ComponentTextStyle.Bold, _styles.COLORS.getColor('black', props.theme)), props => _styles.COLORS.getColor('neutral_500', props.theme));
+const HorizontalCardBodyDescription = exports.HorizontalCardBodyDescription = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  ", "\n"])), props => (0, _styles.ComponentXSStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.getColor('neutral_600', props.theme)));
+const HorizontalCardBodyTagsContainer = exports.HorizontalCardBodyTagsContainer = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  flex-direction: row;\n  flex-wrap: wrap;\n  padding: 4px 0;\n  gap: 4px;\n"])));
+const HorizontalCardBody = _ref => {
+  let {
+    title,
+    description,
+    progress,
+    tags
+  } = _ref;
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(HorizontalCardBodyContainer, {
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(HorizontalCardBodyTitle, {
       children: title
     }), description && /*#__PURE__*/(0, _jsxRuntime.jsx)(HorizontalCardBodyDescription, {
       children: description
     }), tags && /*#__PURE__*/(0, _jsxRuntime.jsx)(HorizontalCardBodyTagsContainer, {
-      children: tags.map(function (tag, index) {
-        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Tag.Tag, {
-          label: tag.label,
-          variant: tag.variant,
-          icon: tag.icon
-        }, index);
-      })
+      children: tags.map((tag, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_Tag.Tag, {
+        label: tag.label,
+        variant: tag.variant,
+        icon: tag.icon
+      }, index))
     }), progress && /*#__PURE__*/(0, _jsxRuntime.jsx)(_LinearProgress.LinearProgress, {
       value: progress.value,
       max: progress.max

package/dist/Card/HorizontalCard/HorizontalCardBody.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"HorizontalCardBody.cjs","names":["_react","_interopRequireDefault","require","_styledComponents","_styles","_LinearProgress","_Tag","_jsxRuntime","_templateObject","_templateObject2","_templateObject3","_templateObject4","HorizontalCardBodyContainer","styled","div","_taggedTemplateLiteral2","exports","HorizontalCardBodyTitle","props","ComponentMStyling","ComponentTextStyle","Bold","COLORS","getColor","theme","HorizontalCardBodyDescription","ComponentXSStyling","Regular","HorizontalCardBodyTagsContainer","HorizontalCardBody","_ref","title","description","progress","tags","jsxs","children","jsx","map","tag","index","Tag","label","variant","icon","LinearProgress","value","max"],"sources":["../../../src/Card/HorizontalCard/HorizontalCardBody.tsx"],"sourcesContent":["import React from 'react';\r\nimport {HorizontalCardProps} from './types';\r\nimport styled from 'styled-components';\r\nimport {COLORS, ComponentMStyling, ComponentTextStyle, ComponentXSStyling} from '../../styles';\r\nimport {LinearProgress} from '../../LinearProgress';\r\nimport {Tag} from '../../Tag';\r\n\r\nexport const HorizontalCardBodyContainer = styled.div`\r\n  display: flex;\r\n  flex: 1;\r\n  flex-direction: column;\r\n  gap: 8px;\r\n  padding: 16px;\r\n`;\r\n\r\nexport const HorizontalCardBodyTitle = styled.div`\r\n  ${props => ComponentMStyling(ComponentTextStyle.Bold, COLORS.getColor('black', props.theme))}\r\n  .disabled & {\r\n    color: ${props => COLORS.getColor('neutral_500', props.theme)};\r\n  }\r\n`;\r\n\r\nexport const HorizontalCardBodyDescription = styled.div`\r\n  ${props => ComponentXSStyling(ComponentTextStyle.Regular, COLORS.getColor('neutral_600', props.theme))}\r\n`;\r\n\r\nexport const HorizontalCardBodyTagsContainer = styled.div`\r\n  display: flex;\r\n  flex-direction: row;\r\n  flex-wrap: wrap;\r\n  padding: 4px 0;\r\n  gap: 4px;\r\n`;\r\n\r\ntype Props = Pick<HorizontalCardProps, 'title' | 'description' | 'progress' | 'tags'>;\r\n\r\nexport const HorizontalCardBody: React.FunctionComponent<Props> = ({\r\n                                                                     title,\r\n                                                                     description,\r\n                                                                     progress,\r\n                                                                     tags,\r\n                                                                   }) => {\r\n\r\n  return (\r\n    <HorizontalCardBodyContainer>\r\n      <HorizontalCardBodyTitle>{title}</HorizontalCardBodyTitle>\r\n      {description && <HorizontalCardBodyDescription>{description}</HorizontalCardBodyDescription>}\r\n      {\r\n        tags &&\r\n        <HorizontalCardBodyTagsContainer>{tags.map((tag, index) => (\r\n          <Tag key={index} label={tag.label} variant={tag.variant} icon={tag.icon}/>))}\r\n        </HorizontalCardBodyTagsContainer>\r\n      }\r\n      {progress && <LinearProgress value={progress.value} max={progress.max}/>}\r\n    </HorizontalCardBodyContainer>\r\n  )\r\n};\r\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"HorizontalCardBody.cjs","names":["_react","_interopRequireDefault","require","_styledComponents","_styles","_LinearProgress","_Tag","_jsxRuntime","_templateObject","_templateObject2","_templateObject3","_templateObject4","HorizontalCardBodyContainer","exports","styled","div","_taggedTemplateLiteral2","default","HorizontalCardBodyTitle","props","ComponentMStyling","ComponentTextStyle","Bold","COLORS","getColor","theme","HorizontalCardBodyDescription","ComponentXSStyling","Regular","HorizontalCardBodyTagsContainer","HorizontalCardBody","_ref","title","description","progress","tags","jsxs","children","jsx","map","tag","index","Tag","label","variant","icon","LinearProgress","value","max"],"sources":["../../../src/Card/HorizontalCard/HorizontalCardBody.tsx"],"sourcesContent":["import React from 'react';\r\nimport {HorizontalCardProps} from './types';\r\nimport styled from 'styled-components';\r\nimport {COLORS, ComponentMStyling, ComponentTextStyle, ComponentXSStyling} from '../../styles';\r\nimport {LinearProgress} from '../../LinearProgress';\r\nimport {Tag} from '../../Tag';\r\n\r\nexport const HorizontalCardBodyContainer = styled.div`\r\n  display: flex;\r\n  flex: 1;\r\n  flex-direction: column;\r\n  gap: 8px;\r\n  padding: 16px;\r\n`;\r\n\r\nexport const HorizontalCardBodyTitle = styled.div`\r\n  ${props => ComponentMStyling(ComponentTextStyle.Bold, COLORS.getColor('black', props.theme))}\r\n  .disabled & {\r\n    color: ${props => COLORS.getColor('neutral_500', props.theme)};\r\n  }\r\n`;\r\n\r\nexport const HorizontalCardBodyDescription = styled.div`\r\n  ${props => ComponentXSStyling(ComponentTextStyle.Regular, COLORS.getColor('neutral_600', props.theme))}\r\n`;\r\n\r\nexport const HorizontalCardBodyTagsContainer = styled.div`\r\n  display: flex;\r\n  flex-direction: row;\r\n  flex-wrap: wrap;\r\n  padding: 4px 0;\r\n  gap: 4px;\r\n`;\r\n\r\ntype Props = Pick<HorizontalCardProps, 'title' | 'description' | 'progress' | 'tags'>;\r\n\r\nexport const HorizontalCardBody: React.FunctionComponent<Props> = ({\r\n                                                                     title,\r\n                                                                     description,\r\n                                                                     progress,\r\n                                                                     tags,\r\n                                                                   }) => {\r\n\r\n  return (\r\n    <HorizontalCardBodyContainer>\r\n      <HorizontalCardBodyTitle>{title}</HorizontalCardBodyTitle>\r\n      {description && <HorizontalCardBodyDescription>{description}</HorizontalCardBodyDescription>}\r\n      {\r\n        tags &&\r\n        <HorizontalCardBodyTagsContainer>{tags.map((tag, index) => (\r\n          <Tag key={index} label={tag.label} variant={tag.variant} icon={tag.icon}/>))}\r\n        </HorizontalCardBodyTagsContainer>\r\n      }\r\n      {progress && <LinearProgress value={progress.value} max={progress.max}/>}\r\n    </HorizontalCardBodyContainer>\r\n  )\r\n};\r\n"],"mappings":";;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAEA,IAAAC,iBAAA,GAAAF,sBAAA,CAAAC,OAAA;AACA,IAAAE,OAAA,GAAAF,OAAA;AACA,IAAAG,eAAA,GAAAH,OAAA;AACA,IAAAI,IAAA,GAAAJ,OAAA;AAA8B,IAAAK,WAAA,GAAAL,OAAA;AAAA,IAAAM,eAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA;AAEvB,MAAMC,2BAA2B,GAAAC,OAAA,CAAAD,2BAAA,GAAGE,yBAAM,CAACC,GAAG,CAAAP,eAAA,KAAAA,eAAA,OAAAQ,uBAAA,CAAAC,OAAA,mGAMpD;AAEM,MAAMC,uBAAuB,GAAAL,OAAA,CAAAK,uBAAA,GAAGJ,yBAAM,CAACC,GAAG,CAAAN,gBAAA,KAAAA,gBAAA,OAAAO,uBAAA,CAAAC,OAAA,4DAC7CE,KAAK,IAAI,IAAAC,yBAAiB,EAACC,0BAAkB,CAACC,IAAI,EAAEC,cAAM,CAACC,QAAQ,CAAC,OAAO,EAAEL,KAAK,CAACM,KAAK,CAAC,CAAC,EAEjFN,KAAK,IAAII,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEL,KAAK,CAACM,KAAK,CAAC,CAEhE;AAEM,MAAMC,6BAA6B,GAAAb,OAAA,CAAAa,6BAAA,GAAGZ,yBAAM,CAACC,GAAG,CAAAL,gBAAA,KAAAA,gBAAA,OAAAM,uBAAA,CAAAC,OAAA,oBACnDE,KAAK,IAAI,IAAAQ,0BAAkB,EAACN,0BAAkB,CAACO,OAAO,EAAEL,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEL,KAAK,CAACM,KAAK,CAAC,CAAC,CACvG;AAEM,MAAMI,+BAA+B,GAAAhB,OAAA,CAAAgB,+BAAA,GAAGf,yBAAM,CAACC,GAAG,CAAAJ,gBAAA,KAAAA,gBAAA,OAAAK,uBAAA,CAAAC,OAAA,yGAMxD;AAIM,MAAMa,kBAAkD,GAAGC,IAAA,IAKO;EAAA,IALN;IACEC,KAAK;IACLC,WAAW;IACXC,QAAQ;IACRC;EACF,CAAC,GAAAJ,IAAA;EAElE,oBACE,IAAAxB,WAAA,CAAA6B,IAAA,EAACxB,2BAA2B;IAAAyB,QAAA,gBAC1B,IAAA9B,WAAA,CAAA+B,GAAA,EAACpB,uBAAuB;MAAAmB,QAAA,EAAEL;IAAK,CAA0B,CAAC,EACzDC,WAAW,iBAAI,IAAA1B,WAAA,CAAA+B,GAAA,EAACZ,6BAA6B;MAAAW,QAAA,EAAEJ;IAAW,CAAgC,CAAC,EAE1FE,IAAI,iBACJ,IAAA5B,WAAA,CAAA+B,GAAA,EAACT,+BAA+B;MAAAQ,QAAA,EAAEF,IAAI,CAACI,GAAG,CAAC,CAACC,GAAG,EAAEC,KAAK,kBACpD,IAAAlC,WAAA,CAAA+B,GAAA,EAAChC,IAAA,CAAAoC,GAAG;QAAaC,KAAK,EAAEH,GAAG,CAACG,KAAM;QAACC,OAAO,EAAEJ,GAAG,CAACI,OAAQ;QAACC,IAAI,EAAEL,GAAG,CAACK;MAAK,GAA9DJ,KAA+D,CAAE;IAAC,CAC7C,CAAC,EAEnCP,QAAQ,iBAAI,IAAA3B,WAAA,CAAA+B,GAAA,EAACjC,eAAA,CAAAyC,cAAc;MAACC,KAAK,EAAEb,QAAQ,CAACa,KAAM;MAACC,GAAG,EAAEd,QAAQ,CAACc;IAAI,CAAC,CAAC;EAAA,CAC7C,CAAC;AAElC,CAAC;AAACnC,OAAA,CAAAiB,kBAAA,GAAAA,kBAAA","ignoreList":[]}

package/dist/Card/HorizontalCard/HorizontalCardBody.js

@@ -5,36 +5,29 @@ import styled from 'styled-components';
 import { COLORS, ComponentMStyling, ComponentTextStyle, ComponentXSStyling } from '../../styles';
 import { LinearProgress } from '../../LinearProgress';
 import { Tag } from '../../Tag';
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-export var HorizontalCardBodyContainer = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  flex: 1;\n  flex-direction: column;\n  gap: 8px;\n  padding: 16px;\n"])));
-export var HorizontalCardBodyTitle = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  ", "\n  .disabled & {\n    color: ", ";\n  }\n"])), function (props) {
-  return ComponentMStyling(ComponentTextStyle.Bold, COLORS.getColor('black', props.theme));
-}, function (props) {
-  return COLORS.getColor('neutral_500', props.theme);
-});
-export var HorizontalCardBodyDescription = styled.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  ", "\n"])), function (props) {
-  return ComponentXSStyling(ComponentTextStyle.Regular, COLORS.getColor('neutral_600', props.theme));
-});
-export var HorizontalCardBodyTagsContainer = styled.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  flex-wrap: wrap;\n  padding: 4px 0;\n  gap: 4px;\n"])));
-export var HorizontalCardBody = function HorizontalCardBody(_ref) {
-  var title = _ref.title,
-    description = _ref.description,
-    progress = _ref.progress,
-    tags = _ref.tags;
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export const HorizontalCardBodyContainer = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  flex: 1;\n  flex-direction: column;\n  gap: 8px;\n  padding: 16px;\n"])));
+export const HorizontalCardBodyTitle = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  ", "\n  .disabled & {\n    color: ", ";\n  }\n"])), props => ComponentMStyling(ComponentTextStyle.Bold, COLORS.getColor('black', props.theme)), props => COLORS.getColor('neutral_500', props.theme));
+export const HorizontalCardBodyDescription = styled.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  ", "\n"])), props => ComponentXSStyling(ComponentTextStyle.Regular, COLORS.getColor('neutral_600', props.theme)));
+export const HorizontalCardBodyTagsContainer = styled.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  flex-wrap: wrap;\n  padding: 4px 0;\n  gap: 4px;\n"])));
+export const HorizontalCardBody = _ref => {
+  let {
+    title,
+    description,
+    progress,
+    tags
+  } = _ref;
   return /*#__PURE__*/_jsxs(HorizontalCardBodyContainer, {
     children: [/*#__PURE__*/_jsx(HorizontalCardBodyTitle, {
       children: title
     }), description && /*#__PURE__*/_jsx(HorizontalCardBodyDescription, {
       children: description
     }), tags && /*#__PURE__*/_jsx(HorizontalCardBodyTagsContainer, {
-      children: tags.map(function (tag, index) {
-        return /*#__PURE__*/_jsx(Tag, {
-          label: tag.label,
-          variant: tag.variant,
-          icon: tag.icon
-        }, index);
-      })
+      children: tags.map((tag, index) => /*#__PURE__*/_jsx(Tag, {
+        label: tag.label,
+        variant: tag.variant,
+        icon: tag.icon
+      }, index))
     }), progress && /*#__PURE__*/_jsx(LinearProgress, {
       value: progress.value,
       max: progress.max

package/dist/Card/HorizontalCard/HorizontalCardBody.js.map

@@ -1 +1 @@
-{"version":3,"file":"HorizontalCardBody.js","names":["React","styled","COLORS","ComponentMStyling","ComponentTextStyle","ComponentXSStyling","LinearProgress","Tag","jsx","_jsx","jsxs","_jsxs","HorizontalCardBodyContainer","div","_templateObject","_taggedTemplateLiteral","HorizontalCardBodyTitle","_templateObject2","props","Bold","getColor","theme","HorizontalCardBodyDescription","_templateObject3","Regular","HorizontalCardBodyTagsContainer","_templateObject4","HorizontalCardBody","_ref","title","description","progress","tags","children","map","tag","index","label","variant","icon","value","max"],"sources":["../../../src/Card/HorizontalCard/HorizontalCardBody.tsx"],"sourcesContent":["import React from 'react';\r\nimport {HorizontalCardProps} from './types';\r\nimport styled from 'styled-components';\r\nimport {COLORS, ComponentMStyling, ComponentTextStyle, ComponentXSStyling} from '../../styles';\r\nimport {LinearProgress} from '../../LinearProgress';\r\nimport {Tag} from '../../Tag';\r\n\r\nexport const HorizontalCardBodyContainer = styled.div`\r\n  display: flex;\r\n  flex: 1;\r\n  flex-direction: column;\r\n  gap: 8px;\r\n  padding: 16px;\r\n`;\r\n\r\nexport const HorizontalCardBodyTitle = styled.div`\r\n  ${props => ComponentMStyling(ComponentTextStyle.Bold, COLORS.getColor('black', props.theme))}\r\n  .disabled & {\r\n    color: ${props => COLORS.getColor('neutral_500', props.theme)};\r\n  }\r\n`;\r\n\r\nexport const HorizontalCardBodyDescription = styled.div`\r\n  ${props => ComponentXSStyling(ComponentTextStyle.Regular, COLORS.getColor('neutral_600', props.theme))}\r\n`;\r\n\r\nexport const HorizontalCardBodyTagsContainer = styled.div`\r\n  display: flex;\r\n  flex-direction: row;\r\n  flex-wrap: wrap;\r\n  padding: 4px 0;\r\n  gap: 4px;\r\n`;\r\n\r\ntype Props = Pick<HorizontalCardProps, 'title' | 'description' | 'progress' | 'tags'>;\r\n\r\nexport const HorizontalCardBody: React.FunctionComponent<Props> = ({\r\n                                                                     title,\r\n                                                                     description,\r\n                                                                     progress,\r\n                                                                     tags,\r\n                                                                   }) => {\r\n\r\n  return (\r\n    <HorizontalCardBodyContainer>\r\n      <HorizontalCardBodyTitle>{title}</HorizontalCardBodyTitle>\r\n      {description && <HorizontalCardBodyDescription>{description}</HorizontalCardBodyDescription>}\r\n      {\r\n        tags &&\r\n        <HorizontalCardBodyTagsContainer>{tags.map((tag, index) => (\r\n          <Tag key={index} label={tag.label} variant={tag.variant} icon={tag.icon}/>))}\r\n        </HorizontalCardBodyTagsContainer>\r\n      }\r\n      {progress && <LinearProgress value={progress.value} max={progress.max}/>}\r\n    </HorizontalCardBodyContainer>\r\n  )\r\n};\r\n"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,OAAOC,MAAM,MAAM,mBAAmB;AACtC,SAAQC,MAAM,EAAEC,iBAAiB,EAAEC,kBAAkB,EAAEC,kBAAkB,QAAO,cAAc;AAC9F,SAAQC,cAAc,QAAO,sBAAsB;AACnD,SAAQC,GAAG,QAAO,WAAW;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAE9B,OAAO,IAAMC,2BAA2B,GAAGX,MAAM,CAACY,GAAG,CAAAC,eAAA,KAAAA,eAAA,GAAAC,sBAAA,kGAMpD;AAED,OAAO,IAAMC,uBAAuB,GAAGf,MAAM,CAACY,GAAG,CAAAI,gBAAA,KAAAA,gBAAA,GAAAF,sBAAA,2DAC7C,UAAAG,KAAK;EAAA,OAAIf,iBAAiB,CAACC,kBAAkB,CAACe,IAAI,EAAEjB,MAAM,CAACkB,QAAQ,CAAC,OAAO,EAAEF,KAAK,CAACG,KAAK,CAAC,CAAC;AAAA,GAEjF,UAAAH,KAAK;EAAA,OAAIhB,MAAM,CAACkB,QAAQ,CAAC,aAAa,EAAEF,KAAK,CAACG,KAAK,CAAC;AAAA,EAEhE;AAED,OAAO,IAAMC,6BAA6B,GAAGrB,MAAM,CAACY,GAAG,CAAAU,gBAAA,KAAAA,gBAAA,GAAAR,sBAAA,mBACnD,UAAAG,KAAK;EAAA,OAAIb,kBAAkB,CAACD,kBAAkB,CAACoB,OAAO,EAAEtB,MAAM,CAACkB,QAAQ,CAAC,aAAa,EAAEF,KAAK,CAACG,KAAK,CAAC,CAAC;AAAA,EACvG;AAED,OAAO,IAAMI,+BAA+B,GAAGxB,MAAM,CAACY,GAAG,CAAAa,gBAAA,KAAAA,gBAAA,GAAAX,sBAAA,wGAMxD;AAID,OAAO,IAAMY,kBAAkD,GAAG,SAArDA,kBAAkDA,CAAAC,IAAA,EAKU;EAAA,IAJJC,KAAK,GAAAD,IAAA,CAALC,KAAK;IACLC,WAAW,GAAAF,IAAA,CAAXE,WAAW;IACXC,QAAQ,GAAAH,IAAA,CAARG,QAAQ;IACRC,IAAI,GAAAJ,IAAA,CAAJI,IAAI;EAGvE,oBACErB,KAAA,CAACC,2BAA2B;IAAAqB,QAAA,gBAC1BxB,IAAA,CAACO,uBAAuB;MAAAiB,QAAA,EAAEJ;IAAK,CAA0B,CAAC,EACzDC,WAAW,iBAAIrB,IAAA,CAACa,6BAA6B;MAAAW,QAAA,EAAEH;IAAW,CAAgC,CAAC,EAE1FE,IAAI,iBACJvB,IAAA,CAACgB,+BAA+B;MAAAQ,QAAA,EAAED,IAAI,CAACE,GAAG,CAAC,UAACC,GAAG,EAAEC,KAAK;QAAA,oBACpD3B,IAAA,CAACF,GAAG;UAAa8B,KAAK,EAAEF,GAAG,CAACE,KAAM;UAACC,OAAO,EAAEH,GAAG,CAACG,OAAQ;UAACC,IAAI,EAAEJ,GAAG,CAACI;QAAK,GAA9DH,KAA+D,CAAC;MAAA,CAAC;IAAC,CAC7C,CAAC,EAEnCL,QAAQ,iBAAItB,IAAA,CAACH,cAAc;MAACkC,KAAK,EAAET,QAAQ,CAACS,KAAM;MAACC,GAAG,EAAEV,QAAQ,CAACU;IAAI,CAAC,CAAC;EAAA,CAC7C,CAAC;AAElC,CAAC","ignoreList":[]}
+{"version":3,"file":"HorizontalCardBody.js","names":["React","styled","COLORS","ComponentMStyling","ComponentTextStyle","ComponentXSStyling","LinearProgress","Tag","jsx","_jsx","jsxs","_jsxs","HorizontalCardBodyContainer","div","_templateObject","_taggedTemplateLiteral","HorizontalCardBodyTitle","_templateObject2","props","Bold","getColor","theme","HorizontalCardBodyDescription","_templateObject3","Regular","HorizontalCardBodyTagsContainer","_templateObject4","HorizontalCardBody","_ref","title","description","progress","tags","children","map","tag","index","label","variant","icon","value","max"],"sources":["../../../src/Card/HorizontalCard/HorizontalCardBody.tsx"],"sourcesContent":["import React from 'react';\r\nimport {HorizontalCardProps} from './types';\r\nimport styled from 'styled-components';\r\nimport {COLORS, ComponentMStyling, ComponentTextStyle, ComponentXSStyling} from '../../styles';\r\nimport {LinearProgress} from '../../LinearProgress';\r\nimport {Tag} from '../../Tag';\r\n\r\nexport const HorizontalCardBodyContainer = styled.div`\r\n  display: flex;\r\n  flex: 1;\r\n  flex-direction: column;\r\n  gap: 8px;\r\n  padding: 16px;\r\n`;\r\n\r\nexport const HorizontalCardBodyTitle = styled.div`\r\n  ${props => ComponentMStyling(ComponentTextStyle.Bold, COLORS.getColor('black', props.theme))}\r\n  .disabled & {\r\n    color: ${props => COLORS.getColor('neutral_500', props.theme)};\r\n  }\r\n`;\r\n\r\nexport const HorizontalCardBodyDescription = styled.div`\r\n  ${props => ComponentXSStyling(ComponentTextStyle.Regular, COLORS.getColor('neutral_600', props.theme))}\r\n`;\r\n\r\nexport const HorizontalCardBodyTagsContainer = styled.div`\r\n  display: flex;\r\n  flex-direction: row;\r\n  flex-wrap: wrap;\r\n  padding: 4px 0;\r\n  gap: 4px;\r\n`;\r\n\r\ntype Props = Pick<HorizontalCardProps, 'title' | 'description' | 'progress' | 'tags'>;\r\n\r\nexport const HorizontalCardBody: React.FunctionComponent<Props> = ({\r\n                                                                     title,\r\n                                                                     description,\r\n                                                                     progress,\r\n                                                                     tags,\r\n                                                                   }) => {\r\n\r\n  return (\r\n    <HorizontalCardBodyContainer>\r\n      <HorizontalCardBodyTitle>{title}</HorizontalCardBodyTitle>\r\n      {description && <HorizontalCardBodyDescription>{description}</HorizontalCardBodyDescription>}\r\n      {\r\n        tags &&\r\n        <HorizontalCardBodyTagsContainer>{tags.map((tag, index) => (\r\n          <Tag key={index} label={tag.label} variant={tag.variant} icon={tag.icon}/>))}\r\n        </HorizontalCardBodyTagsContainer>\r\n      }\r\n      {progress && <LinearProgress value={progress.value} max={progress.max}/>}\r\n    </HorizontalCardBodyContainer>\r\n  )\r\n};\r\n"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,OAAOC,MAAM,MAAM,mBAAmB;AACtC,SAAQC,MAAM,EAAEC,iBAAiB,EAAEC,kBAAkB,EAAEC,kBAAkB,QAAO,cAAc;AAC9F,SAAQC,cAAc,QAAO,sBAAsB;AACnD,SAAQC,GAAG,QAAO,WAAW;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAE9B,OAAO,MAAMC,2BAA2B,GAAGX,MAAM,CAACY,GAAG,CAAAC,eAAA,KAAAA,eAAA,GAAAC,sBAAA,kGAMpD;AAED,OAAO,MAAMC,uBAAuB,GAAGf,MAAM,CAACY,GAAG,CAAAI,gBAAA,KAAAA,gBAAA,GAAAF,sBAAA,2DAC7CG,KAAK,IAAIf,iBAAiB,CAACC,kBAAkB,CAACe,IAAI,EAAEjB,MAAM,CAACkB,QAAQ,CAAC,OAAO,EAAEF,KAAK,CAACG,KAAK,CAAC,CAAC,EAEjFH,KAAK,IAAIhB,MAAM,CAACkB,QAAQ,CAAC,aAAa,EAAEF,KAAK,CAACG,KAAK,CAAC,CAEhE;AAED,OAAO,MAAMC,6BAA6B,GAAGrB,MAAM,CAACY,GAAG,CAAAU,gBAAA,KAAAA,gBAAA,GAAAR,sBAAA,mBACnDG,KAAK,IAAIb,kBAAkB,CAACD,kBAAkB,CAACoB,OAAO,EAAEtB,MAAM,CAACkB,QAAQ,CAAC,aAAa,EAAEF,KAAK,CAACG,KAAK,CAAC,CAAC,CACvG;AAED,OAAO,MAAMI,+BAA+B,GAAGxB,MAAM,CAACY,GAAG,CAAAa,gBAAA,KAAAA,gBAAA,GAAAX,sBAAA,wGAMxD;AAID,OAAO,MAAMY,kBAAkD,GAAGC,IAAA,IAKO;EAAA,IALN;IACEC,KAAK;IACLC,WAAW;IACXC,QAAQ;IACRC;EACF,CAAC,GAAAJ,IAAA;EAElE,oBACEjB,KAAA,CAACC,2BAA2B;IAAAqB,QAAA,gBAC1BxB,IAAA,CAACO,uBAAuB;MAAAiB,QAAA,EAAEJ;IAAK,CAA0B,CAAC,EACzDC,WAAW,iBAAIrB,IAAA,CAACa,6BAA6B;MAAAW,QAAA,EAAEH;IAAW,CAAgC,CAAC,EAE1FE,IAAI,iBACJvB,IAAA,CAACgB,+BAA+B;MAAAQ,QAAA,EAAED,IAAI,CAACE,GAAG,CAAC,CAACC,GAAG,EAAEC,KAAK,kBACpD3B,IAAA,CAACF,GAAG;QAAa8B,KAAK,EAAEF,GAAG,CAACE,KAAM;QAACC,OAAO,EAAEH,GAAG,CAACG,OAAQ;QAACC,IAAI,EAAEJ,GAAG,CAACI;MAAK,GAA9DH,KAA+D,CAAE;IAAC,CAC7C,CAAC,EAEnCL,QAAQ,iBAAItB,IAAA,CAACH,cAAc;MAACkC,KAAK,EAAET,QAAQ,CAACS,KAAM;MAACC,GAAG,EAAEV,QAAQ,CAACU;IAAI,CAAC,CAAC;EAAA,CAC7C,CAAC;AAElC,CAAC","ignoreList":[]}

package/dist/Card/HorizontalCard/HorizontalCardThumbnail.cjs

@@ -12,21 +12,17 @@ var _styles = require("../../styles");
 var _Image = require("../../Image");
 var _jsxRuntime = require("react/jsx-runtime");
 var _templateObject, _templateObject2;
-var HorizontalCardIconContainer = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n  display: flex;\n  justify-content: flex-end;\n  align-items: center;\n  width: 64px;\n  height: 80px;\n\n  color: ", ";\n\n  .disabled & {\n    color: ", ";\n  }\n"])), function (props) {
-  return _styles.COLORS.getColor('black', props.theme);
-}, function (props) {
-  return _styles.COLORS.getColor('neutral_500', props.theme);
-});
-exports.HorizontalCardIconContainer = HorizontalCardIconContainer;
-var HorizontalCardImageContainer = _styledComponents["default"].div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n  height: 100%;\n  overflow: hidden;\n  border-bottom-left-radius: 8px;\n  border-top-left-radius: 8px;\n  width: 120px;\n\n  img {\n    mix-blend-mode: multiply;\n    object-fit: cover;\n    width: 100%;\n    height: 100%;\n\n  }\n\n  .disabled & {\n    img {\n      filter: grayscale(100%);\n    }\n  }\n\n"])));
-exports.HorizontalCardImageContainer = HorizontalCardImageContainer;
-var HorizontalCardThumbnail = function HorizontalCardThumbnail(_ref) {
+const HorizontalCardIconContainer = exports.HorizontalCardIconContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  justify-content: flex-end;\n  align-items: center;\n  width: 64px;\n  height: 80px;\n\n  color: ", ";\n\n  .disabled & {\n    color: ", ";\n  }\n"])), props => _styles.COLORS.getColor('black', props.theme), props => _styles.COLORS.getColor('neutral_500', props.theme));
+const HorizontalCardImageContainer = exports.HorizontalCardImageContainer = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  height: 100%;\n  overflow: hidden;\n  border-bottom-left-radius: 8px;\n  border-top-left-radius: 8px;\n  width: 120px;\n\n  img {\n    mix-blend-mode: multiply;\n    object-fit: cover;\n    width: 100%;\n    height: 100%;\n\n  }\n\n  .disabled & {\n    img {\n      filter: grayscale(100%);\n    }\n  }\n\n"])));
+const HorizontalCardThumbnail = _ref => {
   var _image$fallbackSrc, _image$loader;
-  var image = _ref.image,
-    icon = _ref.icon;
+  let {
+    image,
+    icon
+  } = _ref;
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
     children: [icon && /*#__PURE__*/(0, _jsxRuntime.jsx)(HorizontalCardIconContainer, {
-      children: /*#__PURE__*/_react["default"].cloneElement(icon, {
+      children: /*#__PURE__*/_react.default.cloneElement(icon, {
         width: 48,
         height: 48
       })

package/dist/Card/HorizontalCard/HorizontalCardThumbnail.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"HorizontalCardThumbnail.cjs","names":["_react","_interopRequireDefault","require","_styledComponents","_styles","_Image","_jsxRuntime","_templateObject","_templateObject2","HorizontalCardIconContainer","styled","div","_taggedTemplateLiteral2","props","COLORS","getColor","theme","exports","HorizontalCardImageContainer","HorizontalCardThumbnail","_ref","_image$fallbackSrc","_image$loader","image","icon","jsxs","Fragment","children","jsx","React","cloneElement","width","height","ImageWithFallbacks","fallbacks","fallbackSrc","src","alt","loader"],"sources":["../../../src/Card/HorizontalCard/HorizontalCardThumbnail.tsx"],"sourcesContent":["import React from 'react';\r\nimport {HorizontalCardProps} from './types';\r\nimport styled from 'styled-components';\r\nimport {COLORS} from '../../styles';\r\nimport {ImageWithFallbacks} from \"../../Image\";\r\n\r\nexport const HorizontalCardIconContainer = styled.div`\r\n  display: flex;\r\n  justify-content: flex-end;\r\n  align-items: center;\r\n  width: 64px;\r\n  height: 80px;\r\n\r\n  color: ${props => COLORS.getColor('black', props.theme)};\r\n\r\n  .disabled & {\r\n    color: ${props => COLORS.getColor('neutral_500', props.theme)};\r\n  }\r\n`;\r\n\r\n\r\nexport const HorizontalCardImageContainer = styled.div`\r\n  height: 100%;\r\n  overflow: hidden;\r\n  border-bottom-left-radius: 8px;\r\n  border-top-left-radius: 8px;\r\n  width: 120px;\r\n\r\n  img {\r\n    mix-blend-mode: multiply;\r\n    object-fit: cover;\r\n    width: 100%;\r\n    height: 100%;\r\n\r\n  }\r\n\r\n  .disabled & {\r\n    img {\r\n      filter: grayscale(100%);\r\n    }\r\n  }\r\n\r\n`;\r\n\r\ntype Props = Pick<HorizontalCardProps, 'image' | 'icon'>;\r\n\r\nexport const HorizontalCardThumbnail: React.FunctionComponent<Props> = ({\r\n                                                                          image,\r\n                                                                          icon\r\n                                                                        }) => {\r\n\r\n  return (\r\n    <>\r\n      {\r\n        icon &&\r\n          <HorizontalCardIconContainer>\r\n            {React.cloneElement(icon, {width: 48, height: 48})}\r\n          </HorizontalCardIconContainer>\r\n      }\r\n      {\r\n        image &&\r\n          <HorizontalCardImageContainer>\r\n              <ImageWithFallbacks fallbacks={image.fallbackSrc ?? ''} src={image.src} alt={image.alt}\r\n                                  loader={image.loader ?? false} width={image.width} height={image.height}/>\r\n          </HorizontalCardImageContainer>\r\n      }\r\n    </>\r\n  )\r\n};\r\n"],"mappings":";;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAEA,IAAAC,iBAAA,GAAAF,sBAAA,CAAAC,OAAA;AACA,IAAAE,OAAA,GAAAF,OAAA;AACA,IAAAG,MAAA,GAAAH,OAAA;AAA+C,IAAAI,WAAA,GAAAJ,OAAA;AAAA,IAAAK,eAAA,EAAAC,gBAAA;AAExC,IAAMC,2BAA2B,GAAGC,4BAAM,CAACC,GAAG,CAAAJ,eAAA,KAAAA,eAAA,OAAAK,uBAAA,4LAO1C,UAAAC,KAAK;EAAA,OAAIC,cAAM,CAACC,QAAQ,CAAC,OAAO,EAAEF,KAAK,CAACG,KAAK,CAAC;AAAA,GAG5C,UAAAH,KAAK;EAAA,OAAIC,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEF,KAAK,CAACG,KAAK,CAAC;AAAA,EAEhE;AAACC,OAAA,CAAAR,2BAAA,GAAAA,2BAAA;AAGK,IAAMS,4BAA4B,GAAGR,4BAAM,CAACC,GAAG,CAAAH,gBAAA,KAAAA,gBAAA,OAAAI,uBAAA,0UAqBrD;AAACK,OAAA,CAAAC,4BAAA,GAAAA,4BAAA;AAIK,IAAMC,uBAAuD,GAAG,SAA1DA,uBAAuDA,CAAAC,IAAA,EAGU;EAAA,IAAAC,kBAAA,EAAAC,aAAA;EAAA,IAFJC,KAAK,GAAAH,IAAA,CAALG,KAAK;IACLC,IAAI,GAAAJ,IAAA,CAAJI,IAAI;EAG5E,oBACE,IAAAlB,WAAA,CAAAmB,IAAA,EAAAnB,WAAA,CAAAoB,QAAA;IAAAC,QAAA,GAEIH,IAAI,iBACF,IAAAlB,WAAA,CAAAsB,GAAA,EAACnB,2BAA2B;MAAAkB,QAAA,eACzBE,iBAAK,CAACC,YAAY,CAACN,IAAI,EAAE;QAACO,KAAK,EAAE,EAAE;QAAEC,MAAM,EAAE;MAAE,CAAC;IAAC,CACvB,CAAC,EAGhCT,KAAK,iBACH,IAAAjB,WAAA,CAAAsB,GAAA,EAACV,4BAA4B;MAAAS,QAAA,eACzB,IAAArB,WAAA,CAAAsB,GAAA,EAACvB,MAAA,CAAA4B,kBAAkB;QAACC,SAAS,GAAAb,kBAAA,GAAEE,KAAK,CAACY,WAAW,cAAAd,kBAAA,cAAAA,kBAAA,GAAI,EAAG;QAACe,GAAG,EAAEb,KAAK,CAACa,GAAI;QAACC,GAAG,EAAEd,KAAK,CAACc,GAAI;QACnEC,MAAM,GAAAhB,aAAA,GAAEC,KAAK,CAACe,MAAM,cAAAhB,aAAA,cAAAA,aAAA,GAAI,KAAM;QAACS,KAAK,EAAER,KAAK,CAACQ,KAAM;QAACC,MAAM,EAAET,KAAK,CAACS;MAAO,CAAC;IAAC,CACpE,CAAC;EAAA,CAEnC,CAAC;AAEP,CAAC;AAACf,OAAA,CAAAE,uBAAA,GAAAA,uBAAA","ignoreList":[]}
+{"version":3,"file":"HorizontalCardThumbnail.cjs","names":["_react","_interopRequireDefault","require","_styledComponents","_styles","_Image","_jsxRuntime","_templateObject","_templateObject2","HorizontalCardIconContainer","exports","styled","div","_taggedTemplateLiteral2","default","props","COLORS","getColor","theme","HorizontalCardImageContainer","HorizontalCardThumbnail","_ref","_image$fallbackSrc","_image$loader","image","icon","jsxs","Fragment","children","jsx","React","cloneElement","width","height","ImageWithFallbacks","fallbacks","fallbackSrc","src","alt","loader"],"sources":["../../../src/Card/HorizontalCard/HorizontalCardThumbnail.tsx"],"sourcesContent":["import React from 'react';\r\nimport {HorizontalCardProps} from './types';\r\nimport styled from 'styled-components';\r\nimport {COLORS} from '../../styles';\r\nimport {ImageWithFallbacks} from \"../../Image\";\r\n\r\nexport const HorizontalCardIconContainer = styled.div`\r\n  display: flex;\r\n  justify-content: flex-end;\r\n  align-items: center;\r\n  width: 64px;\r\n  height: 80px;\r\n\r\n  color: ${props => COLORS.getColor('black', props.theme)};\r\n\r\n  .disabled & {\r\n    color: ${props => COLORS.getColor('neutral_500', props.theme)};\r\n  }\r\n`;\r\n\r\n\r\nexport const HorizontalCardImageContainer = styled.div`\r\n  height: 100%;\r\n  overflow: hidden;\r\n  border-bottom-left-radius: 8px;\r\n  border-top-left-radius: 8px;\r\n  width: 120px;\r\n\r\n  img {\r\n    mix-blend-mode: multiply;\r\n    object-fit: cover;\r\n    width: 100%;\r\n    height: 100%;\r\n\r\n  }\r\n\r\n  .disabled & {\r\n    img {\r\n      filter: grayscale(100%);\r\n    }\r\n  }\r\n\r\n`;\r\n\r\ntype Props = Pick<HorizontalCardProps, 'image' | 'icon'>;\r\n\r\nexport const HorizontalCardThumbnail: React.FunctionComponent<Props> = ({\r\n                                                                          image,\r\n                                                                          icon\r\n                                                                        }) => {\r\n\r\n  return (\r\n    <>\r\n      {\r\n        icon &&\r\n          <HorizontalCardIconContainer>\r\n            {React.cloneElement(icon, {width: 48, height: 48})}\r\n          </HorizontalCardIconContainer>\r\n      }\r\n      {\r\n        image &&\r\n          <HorizontalCardImageContainer>\r\n              <ImageWithFallbacks fallbacks={image.fallbackSrc ?? ''} src={image.src} alt={image.alt}\r\n                                  loader={image.loader ?? false} width={image.width} height={image.height}/>\r\n          </HorizontalCardImageContainer>\r\n      }\r\n    </>\r\n  )\r\n};\r\n"],"mappings":";;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAEA,IAAAC,iBAAA,GAAAF,sBAAA,CAAAC,OAAA;AACA,IAAAE,OAAA,GAAAF,OAAA;AACA,IAAAG,MAAA,GAAAH,OAAA;AAA+C,IAAAI,WAAA,GAAAJ,OAAA;AAAA,IAAAK,eAAA,EAAAC,gBAAA;AAExC,MAAMC,2BAA2B,GAAAC,OAAA,CAAAD,2BAAA,GAAGE,yBAAM,CAACC,GAAG,CAAAL,eAAA,KAAAA,eAAA,OAAAM,uBAAA,CAAAC,OAAA,iLAO1CC,KAAK,IAAIC,cAAM,CAACC,QAAQ,CAAC,OAAO,EAAEF,KAAK,CAACG,KAAK,CAAC,EAG5CH,KAAK,IAAIC,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEF,KAAK,CAACG,KAAK,CAAC,CAEhE;AAGM,MAAMC,4BAA4B,GAAAT,OAAA,CAAAS,4BAAA,GAAGR,yBAAM,CAACC,GAAG,CAAAJ,gBAAA,KAAAA,gBAAA,OAAAK,uBAAA,CAAAC,OAAA,+TAqBrD;AAIM,MAAMM,uBAAuD,GAAGC,IAAA,IAGO;EAAA,IAAAC,kBAAA,EAAAC,aAAA;EAAA,IAHN;IACEC,KAAK;IACLC;EACF,CAAC,GAAAJ,IAAA;EAEvE,oBACE,IAAAf,WAAA,CAAAoB,IAAA,EAAApB,WAAA,CAAAqB,QAAA;IAAAC,QAAA,GAEIH,IAAI,iBACF,IAAAnB,WAAA,CAAAuB,GAAA,EAACpB,2BAA2B;MAAAmB,QAAA,eACzBE,cAAK,CAACC,YAAY,CAACN,IAAI,EAAE;QAACO,KAAK,EAAE,EAAE;QAAEC,MAAM,EAAE;MAAE,CAAC;IAAC,CACvB,CAAC,EAGhCT,KAAK,iBACH,IAAAlB,WAAA,CAAAuB,GAAA,EAACV,4BAA4B;MAAAS,QAAA,eACzB,IAAAtB,WAAA,CAAAuB,GAAA,EAACxB,MAAA,CAAA6B,kBAAkB;QAACC,SAAS,GAAAb,kBAAA,GAAEE,KAAK,CAACY,WAAW,cAAAd,kBAAA,cAAAA,kBAAA,GAAI,EAAG;QAACe,GAAG,EAAEb,KAAK,CAACa,GAAI;QAACC,GAAG,EAAEd,KAAK,CAACc,GAAI;QACnEC,MAAM,GAAAhB,aAAA,GAAEC,KAAK,CAACe,MAAM,cAAAhB,aAAA,cAAAA,aAAA,GAAI,KAAM;QAACS,KAAK,EAAER,KAAK,CAACQ,KAAM;QAACC,MAAM,EAAET,KAAK,CAACS;MAAO,CAAC;IAAC,CACpE,CAAC;EAAA,CAEnC,CAAC;AAEP,CAAC;AAACvB,OAAA,CAAAU,uBAAA,GAAAA,uBAAA","ignoreList":[]}

package/dist/Card/HorizontalCard/HorizontalCardThumbnail.js

@@ -4,19 +4,15 @@ import React from 'react';
 import styled from 'styled-components';
 import { COLORS } from '../../styles';
 import { ImageWithFallbacks } from "../../Image";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Fragment as _Fragment } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-export var HorizontalCardIconContainer = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: flex-end;\n  align-items: center;\n  width: 64px;\n  height: 80px;\n\n  color: ", ";\n\n  .disabled & {\n    color: ", ";\n  }\n"])), function (props) {
-  return COLORS.getColor('black', props.theme);
-}, function (props) {
-  return COLORS.getColor('neutral_500', props.theme);
-});
-export var HorizontalCardImageContainer = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  height: 100%;\n  overflow: hidden;\n  border-bottom-left-radius: 8px;\n  border-top-left-radius: 8px;\n  width: 120px;\n\n  img {\n    mix-blend-mode: multiply;\n    object-fit: cover;\n    width: 100%;\n    height: 100%;\n\n  }\n\n  .disabled & {\n    img {\n      filter: grayscale(100%);\n    }\n  }\n\n"])));
-export var HorizontalCardThumbnail = function HorizontalCardThumbnail(_ref) {
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+export const HorizontalCardIconContainer = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: flex-end;\n  align-items: center;\n  width: 64px;\n  height: 80px;\n\n  color: ", ";\n\n  .disabled & {\n    color: ", ";\n  }\n"])), props => COLORS.getColor('black', props.theme), props => COLORS.getColor('neutral_500', props.theme));
+export const HorizontalCardImageContainer = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  height: 100%;\n  overflow: hidden;\n  border-bottom-left-radius: 8px;\n  border-top-left-radius: 8px;\n  width: 120px;\n\n  img {\n    mix-blend-mode: multiply;\n    object-fit: cover;\n    width: 100%;\n    height: 100%;\n\n  }\n\n  .disabled & {\n    img {\n      filter: grayscale(100%);\n    }\n  }\n\n"])));
+export const HorizontalCardThumbnail = _ref => {
   var _image$fallbackSrc, _image$loader;
-  var image = _ref.image,
-    icon = _ref.icon;
+  let {
+    image,
+    icon
+  } = _ref;
   return /*#__PURE__*/_jsxs(_Fragment, {
     children: [icon && /*#__PURE__*/_jsx(HorizontalCardIconContainer, {
       children: /*#__PURE__*/React.cloneElement(icon, {

package/dist/Card/HorizontalCard/HorizontalCardThumbnail.js.map

@@ -1 +1 @@
-{"version":3,"file":"HorizontalCardThumbnail.js","names":["React","styled","COLORS","ImageWithFallbacks","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","HorizontalCardIconContainer","div","_templateObject","_taggedTemplateLiteral","props","getColor","theme","HorizontalCardImageContainer","_templateObject2","HorizontalCardThumbnail","_ref","_image$fallbackSrc","_image$loader","image","icon","children","cloneElement","width","height","fallbacks","fallbackSrc","src","alt","loader"],"sources":["../../../src/Card/HorizontalCard/HorizontalCardThumbnail.tsx"],"sourcesContent":["import React from 'react';\r\nimport {HorizontalCardProps} from './types';\r\nimport styled from 'styled-components';\r\nimport {COLORS} from '../../styles';\r\nimport {ImageWithFallbacks} from \"../../Image\";\r\n\r\nexport const HorizontalCardIconContainer = styled.div`\r\n  display: flex;\r\n  justify-content: flex-end;\r\n  align-items: center;\r\n  width: 64px;\r\n  height: 80px;\r\n\r\n  color: ${props => COLORS.getColor('black', props.theme)};\r\n\r\n  .disabled & {\r\n    color: ${props => COLORS.getColor('neutral_500', props.theme)};\r\n  }\r\n`;\r\n\r\n\r\nexport const HorizontalCardImageContainer = styled.div`\r\n  height: 100%;\r\n  overflow: hidden;\r\n  border-bottom-left-radius: 8px;\r\n  border-top-left-radius: 8px;\r\n  width: 120px;\r\n\r\n  img {\r\n    mix-blend-mode: multiply;\r\n    object-fit: cover;\r\n    width: 100%;\r\n    height: 100%;\r\n\r\n  }\r\n\r\n  .disabled & {\r\n    img {\r\n      filter: grayscale(100%);\r\n    }\r\n  }\r\n\r\n`;\r\n\r\ntype Props = Pick<HorizontalCardProps, 'image' | 'icon'>;\r\n\r\nexport const HorizontalCardThumbnail: React.FunctionComponent<Props> = ({\r\n                                                                          image,\r\n                                                                          icon\r\n                                                                        }) => {\r\n\r\n  return (\r\n    <>\r\n      {\r\n        icon &&\r\n          <HorizontalCardIconContainer>\r\n            {React.cloneElement(icon, {width: 48, height: 48})}\r\n          </HorizontalCardIconContainer>\r\n      }\r\n      {\r\n        image &&\r\n          <HorizontalCardImageContainer>\r\n              <ImageWithFallbacks fallbacks={image.fallbackSrc ?? ''} src={image.src} alt={image.alt}\r\n                                  loader={image.loader ?? false} width={image.width} height={image.height}/>\r\n          </HorizontalCardImageContainer>\r\n      }\r\n    </>\r\n  )\r\n};\r\n"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,OAAOC,MAAM,MAAM,mBAAmB;AACtC,SAAQC,MAAM,QAAO,cAAc;AACnC,SAAQC,kBAAkB,QAAO,aAAa;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,QAAA,IAAAC,SAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAE/C,OAAO,IAAMC,2BAA2B,GAAGT,MAAM,CAACU,GAAG,CAAAC,eAAA,KAAAA,eAAA,GAAAC,sBAAA,gLAO1C,UAAAC,KAAK;EAAA,OAAIZ,MAAM,CAACa,QAAQ,CAAC,OAAO,EAAED,KAAK,CAACE,KAAK,CAAC;AAAA,GAG5C,UAAAF,KAAK;EAAA,OAAIZ,MAAM,CAACa,QAAQ,CAAC,aAAa,EAAED,KAAK,CAACE,KAAK,CAAC;AAAA,EAEhE;AAGD,OAAO,IAAMC,4BAA4B,GAAGhB,MAAM,CAACU,GAAG,CAAAO,gBAAA,KAAAA,gBAAA,GAAAL,sBAAA,8TAqBrD;AAID,OAAO,IAAMM,uBAAuD,GAAG,SAA1DA,uBAAuDA,CAAAC,IAAA,EAGU;EAAA,IAAAC,kBAAA,EAAAC,aAAA;EAAA,IAFJC,KAAK,GAAAH,IAAA,CAALG,KAAK;IACLC,IAAI,GAAAJ,IAAA,CAAJI,IAAI;EAG5E,oBACEf,KAAA,CAAAF,SAAA;IAAAkB,QAAA,GAEID,IAAI,iBACFnB,IAAA,CAACK,2BAA2B;MAAAe,QAAA,eACzBzB,KAAK,CAAC0B,YAAY,CAACF,IAAI,EAAE;QAACG,KAAK,EAAE,EAAE;QAAEC,MAAM,EAAE;MAAE,CAAC;IAAC,CACvB,CAAC,EAGhCL,KAAK,iBACHlB,IAAA,CAACY,4BAA4B;MAAAQ,QAAA,eACzBpB,IAAA,CAACF,kBAAkB;QAAC0B,SAAS,GAAAR,kBAAA,GAAEE,KAAK,CAACO,WAAW,cAAAT,kBAAA,cAAAA,kBAAA,GAAI,EAAG;QAACU,GAAG,EAAER,KAAK,CAACQ,GAAI;QAACC,GAAG,EAAET,KAAK,CAACS,GAAI;QACnEC,MAAM,GAAAX,aAAA,GAAEC,KAAK,CAACU,MAAM,cAAAX,aAAA,cAAAA,aAAA,GAAI,KAAM;QAACK,KAAK,EAAEJ,KAAK,CAACI,KAAM;QAACC,MAAM,EAAEL,KAAK,CAACK;MAAO,CAAC;IAAC,CACpE,CAAC;EAAA,CAEnC,CAAC;AAEP,CAAC","ignoreList":[]}
+{"version":3,"file":"HorizontalCardThumbnail.js","names":["React","styled","COLORS","ImageWithFallbacks","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","HorizontalCardIconContainer","div","_templateObject","_taggedTemplateLiteral","props","getColor","theme","HorizontalCardImageContainer","_templateObject2","HorizontalCardThumbnail","_ref","_image$fallbackSrc","_image$loader","image","icon","children","cloneElement","width","height","fallbacks","fallbackSrc","src","alt","loader"],"sources":["../../../src/Card/HorizontalCard/HorizontalCardThumbnail.tsx"],"sourcesContent":["import React from 'react';\r\nimport {HorizontalCardProps} from './types';\r\nimport styled from 'styled-components';\r\nimport {COLORS} from '../../styles';\r\nimport {ImageWithFallbacks} from \"../../Image\";\r\n\r\nexport const HorizontalCardIconContainer = styled.div`\r\n  display: flex;\r\n  justify-content: flex-end;\r\n  align-items: center;\r\n  width: 64px;\r\n  height: 80px;\r\n\r\n  color: ${props => COLORS.getColor('black', props.theme)};\r\n\r\n  .disabled & {\r\n    color: ${props => COLORS.getColor('neutral_500', props.theme)};\r\n  }\r\n`;\r\n\r\n\r\nexport const HorizontalCardImageContainer = styled.div`\r\n  height: 100%;\r\n  overflow: hidden;\r\n  border-bottom-left-radius: 8px;\r\n  border-top-left-radius: 8px;\r\n  width: 120px;\r\n\r\n  img {\r\n    mix-blend-mode: multiply;\r\n    object-fit: cover;\r\n    width: 100%;\r\n    height: 100%;\r\n\r\n  }\r\n\r\n  .disabled & {\r\n    img {\r\n      filter: grayscale(100%);\r\n    }\r\n  }\r\n\r\n`;\r\n\r\ntype Props = Pick<HorizontalCardProps, 'image' | 'icon'>;\r\n\r\nexport const HorizontalCardThumbnail: React.FunctionComponent<Props> = ({\r\n                                                                          image,\r\n                                                                          icon\r\n                                                                        }) => {\r\n\r\n  return (\r\n    <>\r\n      {\r\n        icon &&\r\n          <HorizontalCardIconContainer>\r\n            {React.cloneElement(icon, {width: 48, height: 48})}\r\n          </HorizontalCardIconContainer>\r\n      }\r\n      {\r\n        image &&\r\n          <HorizontalCardImageContainer>\r\n              <ImageWithFallbacks fallbacks={image.fallbackSrc ?? ''} src={image.src} alt={image.alt}\r\n                                  loader={image.loader ?? false} width={image.width} height={image.height}/>\r\n          </HorizontalCardImageContainer>\r\n      }\r\n    </>\r\n  )\r\n};\r\n"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,OAAOC,MAAM,MAAM,mBAAmB;AACtC,SAAQC,MAAM,QAAO,cAAc;AACnC,SAAQC,kBAAkB,QAAO,aAAa;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,QAAA,IAAAC,SAAA,EAAAC,IAAA,IAAAC,KAAA;AAE/C,OAAO,MAAMC,2BAA2B,GAAGT,MAAM,CAACU,GAAG,CAAAC,eAAA,KAAAA,eAAA,GAAAC,sBAAA,gLAO1CC,KAAK,IAAIZ,MAAM,CAACa,QAAQ,CAAC,OAAO,EAAED,KAAK,CAACE,KAAK,CAAC,EAG5CF,KAAK,IAAIZ,MAAM,CAACa,QAAQ,CAAC,aAAa,EAAED,KAAK,CAACE,KAAK,CAAC,CAEhE;AAGD,OAAO,MAAMC,4BAA4B,GAAGhB,MAAM,CAACU,GAAG,CAAAO,gBAAA,KAAAA,gBAAA,GAAAL,sBAAA,8TAqBrD;AAID,OAAO,MAAMM,uBAAuD,GAAGC,IAAA,IAGO;EAAA,IAAAC,kBAAA,EAAAC,aAAA;EAAA,IAHN;IACEC,KAAK;IACLC;EACF,CAAC,GAAAJ,IAAA;EAEvE,oBACEX,KAAA,CAAAF,SAAA;IAAAkB,QAAA,GAEID,IAAI,iBACFnB,IAAA,CAACK,2BAA2B;MAAAe,QAAA,eACzBzB,KAAK,CAAC0B,YAAY,CAACF,IAAI,EAAE;QAACG,KAAK,EAAE,EAAE;QAAEC,MAAM,EAAE;MAAE,CAAC;IAAC,CACvB,CAAC,EAGhCL,KAAK,iBACHlB,IAAA,CAACY,4BAA4B;MAAAQ,QAAA,eACzBpB,IAAA,CAACF,kBAAkB;QAAC0B,SAAS,GAAAR,kBAAA,GAAEE,KAAK,CAACO,WAAW,cAAAT,kBAAA,cAAAA,kBAAA,GAAI,EAAG;QAACU,GAAG,EAAER,KAAK,CAACQ,GAAI;QAACC,GAAG,EAAET,KAAK,CAACS,GAAI;QACnEC,MAAM,GAAAX,aAAA,GAAEC,KAAK,CAACU,MAAM,cAAAX,aAAA,cAAAA,aAAA,GAAI,KAAM;QAACK,KAAK,EAAEJ,KAAK,CAACI,KAAM;QAACC,MAAM,EAAEL,KAAK,CAACK;MAAO,CAAC;IAAC,CACpE,CAAC;EAAA,CAEnC,CAAC;AAEP,CAAC","ignoreList":[]}

package/dist/Card/HorizontalCard/index.cjs

@@ -9,7 +9,7 @@ Object.keys(_types).forEach(function (key) {
   if (key in exports && exports[key] === _types[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
-    get: function get() {
+    get: function () {
       return _types[key];
     }
   });
@@ -20,7 +20,7 @@ Object.keys(_HorizontalCard).forEach(function (key) {
   if (key in exports && exports[key] === _HorizontalCard[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
-    get: function get() {
+    get: function () {
       return _HorizontalCard[key];
     }
   });
@@ -31,7 +31,7 @@ Object.keys(_HorizontalCardBody).forEach(function (key) {
   if (key in exports && exports[key] === _HorizontalCardBody[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
-    get: function get() {
+    get: function () {
       return _HorizontalCardBody[key];
     }
   });
@@ -42,7 +42,7 @@ Object.keys(_HorizontalCardThumbnail).forEach(function (key) {
   if (key in exports && exports[key] === _HorizontalCardThumbnail[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
-    get: function get() {
+    get: function () {
       return _HorizontalCardThumbnail[key];
     }
   });

package/dist/Card/HorizontalCard/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","names":["_types","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get","_HorizontalCard","_HorizontalCardBody","_HorizontalCardThumbnail"],"sources":["../../../src/Card/HorizontalCard/index.ts"],"sourcesContent":["export * from './types';\r\nexport * from './HorizontalCard';\r\nexport * from './HorizontalCardBody';\r\nexport * from './HorizontalCardThumbnail';\r\n\r\n\r\n"],"mappings":";;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,MAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,MAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,IAAA;MAAA,OAAAT,MAAA,CAAAK,GAAA;IAAA;EAAA;AAAA;AACA,IAAAK,eAAA,GAAAT,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAO,eAAA,EAAAN,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAK,eAAA,CAAAL,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,IAAA;MAAA,OAAAC,eAAA,CAAAL,GAAA;IAAA;EAAA;AAAA;AACA,IAAAM,mBAAA,GAAAV,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAQ,mBAAA,EAAAP,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAM,mBAAA,CAAAN,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,IAAA;MAAA,OAAAE,mBAAA,CAAAN,GAAA;IAAA;EAAA;AAAA;AACA,IAAAO,wBAAA,GAAAX,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAS,wBAAA,EAAAR,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAO,wBAAA,CAAAP,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,IAAA;MAAA,OAAAG,wBAAA,CAAAP,GAAA;IAAA;EAAA;AAAA","ignoreList":[]}
+{"version":3,"file":"index.cjs","names":["_types","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get","_HorizontalCard","_HorizontalCardBody","_HorizontalCardThumbnail"],"sources":["../../../src/Card/HorizontalCard/index.ts"],"sourcesContent":["export * from './types';\r\nexport * from './HorizontalCard';\r\nexport * from './HorizontalCardBody';\r\nexport * from './HorizontalCardThumbnail';\r\n\r\n\r\n"],"mappings":";;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,MAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,MAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAT,MAAA,CAAAK,GAAA;IAAA;EAAA;AAAA;AACA,IAAAK,eAAA,GAAAT,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAO,eAAA,EAAAN,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAK,eAAA,CAAAL,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAC,eAAA,CAAAL,GAAA;IAAA;EAAA;AAAA;AACA,IAAAM,mBAAA,GAAAV,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAQ,mBAAA,EAAAP,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAM,mBAAA,CAAAN,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAE,mBAAA,CAAAN,GAAA;IAAA;EAAA;AAAA;AACA,IAAAO,wBAAA,GAAAX,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAS,wBAAA,EAAAR,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAO,wBAAA,CAAAP,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAG,wBAAA,CAAAP,GAAA;IAAA;EAAA;AAAA","ignoreList":[]}

package/dist/Card/VerticalCard/Card.cjs

@@ -1,14 +1,11 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = exports.CardTopLevelContainerStyles = exports.CardContainerStyles = void 0;
+exports.default = exports.CardTopLevelContainerStyles = exports.CardContainerStyles = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
@@ -19,73 +16,52 @@ var _CardMiddleSection = _interopRequireDefault(require("./CardMiddleSection"));
 var _CardBottomSection = _interopRequireDefault(require("./CardBottomSection"));
 var _index = require("../../index");
 var _jsxRuntime = require("react/jsx-runtime");
-var _excluded = ["onCardClicked", "topSectionProps", "middleSectionProps", "bottomSectionProps", "disabled", "variant", "className", "maxWidth"];
+const _excluded = ["onCardClicked", "topSectionProps", "middleSectionProps", "bottomSectionProps", "disabled", "variant", "className", "maxWidth"];
 var _templateObject, _templateObject2;
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-var CardTopLevelContainerStyles = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n  background-color: ", ";\n  min-width: 240px;\n  overflow: hidden;\n\n  border-radius: 8px;\n\n  background-clip: padding-box;\n  box-sizing: border-box;\n  display: flex;\n  flex-direction: column;\n\n  .elevated & {\n    box-shadow: ", ";\n  }\n\n  .outline & {\n    border: 1px solid ", ";\n  }\n"])), function (props) {
-  return _index.COLORS.getColor('white', props.theme);
-}, _index.BOXSHADOWS.BOXSHADOW_L1, function (props) {
-  return _index.COLORS.getColor('neutral_200', props.theme);
-});
-exports.CardTopLevelContainerStyles = CardTopLevelContainerStyles;
-var CardContainerStyles = _styledComponents["default"].div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n  &.interactive:focus {\n    ", "\n  }\n\n  &.interactive:not(.disabled) {\n    cursor: pointer;\n\n    &.outline:not(.action-within) {\n      ", " {\n        &:hover {\n          background-color: ", ";\n        }\n\n        &:active, &.active-state {\n          background-color: ", ";\n        }\n      }\n    }\n\n    &.elevated:not(.action-within) {\n      ", " {\n        &:hover {\n          box-shadow: ", ";\n        }\n\n        &:active, &.active-state {\n          box-shadow: ", ";\n        }\n      }\n    }\n  }\n\n  &.disabled {\n    cursor: not-allowed;\n    ", "{\n      border: 1px solid ", ";\n    }\n  }\n"])), _index.focusStyles, CardTopLevelContainerStyles, function (props) {
-  return _index.COLORS.getColor('primary_20', props.theme);
-}, function (props) {
-  return _index.COLORS.getColor('primary_100', props.theme);
-}, CardTopLevelContainerStyles, _index.BOXSHADOWS.BOXSHADOW_L3, _index.BOXSHADOWS.BOXSHADOW_L2, CardTopLevelContainerStyles, function (props) {
-  return _index.COLORS.getColor('neutral_100', props.theme);
-});
-exports.CardContainerStyles = CardContainerStyles;
-var Card = function Card(_ref) {
-  var onCardClicked = _ref.onCardClicked,
-    topSectionProps = _ref.topSectionProps,
-    middleSectionProps = _ref.middleSectionProps,
-    bottomSectionProps = _ref.bottomSectionProps,
-    disabled = _ref.disabled,
-    _ref$variant = _ref.variant,
-    variant = _ref$variant === void 0 ? 'elevated' : _ref$variant,
-    className = _ref.className,
-    _ref$maxWidth = _ref.maxWidth,
-    maxWidth = _ref$maxWidth === void 0 ? 560 : _ref$maxWidth,
-    rest = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
-  var _React$useState = React.useState([]),
-    _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
-    actionsRefs = _React$useState2[0],
-    setActionsRefs = _React$useState2[1];
-  var checkBoxRef = React.useRef(null);
-  var containerRef = React.useRef(null);
-  (0, _index.useActionWithin)(containerRef, [].concat((0, _toConsumableArray2["default"])(actionsRefs), [checkBoxRef]));
-  var cls = "".concat(!!onCardClicked ? 'interactive' : '', " ").concat(disabled ? 'disabled' : '', " ").concat(variant, " ").concat(className || '');
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+const CardTopLevelContainerStyles = exports.CardTopLevelContainerStyles = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  background-color: ", ";\n  min-width: 240px;\n  overflow: hidden;\n\n  border-radius: 8px;\n\n  background-clip: padding-box;\n  box-sizing: border-box;\n  display: flex;\n  flex-direction: column;\n\n  .elevated & {\n    box-shadow: ", ";\n  }\n\n  .outline & {\n    border: 1px solid ", ";\n  }\n"])), props => _index.COLORS.getColor('white', props.theme), _index.BOXSHADOWS.BOXSHADOW_L1, props => _index.COLORS.getColor('neutral_200', props.theme));
+const CardContainerStyles = exports.CardContainerStyles = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  &.interactive:focus {\n    ", "\n  }\n\n  &.interactive:not(.disabled) {\n    cursor: pointer;\n\n    &.outline:not(.action-within) {\n      ", " {\n        &:hover {\n          background-color: ", ";\n        }\n\n        &:active, &.active-state {\n          background-color: ", ";\n        }\n      }\n    }\n\n    &.elevated:not(.action-within) {\n      ", " {\n        &:hover {\n          box-shadow: ", ";\n        }\n\n        &:active, &.active-state {\n          box-shadow: ", ";\n        }\n      }\n    }\n  }\n\n  &.disabled {\n    cursor: not-allowed;\n    ", "{\n      border: 1px solid ", ";\n    }\n  }\n"])), _index.focusStyles, CardTopLevelContainerStyles, props => _index.COLORS.getColor('primary_20', props.theme), props => _index.COLORS.getColor('primary_100', props.theme), CardTopLevelContainerStyles, _index.BOXSHADOWS.BOXSHADOW_L3, _index.BOXSHADOWS.BOXSHADOW_L2, CardTopLevelContainerStyles, props => _index.COLORS.getColor('neutral_100', props.theme));
+const Card = _ref => {
+  let {
+      onCardClicked,
+      topSectionProps,
+      middleSectionProps,
+      bottomSectionProps,
+      disabled,
+      variant = 'elevated',
+      className,
+      maxWidth = 560
+    } = _ref,
+    rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+  const [actionsRefs, setActionsRefs] = React.useState([]);
+  const checkBoxRef = React.useRef(null);
+  const containerRef = React.useRef(null);
+  (0, _index.useActionWithin)(containerRef, [...actionsRefs, checkBoxRef]);
+  const cls = "".concat(!!onCardClicked ? 'interactive' : '', " ").concat(disabled ? 'disabled' : '', " ").concat(variant, " ").concat(className || '');
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(CardContainerStyles, _objectSpread(_objectSpread({
     ref: containerRef,
     className: cls,
     tabIndex: !!onCardClicked && !disabled ? 0 : -1,
     onMouseDown: _index.defaultOnMouseDownHandler,
-    onKeyDown: function onKeyDown(a) {
-      return a.key === 'Enter' && !disabled && onCardClicked && onCardClicked();
-    },
-    onClick: function onClick(e) {
-      return !disabled && onCardClicked && onCardClicked();
-    },
+    onKeyDown: a => a.key === 'Enter' && !disabled && onCardClicked && onCardClicked(),
+    onClick: e => !disabled && onCardClicked && onCardClicked(),
     "data-testid": 'card-wrapper'
   }, rest), {}, {
     children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(CardTopLevelContainerStyles, {
       style: {
         maxWidth: maxWidth
       },
-      children: [topSectionProps && /*#__PURE__*/(0, _jsxRuntime.jsx)(_CardTopSection["default"], _objectSpread(_objectSpread({
+      children: [topSectionProps && /*#__PURE__*/(0, _jsxRuntime.jsx)(_CardTopSection.default, _objectSpread(_objectSpread({
         ref: checkBoxRef
       }, topSectionProps), {}, {
         disabled: disabled
-      })), middleSectionProps && /*#__PURE__*/(0, _jsxRuntime.jsx)(_CardMiddleSection["default"], _objectSpread(_objectSpread({}, middleSectionProps), {}, {
+      })), middleSectionProps && /*#__PURE__*/(0, _jsxRuntime.jsx)(_CardMiddleSection.default, _objectSpread(_objectSpread({}, middleSectionProps), {}, {
         disabled: disabled
-      })), bottomSectionProps && /*#__PURE__*/(0, _jsxRuntime.jsx)(_CardBottomSection["default"], _objectSpread(_objectSpread({
-        ref: function ref(instance) {
-          return setActionsRefs(instance !== null && instance !== void 0 ? instance : []);
-        }
+      })), bottomSectionProps && /*#__PURE__*/(0, _jsxRuntime.jsx)(_CardBottomSection.default, _objectSpread(_objectSpread({
+        ref: instance => setActionsRefs(instance !== null && instance !== void 0 ? instance : [])
       }, bottomSectionProps), {}, {
         disabled: disabled
       }))]
@@ -93,11 +69,10 @@ var Card = function Card(_ref) {
   }));
 };
 Card.propTypes = {
-  onCardClicked: _propTypes["default"].func,
-  disabled: _propTypes["default"].bool,
-  maxWidth: _propTypes["default"].oneOfType([_propTypes["default"].number, _propTypes["default"].string]),
-  variant: _propTypes["default"].oneOf(['outline', 'elevated'])
+  onCardClicked: _propTypes.default.func,
+  disabled: _propTypes.default.bool,
+  maxWidth: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
+  variant: _propTypes.default.oneOf(['outline', 'elevated'])
 };
-var _default = Card;
-exports["default"] = _default;
+var _default = exports.default = Card;
 //# sourceMappingURL=Card.cjs.map