@laerdal/life-react-components 5.1.0 → 6.0.0-dev.1

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

@@ -1 +1 @@
-{"version":3,"file":"HorizontalCard.js","names":["React","styled","BOXSHADOWS","COLORS","focusStyles","HorizontalCardThumbnail","HorizontalCardBody","HorizontalCardActions","defaultOnMouseDownHandler","useActionWithin","jsx","_jsx","jsxs","_jsxs","HorizontalCardContentContainer","div","_templateObject","_taggedTemplateLiteral","props","getColor","theme","HorizontalCardContainer","_templateObject2","BOXSHADOW_L1","BOXSHADOW_L3","BOXSHADOW_L2","HorizontalCard","_ref","title","description","tags","progress","icon","variant","image","action","actions","disabled","className","dataTestId","rest","_objectWithoutProperties","_excluded","actionsRefs","setActionsRefs","useState","containerRef","useRef","cls","concat","handleClick","handleButtonPress","e","key","ref","tabIndex","onKeyDown","onClick","onMouseDown","children","_objectSpread","instance"],"sources":["../../../src/Card/HorizontalCard/HorizontalCard.tsx"],"sourcesContent":["import React, {useEffect} from 'react';\r\nimport {HorizontalCardProps} from './types';\r\nimport styled from 'styled-components';\r\nimport {BOXSHADOWS, COLORS, focusStyles} from '../../styles';\r\nimport {HorizontalCardThumbnail} from './HorizontalCardThumbnail';\r\nimport {HorizontalCardBody} from './HorizontalCardBody';\r\nimport {HorizontalCardActions} from './HorizontalCardActions';\r\nimport {defaultOnMouseDownHandler, useActionWithin} from '../../common';\r\n\r\nexport const HorizontalCardContentContainer = styled.div`\r\n  position: relative;\r\n  display: flex;\r\n  flex: 1;\r\n  flex-direction: row;\r\n  align-items: center;\r\n  background-color: ${props => COLORS.getColor('white', props.theme)};\r\n  border-radius: 8px;\r\n`;\r\n\r\nexport const HorizontalCardContainer = styled.div`\r\n  display: flex;\r\n  flex: 1;\r\n\r\n  &.outline {\r\n    ${HorizontalCardContentContainer} {\r\n      box-shadow: inset 0 0 0 1px ${props => COLORS.getColor('neutral_200', props.theme)};\r\n    }\r\n  }\r\n\r\n  &.elevated {\r\n    ${HorizontalCardContentContainer} {\r\n      box-shadow: ${BOXSHADOWS.BOXSHADOW_L1};\r\n    }\r\n  }\r\n\r\n  &.clickable {\r\n    cursor: pointer;\r\n\r\n    &:hover:not(.action-within):not(.disabled) {\r\n      &.outline {\r\n        ${HorizontalCardContentContainer} {\r\n          background-color: ${props => COLORS.getColor('primary_20', props.theme)};\r\n        }\r\n      }\r\n\r\n      &.elevated {\r\n        ${HorizontalCardContentContainer} {\r\n          box-shadow: ${BOXSHADOWS.BOXSHADOW_L3};\r\n        }\r\n      }\r\n    }\r\n\r\n    &:active:not(.action-within):not(.disabled) {\r\n      &.outline {\r\n        ${HorizontalCardContentContainer} {\r\n          background-color: ${props => COLORS.getColor('primary_100', props.theme)};\r\n        }\r\n      }\r\n\r\n      &.elevated {\r\n        ${HorizontalCardContentContainer} {\r\n          box-shadow: ${BOXSHADOWS.BOXSHADOW_L2};\r\n        }\r\n      }\r\n    }\r\n\r\n    &:focus {\r\n      ${focusStyles}\r\n    }\r\n  }\r\n\r\n  &.disabled {\r\n    cursor: not-allowed;\r\n\r\n    &.elevated {\r\n      ${HorizontalCardContentContainer} {\r\n        box-shadow: ${BOXSHADOWS.BOXSHADOW_L1};\r\n      }\r\n    }\r\n\r\n    &.outline {\r\n      ${HorizontalCardContentContainer} {\r\n        box-shadow: inset 0 0 0 1px ${props => COLORS.getColor('neutral_100', props.theme)};\r\n      }\r\n    }\r\n  }\r\n`;\r\n\r\nexport const HorizontalCard: React.FunctionComponent<HorizontalCardProps> = ({\r\n                                                                               title,\r\n                                                                               description,\r\n                                                                               tags,\r\n                                                                               progress,\r\n                                                                               icon,\r\n                                                                               variant = 'outline',\r\n                                                                               image,\r\n                                                                               action,\r\n                                                                               actions,\r\n                                                                               disabled,\r\n                                                                               className,\r\n                                                                               dataTestId,\r\n                                                                               ...rest\r\n                                                                             }) => {\r\n\r\n  const [actionsRefs, setActionsRefs] = React.useState<React.RefObject<HTMLButtonElement>[]>([]);\r\n  const containerRef = React.useRef<HTMLDivElement>(null);\r\n\r\n  useActionWithin(containerRef, actionsRefs);\r\n\r\n  const cls = `${variant} ${action ? 'clickable' : ''} ${disabled ? 'disabled' : ''} ${className || ''}`;\r\n\r\n  const handleClick = () => {\r\n    !disabled && action && action();\r\n  }\r\n\r\n  const handleButtonPress = (e: React.KeyboardEvent<HTMLDivElement>) => {\r\n    e.key === 'Enter' && handleClick();\r\n  };\r\n\r\n  return (\r\n    <HorizontalCardContainer ref={containerRef}\r\n               tabIndex={action && !disabled ? 0 : -1}\r\n               className={cls}\r\n               onKeyDown={handleButtonPress}\r\n               onClick={handleClick}\r\n               onMouseDown={defaultOnMouseDownHandler}>\r\n      <HorizontalCardContentContainer\r\n               onMouseDown={defaultOnMouseDownHandler}\r\n               data-testid={dataTestId}\r\n               {...rest}>\r\n\r\n        <HorizontalCardThumbnail image={image}\r\n                                 icon={icon}/>\r\n\r\n        <HorizontalCardBody title={title}\r\n                            description={description}\r\n                            tags={tags}\r\n                            progress={progress}/>\r\n\r\n        <HorizontalCardActions ref={instance => setActionsRefs(instance ?? [])}\r\n                               actions={actions}\r\n                               disabled={disabled}/>\r\n\r\n      </HorizontalCardContentContainer>\r\n    </HorizontalCardContainer>\r\n  )\r\n};\r\n\r\nexport default HorizontalCard;\r\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"HorizontalCard.js","names":["React","styled","BOXSHADOWS","COLORS","focusStyles","HorizontalCardThumbnail","HorizontalCardBody","HorizontalCardActions","defaultOnMouseDownHandler","useActionWithin","jsx","_jsx","jsxs","_jsxs","HorizontalCardContentContainer","div","props","getColor","theme","HorizontalCardContainer","BOXSHADOW_L1","BOXSHADOW_L3","BOXSHADOW_L2","HorizontalCard","_ref","title","description","tags","progress","icon","variant","image","action","actions","disabled","className","dataTestId","rest","_objectWithoutProperties","_excluded","actionsRefs","setActionsRefs","useState","containerRef","useRef","cls","handleClick","handleButtonPress","e","key","ref","tabIndex","onKeyDown","onClick","onMouseDown","children","_objectSpread","instance"],"sources":["../../../src/Card/HorizontalCard/HorizontalCard.tsx"],"sourcesContent":["import React, {useEffect} from 'react';\r\nimport {HorizontalCardProps} from './types';\r\nimport styled from 'styled-components';\r\nimport {BOXSHADOWS, COLORS, focusStyles} from '../../styles';\r\nimport {HorizontalCardThumbnail} from './HorizontalCardThumbnail';\r\nimport {HorizontalCardBody} from './HorizontalCardBody';\r\nimport {HorizontalCardActions} from './HorizontalCardActions';\r\nimport {defaultOnMouseDownHandler, useActionWithin} from '../../common';\r\n\r\nexport const HorizontalCardContentContainer = styled.div`\r\n  position: relative;\r\n  display: flex;\r\n  flex: 1;\r\n  flex-direction: row;\r\n  align-items: center;\r\n  background-color: ${props => COLORS.getColor('white', props.theme)};\r\n  border-radius: 8px;\r\n`;\r\n\r\nexport const HorizontalCardContainer = styled.div`\r\n  display: flex;\r\n  flex: 1;\r\n\r\n  &.outline {\r\n    ${HorizontalCardContentContainer} {\r\n      box-shadow: inset 0 0 0 1px ${props => COLORS.getColor('neutral_200', props.theme)};\r\n    }\r\n  }\r\n\r\n  &.elevated {\r\n    ${HorizontalCardContentContainer} {\r\n      box-shadow: ${BOXSHADOWS.BOXSHADOW_L1};\r\n    }\r\n  }\r\n\r\n  &.clickable {\r\n    cursor: pointer;\r\n\r\n    &:hover:not(.action-within):not(.disabled) {\r\n      &.outline {\r\n        ${HorizontalCardContentContainer} {\r\n          background-color: ${props => COLORS.getColor('primary_20', props.theme)};\r\n        }\r\n      }\r\n\r\n      &.elevated {\r\n        ${HorizontalCardContentContainer} {\r\n          box-shadow: ${BOXSHADOWS.BOXSHADOW_L3};\r\n        }\r\n      }\r\n    }\r\n\r\n    &:active:not(.action-within):not(.disabled) {\r\n      &.outline {\r\n        ${HorizontalCardContentContainer} {\r\n          background-color: ${props => COLORS.getColor('primary_100', props.theme)};\r\n        }\r\n      }\r\n\r\n      &.elevated {\r\n        ${HorizontalCardContentContainer} {\r\n          box-shadow: ${BOXSHADOWS.BOXSHADOW_L2};\r\n        }\r\n      }\r\n    }\r\n\r\n    &:focus {\r\n      ${focusStyles}\r\n    }\r\n  }\r\n\r\n  &.disabled {\r\n    cursor: not-allowed;\r\n\r\n    &.elevated {\r\n      ${HorizontalCardContentContainer} {\r\n        box-shadow: ${BOXSHADOWS.BOXSHADOW_L1};\r\n      }\r\n    }\r\n\r\n    &.outline {\r\n      ${HorizontalCardContentContainer} {\r\n        box-shadow: inset 0 0 0 1px ${props => COLORS.getColor('neutral_100', props.theme)};\r\n      }\r\n    }\r\n  }\r\n`;\r\n\r\nexport const HorizontalCard: React.FunctionComponent<HorizontalCardProps> = ({\r\n                                                                               title,\r\n                                                                               description,\r\n                                                                               tags,\r\n                                                                               progress,\r\n                                                                               icon,\r\n                                                                               variant = 'outline',\r\n                                                                               image,\r\n                                                                               action,\r\n                                                                               actions,\r\n                                                                               disabled,\r\n                                                                               className,\r\n                                                                               dataTestId,\r\n                                                                               ...rest\r\n                                                                             }) => {\r\n\r\n  const [actionsRefs, setActionsRefs] = React.useState<React.RefObject<HTMLButtonElement | null>[]>([]);\r\n  const containerRef = React.useRef<HTMLDivElement>(null);\r\n\r\n  useActionWithin(containerRef, actionsRefs);\r\n\r\n  const cls = `${variant} ${action ? 'clickable' : ''} ${disabled ? 'disabled' : ''} ${className || ''}`;\r\n\r\n  const handleClick = () => {\r\n    !disabled && action && action();\r\n  }\r\n\r\n  const handleButtonPress = (e: React.KeyboardEvent<HTMLDivElement>) => {\r\n    e.key === 'Enter' && handleClick();\r\n  };\r\n\r\n  return (\r\n    <HorizontalCardContainer ref={containerRef}\r\n               tabIndex={action && !disabled ? 0 : -1}\r\n               className={cls}\r\n               onKeyDown={handleButtonPress}\r\n               onClick={handleClick}\r\n               onMouseDown={defaultOnMouseDownHandler}>\r\n      <HorizontalCardContentContainer\r\n               onMouseDown={defaultOnMouseDownHandler}\r\n               data-testid={dataTestId}\r\n               {...rest}>\r\n\r\n        <HorizontalCardThumbnail image={image}\r\n                                 icon={icon}/>\r\n\r\n        <HorizontalCardBody title={title}\r\n                            description={description}\r\n                            tags={tags}\r\n                            progress={progress}/>\r\n\r\n        <HorizontalCardActions ref={instance => {\r\n          setActionsRefs(instance ?? []);\r\n        }}\r\n                               actions={actions}\r\n                               disabled={disabled}/>\r\n\r\n      </HorizontalCardContentContainer>\r\n    </HorizontalCardContainer>\r\n  );\r\n};\r\n\r\nexport default HorizontalCard;\r\n"],"mappings":"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","ignoreList":[]}

package/dist/Card/HorizontalCard/HorizontalCardActions.cjs

@@ -5,22 +5,22 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.HorizontalCardActions = void 0;
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var _react = _interopRequireDefault(require("react"));
 var _Button = require("../../Button");
 var _Toggles = require("../../Toggles");
 var _Dropdown = require("../../Dropdown");
 var _styledComponents = _interopRequireDefault(require("styled-components"));
 var _jsxRuntime = require("react/jsx-runtime");
-var _templateObject;
-const Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n"])));
+const Container = _styledComponents.default.div`
+  display: flex;
+`;
 const HorizontalCardActions = exports.HorizontalCardActions = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
   let {
     actions,
     disabled
   } = _ref;
   const [elRefs, setElRefs] = _react.default.useState([]);
-  const length = (actions === null || actions === void 0 ? void 0 : actions.length) || 0;
+  const length = actions?.length || 0;
   _react.default.useEffect(() => {
     setElRefs(Array(length || 0).fill(null).map(() => /*#__PURE__*/_react.default.createRef()));
   }, [length]);
@@ -33,7 +33,6 @@ const HorizontalCardActions = exports.HorizontalCardActions = /*#__PURE__*/_reac
         }
       case 'icon':
         {
-          var _item$disabled;
           return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.IconButton, {
             ref: elRefs[index],
             variant: 'secondary',
@@ -41,25 +40,23 @@ const HorizontalCardActions = exports.HorizontalCardActions = /*#__PURE__*/_reac
             shape: 'circular',
             action: item.action,
             tooltip: item.tooltip,
-            disabled: (_item$disabled = item.disabled) !== null && _item$disabled !== void 0 ? _item$disabled : disabled,
+            disabled: item.disabled ?? disabled,
             children: item.icon
           }, index);
         }
       case 'toggle':
         {
-          var _item$disabled2;
           return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Toggles.ToggleButton, {
             ref: elRefs[index],
             active: item.active,
             onChange: item.onChange,
             defaultState: item.defaultState,
             activeState: item.activeState,
-            disabled: (_item$disabled2 = item.disabled) !== null && _item$disabled2 !== void 0 ? _item$disabled2 : disabled
+            disabled: item.disabled ?? disabled
           }, index);
         }
       case 'dropdown':
         {
-          var _item$disabled3;
           return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Dropdown.DropdownButton, {
             ref: elRefs[index],
             type: 'icon',
@@ -76,14 +73,14 @@ const HorizontalCardActions = exports.HorizontalCardActions = /*#__PURE__*/_reac
             scrollable: item.scrollable,
             pinTopItem: item.pinTopItem,
             maxHeight: item.maxHeight,
-            disabled: (_item$disabled3 = item.disabled) !== null && _item$disabled3 !== void 0 ? _item$disabled3 : disabled
+            disabled: item.disabled ?? disabled
           }, index);
         }
     }
   };
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
-    children: (actions === null || actions === void 0 ? void 0 : actions.length) && /*#__PURE__*/(0, _jsxRuntime.jsx)(Container, {
-      children: actions === null || actions === void 0 ? void 0 : actions.map((item, index) => renderAction(item, index))
+    children: actions?.length && /*#__PURE__*/(0, _jsxRuntime.jsx)(Container, {
+      children: actions?.map((item, index) => renderAction(item, index))
     })
   });
 });

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

@@ -1 +1 @@
-{"version":3,"file":"HorizontalCardActions.cjs","names":["_react","_interopRequireDefault","require","_Button","_Toggles","_Dropdown","_styledComponents","_jsxRuntime","_templateObject","Container","styled","div","_taggedTemplateLiteral2","default","HorizontalCardActions","exports","React","forwardRef","_ref","ref","actions","disabled","elRefs","setElRefs","useState","length","useEffect","Array","fill","map","createRef","useImperativeHandle","renderAction","item","index","componentType","content","_item$disabled","jsx","IconButton","variant","useTransparentBackground","shape","action","tooltip","children","icon","_item$disabled2","ToggleButton","active","onChange","defaultState","activeState","_item$disabled3","DropdownButton","type","items","itemsType","onClick","actionIcon","actionLabel","actionVariant","actionLoading","multiSelect","scrollable","pinTopItem","maxHeight","Fragment"],"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.cjs","names":["_react","_interopRequireDefault","require","_Button","_Toggles","_Dropdown","_styledComponents","_jsxRuntime","Container","styled","div","HorizontalCardActions","exports","React","forwardRef","_ref","ref","actions","disabled","elRefs","setElRefs","useState","length","useEffect","Array","fill","map","createRef","useImperativeHandle","renderAction","item","index","componentType","content","jsx","IconButton","variant","useTransparentBackground","shape","action","tooltip","children","icon","ToggleButton","active","onChange","defaultState","activeState","DropdownButton","type","items","itemsType","onClick","actionIcon","actionLabel","actionVariant","actionLoading","multiSelect","scrollable","pinTopItem","maxHeight","Fragment"],"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 | null>[]>) => {\r\n\r\n  const [elRefs, setElRefs] = React.useState<React.RefObject<HTMLButtonElement | null>[]>([]);\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/HorizontalCardActions.d.ts

@@ -1,5 +1,5 @@
-import React from 'react';
-import { HorizontalCardProps } from './types';
-type Props = Pick<HorizontalCardProps, 'actions' | 'disabled'>;
-export declare const HorizontalCardActions: React.ForwardRefExoticComponent<Props & React.RefAttributes<React.RefObject<HTMLButtonElement>[]>>;
-export {};
+import React from 'react';
+import { HorizontalCardProps } from './types';
+type Props = Pick<HorizontalCardProps, 'actions' | 'disabled'>;
+export declare const HorizontalCardActions: React.ForwardRefExoticComponent<Props & React.RefAttributes<React.RefObject<HTMLButtonElement | null>[]>>;
+export {};

package/dist/Card/HorizontalCard/HorizontalCardActions.js

@@ -1,19 +1,19 @@
-import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
-var _templateObject;
 import React from 'react';
 import { IconButton } from '../../Button';
 import { ToggleButton } from '../../Toggles';
 import { DropdownButton } from '../../Dropdown';
 import styled from 'styled-components';
 import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
-const Container = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n"])));
+const Container = styled.div`
+  display: flex;
+`;
 export const HorizontalCardActions = /*#__PURE__*/React.forwardRef((_ref, ref) => {
   let {
     actions,
     disabled
   } = _ref;
   const [elRefs, setElRefs] = React.useState([]);
-  const length = (actions === null || actions === void 0 ? void 0 : actions.length) || 0;
+  const length = actions?.length || 0;
   React.useEffect(() => {
     setElRefs(Array(length || 0).fill(null).map(() => /*#__PURE__*/React.createRef()));
   }, [length]);
@@ -26,7 +26,6 @@ export const HorizontalCardActions = /*#__PURE__*/React.forwardRef((_ref, ref) =
         }
       case 'icon':
         {
-          var _item$disabled;
           return /*#__PURE__*/_jsx(IconButton, {
             ref: elRefs[index],
             variant: 'secondary',
@@ -34,25 +33,23 @@ export const HorizontalCardActions = /*#__PURE__*/React.forwardRef((_ref, ref) =
             shape: 'circular',
             action: item.action,
             tooltip: item.tooltip,
-            disabled: (_item$disabled = item.disabled) !== null && _item$disabled !== void 0 ? _item$disabled : disabled,
+            disabled: item.disabled ?? disabled,
             children: item.icon
           }, index);
         }
       case 'toggle':
         {
-          var _item$disabled2;
           return /*#__PURE__*/_jsx(ToggleButton, {
             ref: elRefs[index],
             active: item.active,
             onChange: item.onChange,
             defaultState: item.defaultState,
             activeState: item.activeState,
-            disabled: (_item$disabled2 = item.disabled) !== null && _item$disabled2 !== void 0 ? _item$disabled2 : disabled
+            disabled: item.disabled ?? disabled
           }, index);
         }
       case 'dropdown':
         {
-          var _item$disabled3;
           return /*#__PURE__*/_jsx(DropdownButton, {
             ref: elRefs[index],
             type: 'icon',
@@ -69,14 +66,14 @@ export const HorizontalCardActions = /*#__PURE__*/React.forwardRef((_ref, ref) =
             scrollable: item.scrollable,
             pinTopItem: item.pinTopItem,
             maxHeight: item.maxHeight,
-            disabled: (_item$disabled3 = item.disabled) !== null && _item$disabled3 !== void 0 ? _item$disabled3 : disabled
+            disabled: item.disabled ?? disabled
           }, index);
         }
     }
   };
   return /*#__PURE__*/_jsx(_Fragment, {
-    children: (actions === null || actions === void 0 ? void 0 : actions.length) && /*#__PURE__*/_jsx(Container, {
-      children: actions === null || actions === void 0 ? void 0 : actions.map((item, index) => renderAction(item, index))
+    children: actions?.length && /*#__PURE__*/_jsx(Container, {
+      children: actions?.map((item, index) => renderAction(item, index))
     })
   });
 });

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","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":[]}
+{"version":3,"file":"HorizontalCardActions.js","names":["React","IconButton","ToggleButton","DropdownButton","styled","jsx","_jsx","Fragment","_Fragment","Container","div","HorizontalCardActions","forwardRef","_ref","ref","actions","disabled","elRefs","setElRefs","useState","length","useEffect","Array","fill","map","createRef","useImperativeHandle","renderAction","item","index","componentType","content","variant","useTransparentBackground","shape","action","tooltip","children","icon","active","onChange","defaultState","activeState","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 | null>[]>) => {\r\n\r\n  const [elRefs, setElRefs] = React.useState<React.RefObject<HTMLButtonElement | null>[]>([]);\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

@@ -5,18 +5,35 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.HorizontalCardBodyTitle = exports.HorizontalCardBodyTagsContainer = exports.HorizontalCardBodyDescription = exports.HorizontalCardBodyContainer = exports.HorizontalCardBody = void 0;
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var _react = _interopRequireDefault(require("react"));
 var _styledComponents = _interopRequireDefault(require("styled-components"));
 var _styles = require("../../styles");
 var _LinearProgress = require("../../LinearProgress");
 var _Tag = require("../../Tag");
 var _jsxRuntime = require("react/jsx-runtime");
-var _templateObject, _templateObject2, _templateObject3, _templateObject4;
-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 HorizontalCardBodyContainer = exports.HorizontalCardBodyContainer = _styledComponents.default.div`
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+  gap: 8px;
+  padding: 16px;
+`;
+const HorizontalCardBodyTitle = exports.HorizontalCardBodyTitle = _styledComponents.default.div`
+  ${props => (0, _styles.ComponentMStyling)(_styles.ComponentTextStyle.Bold, _styles.COLORS.getColor('black', props.theme))}
+  .disabled & {
+    color: ${props => _styles.COLORS.getColor('neutral_500', props.theme)};
+  }
+`;
+const HorizontalCardBodyDescription = exports.HorizontalCardBodyDescription = _styledComponents.default.div`
+  ${props => (0, _styles.ComponentXSStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.getColor('neutral_600', props.theme))}
+`;
+const HorizontalCardBodyTagsContainer = exports.HorizontalCardBodyTagsContainer = _styledComponents.default.div`
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+  padding: 4px 0;
+  gap: 4px;
+`;
 const HorizontalCardBody = _ref => {
   let {
     title,

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","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":[]}
+{"version":3,"file":"HorizontalCardBody.cjs","names":["_react","_interopRequireDefault","require","_styledComponents","_styles","_LinearProgress","_Tag","_jsxRuntime","HorizontalCardBodyContainer","exports","styled","div","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;AAEvB,MAAMM,2BAA2B,GAAAC,OAAA,CAAAD,2BAAA,GAAGE,yBAAM,CAACC,GAAG;AACrD;AACA;AACA;AACA;AACA;AACA,CAAC;AAEM,MAAMC,uBAAuB,GAAAH,OAAA,CAAAG,uBAAA,GAAGF,yBAAM,CAACC,GAAG;AACjD,IAAIE,KAAK,IAAI,IAAAC,yBAAiB,EAACC,0BAAkB,CAACC,IAAI,EAAEC,cAAM,CAACC,QAAQ,CAAC,OAAO,EAAEL,KAAK,CAACM,KAAK,CAAC,CAAC;AAC9F;AACA,aAAaN,KAAK,IAAII,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEL,KAAK,CAACM,KAAK,CAAC;AACjE;AACA,CAAC;AAEM,MAAMC,6BAA6B,GAAAX,OAAA,CAAAW,6BAAA,GAAGV,yBAAM,CAACC,GAAG;AACvD,IAAIE,KAAK,IAAI,IAAAQ,0BAAkB,EAACN,0BAAkB,CAACO,OAAO,EAAEL,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEL,KAAK,CAACM,KAAK,CAAC,CAAC;AACxG,CAAC;AAEM,MAAMI,+BAA+B,GAAAd,OAAA,CAAAc,+BAAA,GAAGb,yBAAM,CAACC,GAAG;AACzD;AACA;AACA;AACA;AACA;AACA,CAAC;AAIM,MAAMa,kBAAkD,GAAGC,IAAA,IAKO;EAAA,IALN;IACEC,KAAK;IACLC,WAAW;IACXC,QAAQ;IACRC;EACF,CAAC,GAAAJ,IAAA;EAElE,oBACE,IAAAlB,WAAA,CAAAuB,IAAA,EAACtB,2BAA2B;IAAAuB,QAAA,gBAC1B,IAAAxB,WAAA,CAAAyB,GAAA,EAACpB,uBAAuB;MAAAmB,QAAA,EAAEL;IAAK,CAA0B,CAAC,EACzDC,WAAW,iBAAI,IAAApB,WAAA,CAAAyB,GAAA,EAACZ,6BAA6B;MAAAW,QAAA,EAAEJ;IAAW,CAAgC,CAAC,EAE1FE,IAAI,iBACJ,IAAAtB,WAAA,CAAAyB,GAAA,EAACT,+BAA+B;MAAAQ,QAAA,EAAEF,IAAI,CAACI,GAAG,CAAC,CAACC,GAAG,EAAEC,KAAK,kBACpD,IAAA5B,WAAA,CAAAyB,GAAA,EAAC1B,IAAA,CAAA8B,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,IAAArB,WAAA,CAAAyB,GAAA,EAAC3B,eAAA,CAAAmC,cAAc;MAACC,KAAK,EAAEb,QAAQ,CAACa,KAAM;MAACC,GAAG,EAAEd,QAAQ,CAACc;IAAI,CAAC,CAAC;EAAA,CAC7C,CAAC;AAElC,CAAC;AAACjC,OAAA,CAAAe,kBAAA,GAAAA,kBAAA","ignoreList":[]}

package/dist/Card/HorizontalCard/HorizontalCardBody.d.ts

@@ -1,9 +1,9 @@
-import React from 'react';
-import { HorizontalCardProps } from './types';
-export declare const HorizontalCardBodyContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const HorizontalCardBodyTitle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const HorizontalCardBodyDescription: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const HorizontalCardBodyTagsContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-type Props = Pick<HorizontalCardProps, 'title' | 'description' | 'progress' | 'tags'>;
-export declare const HorizontalCardBody: React.FunctionComponent<Props>;
-export {};
+import React from 'react';
+import { HorizontalCardProps } from './types';
+export declare const HorizontalCardBodyContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const HorizontalCardBodyTitle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const HorizontalCardBodyDescription: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const HorizontalCardBodyTagsContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+type Props = Pick<HorizontalCardProps, 'title' | 'description' | 'progress' | 'tags'>;
+export declare const HorizontalCardBody: React.FunctionComponent<Props>;
+export {};

package/dist/Card/HorizontalCard/HorizontalCardBody.js

@@ -1,15 +1,32 @@
-import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
-var _templateObject, _templateObject2, _templateObject3, _templateObject4;
 import React from 'react';
 import styled from 'styled-components';
 import { COLORS, ComponentMStyling, ComponentTextStyle, ComponentXSStyling } from '../../styles';
 import { LinearProgress } from '../../LinearProgress';
 import { Tag } from '../../Tag';
 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 HorizontalCardBodyContainer = styled.div`
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+  gap: 8px;
+  padding: 16px;
+`;
+export const HorizontalCardBodyTitle = styled.div`
+  ${props => ComponentMStyling(ComponentTextStyle.Bold, COLORS.getColor('black', props.theme))}
+  .disabled & {
+    color: ${props => COLORS.getColor('neutral_500', props.theme)};
+  }
+`;
+export const HorizontalCardBodyDescription = styled.div`
+  ${props => ComponentXSStyling(ComponentTextStyle.Regular, COLORS.getColor('neutral_600', props.theme))}
+`;
+export const HorizontalCardBodyTagsContainer = styled.div`
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+  padding: 4px 0;
+  gap: 4px;
+`;
 export const HorizontalCardBody = _ref => {
   let {
     title,

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,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":[]}
+{"version":3,"file":"HorizontalCardBody.js","names":["React","styled","COLORS","ComponentMStyling","ComponentTextStyle","ComponentXSStyling","LinearProgress","Tag","jsx","_jsx","jsxs","_jsxs","HorizontalCardBodyContainer","div","HorizontalCardBodyTitle","props","Bold","getColor","theme","HorizontalCardBodyDescription","Regular","HorizontalCardBodyTagsContainer","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;AACrD;AACA;AACA;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAMC,uBAAuB,GAAGb,MAAM,CAACY,GAAG;AACjD,IAAIE,KAAK,IAAIZ,iBAAiB,CAACC,kBAAkB,CAACY,IAAI,EAAEd,MAAM,CAACe,QAAQ,CAAC,OAAO,EAAEF,KAAK,CAACG,KAAK,CAAC,CAAC;AAC9F;AACA,aAAaH,KAAK,IAAIb,MAAM,CAACe,QAAQ,CAAC,aAAa,EAAEF,KAAK,CAACG,KAAK,CAAC;AACjE;AACA,CAAC;AAED,OAAO,MAAMC,6BAA6B,GAAGlB,MAAM,CAACY,GAAG;AACvD,IAAIE,KAAK,IAAIV,kBAAkB,CAACD,kBAAkB,CAACgB,OAAO,EAAElB,MAAM,CAACe,QAAQ,CAAC,aAAa,EAAEF,KAAK,CAACG,KAAK,CAAC,CAAC;AACxG,CAAC;AAED,OAAO,MAAMG,+BAA+B,GAAGpB,MAAM,CAACY,GAAG;AACzD;AACA;AACA;AACA;AACA;AACA,CAAC;AAID,OAAO,MAAMS,kBAAkD,GAAGC,IAAA,IAKO;EAAA,IALN;IACEC,KAAK;IACLC,WAAW;IACXC,QAAQ;IACRC;EACF,CAAC,GAAAJ,IAAA;EAElE,oBACEZ,KAAA,CAACC,2BAA2B;IAAAgB,QAAA,gBAC1BnB,IAAA,CAACK,uBAAuB;MAAAc,QAAA,EAAEJ;IAAK,CAA0B,CAAC,EACzDC,WAAW,iBAAIhB,IAAA,CAACU,6BAA6B;MAAAS,QAAA,EAAEH;IAAW,CAAgC,CAAC,EAE1FE,IAAI,iBACJlB,IAAA,CAACY,+BAA+B;MAAAO,QAAA,EAAED,IAAI,CAACE,GAAG,CAAC,CAACC,GAAG,EAAEC,KAAK,kBACpDtB,IAAA,CAACF,GAAG;QAAayB,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,iBAAIjB,IAAA,CAACH,cAAc;MAAC6B,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

@@ -5,17 +5,47 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.HorizontalCardThumbnail = exports.HorizontalCardImageContainer = exports.HorizontalCardIconContainer = void 0;
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var _react = _interopRequireDefault(require("react"));
 var _styledComponents = _interopRequireDefault(require("styled-components"));
 var _styles = require("../../styles");
 var _Image = require("../../Image");
 var _jsxRuntime = require("react/jsx-runtime");
-var _templateObject, _templateObject2;
-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 HorizontalCardIconContainer = exports.HorizontalCardIconContainer = _styledComponents.default.div`
+  display: flex;
+  justify-content: flex-end;
+  align-items: center;
+  width: 64px;
+  height: 80px;
+
+  color: ${props => _styles.COLORS.getColor('black', props.theme)};
+
+  .disabled & {
+    color: ${props => _styles.COLORS.getColor('neutral_500', props.theme)};
+  }
+`;
+const HorizontalCardImageContainer = exports.HorizontalCardImageContainer = _styledComponents.default.div`
+  height: 100%;
+  overflow: hidden;
+  border-bottom-left-radius: 8px;
+  border-top-left-radius: 8px;
+  width: 120px;
+
+  img {
+    mix-blend-mode: multiply;
+    object-fit: cover;
+    width: 100%;
+    height: 100%;
+
+  }
+
+  .disabled & {
+    img {
+      filter: grayscale(100%);
+    }
+  }
+
+`;
 const HorizontalCardThumbnail = _ref => {
-  var _image$fallbackSrc, _image$loader;
   let {
     image,
     icon
@@ -28,10 +58,10 @@ const HorizontalCardThumbnail = _ref => {
       })
     }), image && /*#__PURE__*/(0, _jsxRuntime.jsx)(HorizontalCardImageContainer, {
       children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Image.ImageWithFallbacks, {
-        fallbacks: (_image$fallbackSrc = image.fallbackSrc) !== null && _image$fallbackSrc !== void 0 ? _image$fallbackSrc : '',
+        fallbacks: image.fallbackSrc ?? '',
         src: image.src,
         alt: image.alt,
-        loader: (_image$loader = image.loader) !== null && _image$loader !== void 0 ? _image$loader : false,
+        loader: image.loader ?? false,
         width: image.width,
         height: image.height
       })

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","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":[]}
+{"version":3,"file":"HorizontalCardThumbnail.cjs","names":["_react","_interopRequireDefault","require","_styledComponents","_styles","_Image","_jsxRuntime","HorizontalCardIconContainer","exports","styled","div","props","COLORS","getColor","theme","HorizontalCardImageContainer","HorizontalCardThumbnail","_ref","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;AAExC,MAAMK,2BAA2B,GAAAC,OAAA,CAAAD,2BAAA,GAAGE,yBAAM,CAACC,GAAG;AACrD;AACA;AACA;AACA;AACA;AACA;AACA,WAAWC,KAAK,IAAIC,cAAM,CAACC,QAAQ,CAAC,OAAO,EAAEF,KAAK,CAACG,KAAK,CAAC;AACzD;AACA;AACA,aAAaH,KAAK,IAAIC,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEF,KAAK,CAACG,KAAK,CAAC;AACjE;AACA,CAAC;AAGM,MAAMC,4BAA4B,GAAAP,OAAA,CAAAO,4BAAA,GAAGN,yBAAM,CAACC,GAAG;AACtD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAIM,MAAMM,uBAAuD,GAAGC,IAAA,IAGO;EAAA,IAHN;IACEC,KAAK;IACLC;EACF,CAAC,GAAAF,IAAA;EAEvE,oBACE,IAAAX,WAAA,CAAAc,IAAA,EAAAd,WAAA,CAAAe,QAAA;IAAAC,QAAA,GAEIH,IAAI,iBACF,IAAAb,WAAA,CAAAiB,GAAA,EAAChB,2BAA2B;MAAAe,QAAA,eACzBE,cAAK,CAACC,YAAY,CAACN,IAAI,EAAE;QAACO,KAAK,EAAE,EAAE;QAAEC,MAAM,EAAE;MAAE,CAAC;IAAC,CACvB,CAAC,EAGhCT,KAAK,iBACH,IAAAZ,WAAA,CAAAiB,GAAA,EAACR,4BAA4B;MAAAO,QAAA,eACzB,IAAAhB,WAAA,CAAAiB,GAAA,EAAClB,MAAA,CAAAuB,kBAAkB;QAACC,SAAS,EAAEX,KAAK,CAACY,WAAW,IAAI,EAAG;QAACC,GAAG,EAAEb,KAAK,CAACa,GAAI;QAACC,GAAG,EAAEd,KAAK,CAACc,GAAI;QACnEC,MAAM,EAAEf,KAAK,CAACe,MAAM,IAAI,KAAM;QAACP,KAAK,EAAER,KAAK,CAACQ,KAAM;QAACC,MAAM,EAAET,KAAK,CAACS;MAAO,CAAC;IAAC,CACpE,CAAC;EAAA,CAEnC,CAAC;AAEP,CAAC;AAACnB,OAAA,CAAAQ,uBAAA,GAAAA,uBAAA","ignoreList":[]}

package/dist/Card/HorizontalCard/HorizontalCardThumbnail.d.ts

@@ -1,7 +1,7 @@
-import React from 'react';
-import { HorizontalCardProps } from './types';
-export declare const HorizontalCardIconContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const HorizontalCardImageContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-type Props = Pick<HorizontalCardProps, 'image' | 'icon'>;
-export declare const HorizontalCardThumbnail: React.FunctionComponent<Props>;
-export {};
+import React from 'react';
+import { HorizontalCardProps } from './types';
+export declare const HorizontalCardIconContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const HorizontalCardImageContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+type Props = Pick<HorizontalCardProps, 'image' | 'icon'>;
+export declare const HorizontalCardThumbnail: React.FunctionComponent<Props>;
+export {};