oolib 2.225.9 → 2.225.11

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

@@ -29,14 +29,15 @@ var ListItem_1 = require("../../../v2/components/List/comps/ListItem");
 var dropdownOptions_1 = require("./Dropdown/dropdownOptions");
 var availableColors = __spreadArray([undefined], Object.keys(__1.colors2).sort(), true);
 var availableIcons = __spreadArray([undefined], Object.keys(__1.icons).sort(), true);
+var longText = "If music be the food of love, play on;\n                      Give me excess of it, that, surfeiting,\n                      The appetite may sicken, and so die.\n                      That strain again! it had a dying fall:\n                      O, it came o'er my ear like the sweet sound,\n                      That breathes upon a bank of violets,\n                      Stealing and giving odour! Enough; no more:\n                      'Tis not so sweet now as it was before.\n                      O spirit of love! how quick and fresh art thou,\n                      That, notwithstanding thy capacity\n                      Receiveth as the sea, nought enters there,\n                      Of what validity and pitch soe'er,\n                      But falls into abatement and low price,\n                      Even in a minute: so full of shapes is fancy\n                      That it alone is high fantastical.";
 var dropdownOptions = [
     {
-        display: "Option with a slightly longer name",
+        display: longText,
         value: "india",
         color: themes_1.colors.lightRed,
         // image: "xyz",
         icon: "CirclesFour",
-        desc: "There is this one very annoying bug in the list component. basically the options ka description na, I was trying to put a 3 line line clamp on it. but for that to work, the outer wrapper of both the display and description cannot have ellipsis. but if I remove that ellipsis horizontal scroll comes. its a complete brain fry\u2026 could you check it out? in case you have a quick solution for it?",
+        desc: longText,
         // desc: "This is a story about schnil-tu, a.k.a tubito senpai. Tubito senpai loves to say bhai-god. Lol.",
     },
     {

package/dist/utils/customHooks/useFloatingPosition.js

@@ -75,11 +75,34 @@ var useFloatingPosition = function (_a) {
     var delayGroupContext = (0, react_1.useDelayGroup)(context, {
         enabled: enableDelayGroups,
     });
-    var delayGroupDelay = enableDelayGroups && delayGroupContext
-        ? delayGroupContext.delay
-        : undefined;
     var enableHover = "enableHover" in options ? options.enableHover : true;
-    var hover = (0, react_1.useHover)(context, __assign(__assign({}, ("hoverOptions" in options ? options.hoverOptions : {})), { enabled: !enableTriggerOnClick && enableHover !== false, delay: enableDelayGroups ? delayGroupDelay : undefined }));
+    var hoverOpts = "hoverOptions" in options ? options.hoverOptions : {};
+    // Determine the delay for hover interactions:
+    // - When delay groups are disabled, use the custom hoverOptions delay
+    // - When in instant phase (rapidly moving between tooltips in a group), use group delay
+    // - When inside an active FloatingDelayGroup (delay > 0), use group delay
+    // - Otherwise use custom hoverOptions delay
+    var getDelay = function () {
+        var _a, _b;
+        if (!enableDelayGroups) {
+            return hoverOpts === null || hoverOpts === void 0 ? void 0 : hoverOpts.delay;
+        }
+        var groupDelay = delayGroupContext === null || delayGroupContext === void 0 ? void 0 : delayGroupContext.delay;
+        // Check if we're inside an actual FloatingDelayGroup
+        // (delay is 0 by default if no provider exists)
+        var hasGroupProvider = typeof groupDelay === "number"
+            ? groupDelay > 0
+            : typeof groupDelay === "object" &&
+                groupDelay !== null &&
+                (((_a = groupDelay.open) !== null && _a !== void 0 ? _a : 0) > 0 || ((_b = groupDelay.close) !== null && _b !== void 0 ? _b : 0) > 0);
+        // In instant phase or inside an active group, use group delay
+        if ((delayGroupContext === null || delayGroupContext === void 0 ? void 0 : delayGroupContext.isInstantPhase) || hasGroupProvider) {
+            return groupDelay;
+        }
+        // No active group, use custom delay
+        return hoverOpts === null || hoverOpts === void 0 ? void 0 : hoverOpts.delay;
+    };
+    var hover = (0, react_1.useHover)(context, __assign(__assign({}, hoverOpts), { enabled: !enableTriggerOnClick && enableHover !== false, delay: getDelay() }));
     var click = (0, react_1.useClick)(context, __assign(__assign({}, ("clickOptions" in options ? options.clickOptions : {})), { enabled: enableTriggerOnClick }));
     var focus = (0, react_1.useFocus)(context, focusOptions);
     var role = (0, react_1.useRole)(context, roleOptions);

package/dist/v2/components/List/comps/ListItem.js

@@ -96,7 +96,8 @@ var ListItem = function (_a) {
                     marginTop: "0.1rem",
                     display: "flex",
                     alignItems: "center",
-                    gap: "0.5rem"
+                    gap: "0.5rem",
+                    flex: "none"
                 } },
                 alignCheckbox === "left" && renderCheckBox(),
                 icon &&

package/dist/v2/components/List/comps/styled.js

@@ -13,6 +13,8 @@ var themes_1 = require("../../../themes");
 var getDynamicColors_1 = require("../../../themes/utils/getDynamicColors");
 var mixins_1 = require("../../../../themes/mixins");
 var grey10 = themes_1.colors.grey10;
+var textLineClamp = 2;
+var descriptionLineClamp = 3;
 exports.StyledListItemWrapper = styled_components_1.default.li(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  /* padding: ", "; */\n  padding: 0.8rem;\n  border-radius: 0.4rem;\n  gap: 1rem;\n\n  justify-content: space-between;\n\n  background-color: ", ";\n\n  .OKE-Dropdown__optionText {\n    color: ", ";\n  }\n\n  .OKE-Dropdown__optionIcon {\n    color: ", ";\n  }\n\n  &:hover {\n    background-color: ", ";\n  }\n\n  &:first-of-type {\n    /* margin-top: 0.4rem; */\n  }\n\n  &:last-of-type {\n    /* margin-bottom: 0.4rem; */\n  }\n\n  .OKE-Dropdown__optionDesc {\n    ", "\n    white-space: normal;\n  }\n\n  .OKE-Dropdown__optionImg {\n    flex: 0 0 auto;\n  }\n\n  .OKE-Dropdown__checkboxClickArea {\n    position: absolute;\n    width: 2rem;\n    height: 2rem;\n  }\n  .OKE-Dropdown__checkboxClickArea-box {\n    margin-top: 0.2rem;\n    flex-shrink: 0;\n  }\n"], ["\n  display: flex;\n  align-items: center;\n  /* padding: ", "; */\n  padding: 0.8rem;\n  border-radius: 0.4rem;\n  gap: 1rem;\n\n  justify-content: space-between;\n\n  background-color: ", ";\n\n  .OKE-Dropdown__optionText {\n    color: ", ";\n  }\n\n  .OKE-Dropdown__optionIcon {\n    color: ", ";\n  }\n\n  &:hover {\n    background-color: ", ";\n  }\n\n  &:first-of-type {\n    /* margin-top: 0.4rem; */\n  }\n\n  &:last-of-type {\n    /* margin-bottom: 0.4rem; */\n  }\n\n  .OKE-Dropdown__optionDesc {\n    ", "\n    white-space: normal;\n  }\n\n  .OKE-Dropdown__optionImg {\n    flex: 0 0 auto;\n  }\n\n  .OKE-Dropdown__checkboxClickArea {\n    position: absolute;\n    width: 2rem;\n    height: 2rem;\n  }\n  .OKE-Dropdown__checkboxClickArea-box {\n    margin-top: 0.2rem;\n    flex-shrink: 0;\n  }\n"])), function (_a) {
     var S = _a.S;
     return (S ? "0.8rem" : "0.6rem 0.8rem");
@@ -28,7 +30,7 @@ exports.StyledListItemWrapper = styled_components_1.default.li(templateObject_1
 }, themes_1.colors.grey80, themes_1.colors.grey80, function (_a) {
     var theme = _a.theme;
     return "".concat(grey10);
-}, (0, mixins_1.clampText)(3));
+}, (0, mixins_1.clampText)(descriptionLineClamp));
 exports.StyledRightSection = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  margin-top: 0.1rem;\n  display: flex;\n  gap: 0.5rem;\n  align-self: flex-start;\n  justify-content: space-between;\n"], ["\n  margin-top: 0.1rem;\n  display: flex;\n  gap: 0.5rem;\n  align-self: flex-start;\n  justify-content: space-between;\n"])));
-exports.StyledWrapper = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  overflow: hidden;\n  min-width: 0;\n  flex: 1;\n  \n  /* Ensure direct child divs can shrink below content width */\n  > div {\n    min-width: 0;\n  }\n  \n  .OKE-Dropdown__optionText {\n    ", "\n  }\n"], ["\n  overflow: hidden;\n  min-width: 0;\n  flex: 1;\n  \n  /* Ensure direct child divs can shrink below content width */\n  > div {\n    min-width: 0;\n  }\n  \n  .OKE-Dropdown__optionText {\n    ", "\n  }\n"])), mixins_1.ellipsis);
+exports.StyledWrapper = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  overflow: hidden;\n  min-width: 0;\n  flex: 1;\n  \n  /* Ensure direct child divs can shrink below content width */\n  > div {\n    min-width: 0;\n  }\n  \n  .OKE-Dropdown__optionText {\n    ", "\n    white-space: normal;\n  }\n"], ["\n  overflow: hidden;\n  min-width: 0;\n  flex: 1;\n  \n  /* Ensure direct child divs can shrink below content width */\n  > div {\n    min-width: 0;\n  }\n  \n  .OKE-Dropdown__optionText {\n    ", "\n    white-space: normal;\n  }\n"])), (0, mixins_1.clampText)(textLineClamp));
 var templateObject_1, templateObject_2, templateObject_3;

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

@@ -53,7 +53,7 @@ var utils_1 = require("./utils");
 var styled_1 = require("./styled");
 var CURSOR_HEIGHT = 20;
 function Tooltip(_a) {
-    var text = _a.text, heading = _a.heading, primaryContent = _a.primaryContent, secondaryContent = _a.secondaryContent, _b = _a.progressiveDelay, progressiveDelay = _b === void 0 ? 1000 : _b, _c = _a.progressiveGap, progressiveGap = _c === void 0 ? 8 : _c, children = _a.children, _d = _a.placement, placement = _d === void 0 ? 'top' : _d, _e = _a.showPointer, showPointer = _e === void 0 ? true : _e, _f = _a.showDelay, showDelay = _f === void 0 ? 0 : _f, _g = _a.hideDelay, hideDelay = _g === void 0 ? 0 : _g, _h = _a.animation, animation = _h === void 0 ? 'none' : _h, _j = _a.followCursor, followCursor = _j === void 0 ? false : _j, _k = _a.cursorOffset, cursorOffset = _k === void 0 ? 10 : _k, _l = _a.invert, invert = _l === void 0 ? false : _l, wrapperDisplay = _a.wrapperDisplay, _m = _a.trigger, trigger = _m === void 0 ? 'hover' : _m, style = _a.style;
+    var text = _a.text, heading = _a.heading, primaryContent = _a.primaryContent, secondaryContent = _a.secondaryContent, _b = _a.progressiveDelay, progressiveDelay = _b === void 0 ? 600 : _b, _c = _a.progressiveGap, progressiveGap = _c === void 0 ? 8 : _c, children = _a.children, _d = _a.placement, placement = _d === void 0 ? 'top' : _d, _e = _a.showPointer, showPointer = _e === void 0 ? true : _e, _f = _a.showDelay, showDelay = _f === void 0 ? 600 : _f, _g = _a.hideDelay, hideDelay = _g === void 0 ? 0 : _g, _h = _a.animation, animation = _h === void 0 ? 'fade' : _h, _j = _a.followCursor, followCursor = _j === void 0 ? false : _j, _k = _a.cursorOffset, cursorOffset = _k === void 0 ? 10 : _k, _l = _a.invert, invert = _l === void 0 ? false : _l, wrapperDisplay = _a.wrapperDisplay, _m = _a.trigger, trigger = _m === void 0 ? 'hover' : _m, style = _a.style;
     var bgColor = invert ? __1.colors2.white : __1.colors2.black;
     var textColor = invert ? __1.colors2.black : __1.colors2.white;
     var resolvedPrimaryContent = (0, utils_1.resolvePrimaryContent)(text, heading, primaryContent);
@@ -116,7 +116,7 @@ function Tooltip(_a) {
         disableAutoUpdate: followCursor,
         enableDelayGroups: !isClickTrigger,
         enableTriggerOnClick: isClickTrigger,
-        enableHover: !isClickTrigger && !isPinned && !followCursor,
+        enableHover: true,
         hoverOptions: {
             delay: { open: showDelay, close: hideDelay },
         },

package/package.json

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