@popsure/dirty-swan 0.33.4 → 0.34.0

package/dist/esm/components/cards/cardButton/index.js

@@ -1,6 +1,6 @@
 import '../../../tslib.es6-5bc94358.js';
 import 'react/jsx-runtime';
 import 'react';
-export { C as default } from '../../../index-47663d39.js';
+export { C as CardButton } from '../../../index-47663d39.js';
 import '../../../style-inject.es-1f59c1d0.js';
 //# sourceMappingURL=index.js.map

package/dist/esm/components/cards/cardButton/index.stories.js

@@ -0,0 +1,49 @@
+import { jsx } from 'react/jsx-runtime';
+import { C as CardButton } from '../../../index-47663d39.js';
+import '../../../tslib.es6-5bc94358.js';
+import 'react';
+import '../../../style-inject.es-1f59c1d0.js';
+
+var story = {
+    title: 'JSX/Cards/CardButton',
+    component: CardButton,
+    argTypes: {
+        title: {
+            defaultValue: 'Risky Sports',
+            description: 'Title text that needs to be displayed',
+        },
+        description: {
+            defaultValue: 'Mountain or rock climbing, Bouldering, Martial arts, Extreme sports, Scuba diving, Sky diving, Bungee jumping, Mountain or rock climbing, Bouldering, Martial arts,',
+            description: 'Description text that is displayed under title',
+        },
+        disabled: {
+            defaultValue: false,
+            description: 'Disabled state of the button',
+        },
+        className: {
+            defaultValue: '',
+            description: 'Class name for most top parent element',
+        },
+        onClick: {
+            description: 'Function that runs on click of the button',
+            action: true,
+            table: {
+                category: 'Callbacks',
+            },
+        },
+        href: {
+            defaultValue: '',
+            description: 'Redirect URL on click of the button',
+        },
+    },
+};
+var CardButtonStory = function (_a) {
+    var title = _a.title, description = _a.description, disabled = _a.disabled, className = _a.className, href = _a.href, onClick = _a.onClick;
+    var handleOnClick = function (e) { return onClick === null || onClick === void 0 ? void 0 : onClick(e); };
+    return (jsx(CardButton, { title: title, description: description, disabled: disabled, className: className, href: href, onClick: handleOnClick }, void 0));
+};
+CardButtonStory.storyName = "CardButton";
+
+export default story;
+export { CardButtonStory };
+//# sourceMappingURL=index.stories.js.map

package/dist/esm/components/cards/cardButton/index.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.stories.js","sources":["../../../../../../src/lib/components/cards/cardButton/index.stories.tsx"],"sourcesContent":["import { FormEvent } from 'react';\nimport { CardButton, CardButtonProps } from '.';\n\nconst story = {\n  title: 'JSX/Cards/CardButton',\n  component: CardButton,\n  argTypes: {\n    title: {\n      defaultValue: 'Risky Sports',\n      description: 'Title text that needs to be displayed',\n    },\n    description: {\n      defaultValue: 'Mountain or rock climbing, Bouldering, Martial arts, Extreme sports, Scuba diving, Sky diving, Bungee jumping, Mountain or rock climbing, Bouldering, Martial arts,',\n      description: 'Description text that is displayed under title',\n    },\n    disabled: {\n      defaultValue: false,\n      description: 'Disabled state of the button',\n    },\n    className: {\n      defaultValue: '',\n      description: 'Class name for most top parent element',\n    },\n    onClick: {\n      description: 'Function that runs on click of the button',\n      action: true,\n      table: {\n        category: 'Callbacks',\n      },\n    },\n    href: {\n      defaultValue: '',\n      description: 'Redirect URL on click of the button',\n    },\n  },\n};\n\nexport const CardButtonStory = ({\n  title,\n  description,\n  disabled,\n  className,\n  href,\n  onClick,\n}: CardButtonProps) => {\n  const handleOnClick = (e: FormEvent) => onClick?.(e);\n  return (\n    <CardButton\n      title={title}\n      description={description}\n      disabled={disabled}\n      className={className}\n      href={href}\n      onClick={handleOnClick}\n    />\n  );\n}\n\nCardButtonStory.storyName = \"CardButton\";\n\nexport default story;\n"],"names":["_jsx"],"mappings":";;;;;;IAGM,KAAK,GAAG;IACZ,KAAK,EAAE,sBAAsB;IAC7B,SAAS,EAAE,UAAU;IACrB,QAAQ,EAAE;QACR,KAAK,EAAE;YACL,YAAY,EAAE,cAAc;YAC5B,WAAW,EAAE,uCAAuC;SACrD;QACD,WAAW,EAAE;YACX,YAAY,EAAE,qKAAqK;YACnL,WAAW,EAAE,gDAAgD;SAC9D;QACD,QAAQ,EAAE;YACR,YAAY,EAAE,KAAK;YACnB,WAAW,EAAE,8BAA8B;SAC5C;QACD,SAAS,EAAE;YACT,YAAY,EAAE,EAAE;YAChB,WAAW,EAAE,wCAAwC;SACtD;QACD,OAAO,EAAE;YACP,WAAW,EAAE,2CAA2C;YACxD,MAAM,EAAE,IAAI;YACZ,KAAK,EAAE;gBACL,QAAQ,EAAE,WAAW;aACtB;SACF;QACD,IAAI,EAAE;YACJ,YAAY,EAAE,EAAE;YAChB,WAAW,EAAE,qCAAqC;SACnD;KACF;EACD;IAEW,eAAe,GAAG,UAAC,EAOd;QANhB,KAAK,WAAA,EACL,WAAW,iBAAA,EACX,QAAQ,cAAA,EACR,SAAS,eAAA,EACT,IAAI,UAAA,EACJ,OAAO,aAAA;IAEP,IAAM,aAAa,GAAG,UAAC,CAAY,IAAK,OAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAG,CAAC,CAAC,GAAA,CAAC;IACrD,QACEA,IAAC,UAAU,IACT,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,SAAS,EACpB,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,aAAa,WACtB,EACF;AACJ,EAAC;AAED,eAAe,CAAC,SAAS,GAAG,YAAY;;;;;"}

package/dist/esm/components/cards/cardWithLeftIcon/index.js

@@ -1,6 +1,6 @@
 import '../../../tslib.es6-5bc94358.js';
 import 'react/jsx-runtime';
-export { CardWithLeftIcon as default } from '../index.js';
+export { CardWithLeftIcon } from '../index.js';
 import '../../../index-47663d39.js';
 import '../../../style-inject.es-1f59c1d0.js';
 import 'react';

package/dist/esm/components/cards/cardWithLeftIcon/index.stories.js

@@ -0,0 +1,64 @@
+import { _ as __assign } from '../../../tslib.es6-5bc94358.js';
+import { jsx } from 'react/jsx-runtime';
+import { CardWithLeftIcon } from '../index.js';
+import { i as images } from '../../../index-31224f74.js';
+import '../../../index-47663d39.js';
+import 'react';
+import '../../../style-inject.es-1f59c1d0.js';
+
+var story = {
+    title: 'JSX/Cards/CardWithLeftIcon',
+    component: CardWithLeftIcon,
+    argTypes: {
+        title: {
+            defaultValue: 'Lorem Ipsum',
+            description: 'Title text that needs to be displayed',
+        },
+        children: {
+            type: 'text',
+            defaultValue: 'Mountain or rock climbing, Bouldering, Martial arts, Extreme sports, Scuba diving, Sky diving, Bungee jumping, Mountain or rock climbing, Bouldering, Martial arts,',
+            description: 'Content that is displayed inside the card',
+        },
+        state: {
+            defaultValue: 'actionable',
+            description: 'State that describe the interation with the card',
+        },
+        leftIcon: {
+            defaultValue: {
+                src: images.mortgage,
+                alt: 'Image alt'
+            },
+            description: 'Icon displayed on the left of the card.',
+        },
+        rightIcon: {
+            defaultValue: {
+                src: images.washingMachine,
+                alt: 'Icon alt'
+            },
+            description: 'Icon displayed on the top right corner of the card',
+        },
+        cardSize: {
+            control: { type: 'select' },
+            defaultValue: 'medium',
+            description: 'Size of the card'
+        },
+        dropshadow: {
+            defaultValue: true,
+            description: 'If the card should have a box-shadow or not',
+        },
+        className: {
+            defaultValue: '',
+            type: 'text',
+            description: 'Class name for most top parent element',
+        },
+    },
+};
+var CardWithLeftIconStory = function (_a) {
+    var title = _a.title, dropshadow = _a.dropshadow, children = _a.children, className = _a.className, cardSize = _a.cardSize, leftIcon = _a.leftIcon, rightIcon = _a.rightIcon, state = _a.state;
+    return (jsx(CardWithLeftIcon, __assign({ cardSize: cardSize, className: className, dropshadow: dropshadow, state: state, leftIcon: leftIcon, rightIcon: rightIcon, title: title }, { children: children }), void 0));
+};
+CardWithLeftIconStory.storyName = "CardWithLeftIcon";
+
+export default story;
+export { CardWithLeftIconStory };
+//# sourceMappingURL=index.stories.js.map

package/dist/esm/components/cards/cardWithLeftIcon/index.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.stories.js","sources":["../../../../../../src/lib/components/cards/cardWithLeftIcon/index.stories.tsx"],"sourcesContent":["import { CardWithLeftIcon, CardWithLeftIconProps } from '.';\nimport { images } from '../../../util/images';\n\nconst story = {\n  title: 'JSX/Cards/CardWithLeftIcon',\n  component: CardWithLeftIcon,\n  argTypes: {\n    title: {\n      defaultValue: 'Lorem Ipsum',\n      description: 'Title text that needs to be displayed',\n    },\n    children: {\n      type: 'text',\n      defaultValue: 'Mountain or rock climbing, Bouldering, Martial arts, Extreme sports, Scuba diving, Sky diving, Bungee jumping, Mountain or rock climbing, Bouldering, Martial arts,',\n      description: 'Content that is displayed inside the card',\n    },\n    state: {\n      defaultValue: 'actionable',\n      description: 'State that describe the interation with the card',\n    },\n    leftIcon: {\n      defaultValue: {\n        src: images.mortgage,\n        alt: 'Image alt'\n      },\n      description: 'Icon displayed on the left of the card.',\n    },\n    rightIcon: {\n      defaultValue: {\n        src: images.washingMachine,\n        alt: 'Icon alt'\n      },\n      description: 'Icon displayed on the top right corner of the card',\n    },\n    cardSize: {\n      control: { type: 'select' },\n      defaultValue: 'medium',\n      description: 'Size of the card'\n    },\n    dropshadow: {\n      defaultValue: true,\n      description: 'If the card should have a box-shadow or not',\n    },\n    className: {\n      defaultValue: '',\n      type: 'text',\n      description: 'Class name for most top parent element',\n    },\n  },\n};\n\nexport const CardWithLeftIconStory = ({\n  title,\n  dropshadow,\n  children,\n  className,\n  cardSize,\n  leftIcon,\n  rightIcon,\n  state,\n}: CardWithLeftIconProps) => {\n  return (\n    <CardWithLeftIcon\n      cardSize={cardSize}\n      className={className}\n      dropshadow={dropshadow}\n      state={state}\n      leftIcon={leftIcon}\n      rightIcon={rightIcon}\n      title={title}\n    >\n      {children}\n    </CardWithLeftIcon>\n  );\n}\n\nCardWithLeftIconStory.storyName = \"CardWithLeftIcon\";\n\nexport default story;\n"],"names":["_jsx"],"mappings":";;;;;;;;IAGM,KAAK,GAAG;IACZ,KAAK,EAAE,4BAA4B;IACnC,SAAS,EAAE,gBAAgB;IAC3B,QAAQ,EAAE;QACR,KAAK,EAAE;YACL,YAAY,EAAE,aAAa;YAC3B,WAAW,EAAE,uCAAuC;SACrD;QACD,QAAQ,EAAE;YACR,IAAI,EAAE,MAAM;YACZ,YAAY,EAAE,qKAAqK;YACnL,WAAW,EAAE,2CAA2C;SACzD;QACD,KAAK,EAAE;YACL,YAAY,EAAE,YAAY;YAC1B,WAAW,EAAE,kDAAkD;SAChE;QACD,QAAQ,EAAE;YACR,YAAY,EAAE;gBACZ,GAAG,EAAE,MAAM,CAAC,QAAQ;gBACpB,GAAG,EAAE,WAAW;aACjB;YACD,WAAW,EAAE,yCAAyC;SACvD;QACD,SAAS,EAAE;YACT,YAAY,EAAE;gBACZ,GAAG,EAAE,MAAM,CAAC,cAAc;gBAC1B,GAAG,EAAE,UAAU;aAChB;YACD,WAAW,EAAE,oDAAoD;SAClE;QACD,QAAQ,EAAE;YACR,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE;YAC3B,YAAY,EAAE,QAAQ;YACtB,WAAW,EAAE,kBAAkB;SAChC;QACD,UAAU,EAAE;YACV,YAAY,EAAE,IAAI;YAClB,WAAW,EAAE,6CAA6C;SAC3D;QACD,SAAS,EAAE;YACT,YAAY,EAAE,EAAE;YAChB,IAAI,EAAE,MAAM;YACZ,WAAW,EAAE,wCAAwC;SACtD;KACF;EACD;IAEW,qBAAqB,GAAG,UAAC,EASd;QARtB,KAAK,WAAA,EACL,UAAU,gBAAA,EACV,QAAQ,cAAA,EACR,SAAS,eAAA,EACT,QAAQ,cAAA,EACR,QAAQ,cAAA,EACR,SAAS,eAAA,EACT,KAAK,WAAA;IAEL,QACEA,IAAC,gBAAgB,aACf,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,SAAS,EACpB,UAAU,EAAE,UAAU,EACtB,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,gBAEX,QAAQ,YACQ,EACnB;AACJ,EAAC;AAED,qBAAqB,CAAC,SAAS,GAAG,kBAAkB;;;;;"}

package/dist/esm/components/cards/cardWithTopIcon/index.js

@@ -1,6 +1,6 @@
 import '../../../tslib.es6-5bc94358.js';
 import 'react/jsx-runtime';
-export { CardWithTopIcon as default } from '../index.js';
+export { CardWithTopIcon } from '../index.js';
 import '../../../index-47663d39.js';
 import '../../../style-inject.es-1f59c1d0.js';
 import 'react';

package/dist/esm/components/cards/cardWithTopIcon/index.stories.js

@@ -0,0 +1,68 @@
+import { _ as __assign } from '../../../tslib.es6-5bc94358.js';
+import { jsx } from 'react/jsx-runtime';
+import { CardWithTopIcon } from '../index.js';
+import { i as images } from '../../../index-31224f74.js';
+import '../../../index-47663d39.js';
+import 'react';
+import '../../../style-inject.es-1f59c1d0.js';
+
+var story = {
+    title: 'JSX/Cards/CardWithTopIcon',
+    component: CardWithTopIcon,
+    argTypes: {
+        title: {
+            defaultValue: 'Lorem Ipsum',
+            description: 'Title text that needs to be displayed',
+        },
+        children: {
+            type: 'text',
+            defaultValue: 'Mountain or rock climbing, Bouldering, Martial arts, Extreme sports, Scuba diving, Sky diving, Bungee jumping, Mountain or rock climbing, Bouldering, Martial arts,',
+            description: 'Content that is displayed inside the card',
+        },
+        state: {
+            defaultValue: 'actionable',
+            description: 'State that describe the interation with the card',
+        },
+        topIcon: {
+            defaultValue: {
+                src: images.mortgage,
+                alt: 'Image alt'
+            },
+            description: 'Icon displayed on the top of the card.',
+        },
+        topIconSize: {
+            defaultValue: {
+                width: 48,
+                height: 48
+            },
+            description: 'Size of the top icon',
+        },
+        rightIcon: {
+            defaultValue: 'arrow',
+            description: 'Icon displayed on the top right corner of the card',
+        },
+        cardSize: {
+            control: { type: 'select' },
+            defaultValue: 'medium',
+            description: 'Size of the card'
+        },
+        dropshadow: {
+            defaultValue: true,
+            description: 'If the card should have a box-shadow or not',
+        },
+        className: {
+            defaultValue: 'ws6',
+            type: 'text',
+            description: 'Class name for most top parent element',
+        },
+    },
+};
+var CardWithTopIconStory = function (_a) {
+    var title = _a.title, dropshadow = _a.dropshadow, cardSize = _a.cardSize, children = _a.children, className = _a.className, topIcon = _a.topIcon, topIconSize = _a.topIconSize, rightIcon = _a.rightIcon, state = _a.state;
+    return (jsx(CardWithTopIcon, __assign({ cardSize: cardSize, className: className, dropshadow: dropshadow, state: state, topIcon: topIcon, topIconSize: topIconSize, rightIcon: rightIcon, title: title }, { children: jsx("p", __assign({ className: "p-p mt16 tc-grey-600" }, { children: children }), void 0) }), void 0));
+};
+CardWithTopIconStory.storyName = "CardWithTopIcon";
+
+export default story;
+export { CardWithTopIconStory };
+//# sourceMappingURL=index.stories.js.map

package/dist/esm/components/cards/cardWithTopIcon/index.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.stories.js","sources":["../../../../../../src/lib/components/cards/cardWithTopIcon/index.stories.tsx"],"sourcesContent":["import { CardWithTopIcon, CardWithTopIconProps } from '.';\nimport { images } from '../../../util/images';\n\nconst story = {\n  title: 'JSX/Cards/CardWithTopIcon',\n  component: CardWithTopIcon,\n  argTypes: {\n    title: {\n      defaultValue: 'Lorem Ipsum',\n      description: 'Title text that needs to be displayed',\n    },\n    children: {\n      type: 'text',\n      defaultValue: 'Mountain or rock climbing, Bouldering, Martial arts, Extreme sports, Scuba diving, Sky diving, Bungee jumping, Mountain or rock climbing, Bouldering, Martial arts,',\n      description: 'Content that is displayed inside the card',\n    },\n    state: {\n      defaultValue: 'actionable',\n      description: 'State that describe the interation with the card',\n    },\n    topIcon: {\n      defaultValue: {\n        src: images.mortgage,\n        alt: 'Image alt'\n      },\n      description: 'Icon displayed on the top of the card.',\n    },\n    topIconSize: {\n      defaultValue: {\n        width: 48,\n        height: 48\n      },\n      description: 'Size of the top icon',\n    },\n    rightIcon: {\n      defaultValue: 'arrow',\n      description: 'Icon displayed on the top right corner of the card',\n    },\n    cardSize: {\n      control: { type: 'select' },\n      defaultValue: 'medium',\n      description: 'Size of the card'\n    },\n    dropshadow: {\n      defaultValue: true,\n      description: 'If the card should have a box-shadow or not',\n    },\n    className: {\n      defaultValue: 'ws6',\n      type: 'text',\n      description: 'Class name for most top parent element',\n    },\n  },\n};\n\nexport const CardWithTopIconStory = ({\n  title,\n  dropshadow,\n  cardSize,\n  children,\n  className,\n  topIcon,\n  topIconSize,\n  rightIcon,\n  state,\n}: CardWithTopIconProps) => (\n  <CardWithTopIcon\n    cardSize={cardSize}\n    className={className}\n    dropshadow={dropshadow}\n    state={state}\n    topIcon={topIcon}\n    topIconSize={topIconSize}\n    rightIcon={rightIcon}\n    title={title}\n  >\n    <p className=\"p-p mt16 tc-grey-600\">\n      {children}\n    </p>\n  </CardWithTopIcon>\n);\n\nCardWithTopIconStory.storyName = \"CardWithTopIcon\";\n\nexport default story;\n"],"names":["_jsx"],"mappings":";;;;;;;;IAGM,KAAK,GAAG;IACZ,KAAK,EAAE,2BAA2B;IAClC,SAAS,EAAE,eAAe;IAC1B,QAAQ,EAAE;QACR,KAAK,EAAE;YACL,YAAY,EAAE,aAAa;YAC3B,WAAW,EAAE,uCAAuC;SACrD;QACD,QAAQ,EAAE;YACR,IAAI,EAAE,MAAM;YACZ,YAAY,EAAE,qKAAqK;YACnL,WAAW,EAAE,2CAA2C;SACzD;QACD,KAAK,EAAE;YACL,YAAY,EAAE,YAAY;YAC1B,WAAW,EAAE,kDAAkD;SAChE;QACD,OAAO,EAAE;YACP,YAAY,EAAE;gBACZ,GAAG,EAAE,MAAM,CAAC,QAAQ;gBACpB,GAAG,EAAE,WAAW;aACjB;YACD,WAAW,EAAE,wCAAwC;SACtD;QACD,WAAW,EAAE;YACX,YAAY,EAAE;gBACZ,KAAK,EAAE,EAAE;gBACT,MAAM,EAAE,EAAE;aACX;YACD,WAAW,EAAE,sBAAsB;SACpC;QACD,SAAS,EAAE;YACT,YAAY,EAAE,OAAO;YACrB,WAAW,EAAE,oDAAoD;SAClE;QACD,QAAQ,EAAE;YACR,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE;YAC3B,YAAY,EAAE,QAAQ;YACtB,WAAW,EAAE,kBAAkB;SAChC;QACD,UAAU,EAAE;YACV,YAAY,EAAE,IAAI;YAClB,WAAW,EAAE,6CAA6C;SAC3D;QACD,SAAS,EAAE;YACT,YAAY,EAAE,KAAK;YACnB,IAAI,EAAE,MAAM;YACZ,WAAW,EAAE,wCAAwC;SACtD;KACF;EACD;IAEW,oBAAoB,GAAG,UAAC,EAUd;QATrB,KAAK,WAAA,EACL,UAAU,gBAAA,EACV,QAAQ,cAAA,EACR,QAAQ,cAAA,EACR,SAAS,eAAA,EACT,OAAO,aAAA,EACP,WAAW,iBAAA,EACX,SAAS,eAAA,EACT,KAAK,WAAA;IACqB,QAC1BA,IAAC,eAAe,aACd,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,SAAS,EACpB,UAAU,EAAE,UAAU,EACtB,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,OAAO,EAChB,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,gBAEZA,oBAAG,SAAS,EAAC,sBAAsB,gBAChC,QAAQ,YACP,YACY;AAdQ,EAe1B;AAEF,oBAAoB,CAAC,SAAS,GAAG,iBAAiB;;;;;"}

package/dist/esm/components/cards/cardWithTopLeftIcon/index.js

@@ -1,6 +1,6 @@
 import '../../../tslib.es6-5bc94358.js';
 import 'react/jsx-runtime';
-export { CardWithTopLeftIcon as default } from '../index.js';
+export { CardWithTopLeftIcon } from '../index.js';
 import '../../../index-47663d39.js';
 import '../../../style-inject.es-1f59c1d0.js';
 import 'react';

package/dist/esm/components/cards/cardWithTopLeftIcon/index.stories.js

@@ -0,0 +1,57 @@
+import { _ as __assign } from '../../../tslib.es6-5bc94358.js';
+import { jsx } from 'react/jsx-runtime';
+import { CardWithTopLeftIcon } from '../index.js';
+import '../../../index-47663d39.js';
+import 'react';
+import '../../../style-inject.es-1f59c1d0.js';
+
+var story = {
+    title: 'JSX/Cards/CardWithTopLeftIcon',
+    component: CardWithTopLeftIcon,
+    argTypes: {
+        title: {
+            defaultValue: 'Lorem Ipsum',
+            description: 'Title text that needs to be displayed',
+        },
+        children: {
+            type: 'text',
+            defaultValue: 'Mountain or rock climbing, Bouldering, Martial arts, Extreme sports, Scuba diving, Sky diving, Bungee jumping, Mountain or rock climbing, Bouldering, Martial arts,',
+            description: 'Content that is displayed inside the card',
+        },
+        state: {
+            defaultValue: 'actionable',
+            description: 'State that describe the interation with the card',
+        },
+        leftIcon: {
+            defaultValue: 'logo',
+            description: 'Icon displayed on the left of the card.',
+        },
+        rightIcon: {
+            defaultValue: 'arrow',
+            description: 'Icon displayed on the top right corner of the card',
+        },
+        cardSize: {
+            control: { type: 'select' },
+            defaultValue: 'medium',
+            description: 'Size of the card'
+        },
+        dropshadow: {
+            defaultValue: true,
+            description: 'If the card should have a box-shadow or not',
+        },
+        className: {
+            defaultValue: '',
+            type: 'text',
+            description: 'Class name for most top parent element',
+        },
+    },
+};
+var CardWithTopLeftIconStory = function (_a) {
+    var title = _a.title, dropshadow = _a.dropshadow, children = _a.children, className = _a.className, cardSize = _a.cardSize, leftIcon = _a.leftIcon, rightIcon = _a.rightIcon, state = _a.state;
+    return (jsx(CardWithTopLeftIcon, __assign({ cardSize: cardSize, className: className, dropshadow: dropshadow, state: state, leftIcon: leftIcon, rightIcon: rightIcon, title: title }, { children: children }), void 0));
+};
+CardWithTopLeftIconStory.storyName = "CardWithTopLeftIcon";
+
+export default story;
+export { CardWithTopLeftIconStory };
+//# sourceMappingURL=index.stories.js.map

package/dist/esm/components/cards/cardWithTopLeftIcon/index.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.stories.js","sources":["../../../../../../src/lib/components/cards/cardWithTopLeftIcon/index.stories.tsx"],"sourcesContent":["import { CardWithTopLeftIcon, CardWithTopLeftIconProps } from '.';\nimport { images } from '../../../util/images';\n\nconst story = {\n  title: 'JSX/Cards/CardWithTopLeftIcon',\n  component: CardWithTopLeftIcon,\n  argTypes: {\n    title: {\n      defaultValue: 'Lorem Ipsum',\n      description: 'Title text that needs to be displayed',\n    },\n    children: {\n      type: 'text',\n      defaultValue: 'Mountain or rock climbing, Bouldering, Martial arts, Extreme sports, Scuba diving, Sky diving, Bungee jumping, Mountain or rock climbing, Bouldering, Martial arts,',\n      description: 'Content that is displayed inside the card',\n    },\n    state: {\n      defaultValue: 'actionable',\n      description: 'State that describe the interation with the card',\n    },\n    leftIcon: {\n      defaultValue: 'logo',\n      description: 'Icon displayed on the left of the card.',\n    },\n    rightIcon: {\n      defaultValue: 'arrow',\n      description: 'Icon displayed on the top right corner of the card',\n    },\n    cardSize: {\n      control: { type: 'select' },\n      defaultValue: 'medium',\n      description: 'Size of the card'\n    },\n    dropshadow: {\n      defaultValue: true,\n      description: 'If the card should have a box-shadow or not',\n    },\n    className: {\n      defaultValue: '',\n      type: 'text',\n      description: 'Class name for most top parent element',\n    },\n  },\n};\n\nexport const CardWithTopLeftIconStory = ({\n  title,\n  dropshadow,\n  children,\n  className,\n  cardSize,\n  leftIcon,\n  rightIcon,\n  state,\n}: CardWithTopLeftIconProps) => {\n  return (\n    <CardWithTopLeftIcon\n      cardSize={cardSize}\n      className={className}\n      dropshadow={dropshadow}\n      state={state}\n      leftIcon={leftIcon}\n      rightIcon={rightIcon}\n      title={title}\n    >\n      {children}\n    </CardWithTopLeftIcon>\n  );\n}\n\nCardWithTopLeftIconStory.storyName = \"CardWithTopLeftIcon\";\n\nexport default story;\n"],"names":["_jsx"],"mappings":";;;;;;;IAGM,KAAK,GAAG;IACZ,KAAK,EAAE,+BAA+B;IACtC,SAAS,EAAE,mBAAmB;IAC9B,QAAQ,EAAE;QACR,KAAK,EAAE;YACL,YAAY,EAAE,aAAa;YAC3B,WAAW,EAAE,uCAAuC;SACrD;QACD,QAAQ,EAAE;YACR,IAAI,EAAE,MAAM;YACZ,YAAY,EAAE,qKAAqK;YACnL,WAAW,EAAE,2CAA2C;SACzD;QACD,KAAK,EAAE;YACL,YAAY,EAAE,YAAY;YAC1B,WAAW,EAAE,kDAAkD;SAChE;QACD,QAAQ,EAAE;YACR,YAAY,EAAE,MAAM;YACpB,WAAW,EAAE,yCAAyC;SACvD;QACD,SAAS,EAAE;YACT,YAAY,EAAE,OAAO;YACrB,WAAW,EAAE,oDAAoD;SAClE;QACD,QAAQ,EAAE;YACR,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE;YAC3B,YAAY,EAAE,QAAQ;YACtB,WAAW,EAAE,kBAAkB;SAChC;QACD,UAAU,EAAE;YACV,YAAY,EAAE,IAAI;YAClB,WAAW,EAAE,6CAA6C;SAC3D;QACD,SAAS,EAAE;YACT,YAAY,EAAE,EAAE;YAChB,IAAI,EAAE,MAAM;YACZ,WAAW,EAAE,wCAAwC;SACtD;KACF;EACD;IAEW,wBAAwB,GAAG,UAAC,EASd;QARzB,KAAK,WAAA,EACL,UAAU,gBAAA,EACV,QAAQ,cAAA,EACR,SAAS,eAAA,EACT,QAAQ,cAAA,EACR,QAAQ,cAAA,EACR,SAAS,eAAA,EACT,KAAK,WAAA;IAEL,QACEA,IAAC,mBAAmB,aAClB,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,SAAS,EACpB,UAAU,EAAE,UAAU,EACtB,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,gBAEX,QAAQ,YACW,EACtB;AACJ,EAAC;AAED,wBAAwB,CAAC,SAAS,GAAG,qBAAqB;;;;;"}

package/dist/esm/components/cards/index.js

@@ -17,7 +17,7 @@ var containerStyleFromTitleSize = function (titleSize) {
             return 'container';
     }
 };
-var index$3 = (function (_a) {
+var CardWithTopLeftIcon = function (_a) {
     var className = _a.className, title = _a.title, _b = _a.cardSize, cardSize = _b === void 0 ? 'medium' : _b, children = _a.children, leftIcon = _a.leftIcon, rightIcon = _a.rightIcon, _c = _a.state, state = _c === void 0 ? 'actionable' : _c, _d = _a.dropshadow, dropshadow = _d === void 0 ? true : _d, props = __rest(_a, ["className", "title", "cardSize", "children", "leftIcon", "rightIcon", "state", "dropshadow"]);
     var cardStyle = className + " " + associatedClassForCardState(state, dropshadow) + " " + styles$3[containerStyleFromTitleSize(cardSize)];
     var titleContainerStyle = styles$3['title-container'];
@@ -28,13 +28,13 @@ var index$3 = (function (_a) {
                     jsx("div", __assign({ className: headingStyle }, { children: title }), void 0),
                     rightIcon && (jsx("img", { className: iconStyle, width: "24px", height: "24px", src: rightIcon === 'arrow' ? arrowRight.src : rightIcon.src, alt: rightIcon === 'arrow' ? arrowRight.alt : rightIcon.alt }, void 0))] }), void 0),
             jsx("p", __assign({ className: cardTextStyle }, { children: children }), void 0)] }), void 0));
-});
+};
 
 var css_248z$2 = ".style-module_container__34kUF {\n  padding: 32px 24px 24px 24px;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n}\n\n.style-module_right-icon__3_kH9 {\n  margin-left: 4px;\n}";
 var styles$2 = {"container":"style-module_container__34kUF","right-icon":"style-module_right-icon__3_kH9"};
 styleInject(css_248z$2);
 
-var index$2 = (function (_a) {
+var CardWithTopIcon = function (_a) {
     var className = _a.className, title = _a.title, _b = _a.cardSize, cardSize = _b === void 0 ? 'medium' : _b, children = _a.children, topIcon = _a.topIcon, _c = _a.topIconSize, topIconSize = _c === void 0 ? { width: 48, height: 48 } : _c, rightIcon = _a.rightIcon, _d = _a.state, state = _d === void 0 ? 'actionable' : _d, _e = _a.dropshadow, dropshadow = _e === void 0 ? true : _e, props = __rest(_a, ["className", "title", "cardSize", "children", "topIcon", "topIconSize", "rightIcon", "state", "dropshadow"]);
     var cardStyle = "d-flex fd-column ai-center " + className + " " + associatedClassForCardState(state, dropshadow) + " " + styles$2.container;
     var headingStyle = headingForCardSize(cardSize);
@@ -42,19 +42,19 @@ var index$2 = (function (_a) {
     return (jsx(Fragment, { children: jsxs("div", __assign({ className: cardStyle }, props, { children: [jsx("img", { width: topIconSize.width, height: topIconSize.height, alt: topIcon.alt, src: topIcon.src }, void 0),
                 jsxs("div", __assign({ className: "d-flex mt16" }, { children: [jsx("div", __assign({ className: headingStyle }, { children: title }), void 0),
                         rightIcon && (jsx("img", { className: iconStyle, width: "24px", height: "24px", src: rightIcon === 'arrow' ? arrowRight.src : rightIcon.src, alt: rightIcon === 'arrow' ? arrowRight.alt : rightIcon.alt }, void 0))] }), void 0), children] }), void 0) }, void 0));
-});
+};
 
 var css_248z$1 = "@keyframes style-module_appear-in__23V7k {\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n}\n.style-module_root-container__3r_b9 {\n  position: relative;\n  padding-top: 40px;\n}\n.style-module_root-container__3r_b9:hover .style-module_right-icon__L6sf3 {\n  visibility: visible;\n  animation-name: style-module_appear-in__23V7k;\n  animation-duration: 0.3s;\n  animation-fill-mode: both;\n}\n\n.style-module_top-icon__10CJ3 {\n  position: absolute;\n  left: 50%;\n  transform: translateX(-50%) translateY(-40px);\n}\n.style-module_top-icon--muted__3PZ1X {\n  opacity: 0.25;\n}\n\n.style-module_right-icon__L6sf3 {\n  visibility: hidden;\n  position: absolute;\n  top: 64px;\n  right: 24px;\n}\n\n.style-module_container__19mu2 {\n  padding: 0 24px 24px 24px;\n  height: 100%;\n}\n@media (max-width: 34rem) {\n  .style-module_container__19mu2 {\n    height: fit-content;\n  }\n}";
 var styles$1 = {"root-container":"style-module_root-container__3r_b9","right-icon":"style-module_right-icon__L6sf3","appear-in":"style-module_appear-in__23V7k","top-icon":"style-module_top-icon__10CJ3","top-icon--muted":"style-module_top-icon--muted__3PZ1X","container":"style-module_container__19mu2"};
 styleInject(css_248z$1);
 
-var index$1 = (function (_a) {
+var InfoCard = function (_a) {
     var className = _a.className, title = _a.title, children = _a.children, topIcon = _a.topIcon, rightIcon = _a.rightIcon, _b = _a.state, state = _b === void 0 ? 'actionable' : _b, _c = _a.dropshadow, dropshadow = _c === void 0 ? true : _c, props = __rest(_a, ["className", "title", "children", "topIcon", "rightIcon", "state", "dropshadow"]);
     return (jsxs("div", __assign({ className: styles$1['root-container'] + " " + (className !== null && className !== void 0 ? className : '') }, props, { children: [jsx("img", { src: topIcon.src, alt: topIcon.alt, className: styles$1['top-icon'] + " " + (state === 'muted' ? styles$1['top-icon--muted'] : '') + " ", width: "80px", height: "80px" }, void 0),
             jsxs("div", __assign({ className: associatedClassForCardState(state, dropshadow) + " " + styles$1.container }, { children: [rightIcon && (jsx("img", { width: "20px", height: "20px", className: styles$1['right-icon'], src: rightIcon === 'info' ? info.src : rightIcon.src, alt: rightIcon === 'info' ? info.alt : rightIcon.alt }, void 0)),
                     jsx("div", __assign({ className: "p-h4 ta-center mt64" }, { children: title }), void 0),
                     jsx("p", __assign({ className: "p-p mt16 tc-grey-600" }, { children: children }), void 0)] }), void 0)] }), void 0));
-});
+};
 
 var headingForCardSize = function (cardSize) {
     switch (cardSize) {
@@ -109,7 +109,7 @@ var cardTextStyleFromCardSize = function (cardSize) {
             return 'card-text--big';
     }
 };
-var index = (function (_a) {
+var CardWithLeftIcon = function (_a) {
     var _b = _a.className, className = _b === void 0 ? '' : _b, title = _a.title, _c = _a.cardSize, cardSize = _c === void 0 ? 'medium' : _c, children = _a.children, leftIcon = _a.leftIcon, rightIcon = _a.rightIcon, _d = _a.state, state = _d === void 0 ? 'actionable' : _d, _e = _a.dropshadow, dropshadow = _e === void 0 ? true : _e, props = __rest(_a, ["className", "title", "cardSize", "children", "leftIcon", "rightIcon", "state", "dropshadow"]);
     var cardStyle = "d-flex ai-center " + className + " " + associatedClassForCardState(state, dropshadow) + " " + styles[containerStyleFromCardSize(cardSize)];
     var headingStyle = headingForCardSize(cardSize);
@@ -119,7 +119,7 @@ var index = (function (_a) {
             jsxs("div", { children: [jsxs("div", __assign({ className: "d-flex" }, { children: [jsx("div", __assign({ className: headingStyle }, { children: title }), void 0),
                             rightIcon && (jsx("img", { className: "ml-auto", width: "24px", height: "24px", src: rightIcon === 'arrow' ? arrowRight.src : rightIcon.src, alt: rightIcon === 'arrow' ? arrowRight.alt : rightIcon.alt }, void 0))] }), void 0),
                     jsx("p", __assign({ className: cardTextStyle }, { children: children }), void 0)] }, void 0)] }), void 0));
-});
+};
 
-export { index as CardWithLeftIcon, index$2 as CardWithTopIcon, index$3 as CardWithTopLeftIcon, index$1 as InfoCard, associatedClassForCardState, headingForCardSize };
+export { CardWithLeftIcon, CardWithTopIcon, CardWithTopLeftIcon, InfoCard, associatedClassForCardState, headingForCardSize };
 //# sourceMappingURL=index.js.map

package/dist/esm/components/cards/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/lib/components/cards/cardWithTopLeftIcon/index.tsx","../../../../../src/lib/components/cards/cardWithTopIcon/index.tsx","../../../../../src/lib/components/cards/infoCard/index.tsx","../../../../../src/lib/components/cards/index.tsx","../../../../../src/lib/components/cards/cardWithLeftIcon/index.tsx"],"sourcesContent":["import {\n  associatedClassForCardState,\n  CardProps,\n  headingForCardSize,\n} from '..';\nimport { Icon, arrowRight, featherLogo } from '../icons';\n\nimport styles from './style.module.scss';\n\nconst containerStyleFromTitleSize = (\n  titleSize: 'xsmall' | 'small' | 'medium' | 'big'\n): string => {\n  switch (titleSize) {\n    case 'xsmall':\n      return 'container--xsmall';\n    default:\n      return 'container';\n  }\n};\n\nexport default ({\n  className,\n  title,\n  cardSize = 'medium',\n  children,\n  leftIcon,\n  rightIcon,\n  state = 'actionable',\n  dropshadow = true,\n  ...props\n}: CardProps & {\n  cardSize?: 'xsmall' | 'small' | 'medium' | 'big';\n  leftIcon?: 'logo' | Icon;\n  rightIcon?: 'arrow' | Icon;\n}) => {\n  const cardStyle = `${className} ${associatedClassForCardState(\n    state,\n    dropshadow\n  )} ${styles[containerStyleFromTitleSize(cardSize)]}`;\n\n  const titleContainerStyle = styles['title-container'];\n  const headingStyle = headingForCardSize(cardSize);\n  const iconStyle = styles['right-icon'];\n  const cardTextStyle = `p-p tc-grey-600 ${cardSize === 'xsmall' ? styles.indent : 'mt16'}`;\n\n  return (\n    <div className={cardStyle} {...props}>\n      <div className={titleContainerStyle}>\n        {leftIcon && (\n          <img\n            className=\"mr8\"\n            width=\"28px\"\n            height=\"28px\"\n            src={leftIcon === 'logo' ? featherLogo.src : leftIcon.src}\n            alt={leftIcon === 'logo' ? featherLogo.alt : leftIcon.src}\n          />\n        )}\n        <div className={headingStyle}>{title}</div>\n        {rightIcon && (\n          <img\n            className={iconStyle}\n            width=\"24px\"\n            height=\"24px\"\n            src={rightIcon === 'arrow' ? arrowRight.src : rightIcon.src}\n            alt={rightIcon === 'arrow' ? arrowRight.alt : rightIcon.alt}\n          />\n        )}\n      </div>\n      <p className={cardTextStyle}>{children}</p>\n    </div>\n  );\n};\n","import { associatedClassForCardState, CardProps, headingForCardSize } from '..';\nimport { Icon, arrowRight, IconSize } from '../icons';\n\nimport styles from './style.module.scss';\n\nexport default ({\n  className,\n  title,\n  cardSize = 'medium',\n  children,\n  topIcon,\n  topIconSize = { width: 48, height: 48 },\n  rightIcon,\n  state = 'actionable',\n  dropshadow = true,\n  ...props\n}: CardProps & {\n  topIcon: Icon;\n  topIconSize: IconSize;\n  cardSize?: 'small' | 'medium' | 'big';\n  rightIcon?: 'arrow' | Icon;\n}) => {\n  const cardStyle = `d-flex fd-column ai-center ${className} ${associatedClassForCardState(\n    state,\n    dropshadow\n  )} ${styles.container}`;\n\n  const headingStyle = headingForCardSize(cardSize);\n  const iconStyle = styles['right-icon'];\n\n  return (\n    <>\n      <div className={cardStyle} {...props}>\n        <img\n          width={topIconSize.width}\n          height={topIconSize.height}\n          alt={topIcon.alt}\n          src={topIcon.src}\n        />\n        <div className=\"d-flex mt16\">\n          <div className={headingStyle}>{title}</div>\n          {rightIcon && (\n            <img\n              className={iconStyle}\n              width=\"24px\"\n              height=\"24px\"\n              src={rightIcon === 'arrow' ? arrowRight.src : rightIcon.src}\n              alt={rightIcon === 'arrow' ? arrowRight.alt : rightIcon.alt}\n            />\n          )}\n        </div>\n        {children}\n      </div>\n    </>\n  );\n};\n","import { associatedClassForCardState, CardProps } from '..';\nimport { Icon, info } from '../icons';\n\nimport styles from './style.module.scss';\n\nexport default ({\n  className,\n  title,\n  children,\n  topIcon,\n  rightIcon,\n  state = 'actionable',\n  dropshadow = true,\n  ...props\n}: CardProps & {\n  topIcon: Icon;\n  rightIcon?: 'info' | Icon;\n}) => (\n  <div className={`${styles['root-container']} ${className ?? ''}`} {...props}>\n    <img\n      src={topIcon.src}\n      alt={topIcon.alt}\n      className={`${styles['top-icon']} ${\n        state === 'muted' ? styles['top-icon--muted'] : ''\n      } `}\n      width=\"80px\"\n      height=\"80px\"\n    />\n    <div\n      className={`${associatedClassForCardState(state, dropshadow)} ${\n        styles.container\n      }`}\n    >\n      {rightIcon && (\n        <img\n          width=\"20px\"\n          height=\"20px\"\n          className={styles['right-icon']}\n          src={rightIcon === 'info' ? info.src : rightIcon.src}\n          alt={rightIcon === 'info' ? info.alt : rightIcon.alt}\n        />\n      )}\n      <div className=\"p-h4 ta-center mt64\">{title}</div>\n      <p className=\"p-p mt16 tc-grey-600\">{children}</p>\n    </div>\n  </div>\n);\n","import CardWithTopLeftIcon from './cardWithTopLeftIcon';\nimport CardWithLeftIcon from './cardWithLeftIcon';\nimport CardWithTopIcon from './cardWithTopIcon';\nimport InfoCard from './infoCard';\nimport CardButton from './cardButton';\n\ntype CardState = 'actionable' | 'static' | 'muted';\n\nexport type CardProps = {\n  title: string;\n  children: React.ReactNode;\n  state?: CardState;\n  dropshadow?: boolean;\n} & JSX.IntrinsicElements['div'];\n\nexport const headingForCardSize = (\n  cardSize: 'xsmall' | 'small' | 'medium' | 'big'\n): string => {\n  switch (cardSize) {\n    case 'xsmall':\n    case 'small':\n      return 'p-h4';\n    case 'medium':\n      return 'p-h3';\n    case 'big':\n      return 'p-h2';\n  }\n};\n\nexport const associatedClassForCardState = (\n  state: CardState,\n  dropshadow: boolean\n): string => {\n  const baseClass = (() => {\n    switch (state) {\n      case 'actionable':\n        return 'ds-card--actionable';\n      case 'muted':\n        return 'ds-card--muted';\n      case 'static':\n        return 'ds-card';\n    }\n  })();\n\n  if (dropshadow === false) {\n    return `${baseClass} ds-card--no-dropshadow`;\n  }\n  return baseClass;\n};\n\nexport {\n  CardWithTopLeftIcon,\n  CardWithLeftIcon,\n  CardWithTopIcon,\n  InfoCard,\n  CardButton,\n};\n","import { associatedClassForCardState, CardProps, headingForCardSize } from '..';\nimport { Icon, arrowRight } from '../icons';\n\nimport styles from './style.module.scss';\n\nconst containerStyleFromCardSize = (\n  cardSize: 'xsmall' | 'small' | 'medium' | 'big'\n): string => {\n  switch (cardSize) {\n    case 'xsmall':\n      return 'container--xsmall';\n    case 'small':\n      return 'container--small';\n    default:\n      return 'container';\n  }\n};\n\nconst cardTextStyleFromCardSize = (\n  cardSize: 'xsmall' | 'small' | 'medium' | 'big'\n): string => {\n  switch (cardSize) {\n    case 'xsmall':\n    case 'small':\n      return 'card-text--small';\n    case 'medium':\n      return 'card-text--medium';\n    default:\n      return 'card-text--big';\n  }\n};\n\nexport default ({\n  className = '',\n  title,\n  cardSize = 'medium',\n  children,\n  leftIcon,\n  rightIcon,\n  state = 'actionable',\n  dropshadow = true,\n  ...props\n}: CardProps & {\n  cardSize?: 'xsmall' | 'small' | 'medium' | 'big';\n  leftIcon?: Icon;\n  rightIcon?: 'arrow' | Icon;\n}) => {\n  const cardStyle = `d-flex ai-center ${className} ${associatedClassForCardState(\n    state,\n    dropshadow\n  )} ${styles[containerStyleFromCardSize(cardSize)]}`;\n\n  const headingStyle = headingForCardSize(cardSize);\n  const iconStyle = cardSize === 'xsmall' ? 'mr16' : 'mr32';\n  const cardTextStyle = `tc-grey-600 ${\n    cardSize === 'xsmall' ? 'p-p--small' : 'p-p '\n  } ${styles[cardTextStyleFromCardSize(cardSize)]}`;\n\n  return (\n    <div className={cardStyle} {...props}>\n      {leftIcon && (\n        <img\n          width=\"48px\"\n          height=\"48px\"\n          className={iconStyle}\n          src={leftIcon.src}\n          alt={leftIcon.alt}\n        />\n      )}\n      <div>\n        <div className=\"d-flex\">\n          <div className={headingStyle}>{title}</div>\n          {rightIcon && (\n            <img\n              className=\"ml-auto\"\n              width=\"24px\"\n              height=\"24px\"\n              src={rightIcon === 'arrow' ? arrowRight.src : rightIcon.src}\n              alt={rightIcon === 'arrow' ? arrowRight.alt : rightIcon.alt}\n            />\n          )}\n        </div>\n        <p className={cardTextStyle}>{children}</p>\n      </div>\n    </div>\n  );\n};\n"],"names":["styles","_jsxs","_jsx"],"mappings":";;;;;;;;;;;AASA,IAAM,2BAA2B,GAAG,UAClC,SAAgD;IAEhD,QAAQ,SAAS;QACf,KAAK,QAAQ;YACX,OAAO,mBAAmB,CAAC;QAC7B;YACE,OAAO,WAAW,CAAC;KACtB;AACH,CAAC,CAAC;AAEF,eAAe,UAAC,EAcf;IAbC,IAAA,SAAS,eAAA,EACT,KAAK,WAAA,EACL,gBAAmB,EAAnB,QAAQ,mBAAG,QAAQ,KAAA,EACnB,QAAQ,cAAA,EACR,QAAQ,cAAA,EACR,SAAS,eAAA,EACT,aAAoB,EAApB,KAAK,mBAAG,YAAY,KAAA,EACpB,kBAAiB,EAAjB,UAAU,mBAAG,IAAI,KAAA,EACd,KAAK,cATM,8FAUf,CADS;IAMR,IAAM,SAAS,GAAM,SAAS,SAAI,2BAA2B,CAC3D,KAAK,EACL,UAAU,CACX,SAAIA,QAAM,CAAC,2BAA2B,CAAC,QAAQ,CAAC,CAAG,CAAC;IAErD,IAAM,mBAAmB,GAAGA,QAAM,CAAC,iBAAiB,CAAC,CAAC;IACtD,IAAM,YAAY,GAAG,kBAAkB,CAAC,QAAQ,CAAC,CAAC;IAClD,IAAM,SAAS,GAAGA,QAAM,CAAC,YAAY,CAAC,CAAC;IACvC,IAAM,aAAa,GAAG,sBAAmB,QAAQ,KAAK,QAAQ,GAAGA,QAAM,CAAC,MAAM,GAAG,MAAM,CAAE,CAAC;IAE1F,QACEC,uBAAK,SAAS,EAAE,SAAS,IAAM,KAAK,eAClCA,uBAAK,SAAS,EAAE,mBAAmB,iBAChC,QAAQ,KACPC,aACE,SAAS,EAAC,KAAK,EACf,KAAK,EAAC,MAAM,EACZ,MAAM,EAAC,MAAM,EACb,GAAG,EAAE,QAAQ,KAAK,MAAM,GAAG,WAAW,CAAC,GAAG,GAAG,QAAQ,CAAC,GAAG,EACzD,GAAG,EAAE,QAAQ,KAAK,MAAM,GAAG,WAAW,CAAC,GAAG,GAAG,QAAQ,CAAC,GAAG,WACzD,CACH;oBACDA,sBAAK,SAAS,EAAE,YAAY,gBAAG,KAAK,YAAO;oBAC1C,SAAS,KACRA,aACE,SAAS,EAAE,SAAS,EACpB,KAAK,EAAC,MAAM,EACZ,MAAM,EAAC,MAAM,EACb,GAAG,EAAE,SAAS,KAAK,OAAO,GAAG,UAAU,CAAC,GAAG,GAAG,SAAS,CAAC,GAAG,EAC3D,GAAG,EAAE,SAAS,KAAK,OAAO,GAAG,UAAU,CAAC,GAAG,GAAG,SAAS,CAAC,GAAG,WAC3D,CACH,aACG;YACNA,oBAAG,SAAS,EAAE,aAAa,gBAAG,QAAQ,YAAK,aACvC,EACN;AACJ,CAAC;;;;;;AClED,eAAe,UAAC,EAgBf;IAfC,IAAA,SAAS,eAAA,EACT,KAAK,WAAA,EACL,gBAAmB,EAAnB,QAAQ,mBAAG,QAAQ,KAAA,EACnB,QAAQ,cAAA,EACR,OAAO,aAAA,EACP,mBAAuC,EAAvC,WAAW,mBAAG,EAAE,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,KAAA,EACvC,SAAS,eAAA,EACT,aAAoB,EAApB,KAAK,mBAAG,YAAY,KAAA,EACpB,kBAAiB,EAAjB,UAAU,mBAAG,IAAI,KAAA,EACd,KAAK,cAVM,4GAWf,CADS;IAOR,IAAM,SAAS,GAAG,gCAA8B,SAAS,SAAI,2BAA2B,CACtF,KAAK,EACL,UAAU,CACX,SAAIF,QAAM,CAAC,SAAW,CAAC;IAExB,IAAM,YAAY,GAAG,kBAAkB,CAAC,QAAQ,CAAC,CAAC;IAClD,IAAM,SAAS,GAAGA,QAAM,CAAC,YAAY,CAAC,CAAC;IAEvC,QACEE,0BACED,uBAAK,SAAS,EAAE,SAAS,IAAM,KAAK,eAClCC,aACE,KAAK,EAAE,WAAW,CAAC,KAAK,EACxB,MAAM,EAAE,WAAW,CAAC,MAAM,EAC1B,GAAG,EAAE,OAAO,CAAC,GAAG,EAChB,GAAG,EAAE,OAAO,CAAC,GAAG,WAChB;gBACFD,uBAAK,SAAS,EAAC,aAAa,iBAC1BC,sBAAK,SAAS,EAAE,YAAY,gBAAG,KAAK,YAAO;wBAC1C,SAAS,KACRA,aACE,SAAS,EAAE,SAAS,EACpB,KAAK,EAAC,MAAM,EACZ,MAAM,EAAC,MAAM,EACb,GAAG,EAAE,SAAS,KAAK,OAAO,GAAG,UAAU,CAAC,GAAG,GAAG,SAAS,CAAC,GAAG,EAC3D,GAAG,EAAE,SAAS,KAAK,OAAO,GAAG,UAAU,CAAC,GAAG,GAAG,SAAS,CAAC,GAAG,WAC3D,CACH,aACG,EACL,QAAQ,aACL,WACL,EACH;AACJ,CAAC;;;;;;AClDD,eAAe,UAAC,EAYf;IAXC,IAAA,SAAS,eAAA,EACT,KAAK,WAAA,EACL,QAAQ,cAAA,EACR,OAAO,aAAA,EACP,SAAS,eAAA,EACT,aAAoB,EAApB,KAAK,mBAAG,YAAY,KAAA,EACpB,kBAAiB,EAAjB,UAAU,mBAAG,IAAI,KAAA,EACd,KAAK,cARM,iFASf,CADS;IAIJ,QACJD,uBAAK,SAAS,EAAKD,QAAM,CAAC,gBAAgB,CAAC,UAAI,SAAS,aAAT,SAAS,cAAT,SAAS,GAAI,EAAE,CAAE,IAAM,KAAK,eACzEE,aACE,GAAG,EAAE,OAAO,CAAC,GAAG,EAChB,GAAG,EAAE,OAAO,CAAC,GAAG,EAChB,SAAS,EAAKF,QAAM,CAAC,UAAU,CAAC,UAC9B,KAAK,KAAK,OAAO,GAAGA,QAAM,CAAC,iBAAiB,CAAC,GAAG,EAAE,OACjD,EACH,KAAK,EAAC,MAAM,EACZ,MAAM,EAAC,MAAM,WACb;YACFC,uBACE,SAAS,EAAK,2BAA2B,CAAC,KAAK,EAAE,UAAU,CAAC,SAC1DD,QAAM,CAAC,SACP,iBAED,SAAS,KACRE,aACE,KAAK,EAAC,MAAM,EACZ,MAAM,EAAC,MAAM,EACb,SAAS,EAAEF,QAAM,CAAC,YAAY,CAAC,EAC/B,GAAG,EAAE,SAAS,KAAK,MAAM,GAAG,IAAI,CAAC,GAAG,GAAG,SAAS,CAAC,GAAG,EACpD,GAAG,EAAE,SAAS,KAAK,MAAM,GAAG,IAAI,CAAC,GAAG,GAAG,SAAS,CAAC,GAAG,WACpD,CACH;oBACDE,sBAAK,SAAS,EAAC,qBAAqB,gBAAE,KAAK,YAAO;oBAClDA,oBAAG,SAAS,EAAC,sBAAsB,gBAAE,QAAQ,YAAK,aAC9C,aACF,EACP;CAAA;;IC/BY,kBAAkB,GAAG,UAChC,QAA+C;IAE/C,QAAQ,QAAQ;QACd,KAAK,QAAQ,CAAC;QACd,KAAK,OAAO;YACV,OAAO,MAAM,CAAC;QAChB,KAAK,QAAQ;YACX,OAAO,MAAM,CAAC;QAChB,KAAK,KAAK;YACR,OAAO,MAAM,CAAC;KACjB;AACH,EAAE;IAEW,2BAA2B,GAAG,UACzC,KAAgB,EAChB,UAAmB;IAEnB,IAAM,SAAS,GAAG,CAAC;QACjB,QAAQ,KAAK;YACX,KAAK,YAAY;gBACf,OAAO,qBAAqB,CAAC;YAC/B,KAAK,OAAO;gBACV,OAAO,gBAAgB,CAAC;YAC1B,KAAK,QAAQ;gBACX,OAAO,SAAS,CAAC;SACpB;KACF,GAAG,CAAC;IAEL,IAAI,UAAU,KAAK,KAAK,EAAE;QACxB,OAAU,SAAS,4BAAyB,CAAC;KAC9C;IACD,OAAO,SAAS,CAAC;AACnB;;;;;;AC3CA,IAAM,0BAA0B,GAAG,UACjC,QAA+C;IAE/C,QAAQ,QAAQ;QACd,KAAK,QAAQ;YACX,OAAO,mBAAmB,CAAC;QAC7B,KAAK,OAAO;YACV,OAAO,kBAAkB,CAAC;QAC5B;YACE,OAAO,WAAW,CAAC;KACtB;AACH,CAAC,CAAC;AAEF,IAAM,yBAAyB,GAAG,UAChC,QAA+C;IAE/C,QAAQ,QAAQ;QACd,KAAK,QAAQ,CAAC;QACd,KAAK,OAAO;YACV,OAAO,kBAAkB,CAAC;QAC5B,KAAK,QAAQ;YACX,OAAO,mBAAmB,CAAC;QAC7B;YACE,OAAO,gBAAgB,CAAC;KAC3B;AACH,CAAC,CAAC;AAEF,aAAe,UAAC,EAcf;IAbC,IAAA,iBAAc,EAAd,SAAS,mBAAG,EAAE,KAAA,EACd,KAAK,WAAA,EACL,gBAAmB,EAAnB,QAAQ,mBAAG,QAAQ,KAAA,EACnB,QAAQ,cAAA,EACR,QAAQ,cAAA,EACR,SAAS,eAAA,EACT,aAAoB,EAApB,KAAK,mBAAG,YAAY,KAAA,EACpB,kBAAiB,EAAjB,UAAU,mBAAG,IAAI,KAAA,EACd,KAAK,cATM,8FAUf,CADS;IAMR,IAAM,SAAS,GAAG,sBAAoB,SAAS,SAAI,2BAA2B,CAC5E,KAAK,EACL,UAAU,CACX,SAAI,MAAM,CAAC,0BAA0B,CAAC,QAAQ,CAAC,CAAG,CAAC;IAEpD,IAAM,YAAY,GAAG,kBAAkB,CAAC,QAAQ,CAAC,CAAC;IAClD,IAAM,SAAS,GAAG,QAAQ,KAAK,QAAQ,GAAG,MAAM,GAAG,MAAM,CAAC;IAC1D,IAAM,aAAa,GAAG,kBACpB,QAAQ,KAAK,QAAQ,GAAG,YAAY,GAAG,MAAM,UAC3C,MAAM,CAAC,yBAAyB,CAAC,QAAQ,CAAC,CAAG,CAAC;IAElD,QACED,uBAAK,SAAS,EAAE,SAAS,IAAM,KAAK,eACjC,QAAQ,KACPC,aACE,KAAK,EAAC,MAAM,EACZ,MAAM,EAAC,MAAM,EACb,SAAS,EAAE,SAAS,EACpB,GAAG,EAAE,QAAQ,CAAC,GAAG,EACjB,GAAG,EAAE,QAAQ,CAAC,GAAG,WACjB,CACH;YACDD,yBACEA,uBAAK,SAAS,EAAC,QAAQ,iBACrBC,sBAAK,SAAS,EAAE,YAAY,gBAAG,KAAK,YAAO;4BAC1C,SAAS,KACRA,aACE,SAAS,EAAC,SAAS,EACnB,KAAK,EAAC,MAAM,EACZ,MAAM,EAAC,MAAM,EACb,GAAG,EAAE,SAAS,KAAK,OAAO,GAAG,UAAU,CAAC,GAAG,GAAG,SAAS,CAAC,GAAG,EAC3D,GAAG,EAAE,SAAS,KAAK,OAAO,GAAG,UAAU,CAAC,GAAG,GAAG,SAAS,CAAC,GAAG,WAC3D,CACH,aACG;oBACNA,oBAAG,SAAS,EAAE,aAAa,gBAAG,QAAQ,YAAK,YACvC,aACF,EACN;AACJ,CAAC;;;;"}
+{"version":3,"file":"index.js","sources":["../../../../../src/lib/components/cards/cardWithTopLeftIcon/index.tsx","../../../../../src/lib/components/cards/cardWithTopIcon/index.tsx","../../../../../src/lib/components/cards/infoCard/index.tsx","../../../../../src/lib/components/cards/index.tsx","../../../../../src/lib/components/cards/cardWithLeftIcon/index.tsx"],"sourcesContent":["import {\n  associatedClassForCardState,\n  CardProps,\n  headingForCardSize,\n} from '..';\nimport { Icon, arrowRight, featherLogo } from '../icons';\n\nimport styles from './style.module.scss';\n\nconst containerStyleFromTitleSize = (\n  titleSize: 'xsmall' | 'small' | 'medium' | 'big'\n): string => {\n  switch (titleSize) {\n    case 'xsmall':\n      return 'container--xsmall';\n    default:\n      return 'container';\n  }\n};\n\nexport type CardWithTopLeftIconProps = CardProps & {\n  cardSize?: 'xsmall' | 'small' | 'medium' | 'big';\n  leftIcon?: 'logo' | Icon;\n  rightIcon?: 'arrow' | Icon;\n};\n\nexport const CardWithTopLeftIcon = ({\n  className,\n  title,\n  cardSize = 'medium',\n  children,\n  leftIcon,\n  rightIcon,\n  state = 'actionable',\n  dropshadow = true,\n  ...props\n}: CardWithTopLeftIconProps) => {\n  const cardStyle = `${className} ${associatedClassForCardState(\n    state,\n    dropshadow\n  )} ${styles[containerStyleFromTitleSize(cardSize)]}`;\n\n  const titleContainerStyle = styles['title-container'];\n  const headingStyle = headingForCardSize(cardSize);\n  const iconStyle = styles['right-icon'];\n  const cardTextStyle = `p-p tc-grey-600 ${cardSize === 'xsmall' ? styles.indent : 'mt16'}`;\n\n  return (\n    <div className={cardStyle} {...props}>\n      <div className={titleContainerStyle}>\n        {leftIcon && (\n          <img\n            className=\"mr8\"\n            width=\"28px\"\n            height=\"28px\"\n            src={leftIcon === 'logo' ? featherLogo.src : leftIcon.src}\n            alt={leftIcon === 'logo' ? featherLogo.alt : leftIcon.src}\n          />\n        )}\n        <div className={headingStyle}>{title}</div>\n        {rightIcon && (\n          <img\n            className={iconStyle}\n            width=\"24px\"\n            height=\"24px\"\n            src={rightIcon === 'arrow' ? arrowRight.src : rightIcon.src}\n            alt={rightIcon === 'arrow' ? arrowRight.alt : rightIcon.alt}\n          />\n        )}\n      </div>\n      <p className={cardTextStyle}>{children}</p>\n    </div>\n  );\n};\n","import { associatedClassForCardState, CardProps, headingForCardSize } from '..';\nimport { Icon, arrowRight, IconSize } from '../icons';\n\nimport styles from './style.module.scss';\n\nexport type CardWithTopIconProps = CardProps & {\n  topIcon: Icon;\n  topIconSize: IconSize;\n  cardSize?: 'small' | 'medium' | 'big';\n  rightIcon?: 'arrow' | Icon;\n};\n\nexport const CardWithTopIcon = ({\n  className,\n  title,\n  cardSize = 'medium',\n  children,\n  topIcon,\n  topIconSize = { width: 48, height: 48 },\n  rightIcon,\n  state = 'actionable',\n  dropshadow = true,\n  ...props\n}: CardWithTopIconProps) => {\n  const cardStyle = `d-flex fd-column ai-center ${className} ${associatedClassForCardState(\n    state,\n    dropshadow\n  )} ${styles.container}`;\n\n  const headingStyle = headingForCardSize(cardSize);\n  const iconStyle = styles['right-icon'];\n\n  return (\n    <>\n      <div className={cardStyle} {...props}>\n        <img\n          width={topIconSize.width}\n          height={topIconSize.height}\n          alt={topIcon.alt}\n          src={topIcon.src}\n        />\n        <div className=\"d-flex mt16\">\n          <div className={headingStyle}>{title}</div>\n          {rightIcon && (\n            <img\n              className={iconStyle}\n              width=\"24px\"\n              height=\"24px\"\n              src={rightIcon === 'arrow' ? arrowRight.src : rightIcon.src}\n              alt={rightIcon === 'arrow' ? arrowRight.alt : rightIcon.alt}\n            />\n          )}\n        </div>\n        {children}\n      </div>\n    </>\n  );\n};\n","import { associatedClassForCardState, CardProps } from '..';\nimport { Icon, info } from '../icons';\n\nimport styles from './style.module.scss';\n\nexport type InfoCardProps = CardProps & {\n  topIcon: Icon;\n  rightIcon?: 'info' | Icon;\n};\n\nexport const InfoCard = ({\n  className,\n  title,\n  children,\n  topIcon,\n  rightIcon,\n  state = 'actionable',\n  dropshadow = true,\n  ...props\n}: InfoCardProps) => (\n  <div className={`${styles['root-container']} ${className ?? ''}`} {...props}>\n    <img\n      src={topIcon.src}\n      alt={topIcon.alt}\n      className={`${styles['top-icon']} ${\n        state === 'muted' ? styles['top-icon--muted'] : ''\n      } `}\n      width=\"80px\"\n      height=\"80px\"\n    />\n    <div\n      className={`${associatedClassForCardState(state, dropshadow)} ${\n        styles.container\n      }`}\n    >\n      {rightIcon && (\n        <img\n          width=\"20px\"\n          height=\"20px\"\n          className={styles['right-icon']}\n          src={rightIcon === 'info' ? info.src : rightIcon.src}\n          alt={rightIcon === 'info' ? info.alt : rightIcon.alt}\n        />\n      )}\n      <div className=\"p-h4 ta-center mt64\">{title}</div>\n      <p className=\"p-p mt16 tc-grey-600\">{children}</p>\n    </div>\n  </div>\n);\n","import { CardWithTopLeftIcon } from './cardWithTopLeftIcon';\nimport { CardWithLeftIcon } from './cardWithLeftIcon';\nimport { CardWithTopIcon } from './cardWithTopIcon';\nimport { InfoCard } from './infoCard';\nimport { CardButton } from './cardButton';\n\ntype CardState = 'actionable' | 'static' | 'muted';\n\nexport type CardProps = {\n  title: string;\n  children: React.ReactNode;\n  state?: CardState;\n  dropshadow?: boolean;\n} & JSX.IntrinsicElements['div'];\n\nexport const headingForCardSize = (\n  cardSize: 'xsmall' | 'small' | 'medium' | 'big'\n): string => {\n  switch (cardSize) {\n    case 'xsmall':\n    case 'small':\n      return 'p-h4';\n    case 'medium':\n      return 'p-h3';\n    case 'big':\n      return 'p-h2';\n  }\n};\n\nexport const associatedClassForCardState = (\n  state: CardState,\n  dropshadow: boolean\n): string => {\n  const baseClass = (() => {\n    switch (state) {\n      case 'actionable':\n        return 'ds-card--actionable';\n      case 'muted':\n        return 'ds-card--muted';\n      case 'static':\n        return 'ds-card';\n    }\n  })();\n\n  if (dropshadow === false) {\n    return `${baseClass} ds-card--no-dropshadow`;\n  }\n  return baseClass;\n};\n\nexport {\n  CardWithTopLeftIcon,\n  CardWithLeftIcon,\n  CardWithTopIcon,\n  InfoCard,\n  CardButton,\n};\n","import { associatedClassForCardState, CardProps, headingForCardSize } from '..';\nimport { Icon, arrowRight } from '../icons';\n\nimport styles from './style.module.scss';\n\nconst containerStyleFromCardSize = (\n  cardSize: 'xsmall' | 'small' | 'medium' | 'big'\n): string => {\n  switch (cardSize) {\n    case 'xsmall':\n      return 'container--xsmall';\n    case 'small':\n      return 'container--small';\n    default:\n      return 'container';\n  }\n};\n\nconst cardTextStyleFromCardSize = (\n  cardSize: 'xsmall' | 'small' | 'medium' | 'big'\n): string => {\n  switch (cardSize) {\n    case 'xsmall':\n    case 'small':\n      return 'card-text--small';\n    case 'medium':\n      return 'card-text--medium';\n    default:\n      return 'card-text--big';\n  }\n};\n\nexport type CardWithLeftIconProps = CardProps & {\n  cardSize?: 'xsmall' | 'small' | 'medium' | 'big';\n  leftIcon?: Icon;\n  rightIcon?: 'arrow' | Icon;\n}\n\nexport const CardWithLeftIcon = ({\n  className = '',\n  title,\n  cardSize = 'medium',\n  children,\n  leftIcon,\n  rightIcon,\n  state = 'actionable',\n  dropshadow = true,\n  ...props\n}: CardWithLeftIconProps) => {\n  const cardStyle = `d-flex ai-center ${className} ${associatedClassForCardState(\n    state,\n    dropshadow\n  )} ${styles[containerStyleFromCardSize(cardSize)]}`;\n\n  const headingStyle = headingForCardSize(cardSize);\n  const iconStyle = cardSize === 'xsmall' ? 'mr16' : 'mr32';\n  const cardTextStyle = `tc-grey-600 ${\n    cardSize === 'xsmall' ? 'p-p--small' : 'p-p '\n  } ${styles[cardTextStyleFromCardSize(cardSize)]}`;\n\n  return (\n    <div className={cardStyle} {...props}>\n      {leftIcon && (\n        <img\n          width=\"48px\"\n          height=\"48px\"\n          className={iconStyle}\n          src={leftIcon.src}\n          alt={leftIcon.alt}\n        />\n      )}\n      <div>\n        <div className=\"d-flex\">\n          <div className={headingStyle}>{title}</div>\n          {rightIcon && (\n            <img\n              className=\"ml-auto\"\n              width=\"24px\"\n              height=\"24px\"\n              src={rightIcon === 'arrow' ? arrowRight.src : rightIcon.src}\n              alt={rightIcon === 'arrow' ? arrowRight.alt : rightIcon.alt}\n            />\n          )}\n        </div>\n        <p className={cardTextStyle}>{children}</p>\n      </div>\n    </div>\n  );\n};\n"],"names":["styles","_jsxs","_jsx"],"mappings":"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"}

package/dist/esm/components/cards/infoCard/index.js

@@ -1,6 +1,6 @@
 import '../../../tslib.es6-5bc94358.js';
 import 'react/jsx-runtime';
-export { InfoCard as default } from '../index.js';
+export { InfoCard } from '../index.js';
 import '../../../index-47663d39.js';
 import '../../../style-inject.es-1f59c1d0.js';
 import 'react';

package/dist/esm/components/cards/infoCard/index.stories.js

@@ -0,0 +1,58 @@
+import { _ as __assign } from '../../../tslib.es6-5bc94358.js';
+import { jsx } from 'react/jsx-runtime';
+import { InfoCard } from '../index.js';
+import { i as images } from '../../../index-31224f74.js';
+import '../../../index-47663d39.js';
+import 'react';
+import '../../../style-inject.es-1f59c1d0.js';
+
+var story = {
+    title: 'JSX/Cards/InfoCard',
+    component: InfoCard,
+    argTypes: {
+        title: {
+            defaultValue: 'Lorem Ipsum',
+            description: 'Title text that needs to be displayed',
+        },
+        children: {
+            type: 'text',
+            defaultValue: 'Mountain or rock climbing, Bouldering, Martial arts, Extreme sports, Scuba diving, Sky diving, Bungee jumping, Mountain or rock climbing, Bouldering, Martial arts,',
+            description: 'Content that is displayed inside the card',
+        },
+        state: {
+            defaultValue: 'actionable',
+            description: 'State that describe the interation with the card',
+        },
+        topIcon: {
+            defaultValue: {
+                src: images.mortgage,
+                alt: 'Image alt'
+            },
+            description: 'Icon displayed on the top of the card, inside the purple circle',
+        },
+        rightIcon: {
+            defaultValue: {
+                src: images.washingMachine,
+                alt: 'Icon alt'
+            },
+            description: 'Icon displayed on the top right corner of the card',
+        },
+        dropshadow: {
+            defaultValue: true,
+            description: 'If the card should have a box-shadow or not',
+        },
+        className: {
+            defaultValue: '',
+            description: 'Class name for most top parent element',
+        },
+    },
+};
+var InfoCardStory = function (_a) {
+    var title = _a.title, dropshadow = _a.dropshadow, children = _a.children, className = _a.className, rightIcon = _a.rightIcon, state = _a.state, topIcon = _a.topIcon;
+    return (jsx(InfoCard, __assign({ className: className, dropshadow: dropshadow, state: state, rightIcon: rightIcon, title: title, topIcon: topIcon }, { children: children }), void 0));
+};
+InfoCardStory.storyName = "InfoCard";
+
+export default story;
+export { InfoCardStory };
+//# sourceMappingURL=index.stories.js.map

package/dist/esm/components/cards/infoCard/index.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.stories.js","sources":["../../../../../../src/lib/components/cards/infoCard/index.stories.tsx"],"sourcesContent":["import { InfoCard, InfoCardProps } from '.';\nimport { images } from '../../../util/images';\n\nconst story = {\n  title: 'JSX/Cards/InfoCard',\n  component: InfoCard,\n  argTypes: {\n    title: {\n      defaultValue: 'Lorem Ipsum',\n      description: 'Title text that needs to be displayed',\n    },\n    children: {\n      type: 'text',\n      defaultValue: 'Mountain or rock climbing, Bouldering, Martial arts, Extreme sports, Scuba diving, Sky diving, Bungee jumping, Mountain or rock climbing, Bouldering, Martial arts,',\n      description: 'Content that is displayed inside the card',\n    },\n    state: {\n      defaultValue: 'actionable',\n      description: 'State that describe the interation with the card',\n    },\n    topIcon: {\n      defaultValue: {\n        src: images.mortgage,\n        alt: 'Image alt'\n      },\n      description: 'Icon displayed on the top of the card, inside the purple circle',\n    },\n    rightIcon: {\n      defaultValue: {\n        src: images.washingMachine,\n        alt: 'Icon alt'\n      },\n      description: 'Icon displayed on the top right corner of the card',\n    },\n    dropshadow: {\n      defaultValue: true,\n      description: 'If the card should have a box-shadow or not',\n    },\n    className: {\n      defaultValue: '',\n      description: 'Class name for most top parent element',\n    },\n  },\n};\n\nexport const InfoCardStory = ({\n  title,\n  dropshadow,\n  children,\n  className,\n  rightIcon,\n  state,\n  topIcon\n}: InfoCardProps) => {\n  return (\n    <InfoCard\n      className={className}\n      dropshadow={dropshadow}\n      state={state}\n      rightIcon={rightIcon}\n      title={title}\n      topIcon={topIcon}\n    >\n      {children}\n    </InfoCard>\n  );\n}\n\nInfoCardStory.storyName = \"InfoCard\";\n\nexport default story;\n"],"names":["_jsx"],"mappings":";;;;;;;;IAGM,KAAK,GAAG;IACZ,KAAK,EAAE,oBAAoB;IAC3B,SAAS,EAAE,QAAQ;IACnB,QAAQ,EAAE;QACR,KAAK,EAAE;YACL,YAAY,EAAE,aAAa;YAC3B,WAAW,EAAE,uCAAuC;SACrD;QACD,QAAQ,EAAE;YACR,IAAI,EAAE,MAAM;YACZ,YAAY,EAAE,qKAAqK;YACnL,WAAW,EAAE,2CAA2C;SACzD;QACD,KAAK,EAAE;YACL,YAAY,EAAE,YAAY;YAC1B,WAAW,EAAE,kDAAkD;SAChE;QACD,OAAO,EAAE;YACP,YAAY,EAAE;gBACZ,GAAG,EAAE,MAAM,CAAC,QAAQ;gBACpB,GAAG,EAAE,WAAW;aACjB;YACD,WAAW,EAAE,iEAAiE;SAC/E;QACD,SAAS,EAAE;YACT,YAAY,EAAE;gBACZ,GAAG,EAAE,MAAM,CAAC,cAAc;gBAC1B,GAAG,EAAE,UAAU;aAChB;YACD,WAAW,EAAE,oDAAoD;SAClE;QACD,UAAU,EAAE;YACV,YAAY,EAAE,IAAI;YAClB,WAAW,EAAE,6CAA6C;SAC3D;QACD,SAAS,EAAE;YACT,YAAY,EAAE,EAAE;YAChB,WAAW,EAAE,wCAAwC;SACtD;KACF;EACD;IAEW,aAAa,GAAG,UAAC,EAQd;QAPd,KAAK,WAAA,EACL,UAAU,gBAAA,EACV,QAAQ,cAAA,EACR,SAAS,eAAA,EACT,SAAS,eAAA,EACT,KAAK,WAAA,EACL,OAAO,aAAA;IAEP,QACEA,IAAC,QAAQ,aACP,SAAS,EAAE,SAAS,EACpB,UAAU,EAAE,UAAU,EACtB,KAAK,EAAE,KAAK,EACZ,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,OAAO,gBAEf,QAAQ,YACA,EACX;AACJ,EAAC;AAED,aAAa,CAAC,SAAS,GAAG,UAAU;;;;;"}

package/dist/esm/components/comparisonTable/components/AccordionItem/AccordionItem.js

@@ -5,7 +5,7 @@ import { s as styleInject } from '../../../../style-inject.es-1f59c1d0.js';
 import 'react';
 import '../../../../index-e9e37a34.js';
 
-var css_248z = ".AccordionItem-module_container__29xle {\n  width: min-content;\n  width: var(--growContent, min-content);\n  margin: 0 auto;\n}\n\n.AccordionItem-module_container__29xle + .AccordionItem-module_container__29xle {\n  margin-top: 8px;\n}\n\n.AccordionItem-module_chevron__1Pdoe {\n  transition: filter 0.3s ease-in-out, transform 0.2s ease-in-out;\n}\n\n.AccordionItem-module_chevronClosed__1Sq5g {\n  transform: rotate(180deg);\n}\n\n.AccordionItem-module_iconAndTextContainer__1K9NF {\n  column-gap: 12px;\n}\n\n.AccordionItem-module_headerButton__1C03u {\n  border: none;\n  background: #fafaff;\n  column-gap: 16px;\n  cursor: pointer;\n  font-family: inherit;\n  outline: none;\n  position: relative;\n  text-align: inherit;\n  transition: background-color 0.3s ease-in-out, transform 0.2s ease-in-out;\n}\n.AccordionItem-module_headerButton__1C03u:hover {\n  background: #e6e5ff;\n}\n\n.AccordionItem-module_headerButton__1C03u:hover .AccordionItem-module_chevron__1Pdoe {\n  filter: brightness(0.425);\n}";
+var css_248z = ".AccordionItem-module_container__29xle {\n  width: min-content;\n  width: var(--growContent, min-content);\n  margin: 0 auto;\n}\n\n.AccordionItem-module_container__29xle + .AccordionItem-module_container__29xle {\n  margin-top: 8px;\n}\n\n.AccordionItem-module_chevron__1Pdoe {\n  transition: filter 0.3s ease-in-out, transform 0.2s ease-in-out;\n}\n\n.AccordionItem-module_chevronClosed__1Sq5g {\n  transform: rotate(180deg);\n}\n\n.AccordionItem-module_iconAndTextContainer__1K9NF {\n  column-gap: 12px;\n}\n\n.AccordionItem-module_headerButton__1C03u {\n  border: none;\n  background: #fafaff;\n  column-gap: 16px;\n  cursor: pointer;\n  font-family: inherit;\n  outline: none;\n  position: relative;\n  text-align: inherit;\n  transition: background-color 0.3s ease-in-out, transform 0.2s ease-in-out;\n}\n.AccordionItem-module_headerButton__1C03u:hover {\n  background: #ebebff;\n}\n\n.AccordionItem-module_headerButton__1C03u:hover .AccordionItem-module_chevron__1Pdoe {\n  filter: brightness(0.425);\n}";
 var styles = {"container":"AccordionItem-module_container__29xle","chevron":"AccordionItem-module_chevron__1Pdoe","chevronClosed":"AccordionItem-module_chevronClosed__1Sq5g","iconAndTextContainer":"AccordionItem-module_iconAndTextContainer__1K9NF","headerButton":"AccordionItem-module_headerButton__1C03u"};
 styleInject(css_248z);
 

package/dist/esm/components/comparisonTable/components/TableArrows/index.js

@@ -4,7 +4,7 @@ import { c as classnames } from '../../../../index-e9e37a34.js';
 import ArrowIcon from './Arrow.js';
 import { s as styleInject } from '../../../../style-inject.es-1f59c1d0.js';
 
-var css_248z = ".style-module_container__3BxOi {\n  position: absolute;\n  width: 100%;\n  height: 100%;\n  padding: 0 16px;\n  justify-content: space-between;\n  align-items: center;\n  display: flex;\n}\n@media (min-width: 34rem) {\n  .style-module_container__3BxOi {\n    display: none;\n  }\n}\n\n.style-module_next__3yJsi {\n  transform: rotate(-90deg);\n}\n\n.style-module_prev__3rIR_ {\n  transform: rotate(90deg);\n}\n\n.style-module_arrow__1tlbD {\n  width: 32px;\n  height: 32px;\n  z-index: 3;\n  padding: 0;\n  border-radius: 50%;\n  background-color: #f5f6fb;\n  justify-content: center;\n  align-items: center;\n  stroke: #e6e5ff;\n}\n.style-module_arrow__1tlbD:hover, .style-module_arrow__1tlbD:focus {\n  background-color: #f5f6fb;\n  cursor: not-allowed;\n}\n\n.style-module_active__2kklB {\n  stroke: #8e8cee;\n}\n.style-module_active__2kklB:hover, .style-module_active__2kklB:focus {\n  background-color: #f5f6fb;\n  cursor: pointer;\n}";
+var css_248z = ".style-module_container__3BxOi {\n  position: absolute;\n  width: 100%;\n  height: 100%;\n  padding: 0 16px;\n  justify-content: space-between;\n  align-items: center;\n  display: flex;\n}\n@media (min-width: 34rem) {\n  .style-module_container__3BxOi {\n    display: none;\n  }\n}\n\n.style-module_next__3yJsi {\n  transform: rotate(-90deg);\n}\n\n.style-module_prev__3rIR_ {\n  transform: rotate(90deg);\n}\n\n.style-module_arrow__1tlbD {\n  width: 32px;\n  height: 32px;\n  z-index: 3;\n  padding: 0;\n  border-radius: 50%;\n  background-color: #f5f6fb;\n  justify-content: center;\n  align-items: center;\n  stroke: #ebebff;\n}\n.style-module_arrow__1tlbD:hover, .style-module_arrow__1tlbD:focus {\n  background-color: #f5f6fb;\n  cursor: not-allowed;\n}\n\n.style-module_active__2kklB {\n  stroke: #8e8cee;\n}\n.style-module_active__2kklB:hover, .style-module_active__2kklB:focus {\n  background-color: #f5f6fb;\n  cursor: pointer;\n}";
 var styles = {"container":"style-module_container__3BxOi","next":"style-module_next__3yJsi","prev":"style-module_prev__3rIR_","arrow":"style-module_arrow__1tlbD","active":"style-module_active__2kklB"};
 styleInject(css_248z);
 

package/dist/esm/components/comparisonTable/components/TableInfoButton/index.js

@@ -2,7 +2,7 @@ import { _ as __assign } from '../../../../tslib.es6-5bc94358.js';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { s as styleInject } from '../../../../style-inject.es-1f59c1d0.js';
 
-var css_248z = ".style-module_button__3TkNT {\n  padding: 0;\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  vertical-align: bottom;\n  border-radius: 12px;\n  width: 24px;\n  height: 24px;\n  transition: all 0.3s ease;\n}\n.style-module_button__3TkNT:hover, .style-module_button__3TkNT:focus {\n  background-color: #f7f7ff;\n}\n.style-module_button__3TkNT:hover svg, .style-module_button__3TkNT:focus svg {\n  fill: #b1b0f5;\n}\n.style-module_button__3TkNT svg {\n  fill: #e6e5ff;\n  transition: all 0.3s ease;\n}\n.style-module_button__3TkNT:focus-visible {\n  box-shadow: 0 0 0 2px #8e8cee;\n}";
+var css_248z = ".style-module_button__3TkNT {\n  padding: 0;\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  vertical-align: bottom;\n  border-radius: 12px;\n  width: 24px;\n  height: 24px;\n  transition: all 0.3s ease;\n}\n.style-module_button__3TkNT:hover, .style-module_button__3TkNT:focus {\n  background-color: #f7f7ff;\n}\n.style-module_button__3TkNT:hover svg, .style-module_button__3TkNT:focus svg {\n  fill: #b1b0f5;\n}\n.style-module_button__3TkNT svg {\n  fill: #ebebff;\n  transition: all 0.3s ease;\n}\n.style-module_button__3TkNT:focus-visible {\n  box-shadow: 0 0 0 2px #8e8cee;\n}";
 var styles = {"button":"style-module_button__3TkNT"};
 styleInject(css_248z);