oolib 2.187.9 → 2.187.11

package/dist/components/AudioInput/index.js

@@ -66,6 +66,7 @@ var AudioAction_1 = require("./comps/AudioAction");
 var AudioPlayer_1 = require("./comps/AudioPlayer");
 var styled_js_1 = require("./styled.js");
 var FileUploadWrapper_1 = require("../FileUploadWrapper");
+var createSafeCleanup_1 = require("../../v2/themes/utils/createSafeCleanup");
 function AudioInput(_a) {
     var id = _a.id, value = _a.value, parentOnChange = _a.onChange, readOnly = _a.readOnly, invert = _a.invert, isInRTE = _a.isInRTE, files = _a.files, props = __rest(_a, ["id", "value", "onChange", "readOnly", "invert", "isInRTE", "files"]);
     var audioData = value || [];
@@ -102,6 +103,9 @@ function AudioInput(_a) {
         if (files) {
             handleUpload({ files: files });
         }
+        return (0, createSafeCleanup_1.createSafeCleanup)(function () {
+            //
+        });
     }, []);
     return (react_1.default.createElement(react_1.Fragment, null,
         react_1.default.createElement(BlockLabel_1.BlockLabel, __assign({}, (0, getBlockLabelProps_1.getBlockLabelProps)(props))),

package/dist/components/Banners/index.js

@@ -51,6 +51,7 @@ var react_router_dom_1 = require("react-router-dom");
 var Buttons_1 = require("../Buttons");
 var icons_1 = require("../../icons");
 var Typo_1 = require("../Typo");
+var createSafeCleanup_1 = require("../../v2/themes/utils/createSafeCleanup");
 var ICONS = {
     red: "XCircle",
     green: "CheckCircle",
@@ -93,10 +94,10 @@ var Banner = function (_a) {
                 remove(null, id);
             }, timeOut);
         }
-        return function () {
+        return (0, createSafeCleanup_1.createSafeCleanup)(function () {
             if (timer)
                 clearTimeout(timer);
-        };
+        });
     }, [cta, id, msg, timeOut]);
     var remove = function (e, id) {
         setHeight(0);
@@ -139,12 +140,15 @@ var BannerAlert = function (_a) {
     var BANNER_STATE = _a.BANNER_STATE, REMOVE_ALERT_BANNER = _a.REMOVE_ALERT_BANNER;
     var _c = (0, react_1.useState)(0), top = _c[0], setTop = _c[1];
     (0, react_1.useEffect)(function () {
-        setTimeout(function () {
+        var timerId = setTimeout(function () {
             var ele = document.getElementById("bannerInfo");
             if (ele) {
                 setTop(ele.offsetHeight);
             }
         }, 100);
+        return (0, createSafeCleanup_1.createSafeCleanup)(function () {
+            clearTimeout(timerId);
+        });
     }, []);
     return (react_1.default.createElement(styled_1.BannerAlertStyled, { top: top }, (_b = BANNER_STATE === null || BANNER_STATE === void 0 ? void 0 : BANNER_STATE.alertState) === null || _b === void 0 ? void 0 : _b.map(function (e) { return (react_1.default.createElement(Banner, { key: e.id, id: e.id, color: e.color, msg: e.msg, cta: e.cta, handleRemove: REMOVE_ALERT_BANNER, timeOut: e.timeOut, showIcon: e.showIcon, hideCloseButton: e.hideCloseButton })); })));
 };

package/dist/components/DatePicker/index.js

@@ -56,6 +56,7 @@ var styled_1 = require("./styled");
 var Buttons_1 = require("../Buttons");
 var mixins_1 = require("../../themes/mixins");
 var Modal_1 = require("../Modals/Modal");
+var createSafeCleanup_1 = require("../../v2/themes/utils/createSafeCleanup");
 var white = themes_1.colors.white, greyColor40 = themes_1.colors.greyColor40;
 var months = [
     "January",
@@ -114,9 +115,9 @@ function DatePicker(props) {
         // Add an event listener to the 'scroll' event on the 'window'.
         // When the user scrolls the page, the 'handleVerticalPosDebounced' function will be called.
         window.addEventListener("scroll", handleVerticalPosDebounced);
-        return function () {
+        return (0, createSafeCleanup_1.createSafeCleanup)(function () {
             window.removeEventListener("scroll", handleVerticalPosDebounced);
-        };
+        });
     }, []);
     (0, react_1.useEffect)(function () {
         if (readOnly)

package/dist/components/Dropdowns/utils/useHideShowOptions.js

@@ -14,7 +14,7 @@ var useHideShowOptions = function (options) {
     (0, react_1.useEffect)(function () {
         !isFirstMount.current && broadcastShowOptions && broadcastShowOptions(showOptions);
     }, [showOptions]);
-    (0, react_1.useEffect)(function () { return isFirstMount.current = false; }, []);
+    (0, react_1.useEffect)(function () { isFirstMount.current = false; }, []);
     return { showOptions: showOptions, handleHideOptions: handleHideOptions, handleShowOptions: handleShowOptions };
 };
 exports.useHideShowOptions = useHideShowOptions;

package/dist/components/Dropdowns/utils/useKeyboardControl.js

@@ -3,6 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.useKeyboardControl = void 0;
 var react_1 = require("react");
 var getKeyCode_1 = require("../../../utils/getKeyCode");
+var createSafeCleanup_1 = require("../../../v2/themes/utils/createSafeCleanup");
 var useKeyboardControl = function (_a) {
     var showOptions = _a.showOptions, handleHideOptions = _a.handleHideOptions, optionsWrapperRef = _a.optionsWrapperRef, handleSelect = _a.handleSelect, options = _a.options, searchString = _a.searchString, id = _a.id;
     var _b = (0, react_1.useState)(-1), focussedOp = _b[0], setFocussedOp = _b[1];
@@ -47,7 +48,7 @@ var useKeyboardControl = function (_a) {
             }
         };
         window.addEventListener('keydown', handleKeyDown);
-        return function () { return window.removeEventListener('keydown', handleKeyDown); };
+        return (0, createSafeCleanup_1.createSafeCleanup)(function () { return window.removeEventListener('keydown', handleKeyDown); });
     });
     var scrollFocussedOpIntoView = function (el) {
         var _a = el.getBoundingClientRect(), elBottom = _a.bottom, elTop = _a.top;

package/dist/components/IFrameInput/utils/DisplayCoachmark.js

@@ -40,6 +40,7 @@ var react_1 = __importStar(require("react"));
 var config_1 = __importDefault(require("../../Coachmark/config"));
 var index_1 = require("../../Coachmark/index");
 var mixins_1 = require("../../../themes/mixins");
+var createSafeCleanup_1 = require("../../../v2/themes/utils/createSafeCleanup");
 var DisplayCoachmark = function (_a, ref) {
     var user = _a.user, url = _a.url, setUrl = _a.setUrl;
     var _b = (0, index_1.useCoachmark)({ coachmarks: config_1.default.H5PEmbed, compIdentifier: "H5PEmbed" }), activeMark = _b.activeMark, rank = _b.rank, removeCoachmark = _b.removeCoachmark, showNextMark = _b.showNextMark, useReliableRef = _b.useReliableRef;
@@ -85,7 +86,7 @@ var DisplayCoachmark = function (_a, ref) {
             };
             var adjustOptimized_1 = optimizeForResize(adjustSlidesHeight, 100);
             window.addEventListener('resize', adjustOptimized_1);
-            return function () { return window.removeEventListener('resize', adjustOptimized_1); };
+            return (0, createSafeCleanup_1.createSafeCleanup)(function () { return window.removeEventListener('resize', adjustOptimized_1); });
         }
     }, []);
     return (react_1.default.createElement(index_1.Coachmark, { active: (user === null || user === void 0 ? void 0 : user.coachmarkChecklist.H5PEmbed) === false && url && url.includes("h5p"), rank: rank, observerThreshold: 0.3, currentMark: activeMark, handleNext: showNextMarkOnTilt, handleSkip: removeCoachmark }));

package/dist/components/ImageInput/ImageInputContext.js

@@ -58,6 +58,7 @@ var react_1 = __importStar(require("react"));
 var styled_components_1 = require("styled-components");
 var useFakeUploadMedia_1 = require("../../utilsOolib/useFakeUploadMedia");
 var bannerContext_1 = require("../Banners/bannerContext");
+var createSafeCleanup_1 = require("../../v2/themes/utils/createSafeCleanup");
 exports.ImageInputContext = (0, react_1.createContext)();
 var ImageInputContextProvider = function (_a) {
     var children = _a.children, value = _a.value, multiple = _a.multiple, allowedFormats = _a.allowedFormats, formatConvertConfig = _a.formatConvertConfig, folderName = _a.folderName, bucketEnv = _a.bucketEnv, onChange = _a.onChange, id = _a.id, aspectRatio = _a.aspectRatio, readOnly = _a.readOnly, enableCaptions = _a.enableCaptions, defaultImageSpread = _a.defaultImageSpread, invert = _a.invert, containerShape = _a.containerShape, stretchToFullHeight = _a.stretchToFullHeight, dropzoneLabel = _a.dropzoneLabel, dropzoneSublabel = _a.dropzoneSublabel, disableImageBorder = _a.disableImageBorder, omitEditorTools = _a.omitEditorTools, files = _a.files, showOptionalLabelInDropzone = _a.showOptionalLabelInDropzone, isRequired = _a.isRequired, isInRTE = _a.isInRTE, showImageUploadCaution = _a.showImageUploadCaution;
@@ -144,8 +145,10 @@ var ImageInputContextProvider = function (_a) {
                 }
             });
         }
+        return (0, createSafeCleanup_1.createSafeCleanup)(function () {
+            //
+        });
     }, []);
-    console.log({ outside_value: value });
     // Create a ref to always track the latest value
     var valueRef = (0, react_1.useRef)(value);
     // Keep the ref updated whenever value changes
@@ -155,11 +158,9 @@ var ImageInputContextProvider = function (_a) {
     var handleSingleImageDataChange = function (_a) {
         var publicUrl = _a.publicUrl, imageData = _a.imageData;
         //publicUrl is used as an 'id' identifier
-        console.log({ publicUrl: publicUrl, imageData: imageData, valueToUpdate: JSON.parse(JSON.stringify(value)) });
         var currentValue = valueRef.current;
         var newValue = __spreadArray([], currentValue, true);
         var imgIdxToReplace = newValue.findIndex(function (d) { return d.publicUrl === publicUrl; });
-        console.log({ imgIdxToReplace: imgIdxToReplace, valueAfterFindIndex: JSON.parse(JSON.stringify(value)) });
         newValue[imgIdxToReplace] = imageData;
         onChange(id, newValue);
     };

package/dist/components/ImageInput/comps/GallerySlider/comps/SliderShell/index.js

@@ -41,6 +41,7 @@ var calcAspectRatio_1 = require("../../../ImageEditor/utils/calcAspectRatio");
 var themes_1 = require("../../../../../../themes");
 var icons_1 = require("../../../../../../icons");
 var Typo_1 = require("../../../../../Typo");
+var createSafeCleanup_1 = require("../../../../../../v2/themes/utils/createSafeCleanup");
 var greyColor80 = themes_1.colors.greyColor80;
 var CaretLeft = icons_1.icons.CaretLeft, CaretRight = icons_1.icons.CaretRight;
 var SliderShell = function (_a) {
@@ -58,7 +59,6 @@ var SliderShell = function (_a) {
     (0, react_1.useEffect)(function () {
         updateHeight();
         window.addEventListener('resize', updateHeight);
-        // console.log({ imageMinusCaptionHeight, wrapperRef })
         var intervalId = setInterval(function () {
             // to avoid issues in cases where height is initally 0 because parent block has display:hidden condition on initial render
             if (!isHeightSet) {
@@ -68,10 +68,10 @@ var SliderShell = function (_a) {
                 clearInterval(intervalId);
             }
         }, 100);
-        return function () {
+        return (0, createSafeCleanup_1.createSafeCleanup)(function () {
             window.removeEventListener('resize', updateHeight);
             intervalId && clearInterval(intervalId);
-        };
+        });
     }, []);
     return (react_1.default.createElement(styled_1.StyledFlexWrapper, { ref: wrapperRef },
         value.map(function (v, idx) { return (react_1.default.createElement(styled_1.StyledFlexItem, { key: (v === null || v === void 0 ? void 0 : v.publicUrl) || idx, marginLeft: idx === 0 && activeIdx * -100 + "%" }, render(v, idx) /* explicitly called, cuz we want an error to throw if render prop aint passed thru */)); }),

package/dist/components/ImageInput/comps/GallerySlider/index.js

@@ -57,7 +57,7 @@ var useSwipe_1 = require("../../../../utils/customHooks/useSwipe");
 var GallerySlider = function () {
     var _a = (0, ImageInputContext_1.useImageInputContext)(), value = _a.value, noOfImagesUploading = _a.noOfImagesUploading, invert = _a.invert;
     var _b = (0, react_1.useState)(0), activeIdx = _b[0], setActiveIdx = _b[1];
-    (0, react_1.useEffect)(function () { return setActiveIdx(0); }, [value === null || value === void 0 ? void 0 : value.length]); // reset the activeidx with uploading new images(focus on the newly added Images)
+    (0, react_1.useEffect)(function () { setActiveIdx(0), [value === null || value === void 0 ? void 0 : value.length]; }, []); // reset the activeidx with uploading new images(focus on the newly added Images)
     var uploadingPlaceholders = (0, makeArrayFromLength_1.makeArrayFromLength)(noOfImagesUploading).map(function (d) { return undefined; });
     var isTouchDevice = (0, react_1.useRef)('ontouchstart' in window || navigator.maxTouchPoints > 0 || navigator.msMaxTouchPoints > 0);
     var handleDragStart = (0, useSwipe_1.useSwipe)({
@@ -70,10 +70,7 @@ var GallerySlider = function () {
     }).handleDragStart;
     return (react_1.default.createElement(styled_1.StyledGallery, { invert: invert },
         react_1.default.createElement(GalleryThumbnails_1.GalleryThumbnails, { setActiveIdx: setActiveIdx, activeIdx: activeIdx }),
-        (value === null || value === void 0 ? void 0 : value.length) > 0 ? (react_1.default.createElement(SliderShell_1.SliderShell, { value: __spreadArray(__spreadArray([], uploadingPlaceholders, true), value, true), activeIdx: activeIdx, setActiveIdx: setActiveIdx, render: function (v, idx) {
-                console.log({ key: (v === null || v === void 0 ? void 0 : v.publicUrl) || idx, });
-                return (react_1.default.createElement(SingleImageInput_1.SingleImageInput, { key: (v === null || v === void 0 ? void 0 : v.publicUrl) || idx,
-                    value: v, handleDragStart: handleDragStart }));
-            } })) : (react_1.default.createElement(Placeholder_1.default, null))));
+        (value === null || value === void 0 ? void 0 : value.length) > 0 ? (react_1.default.createElement(SliderShell_1.SliderShell, { value: __spreadArray(__spreadArray([], uploadingPlaceholders, true), value, true), activeIdx: activeIdx, setActiveIdx: setActiveIdx, render: function (v, idx) { return (react_1.default.createElement(SingleImageInput_1.SingleImageInput, { key: (v === null || v === void 0 ? void 0 : v.publicUrl) || idx,
+                value: v, handleDragStart: handleDragStart })); } })) : (react_1.default.createElement(Placeholder_1.default, null))));
 };
 exports.default = GallerySlider;

package/dist/components/ImageInput/comps/ImageEditor/index.js

@@ -164,19 +164,14 @@ function ImageEditor(_a) {
                         padding: readOnly ? "1rem" : "2rem",
                         backgroundColor: invert ? themes_1.colors.greyColor90 : themes_1.colors.greyColor5,
                     } }, !LexicalTextEditor
-                    ? react_1.default.createElement(TextInputs_1.TextInput, { value: imageData.caption, onChange: function (id, val) {
-                            console.log('in lex caption change handler', { imageData: imageData, caption: val, publicUrl: publicUrl });
+                    ? react_1.default.createElement(TextInputs_1.TextInput //basically on oolib it renders this for preview purposes.
+                    , { value: imageData.caption, onChange: function (id, val) {
                             handleSingleImageDataChange({
                                 publicUrl: publicUrl,
                                 imageData: __assign(__assign({}, imageData), { caption: val }),
                             });
                         } })
-                    // renderRTEPlaceholderForOolibPreview({
-                    //   width: '100%',
-                    //   height: '30px'
-                    // })
                     : react_1.default.createElement(LexicalTextEditor, { variant: 'simple', disableNewline: true, invert: invert, placeholder: "type caption for image (optional)", readOnly: readOnly, charLimit: 100, typo: "SANS_3", placeholderColor: invert ? themes_1.colors.greyColor70 : themes_1.colors.greyColor40, value: imageData.caption, onChange: function (id, val) {
-                            console.log('in lex caption change handler', { imageData: imageData, caption: val, publicUrl: publicUrl });
                             handleSingleImageDataChange({
                                 publicUrl: publicUrl,
                                 imageData: __assign(__assign({}, imageData), { caption: val }),

package/dist/components/ImageInput/comps/ImageEditor/utils/useReorientImage/changeImageOrientation.js

@@ -22,7 +22,6 @@ var changeImageOrientation = function (_a) {
             { deg: -90, orientation: 8 },
             //later : permutations and combinations of these can enable flip
         ];
-        // console.log({imageRotate})
         var orientationToSet = degToOrientationValueMap.find(function (d) { return d.deg === (imageRotate % 360); } //so that we bring all numbers within the range of -360 & 360
         ).orientation;
         // set proper canvas dimensions before transform & export
@@ -62,8 +61,6 @@ var changeImageOrientation = function (_a) {
         }
         // draw image
         ctx.drawImage(img, 0, 0);
-        // console.log({newUrl: 'newUrl'})
-        // console.log({newUrl: canvas.toDataURL()})
         // export base64
         callback({
             reorientedUrl: canvas.toDataURL(),
@@ -71,6 +68,5 @@ var changeImageOrientation = function (_a) {
             imageHeight: canvas.height
         });
     };
-    // console.log({ srcUrl });
 };
 exports.changeImageOrientation = changeImageOrientation;

package/dist/components/Lexical/Plugins/TableCellResizer/index.js

@@ -54,6 +54,7 @@ var React = __importStar(require("react"));
 var react_1 = require("react");
 var react_dom_1 = require("react-dom");
 var index_styled_1 = require("./index.styled");
+var createSafeCleanup_1 = require("../../../../v2/themes/utils/createSafeCleanup");
 var MIN_ROW_HEIGHT = 33;
 var MIN_COLUMN_WIDTH = 50;
 function TableCellResizer(_a) {
@@ -123,9 +124,9 @@ function TableCellResizer(_a) {
             }, 0);
         };
         document.addEventListener('mousemove', onMouseMove);
-        return function () {
+        return (0, createSafeCleanup_1.createSafeCleanup)(function () {
             document.removeEventListener('mousemove', onMouseMove);
-        };
+        });
     }, [activeCell, draggingDirection, editor, resetState]);
     var isHeightChanging = function (direction) {
         if (direction === 'bottom') {

package/dist/components/Modals/Modal/index.js

@@ -55,6 +55,7 @@ var ModalHeaderStyle2_1 = require("./comps/ModalHeaderStyle2");
 var styled_1 = require("./styled");
 var Buttons_1 = require("../../Buttons");
 var Divider_1 = require("../../Divider");
+var createSafeCleanup_1 = require("../../../v2/themes/utils/createSafeCleanup");
 /**
  * @component Renders a modal component with customizable title, content, and actions.
  *
@@ -89,7 +90,7 @@ var Modal = function (_a) {
     var _o = (0, react_1.useState)(endAnimPos), animPos = _o[0], setAnimPos = _o[1];
     (0, react_1.useEffect)(function () {
         document.body.style.overflow = "hidden";
-        return function () { document.body.style.overflow = "unset"; };
+        return (0, createSafeCleanup_1.createSafeCleanup)(function () { document.body.style.overflow = "unset"; });
     }, []);
     var genHeader = function () {
         var headerStyles = {

package/dist/components/Modals/ModalConfirm/index.js

@@ -41,6 +41,7 @@ var useScreenWidth_1 = require("../../../utils/customHooks/useScreenWidth");
 var Buttons_1 = require("../../Buttons");
 var Typo_1 = require("../../Typo");
 var styled_1 = require("./styled");
+var createSafeCleanup_1 = require("../../../v2/themes/utils/createSafeCleanup");
 /**
  * @component Renders a modal confirmation component with customizable text, buttons and styling.
  *
@@ -65,7 +66,7 @@ var ModalConfirm = function (_a) {
     var _g = (0, react_1.useState)(endAnimPos), animPos = _g[0], setAnimPos = _g[1];
     (0, react_1.useEffect)(function () {
         document.body.style.overflow = "hidden";
-        return function () { document.body.style.overflow = "unset"; };
+        return (0, createSafeCleanup_1.createSafeCleanup)(function () { document.body.style.overflow = "unset"; });
     }, []);
     var SubTitleText = screenWidth >= (0, mixins_1.getBreakPoint)('sm') ? Typo_1.SANS_4 : Typo_1.SANS_3;
     var genModalContents = function () { return (react_1.default.createElement(react_1.Fragment, null,

package/dist/components/PDFInput/index.js

@@ -74,6 +74,7 @@ var useFakeUploadImpression_1 = require("../../utilsOolib/useFakeUploadImpressio
 var react_3 = require("react");
 var PDFActions_1 = require("./comps/PDFActions");
 var FileUploadWrapper_1 = require("../FileUploadWrapper");
+var createSafeCleanup_1 = require("../../v2/themes/utils/createSafeCleanup");
 var StyledActionsButtonWrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: absolute;\n  right: 0;\n  top: 0;\n  z-index: 1000;\n  margin: 0.5rem;\n"], ["\n  position: absolute;\n  right: 0;\n  top: 0;\n  z-index: 1000;\n  margin: 0.5rem;\n"])));
 function PDFInput(_a) {
     var id = _a.id, parentOnChange = _a.onChange, value = _a.value, files = _a.files, readOnly = _a.readOnly, invert = _a.invert, isInRTE = _a.isInRTE, props = __rest(_a, ["id", "onChange", "value", "files", "readOnly", "invert", "isInRTE"]);
@@ -111,6 +112,9 @@ function PDFInput(_a) {
         if (files) {
             handleUpload({ files: files });
         }
+        return (0, createSafeCleanup_1.createSafeCleanup)(function () {
+            //
+        });
     }, []);
     return (react_1.default.createElement(react_3.Fragment, null,
         react_1.default.createElement(BlockLabel_1.BlockLabel, __assign({}, (0, getBlockLabelProps_1.getBlockLabelProps)(props), { invert: invert })),

package/dist/components/SimpleTable/index.js

@@ -80,6 +80,7 @@ var DropdownSingle_1 = require("../Dropdowns/DropdownSingle");
 var TextInputs_1 = require("../TextInputs");
 var icons_1 = require("../../icons");
 var Typo2_1 = require("../../v2/components/Typo2");
+var createSafeCleanup_1 = require("../../v2/themes/utils/createSafeCleanup");
 var ArrowDown = icons_1.icons.ArrowDown;
 var greyColor100 = themes_1.colors.greyColor100;
 /**
@@ -138,10 +139,10 @@ function SimpleTable(_a) {
     (0, react_1.useEffect)(function () {
         window.addEventListener("mouseup", resetColResizeState);
         window.addEventListener("mousemove", handleResizeColumn);
-        return function () {
+        return (0, createSafeCleanup_1.createSafeCleanup)(function () {
             window.removeEventListener("mousemove", handleResizeColumn);
             window.removeEventListener("mouseup", resetColResizeState);
-        };
+        });
     }, [colResizeState]);
     var CellContentBlocks = {
         RichTextEditor: RichTextEditor,

package/dist/components/TabBar/index.js

@@ -10,42 +10,12 @@ var __assign = (this && this.__assign) || function () {
     };
     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 __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.TabBarStyle2 = exports.TabBarStyle1 = void 0;
-var react_1 = __importStar(require("react"));
+var react_1 = __importDefault(require("react"));
 var useScrollBar_1 = require("../../utils/customHooks/useScrollBar");
 var Buttons_1 = require("../Buttons");
 var index_styled_1 = require("./index.styled");

package/dist/components/VideoInput/index.js

@@ -62,6 +62,7 @@ var VideoActionMenu_1 = require("./comps/VideoActionMenu");
 var FileUploadWrapper_1 = require("../FileUploadWrapper");
 var getBlockLabelProps_1 = require("../../utils/getBlockLabelProps");
 var utils_1 = require("./utils");
+var createSafeCleanup_1 = require("../../v2/themes/utils/createSafeCleanup");
 function VideoInput(_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, // //used by RTEVideoInput
     width = _a.width, height = _a.height;
@@ -108,6 +109,9 @@ function VideoInput(_a) {
         if (files) {
             handleUpload({ files: files });
         }
+        return (0, createSafeCleanup_1.createSafeCleanup)(function () {
+            //cleanup
+        });
     }, []);
     var createVideoPreview = function (_a) {
         var _b;

package/dist/stories/Oolib/components/Dropdowns.stories.js

@@ -65,6 +65,7 @@ var Paddings_1 = require("../../../components/Paddings");
 var themes_1 = require("../../../themes");
 var Dropdowns_mdx_1 = __importDefault(require("./Dropdowns.mdx"));
 var icons_1 = require("../../../icons");
+var createSafeCleanup_1 = require("../../../v2/themes/utils/createSafeCleanup");
 // import { faker } from '@faker-js/faker';
 // const generateRandomCountry = () => ({
 //   display: faker.address.country(),
@@ -249,7 +250,7 @@ var Dropdowns = function (args) {
             setOptions(newOptions);
         }, 2000);
         // Cleanup the timeout on component unmount
-        return function () { return clearTimeout(delayOptions); };
+        return (0, createSafeCleanup_1.createSafeCleanup)(function () { return clearTimeout(delayOptions); });
     }, [args.optionDescription, args.optionImage, args.optionIcon, args.colors]);
     var Comp = args.selection === "single" ? DropdownSingle_1.DropdownSingle : DropdownMulti_1.DropdownMulti;
     return (react_1.default.createElement("div", { style: { background: args.invert && themes_1.colors.greyColor100 } },

package/dist/stories/Oolib/components/SimpleTable.stories.js

@@ -115,9 +115,9 @@ var SimpleTable = function (args) {
         value: val,
         onChange: function (k, v) { return setVal(v); }
     };
-    (0, react_1.useEffect)(function () {
-        console.log({ data: props });
-    }, [props]);
+    // useEffect(() => {
+    //     console.log({data: props})
+    // }, [props])
     return (react_1.default.createElement("div", { style: { backgroundColor: themes_1.colors.greyColor10 } },
         react_1.default.createElement(Wrappers_1.Wrapper700, { style: { backgroundColor: 'white' } },
             react_1.default.createElement(Paddings_1.PaddingTopBottom40, null,

package/dist/stories/Oolib/components/Tooltip.stories.js

@@ -10,46 +10,15 @@ var __assign = (this && this.__assign) || function () {
     };
     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 __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Tooltip = void 0;
-var react_1 = __importStar(require("react"));
+var react_1 = __importDefault(require("react"));
 var Tooltip_1 = require("../../../components/Tooltip");
 // import { ButtonPrimary } from '../components/Buttons';
 var phosphor_react_1 = require("phosphor-react");
-var lodash_1 = require("lodash");
 var themes_1 = require("../../../themes");
 exports.default = {
     title: 'Components/Tooltip',

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

@@ -61,6 +61,7 @@ var themes_1 = require("../../../themes");
 var icons_1 = require("../../../icons");
 var DropdownMulti_1 = require("../../../v2/components/Dropdowns/DropdownMulti");
 var DropdownSingle_1 = require("../../../v2/components/Dropdowns/DropdownSingle");
+var createSafeCleanup_1 = require("../../../v2/themes/utils/createSafeCleanup");
 // import { faker } from '@faker-js/faker';
 // const generateRandomCountry = () => ({
 //   display: faker.address.country(),
@@ -240,7 +241,7 @@ var Dropdowns = function (args) {
             setOptions(newOptions);
         }, 2000);
         // Cleanup the timeout on component unmount
-        return function () { return clearTimeout(delayOptions); };
+        return (0, createSafeCleanup_1.createSafeCleanup)(function () { return clearTimeout(delayOptions); });
     }, [args.optionDescription, args.optionImage, args.optionIcon, args.colors]);
     var Comp = args.selection === "single" ? DropdownSingle_1.DropdownSingle : DropdownMulti_1.DropdownMulti;
     return (react_1.default.createElement("div", { style: { background: args.invert && themes_1.colors.greyColor100 } },

package/dist/utils/customHooks/useContainerQuery.js

@@ -3,6 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.useContainerQuery = void 0;
 var mixins_1 = require("../../themes/mixins");
 var react_1 = require("react");
+var createSafeCleanup_1 = require("../../v2/themes/utils/createSafeCleanup");
 var useContainerQuery = function (options) {
     if (options === void 0) { options = {}; }
     var enabled = options.enabled;
@@ -19,11 +20,11 @@ var useContainerQuery = function (options) {
         if (ref.current) {
             resizeObserver.observe(ref.current);
         }
-        return function () {
+        return (0, createSafeCleanup_1.createSafeCleanup)(function () {
             if (ref.current) {
                 resizeObserver.unobserve(ref.current);
             }
-        };
+        });
     }, [ref]);
     //if container queries are written for multiple breakpoints
     //then they must be written in the order of small to big. 

package/dist/utils/customHooks/useHandleClickOutside.js

@@ -3,6 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.useHandleClickOutside = void 0;
 var react_1 = require("react");
 var toArray_1 = require("../toArray");
+var createSafeCleanup_1 = require("../../v2/themes/utils/createSafeCleanup");
 /**
  *
  * @param {*} ref can be a ref or an array of refs
@@ -22,7 +23,7 @@ var useHandleClickOutside = function (ref, setShowOptions, options) {
     };
     (0, react_1.useEffect)(function () {
         document.addEventListener('mousedown', handleClickOutside); //its very important for this to be mousedown. 'click' acts unpredictable
-        return function () { return document.removeEventListener('mousedown', handleClickOutside); };
+        return (0, createSafeCleanup_1.createSafeCleanup)(function () { return document.removeEventListener('mousedown', handleClickOutside); });
     }, [enabled]);
 };
 exports.useHandleClickOutside = useHandleClickOutside;

package/dist/utils/customHooks/useScreenWidth.js

@@ -3,6 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.useScreenWidth = void 0;
 var lodash_1 = require("lodash");
 var react_1 = require("react");
+var createSafeCleanup_1 = require("../../v2/themes/utils/createSafeCleanup");
 /**
  * Custom hook that tracks the screen width and invokes a resize function if provided.
  *
@@ -19,9 +20,9 @@ var useScreenWidth = function (options) {
     }, 500);
     (0, react_1.useEffect)(function () {
         window.addEventListener('resize', handleResize);
-        return function () {
+        return (0, createSafeCleanup_1.createSafeCleanup)(function () {
             window.removeEventListener('resize', handleResize);
-        };
+        });
     }, [handleResize]);
     return screenWidth;
 };

package/dist/utils/useStyleUpdateAfterToggleTransition.js

@@ -2,6 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useStyleUpdateAfterToggleTransition = void 0;
 var react_1 = require("react");
+var createSafeCleanup_1 = require("../v2/themes/utils/createSafeCleanup");
 var useStyleUpdateAfterToggleTransition = function (_a) {
     var styleOptions = _a.styleOptions, // ['hidden', 'visible']
     _initStyle = _a.initStyle, //hidden
@@ -28,11 +29,11 @@ var useStyleUpdateAfterToggleTransition = function (_a) {
             setStyle(initStyle.current);
         }
         // Cleanup function to clear timeout if component updates/unmounts
-        return function () {
+        return (0, createSafeCleanup_1.createSafeCleanup)(function () {
             if (timeoutId) {
                 clearTimeout(timeoutId);
             }
-        };
+        });
     }, [toggleState, transitionDuration]);
     return ({
         style: style

package/dist/v2/components/BarChart/index.js

@@ -64,6 +64,7 @@ var getTotalCount_1 = require("../../../utils/getTotalCount");
 var CustomizedLabel_1 = require("./comps/CustomizedLabel");
 var colors_1 = require("../../themes/colors");
 var CustomTooltip_1 = __importDefault(require("./comps/CustomTooltip"));
+var createSafeCleanup_1 = require("../../themes/utils/createSafeCleanup");
 var usePrepareData = function (_a) {
     var _data = _a._data, labelPath = _a.labelPath, valuePath = _a.valuePath, tooltipLabelsMapping = _a.tooltipLabelsMapping, tooltipLabelsPath = _a.tooltipLabelsPath, isBreakdown = _a.isBreakdown, showPercent = _a.showPercent;
     return (0, react_1.useMemo)(function () {
@@ -214,9 +215,9 @@ var BarChart = function (_a) {
         };
         window.addEventListener('mousemove', handleMouseMove);
         // Clean up
-        return function () {
+        return (0, createSafeCleanup_1.createSafeCleanup)(function () {
             window.removeEventListener('mousemove', handleMouseMove);
-        };
+        });
     }, []);
     // menu options for grouped and stacked
     var renderBar = function (stackIndex, lastIndex) {

package/dist/v2/components/DatePicker/utils/useDatePickerState.js

@@ -13,6 +13,7 @@ var __assign = (this && this.__assign) || function () {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useDatePickerState = void 0;
 var react_1 = require("react");
+var createSafeCleanup_1 = require("../../../themes/utils/createSafeCleanup");
 var useDatePickerState = function (_a) {
     var _b = _a.withPortal, withPortal = _b === void 0 ? false : _b, portalId = _a.portalId, onDateSelect = _a.onDateSelect;
     var _c = (0, react_1.useState)(false), isOpen = _c[0], setIsOpen = _c[1];
@@ -78,17 +79,17 @@ var useDatePickerState = function (_a) {
     (0, react_1.useEffect)(function () {
         if (withPortal && portalOpen) {
             document.addEventListener('mousedown', handleClickOutside);
-            return function () {
+            return (0, createSafeCleanup_1.createSafeCleanup)(function () {
                 document.removeEventListener('mousedown', handleClickOutside);
-            };
+            });
         }
     }, [withPortal, portalOpen, handleClickOutside]);
     (0, react_1.useEffect)(function () {
-        return function () {
+        return (0, createSafeCleanup_1.createSafeCleanup)(function () {
             if (withPortal) {
                 cleanupPortalBackdrop(portalId);
             }
-        };
+        });
     }, [withPortal, portalId, cleanupPortalBackdrop]);
     var datePickerProps = __assign({ open: withPortal ? portalOpen : isOpen, onInputClick: handleInputClick, onChange: handleDateChange }, (withPortal ? {
         withPortal: true,

package/dist/v2/components/Dropdowns/utils/useHideShowOptions.js

@@ -14,7 +14,7 @@ var useHideShowOptions = function (options) {
     (0, react_1.useEffect)(function () {
         !isFirstMount.current && broadcastShowOptions && broadcastShowOptions(showOptions);
     }, [showOptions]);
-    (0, react_1.useEffect)(function () { return isFirstMount.current = false; }, []);
+    (0, react_1.useEffect)(function () { isFirstMount.current = false; }, []);
     return { showOptions: showOptions, handleHideOptions: handleHideOptions, handleShowOptions: handleShowOptions };
 };
 exports.useHideShowOptions = useHideShowOptions;

package/dist/v2/components/Dropdowns/utils/useKeyboardControl.js

@@ -3,6 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.useKeyboardControl = void 0;
 var react_1 = require("react");
 var getKeyCode_1 = require("../../../../utils/getKeyCode");
+var createSafeCleanup_1 = require("../../../themes/utils/createSafeCleanup");
 var useKeyboardControl = function (_a) {
     var showOptions = _a.showOptions, handleHideOptions = _a.handleHideOptions, optionsWrapperRef = _a.optionsWrapperRef, handleSelect = _a.handleSelect, options = _a.options, searchString = _a.searchString, id = _a.id;
     var _b = (0, react_1.useState)(-1), focussedOp = _b[0], setFocussedOp = _b[1];
@@ -47,7 +48,7 @@ var useKeyboardControl = function (_a) {
             }
         };
         window.addEventListener('keydown', handleKeyDown);
-        return function () { return window.removeEventListener('keydown', handleKeyDown); };
+        return (0, createSafeCleanup_1.createSafeCleanup)(function () { return window.removeEventListener('keydown', handleKeyDown); });
     });
     var scrollFocussedOpIntoView = function (el) {
         var _a = el.getBoundingClientRect(), elBottom = _a.bottom, elTop = _a.top;

package/dist/v2/components/HomeCover/comps/ImageSwitcher/index.js

@@ -47,6 +47,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.ImageSwitcher = void 0;
 var react_1 = __importStar(require("react"));
 var styled_1 = require("./styled");
+var createSafeCleanup_1 = require("../../../../themes/utils/createSafeCleanup");
 var ImageSwitcher = function (_a) {
     var images = _a.images, _b = _a.isDesktop, isDesktop = _b === void 0 ? true : _b, theme = _a.theme;
     // Common state structure for both desktop and mobile
@@ -76,10 +77,10 @@ var ImageSwitcher = function (_a) {
                 }, 800); // Match transition duration
             }, 3000);
         }
-        return function () {
+        return (0, createSafeCleanup_1.createSafeCleanup)(function () {
             clearTimeout(timeout);
             clearInterval(interval);
-        };
+        });
     }, [isDesktop, images.length]);
     if (isDesktop) {
         return (react_1.default.createElement(react_1.default.Fragment, null,

package/dist/v2/components/ImagePlaceholder/index.js

@@ -40,6 +40,7 @@ exports.ImagePlaceholder = void 0;
 var react_1 = __importStar(require("react"));
 var gradient_background_jpg_1 = __importDefault(require("../../../assets/images/gradient_background.jpg"));
 var styled_1 = require("./styled");
+var createSafeCleanup_1 = require("../../themes/utils/createSafeCleanup");
 var ImagePlaceholder = function (_a) {
     var title = _a.title, height = _a.height, fontWeight = _a.fontWeight, _b = _a.aspectRatio, aspectRatio = _b === void 0 ? "5/3" : _b, _c = _a.letterSizeMultiplier, letterSizeMultiplier = _c === void 0 ? 1.8 : _c, _d = _a.strechToFullHeight, strechToFullHeight = _d === void 0 ? false : _d, _e = _a.style, style = _e === void 0 ? {} : _e;
     var containerRef = (0, react_1.useRef)(null);
@@ -55,9 +56,9 @@ var ImagePlaceholder = function (_a) {
         calculateLetterSize();
         window.addEventListener('resize', calculateLetterSize);
         // Cleanup listener
-        return function () {
+        return (0, createSafeCleanup_1.createSafeCleanup)(function () {
             window.removeEventListener('resize', calculateLetterSize);
-        };
+        });
     }, []);
     var colors = [
         '#9EE4F1',

package/dist/v2/themes/utils/createSafeCleanup.d.ts

@@ -0,0 +1 @@
+export function createSafeCleanup(cleanupFn: any): () => void;

package/dist/v2/themes/utils/createSafeCleanup.js

@@ -0,0 +1,18 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createSafeCleanup = void 0;
+var createSafeCleanup = function (cleanupFn) {
+    // Return a function that will be called by React when unmounting
+    return function () {
+        try {
+            // Only call the cleanup if it's a function
+            if (typeof cleanupFn === 'function') {
+                cleanupFn();
+            }
+        }
+        catch (err) {
+            console.warn('Error in cleanup function:', err);
+        }
+    };
+};
+exports.createSafeCleanup = createSafeCleanup;

package/package.json

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