@pixum/combobox 5.1.1 → 5.1.2-alpha.1

package/lib/partials/ComboBoxOptions.js

@@ -17,11 +17,11 @@ export function ComboBoxOptions({ options, onClick, selectedOption, leadingType,
     const optionsWithoutGroup = Array.isArray(options);
     const optionsWithGroup = Object.entries(options);
     useEffect(() => {
-        // Wait for next browser frame to ensure DOM is fully rendered
-        const frameId = requestAnimationFrame(() => {
+        // Delay scrolling to ensure DOM is fully rendered
+        const timeoutId = setTimeout(() => {
             scrollOptionToViewport(isDesktop);
-        });
-        return () => cancelAnimationFrame(frameId);
+        }, 100);
+        return () => clearTimeout(timeoutId);
     }, [isDesktop, selectedOption]);
     return (_jsxs(Menu, { className: "combobox__options scrollable", "data-tappable": "true", children: [optionsWithoutGroup ? (_jsx(ComboBoxOptionsItems, { items: options, selectedOption: selectedOption, onClick: onClick, leadingType: leadingType })) : (_jsx(_Fragment, { children: optionsWithGroup.map(([group, items]) => (_jsx(ComboxBoxOptionsWithGrouping, { group: group, items: items, selectedOption: selectedOption, onClick: onClick, leadingType: leadingType }, `combobox__options-group-${group}`))) })), optionDetails && (_jsx("div", { className: "combobox__option-details text--caption", children: optionDetails }))] }));
 }

package/lib/partials/ComboBoxOptions.js.map

@@ -1 +1 @@
-{"version":3,"file":"ComboBoxOptions.js","sourceRoot":"","sources":["../../src/partials/ComboBoxOptions.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACjC,OAAO,IAAI,MAAM,aAAa,CAAA;AAC9B,OAAO,EAAE,sBAAsB,EAAE,MAAM,UAAU,CAAA;AACjD,OAAO,EAAE,uBAAuB,EAAE,MAAM,UAAU,CAAA;AAElD,OAAO,EAAE,4BAA4B,EAAE,MAAM,+BAA+B,CAAA;AAC5E,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAA;AAE7D;;;;;;GAMG;AACH,MAAM,UAAU,eAAe,CAAC,EAC9B,OAAO,EACP,OAAO,EACP,cAAc,EACd,WAAW,EACX,aAAa,GACQ;IACrB,MAAM,SAAS,GAAG,uBAAuB,EAAE,CAAA;IAC3C,MAAM,mBAAmB,GAAG,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,CAAA;IAClD,MAAM,gBAAgB,GAAG,MAAM,CAAC,OAAO,CAAC,OAAO,CAAC,CAAA;IAEhD,SAAS,CAAC,GAAG,EAAE;QACb,8DAA8D;QAC9D,MAAM,OAAO,GAAG,qBAAqB,CAAC,GAAG,EAAE;YACzC,sBAAsB,CAAC,SAAS,CAAC,CAAA;QACnC,CAAC,CAAC,CAAA;QAEF,OAAO,GAAG,EAAE,CAAC,oBAAoB,CAAC,OAAO,CAAC,CAAA;IAC5C,CAAC,EAAE,CAAC,SAAS,EAAE,cAAc,CAAC,CAAC,CAAA;IAE/B,OAAO,CACL,MAAC,IAAI,IAAC,SAAS,EAAC,8BAA8B,mBAAe,MAAM,aAChE,mBAAmB,CAAC,CAAC,CAAC,CACrB,KAAC,oBAAoB,IACnB,KAAK,EAAE,OAAO,EACd,cAAc,EAAE,cAAc,EAC9B,OAAO,EAAE,OAAO,EAChB,WAAW,EAAE,WAAW,GACxB,CACH,CAAC,CAAC,CAAC,CACF,4BACG,gBAAgB,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,EAAE,KAAK,CAAC,EAAE,EAAE,CAAC,CACxC,KAAC,4BAA4B,IAE3B,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,KAAK,EACZ,cAAc,EAAE,cAAc,EAC9B,OAAO,EAAE,OAAO,EAChB,WAAW,EAAE,WAAW,IALnB,2BAA2B,KAAK,EAAE,CAMvC,CACH,CAAC,GACD,CACJ,EACA,aAAa,IAAI,CAChB,cAAK,SAAS,EAAC,wCAAwC,YACpD,aAAa,GACV,CACP,IACI,CACR,CAAA;AACH,CAAC;AAED,eAAe,eAAe,CAAA"}
+{"version":3,"file":"ComboBoxOptions.js","sourceRoot":"","sources":["../../src/partials/ComboBoxOptions.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACjC,OAAO,IAAI,MAAM,aAAa,CAAA;AAC9B,OAAO,EAAE,sBAAsB,EAAE,MAAM,UAAU,CAAA;AACjD,OAAO,EAAE,uBAAuB,EAAE,MAAM,UAAU,CAAA;AAElD,OAAO,EAAE,4BAA4B,EAAE,MAAM,+BAA+B,CAAA;AAC5E,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAA;AAE7D;;;;;;GAMG;AACH,MAAM,UAAU,eAAe,CAAC,EAC9B,OAAO,EACP,OAAO,EACP,cAAc,EACd,WAAW,EACX,aAAa,GACQ;IACrB,MAAM,SAAS,GAAG,uBAAuB,EAAE,CAAA;IAC3C,MAAM,mBAAmB,GAAG,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,CAAA;IAClD,MAAM,gBAAgB,GAAG,MAAM,CAAC,OAAO,CAAC,OAAO,CAAC,CAAA;IAEhD,SAAS,CAAC,GAAG,EAAE;QACb,kDAAkD;QAClD,MAAM,SAAS,GAAG,UAAU,CAAC,GAAG,EAAE;YAChC,sBAAsB,CAAC,SAAS,CAAC,CAAA;QACnC,CAAC,EAAE,GAAG,CAAC,CAAA;QAEP,OAAO,GAAG,EAAE,CAAC,YAAY,CAAC,SAAS,CAAC,CAAA;IACtC,CAAC,EAAE,CAAC,SAAS,EAAE,cAAc,CAAC,CAAC,CAAA;IAE/B,OAAO,CACL,MAAC,IAAI,IAAC,SAAS,EAAC,8BAA8B,mBAAe,MAAM,aAChE,mBAAmB,CAAC,CAAC,CAAC,CACrB,KAAC,oBAAoB,IACnB,KAAK,EAAE,OAAO,EACd,cAAc,EAAE,cAAc,EAC9B,OAAO,EAAE,OAAO,EAChB,WAAW,EAAE,WAAW,GACxB,CACH,CAAC,CAAC,CAAC,CACF,4BACG,gBAAgB,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,EAAE,KAAK,CAAC,EAAE,EAAE,CAAC,CACxC,KAAC,4BAA4B,IAE3B,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,KAAK,EACZ,cAAc,EAAE,cAAc,EAC9B,OAAO,EAAE,OAAO,EAChB,WAAW,EAAE,WAAW,IALnB,2BAA2B,KAAK,EAAE,CAMvC,CACH,CAAC,GACD,CACJ,EACA,aAAa,IAAI,CAChB,cAAK,SAAS,EAAC,wCAAwC,YACpD,aAAa,GACV,CACP,IACI,CACR,CAAA;AACH,CAAC;AAED,eAAe,eAAe,CAAA"}

package/lib/utils/scrollOptionToViewport.js

@@ -6,33 +6,21 @@
  */
 export function scrollOptionToViewport(isDesktop) {
     const comboboxOptions = isDesktop
-        ? document.querySelector('.combobox .menu')
-        : document.querySelector('.combobox__options .menu');
-    const selectedItem = document.querySelector('.menu-item.selected');
-    if (!selectedItem || !comboboxOptions) {
-        return;
-    }
-    // Find the options group that contains the selected item
-    const comboboxOptionsGroup = selectedItem.closest('.combobox__options-group');
-    if (comboboxOptionsGroup) {
-        // For grouped options, scroll to the group header
-        const stickyHeader = comboboxOptionsGroup.querySelector('.combobox__sticky-header');
-        if (stickyHeader) {
-            const headerTop = stickyHeader.offsetTop;
-            comboboxOptions.scrollTo({ top: headerTop, behavior: 'smooth' });
+        ? document.querySelector('.menu')
+        : document.querySelector('.menu.combobox__options');
+    const selectedItem = comboboxOptions.querySelector('.menu-item.selected');
+    if (selectedItem && comboboxOptions) {
+        let comboboxOptionWrapper = selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.parentElement;
+        let comboboxOptionsGroup = comboboxOptionWrapper === null || comboboxOptionWrapper === void 0 ? void 0 : comboboxOptionWrapper.parentElement;
+        if (comboboxOptionsGroup) {
+            const stickyHeader = comboboxOptionsGroup === null || comboboxOptionsGroup === void 0 ? void 0 : comboboxOptionsGroup.querySelector('.combobox__sticky-header');
+            const stickyHeaderOffset = stickyHeader === null || stickyHeader === void 0 ? void 0 : stickyHeader.offsetTop;
+            comboboxOptions === null || comboboxOptions === void 0 ? void 0 : comboboxOptions.scrollTo({ top: stickyHeaderOffset });
+        }
+        else {
+            const selectedItemOffset = selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.offsetTop;
+            comboboxOptions === null || comboboxOptions === void 0 ? void 0 : comboboxOptions.scrollTo({ top: selectedItemOffset, behavior: 'smooth' });
         }
-    }
-    else {
-        // For ungrouped options, scroll to the selected item
-        const selectedItemTop = selectedItem.offsetTop;
-        const selectedItemHeight = selectedItem.offsetHeight;
-        const containerHeight = comboboxOptions.clientHeight;
-        // Center the item in the viewport
-        const scrollTop = selectedItemTop - containerHeight / 2 + selectedItemHeight / 2;
-        comboboxOptions.scrollTo({
-            top: Math.max(0, scrollTop),
-            behavior: 'smooth',
-        });
     }
 }
 //# sourceMappingURL=scrollOptionToViewport.js.map

package/lib/utils/scrollOptionToViewport.js.map

@@ -1 +1 @@
-{"version":3,"file":"scrollOptionToViewport.js","sourceRoot":"","sources":["../../src/utils/scrollOptionToViewport.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,MAAM,UAAU,sBAAsB,CAAC,SAAkB;IACvD,MAAM,eAAe,GAAG,SAAS;QAC/B,CAAC,CAAE,QAAQ,CAAC,aAAa,CAAC,iBAAiB,CAAiB;QAC5D,CAAC,CAAE,QAAQ,CAAC,aAAa,CAAC,0BAA0B,CAAiB,CAAA;IACvE,MAAM,YAAY,GAAG,QAAQ,CAAC,aAAa,CACzC,qBAAqB,CACP,CAAA;IAEhB,IAAI,CAAC,YAAY,IAAI,CAAC,eAAe,EAAE,CAAC;QACtC,OAAM;IACR,CAAC;IAED,yDAAyD;IACzD,MAAM,oBAAoB,GAAG,YAAY,CAAC,OAAO,CAC/C,0BAA0B,CACZ,CAAA;IAEhB,IAAI,oBAAoB,EAAE,CAAC;QACzB,kDAAkD;QAClD,MAAM,YAAY,GAAG,oBAAoB,CAAC,aAAa,CACrD,0BAA0B,CACZ,CAAA;QAEhB,IAAI,YAAY,EAAE,CAAC;YACjB,MAAM,SAAS,GAAG,YAAY,CAAC,SAAS,CAAA;YACxC,eAAe,CAAC,QAAQ,CAAC,EAAE,GAAG,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAE,CAAC,CAAA;QAClE,CAAC;IACH,CAAC;SAAM,CAAC;QACN,qDAAqD;QACrD,MAAM,eAAe,GAAG,YAAY,CAAC,SAAS,CAAA;QAC9C,MAAM,kBAAkB,GAAG,YAAY,CAAC,YAAY,CAAA;QACpD,MAAM,eAAe,GAAG,eAAe,CAAC,YAAY,CAAA;QAEpD,kCAAkC;QAClC,MAAM,SAAS,GACb,eAAe,GAAG,eAAe,GAAG,CAAC,GAAG,kBAAkB,GAAG,CAAC,CAAA;QAChE,eAAe,CAAC,QAAQ,CAAC;YACvB,GAAG,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,SAAS,CAAC;YAC3B,QAAQ,EAAE,QAAQ;SACnB,CAAC,CAAA;IACJ,CAAC;AACH,CAAC"}
+{"version":3,"file":"scrollOptionToViewport.js","sourceRoot":"","sources":["../../src/utils/scrollOptionToViewport.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,MAAM,UAAU,sBAAsB,CAAC,SAAkB;IACvD,MAAM,eAAe,GAAG,SAAS;QAC/B,CAAC,CAAE,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAiB;QAClD,CAAC,CAAE,QAAQ,CAAC,aAAa,CAAC,yBAAyB,CAAiB,CAAA;IAEtE,MAAM,YAAY,GAAG,eAAe,CAAC,aAAa,CAChD,qBAAqB,CACP,CAAA;IAEhB,IAAI,YAAY,IAAI,eAAe,EAAE,CAAC;QACpC,IAAI,qBAAqB,GAAG,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,aAAa,CAAA;QACvD,IAAI,oBAAoB,GAAG,qBAAqB,aAArB,qBAAqB,uBAArB,qBAAqB,CAAE,aAAa,CAAA;QAE/D,IAAI,oBAAoB,EAAE,CAAC;YACzB,MAAM,YAAY,GAAG,oBAAoB,aAApB,oBAAoB,uBAApB,oBAAoB,CAAE,aAAa,CACtD,0BAA0B,CACZ,CAAA;YAEhB,MAAM,kBAAkB,GAAG,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,SAAS,CAAA;YAElD,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,QAAQ,CAAC,EAAE,GAAG,EAAE,kBAAkB,EAAE,CAAC,CAAA;QACxD,CAAC;aAAM,CAAC;YACN,MAAM,kBAAkB,GAAG,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,SAAS,CAAA;YAElD,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,QAAQ,CAAC,EAAE,GAAG,EAAE,kBAAkB,EAAE,QAAQ,EAAE,QAAQ,EAAE,CAAC,CAAA;QAC5E,CAAC;IACH,CAAC;AACH,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pixum/combobox",
-  "version": "5.1.1",
+  "version": "5.1.2-alpha.1+333f32a7",
   "main": "lib/index.js",
   "module": "lib/index.js",
   "license": "UNLICENSED",
@@ -18,5 +18,5 @@
   "sideEffects": [
     "*.css"
   ],
-  "gitHead": "257b4c07b40a032730549fc24c7aa14183f643fb"
+  "gitHead": "333f32a7b2e70a0be3a9d579301c5a760281267a"
 }