bianic-ui 2.5.1-beta.1 → 2.6.0

package/dist/esm/index.js

@@ -1951,9 +1951,6 @@ var getDropdownStyle = function (anchorRef, popupRef) {
     return style;
 };
 var usePopupPosition = function (anchorRef, popupRef, position) {
-    // In projects where bianic-ui is installed,
-    // there is a delay in rendering styles,
-    // which causes popups to lose their position and need to be re-rendered.
     if (!anchorRef || !popupRef) {
         return [{}, function () { }];
     }
@@ -1966,18 +1963,23 @@ var usePopupPosition = function (anchorRef, popupRef, position) {
         setPositionStyle(newStyle);
     };
     useLayoutEffect(function () {
-        if (!(anchorRef === null || anchorRef === void 0 ? void 0 : anchorRef.current))
+        if (!(anchorRef === null || anchorRef === void 0 ? void 0 : anchorRef.current) || !(popupRef === null || popupRef === void 0 ? void 0 : popupRef.current))
             return;
         calcPosition();
-        window.addEventListener('scroll', calcPosition);
+        var resizeObserver = new ResizeObserver(calcPosition);
+        resizeObserver.observe(popupRef.current);
+        window.addEventListener('scroll', calcPosition, true);
         window.addEventListener('resize', calcPosition);
-        setRepeateRender(0);
         return function () {
-            window.removeEventListener('scroll', calcPosition);
+            resizeObserver.disconnect();
+            window.removeEventListener('scroll', calcPosition, true);
             window.removeEventListener('resize', calcPosition);
         };
-    }, [anchorRef]);
+    }, [anchorRef, popupRef]);
     useEffect(function () {
+        // In projects where bianic-ui is installed,
+        // there is a delay in rendering styles,
+        // which causes popups to lose their position and need to be re-rendered.
         if (repeateRender < 5 && (anchorRef === null || anchorRef === void 0 ? void 0 : anchorRef.current)) {
             calcPosition();
             setRepeateRender(repeateRender + 1);
@@ -3727,8 +3729,8 @@ var Notification = function (props) {
 };
 
 var sizeConfig$2 = {
-    md: 'min-w-[38px] h-[40px] text-[14px] font-semibold',
-    sm: 'min-w-[29px] h-[30px] text-[12px] font-normal',
+    md: 'min-w-[40px] h-[40px] text-[14px] font-semibold',
+    sm: 'min-w-[30px] h-[30px] text-[12px] font-normal',
 };
 var positionConfig = {
     start: 'justify-start',
@@ -3775,15 +3777,11 @@ function PaginationBar(_a) {
         else
             setStartIndex(0);
     };
-    var getStartIndex = function (index) {
-        if (index + PAGE_SIZE > totalPages)
-            return Math.max(0, totalPages - PAGE_SIZE);
-        return index;
-    };
     useEffect(function () {
-        var correctedIndex = getStartIndex(startIndex);
-        setShowedPages(totalRange.slice(correctedIndex, correctedIndex + PAGE_SIZE));
-    }, [startIndex, totalRange, totalPages]);
+        var start = Math.max(0, Math.min(startIndex, totalPages - PAGE_SIZE));
+        var newPages = Array.from({ length: totalPages }, function (_, i) { return i + 1; }).slice(start, start + PAGE_SIZE);
+        setShowedPages(newPages);
+    }, [startIndex, totalPages]);
     return (React.createElement("div", { className: "flex ".concat(positionConfig[position], " gap-[5px]") },
         totalPages > 5 && (React.createElement(Button, { variant: "subtle", size: size, type: "button", onClick: handlePrevRange, className: showedPages[0] === 1 ? '' : 'cursor-pointer', iconLeft: React.createElement(TbChevronsLeft, { size: iconSize }), disabled: showedPages[0] === 1 })),
         React.createElement(Button, { variant: "subtle", size: size, type: "button", onClick: function () {