oolib 2.61.0 → 2.61.1

package/dist/components/Dropdowns/comps/OptionsSingle/styled.js

@@ -54,7 +54,7 @@ exports.StyledOptionsWrapper = styled_components_1.default.ul(templateObject_1 |
             return '24rem';
     }
 });
-exports.StyledOption = styled_components_1.default.li(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n    display: flex;\n    align-items: center;\n    box-sizing: border-box; //this ensures that the padding is contained within the min-height, rather than adding to it\n    padding: 1rem 2rem;\n    ", "\n    ", ";\n\n    background-color: ", ";\n\n    &:hover {\n      background-color: ", ";\n    }\n\n    &:first-of-type {\n      margin-top: 1rem;\n    }\n\n    &:last-of-type {\n      margin-bottom: 1rem;\n    }\n\n    .OKE-Dropdown__optionDesc {\n      @include kp-clamp-text(2);\n      white-space: normal;\n    }\n\n    .OKE-Dropdown__optionImg {\n      flex: 0 0 auto;\n    }\n\n    .OKE-Dropdown__checkboxClickArea {\n      position: absolute;\n      width: 2rem;\n      height: 2rem;\n    }\n    .OKE-Dropdown__checkboxClickArea-box {\n      margin-right: 1rem;\n      flex-shrink: 0;\n    }\n"], ["\n    display: flex;\n    align-items: center;\n    box-sizing: border-box; //this ensures that the padding is contained within the min-height, rather than adding to it\n    padding: 1rem 2rem;\n    ", "\n    ", ";\n\n    background-color: ", ";\n\n    &:hover {\n      background-color: ", ";\n    }\n\n    &:first-of-type {\n      margin-top: 1rem;\n    }\n\n    &:last-of-type {\n      margin-bottom: 1rem;\n    }\n\n    .OKE-Dropdown__optionDesc {\n      @include kp-clamp-text(2);\n      white-space: normal;\n    }\n\n    .OKE-Dropdown__optionImg {\n      flex: 0 0 auto;\n    }\n\n    .OKE-Dropdown__checkboxClickArea {\n      position: absolute;\n      width: 2rem;\n      height: 2rem;\n    }\n    .OKE-Dropdown__checkboxClickArea-box {\n      margin-right: 1rem;\n      flex-shrink: 0;\n    }\n"])), function (_a) {
+exports.StyledOption = styled_components_1.default.li(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n    display: flex;\n    align-items: center;\n    padding: 1rem 2rem;\n    ", "\n    ", ";\n\n    background-color: ", ";\n\n    &:hover {\n      background-color: ", ";\n    }\n\n    &:first-of-type {\n      margin-top: 1rem;\n    }\n\n    &:last-of-type {\n      margin-bottom: 1rem;\n    }\n\n    .OKE-Dropdown__optionDesc {\n      @include kp-clamp-text(2);\n      white-space: normal;\n    }\n\n    .OKE-Dropdown__optionImg {\n      flex: 0 0 auto;\n    }\n\n    .OKE-Dropdown__checkboxClickArea {\n      position: absolute;\n      width: 2rem;\n      height: 2rem;\n    }\n    .OKE-Dropdown__checkboxClickArea-box {\n      margin-right: 1rem;\n      flex-shrink: 0;\n    }\n"], ["\n    display: flex;\n    align-items: center;\n    padding: 1rem 2rem;\n    ", "\n    ", ";\n\n    background-color: ", ";\n\n    &:hover {\n      background-color: ", ";\n    }\n\n    &:first-of-type {\n      margin-top: 1rem;\n    }\n\n    &:last-of-type {\n      margin-bottom: 1rem;\n    }\n\n    .OKE-Dropdown__optionDesc {\n      @include kp-clamp-text(2);\n      white-space: normal;\n    }\n\n    .OKE-Dropdown__optionImg {\n      flex: 0 0 auto;\n    }\n\n    .OKE-Dropdown__checkboxClickArea {\n      position: absolute;\n      width: 2rem;\n      height: 2rem;\n    }\n    .OKE-Dropdown__checkboxClickArea-box {\n      margin-right: 1rem;\n      flex-shrink: 0;\n    }\n"])), function (_a) {
     var S = _a.S;
     return !S
         ? (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n       \n        min-height: 4rem;\n      "], ["\n       \n        min-height: 4rem;\n      "]))) : (0, styled_components_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n      height: 3rem;\n      "], ["\n      height: 3rem;\n      "])));

package/dist/components/VideoInput/comps/EmbedLinkModal.d.ts

@@ -0,0 +1,9 @@
+export function EmbedLinkModal({ id, setShowEmbedLinkModal, value, createVideoPreview, canPlay, onChange, invert }: {
+    id: any;
+    setShowEmbedLinkModal: any;
+    value: any;
+    createVideoPreview: any;
+    canPlay: any;
+    onChange: any;
+    invert: any;
+}): import("react").JSX.Element;

package/dist/components/VideoInput/comps/EmbedLinkModal.js

@@ -0,0 +1,35 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.EmbedLinkModal = void 0;
+var react_1 = require("react");
+var ModalSmall_1 = require("../../Modals/ModalSmall");
+var TextInputs_1 = require("../../TextInputs");
+var Paddings_1 = require("../../Paddings");
+var Buttons_1 = require("../../Buttons");
+var styled_index_1 = require("../styled.index");
+var EmbedLinkModal = function (_a) {
+    var _b;
+    var id = _a.id, setShowEmbedLinkModal = _a.setShowEmbedLinkModal, value = _a.value, createVideoPreview = _a.createVideoPreview, canPlay = _a.canPlay, onChange = _a.onChange, invert = _a.invert;
+    var _c = (0, react_1.useState)(value), localValue = _c[0], setLocalValue = _c[1];
+    return (React.createElement(ModalSmall_1.ModalSmall, { title: "Add URL Embed", subTitle: "Paste the link of the video you want to share. ", 
+        // invert={invert}
+        onClose: function () {
+            setShowEmbedLinkModal(false);
+        } },
+        React.createElement(TextInputs_1.TextInput, { icon: "LinkSimple", onChange: function (k, v) { return setLocalValue(v ? [{ publicUrl: v }] : undefined); }, value: localValue && ((_b = localValue[0]) === null || _b === void 0 ? void 0 : _b.publicUrl), placeholder: "Paste a url here", clearBtn: { icon: 'X' } }),
+        localValue && React.createElement(Paddings_1.PaddingBottom20, null),
+        createVideoPreview({ value: localValue }),
+        React.createElement(styled_index_1.StyledModalActionButtons, null,
+            React.createElement(Buttons_1.ButtonPrimary, { value: "Embed", disabled: !canPlay(localValue) || !localValue, 
+                // invert={invert}
+                onClick: function () {
+                    onChange(id, localValue);
+                    setShowEmbedLinkModal(false);
+                } }),
+            React.createElement(Buttons_1.ButtonGhost, { value: "Cancel", 
+                // invert={invert}
+                onClick: function () {
+                    setShowEmbedLinkModal(false);
+                } }))));
+};
+exports.EmbedLinkModal = EmbedLinkModal;

package/dist/components/VideoInput/index.d.ts

@@ -0,0 +1,16 @@
+export default VideoInput;
+declare function VideoInput({ id, label, sublabel, isRequired, value: _value, onChange, readOnly, light: lightPlayer, enableVideoUpload, isInRTE, invert, files, }: {
+    id: any;
+    label: any;
+    sublabel: any;
+    isRequired: any;
+    value: any;
+    onChange: any;
+    readOnly: any;
+    light: any;
+    enableVideoUpload?: boolean;
+    isInRTE: any;
+    invert: any;
+    files: any;
+}): React.JSX.Element;
+import React from "react";

package/dist/components/VideoInput/index.js

@@ -0,0 +1,207 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = __importStar(require("react"));
+var styled_components_1 = require("styled-components");
+var react_player_1 = __importDefault(require("react-player"));
+var BlockLabel_1 = require("../BlockLabel");
+var styled_index_1 = require("./styled.index");
+var LoadersAndProgress_1 = require("../LoadersAndProgress");
+var Buttons_1 = require("../Buttons");
+var Typo_1 = require("../Typo");
+var EmbedLinkModal_1 = require("./comps/EmbedLinkModal");
+var ActionMenu_1 = require("../ActionMenu");
+var themes_1 = require("../../themes");
+var VideoInput = function (_a) {
+    var id = _a.id, label = _a.label, sublabel = _a.sublabel, isRequired = _a.isRequired, _value = _a.value, onChange = _a.onChange, readOnly = _a.readOnly, lightPlayer = _a.light, _b = _a.enableVideoUpload, enableVideoUpload = _b === void 0 ? false : _b, isInRTE = _a.isInRTE, invert = _a.invert, files = _a.files;
+    //backwards compatibility
+    var value = typeof _value === 'string'
+        ? [{ publicUrl: _value }]
+        : _value;
+    var _c = (0, react_1.useState)(false), showEmbedLinkModal = _c[0], setShowEmbedLinkModal = _c[1];
+    var theme = (0, styled_components_1.useTheme)();
+    var canPlay = function (value) { var _a; return react_player_1.default.canPlay(value && ((_a = value[0]) === null || _a === void 0 ? void 0 : _a.publicUrl)); };
+    var SET_ALERT_BANNER;
+    if (theme && theme.useBannerContext) {
+        var bannerContext = theme.useBannerContext();
+        SET_ALERT_BANNER = bannerContext.SET_ALERT_BANNER;
+    }
+    else {
+        SET_ALERT_BANNER = 'Incorrect video format' /* fallback value / function */;
+    }
+    var _d = (0, react_1.useState)(undefined), uploadProgress = _d[0], setUploadProgress = _d[1];
+    var inputRef = (0, react_1.useRef)();
+    var handleUploadProgess = function (progress) { return setUploadProgress(progress); };
+    var isUploadedVideo = function (value) { return value && Object.keys(value === null || value === void 0 ? void 0 : value[0]).length > 1; };
+    var upload;
+    var isLoading;
+    if (theme && theme.useUploadMedia) {
+        var uploadMediaContext = theme.useUploadMedia({
+            mediaConfigs: {
+                type: "files",
+                folderName: "videos",
+                mediaType: "video",
+            },
+            handleUploadProgess: handleUploadProgess,
+        });
+        if (uploadMediaContext) {
+            upload = uploadMediaContext.mutate;
+            isLoading = uploadMediaContext.isLoading;
+        }
+    }
+    else {
+        upload = uploadVideoToLocalStorage;
+        isLoading = "uploading";
+    }
+    var handleUpload = function (files) {
+        // onChange(id, undefined) //so that the prev video is cleared and loader shows up
+        if (!files)
+            return;
+        if (!upload)
+            return;
+        upload(files, {
+            onSuccess: function (data) {
+                onChange(id, [data[0].fileData]);
+            },
+            onError: function (err) {
+                var _a;
+                SET_ALERT_BANNER(((_a = err.response) === null || _a === void 0 ? void 0 : _a.data.errors[0].msg) || err.message, "red", 3500);
+            },
+        });
+    };
+    (0, react_1.useEffect)(function () {
+        if (files) {
+            handleUpload(files);
+        }
+    }, []);
+    var genVideoActionMenu = function () { return (react_1.default.createElement(styled_index_1.StyledActionButtonWrapper, null,
+        react_1.default.createElement("div", { style: __assign({}, (isInRTE ? { display: "none" } : {})) },
+            react_1.default.createElement(ActionMenu_1.ActionMenu, { popOutOfOverflowHiddenParent: true, ButtonComp: "ButtonPrimary", iconSize: "M", invert: invert, actions: [
+                    isUploadedVideo(value) // Only allow user to replace URL when embed method is URL
+                        ? {
+                            id: "uploadNewVideo",
+                            display: "Upload New Video",
+                            onClick: function () {
+                                inputRef.current.click(); // Trigger file explorer popup
+                            },
+                        }
+                        : {
+                            id: "replaceUrl",
+                            display: "Replace URL",
+                            onClick: function (e) {
+                                setShowEmbedLinkModal(true);
+                            },
+                        },
+                    {
+                        display: "Delete",
+                        onClick: function () { return onChange(undefined); },
+                    },
+                ] })))); };
+    var createVideoPreview = function (_a) {
+        var _b;
+        var value = _a.value, _c = _a.actionMenuButton, actionMenuButton = _c === void 0 ? false : _c;
+        var url = value && ((_b = value[0]) === null || _b === void 0 ? void 0 : _b.publicUrl);
+        switch (true) {
+            case !url:
+                return null;
+            case !canPlay(value):
+                return (react_1.default.createElement(Typo_1.SANS_3_4, { color: themes_1.colors.red }, "Error displaying video. Make sure you've added the right link or you have permission to share publicly."));
+            default:
+                if (url.indexOf("&list=") !== -1) {
+                    var regex = /(?:\?|)v=([a-zA-Z0-9_-]{11})/; //Regular expression to match the video ID in a YouTube link
+                    // 1- Extract the video URL from the playlist link - value.split('&list=')[0]
+                    // 2- Use the regular expression to extract the video ID from the video URL - match(regex)[1]
+                    // 3- Construct the final video URL using the extracted video ID  - value = 'https://www.youtube.com/watch?v=' + value.split('&list=')[0].match(regex)[1];
+                    url =
+                        "https://www.youtube.com/watch?v=" +
+                            url.split("&list=")[0].match(regex)[1];
+                }
+                return (react_1.default.createElement(styled_index_1.StyledVideoEmbedPreviewSection, null,
+                    actionMenuButton && genVideoActionMenu(),
+                    react_1.default.createElement(react_player_1.default, { id: "outVideo", url: url, controls: true, width: "100%", light: lightPlayer, style: { overflow: "hidden" } })));
+        }
+    };
+    return (react_1.default.createElement(react_1.Fragment, null,
+        react_1.default.createElement(BlockLabel_1.BlockLabel, { label: label, sublabel: sublabel, isRequired: isRequired, readOnly: readOnly, invert: invert }),
+        readOnly ? (createVideoPreview({ value: value })) : (react_1.default.createElement(react_1.default.Fragment, null,
+            false ? (react_1.default.createElement(styled_index_1.StyledUploadEmbedBlock, { invert: invert },
+                react_1.default.createElement(styled_index_1.StyledInnerWrapper, null,
+                    react_1.default.createElement(LoadersAndProgress_1.ProgressBar, { progress: uploadProgress, text: uploadProgress && uploadProgress !== 100
+                            ? uploadProgress + "%"
+                            : "Almost Done..." })))) : value ? (createVideoPreview({ value: value, actionMenuButton: true })) : (react_1.default.createElement(styled_index_1.StyledUploadEmbedBlock, { invert: invert },
+                react_1.default.createElement(styled_index_1.StyledInnerWrapper, null,
+                    react_1.default.createElement(Buttons_1.ButtonSecondary, { value: "Add Video link", icon: "Plus", onClick: function () { return setShowEmbedLinkModal(true); }, invert: invert }),
+                    enableVideoUpload && (react_1.default.createElement(react_1.default.Fragment, null,
+                        react_1.default.createElement(Typo_1.SANS_2, { semibold: true, color: invert ? themes_1.colors.white_opacity60 : themes_1.colors.greyColor80 }, "OR"),
+                        react_1.default.createElement(Buttons_1.ButtonSecondary, { onClick: function () { return inputRef.current.click(); }, value: "Upload A Video", icon: "UploadSimple", invert: invert, id: "videoField" })))))),
+            showEmbedLinkModal && (react_1.default.createElement(EmbedLinkModal_1.EmbedLinkModal, __assign({}, {
+                setShowEmbedLinkModal: setShowEmbedLinkModal,
+                value: value,
+                createVideoPreview: createVideoPreview,
+                canPlay: canPlay,
+                onChange: onChange,
+                id: id,
+                invert: invert
+            }))))),
+        react_1.default.createElement("input", { type: "file" // When user clicks on upload new video from action menu inputRef.current.click() this does not work for upload button. this approch deals with that issue.
+            , accept: "video/*", ref: inputRef, style: { display: "none" }, id: "videoField", onChange: function (v) { return handleUpload(v.target.files); } })));
+};
+exports.default = VideoInput;
+function uploadVideoToLocalStorage(videoFile) {
+    console.log({ videoFile: videoFile });
+    // if (!videoFile) return
+    // // Check if the selected file is a Blob
+    // if (!(videoFile[0] instanceof Blob)) {
+    //   console.error('Invalid file type. Please select a video file.');
+    //   return;
+    // }
+    // // Create a new FileReader instance
+    // const reader = new FileReader();
+    // // When the FileReader finishes loading the video file
+    // reader.onloadend = () => {
+    //   // Retrieve the base64-encoded video data
+    //   const base64Data = reader.result;
+    //   // Save the video data to local storage
+    //   localStorage.setItem('uploadedVideo', base64Data);
+    //   // Display a success message or perform any desired actions
+    //   console.log('Video uploaded to local storage successfully.');
+    // };
+    // // Read the video file as a data URL
+    // reader.readAsDataURL(videoFile);
+}

package/dist/components/VideoInput/styled.index.d.ts

@@ -0,0 +1,6 @@
+export const StyledUploadEmbedBlock: import("styled-components").StyledComponent<"div", any, {}, never>;
+export const StyledInnerWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
+export const StyledModalActionButtons: import("styled-components").StyledComponent<"div", any, {}, never>;
+export const StyledVideoEmbedPreviewSection: import("styled-components").StyledComponent<"div", any, {}, never>;
+export const StyledActionButtonWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
+export const StyledGhostButton: import("styled-components").StyledComponent<"div", any, {}, never>;

package/dist/components/VideoInput/styled.index.js

@@ -0,0 +1,27 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StyledGhostButton = exports.StyledActionButtonWrapper = exports.StyledVideoEmbedPreviewSection = exports.StyledModalActionButtons = exports.StyledInnerWrapper = exports.StyledUploadEmbedBlock = void 0;
+var styled_components_1 = __importDefault(require("styled-components"));
+var themes_1 = require("../../themes");
+var mixins_1 = require("../../themes/mixins");
+var primaryColor10 = themes_1.colors.primaryColor10, greyColor100 = themes_1.colors.greyColor100;
+exports.StyledUploadEmbedBlock = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  height: 18rem;\n  background-color: ", ";\n  padding: ", ";\n"], ["\n  height: 18rem;\n  background-color: ", ";\n  padding: ", ";\n"])), function (_a) {
+    var invert = _a.invert;
+    return invert ? greyColor100 : primaryColor10;
+}, function (_a) {
+    var smallPlaceholderUI = _a.smallPlaceholderUI;
+    return !smallPlaceholderUI && '1.2rem';
+});
+exports.StyledInnerWrapper = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  height: 100%;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  flex-direction: column;\n  gap: 1rem;\n  border: 0.2rem dashed ", ";\n  ", "{\n    flex-direction: row;\n  }\n"], ["\n  height: 100%;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  flex-direction: column;\n  gap: 1rem;\n  border: 0.2rem dashed ", ";\n  ", "{\n    flex-direction: row;\n  }\n"])), themes_1.colors.greyColor40, (0, mixins_1.mediaQuery)('sm'));
+exports.StyledModalActionButtons = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  display: flex;\n  padding-top: 2rem;\n  justify-content: flex-start;\n  gap: 2rem;\n"], ["\n  display: flex;\n  padding-top: 2rem;\n  justify-content: flex-start;\n  gap: 2rem;\n"])));
+exports.StyledVideoEmbedPreviewSection = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  position: relative;\n"], ["\n  position: relative;\n"])));
+exports.StyledActionButtonWrapper = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  position: absolute;\n  top: 0;\n  right: 0;\n  z-index: 1000;\n  margin: 0.5rem;\n"], ["\n  position: absolute;\n  top: 0;\n  right: 0;\n  z-index: 1000;\n  margin: 0.5rem;\n"])));
+exports.StyledGhostButton = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  position: absolute;\n  top: 0;\n  right: 0;\n"], ["\n  position: absolute;\n  top: 0;\n  right: 0;\n"])));
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;

package/dist/components/cards/CardContent/index.d.ts

@@ -0,0 +1,10 @@
+export function CardContent({ id, data, config, to, onClick, openInNewTab, actions, }: {
+    id: any;
+    data: any;
+    config: any;
+    to: any;
+    onClick: any;
+    openInNewTab: any;
+    actions: any;
+}): React.JSX.Element;
+import React from "react";

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

@@ -0,0 +1,97 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CardContent = void 0;
+var react_1 = __importStar(require("react"));
+var react_router_dom_1 = require("react-router-dom");
+var VideoInput_1 = __importDefault(require("../../VideoInput"));
+var styled_1 = require("./styled");
+var styled_components_1 = require("styled-components");
+var isExternalUrl_1 = require("../utils/isExternalUrl");
+var parseCardConfig_1 = require("../utils/parseCardConfig");
+var LineClampWrapper_1 = require("../comps/LineClampWrapper");
+var CardMetaBlock_1 = __importDefault(require("../comps/CardMetaBlock"));
+var Typo_1 = require("../../Typo");
+var injectHttps_1 = require("../../../utils/injectHttps");
+var ActionMenu_1 = require("../../ActionMenu");
+var icons_1 = require("../../../icons");
+var utilsOolib_1 = require("../../../utilsOolib");
+var renderImagePlaceholderForOolibPreview_1 = require("../../../utilsOolib/renderImagePlaceholderForOolibPreview");
+var decideLinkCompAndTarget_1 = require("../utils/decideLinkCompAndTarget");
+var dontRenderIfBothOnClickAndTo_1 = require("../utils/dontRenderIfBothOnClickAndTo");
+var ArrowLineUpRight = icons_1.icons.ArrowLineUpRight;
+var CardContent = function (_a) {
+    var id = _a.id, data = _a.data, config = _a.config, to = _a.to, onClick = _a.onClick, openInNewTab = _a.openInNewTab, actions = _a.actions;
+    var theme = (0, styled_components_1.useTheme)();
+    var localize = (0, utilsOolib_1.useLocale)();
+    var _b = theme || {}, ImageInput = _b.ImageInput, parseSpecialSyntax = _b.parseSpecialSyntax;
+    var showEmbedSection = !!((config === null || config === void 0 ? void 0 : config.image) || (config === null || config === void 0 ? void 0 : config.video));
+    var _c = (0, parseCardConfig_1.parseCardConfig)({
+        config: config,
+        data: data,
+        parseSpecialSyntax: parseSpecialSyntax,
+        localize: localize,
+    }), cardLabel = _c.cardLabel, title = _c.title, titleOptional = _c.titleOptional, video = _c.video, image = _c.image, metaBlockData = _c.metaBlockData;
+    var dontRenderRes = (0, dontRenderIfBothOnClickAndTo_1.dontRenderIfBothOnClickAndTo)({ onClick: onClick, to: to });
+    if (dontRenderRes)
+        return dontRenderRes;
+    var _d = (0, decideLinkCompAndTarget_1.decideLinkCompAndTarget)({ to: to, openInNewTab: openInNewTab }), LinkComp = _d.LinkComp, target = _d.target, externalUrl = _d.externalUrl;
+    return (react_1.default.createElement(LinkComp, { target: target, href: (0, injectHttps_1.injectHttps)(to), to: to },
+        react_1.default.createElement(styled_1.StyledCardWrapper, { id: id, onClick: onClick },
+            react_1.default.createElement(styled_1.StyledUpperSection, null,
+                react_1.default.createElement(styled_1.StyledContainer1, null,
+                    cardLabel ? (react_1.default.createElement("div", { title: cardLabel, style: {
+                            display: "flex",
+                            gap: "2rem",
+                            justifyContent: "space-between",
+                        } },
+                        react_1.default.createElement(Typo_1.LABEL, { style: {
+                                textOverflow: "ellipsis",
+                                overflow: "hidden",
+                                whiteSpace: "nowrap",
+                            }, color: (0, utilsOolib_1.getPrimaryColorText)(theme === null || theme === void 0 ? void 0 : theme.colors) }, cardLabel),
+                        react_1.default.createElement("div", { style: { marginTop: "-1rem", marginRight: "-1rem" } }, actions && react_1.default.createElement(ActionMenu_1.ActionMenu, { actions: actions })))) : null,
+                    titleOptional ? (react_1.default.createElement(LineClampWrapper_1.LineClampWrapper, { noOfLines_M: 6, title: titleOptional },
+                        react_1.default.createElement(Typo_1.SANS_4_5, { semibold: true, style: { wordBreak: "break-word" }, capitalize: true }, titleOptional))) : null,
+                    title ? (react_1.default.createElement("div", { style: { display: "flex", alignItems: "end", gap: ".5rem" } },
+                        " ",
+                        react_1.default.createElement(LineClampWrapper_1.LineClampWrapper, { noOfLines_M: 6, title: titleOptional },
+                            react_1.default.createElement(Typo_1.SERIF_5_6, { style: { wordBreak: "break-word" }, capitalize: true }, title)))) : null),
+                metaBlockData ? (react_1.default.createElement(CardMetaBlock_1.default, { value: metaBlockData.slice(0, 2) }) //show only two meta for cardContent
+                ) : null),
+            showEmbedSection ? (react_1.default.createElement(styled_1.StyledEmbedSection, null,
+                (video === null || video === void 0 ? void 0 : video.length) > 0 ? (react_1.default.createElement("div", { style: { width: "100%" } },
+                    react_1.default.createElement(VideoInput_1.default, { value: video, readOnly: true, light: true }))) : null,
+                (image === null || image === void 0 ? void 0 : image.length) > 0 && !video ? (react_1.default.createElement("div", { style: { width: "100%" } }, !ImageInput ? ((0, renderImagePlaceholderForOolibPreview_1.renderImagePlaceholderForOolibPreview)({
+                    tooltipPos: "right",
+                    width: "100%",
+                    height: "100px",
+                    borderRadius: 0,
+                })) : (react_1.default.createElement(ImageInput, { value: image, aspectRatio: image.aspectRatio || "5/3", containerShape: image.containerShape, readOnly: true, defaultImageSpread: "cover", enableCaptions: false, disableImageBorder: true })))) : null)) : null)));
+};
+exports.CardContent = CardContent;

package/dist/components/cards/CardContent/styled.d.ts

@@ -0,0 +1,5 @@
+export const StyledContainer1: import("styled-components").StyledComponent<"div", any, {}, never>;
+export const StyledMetaBlock: import("styled-components").StyledComponent<"div", any, {}, never>;
+export const StyledEmbedSection: import("styled-components").StyledComponent<"div", any, {}, never>;
+export const StyledCardWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
+export const StyledUpperSection: import("styled-components").StyledComponent<"div", any, {}, never>;

package/dist/components/cards/CardContent/styled.js

@@ -0,0 +1,41 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StyledUpperSection = exports.StyledCardWrapper = exports.StyledEmbedSection = exports.StyledMetaBlock = exports.StyledContainer1 = void 0;
+var styled_components_1 = __importStar(require("styled-components"));
+var colors_1 = require("../../../themes/colors");
+var transitions_1 = require("../../../themes/mixins/transitions");
+var greyColor5 = colors_1.colors.greyColor5, white = colors_1.colors.white;
+var flexColumn = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n"], ["\n  display: flex;\n  flex-direction: column;\n"])));
+exports.StyledContainer1 = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  ", "\n  gap: 1rem;\n"], ["\n  ", "\n  gap: 1rem;\n"])), flexColumn);
+exports.StyledMetaBlock = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  display: flex;\n  gap: 0.5em;\n"], ["\n  display: flex;\n  gap: 0.5em;\n"])));
+exports.StyledEmbedSection = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  height: 100px;\n  display: flex;\n  align-items: center;\n  overflow: hidden;\n  width: 100%;\n"], ["\n  height: 100px;\n  display: flex;\n  align-items: center;\n  overflow: hidden;\n  width: 100%;\n"])));
+exports.StyledCardWrapper = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  height: 100%;\n  border: 2px solid ", ";\n  background-color: ", ";\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n\n  ", "\n\n  cursor: pointer;\n  :hover {\n    background-color: ", ";\n  }\n"], ["\n  height: 100%;\n  border: 2px solid ", ";\n  background-color: ", ";\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n\n  ", "\n\n  cursor: pointer;\n  :hover {\n    background-color: ", ";\n  }\n"])), greyColor5, greyColor5, (0, transitions_1.transition)("background-color"), white);
+exports.StyledUpperSection = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  /* height: 100%; */\n  flex-grow: 1;\n  justify-content: space-between;\n\n  padding: 2rem;\n  ", "\n  gap: 3rem;\n"], ["\n  /* height: 100%; */\n  flex-grow: 1;\n  justify-content: space-between;\n\n  padding: 2rem;\n  ", "\n  gap: 3rem;\n"])), flexColumn);
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;

package/dist/components/cards/ListContent/index.d.ts

@@ -0,0 +1,12 @@
+export function ListContent({ id, data, config, to, onClick, openInNewTab, actions, disabled, statusTag, }: {
+    id: any;
+    data: any;
+    config: any;
+    to: any;
+    onClick: any;
+    openInNewTab: any;
+    actions: any;
+    disabled: any;
+    statusTag: any;
+}): React.JSX.Element;
+import React from "react";

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

@@ -0,0 +1,75 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ListContent = void 0;
+var react_1 = __importDefault(require("react"));
+var parseCardConfig_1 = require("../utils/parseCardConfig");
+var styled_js_1 = require("./styled.js");
+var styled_components_1 = require("styled-components");
+var decideLinkCompAndTarget_1 = require("../utils/decideLinkCompAndTarget");
+var dontRenderIfBothOnClickAndTo_1 = require("../utils/dontRenderIfBothOnClickAndTo");
+var ActionMenu_1 = require("../../ActionMenu");
+var Typo_1 = require("../../Typo");
+var Tags_1 = require("../../Tags");
+var LineClampWrapper_1 = require("../comps/LineClampWrapper");
+var VideoInput_1 = __importDefault(require("../../VideoInput"));
+var CardMetaBlock_1 = __importDefault(require("../comps/CardMetaBlock"));
+var injectHttps_1 = require("../../../utils/injectHttps");
+var utilsOolib_1 = require("../../../utilsOolib");
+var themes_1 = require("../../../themes");
+var icons_1 = require("../../../icons");
+var renderImagePlaceholderForOolibPreview_1 = require("../../../utilsOolib/renderImagePlaceholderForOolibPreview");
+var greyColor100 = themes_1.colors.greyColor100, greyColor40 = themes_1.colors.greyColor40, greyColor15 = themes_1.colors.greyColor15;
+var ArrowLineUpRight = icons_1.icons.ArrowLineUpRight;
+var ListContent = function (_a) {
+    var id = _a.id, data = _a.data, config = _a.config, to = _a.to, onClick = _a.onClick, openInNewTab = _a.openInNewTab, actions = _a.actions, disabled = _a.disabled, statusTag = _a.statusTag;
+    var theme = (0, styled_components_1.useTheme)();
+    var localize = (0, utilsOolib_1.useLocale)();
+    var _b = theme || {}, ImageInput = _b.ImageInput, parseSpecialSyntax = _b.parseSpecialSyntax;
+    var _c = (0, parseCardConfig_1.parseCardConfig)({ config: config, data: data, parseSpecialSyntax: parseSpecialSyntax, localize: localize }), cardLabel = _c.cardLabel, title = _c.title, titleOptional = _c.titleOptional, video = _c.video, image = _c.image, metaBlockData = _c.metaBlockData;
+    var dontRenderRes = (0, dontRenderIfBothOnClickAndTo_1.dontRenderIfBothOnClickAndTo)({ onClick: onClick, to: to });
+    if (dontRenderRes)
+        return dontRenderRes;
+    var _d = (0, decideLinkCompAndTarget_1.decideLinkCompAndTarget)({
+        to: to,
+        openInNewTab: openInNewTab,
+    }), LinkComp = _d.LinkComp, target = _d.target, externalUrl = _d.externalUrl;
+    return (react_1.default.createElement(LinkComp, { target: target, href: (0, injectHttps_1.injectHttps)(to), to: to },
+        react_1.default.createElement(styled_js_1.StyledListElemContainer, { id: id, onClick: onClick, disableHover: disabled ? true : false },
+            react_1.default.createElement(styled_js_1.StyledListWrapper, null,
+                react_1.default.createElement(styled_js_1.StyledHeader, null,
+                    react_1.default.createElement(styled_js_1.StyledStatusTagCardLabelWrapper, null,
+                        cardLabel && (react_1.default.createElement("div", { title: cardLabel },
+                            react_1.default.createElement(styled_js_1.StyledLabel, { color: (0, utilsOolib_1.getPrimaryColorText)(theme === null || theme === void 0 ? void 0 : theme.colors) }, cardLabel))),
+                        statusTag && (react_1.default.createElement(Tags_1.TagDisplay, { variant: "secondary", XS: true, display: statusTag }))),
+                    titleOptional && (react_1.default.createElement(LineClampWrapper_1.LineClampWrapper, { noOfLines_M: 6, noOfLines_D: 3, title: titleOptional },
+                        " ",
+                        react_1.default.createElement(Typo_1.SANS_5_6, { color: greyColor100 }, titleOptional))),
+                    title ? (react_1.default.createElement("div", { style: {
+                            paddingBottom: "1rem",
+                            display: "flex",
+                            alignItems: "end",
+                        } },
+                        react_1.default.createElement(LineClampWrapper_1.LineClampWrapper, { noOfLines_M: 6, noOfLines_D: 3, title: title },
+                            react_1.default.createElement(styled_js_1.StyledTitle, { capitalize: true, className: "StyledTitle" },
+                                react_1.default.createElement(styled_js_1.StyledTitleSpan, { className: "StyledTitleSpan" }, title))))) : null,
+                    react_1.default.createElement(styled_js_1.StyledMeta, null, metaBlockData && (react_1.default.createElement(CardMetaBlock_1.default, { value: metaBlockData.slice(0, 3) }) // show only three metas for listContent
+                    ))),
+                react_1.default.createElement(styled_js_1.StyledContentModule2, null,
+                    (video === null || video === void 0 ? void 0 : video.length) > 0 && (react_1.default.createElement(styled_js_1.StyledMediaWrapper, null,
+                        react_1.default.createElement("div", { style: { width: "14rem", border: "1px solid ".concat(greyColor15) } },
+                            react_1.default.createElement(VideoInput_1.default, { value: video, readOnly: true, light: true })))),
+                    (image === null || image === void 0 ? void 0 : image.length) > 0 && !video && (react_1.default.createElement(styled_js_1.StyledMediaWrapper, null, !ImageInput ? ((0, renderImagePlaceholderForOolibPreview_1.renderImagePlaceholderForOolibPreview)({
+                        width: "100%",
+                        height: "100%",
+                        borderRadius: 0,
+                    })) : (react_1.default.createElement("div", { style: {
+                            width: "14rem",
+                            border: "1px solid ".concat(greyColor15),
+                        } },
+                        react_1.default.createElement(ImageInput, { value: image, aspectRatio: image.aspectRatio || "5/3", containerShape: image.containerShape, readOnly: true, enableCaptions: false, disableImageBorder: true, defaultImageSpread: "cover" }))))),
+                    actions && react_1.default.createElement(ActionMenu_1.ActionMenu, { actions: actions, align: "right" }))))));
+};
+exports.ListContent = ListContent;

package/dist/components/cards/ListContent/styled.d.ts

@@ -0,0 +1,10 @@
+export const StyledListElemContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export const StyledStatusTagCardLabelWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
+export const StyledHeader: import("styled-components").StyledComponent<"div", any, {}, never>;
+export const StyledLabel: import("styled-components").StyledComponent<(props: any) => import("react").JSX.Element, any, {}, never>;
+export const StyledTitle: import("styled-components").StyledComponent<(props: any) => import("react").JSX.Element, any, {}, never>;
+export const StyledListWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
+export const StyledTitleSpan: import("styled-components").StyledComponent<"span", any, {}, never>;
+export const StyledContentModule2: import("styled-components").StyledComponent<"div", any, {}, never>;
+export const StyledMediaWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
+export const StyledMeta: import("styled-components").StyledComponent<"div", any, {}, never>;

package/dist/components/cards/ListContent/styled.js

@@ -0,0 +1,67 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StyledMeta = exports.StyledMediaWrapper = exports.StyledContentModule2 = exports.StyledTitleSpan = exports.StyledListWrapper = exports.StyledTitle = exports.StyledLabel = exports.StyledHeader = exports.StyledStatusTagCardLabelWrapper = exports.StyledListElemContainer = void 0;
+var styled_components_1 = __importStar(require("styled-components"));
+var utilsOolib_1 = require("../../../utilsOolib");
+var themes_1 = require("../../../themes");
+var Typo_1 = require("../../Typo");
+var mixins_1 = require("../../../themes/mixins");
+exports.StyledListElemContainer = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  border-bottom: 1px solid ", ";\n  margin-bottom: 2rem;\n  padding-bottom: 2rem;\n  cursor: ", ";\n  ", "\n"], ["\n  border-bottom: 1px solid ", ";\n  margin-bottom: 2rem;\n  padding-bottom: 2rem;\n  cursor: ", ";\n  ", "\n"])), themes_1.colors.greyColor15, function (_a) {
+    var disableHover = _a.disableHover;
+    return !disableHover ? 'pointer' : '';
+}, function (_a) {
+    var disableHover = _a.disableHover;
+    return !disableHover && (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n      &:hover {\n        .StyledTitle {\n          color: ", ";\n        }\n\n        .StyledTitleSpan {\n          //animate the underline created by the mixin : underlineForAnimation\n          ", "\n        }\n      }\n    "], ["\n      &:hover {\n        .StyledTitle {\n          color: ", ";\n        }\n\n        .StyledTitleSpan {\n          //animate the underline created by the mixin : underlineForAnimation\n          ", "\n        }\n      }\n    "])), function (_a) {
+        var theme = _a.theme;
+        return (0, utilsOolib_1.getPrimaryColorText)(theme === null || theme === void 0 ? void 0 : theme.colors);
+    }, function (_a) {
+        var theme = _a.theme;
+        return (0, mixins_1.multilineUnderline)({
+            color: (0, utilsOolib_1.getPrimaryColor100)(theme === null || theme === void 0 ? void 0 : theme.colors),
+            thickness: '2px',
+        }).hovered;
+    });
+});
+exports.StyledStatusTagCardLabelWrapper = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  display: flex;\n  gap: 1rem;\n  align-items: center;\n  flex-wrap: wrap;\n"], ["\n  display: flex;\n  gap: 1rem;\n  align-items: center;\n  flex-wrap: wrap;\n"])));
+exports.StyledHeader = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  display: flex;\n  align-items: flex-start;\n  flex-direction: column;\n  flex-wrap: wrap;\n  gap: .7rem;\n"], ["\n  display: flex;\n  align-items: flex-start;\n  flex-direction: column;\n  flex-wrap: wrap;\n  gap: .7rem;\n"])));
+exports.StyledLabel = (0, styled_components_1.default)(Typo_1.LABEL)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  ", ";\n  max-width: 23rem;\n  ", "{\n    max-width: 40rem;\n  }\n"], ["\n  ", ";\n  max-width: 23rem;\n  ", "{\n    max-width: 40rem;\n  }\n"])), mixins_1.ellipsis, (0, mixins_1.mediaQuery)("sm"));
+exports.StyledTitle = (0, styled_components_1.default)(Typo_1.SERIF_4_5)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  /* position: relative;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  width: 23rem;\n  gap: 1rem;\n  ", "{\n    width: 40rem;\n  }   */\n  ", "\n"], ["\n  /* position: relative;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  width: 23rem;\n  gap: 1rem;\n  ", "{\n    width: 40rem;\n  }   */\n  ", "\n"])), (0, mixins_1.mediaQuery)("sm"), (0, mixins_1.transition)("color"));
+exports.StyledListWrapper = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  width: auto;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n"], ["\n  width: auto;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n"])));
+exports.StyledTitleSpan = styled_components_1.default.span(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n  margin: 2em 0;\n  margin-right: .5rem;\n  background-repeat: no-repeat;\n  ", "\n  ", "\n"], ["\n  margin: 2em 0;\n  margin-right: .5rem;\n  background-repeat: no-repeat;\n  ", "\n  ", "\n"])), function (_a) {
+    var theme = _a.theme;
+    return (0, mixins_1.multilineUnderline)({
+        color: (0, utilsOolib_1.getPrimaryColor100)(theme === null || theme === void 0 ? void 0 : theme.colors),
+        thickness: '2px',
+    }).init;
+}, (0, mixins_1.transition)("background-size 0.5s"));
+exports.StyledContentModule2 = styled_components_1.default.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n  justify-content: center;\n  display: flex;\n  align-items: flex-end;\n  position: relative;\n  padding: 0 2rem;\n  row-gap: 1rem;\n  column-gap: 0;\n  flex-direction: column-reverse;\n  ", " {\n    flex-direction: row;\n    align-items: center;\n    row-gap: 0;\n    column-gap: 1rem;\n  }\n"], ["\n  justify-content: center;\n  display: flex;\n  align-items: flex-end;\n  position: relative;\n  padding: 0 2rem;\n  row-gap: 1rem;\n  column-gap: 0;\n  flex-direction: column-reverse;\n  ", " {\n    flex-direction: row;\n    align-items: center;\n    row-gap: 0;\n    column-gap: 1rem;\n  }\n"])), (0, mixins_1.mediaQuery)("sm"));
+exports.StyledMediaWrapper = styled_components_1.default.div(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n  width: 70px;\n  height: 84px;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  overflow: hidden;\n  flex-wrap: wrap;\n  ", " {\n    width: 6rem;\n    height: 6rem;\n  }\n"], ["\n  width: 70px;\n  height: 84px;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  overflow: hidden;\n  flex-wrap: wrap;\n  ", " {\n    width: 6rem;\n    height: 6rem;\n  }\n"])), (0, mixins_1.mediaQuery)("sm"));
+exports.StyledMeta = styled_components_1.default.div(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), mixins_1.ellipsis);
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11;

package/dist/components/cards/comps/CardMetaBlock/index.d.ts

@@ -0,0 +1,5 @@
+export default CardMetaBlock;
+declare function CardMetaBlock({ value }: {
+    value: any;
+}): React.JSX.Element;
+import React from "react";

package/dist/components/cards/comps/CardMetaBlock/index.js

@@ -0,0 +1,49 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = __importStar(require("react"));
+var styled_components_1 = __importDefault(require("styled-components"));
+var themes_1 = require("../../../../themes");
+var Typo_1 = require("../../../Typo");
+var greyColor100 = themes_1.colors.greyColor100;
+var StyledContainer = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  gap: 1rem;\n  flex-wrap: wrap;\n"], ["\n  display: flex;\n  align-items: center;\n  gap: 1rem;\n  flex-wrap: wrap;\n"])));
+var StyledMetaWrapper = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: flex; \n  align-items: center;\n"], ["\n  display: flex; \n  align-items: center;\n"])));
+var StyledSeparator = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  width: 0.3rem;\n  height: 0.3rem;\n  border-radius: 50%;\n  background-color: ", ";\n"], ["\n  width: 0.3rem;\n  height: 0.3rem;\n  border-radius: 50%;\n  background-color: ", ";\n"])), greyColor100);
+var CardMetaBlock = function (_a) {
+    var value = _a.value;
+    return (react_1.default.createElement(StyledContainer, null, value.map(function (v, i) { return (react_1.default.createElement(react_1.Fragment, null,
+        react_1.default.createElement(StyledMetaWrapper, { key: i },
+            react_1.default.createElement(Typo_1.SANS_2, { capitalize: true }, v)),
+        i + 1 === value.length ? null : react_1.default.createElement(StyledSeparator, null))); })));
+};
+exports.default = CardMetaBlock;
+var templateObject_1, templateObject_2, templateObject_3;

package/dist/components/cards/comps/LineClampWrapper/index.d.ts

@@ -0,0 +1,7 @@
+export function LineClampWrapper({ title, children, noOfLines_D, noOfLines_M }: {
+    title: any;
+    children: any;
+    noOfLines_D: any;
+    noOfLines_M: any;
+}): React.JSX.Element;
+import React from "react";

package/dist/components/cards/comps/LineClampWrapper/index.js

@@ -0,0 +1,26 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.LineClampWrapper = void 0;
+var react_1 = __importDefault(require("react"));
+var styled_components_1 = __importDefault(require("styled-components"));
+var mixins_1 = require("../../../../themes/mixins");
+var LineClampWrapperStyled = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  ", "\n\n  ", " {\n    ", "\n  }\n"], ["\n  ", "\n\n  ", " {\n    ", "\n  }\n"])), function (_a) {
+    var noOfLines_D = _a.noOfLines_D, noOfLines_M = _a.noOfLines_M;
+    return (noOfLines_M && (0, mixins_1.clampText)(noOfLines_M)) || (noOfLines_D && (0, mixins_1.clampText)(noOfLines_D));
+}, (0, mixins_1.mediaQuery)("sm"), function (_a) {
+    var noOfLines_D = _a.noOfLines_D, noOfLines_M = _a.noOfLines_M;
+    return (noOfLines_D && (0, mixins_1.clampText)(noOfLines_D)) || (noOfLines_M && (0, mixins_1.clampText)(noOfLines_M));
+});
+var LineClampWrapper = function (_a) {
+    var title = _a.title, children = _a.children, noOfLines_D = _a.noOfLines_D, noOfLines_M = _a.noOfLines_M;
+    return (react_1.default.createElement(LineClampWrapperStyled, { title: title, noOfLines_D: noOfLines_D, noOfLines_M: noOfLines_M }, children));
+};
+exports.LineClampWrapper = LineClampWrapper;
+var templateObject_1;

package/dist/components/cards/utils/decideLinkCompAndTarget.d.ts

@@ -0,0 +1,8 @@
+export function decideLinkCompAndTarget({ to, openInNewTab }: {
+    to: any;
+    openInNewTab: any;
+}): {
+    LinkComp: any;
+    target: string;
+    externalUrl: boolean;
+};

package/dist/components/cards/utils/decideLinkCompAndTarget.js

@@ -0,0 +1,22 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.decideLinkCompAndTarget = void 0;
+var react_1 = require("react");
+var isExternalUrl_1 = require("./isExternalUrl");
+var react_router_dom_1 = require("react-router-dom");
+var decideLinkCompAndTarget = function (_a) {
+    var to = _a.to, openInNewTab = _a.openInNewTab;
+    var externalUrl = (0, isExternalUrl_1.isExternalUrl)(to);
+    var LinkComp = externalUrl === null ? react_1.Fragment : externalUrl ? "a" : react_router_dom_1.Link;
+    /* openInNewTab is explicitly defined, then listen to whatever it says else
+       by default externalUrl will open in new tab, internalUrl will not.*/
+    var target = openInNewTab === true
+        ? "_blank"
+        : openInNewTab === false
+            ? "_self"
+            : externalUrl
+                ? "_blank"
+                : "_self";
+    return { LinkComp: LinkComp, target: target, externalUrl: externalUrl };
+};
+exports.decideLinkCompAndTarget = decideLinkCompAndTarget;

package/dist/components/cards/utils/dontRenderIfBothOnClickAndTo.d.ts

@@ -0,0 +1,5 @@
+export function dontRenderIfBothOnClickAndTo({ onClick, to }: {
+    onClick: any;
+    to: any;
+}): React.JSX.Element;
+import React from "react";

package/dist/components/cards/utils/dontRenderIfBothOnClickAndTo.js

@@ -0,0 +1,18 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.dontRenderIfBothOnClickAndTo = void 0;
+var react_1 = __importDefault(require("react"));
+var Typo_1 = require("../../Typo");
+var dontRenderIfBothOnClickAndTo = function (_a) {
+    var onClick = _a.onClick, to = _a.to;
+    if (onClick && to) {
+        return (react_1.default.createElement(Typo_1.SANS_4_5, { color: "red" }, "Only one prop is allowed for this component - \"to\" or \"onClick\" ."));
+    }
+    else {
+        return undefined;
+    }
+};
+exports.dontRenderIfBothOnClickAndTo = dontRenderIfBothOnClickAndTo;

package/dist/components/cards/utils/isExternalUrl.d.ts

@@ -0,0 +1 @@
+export function isExternalUrl(to: any): boolean;

package/dist/components/cards/utils/isExternalUrl.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.isExternalUrl = void 0;
+var isExternalUrl = function (to) { return to ? (to.charAt(0) === "/" ? false : true) : null; };
+exports.isExternalUrl = isExternalUrl;

package/dist/components/cards/utils/parseCardConfig.d.ts

@@ -0,0 +1,15 @@
+export function parseCardConfig({ config, data, localize, parseSpecialSyntax, }: {
+    config: any;
+    data: any;
+    localize: any;
+    parseSpecialSyntax?: () => any;
+}): {
+    title: string;
+    titleOptional: string;
+    desc: string;
+    cardLabel: any;
+    video: any;
+    image: any;
+    metaBlockData: any;
+    tagDisplay: any;
+};

package/dist/components/cards/utils/parseCardConfig.js

@@ -0,0 +1,56 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.parseCardConfig = void 0;
+var getText_1 = require("../../../utils/getText");
+var getVal_1 = require("../../../utils/getterSetterDeleter/getVal");
+var createFormattedDate_1 = require("../../../utils/momentjs/createFormattedDate");
+var parseCardConfig = function (_a) {
+    var _b;
+    var config = _a.config, data = _a.data, localize = _a.localize, _c = _a.parseSpecialSyntax, parseSpecialSyntax = _c === void 0 ? function () { return undefined; } : _c;
+    var title = config.title && (0, getText_1.getText)((0, getVal_1.getVal)(data, config.title)); //getText converts richtext into plain. and leaves plain text unchanged
+    var titleOptional = config.titleOptional && (0, getText_1.getText)((0, getVal_1.getVal)(data, config.titleOptional));
+    var desc = config.desc && (0, getText_1.getText)((0, getVal_1.getVal)(data, config.desc));
+    var cardLabel = config.cardLabel &&
+        (parseSpecialSyntax({ string: config.cardLabel, content: data }) ||
+            (0, getVal_1.getVal)(data, config.cardLabel));
+    var video = config.video && (0, getVal_1.getVal)(data, config.video);
+    var tagDisplay = config.tagDisplay && (0, getVal_1.getVal)(data, config.tagDisplay);
+    var image = config.image && (0, getVal_1.getVal)(data, config.image);
+    var metaBlockData = (_b = config.metaBlock) === null || _b === void 0 ? void 0 : _b.map(function (d) {
+        var key = d.key;
+        var valuePath = d.valuePath;
+        var prefix = d.prefix;
+        var returnValue;
+        switch (key) {
+            case "name":
+                returnValue = (0, getVal_1.getVal)(data, valuePath);
+                //reduce surname down to initials
+                var split = returnValue.split(" ");
+                var name_1 = split[0];
+                var surname = split[1];
+                returnValue = "".concat(name_1).concat(surname ? " ".concat(surname[0], ".") : "");
+                break;
+            case "date":
+                returnValue = (0, createFormattedDate_1.createFormattedDate)((0, getVal_1.getVal)(data, valuePath));
+                break;
+            case "text":
+            default:
+                returnValue = (0, getVal_1.getVal)(data, valuePath);
+        }
+        if (prefix) {
+            return "".concat(localize(prefix), " : ").concat(returnValue);
+        }
+        return returnValue;
+    }).filter(function (d) { return d !== undefined; });
+    return {
+        title: title,
+        titleOptional: titleOptional,
+        desc: desc,
+        cardLabel: cardLabel,
+        video: video,
+        image: image,
+        metaBlockData: metaBlockData,
+        tagDisplay: tagDisplay,
+    };
+};
+exports.parseCardConfig = parseCardConfig;

package/dist/globalStyles/normalize.d.ts

@@ -1 +1 @@
-export const normalize: "\n/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */\n\n/* Document\n   ========================================================================== */\n\n/**\n * 1. Correct the line height in all browsers.\n * 2. Prevent adjustments of font size after orientation changes in iOS.\n */\n\nhtml {\n  line-height: 1.15; /* 1 */\n  -webkit-text-size-adjust: 100%; /* 2 */\n}\n\n/* Sections\n   ========================================================================== */\n\n/**\n * Remove the margin in all browsers.\n */\n\nbody {\n  margin: 0;\n}\n\n/**\n * Render the 'main' element consistently in IE.\n */\n\nmain {\n  display: block;\n}\n\n/**\n * Correct the font size and margin on 'h1' elements within 'section' and\n * 'article' contexts in Chrome, Firefox, and Safari.\n */\n\nh1 {\n  font-size: 2em;\n  margin: 0.67em 0;\n}\n\n/* Grouping content\n   ========================================================================== */\n\n/**\n * 1. Add the correct box sizing in Firefox.\n * 2. Show the overflow in Edge and IE.\n */\n\nhr {\n  box-sizing: content-box; /* 1 */\n  height: 0; /* 1 */\n  overflow: visible; /* 2 */\n}\n\n/**\n * 1. Correct the inheritance and scaling of font size in all browsers.\n * 2. Correct the odd 'em' font sizing in all browsers.\n */\n\npre {\n  font-family: monospace, monospace; /* 1 */\n  font-size: 1em; /* 2 */\n}\n\n/* Text-level semantics\n   ========================================================================== */\n\n/**\n * Remove the gray background on active links in IE 10.\n */\n\na {\n  background-color: transparent;\n}\n\n/**\n * 1. Remove the bottom border in Chrome 57-\n * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.\n */\n\nabbr[title] {\n  border-bottom: none; /* 1 */\n  text-decoration: underline; /* 2 */\n  text-decoration: underline dotted; /* 2 */\n}\n\n\n/**\n * 1. Correct the inheritance and scaling of font size in all browsers.\n * 2. Correct the odd 'em' font sizing in all browsers.\n */\n\ncode,\nkbd,\nsamp {\n  font-family: monospace, monospace; /* 1 */\n  font-size: 1em; /* 2 */\n}\n\n/**\n * Add the correct font size in all browsers.\n */\n\nsmall {\n  font-size: 80%;\n}\n\n/**\n * Prevent 'sub' and 'sup' elements from affecting the line height in\n * all browsers.\n */\n\nsub,\nsup {\n  font-size: 75%;\n  line-height: 0;\n  position: relative;\n  vertical-align: baseline;\n}\n\nsub {\n  bottom: -0.25em;\n}\n\nsup {\n  top: -0.5em;\n}\n\n/* Embedded content\n   ========================================================================== */\n\n/**\n * Remove the border on images inside links in IE 10.\n */\n\nimg {\n  border-style: none;\n}\n\n/* Forms\n   ========================================================================== */\n\n/**\n * 1. Change the font styles in all browsers.\n * 2. Remove the margin in Firefox and Safari.\n */\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n  font-family: inherit; /* 1 */\n  font-size: 100%; /* 1 */\n  line-height: 1.15; /* 1 */\n  margin: 0; /* 2 */\n}\n\n/**\n * Show the overflow in IE.\n * 1. Show the overflow in Edge.\n */\n\nbutton,\ninput { /* 1 */\n  overflow: visible;\n}\n\n/**\n * Remove the inheritance of text transform in Edge, Firefox, and IE.\n * 1. Remove the inheritance of text transform in Firefox.\n */\n\nbutton,\nselect { /* 1 */\n  text-transform: none;\n}\n\n/**\n * Correct the inability to style clickable types in iOS and Safari.\n */\n\nbutton,\n[type=\"button\"],\n[type=\"reset\"],\n[type=\"submit\"] {\n  -webkit-appearance: button;\n}\n\n/**\n * Remove the inner border and padding in Firefox.\n */\n\nbutton::-moz-focus-inner,\n[type=\"button\"]::-moz-focus-inner,\n[type=\"reset\"]::-moz-focus-inner,\n[type=\"submit\"]::-moz-focus-inner {\n  border-style: none;\n  padding: 0;\n}\n\n/**\n * Restore the focus styles unset by the previous rule.\n */\n\n// button:-moz-focusring,\n// [type=\"button\"]:-moz-focusring,\n// [type=\"reset\"]:-moz-focusring,\n// [type=\"submit\"]:-moz-focusring {\n//   outline: 1px dotted ButtonText;\n// }\n\n/**\n * Correct the padding in Firefox.\n */\n\nfieldset {\n  padding: 0.35em 0.75em 0.625em;\n}\n\n/**\n * 1. Correct the text wrapping in Edge and IE.\n * 2. Correct the color inheritance from 'fieldset' elements in IE.\n * 3. Remove the padding so developers are not caught out when they zero out\n *    'fieldset' elements in all browsers.\n */\n\nlegend {\n  box-sizing: border-box; /* 1 */\n  color: inherit; /* 2 */\n  display: table; /* 1 */\n  max-width: 100%; /* 1 */\n  padding: 0; /* 3 */\n  white-space: normal; /* 1 */\n}\n\n/**\n * Add the correct vertical alignment in Chrome, Firefox, and Opera.\n */\n\nprogress {\n  vertical-align: baseline;\n}\n\n/**\n * Remove the default vertical scrollbar in IE 10+.\n */\n\ntextarea {\n  overflow: auto;\n}\n\n/**\n * 1. Add the correct box sizing in IE 10.\n * 2. Remove the padding in IE 10.\n */\n\n[type=\"checkbox\"],\n[type=\"radio\"] {\n  box-sizing: border-box; /* 1 */\n  padding: 0; /* 2 */\n}\n\n/**\n * Correct the cursor style of increment and decrement buttons in Chrome.\n */\n\n[type=\"number\"]::-webkit-inner-spin-button,\n[type=\"number\"]::-webkit-outer-spin-button {\n  height: auto;\n}\n\n/**\n * 1. Correct the odd appearance in Chrome and Safari.\n * 2. Correct the outline style in Safari.\n */\n\n[type=\"search\"] {\n  -webkit-appearance: textfield; /* 1 */\n  outline-offset: -2px; /* 2 */\n}\n\n/**\n * Remove the inner padding in Chrome and Safari on macOS.\n */\n\n[type=\"search\"]::-webkit-search-decoration {\n  -webkit-appearance: none;\n}\n\n/**\n * 1. Correct the inability to style clickable types in iOS and Safari.\n * 2. Change font properties to 'inherit' in Safari.\n */\n\n::-webkit-file-upload-button {\n  -webkit-appearance: button; /* 1 */\n  font: inherit; /* 2 */\n}\n\n/* Interactive\n   ========================================================================== */\n\n/*\n * Add the correct display in Edge, IE 10+, and Firefox.\n */\n\ndetails {\n  display: block;\n}\n\n/*\n * Add the correct display in all browsers.\n */\n\nsummary {\n  display: list-item;\n}\n\n/* Misc\n   ========================================================================== */\n\n/**\n * Add the correct display in IE 10+.\n */\n\ntemplate {\n  display: none;\n}\n\n/**\n * Add the correct display in IE 10.\n */\n\n[hidden] {\n  display: none;\n}\n\n\n";
+export const normalize: "\n/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */\n\n/* Document\n   ========================================================================== */\n\n/**\n * 1. Correct the line height in all browsers.\n * 2. Prevent adjustments of font size after orientation changes in iOS.\n */\n\nhtml {\n  line-height: 1.15; /* 1 */\n  -webkit-text-size-adjust: 100%; /* 2 */\n}\n\n/*\n* This ensures that when an element's width is set, it includes the padding and the border. Very important to make dev lives easier.\n*/\n*,\n*::before,\n*::after {\n  box-sizing: border-box;\n}\n\n/* Sections\n   ========================================================================== */\n\n/**\n * Remove the margin in all browsers.\n */\n\nbody {\n  margin: 0;\n}\n\n/**\n * Render the 'main' element consistently in IE.\n */\n\nmain {\n  display: block;\n}\n\n/**\n * Correct the font size and margin on 'h1' elements within 'section' and\n * 'article' contexts in Chrome, Firefox, and Safari.\n */\n\nh1 {\n  font-size: 2em;\n  margin: 0.67em 0;\n}\n\n/* Grouping content\n   ========================================================================== */\n\n/**\n * 1. Add the correct box sizing in Firefox.\n * 2. Show the overflow in Edge and IE.\n */\n\nhr {\n  box-sizing: content-box; /* 1 */\n  height: 0; /* 1 */\n  overflow: visible; /* 2 */\n}\n\n/**\n * 1. Correct the inheritance and scaling of font size in all browsers.\n * 2. Correct the odd 'em' font sizing in all browsers.\n */\n\npre {\n  font-family: monospace, monospace; /* 1 */\n  font-size: 1em; /* 2 */\n}\n\n/* Text-level semantics\n   ========================================================================== */\n\n/**\n * Remove the gray background on active links in IE 10.\n */\n\na {\n  background-color: transparent;\n}\n\n/**\n * 1. Remove the bottom border in Chrome 57-\n * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.\n */\n\nabbr[title] {\n  border-bottom: none; /* 1 */\n  text-decoration: underline; /* 2 */\n  text-decoration: underline dotted; /* 2 */\n}\n\n\n/**\n * 1. Correct the inheritance and scaling of font size in all browsers.\n * 2. Correct the odd 'em' font sizing in all browsers.\n */\n\ncode,\nkbd,\nsamp {\n  font-family: monospace, monospace; /* 1 */\n  font-size: 1em; /* 2 */\n}\n\n/**\n * Add the correct font size in all browsers.\n */\n\nsmall {\n  font-size: 80%;\n}\n\n/**\n * Prevent 'sub' and 'sup' elements from affecting the line height in\n * all browsers.\n */\n\nsub,\nsup {\n  font-size: 75%;\n  line-height: 0;\n  position: relative;\n  vertical-align: baseline;\n}\n\nsub {\n  bottom: -0.25em;\n}\n\nsup {\n  top: -0.5em;\n}\n\n/* Embedded content\n   ========================================================================== */\n\n/**\n * Remove the border on images inside links in IE 10.\n */\n\nimg {\n  border-style: none;\n}\n\n/* Forms\n   ========================================================================== */\n\n/**\n * 1. Change the font styles in all browsers.\n * 2. Remove the margin in Firefox and Safari.\n */\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n  font-family: inherit; /* 1 */\n  font-size: 100%; /* 1 */\n  line-height: 1.15; /* 1 */\n  margin: 0; /* 2 */\n}\n\n/**\n * Show the overflow in IE.\n * 1. Show the overflow in Edge.\n */\n\nbutton,\ninput { /* 1 */\n  overflow: visible;\n}\n\n/**\n * Remove the inheritance of text transform in Edge, Firefox, and IE.\n * 1. Remove the inheritance of text transform in Firefox.\n */\n\nbutton,\nselect { /* 1 */\n  text-transform: none;\n}\n\n/**\n * Correct the inability to style clickable types in iOS and Safari.\n */\n\nbutton,\n[type=\"button\"],\n[type=\"reset\"],\n[type=\"submit\"] {\n  -webkit-appearance: button;\n}\n\n/**\n * Remove the inner border and padding in Firefox.\n */\n\nbutton::-moz-focus-inner,\n[type=\"button\"]::-moz-focus-inner,\n[type=\"reset\"]::-moz-focus-inner,\n[type=\"submit\"]::-moz-focus-inner {\n  border-style: none;\n  padding: 0;\n}\n\n/**\n * Restore the focus styles unset by the previous rule.\n */\n\n// button:-moz-focusring,\n// [type=\"button\"]:-moz-focusring,\n// [type=\"reset\"]:-moz-focusring,\n// [type=\"submit\"]:-moz-focusring {\n//   outline: 1px dotted ButtonText;\n// }\n\n/**\n * Correct the padding in Firefox.\n */\n\nfieldset {\n  padding: 0.35em 0.75em 0.625em;\n}\n\n/**\n * 1. Correct the text wrapping in Edge and IE.\n * 2. Correct the color inheritance from 'fieldset' elements in IE.\n * 3. Remove the padding so developers are not caught out when they zero out\n *    'fieldset' elements in all browsers.\n */\n\nlegend {\n  box-sizing: border-box; /* 1 */\n  color: inherit; /* 2 */\n  display: table; /* 1 */\n  max-width: 100%; /* 1 */\n  padding: 0; /* 3 */\n  white-space: normal; /* 1 */\n}\n\n/**\n * Add the correct vertical alignment in Chrome, Firefox, and Opera.\n */\n\nprogress {\n  vertical-align: baseline;\n}\n\n/**\n * Remove the default vertical scrollbar in IE 10+.\n */\n\ntextarea {\n  overflow: auto;\n}\n\n/**\n * 1. Add the correct box sizing in IE 10.\n * 2. Remove the padding in IE 10.\n */\n\n[type=\"checkbox\"],\n[type=\"radio\"] {\n  box-sizing: border-box; /* 1 */\n  padding: 0; /* 2 */\n}\n\n/**\n * Correct the cursor style of increment and decrement buttons in Chrome.\n */\n\n[type=\"number\"]::-webkit-inner-spin-button,\n[type=\"number\"]::-webkit-outer-spin-button {\n  height: auto;\n}\n\n/**\n * 1. Correct the odd appearance in Chrome and Safari.\n * 2. Correct the outline style in Safari.\n */\n\n[type=\"search\"] {\n  -webkit-appearance: textfield; /* 1 */\n  outline-offset: -2px; /* 2 */\n}\n\n/**\n * Remove the inner padding in Chrome and Safari on macOS.\n */\n\n[type=\"search\"]::-webkit-search-decoration {\n  -webkit-appearance: none;\n}\n\n/**\n * 1. Correct the inability to style clickable types in iOS and Safari.\n * 2. Change font properties to 'inherit' in Safari.\n */\n\n::-webkit-file-upload-button {\n  -webkit-appearance: button; /* 1 */\n  font: inherit; /* 2 */\n}\n\n/* Interactive\n   ========================================================================== */\n\n/*\n * Add the correct display in Edge, IE 10+, and Firefox.\n */\n\ndetails {\n  display: block;\n}\n\n/*\n * Add the correct display in all browsers.\n */\n\nsummary {\n  display: list-item;\n}\n\n/* Misc\n   ========================================================================== */\n\n/**\n * Add the correct display in IE 10+.\n */\n\ntemplate {\n  display: none;\n}\n\n/**\n * Add the correct display in IE 10.\n */\n\n[hidden] {\n  display: none;\n}\n\n\n";

package/dist/globalStyles/normalize.js

@@ -1,4 +1,4 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.normalize = void 0;
-exports.normalize = "\n/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */\n\n/* Document\n   ========================================================================== */\n\n/**\n * 1. Correct the line height in all browsers.\n * 2. Prevent adjustments of font size after orientation changes in iOS.\n */\n\nhtml {\n  line-height: 1.15; /* 1 */\n  -webkit-text-size-adjust: 100%; /* 2 */\n}\n\n/* Sections\n   ========================================================================== */\n\n/**\n * Remove the margin in all browsers.\n */\n\nbody {\n  margin: 0;\n}\n\n/**\n * Render the 'main' element consistently in IE.\n */\n\nmain {\n  display: block;\n}\n\n/**\n * Correct the font size and margin on 'h1' elements within 'section' and\n * 'article' contexts in Chrome, Firefox, and Safari.\n */\n\nh1 {\n  font-size: 2em;\n  margin: 0.67em 0;\n}\n\n/* Grouping content\n   ========================================================================== */\n\n/**\n * 1. Add the correct box sizing in Firefox.\n * 2. Show the overflow in Edge and IE.\n */\n\nhr {\n  box-sizing: content-box; /* 1 */\n  height: 0; /* 1 */\n  overflow: visible; /* 2 */\n}\n\n/**\n * 1. Correct the inheritance and scaling of font size in all browsers.\n * 2. Correct the odd 'em' font sizing in all browsers.\n */\n\npre {\n  font-family: monospace, monospace; /* 1 */\n  font-size: 1em; /* 2 */\n}\n\n/* Text-level semantics\n   ========================================================================== */\n\n/**\n * Remove the gray background on active links in IE 10.\n */\n\na {\n  background-color: transparent;\n}\n\n/**\n * 1. Remove the bottom border in Chrome 57-\n * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.\n */\n\nabbr[title] {\n  border-bottom: none; /* 1 */\n  text-decoration: underline; /* 2 */\n  text-decoration: underline dotted; /* 2 */\n}\n\n\n/**\n * 1. Correct the inheritance and scaling of font size in all browsers.\n * 2. Correct the odd 'em' font sizing in all browsers.\n */\n\ncode,\nkbd,\nsamp {\n  font-family: monospace, monospace; /* 1 */\n  font-size: 1em; /* 2 */\n}\n\n/**\n * Add the correct font size in all browsers.\n */\n\nsmall {\n  font-size: 80%;\n}\n\n/**\n * Prevent 'sub' and 'sup' elements from affecting the line height in\n * all browsers.\n */\n\nsub,\nsup {\n  font-size: 75%;\n  line-height: 0;\n  position: relative;\n  vertical-align: baseline;\n}\n\nsub {\n  bottom: -0.25em;\n}\n\nsup {\n  top: -0.5em;\n}\n\n/* Embedded content\n   ========================================================================== */\n\n/**\n * Remove the border on images inside links in IE 10.\n */\n\nimg {\n  border-style: none;\n}\n\n/* Forms\n   ========================================================================== */\n\n/**\n * 1. Change the font styles in all browsers.\n * 2. Remove the margin in Firefox and Safari.\n */\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n  font-family: inherit; /* 1 */\n  font-size: 100%; /* 1 */\n  line-height: 1.15; /* 1 */\n  margin: 0; /* 2 */\n}\n\n/**\n * Show the overflow in IE.\n * 1. Show the overflow in Edge.\n */\n\nbutton,\ninput { /* 1 */\n  overflow: visible;\n}\n\n/**\n * Remove the inheritance of text transform in Edge, Firefox, and IE.\n * 1. Remove the inheritance of text transform in Firefox.\n */\n\nbutton,\nselect { /* 1 */\n  text-transform: none;\n}\n\n/**\n * Correct the inability to style clickable types in iOS and Safari.\n */\n\nbutton,\n[type=\"button\"],\n[type=\"reset\"],\n[type=\"submit\"] {\n  -webkit-appearance: button;\n}\n\n/**\n * Remove the inner border and padding in Firefox.\n */\n\nbutton::-moz-focus-inner,\n[type=\"button\"]::-moz-focus-inner,\n[type=\"reset\"]::-moz-focus-inner,\n[type=\"submit\"]::-moz-focus-inner {\n  border-style: none;\n  padding: 0;\n}\n\n/**\n * Restore the focus styles unset by the previous rule.\n */\n\n// button:-moz-focusring,\n// [type=\"button\"]:-moz-focusring,\n// [type=\"reset\"]:-moz-focusring,\n// [type=\"submit\"]:-moz-focusring {\n//   outline: 1px dotted ButtonText;\n// }\n\n/**\n * Correct the padding in Firefox.\n */\n\nfieldset {\n  padding: 0.35em 0.75em 0.625em;\n}\n\n/**\n * 1. Correct the text wrapping in Edge and IE.\n * 2. Correct the color inheritance from 'fieldset' elements in IE.\n * 3. Remove the padding so developers are not caught out when they zero out\n *    'fieldset' elements in all browsers.\n */\n\nlegend {\n  box-sizing: border-box; /* 1 */\n  color: inherit; /* 2 */\n  display: table; /* 1 */\n  max-width: 100%; /* 1 */\n  padding: 0; /* 3 */\n  white-space: normal; /* 1 */\n}\n\n/**\n * Add the correct vertical alignment in Chrome, Firefox, and Opera.\n */\n\nprogress {\n  vertical-align: baseline;\n}\n\n/**\n * Remove the default vertical scrollbar in IE 10+.\n */\n\ntextarea {\n  overflow: auto;\n}\n\n/**\n * 1. Add the correct box sizing in IE 10.\n * 2. Remove the padding in IE 10.\n */\n\n[type=\"checkbox\"],\n[type=\"radio\"] {\n  box-sizing: border-box; /* 1 */\n  padding: 0; /* 2 */\n}\n\n/**\n * Correct the cursor style of increment and decrement buttons in Chrome.\n */\n\n[type=\"number\"]::-webkit-inner-spin-button,\n[type=\"number\"]::-webkit-outer-spin-button {\n  height: auto;\n}\n\n/**\n * 1. Correct the odd appearance in Chrome and Safari.\n * 2. Correct the outline style in Safari.\n */\n\n[type=\"search\"] {\n  -webkit-appearance: textfield; /* 1 */\n  outline-offset: -2px; /* 2 */\n}\n\n/**\n * Remove the inner padding in Chrome and Safari on macOS.\n */\n\n[type=\"search\"]::-webkit-search-decoration {\n  -webkit-appearance: none;\n}\n\n/**\n * 1. Correct the inability to style clickable types in iOS and Safari.\n * 2. Change font properties to 'inherit' in Safari.\n */\n\n::-webkit-file-upload-button {\n  -webkit-appearance: button; /* 1 */\n  font: inherit; /* 2 */\n}\n\n/* Interactive\n   ========================================================================== */\n\n/*\n * Add the correct display in Edge, IE 10+, and Firefox.\n */\n\ndetails {\n  display: block;\n}\n\n/*\n * Add the correct display in all browsers.\n */\n\nsummary {\n  display: list-item;\n}\n\n/* Misc\n   ========================================================================== */\n\n/**\n * Add the correct display in IE 10+.\n */\n\ntemplate {\n  display: none;\n}\n\n/**\n * Add the correct display in IE 10.\n */\n\n[hidden] {\n  display: none;\n}\n\n\n";
+exports.normalize = "\n/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */\n\n/* Document\n   ========================================================================== */\n\n/**\n * 1. Correct the line height in all browsers.\n * 2. Prevent adjustments of font size after orientation changes in iOS.\n */\n\nhtml {\n  line-height: 1.15; /* 1 */\n  -webkit-text-size-adjust: 100%; /* 2 */\n}\n\n/*\n* This ensures that when an element's width is set, it includes the padding and the border. Very important to make dev lives easier.\n*/\n*,\n*::before,\n*::after {\n  box-sizing: border-box;\n}\n\n/* Sections\n   ========================================================================== */\n\n/**\n * Remove the margin in all browsers.\n */\n\nbody {\n  margin: 0;\n}\n\n/**\n * Render the 'main' element consistently in IE.\n */\n\nmain {\n  display: block;\n}\n\n/**\n * Correct the font size and margin on 'h1' elements within 'section' and\n * 'article' contexts in Chrome, Firefox, and Safari.\n */\n\nh1 {\n  font-size: 2em;\n  margin: 0.67em 0;\n}\n\n/* Grouping content\n   ========================================================================== */\n\n/**\n * 1. Add the correct box sizing in Firefox.\n * 2. Show the overflow in Edge and IE.\n */\n\nhr {\n  box-sizing: content-box; /* 1 */\n  height: 0; /* 1 */\n  overflow: visible; /* 2 */\n}\n\n/**\n * 1. Correct the inheritance and scaling of font size in all browsers.\n * 2. Correct the odd 'em' font sizing in all browsers.\n */\n\npre {\n  font-family: monospace, monospace; /* 1 */\n  font-size: 1em; /* 2 */\n}\n\n/* Text-level semantics\n   ========================================================================== */\n\n/**\n * Remove the gray background on active links in IE 10.\n */\n\na {\n  background-color: transparent;\n}\n\n/**\n * 1. Remove the bottom border in Chrome 57-\n * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.\n */\n\nabbr[title] {\n  border-bottom: none; /* 1 */\n  text-decoration: underline; /* 2 */\n  text-decoration: underline dotted; /* 2 */\n}\n\n\n/**\n * 1. Correct the inheritance and scaling of font size in all browsers.\n * 2. Correct the odd 'em' font sizing in all browsers.\n */\n\ncode,\nkbd,\nsamp {\n  font-family: monospace, monospace; /* 1 */\n  font-size: 1em; /* 2 */\n}\n\n/**\n * Add the correct font size in all browsers.\n */\n\nsmall {\n  font-size: 80%;\n}\n\n/**\n * Prevent 'sub' and 'sup' elements from affecting the line height in\n * all browsers.\n */\n\nsub,\nsup {\n  font-size: 75%;\n  line-height: 0;\n  position: relative;\n  vertical-align: baseline;\n}\n\nsub {\n  bottom: -0.25em;\n}\n\nsup {\n  top: -0.5em;\n}\n\n/* Embedded content\n   ========================================================================== */\n\n/**\n * Remove the border on images inside links in IE 10.\n */\n\nimg {\n  border-style: none;\n}\n\n/* Forms\n   ========================================================================== */\n\n/**\n * 1. Change the font styles in all browsers.\n * 2. Remove the margin in Firefox and Safari.\n */\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n  font-family: inherit; /* 1 */\n  font-size: 100%; /* 1 */\n  line-height: 1.15; /* 1 */\n  margin: 0; /* 2 */\n}\n\n/**\n * Show the overflow in IE.\n * 1. Show the overflow in Edge.\n */\n\nbutton,\ninput { /* 1 */\n  overflow: visible;\n}\n\n/**\n * Remove the inheritance of text transform in Edge, Firefox, and IE.\n * 1. Remove the inheritance of text transform in Firefox.\n */\n\nbutton,\nselect { /* 1 */\n  text-transform: none;\n}\n\n/**\n * Correct the inability to style clickable types in iOS and Safari.\n */\n\nbutton,\n[type=\"button\"],\n[type=\"reset\"],\n[type=\"submit\"] {\n  -webkit-appearance: button;\n}\n\n/**\n * Remove the inner border and padding in Firefox.\n */\n\nbutton::-moz-focus-inner,\n[type=\"button\"]::-moz-focus-inner,\n[type=\"reset\"]::-moz-focus-inner,\n[type=\"submit\"]::-moz-focus-inner {\n  border-style: none;\n  padding: 0;\n}\n\n/**\n * Restore the focus styles unset by the previous rule.\n */\n\n// button:-moz-focusring,\n// [type=\"button\"]:-moz-focusring,\n// [type=\"reset\"]:-moz-focusring,\n// [type=\"submit\"]:-moz-focusring {\n//   outline: 1px dotted ButtonText;\n// }\n\n/**\n * Correct the padding in Firefox.\n */\n\nfieldset {\n  padding: 0.35em 0.75em 0.625em;\n}\n\n/**\n * 1. Correct the text wrapping in Edge and IE.\n * 2. Correct the color inheritance from 'fieldset' elements in IE.\n * 3. Remove the padding so developers are not caught out when they zero out\n *    'fieldset' elements in all browsers.\n */\n\nlegend {\n  box-sizing: border-box; /* 1 */\n  color: inherit; /* 2 */\n  display: table; /* 1 */\n  max-width: 100%; /* 1 */\n  padding: 0; /* 3 */\n  white-space: normal; /* 1 */\n}\n\n/**\n * Add the correct vertical alignment in Chrome, Firefox, and Opera.\n */\n\nprogress {\n  vertical-align: baseline;\n}\n\n/**\n * Remove the default vertical scrollbar in IE 10+.\n */\n\ntextarea {\n  overflow: auto;\n}\n\n/**\n * 1. Add the correct box sizing in IE 10.\n * 2. Remove the padding in IE 10.\n */\n\n[type=\"checkbox\"],\n[type=\"radio\"] {\n  box-sizing: border-box; /* 1 */\n  padding: 0; /* 2 */\n}\n\n/**\n * Correct the cursor style of increment and decrement buttons in Chrome.\n */\n\n[type=\"number\"]::-webkit-inner-spin-button,\n[type=\"number\"]::-webkit-outer-spin-button {\n  height: auto;\n}\n\n/**\n * 1. Correct the odd appearance in Chrome and Safari.\n * 2. Correct the outline style in Safari.\n */\n\n[type=\"search\"] {\n  -webkit-appearance: textfield; /* 1 */\n  outline-offset: -2px; /* 2 */\n}\n\n/**\n * Remove the inner padding in Chrome and Safari on macOS.\n */\n\n[type=\"search\"]::-webkit-search-decoration {\n  -webkit-appearance: none;\n}\n\n/**\n * 1. Correct the inability to style clickable types in iOS and Safari.\n * 2. Change font properties to 'inherit' in Safari.\n */\n\n::-webkit-file-upload-button {\n  -webkit-appearance: button; /* 1 */\n  font: inherit; /* 2 */\n}\n\n/* Interactive\n   ========================================================================== */\n\n/*\n * Add the correct display in Edge, IE 10+, and Firefox.\n */\n\ndetails {\n  display: block;\n}\n\n/*\n * Add the correct display in all browsers.\n */\n\nsummary {\n  display: list-item;\n}\n\n/* Misc\n   ========================================================================== */\n\n/**\n * Add the correct display in IE 10+.\n */\n\ntemplate {\n  display: none;\n}\n\n/**\n * Add the correct display in IE 10.\n */\n\n[hidden] {\n  display: none;\n}\n\n\n";

package/dist/index.d.ts

@@ -37,6 +37,8 @@ export { default as DatePicker } from "./components/DatePicker";
 export { default as DateRangePicker } from "./components/DateRangePicker";
 export { BarChart } from "./components/dataViz/comps/BarChart";
 export { TextLoader } from "./components/LoadersAndProgress/TextLoader";
+export { CardContent } from "./components/cards/CardContent";
+export { ListContent } from "./components/cards/ListContent";
 export { DropdownSingle } from "./components/Dropdowns/DropdownSingle";
 export { DropdownMulti } from "./components/Dropdowns/DropdownMulti";
 export { OptionsSingle } from "./components/Dropdowns/comps/OptionsSingle";

package/dist/index.js

@@ -17,7 +17,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.HintsProvider = exports.genTagComp = exports.generateOptions = exports.OptionsSingle = exports.DropdownMulti = exports.DropdownSingle = exports.TextLoader = exports.BarChart = exports.DateRangePicker = exports.DatePicker = exports.PageScrollIndicator = exports.HomeCover = exports.EmptyStates = exports.ModalSmall = exports.ModalLarge = exports.ModalConfirm = exports.SkeletonLoader = exports.Divider = exports.PercentCompletedPie = exports.Accordion = exports.ActionMenu = exports.Tooltip = exports.OKELink = exports.UserRoleBadge = exports.Section = exports.LoaderOverlay = exports.Loader = exports.ProgressBar = exports.LoaderCircle = exports.icons = exports.colors = exports.GlobalStyles = void 0;
+exports.HintsProvider = exports.genTagComp = exports.generateOptions = exports.OptionsSingle = exports.DropdownMulti = exports.DropdownSingle = exports.ListContent = exports.CardContent = exports.TextLoader = exports.BarChart = exports.DateRangePicker = exports.DatePicker = exports.PageScrollIndicator = exports.HomeCover = exports.EmptyStates = exports.ModalSmall = exports.ModalLarge = exports.ModalConfirm = exports.SkeletonLoader = exports.Divider = exports.PercentCompletedPie = exports.Accordion = exports.ActionMenu = exports.Tooltip = exports.OKELink = exports.UserRoleBadge = exports.Section = exports.LoaderOverlay = exports.Loader = exports.ProgressBar = exports.LoaderCircle = exports.icons = exports.colors = exports.GlobalStyles = void 0;
 //css and styling related ( styled-components )
 var globalStyles_1 = require("./globalStyles");
 Object.defineProperty(exports, "GlobalStyles", { enumerable: true, get: function () { return globalStyles_1.GlobalStyles; } });
@@ -87,6 +87,11 @@ var BarChart_1 = require("./components/dataViz/comps/BarChart");
 Object.defineProperty(exports, "BarChart", { enumerable: true, get: function () { return BarChart_1.BarChart; } });
 var TextLoader_1 = require("./components/LoadersAndProgress/TextLoader");
 Object.defineProperty(exports, "TextLoader", { enumerable: true, get: function () { return TextLoader_1.TextLoader; } });
+//cards
+var CardContent_1 = require("./components/cards/CardContent");
+Object.defineProperty(exports, "CardContent", { enumerable: true, get: function () { return CardContent_1.CardContent; } });
+var ListContent_1 = require("./components/cards/ListContent");
+Object.defineProperty(exports, "ListContent", { enumerable: true, get: function () { return ListContent_1.ListContent; } });
 //dropdowns & options
 var DropdownSingle_1 = require("./components/Dropdowns/DropdownSingle");
 Object.defineProperty(exports, "DropdownSingle", { enumerable: true, get: function () { return DropdownSingle_1.DropdownSingle; } });

package/dist/utils/momentjs/createFormattedDate.d.ts

@@ -0,0 +1 @@
+export function createFormattedDate(inputDate: any, altDate?: any, prefix?: any, options?: {}): string;

package/dist/utils/momentjs/createFormattedDate.js

@@ -0,0 +1,30 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createFormattedDate = void 0;
+var moment_1 = __importDefault(require("moment"));
+var getDaysDiff_1 = require("./getDaysDiff");
+var createFormattedDate = function (inputDate, altDate, prefix, options) {
+    if (altDate === void 0) { altDate = null; }
+    if (prefix === void 0) { prefix = null; }
+    if (options === void 0) { options = {}; }
+    //alt date is only to deal with the blunder of not saving published date sometime back
+    var _a = options.switchDisplayFormatAfter, switchDisplayFormatAfter = _a === void 0 ? 7 : _a, _b = options.format, format = _b === void 0 ? "DD MMM YYYY" : _b;
+    if (!inputDate && !altDate)
+        return null;
+    var inputMoment = inputDate ? (0, moment_1.default)(inputDate) : (0, moment_1.default)(altDate);
+    var daysDiff = inputDate
+        ? (0, getDaysDiff_1.getDaysDiff)(inputDate).count
+        : (0, getDaysDiff_1.getDaysDiff)(altDate).count;
+    var toReturn;
+    if (Math.abs(daysDiff) > switchDisplayFormatAfter) {
+        toReturn = "".concat(prefix ? prefix : "", " ").concat(inputMoment.format(format));
+    }
+    else {
+        toReturn = inputMoment.fromNow();
+    }
+    return toReturn;
+};
+exports.createFormattedDate = createFormattedDate;

package/dist/utilsOolib/renderImagePlaceholderForOolibPreview.js

@@ -21,6 +21,6 @@ var renderImagePlaceholderForOolibPreview = function (options) {
             alignItems: "center",
             flex: "0 0 auto",
         } },
-        react_1.default.createElement(Tooltip_1.Tooltip, { position: tooltipPos, text: "ProfileImageDisplay component needs to be provided via theme provider in order to render profile image", presetTarget: "infoIcon" })));
+        react_1.default.createElement(Tooltip_1.Tooltip, { popOutOfOverflowHiddenParent: true, position: tooltipPos, text: "ProfileImageDisplay component needs to be provided via theme provider in order to render profile image", presetTarget: "infoIcon" })));
 };
 exports.renderImagePlaceholderForOolibPreview = renderImagePlaceholderForOolibPreview;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "oolib",
-  "version": "2.61.0",
+  "version": "2.61.1",
   "description": " OKE Component Library",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",