oolib 2.177.4 → 2.178.0

package/dist/v2/themes/typo.js

@@ -52,24 +52,27 @@ var UI_CAPTION_SEMIBOLD = (0, styled_components_1.css)(templateObject_32 || (tem
 var UI_CAPTION_DF = (0, styled_components_1.css)(templateObject_33 || (templateObject_33 = __makeTemplateObject(["\n  font-weight: 400;\n  ", ";\n  ", ";\n\n  ", ";\n  \n  ", "{\n    ", ";\n  }\n"], ["\n  font-weight: 400;\n  ", ";\n  ", ";\n\n  ", ";\n  \n  ", "{\n    ", ";\n  }\n"])), uiFont, fontCss, UI_CAPTION_MOBILE, (0, mixins_1.mediaQuery)("md"), UI_CAPTION_DESKTOP);
 var UI_CAPTION_SEMIBOLD_DF = (0, styled_components_1.css)(templateObject_34 || (templateObject_34 = __makeTemplateObject(["\n  font-weight: 500;\n  ", ";\n  ", ";\n\n  ", ";\n  \n  ", "{\n    ", ";\n  }\n"], ["\n  font-weight: 500;\n  ", ";\n  ", ";\n\n  ", ";\n  \n  ", "{\n    ", ";\n  }\n"])), uiFont, fontCss, UI_CAPTION_MOBILE, (0, mixins_1.mediaQuery)("md"), UI_CAPTION_DESKTOP);
 var UI_CAPTION_BOLD_DF = (0, styled_components_1.css)(templateObject_35 || (templateObject_35 = __makeTemplateObject(["\n  font-weight: 700;\n  ", ";\n  ", ";\n\n  ", ";\n  \n  ", "{\n    ", ";\n  }\n"], ["\n  font-weight: 700;\n  ", ";\n  ", ";\n\n  ", ";\n  \n  ", "{\n    ", ";\n  }\n"])), uiFont, fontCss, UI_CAPTION_MOBILE, (0, mixins_1.mediaQuery)("md"), UI_CAPTION_DESKTOP);
-var UI_TAG = (0, styled_components_1.css)(templateObject_36 || (templateObject_36 = __makeTemplateObject(["\n  font-size: 10px;\n  line-height: 13px;\n  font-weight: 700; \n  text-transform: uppercase;\n  letter-spacing: 1px;\n  ", ";\n  ", ";\n"], ["\n  font-size: 10px;\n  line-height: 13px;\n  font-weight: 700; \n  text-transform: uppercase;\n  letter-spacing: 1px;\n  ", ";\n  ", ";\n"])), uiFont, fontCss);
-var UI_HELPTEXT = (0, styled_components_1.css)(templateObject_37 || (templateObject_37 = __makeTemplateObject(["\n  font-size: 12px;\n  line-height: 16px;\n  font-weight: 400; \n  ", ";\n  ", ";\n"], ["\n  font-size: 12px;\n  line-height: 16px;\n  font-weight: 400; \n  ", ";\n  ", ";\n"])), uiFont, fontCss);
-var UI_STAT_LG = (0, styled_components_1.css)(templateObject_38 || (templateObject_38 = __makeTemplateObject(["\n  font-size: 24px;\n  line-height: 24px;\n  font-weight: 500;\n  ", ";\n  ", ";\n"], ["\n  font-size: 24px;\n  line-height: 24px;\n  font-weight: 500;\n  ", ";\n  ", ";\n"])), uiFont, fontCss);
-var UI_STAT_SM = (0, styled_components_1.css)(templateObject_39 || (templateObject_39 = __makeTemplateObject(["\n  font-size: 14px;\n  line-height: 18px;\n  font-weight: 700;\n  ", ";\n  ", ";\n"], ["\n  font-size: 14px;\n  line-height: 18px;\n  font-weight: 700;\n  ", ";\n  ", ";\n"])), uiFont, fontCss);
-var CONTENT_H1 = (0, styled_components_1.css)(templateObject_40 || (templateObject_40 = __makeTemplateObject(["\n  font-size: 36px;\n  line-height: 140%;\n  font-weight: 700;\n  ", ";\n  ", ";\n  "], ["\n  font-size: 36px;\n  line-height: 140%;\n  font-weight: 700;\n  ", ";\n  ", ";\n  "])), contentFont, fontCss);
-var CONTENT_H2 = (0, styled_components_1.css)(templateObject_41 || (templateObject_41 = __makeTemplateObject(["\n  font-size: 25px;\n  line-height: 140%;\n  font-weight: 700;\n  ", ";\n  ", ";\n  "], ["\n  font-size: 25px;\n  line-height: 140%;\n  font-weight: 700;\n  ", ";\n  ", ";\n  "])), contentFont, fontCss);
-var CONTENT_H3 = (0, styled_components_1.css)(templateObject_42 || (templateObject_42 = __makeTemplateObject(["\n  font-size: 18px;\n  line-height: 140%;\n  font-weight: 700;\n  ", ";\n  ", ";\n  "], ["\n  font-size: 18px;\n  line-height: 140%;\n  font-weight: 700;\n  ", ";\n  ", ";\n  "])), contentFont, fontCss);
-var CONTENT_BODY_SM = (0, styled_components_1.css)(templateObject_43 || (templateObject_43 = __makeTemplateObject(["\n  font-size: 15px;\n  line-height: 140%;\n  font-weight: 400;\n  ", ";\n  ", ";\n"], ["\n  font-size: 15px;\n  line-height: 140%;\n  font-weight: 400;\n  ", ";\n  ", ";\n"])), contentFont, fontCss);
-var CONTENT_BODY = (0, styled_components_1.css)(templateObject_44 || (templateObject_44 = __makeTemplateObject(["\n  font-size: 17px;\n  line-height: 140%;\n  font-weight: 400;\n  ", ";\n  ", ";\n"], ["\n  font-size: 17px;\n  line-height: 140%;\n  font-weight: 400;\n  ", ";\n  ", ";\n"])), contentFont, fontCss);
-var CONTENT_BODY_BOLD = (0, styled_components_1.css)(templateObject_45 || (templateObject_45 = __makeTemplateObject(["\n  font-size: 17px;\n  line-height: 140%;\n  font-weight: 600;\n  ", ";\n  ", ";\n"], ["\n  font-size: 17px;\n  line-height: 140%;\n  font-weight: 600;\n  ", ";\n  ", ";\n"])), contentFont, fontCss);
-var CONTENT_BODY_ITALIC = (0, styled_components_1.css)(templateObject_46 || (templateObject_46 = __makeTemplateObject(["\n  font-size: 17px;\n  line-height: 140%;\n  font-weight: 400;\n  font-style: italic;\n  ", ";\n  ", ";\n"], ["\n  font-size: 17px;\n  line-height: 140%;\n  font-weight: 400;\n  font-style: italic;\n  ", ";\n  ", ";\n"])), contentFont, fontCss);
-var CONTENT_BODY_BOLD_ITALIC = (0, styled_components_1.css)(templateObject_47 || (templateObject_47 = __makeTemplateObject(["\n  font-size: 17px;\n  line-height: 140%;\n  font-weight: 600;\n  font-style: italic;\n  ", ";\n  ", ";\n"], ["\n  font-size: 17px;\n  line-height: 140%;\n  font-weight: 600;\n  font-style: italic;\n  ", ";\n  ", ";\n"])), contentFont, fontCss);
-var CONTENT_QUOTE = (0, styled_components_1.css)(templateObject_48 || (templateObject_48 = __makeTemplateObject(["\n  padding: 0 16px;\n  font-size: 24px;\n  line-height: 35.04px;\n  font-weight: 400;\n  font-style: italic;\n  position: relative;\n  ::before {\n    /* Quote line (left) */\n        content: '';\n        position: absolute;\n        left: 0;\n        top: 0;\n        bottom: 0;\n        height: inherit; \n        width: 6px; \n        background-color: ", "; // temp colors need to replace with material colors */\n    }\n  ", ";\n  ", ";\n"], ["\n  padding: 0 16px;\n  font-size: 24px;\n  line-height: 35.04px;\n  font-weight: 400;\n  font-style: italic;\n  position: relative;\n  ::before {\n    /* Quote line (left) */\n        content: '';\n        position: absolute;\n        left: 0;\n        top: 0;\n        bottom: 0;\n        height: inherit; \n        width: 6px; \n        background-color: ", "; // temp colors need to replace with material colors */\n    }\n  ", ";\n  ", ";\n"])), function (_a) {
+var UI_TAG_DESKTOP = (0, styled_components_1.css)(templateObject_36 || (templateObject_36 = __makeTemplateObject(["\n  font-size: 10px;\n  line-height: 13px;\n  letter-spacing: 1px;\n"], ["\n  font-size: 10px;\n  line-height: 13px;\n  letter-spacing: 1px;\n"])));
+var UI_TAG_MOBILE = (0, styled_components_1.css)(templateObject_37 || (templateObject_37 = __makeTemplateObject(["\n  font-size: 11px;\n  line-height: 14px;\n  letter-spacing: 1.1px;\n"], ["\n  font-size: 11px;\n  line-height: 14px;\n  letter-spacing: 1.1px;\n"])));
+var UI_TAG = (0, styled_components_1.css)(templateObject_38 || (templateObject_38 = __makeTemplateObject(["\n  font-weight: 700; \n  text-transform: uppercase;\n  \n  ", ";\n\n  ", ";\n  ", ";\n"], ["\n  font-weight: 700; \n  text-transform: uppercase;\n  \n  ", ";\n\n  ", ";\n  ", ";\n"])), UI_TAG_DESKTOP, uiFont, fontCss);
+var UI_TAG_DF = (0, styled_components_1.css)(templateObject_39 || (templateObject_39 = __makeTemplateObject(["\n  \n  font-weight: 700; \n  text-transform: uppercase;\n  \n  ", ";\n\n  ", "{\n    ", ";\n  }\n\n  ", ";\n  ", ";\n"], ["\n  \n  font-weight: 700; \n  text-transform: uppercase;\n  \n  ", ";\n\n  ", "{\n    ", ";\n  }\n\n  ", ";\n  ", ";\n"])), UI_TAG_MOBILE, (0, mixins_1.mediaQuery)("md"), UI_TAG_DESKTOP, uiFont, fontCss);
+var UI_HELPTEXT = (0, styled_components_1.css)(templateObject_40 || (templateObject_40 = __makeTemplateObject(["\n  font-size: 12px;\n  line-height: 16px;\n  font-weight: 400; \n  ", ";\n  ", ";\n"], ["\n  font-size: 12px;\n  line-height: 16px;\n  font-weight: 400; \n  ", ";\n  ", ";\n"])), uiFont, fontCss);
+var UI_STAT_LG = (0, styled_components_1.css)(templateObject_41 || (templateObject_41 = __makeTemplateObject(["\n  font-size: 24px;\n  line-height: 24px;\n  font-weight: 500;\n  ", ";\n  ", ";\n"], ["\n  font-size: 24px;\n  line-height: 24px;\n  font-weight: 500;\n  ", ";\n  ", ";\n"])), uiFont, fontCss);
+var UI_STAT_SM = (0, styled_components_1.css)(templateObject_42 || (templateObject_42 = __makeTemplateObject(["\n  font-size: 14px;\n  line-height: 18px;\n  font-weight: 700;\n  ", ";\n  ", ";\n"], ["\n  font-size: 14px;\n  line-height: 18px;\n  font-weight: 700;\n  ", ";\n  ", ";\n"])), uiFont, fontCss);
+var CONTENT_H1 = (0, styled_components_1.css)(templateObject_43 || (templateObject_43 = __makeTemplateObject(["\n  font-size: 36px;\n  line-height: 140%;\n  font-weight: 700;\n  ", ";\n  ", ";\n  "], ["\n  font-size: 36px;\n  line-height: 140%;\n  font-weight: 700;\n  ", ";\n  ", ";\n  "])), contentFont, fontCss);
+var CONTENT_H2 = (0, styled_components_1.css)(templateObject_44 || (templateObject_44 = __makeTemplateObject(["\n  font-size: 25px;\n  line-height: 140%;\n  font-weight: 700;\n  ", ";\n  ", ";\n  "], ["\n  font-size: 25px;\n  line-height: 140%;\n  font-weight: 700;\n  ", ";\n  ", ";\n  "])), contentFont, fontCss);
+var CONTENT_H3 = (0, styled_components_1.css)(templateObject_45 || (templateObject_45 = __makeTemplateObject(["\n  font-size: 18px;\n  line-height: 140%;\n  font-weight: 700;\n  ", ";\n  ", ";\n  "], ["\n  font-size: 18px;\n  line-height: 140%;\n  font-weight: 700;\n  ", ";\n  ", ";\n  "])), contentFont, fontCss);
+var CONTENT_BODY_SM = (0, styled_components_1.css)(templateObject_46 || (templateObject_46 = __makeTemplateObject(["\n  font-size: 15px;\n  line-height: 140%;\n  font-weight: 400;\n  ", ";\n  ", ";\n"], ["\n  font-size: 15px;\n  line-height: 140%;\n  font-weight: 400;\n  ", ";\n  ", ";\n"])), contentFont, fontCss);
+var CONTENT_BODY = (0, styled_components_1.css)(templateObject_47 || (templateObject_47 = __makeTemplateObject(["\n  font-size: 17px;\n  line-height: 140%;\n  font-weight: 400;\n  ", ";\n  ", ";\n"], ["\n  font-size: 17px;\n  line-height: 140%;\n  font-weight: 400;\n  ", ";\n  ", ";\n"])), contentFont, fontCss);
+var CONTENT_BODY_BOLD = (0, styled_components_1.css)(templateObject_48 || (templateObject_48 = __makeTemplateObject(["\n  font-size: 17px;\n  line-height: 140%;\n  font-weight: 600;\n  ", ";\n  ", ";\n"], ["\n  font-size: 17px;\n  line-height: 140%;\n  font-weight: 600;\n  ", ";\n  ", ";\n"])), contentFont, fontCss);
+var CONTENT_BODY_ITALIC = (0, styled_components_1.css)(templateObject_49 || (templateObject_49 = __makeTemplateObject(["\n  font-size: 17px;\n  line-height: 140%;\n  font-weight: 400;\n  font-style: italic;\n  ", ";\n  ", ";\n"], ["\n  font-size: 17px;\n  line-height: 140%;\n  font-weight: 400;\n  font-style: italic;\n  ", ";\n  ", ";\n"])), contentFont, fontCss);
+var CONTENT_BODY_BOLD_ITALIC = (0, styled_components_1.css)(templateObject_50 || (templateObject_50 = __makeTemplateObject(["\n  font-size: 17px;\n  line-height: 140%;\n  font-weight: 600;\n  font-style: italic;\n  ", ";\n  ", ";\n"], ["\n  font-size: 17px;\n  line-height: 140%;\n  font-weight: 600;\n  font-style: italic;\n  ", ";\n  ", ";\n"])), contentFont, fontCss);
+var CONTENT_QUOTE = (0, styled_components_1.css)(templateObject_51 || (templateObject_51 = __makeTemplateObject(["\n  padding: 0 16px;\n  font-size: 24px;\n  line-height: 35.04px;\n  font-weight: 400;\n  font-style: italic;\n  position: relative;\n  ::before {\n    /* Quote line (left) */\n        content: '';\n        position: absolute;\n        left: 0;\n        top: 0;\n        bottom: 0;\n        height: inherit; \n        width: 6px; \n        background-color: ", "; // temp colors need to replace with material colors */\n    }\n  ", ";\n  ", ";\n"], ["\n  padding: 0 16px;\n  font-size: 24px;\n  line-height: 35.04px;\n  font-weight: 400;\n  font-style: italic;\n  position: relative;\n  ::before {\n    /* Quote line (left) */\n        content: '';\n        position: absolute;\n        left: 0;\n        top: 0;\n        bottom: 0;\n        height: inherit; \n        width: 6px; \n        background-color: ", "; // temp colors need to replace with material colors */\n    }\n  ", ";\n  ", ";\n"])), function (_a) {
     var invert = _a.invert, colors = _a.theme.colors;
     return invert ? colors.greyColor40 : (0, utilsOolib_1.getPrimaryColor100)(colors);
 }, contentFont, fontCss);
-var CONTENT_TITLE_POSTIT = (0, styled_components_1.css)(templateObject_49 || (templateObject_49 = __makeTemplateObject(["\n  font-size: 15px;\n  font-style: normal;\n  font-weight: 700;\n  line-height:  130%;\n  ", ";\n  ", ";\n"], ["\n  font-size: 15px;\n  font-style: normal;\n  font-weight: 700;\n  line-height:  130%;\n  ", ";\n  ", ";\n"])), contentFont, fontCss);
-var CONTENT_BODY_POSTIT = (0, styled_components_1.css)(templateObject_50 || (templateObject_50 = __makeTemplateObject(["\n  font-size: 12px;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 130%;\n  ", ";\n  ", ";\n"], ["\n  font-size: 12px;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 130%;\n  ", ";\n  ", ";\n"])), contentFont, fontCss);
+var CONTENT_TITLE_POSTIT = (0, styled_components_1.css)(templateObject_52 || (templateObject_52 = __makeTemplateObject(["\n  font-size: 15px;\n  font-style: normal;\n  font-weight: 700;\n  line-height:  130%;\n  ", ";\n  ", ";\n"], ["\n  font-size: 15px;\n  font-style: normal;\n  font-weight: 700;\n  line-height:  130%;\n  ", ";\n  ", ";\n"])), contentFont, fontCss);
+var CONTENT_BODY_POSTIT = (0, styled_components_1.css)(templateObject_53 || (templateObject_53 = __makeTemplateObject(["\n  font-size: 12px;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 130%;\n  ", ";\n  ", ";\n"], ["\n  font-size: 12px;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 130%;\n  ", ";\n  ", ";\n"])), contentFont, fontCss);
 exports.typo = {
     UI_DISPLAY: UI_DISPLAY,
     UI_DISPLAY_SM: UI_DISPLAY_SM,
@@ -100,6 +103,7 @@ exports.typo = {
     UI_CAPTION_SEMIBOLD: UI_CAPTION_SEMIBOLD,
     UI_CAPTION_SEMIBOLD_DF: UI_CAPTION_SEMIBOLD_DF,
     UI_TAG: UI_TAG,
+    UI_TAG_DF: UI_TAG_DF,
     UI_HELPTEXT: UI_HELPTEXT,
     UI_STAT_LG: UI_STAT_LG,
     UI_STAT_SM: UI_STAT_SM,
@@ -115,4 +119,4 @@ exports.typo = {
     CONTENT_TITLE_POSTIT: CONTENT_TITLE_POSTIT,
     CONTENT_BODY_POSTIT: CONTENT_BODY_POSTIT
 };
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19, templateObject_20, templateObject_21, templateObject_22, templateObject_23, templateObject_24, templateObject_25, templateObject_26, templateObject_27, templateObject_28, templateObject_29, templateObject_30, templateObject_31, templateObject_32, templateObject_33, templateObject_34, templateObject_35, templateObject_36, templateObject_37, templateObject_38, templateObject_39, templateObject_40, templateObject_41, templateObject_42, templateObject_43, templateObject_44, templateObject_45, templateObject_46, templateObject_47, templateObject_48, templateObject_49, templateObject_50;
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19, templateObject_20, templateObject_21, templateObject_22, templateObject_23, templateObject_24, templateObject_25, templateObject_26, templateObject_27, templateObject_28, templateObject_29, templateObject_30, templateObject_31, templateObject_32, templateObject_33, templateObject_34, templateObject_35, templateObject_36, templateObject_37, templateObject_38, templateObject_39, templateObject_40, templateObject_41, templateObject_42, templateObject_43, templateObject_44, templateObject_45, templateObject_46, templateObject_47, templateObject_48, templateObject_49, templateObject_50, templateObject_51, templateObject_52, templateObject_53;

package/package.json

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

package/dist/stories/v2/components/TagClear.stories.d.ts

@@ -1,28 +0,0 @@
-declare namespace _default {
-    let title: string;
-    namespace argTypes {
-        namespace display {
-            let name: string;
-        }
-        namespace value {
-            let name_1: string;
-            export { name_1 as name };
-        }
-        namespace id {
-            let name_2: string;
-            export { name_2 as name };
-        }
-    }
-    namespace args {
-        let display_1: string;
-        export { display_1 as display };
-        let value_1: string;
-        export { value_1 as value };
-        let id_1: string;
-        export { id_1 as id };
-        export let textColor: string;
-    }
-}
-export default _default;
-export function Playground(args: any): import("react").JSX.Element;
-export function Tag_Clear(args: any): import("react").JSX.Element;

package/dist/stories/v2/components/TagClear.stories.js

@@ -1,79 +0,0 @@
-"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);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Tag_Clear = exports.Playground = void 0;
-var Tags_1 = require("../../../v2/components/Tags");
-var Typo2_1 = require("../../../v2/components/Typo2");
-var themes_1 = require("../../../v2/themes");
-exports.default = {
-    title: "Oolib V 2.0/Components/Tags/Tag Clear",
-    argTypes: {
-        display: {
-            name: "Text",
-        },
-        // size: {
-        //   name: "Size",
-        //   options: ["ExtraSmall", "Small", "Medium"],
-        //   mapping: {
-        //     ExtraSmall: "XS",
-        //     Small: "S",
-        //     Medium: "M",
-        //   },
-        //   control: { type: "inline-radio" },
-        // },
-        // tagColor: {
-        //   name: "Tag Color",
-        //   options: availableColors,
-        //   control: { type: "select" },
-        // },
-        // textColor: {
-        //   name: "Text Color",
-        //   options: availableTextColors,
-        //   control: { type: "select" },
-        // },
-        value: {
-            name: "Value"
-        },
-        id: {
-            name: "Id"
-        }
-    },
-    args: {
-        display: "Tag Clear",
-        // size: "ExtraSmall",
-        value: "text",
-        id: "tags",
-        // tagColor: "",
-        textColor: "",
-    },
-};
-var GenTag = function (_a) {
-    var args = _a.args, Comp = _a.Comp, variant = _a.variant;
-    args[args["size"]] = true;
-    args.tagColor = themes_1.colors[args.tagColor];
-    args.textColor = themes_1.colors[args.textColor];
-    return (React.createElement("div", null,
-        React.createElement(Comp, __assign({}, args, { variant: variant }))));
-};
-var Playground = function (args) {
-    return (React.createElement("div", { style: { display: 'flex', flexDirection: "column", gap: '3rem', margin: '2rem 10rem' } },
-        React.createElement("div", null,
-            React.createElement(Typo2_1.UI_BODY_SEMIBOLD_SM, null, "Tag Clear"),
-            React.createElement(GenTag, { args: args, Comp: Tags_1.TagClear }))));
-};
-exports.Playground = Playground;
-var Tag_Clear = function (args) {
-    return React.createElement("div", { style: { margin: "2rem 10rem" } },
-        React.createElement(GenTag, { args: args, Comp: Tags_1.TagClear }));
-};
-exports.Tag_Clear = Tag_Clear;

package/dist/stories/v2/components/TagDisplay.stories.d.ts

@@ -1,90 +0,0 @@
-declare namespace _default {
-    let title: string;
-    namespace argTypes {
-        namespace display {
-            let name: string;
-        }
-        namespace size {
-            let name_1: string;
-            export { name_1 as name };
-            export let options: string[];
-            export namespace mapping {
-                let ExtraSmall: string;
-                let Small: string;
-                let Medium: string;
-            }
-            export namespace control {
-                let type: string;
-            }
-        }
-        namespace tagColor {
-            let name_2: string;
-            export { name_2 as name };
-            export { availableColors as options };
-            export namespace control_1 {
-                let type_1: string;
-                export { type_1 as type };
-            }
-            export { control_1 as control };
-        }
-        namespace textColor {
-            let name_3: string;
-            export { name_3 as name };
-            export { availableTextColors as options };
-            export namespace control_2 {
-                let type_2: string;
-                export { type_2 as type };
-            }
-            export { control_2 as control };
-        }
-        namespace value {
-            let name_4: string;
-            export { name_4 as name };
-        }
-        namespace id {
-            let name_5: string;
-            export { name_5 as name };
-        }
-    }
-    namespace args {
-        let display_1: string;
-        export { display_1 as display };
-        let size_1: string;
-        export { size_1 as size };
-        let value_1: string;
-        export { value_1 as value };
-        let id_1: string;
-        export { id_1 as id };
-        let tagColor_1: string;
-        export { tagColor_1 as tagColor };
-        let textColor_1: string;
-        export { textColor_1 as textColor };
-    }
-}
-export default _default;
-export function Playground(args: any): import("react").JSX.Element;
-export function Tag_Display(args: any): import("react").JSX.Element;
-export namespace Tag_Display {
-    export namespace args_1 {
-        let variant: string;
-    }
-    export { args_1 as args };
-    export namespace argTypes_1 {
-        export namespace variant_1 {
-            let name_6: string;
-            export { name_6 as name };
-            let options_1: string[];
-            export { options_1 as options };
-            export namespace control_3 {
-                let type_3: string;
-                export { type_3 as type };
-            }
-            export { control_3 as control };
-            export let defaultValue: string;
-        }
-        export { variant_1 as variant };
-    }
-    export { argTypes_1 as argTypes };
-}
-declare const availableColors: string[];
-declare const availableTextColors: string[];

package/dist/stories/v2/components/TagDisplay.stories.js

@@ -1,137 +0,0 @@
-"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 __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
-    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
-        if (ar || !(i in from)) {
-            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
-            ar[i] = from[i];
-        }
-    }
-    return to.concat(ar || Array.prototype.slice.call(from));
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Tag_Display = exports.Playground = void 0;
-var Tags_1 = require("../../../v2/components/Tags");
-var Typo2_1 = require("../../../v2/components/Typo2");
-var themes_1 = require("../../../v2/themes");
-var availableColors = __spreadArray([], Object.keys(themes_1.colors).sort(), true);
-var availableTextColors = __spreadArray([], Object.keys(themes_1.colors).sort(), true);
-exports.default = {
-    title: "Oolib V 2.0/Components/Tags/Tag Display",
-    argTypes: {
-        display: {
-            name: "Text",
-        },
-        size: {
-            name: "Size",
-            options: ["ExtraSmall", "Small", "Medium"],
-            mapping: {
-                ExtraSmall: "XS",
-                Small: "S",
-                Medium: "M",
-            },
-            control: { type: "inline-radio" },
-        },
-        tagColor: {
-            name: "Tag Color",
-            options: availableColors,
-            control: { type: "select" },
-        },
-        textColor: {
-            name: "Text Color",
-            options: availableTextColors,
-            control: { type: "select" },
-        },
-        value: {
-            name: "Value"
-        },
-        id: {
-            name: "Id"
-        }
-    },
-    args: {
-        display: "Tag Display",
-        size: "Small",
-        value: "text",
-        id: "tags",
-        tagColor: "",
-        textColor: "",
-    },
-};
-var GenTag = function (_a) {
-    var args = _a.args, Comp = _a.Comp, variant = _a.variant;
-    args[args["size"]] = true;
-    args.tagColor = themes_1.colors[args.tagColor];
-    args.textColor = themes_1.colors[args.textColor];
-    return (React.createElement("div", { style: { padding: "2rem" } },
-        React.createElement(Comp, __assign({}, args, { variant: variant }))));
-};
-var Playground = function (args) {
-    return (React.createElement("div", { style: { display: 'flex', flexDirection: "column", gap: '3rem', margin: '2rem 10rem' } },
-        React.createElement("div", null,
-            React.createElement(Typo2_1.UI_BODY_SEMIBOLD_SM, null, "Default"),
-            React.createElement(GenTag, { args: args, Comp: Tags_1.TagDisplay })),
-        React.createElement("div", null,
-            React.createElement(Typo2_1.UI_BODY_SEMIBOLD_SM, null, "Positive"),
-            React.createElement(GenTag, { args: args, Comp: Tags_1.TagDisplay, variant: "positive" })),
-        React.createElement("div", null,
-            React.createElement(Typo2_1.UI_BODY_SEMIBOLD_SM, null, "In Progress"),
-            React.createElement(GenTag, { args: args, Comp: Tags_1.TagDisplay, variant: "inProgress" })),
-        React.createElement("div", null,
-            React.createElement(Typo2_1.UI_BODY_SEMIBOLD_SM, null, "Warning"),
-            React.createElement(GenTag, { args: args, Comp: Tags_1.TagDisplay, variant: "warning" })),
-        React.createElement("div", null,
-            React.createElement(Typo2_1.UI_BODY_SEMIBOLD_SM, null, "Negative"),
-            React.createElement(GenTag, { args: args, Comp: Tags_1.TagDisplay, variant: "negative" })),
-        React.createElement("div", null,
-            React.createElement(Typo2_1.UI_BODY_SEMIBOLD_SM, null, "Special"),
-            React.createElement(GenTag, { args: args, Comp: Tags_1.TagDisplay, variant: "special" }))));
-};
-exports.Playground = Playground;
-var Tag_Display = function (args) {
-    return React.createElement(Tags_1.TagDisplay, __assign({}, args));
-};
-exports.Tag_Display = Tag_Display;
-exports.Tag_Display.args = {
-    variant: "default"
-};
-exports.Tag_Display.argTypes = {
-    variant: {
-        name: "Variant",
-        options: ["positive", "inProgress", "warning", "negative", "special", "default"],
-        control: { type: "select" },
-        defaultValue: "default",
-    },
-};
-// Tag_Display.parameters = { controls: { exclude: ["value", "tagColor"] } };
-// export const Tag_Display_Secondary = (args) => {
-//   return <GenTag args={args} Comp={TagDisplay} variant="secondary" />;
-// };
-// export const Tag_Display_Grey = (args) => {
-//   return <GenTag args={args} Comp={TagDisplay} variant="grey" />;
-// };
-// export const Tag_Display_Positive = (args) => {
-//   return <GenTag args={args} Comp={TagDisplay} variant="positive" />;
-// };
-// export const Tag_Display_InProgress = (args) => {
-//   return <GenTag args={args} Comp={TagDisplay} variant="inProgress" />;
-// };
-// export const Tag_Display_Warning = (args) => {
-//   return <GenTag args={args} Comp={TagDisplay} variant="warning" />;
-// };
-// export const Tag_Display_Negative = (args) => {
-//   return <GenTag args={args} Comp={TagDisplay} variant="negative" />;
-// };
-// export const Tag_Display_Special = (args) => {
-//   return <GenTag args={args} Comp={TagDisplay} variant="special" />;
-// };

package/dist/stories/v2/components/TagLink.stories.d.ts

@@ -1,28 +0,0 @@
-declare namespace _default {
-    let title: string;
-    namespace argTypes {
-        namespace display {
-            let name: string;
-        }
-        namespace value {
-            let name_1: string;
-            export { name_1 as name };
-        }
-        namespace id {
-            let name_2: string;
-            export { name_2 as name };
-        }
-    }
-    namespace args {
-        let display_1: string;
-        export { display_1 as display };
-        let value_1: string;
-        export { value_1 as value };
-        let id_1: string;
-        export { id_1 as id };
-        export let textColor: string;
-    }
-}
-export default _default;
-export function Playground(args: any): import("react").JSX.Element;
-export function Tag_Link(args: any): import("react").JSX.Element;

package/dist/stories/v2/components/TagLink.stories.js

@@ -1,79 +0,0 @@
-"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);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Tag_Link = exports.Playground = void 0;
-var Tags_1 = require("../../../v2/components/Tags");
-var Typo2_1 = require("../../../v2/components/Typo2");
-var themes_1 = require("../../../v2/themes");
-exports.default = {
-    title: "Oolib V 2.0/Components/Tags/Tag Link",
-    argTypes: {
-        display: {
-            name: "Text",
-        },
-        // size: {
-        //   name: "Size",
-        //   options: ["ExtraSmall", "Small", "Medium"],
-        //   mapping: {
-        //     ExtraSmall: "XS",
-        //     Small: "S",
-        //     Medium: "M",
-        //   },
-        //   control: { type: "inline-radio" },
-        // },
-        // tagColor: {
-        //   name: "Tag Color",
-        //   options: availableColors,
-        //   control: { type: "select" },
-        // },
-        // textColor: {
-        //   name: "Text Color",
-        //   options: availableTextColors,
-        //   control: { type: "select" },
-        // },
-        value: {
-            name: "Value"
-        },
-        id: {
-            name: "Id"
-        }
-    },
-    args: {
-        display: "Tag Link",
-        // size: "ExtraSmall",
-        value: "text",
-        id: "tags",
-        // tagColor: "",
-        textColor: "",
-    },
-};
-var GenTag = function (_a) {
-    var args = _a.args, Comp = _a.Comp, variant = _a.variant;
-    args[args["size"]] = true;
-    args.tagColor = themes_1.colors[args.tagColor];
-    args.textColor = themes_1.colors[args.textColor];
-    return (React.createElement("div", null,
-        React.createElement(Comp, __assign({}, args, { variant: variant }))));
-};
-var Playground = function (args) {
-    return (React.createElement("div", { style: { display: 'flex', flexDirection: "column", gap: '3rem', margin: '2rem 10rem' } },
-        React.createElement(Typo2_1.UI_BODY_SEMIBOLD_SM, null, "Tag Clear"),
-        React.createElement(GenTag, { args: args, Comp: Tags_1.TagLink })));
-};
-exports.Playground = Playground;
-var Tag_Link = function (args) {
-    return (React.createElement("div", { style: { margin: "2rem 10rem" } },
-        React.createElement(GenTag, { args: args, Comp: Tags_1.TagLink }),
-        ";"));
-};
-exports.Tag_Link = Tag_Link;

package/dist/v2/components/Tags/Comps/TagClear/styled.d.ts

@@ -1,15 +0,0 @@
-import { SIZES } from "../styled";
-export interface StyledTagClearProps {
-    variant: 'primary' | 'ghost';
-    size: keyof typeof SIZES;
-    invert?: boolean;
-    grey?: boolean;
-}
-export declare const StyledTagClear: import("styled-components").StyledComponent<"div", any, StyledTagClearProps, never>;
-export interface StyledTagClearIconWrapperProps {
-    invert?: boolean;
-    grey?: boolean;
-    variant: 'primary' | 'ghost';
-    onClick?: () => void;
-}
-export declare const StyledTagClearIconWrapper: import("styled-components").StyledComponent<"button", any, StyledTagClearIconWrapperProps, never>;

package/dist/v2/components/Tags/Comps/TagClear/styled.js

@@ -1,21 +0,0 @@
-"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.StyledTagClearIconWrapper = exports.StyledTagClear = void 0;
-var styled_components_1 = __importDefault(require("styled-components"));
-var styled_1 = require("../styled");
-var themes_1 = require("../../../../themes");
-var mixins_1 = require("../../../../../themes/mixins");
-var grey5 = themes_1.colors.grey5, grey60 = themes_1.colors.grey60, redBG = themes_1.colors.redBG, red = themes_1.colors.red;
-exports.StyledTagClear = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n    ", " // size wont get applied here because of css specificity, there is no different size design yet \n    padding: 0.1rem 0.5rem;\n    background-color: ", ";\n    color: ", ";\n    cursor: pointer;\n    position: relative;\n    border-radius: 0.4rem;\n\n    &:hover{\n      background-color: ", ";\n      color: ", ";\n    }\n"], ["\n    ", " // size wont get applied here because of css specificity, there is no different size design yet \n    padding: 0.1rem 0.5rem;\n    background-color: ", ";\n    color: ", ";\n    cursor: pointer;\n    position: relative;\n    border-radius: 0.4rem;\n\n    &:hover{\n      background-color: ", ";\n      color: ", ";\n    }\n"])), function (_a) {
-    var size = _a.size;
-    return (0, styled_1.commonStyle)({ size: size });
-}, grey5, grey60, redBG, red);
-exports.StyledTagClearIconWrapper = styled_components_1.default.button(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n    border: none;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    cursor: pointer;\n    height: 100%;\n    padding: 0 0.5rem;\n    border-radius: 0.4rem;\n    position: absolute;\n    right: 0;\n    background: linear-gradient(90deg, rgba(255, 227, 227, 0.00) 0%, ", " 28.76%);\n    color: ", ";\n    ", ";\n"], ["\n    border: none;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    cursor: pointer;\n    height: 100%;\n    padding: 0 0.5rem;\n    border-radius: 0.4rem;\n    position: absolute;\n    right: 0;\n    background: linear-gradient(90deg, rgba(255, 227, 227, 0.00) 0%, ", " 28.76%);\n    color: ", ";\n    ", ";\n"])), redBG, red, (0, mixins_1.transition)('color', 'background-color'));
-var templateObject_1, templateObject_2;

package/dist/v2/components/Tags/Comps/TagDisplay/styled.d.ts

@@ -1,5 +0,0 @@
-import { TagDisplayProps } from ".";
-export interface StyledTagDisplayProps extends Omit<TagDisplayProps, 'display' | 'style' | 'M' | 'XS'> {
-    size?: 'M' | 'XS' | 'S';
-}
-export declare const StyledTagDisplay: import("styled-components").StyledComponent<"div", any, StyledTagDisplayProps, never>;