oolib 2.208.0 → 2.208.1

package/dist/components/TextInputs/index.js

@@ -1,367 +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 __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 () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-var __generator = (this && this.__generator) || function (thisArg, body) {
-    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
-    return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
-    function verb(n) { return function (v) { return step([n, v]); }; }
-    function step(op) {
-        if (f) throw new TypeError("Generator is already executing.");
-        while (g && (g = 0, op[0] && (_ = 0)), _) try {
-            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
-            if (y = 0, t) op = [op[0] & 2, t.value];
-            switch (op[0]) {
-                case 0: case 1: t = op; break;
-                case 4: _.label++; return { value: op[1], done: false };
-                case 5: _.label++; y = op[1]; op = [0]; continue;
-                case 7: op = _.ops.pop(); _.trys.pop(); continue;
-                default:
-                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
-                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
-                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
-                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
-                    if (t[2]) _.ops.pop();
-                    _.trys.pop(); continue;
-            }
-            op = body.call(thisArg, _);
-        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
-        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
-    }
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.NumberInput = exports.URLInput = exports.PhoneInput = exports.EmailInput = exports.PasswordInput = exports.TextInput = void 0;
-var react_1 = __importStar(require("react"));
-var index_styled_1 = require("./index.styled");
-var icons_1 = require("../../icons");
-var BlockLabel_1 = require("../../v2/components/BlockLabel");
-var Typo_1 = require("../Typo");
-var Buttons_1 = require("../Buttons");
-var _EXPORTS_1 = require("../../utils/_EXPORTS");
-var LoadersAndProgress_1 = require("../LoadersAndProgress");
-var OKELink_1 = require("../OKELink");
-var utilsOolib_1 = require("../../utilsOolib");
-var styled_components_1 = require("styled-components");
-var DisplayIcon = function (_a) {
-    var icon = _a.icon, onClick = _a.onClick, size = _a.size;
-    var IconComp = icons_1.icons[icon];
-    return (react_1.default.createElement("div", { style: { cursor: onClick ? "pointer" : "", display: "flex" }, onMouseDown: onClick || null }, IconComp && react_1.default.createElement(IconComp, { size: size, weight: "bold" })));
-};
-var TextInput = function (props) {
-    var id = props.id, invert = props.invert, disabled = props.disabled, icon = props.icon, type = props.type, _a = props.placeholder, placeholder = _a === void 0 ? "Enter Text..." : _a, _b = props.value, value = _b === void 0 ? "" : _b, onChange = props.onChange, onFocus = props.onFocus, onBlur = props.onBlur, readOnly = props.readOnly, iconOnClick = props.iconOnClick, eyeIcon = props.eyeIcon, S = props.S, handleValidation = props.handleValidation, _c = props.validateOnMount, validateOnMount = _c === void 0 ? true : _c, // i think it makes sense to always run validation the minute the comp mounts, but we will see if this has sideeffects
-    actionBtn = props.actionBtn, clearBtn = props.clearBtn, className = props.className, maxLength = props.maxLength, DEPRECATED_maxNumLimiter = props.maxNumLimiter, forceFocus = props.forceFocus, //sometimes, when some other elem is clicked, we wanna trigger focus on the textinput. eg. when on mobile, the search icon is clicked on the listingpage
-    _d = props.validateOnlyOnBlur, //sometimes, when some other elem is clicked, we wanna trigger focus on the textinput. eg. when on mobile, the search icon is clicked on the listingpage
-    validateOnlyOnBlur = _d === void 0 ? false : _d, //for example, in the login form we want validation to only run, once the text input is blurred. else it can be irritating
-    _validationStatus = props.validationStatus, _e = props.displayValidationMsg, displayValidationMsg = _e === void 0 ? true : _e, content = props.content, passValidationErrorToFormValidation = props.passValidationErrorToFormValidation, plugin = props.plugin;
-    var theme = (0, styled_components_1.useTheme)();
-    var _f = (0, react_1.useState)(_validationStatus), validationStatus = _f[0], setValidationStatus = _f[1];
-    (0, react_1.useEffect)(function () {
-        setValidationStatus(_validationStatus);
-    }, [_validationStatus]);
-    var composition = icon && !eyeIcon ? "icon+text" : "textOnly";
-    var size = S ? "S" : "M";
-    var actionBtnEnabaled = !!value && (type !== "url" ? true : (validationStatus === null || validationStatus === void 0 ? void 0 : validationStatus.type) === "success");
-    var clearBtnEnabled = !!value && (type !== "url" ? true : (validationStatus === null || validationStatus === void 0 ? void 0 : validationStatus.type) === "success");
-    var handleValidate = function (e, onBlur) { return __awaiter(void 0, void 0, void 0, function () {
-        var value, res, validationPlugin, pluginResponse;
-        return __generator(this, function (_a) {
-            switch (_a.label) {
-                case 0:
-                    onBlur && onBlur(e);
-                    value = e.target.value;
-                    if (!value)
-                        return [2 /*return*/];
-                    if (type === "url")
-                        setValidationStatus("loading");
-                    if (!handleValidation) return [3 /*break*/, 2];
-                    return [4 /*yield*/, handleValidation(value)];
-                case 1:
-                    res = _a.sent();
-                    setValidationStatus(res);
-                    _a.label = 2;
-                case 2:
-                    validationPlugin = ((plugin === null || plugin === void 0 ? void 0 : plugin.validation) &&
-                        theme.pluginConfigs &&
-                        theme.pluginConfigs.tplBlockPlugins[plugin.validation]);
-                    if (!validationPlugin) return [3 /*break*/, 4];
-                    setValidationStatus('loading');
-                    return [4 /*yield*/, validationPlugin({
-                            value: value,
-                            content: content,
-                            passValidationErrorToFormValidation: passValidationErrorToFormValidation,
-                        })];
-                case 3:
-                    pluginResponse = _a.sent();
-                    //if plugin responds with undefined, it means it found no error. hence lets pass the 'success info' to passValidationErrorToFormValidation
-                    if (!pluginResponse)
-                        passValidationErrorToFormValidation('success');
-                    setValidationStatus(pluginResponse);
-                    _a.label = 4;
-                case 4: return [2 /*return*/];
-            }
-        });
-    }); };
-    (0, react_1.useEffect)(function () {
-        if (validateOnMount) {
-            handleValidate({ target: { value: value } });
-        }
-    }, [validateOnMount]);
-    var handleOnChange = function (e) {
-        onChange(id, e.target.value);
-        if (!e.target.value)
-            setValidationStatus('');
-        if (!validateOnlyOnBlur) {
-            handleValidate(e);
-        }
-        else {
-            /**
-             * basically if an error has already been set then, run validation in realtime on change
-             */
-            if (validationStatus) {
-                if (type === "url")
-                    return setValidationStatus("");
-                handleValidate(e);
-            }
-        }
-    };
-    var inputRef = (0, react_1.useRef)(null);
-    (0, react_1.useEffect)(function () {
-        forceFocus && inputRef.current && inputRef.current.focus();
-    }, [forceFocus]);
-    var localize = (0, utilsOolib_1.useLocale)();
-    return (react_1.default.createElement(react_1.default.Fragment, null,
-        react_1.default.createElement("div", { className: className },
-            react_1.default.createElement(BlockLabel_1.BlockLabel, __assign({}, (0, _EXPORTS_1.getBlockLabelProps)(props))),
-            readOnly ? (react_1.default.createElement(Typo_1.SANS_3, { invert: invert }, type === "url"
-                ? react_1.default.createElement(OKELink_1.OKELink, { text: value, to: value })
-                : type === "password"
-                    ? "********" : value)) : (react_1.default.createElement(react_1.default.Fragment, null,
-                react_1.default.createElement(index_styled_1.InputContainerStyled, { invert: invert, type: type, disabled: disabled, status: validationStatus === null || validationStatus === void 0 ? void 0 : validationStatus.type, eyeIcon: eyeIcon, composition: composition, onClick: function () { return inputRef.current.focus(); } },
-                    icon && (react_1.default.createElement(DisplayIcon, { icon: icon, size: S ? 15 : 20, onClick: iconOnClick || null })),
-                    react_1.default.createElement(index_styled_1.InputStyled, { ref: inputRef, className: size === "S" ? "SANS_2" : "SANS_3", id: id, type: type, name: type, placeholder: localize(placeholder), value: value, onChange: handleOnChange, maxLength: maxLength || DEPRECATED_maxNumLimiter, onBlur: validateOnlyOnBlur
-                            ? function (e) { return handleValidate(e, onBlur); }
-                            : onBlur, onFocus: onFocus, size: size, autoComplete: "off" }),
-                    validationStatus === "loading" && (react_1.default.createElement("div", null,
-                        react_1.default.createElement(LoadersAndProgress_1.LoaderCircle, { S: true, invert: invert }))),
-                    clearBtn && (react_1.default.createElement(Buttons_1.ButtonGhost, { M: true, value: clearBtn.text, invert: clearBtn.invert, onClick: function () { return onChange(props.id, ""); }, disabled: !clearBtnEnabled, style: { marginRight: actionBtn ? "-1rem" : "-2rem" } })),
-                    actionBtn && (react_1.default.createElement(Buttons_1.ButtonPrimary, { M: true, value: actionBtn.text, invert: actionBtn.invert, onClick: actionBtnEnabaled && actionBtn.onClick, disabled: !actionBtnEnabaled, style: { marginRight: "-2rem" } }))),
-                (displayValidationMsg && (validationStatus === null || validationStatus === void 0 ? void 0 : validationStatus.msg)) && (react_1.default.createElement(index_styled_1.MsgContainer, { invert: invert, status: validationStatus === null || validationStatus === void 0 ? void 0 : validationStatus.type },
-                    react_1.default.createElement(Typo_1.SANS_3, null,
-                        validationStatus.msg,
-                        validationStatus.link && (react_1.default.createElement(OKELink_1.OKELink, { style: { marginLeft: "1rem" }, to: validationStatus.link.to }, validationStatus.link.text))))))))));
-};
-exports.TextInput = TextInput;
-//passValidationErrorToFormValidation is not being handled by PasswordInput, cuz i dont think we will need it here..
-var PasswordInput = function (_a) {
-    var props = __rest(_a, []);
-    var _b = (0, react_1.useState)(false), showPassword = _b[0], setShowPassword = _b[1];
-    var icon = showPassword ? "Eye" : "EyeClosed";
-    var toggleShowPassword = function (e) {
-        e.preventDefault();
-        setShowPassword(function (prev) { return !prev; });
-    };
-    return (react_1.default.createElement(exports.TextInput, __assign({ placeholder: "Enter password...", type: showPassword ? "text" : "password", iconOnClick: toggleShowPassword, eyeIcon: true, icon: icon }, props)));
-};
-exports.PasswordInput = PasswordInput;
-var EmailInput = function (_a) {
-    var passValidationErrorToFormValidation = _a.passValidationErrorToFormValidation, props = __rest(_a, ["passValidationErrorToFormValidation"]);
-    var handleValidation = function (value) {
-        var regEx = /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
-        var errorObj = regEx.test(value)
-            ? ""
-            : { type: "error", msg: "Enter a valid email address" };
-        if (passValidationErrorToFormValidation) {
-            passValidationErrorToFormValidation((errorObj === null || errorObj === void 0 ? void 0 : errorObj.type) || "success");
-        }
-        return errorObj;
-    };
-    return (react_1.default.createElement(exports.TextInput, __assign({ type: "email", placeholder: "Enter email...", handleValidation: handleValidation }, props)));
-};
-exports.EmailInput = EmailInput;
-var PhoneInput = function (_a) {
-    var passValidationErrorToFormValidation = _a.passValidationErrorToFormValidation, props = __rest(_a, ["passValidationErrorToFormValidation"]);
-    var handleValidation = function (value) {
-        var errorObj;
-        if (isNaN(value)) {
-            errorObj = { type: "error", msg: "Enter a valid phone number" };
-            if (passValidationErrorToFormValidation)
-                passValidationErrorToFormValidation(errorObj.type);
-            return errorObj;
-        }
-        if (value.length < 9) {
-            errorObj = { type: "error", msg: "Enter a valid phone number" };
-            if (passValidationErrorToFormValidation)
-                passValidationErrorToFormValidation(errorObj.type);
-            return errorObj;
-        }
-        //else
-        if (passValidationErrorToFormValidation)
-            passValidationErrorToFormValidation("success");
-    };
-    return (react_1.default.createElement(exports.TextInput, __assign({ type: "tel", placeholder: "Enter Phone...", handleValidation: handleValidation, maxLength: 11 }, props)));
-};
-exports.PhoneInput = PhoneInput;
-var URLInput = function (_a) {
-    var _b = _a.routesAreValidInputs, routesAreValidInputs = _b === void 0 ? false : _b, //if we want react route declarations to be considered as 'valid' then set this to true
-    validationPlugin = _a.validationPlugin, passValidationErrorToFormValidation = _a.passValidationErrorToFormValidation, content = _a.content, props = __rest(_a, ["routesAreValidInputs", "validationPlugin", "passValidationErrorToFormValidation", "content"]);
-    var handleValidation = function (value) { return __awaiter(void 0, void 0, void 0, function () {
-        var pluginResponse, successObj, response, successObj, err_1, successObj, errorObj;
-        return __generator(this, function (_a) {
-            switch (_a.label) {
-                case 0:
-                    if (!validationPlugin) return [3 /*break*/, 2];
-                    return [4 /*yield*/, validationPlugin({
-                            value: value,
-                            content: content,
-                            passValidationErrorToFormValidation: passValidationErrorToFormValidation,
-                        })];
-                case 1:
-                    pluginResponse = _a.sent();
-                    if (pluginResponse)
-                        return [2 /*return*/, pluginResponse];
-                    _a.label = 2;
-                case 2:
-                    //else
-                    //if routesAreValidInputs, then first validate for a route
-                    if (routesAreValidInputs && value.substring(0, 1) === "/") {
-                        successObj = { type: "success", msg: "valid route" };
-                        if (passValidationErrorToFormValidation)
-                            passValidationErrorToFormValidation(successObj.type);
-                        return [2 /*return*/, successObj];
-                    }
-                    //else validate for a url
-                    if (!/^https?:\/\//i.test(value)) {
-                        value = "https://" + value;
-                    }
-                    _a.label = 3;
-                case 3:
-                    _a.trys.push([3, 5, , 6]);
-                    return [4 /*yield*/, fetch(value)];
-                case 4:
-                    response = _a.sent();
-                    if (response.status !== 200)
-                        throw new Error("");
-                    successObj = { type: "success", msg: "valid url" };
-                    if (passValidationErrorToFormValidation)
-                        passValidationErrorToFormValidation(successObj.type);
-                    return [2 /*return*/, successObj];
-                case 5:
-                    err_1 = _a.sent();
-                    if (/[(http(s)?):\/\/(www\.)?a-zA-Z0-9@:%._\+~#=]{2,256}\.[a-z]{2,6}\b([-a-zA-Z0-9@:%_\+.~#?&//=]*)/gi.test(value)) {
-                        successObj = { type: "success", msg: "valid url" };
-                        if (passValidationErrorToFormValidation)
-                            passValidationErrorToFormValidation(successObj.type);
-                        return [2 /*return*/, successObj];
-                    }
-                    errorObj = { type: "error", msg: "Enter a valid url..." };
-                    if (passValidationErrorToFormValidation)
-                        passValidationErrorToFormValidation(errorObj.type);
-                    return [2 /*return*/, errorObj];
-                case 6: return [2 /*return*/];
-            }
-        });
-    }); };
-    return (react_1.default.createElement(exports.TextInput, __assign({ type: "url", handleValidation: handleValidation, placeholder: "Enter a valid url..." }, props)));
-};
-exports.URLInput = URLInput;
-var NumberInput = function (_a) {
-    var passValidationErrorToFormValidation = _a.passValidationErrorToFormValidation, props = __rest(_a, ["passValidationErrorToFormValidation"]);
-    var min = props.min, max = props.max;
-    var handleValidation = function (value) {
-        var errorObj;
-        if (isNaN(value)) {
-            errorObj = { type: "error", msg: "Enter a number" };
-            if (passValidationErrorToFormValidation)
-                passValidationErrorToFormValidation(errorObj.type);
-            return errorObj;
-        }
-        if (min && value < min) {
-            errorObj = {
-                type: "error",
-                msg: "Enter value greater than or equal to ".concat(min),
-            };
-            if (passValidationErrorToFormValidation)
-                passValidationErrorToFormValidation(errorObj.type);
-            return errorObj;
-        }
-        if (max && value > max) {
-            errorObj = {
-                type: "error",
-                msg: "Enter value less than or equal to ".concat(max),
-            };
-            if (passValidationErrorToFormValidation)
-                passValidationErrorToFormValidation(errorObj.type);
-            return errorObj;
-        }
-        //else
-        if (passValidationErrorToFormValidation)
-            passValidationErrorToFormValidation("success");
-    };
-    return (react_1.default.createElement(exports.TextInput
-    // type="number"
-    , __assign({ 
-        // type="number"
-        handleValidation: handleValidation, placeholder: "Enter Number..." }, props)));
-};
-exports.NumberInput = NumberInput;

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

@@ -1,3 +0,0 @@
-export const MsgContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
-export const InputContainerStyled: import("styled-components").StyledComponent<"div", any, {}, never>;
-export const InputStyled: import("styled-components").StyledComponent<"input", any, {}, never>;

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

@@ -1,77 +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.InputStyled = exports.InputContainerStyled = exports.MsgContainer = void 0;
-var styled_components_1 = __importDefault(require("styled-components"));
-var styled_components_2 = require("styled-components");
-var themes_1 = require("../../themes");
-var mixins_1 = require("../../themes/mixins");
-var globalVariables_1 = require("../../globalStyles/globalVariables");
-var greyColor10 = themes_1.colors.greyColor10, greyColor70 = themes_1.colors.greyColor70, greyColor5 = themes_1.colors.greyColor5, greyColor15 = themes_1.colors.greyColor15, greyColor80 = themes_1.colors.greyColor80, greyColor40 = themes_1.colors.greyColor40, greyColor100 = themes_1.colors.greyColor100, white = themes_1.colors.white, red = themes_1.colors.red, green = themes_1.colors.green, invertRed = themes_1.colors.invertRed, invertGreen = themes_1.colors.invertGreen;
-var SIZES = {
-    S: "3rem",
-    M: "4rem",
-};
-var getColorValue = function (status, invert) {
-    switch (status) {
-        case 'error':
-            return invert ? invertRed : red;
-        case 'success':
-            return invert ? invertGreen : green;
-    }
-};
-exports.MsgContainer = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  margin-top: 0.5rem;\n  ", "\n"], ["\n  margin-top: 0.5rem;\n  ", "\n"])), function (_a) {
-    var status = _a.status, invert = _a.invert;
-    return status && (0, styled_components_2.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n      color: ", ";\n    "], ["\n      color: ", ";\n    "])), getColorValue(status, invert));
-});
-exports.InputContainerStyled = styled_components_1.default.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n  ", "\n  ", ";\n\n  position: relative;\n  background-color: ", ";\n  color: ", ";\n  display: flex;\n  align-items: center;\n  gap: 1rem;\n  ", "\n\n  ", "\n  ", "\n\n  ", ";\n  ", ";\n  ", "\n"], ["\n  ", "\n  ", ";\n\n  position: relative;\n  background-color: ", ";\n  color: ", ";\n  display: flex;\n  align-items: center;\n  gap: 1rem;\n  ", "\n\n  ", "\n  ", "\n\n  ", ";\n  ", ";\n  ", "\n"
-    // export const DisplayOnlyComp = styled.div`
-    // ${({ size }) =>
-    //     css`
-    //       height: ${SIZES[size]};
-    //     `}
-    // `
-])), function (_a) {
-    var composition = _a.composition;
-    switch (composition) {
-        case 'icon+text':
-            return (0, styled_components_2.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n          padding: 0 2rem 0 1.5rem;\n        "], ["\n          padding: 0 2rem 0 1.5rem;\n        "])));
-        default:
-            return (0, styled_components_2.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n          ", "\n        "], ["\n          ", "\n        "])), globalVariables_1.globalInputElemPadding);
-    }
-}, function (_a) {
-    var eyeIcon = _a.eyeIcon;
-    return eyeIcon && (0, styled_components_2.css)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n      flex-direction: row-reverse;\n    "], ["\n      flex-direction: row-reverse;\n    "])));
-}, function (_a) {
-    var invert = _a.invert;
-    return (invert ? greyColor80 : greyColor5);
-}, function (_a) {
-    var invert = _a.invert;
-    return (invert ? white : greyColor100);
-}, (0, mixins_1.transition)('background-color'), globalVariables_1.globalInputElemHover, globalVariables_1.globalInputElemFocused, function (_a) {
-    var disabled = _a.disabled;
-    return disabled && (0, styled_components_2.css)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n      background-color: ", ";\n      pointer-events: none;\n      color: ", ";\n    "], ["\n      background-color: ", ";\n      pointer-events: none;\n      color: ", ";\n    "])), greyColor15, greyColor40);
-}, function (_a) {
-    var readOnly = _a.readOnly;
-    return readOnly && (0, styled_components_2.css)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n      pointer-events: none;\n    "], ["\n      pointer-events: none;\n    "])));
-}, function (_a) {
-    var status = _a.status, invert = _a.invert;
-    return status && (0, styled_components_2.css)(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n     ::after{\n         content: none;\n        }\n        box-shadow: inset 0px -2px 0px ", ";;\n     }\n    "], ["\n     ::after{\n         content: none;\n        }\n        box-shadow: inset 0px -2px 0px ", ";;\n     }\n    "])), getColorValue(status, invert));
-});
-// export const DisplayOnlyComp = styled.div`
-// ${({ size }) =>
-//     css`
-//       height: ${SIZES[size]};
-//     `}
-// `
-exports.InputStyled = styled_components_1.default.input(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n  ", "\n  border: none;\n  outline: none;\n  flex-grow: 1;\n  background: transparent;\n  color: inherit;\n\n  &:-webkit-autofill {\n    transition-delay: 9999s;\n  }\n\n  ::placeholder {\n    color: ", ";\n  }\n"], ["\n  ", "\n  border: none;\n  outline: none;\n  flex-grow: 1;\n  background: transparent;\n  color: inherit;\n\n  &:-webkit-autofill {\n    transition-delay: 9999s;\n  }\n\n  ::placeholder {\n    color: ", ";\n  }\n"])), function (_a) {
-    var size = _a.size;
-    return (0, styled_components_2.css)(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n      height: ", ";\n    "], ["\n      height: ", ";\n    "])), SIZES[size]);
-}, greyColor40);
-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/CardContent/index.d.ts

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

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

@@ -1,76 +0,0 @@
-"use strict";
-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 = __importDefault(require("react"));
-var styled_components_1 = require("styled-components");
-var injectHttps_1 = require("../../../utils/injectHttps");
-var utilsOolib_1 = require("../../../utilsOolib");
-var ActionMenu_1 = require("../../ActionMenu");
-var Typo_1 = require("../../Typo");
-var VideoInput_1 = __importDefault(require("../../VideoInput"));
-var MetaBlock_1 = __importDefault(require("../../MetaBlock"));
-var LineClampWrapper_1 = require("../comps/LineClampWrapper");
-var styled_1 = require("../styled");
-var decideLinkCompAndTarget_1 = require("../utils/decideLinkCompAndTarget");
-var dontRenderIfBothOnClickAndTo_1 = require("../utils/dontRenderIfBothOnClickAndTo");
-var parseCardConfig_1 = require("../utils/parseCardConfig");
-var mediaDataExists_1 = require("../utils/mediaDataExists");
-var styled_2 = require("./styled");
-var CardPlaceholder_1 = require("../comps/CardPlaceholder");
-var ImageInput_1 = require("../../ImageInput");
-var icons_1 = require("../../../icons");
-var Tags_1 = require("../../Tags");
-var CrownSimple = icons_1.icons.CrownSimple;
-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, highlight = _a.highlight;
-    var theme = (0, styled_components_1.useTheme)();
-    var localize = (0, utilsOolib_1.useLocale)();
-    var parseSpecialSyntax = (theme || {}).parseSpecialSyntax;
-    var showEmbedSection = !!((config === null || config === void 0 ? void 0 : config.image) || (config === null || config === void 0 ? void 0 : config.video));
-    var _b = (0, parseCardConfig_1.parseCardConfig)({
-        config: config,
-        data: data,
-        parseSpecialSyntax: parseSpecialSyntax
-    }), cardLabel = _b.cardLabel, title = _b.title, video = _b.video, image = _b.image, metaBlock = _b.metaBlock, tagDisplay = _b.tagDisplay;
-    var dontRenderRes = (0, dontRenderIfBothOnClickAndTo_1.dontRenderIfBothOnClickAndTo)({ onClick: onClick, to: to });
-    if (dontRenderRes)
-        return dontRenderRes;
-    var _c = (0, decideLinkCompAndTarget_1.decideLinkCompAndTarget)({ to: to, openInNewTab: openInNewTab }), LinkComp = _c.LinkComp, target = _c.target, externalUrl = _c.externalUrl;
-    return (react_1.default.createElement(LinkComp, { target: target, href: (0, injectHttps_1.injectHttps)(to), to: to },
-        react_1.default.createElement(styled_2.StyledCardWrapper, { id: id, highlight: highlight, onClick: onClick ? function (e) { return onClick(e, data); } : undefined },
-            highlight && react_1.default.createElement(styled_2.StyledCrownWrapper, null,
-                react_1.default.createElement(styled_2.StyledCrown, null,
-                    react_1.default.createElement(CrownSimple, { size: 24 }))),
-            react_1.default.createElement(styled_2.StyledUpperSection, { highlight: highlight },
-                react_1.default.createElement(styled_2.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,
-                    title ? (react_1.default.createElement("div", { style: { display: "flex", alignItems: "end", gap: ".5rem" } },
-                        " ",
-                        react_1.default.createElement(LineClampWrapper_1.LineClampWrapper, { noOfLines_M: 6, title: title },
-                            react_1.default.createElement(styled_1.StyledTitle, { capitalize: true, className: "StyledTitle" },
-                                react_1.default.createElement(styled_1.StyledTitleSpan, { className: "StyledTitleSpan" }, localize(title)))))) : null),
-                tagDisplay && react_1.default.createElement(Tags_1.TagDisplay, { display: tagDisplay, color: "green" }),
-                (metaBlock === null || metaBlock === void 0 ? void 0 : metaBlock.length) > 0 ? (react_1.default.createElement(MetaBlock_1.default, { data: data, config: metaBlock }) //show only two meta for cardContent
-                ) : null),
-            showEmbedSection && (react_1.default.createElement(styled_2.StyledEmbedSection, null,
-                !(0, mediaDataExists_1.imageDataExists)(image) && !(0, mediaDataExists_1.videoDataExists)(video) &&
-                    react_1.default.createElement(CardPlaceholder_1.CardPlaceholder, null),
-                (0, mediaDataExists_1.imageDataExists)(image) && (react_1.default.createElement("div", { style: { width: "100%" } }, react_1.default.createElement(ImageInput_1.ImageInput, { value: image, aspectRatio: "5/3", readOnly: true, defaultImageSpread: "cover", enableCaptions: false, disableImageBorder: true }))),
-                (0, mediaDataExists_1.videoDataExists)(video) && !(0, mediaDataExists_1.imageDataExists)(image) ? (react_1.default.createElement("div", { style: { width: "100%", position: 'relative' } },
-                    react_1.default.createElement(VideoInput_1.default, { value: video, readOnly: true, light: true }),
-                    react_1.default.createElement("div", { style: { position: 'absolute', top: 0, left: 0, width: '100%', height: '100%' } }))) : null)))));
-};
-exports.CardContent = CardContent;

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

@@ -1,7 +0,0 @@
-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>;
-export const StyledCrownWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
-export const StyledCrown: import("styled-components").StyledComponent<"div", any, {}, never>;

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

@@ -1,63 +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 __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 () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.StyledCrown = exports.StyledCrownWrapper = 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 styled_1 = require("../styled");
-var greyColor5 = colors_1.colors.greyColor5, white = colors_1.colors.white, invertGreen = colors_1.colors.invertGreen;
-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\n  &:hover {\n    background-color: ", ";\n    ", ";\n     #CardPlaceholder {\n      opacity: 1;\n    }\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\n  &:hover {\n    background-color: ", ";\n    ", ";\n     #CardPlaceholder {\n      opacity: 1;\n    }\n  }\n"])), greyColor5, function (_a) {
-    var highlight = _a.highlight;
-    return highlight ? colors_1.colors.lightGreen : greyColor5;
-}, (0, transitions_1.transition)("background-color"), white, styled_1.CSSTitleAnimationOnHover);
-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  padding: 2rem;\n  ", "\n  gap: ", ";\n  padding-top: ", ";\n"], ["\n  /* height: 100%; */\n  flex-grow: 1;\n  justify-content: space-between;\n  padding: 2rem;\n  ", "\n  gap: ", ";\n  padding-top: ", ";\n"])), flexColumn, function (_a) {
-    var highlight = _a.highlight;
-    return highlight ? '2rem' : '3rem';
-}, function (_a) {
-    var highlight = _a.highlight;
-    return highlight ? "1rem" : "2rem";
-});
-exports.StyledCrownWrapper = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  width: 100%;\n  display: flex; \n  justify-content: flex-end\n"], ["\n  width: 100%;\n  display: flex; \n  justify-content: flex-end\n"])));
-exports.StyledCrown = styled_components_1.default.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n  width: max-content;\n  background-color: ", ";\n  padding: 1rem;\n"], ["\n  width: max-content;\n  background-color: ", ";\n  padding: 1rem;\n"])), invertGreen);
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8;

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

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