@licklist/design 0.45.0-dev.0 → 0.46.0

package/src/iframe/event/event-card/IframeEventCards.stories.tsx

@@ -0,0 +1,598 @@
+import { Meta } from "@storybook/react";
+import React from "react";
+import { boolean, text } from "@storybook/addon-knobs";
+
+import { IframeEventCard } from "./IframeEventCard";
+
+export default {
+  title: "Iframe/Event/Cards",
+  component: IframeEventCard,
+} as Meta;
+
+const DEFAULT_IMAGE =
+  "https://images.unsplash.com/photo-1638988319382-90e61be77c59?ixlib=rb-1.2.1&auto=format&fit=crop&w=687&q=80";
+
+const MOCK_IFRAMES = [
+  {
+    id: "486",
+    title: "Cupcake event",
+    startAt: "Wed Sep 07 2022 16:34:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1179,
+    type: "14:34 - 12:34",
+    cost: 80,
+    description: null,
+  },
+  {
+    id: "294",
+    title: "Check event",
+    startAt: "Wed Sep 07 2022 17:20:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1112,
+    type: "from 15:20",
+    cost: 14,
+    description:
+      "<p>On the other hand, we denounce with righteous indignation and dislike</p><p> men who are so beguiled and demoralized by the charms of pleasure of</p><p> the moment, so blinded by desire, that they cannot foresee the pain</p><p> and trouble that are bound to ensue; and equal blame belongs to those</p><p> who fail in their duty through weakness of will, which is the same as</p><p> saying through shrinking from toil and pain. These cases are perfectly</p><p> simple and easy to distinguish. In a free hour, when our power of</p><p> choice is untrammelled and when nothing prevents our being able to do</p><p> what we like best, every pleasure is to be welcomed and every pain</p><p> avoided. But in certain circumstances and owing to the claims of duty</p><p> or the obligations of business it will frequently occur that pleasures</p><p> have to be repudiated and annoyances accepted. The wise man therefore</p><p> always holds in these matters to this principle of selection: he</p><p> rejects pleasures to secure other greater pleasures, or else he</p><p> endures pains to avoid worse pains.</p>",
+  },
+  {
+    id: "532",
+    title: "EVENTEVENT",
+    startAt: "Wed Sep 07 2022 17:55:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1180,
+    type: "15:55 - 17:55",
+    cost: 14,
+    description: "<p>Description</p>",
+  },
+  {
+    id: "349",
+    title: "Testing Date/End event",
+    startAt: "Thu Sep 08 2022 00:04:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1170,
+    type: "from 22:04",
+    description:
+      "<blockquote><p>Lorem ipsum dolor sit </p><ul><li><p>amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco</p></li></ul><ul><li><p> laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat </p></li><li><p>non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p></li></ul></blockquote>",
+  },
+  {
+    id: "382",
+    title: "Date testing 2",
+    startAt: "Thu Sep 08 2022 14:20:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1172,
+    type: "12:20 - 10:19",
+    description: null,
+  },
+  {
+    id: "487",
+    title: "Cupcake event",
+    startAt: "Thu Sep 08 2022 16:34:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1179,
+    type: "14:34 - 12:34",
+    cost: 80,
+    description: null,
+  },
+  {
+    id: "295",
+    title: "Check event",
+    startAt: "Thu Sep 08 2022 17:20:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1112,
+    type: "from 15:20",
+    cost: 14,
+    description:
+      "<p>On the other hand, we denounce with righteous indignation and dislike</p><p> men who are so beguiled and demoralized by the charms of pleasure of</p><p> the moment, so blinded by desire, that they cannot foresee the pain</p><p> and trouble that are bound to ensue; and equal blame belongs to those</p><p> who fail in their duty through weakness of will, which is the same as</p><p> saying through shrinking from toil and pain. These cases are perfectly</p><p> simple and easy to distinguish. In a free hour, when our power of</p><p> choice is untrammelled and when nothing prevents our being able to do</p><p> what we like best, every pleasure is to be welcomed and every pain</p><p> avoided. But in certain circumstances and owing to the claims of duty</p><p> or the obligations of business it will frequently occur that pleasures</p><p> have to be repudiated and annoyances accepted. The wise man therefore</p><p> always holds in these matters to this principle of selection: he</p><p> rejects pleasures to secure other greater pleasures, or else he</p><p> endures pains to avoid worse pains.</p>",
+  },
+  {
+    id: "331",
+    title: "Solo Party27",
+    startAt: "Thu Sep 08 2022 20:15:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1149,
+    type: "18:15 - 10:22",
+    cost: 66,
+    description: null,
+  },
+  {
+    id: "350",
+    title: "Testing Date/End event",
+    startAt: "Fri Sep 09 2022 00:04:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1170,
+    type: "from 22:04",
+    description:
+      "<blockquote><p>Lorem ipsum dolor sit </p><ul><li><p>amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco</p></li></ul><ul><li><p> laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat </p></li><li><p>non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p></li></ul></blockquote>",
+  },
+  {
+    id: "488",
+    title: "Cupcake event",
+    startAt: "Fri Sep 09 2022 16:34:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1179,
+    type: "14:34 - 12:34",
+    cost: 80,
+    description: null,
+  },
+  {
+    id: "296",
+    title: "Check event",
+    startAt: "Fri Sep 09 2022 17:20:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1112,
+    type: "from 15:20",
+    cost: 14,
+    description:
+      "<p>On the other hand, we denounce with righteous indignation and dislike</p><p> men who are so beguiled and demoralized by the charms of pleasure of</p><p> the moment, so blinded by desire, that they cannot foresee the pain</p><p> and trouble that are bound to ensue; and equal blame belongs to those</p><p> who fail in their duty through weakness of will, which is the same as</p><p> saying through shrinking from toil and pain. These cases are perfectly</p><p> simple and easy to distinguish. In a free hour, when our power of</p><p> choice is untrammelled and when nothing prevents our being able to do</p><p> what we like best, every pleasure is to be welcomed and every pain</p><p> avoided. But in certain circumstances and owing to the claims of duty</p><p> or the obligations of business it will frequently occur that pleasures</p><p> have to be repudiated and annoyances accepted. The wise man therefore</p><p> always holds in these matters to this principle of selection: he</p><p> rejects pleasures to secure other greater pleasures, or else he</p><p> endures pains to avoid worse pains.</p>",
+  },
+  {
+    id: "386",
+    title: "PenEvent",
+    startAt: "Fri Sep 09 2022 17:27:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1174,
+    type: "15:27 - 11:27",
+    cost: 14,
+    description: null,
+  },
+  {
+    id: "533",
+    title: "EVENTEVENT",
+    startAt: "Fri Sep 09 2022 17:55:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1180,
+    type: "15:55 - 17:55",
+    cost: 14,
+    description: "<p>Description</p>",
+  },
+  {
+    id: "427",
+    title: "EVENT-11August",
+    startAt: "Fri Sep 09 2022 21:12:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1175,
+    type: "19:12 - 17:12",
+    cost: 15,
+    description:
+      "<p><strong>On the other hand, we denoun</strong>ce with righteous indignation and dislike</p><p> men who are so beguiled and demoralized by the charms of pleasure of</p><p> the moment, so blinded by desire, that they cannot foresee the pain</p><p> and trouble that are bound to ensue; and equal blame belongs to those</p><p> who fail in their duty throug<strong>h weakness of will, which is the same as</strong></p><p><strong> saying through shrinking from toil and pain. These cases are perfectly</strong></p><p><strong> simple and easy to distinguish. In </strong>a free hour, when our power of</p><p> choice is untramm<s>elled and when nothing prevents our being able to do</s></p><p><s> what we like best, every ple<em>asure is to be welcomed and every pain</em></s></p><p><s><em> avoided. But in certain circumstances and owing to the claims of duty</em></s></p><p><s><em> or the obligations of business </em>it will frequently occur that pleasures</s></p><p><s> have to be repudiated and annoyances accepted. The wise man therefore</s></p><p><s> always holds in these m</s>atters to this principle of selection: he</p><p> rejects pleasures to secure other greater pleasures, or else he</p><p> endures pains to avoid worse pains.</p>",
+  },
+  {
+    id: "351",
+    title: "Testing Date/End event",
+    startAt: "Sat Sep 10 2022 00:04:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1170,
+    type: "from 22:04",
+    description:
+      "<blockquote><p>Lorem ipsum dolor sit </p><ul><li><p>amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco</p></li></ul><ul><li><p> laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat </p></li><li><p>non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p></li></ul></blockquote>",
+  },
+  {
+    id: "283",
+    title: "Modified 2",
+    startAt: "Sat Sep 10 2022 15:12:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1107,
+    type: "from 13:12",
+    cost: 14,
+    description: "<p>New Modified 12346</p>",
+  },
+  {
+    id: "489",
+    title: "Cupcake event",
+    startAt: "Sat Sep 10 2022 16:34:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1179,
+    type: "14:34 - 12:34",
+    cost: 80,
+    description: null,
+  },
+  {
+    id: "297",
+    title: "Check event",
+    startAt: "Sat Sep 10 2022 17:20:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1112,
+    type: "from 15:20",
+    cost: 14,
+    description:
+      "<p>On the other hand, we denounce with righteous indignation and dislike</p><p> men who are so beguiled and demoralized by the charms of pleasure of</p><p> the moment, so blinded by desire, that they cannot foresee the pain</p><p> and trouble that are bound to ensue; and equal blame belongs to those</p><p> who fail in their duty through weakness of will, which is the same as</p><p> saying through shrinking from toil and pain. These cases are perfectly</p><p> simple and easy to distinguish. In a free hour, when our power of</p><p> choice is untrammelled and when nothing prevents our being able to do</p><p> what we like best, every pleasure is to be welcomed and every pain</p><p> avoided. But in certain circumstances and owing to the claims of duty</p><p> or the obligations of business it will frequently occur that pleasures</p><p> have to be repudiated and annoyances accepted. The wise man therefore</p><p> always holds in these matters to this principle of selection: he</p><p> rejects pleasures to secure other greater pleasures, or else he</p><p> endures pains to avoid worse pains.</p>",
+  },
+  {
+    id: "387",
+    title: "PenEvent",
+    startAt: "Sat Sep 10 2022 17:27:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1174,
+    type: "15:27 - 11:27",
+    cost: 14,
+    description: null,
+  },
+  {
+    id: "332",
+    title: "Solo Party27",
+    startAt: "Sat Sep 10 2022 20:15:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1149,
+    type: "18:15 - 10:22",
+    cost: 66,
+    description: null,
+  },
+  {
+    id: "352",
+    title: "Testing Date/End event",
+    startAt: "Sun Sep 11 2022 00:04:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1170,
+    type: "from 22:04",
+    description:
+      "<blockquote><p>Lorem ipsum dolor sit </p><ul><li><p>amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco</p></li></ul><ul><li><p> laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat </p></li><li><p>non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p></li></ul></blockquote>",
+  },
+  {
+    id: "298",
+    title: "Check event",
+    startAt: "Sun Sep 11 2022 17:20:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1112,
+    type: "from 15:20",
+    cost: 14,
+    description:
+      "<p>On the other hand, we denounce with righteous indignation and dislike</p><p> men who are so beguiled and demoralized by the charms of pleasure of</p><p> the moment, so blinded by desire, that they cannot foresee the pain</p><p> and trouble that are bound to ensue; and equal blame belongs to those</p><p> who fail in their duty through weakness of will, which is the same as</p><p> saying through shrinking from toil and pain. These cases are perfectly</p><p> simple and easy to distinguish. In a free hour, when our power of</p><p> choice is untrammelled and when nothing prevents our being able to do</p><p> what we like best, every pleasure is to be welcomed and every pain</p><p> avoided. But in certain circumstances and owing to the claims of duty</p><p> or the obligations of business it will frequently occur that pleasures</p><p> have to be repudiated and annoyances accepted. The wise man therefore</p><p> always holds in these matters to this principle of selection: he</p><p> rejects pleasures to secure other greater pleasures, or else he</p><p> endures pains to avoid worse pains.</p>",
+  },
+  {
+    id: "353",
+    title: "Testing Date/End event",
+    startAt: "Mon Sep 12 2022 00:04:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1170,
+    type: "from 22:04",
+    description:
+      "<blockquote><p>Lorem ipsum dolor sit </p><ul><li><p>amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco</p></li></ul><ul><li><p> laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat </p></li><li><p>non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p></li></ul></blockquote>",
+  },
+  {
+    id: "490",
+    title: "Cupcake event",
+    startAt: "Mon Sep 12 2022 16:34:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1179,
+    type: "14:34 - 12:34",
+    cost: 80,
+    description: null,
+  },
+  {
+    id: "299",
+    title: "Check event",
+    startAt: "Mon Sep 12 2022 17:20:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1112,
+    type: "from 15:20",
+    cost: 14,
+    description:
+      "<p>On the other hand, we denounce with righteous indignation and dislike</p><p> men who are so beguiled and demoralized by the charms of pleasure of</p><p> the moment, so blinded by desire, that they cannot foresee the pain</p><p> and trouble that are bound to ensue; and equal blame belongs to those</p><p> who fail in their duty through weakness of will, which is the same as</p><p> saying through shrinking from toil and pain. These cases are perfectly</p><p> simple and easy to distinguish. In a free hour, when our power of</p><p> choice is untrammelled and when nothing prevents our being able to do</p><p> what we like best, every pleasure is to be welcomed and every pain</p><p> avoided. But in certain circumstances and owing to the claims of duty</p><p> or the obligations of business it will frequently occur that pleasures</p><p> have to be repudiated and annoyances accepted. The wise man therefore</p><p> always holds in these matters to this principle of selection: he</p><p> rejects pleasures to secure other greater pleasures, or else he</p><p> endures pains to avoid worse pains.</p>",
+  },
+  {
+    id: "388",
+    title: "PenEvent",
+    startAt: "Mon Sep 12 2022 17:27:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1174,
+    type: "15:27 - 11:27",
+    cost: 14,
+    description: null,
+  },
+  {
+    id: "534",
+    title: "EVENTEVENT",
+    startAt: "Mon Sep 12 2022 17:55:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1180,
+    type: "15:55 - 17:55",
+    cost: 14,
+    description: "<p>Description</p>",
+  },
+  {
+    id: "354",
+    title: "Testing Date/End event",
+    startAt: "Tue Sep 13 2022 00:04:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1170,
+    type: "from 22:04",
+    description:
+      "<blockquote><p>Lorem ipsum dolor sit </p><ul><li><p>amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco</p></li></ul><ul><li><p> laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat </p></li><li><p>non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p></li></ul></blockquote>",
+  },
+  {
+    id: "300",
+    title: "Check event",
+    startAt: "Tue Sep 13 2022 17:20:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1112,
+    type: "from 15:20",
+    cost: 14,
+    description:
+      "<p>On the other hand, we denounce with righteous indignation and dislike</p><p> men who are so beguiled and demoralized by the charms of pleasure of</p><p> the moment, so blinded by desire, that they cannot foresee the pain</p><p> and trouble that are bound to ensue; and equal blame belongs to those</p><p> who fail in their duty through weakness of will, which is the same as</p><p> saying through shrinking from toil and pain. These cases are perfectly</p><p> simple and easy to distinguish. In a free hour, when our power of</p><p> choice is untrammelled and when nothing prevents our being able to do</p><p> what we like best, every pleasure is to be welcomed and every pain</p><p> avoided. But in certain circumstances and owing to the claims of duty</p><p> or the obligations of business it will frequently occur that pleasures</p><p> have to be repudiated and annoyances accepted. The wise man therefore</p><p> always holds in these matters to this principle of selection: he</p><p> rejects pleasures to secure other greater pleasures, or else he</p><p> endures pains to avoid worse pains.</p>",
+  },
+  {
+    id: "389",
+    title: "PenEvent",
+    startAt: "Tue Sep 13 2022 17:27:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1174,
+    type: "15:27 - 11:27",
+    cost: 14,
+    description: null,
+  },
+  {
+    id: "333",
+    title: "Solo Party27",
+    startAt: "Tue Sep 13 2022 20:15:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1149,
+    type: "18:15 - 10:22",
+    cost: 66,
+    description: null,
+  },
+  {
+    id: "340",
+    title: "Solo2 Party",
+    startAt: "Tue Sep 13 2022 20:18:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1161,
+    type: "18:18 - 10:14",
+    cost: 66,
+    description:
+      "<blockquote><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p></blockquote>",
+  },
+  {
+    id: "355",
+    title: "Testing Date/End event",
+    startAt: "Wed Sep 14 2022 00:04:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1170,
+    type: "from 22:04",
+    description:
+      "<blockquote><p>Lorem ipsum dolor sit </p><ul><li><p>amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco</p></li></ul><ul><li><p> laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat </p></li><li><p>non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p></li></ul></blockquote>",
+  },
+  {
+    id: "491",
+    title: "Cupcake event",
+    startAt: "Wed Sep 14 2022 16:34:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1179,
+    type: "14:34 - 12:34",
+    cost: 80,
+    description: null,
+  },
+  {
+    id: "301",
+    title: "Check event",
+    startAt: "Wed Sep 14 2022 17:20:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1112,
+    type: "from 15:20",
+    cost: 14,
+    description:
+      "<p>On the other hand, we denounce with righteous indignation and dislike</p><p> men who are so beguiled and demoralized by the charms of pleasure of</p><p> the moment, so blinded by desire, that they cannot foresee the pain</p><p> and trouble that are bound to ensue; and equal blame belongs to those</p><p> who fail in their duty through weakness of will, which is the same as</p><p> saying through shrinking from toil and pain. These cases are perfectly</p><p> simple and easy to distinguish. In a free hour, when our power of</p><p> choice is untrammelled and when nothing prevents our being able to do</p><p> what we like best, every pleasure is to be welcomed and every pain</p><p> avoided. But in certain circumstances and owing to the claims of duty</p><p> or the obligations of business it will frequently occur that pleasures</p><p> have to be repudiated and annoyances accepted. The wise man therefore</p><p> always holds in these matters to this principle of selection: he</p><p> rejects pleasures to secure other greater pleasures, or else he</p><p> endures pains to avoid worse pains.</p>",
+  },
+  {
+    id: "535",
+    title: "EVENTEVENT",
+    startAt: "Wed Sep 14 2022 17:55:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1180,
+    type: "15:55 - 17:55",
+    cost: 14,
+    description: "<p>Description</p>",
+  },
+  {
+    id: "356",
+    title: "Testing Date/End event",
+    startAt: "Thu Sep 15 2022 00:04:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1170,
+    type: "from 22:04",
+    description:
+      "<blockquote><p>Lorem ipsum dolor sit </p><ul><li><p>amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco</p></li></ul><ul><li><p> laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat </p></li><li><p>non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p></li></ul></blockquote>",
+  },
+  {
+    id: "383",
+    title: "Date testing 2",
+    startAt: "Thu Sep 15 2022 14:20:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1172,
+    type: "12:20 - 10:19",
+    description: null,
+  },
+  {
+    id: "492",
+    title: "Cupcake event",
+    startAt: "Thu Sep 15 2022 16:34:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1179,
+    type: "14:34 - 12:34",
+    cost: 80,
+    description: null,
+  },
+  {
+    id: "302",
+    title: "Check event",
+    startAt: "Thu Sep 15 2022 17:20:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1112,
+    type: "from 15:20",
+    cost: 14,
+    description:
+      "<p>On the other hand, we denounce with righteous indignation and dislike</p><p> men who are so beguiled and demoralized by the charms of pleasure of</p><p> the moment, so blinded by desire, that they cannot foresee the pain</p><p> and trouble that are bound to ensue; and equal blame belongs to those</p><p> who fail in their duty through weakness of will, which is the same as</p><p> saying through shrinking from toil and pain. These cases are perfectly</p><p> simple and easy to distinguish. In a free hour, when our power of</p><p> choice is untrammelled and when nothing prevents our being able to do</p><p> what we like best, every pleasure is to be welcomed and every pain</p><p> avoided. But in certain circumstances and owing to the claims of duty</p><p> or the obligations of business it will frequently occur that pleasures</p><p> have to be repudiated and annoyances accepted. The wise man therefore</p><p> always holds in these matters to this principle of selection: he</p><p> rejects pleasures to secure other greater pleasures, or else he</p><p> endures pains to avoid worse pains.</p>",
+  },
+  {
+    id: "334",
+    title: "Solo Party27",
+    startAt: "Thu Sep 15 2022 20:15:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1149,
+    type: "18:15 - 10:22",
+    cost: 66,
+    description: null,
+  },
+  {
+    id: "357",
+    title: "Testing Date/End event",
+    startAt: "Fri Sep 16 2022 00:04:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1170,
+    type: "from 22:04",
+    description:
+      "<blockquote><p>Lorem ipsum dolor sit </p><ul><li><p>amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco</p></li></ul><ul><li><p> laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat </p></li><li><p>non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p></li></ul></blockquote>",
+  },
+  {
+    id: "493",
+    title: "Cupcake event",
+    startAt: "Fri Sep 16 2022 16:34:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1179,
+    type: "14:34 - 12:34",
+    cost: 80,
+    description: null,
+  },
+  {
+    id: "303",
+    title: "Check event",
+    startAt: "Fri Sep 16 2022 17:20:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1112,
+    type: "from 15:20",
+    cost: 14,
+    description:
+      "<p>On the other hand, we denounce with righteous indignation and dislike</p><p> men who are so beguiled and demoralized by the charms of pleasure of</p><p> the moment, so blinded by desire, that they cannot foresee the pain</p><p> and trouble that are bound to ensue; and equal blame belongs to those</p><p> who fail in their duty through weakness of will, which is the same as</p><p> saying through shrinking from toil and pain. These cases are perfectly</p><p> simple and easy to distinguish. In a free hour, when our power of</p><p> choice is untrammelled and when nothing prevents our being able to do</p><p> what we like best, every pleasure is to be welcomed and every pain</p><p> avoided. But in certain circumstances and owing to the claims of duty</p><p> or the obligations of business it will frequently occur that pleasures</p><p> have to be repudiated and annoyances accepted. The wise man therefore</p><p> always holds in these matters to this principle of selection: he</p><p> rejects pleasures to secure other greater pleasures, or else he</p><p> endures pains to avoid worse pains.</p>",
+  },
+  {
+    id: "390",
+    title: "PenEvent",
+    startAt: "Fri Sep 16 2022 17:27:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1174,
+    type: "15:27 - 11:27",
+    cost: 14,
+    description: null,
+  },
+  {
+    id: "536",
+    title: "EVENTEVENT",
+    startAt: "Fri Sep 16 2022 17:55:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1180,
+    type: "15:55 - 17:55",
+    cost: 14,
+    description: "<p>Description</p>",
+  },
+  {
+    id: "428",
+    title: "EVENT-11August",
+    startAt: "Fri Sep 16 2022 21:12:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1175,
+    type: "19:12 - 17:12",
+    cost: 15,
+    description:
+      "<p><strong>On the other hand, we denoun</strong>ce with righteous indignation and dislike</p><p> men who are so beguiled and demoralized by the charms of pleasure of</p><p> the moment, so blinded by desire, that they cannot foresee the pain</p><p> and trouble that are bound to ensue; and equal blame belongs to those</p><p> who fail in their duty throug<strong>h weakness of will, which is the same as</strong></p><p><strong> saying through shrinking from toil and pain. These cases are perfectly</strong></p><p><strong> simple and easy to distinguish. In </strong>a free hour, when our power of</p><p> choice is untramm<s>elled and when nothing prevents our being able to do</s></p><p><s> what we like best, every ple<em>asure is to be welcomed and every pain</em></s></p><p><s><em> avoided. But in certain circumstances and owing to the claims of duty</em></s></p><p><s><em> or the obligations of business </em>it will frequently occur that pleasures</s></p><p><s> have to be repudiated and annoyances accepted. The wise man therefore</s></p><p><s> always holds in these m</s>atters to this principle of selection: he</p><p> rejects pleasures to secure other greater pleasures, or else he</p><p> endures pains to avoid worse pains.</p>",
+  },
+  {
+    id: "358",
+    title: "Testing Date/End event",
+    startAt: "Sat Sep 17 2022 00:04:00 GMT+0300 (Eastern European Summer Time)",
+    colour: "",
+    imgSrc: DEFAULT_IMAGE,
+    eventId: 1170,
+    type: "from 22:04",
+    description:
+      "<blockquote><p>Lorem ipsum dolor sit </p><ul><li><p>amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco</p></li></ul><ul><li><p> laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat </p></li><li><p>non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p></li></ul></blockquote>",
+  },
+];
+
+export function Default() {
+  const displayCost = boolean("displayCost", true);
+  const displayType = boolean("displayType", true);
+  const displayDescription = boolean("displayDescription", true);
+  const isListView = boolean("isListView", false);
+  const className = text("className", "event-info");
+
+  return (
+    <div
+      className="events"
+      style={{
+        display: "grid",
+        gridTemplateColumns: isListView ? "1fr" : "repeat(auto-fill, 20rem)",
+        gridGap: "1rem",
+        justifyContent: "center",
+        padding: "1rem",
+      }}
+    >
+      {MOCK_IFRAMES.map((event) => (
+        <div key={event.id}>
+          <IframeEventCard
+            title={event.title}
+            type={event.type}
+            cost={event.cost}
+            date={String(event.startAt)}
+            colour={event.colour}
+            snippetSetting={{
+              includeAvailability: [],
+              includeFromPrice: [],
+            }}
+            imageSrc={event.imgSrc}
+            goToDetails={() => {}}
+            description={event.description}
+            isListView={isListView}
+            className={className}
+            shortDate="07/03/2023"
+          />
+        </div>
+      ))}
+    </div>
+  );
+}

package/src/iframe/event/event-card/index.ts

@@ -0,0 +1,2 @@
+export { IframeEventCard } from "./IframeEventCard";
+export { IframeEventCardSkeleton } from "./IframeEventCardSkeleton";