@wallarm-org/design-system 2.1.2 → 2.2.0-rc-fix-overflow-list-api.1

package/dist/components/OverflowList/OverflowList.js

@@ -1,194 +1,124 @@
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { c } from "react/compiler-runtime";
-import { memo, useEffect, useRef, useState } from "react";
+import { memo, useEffect, useRef } from "react";
 import { useOverflowItems } from "../../hooks/index.js";
 import { cn } from "../../utils/cn.js";
-import { DefaultOverflowRenderer } from "./DefaultOverflowRenderer.js";
 import { OVERFLOW_RESERVE_SPACE, areItemsShallowEqual, resolveVisibleItems } from "./OverflowList.helpers.js";
+import { OverflowListProvider } from "./OverflowListContext.js";
+import { OverflowListMore } from "./OverflowListMore.js";
+const NO_ITEMS = [];
+const renderDefaultOverflow = ()=>/*#__PURE__*/ jsx(OverflowListMore, {});
 const OverflowListComponent = (t0)=>{
-    const $ = c(71);
+    const $ = c(74);
     let className;
     let itemRenderer;
     let items;
     let onOverflow;
-    let overflowHeaderLabel;
-    let overflowRenderer;
     let props;
     let t1;
     let t2;
     let t3;
     let t4;
-    let t5;
-    let t6;
+    let testId;
     if ($[0] !== t0) {
-        ({ items, itemRenderer, overflowRenderer, overflowHeaderLabel, showAll: t1, overlayOrigin: t2, dimVisibleItems: t3, className, collapseFrom: t4, minVisibleItems: t5, alwaysRenderOverflow: t6, onOverflow, ...props } = t0);
+        ({ items, itemRenderer, overflowRenderer: t1, className, collapseFrom: t2, minVisibleItems: t3, alwaysRenderOverflow: t4, onOverflow, "data-testid": testId, ...props } = t0);
         $[0] = t0;
         $[1] = className;
         $[2] = itemRenderer;
         $[3] = items;
         $[4] = onOverflow;
-        $[5] = overflowHeaderLabel;
-        $[6] = overflowRenderer;
-        $[7] = props;
-        $[8] = t1;
-        $[9] = t2;
-        $[10] = t3;
-        $[11] = t4;
-        $[12] = t5;
-        $[13] = t6;
+        $[5] = props;
+        $[6] = t1;
+        $[7] = t2;
+        $[8] = t3;
+        $[9] = t4;
+        $[10] = testId;
     } else {
         className = $[1];
         itemRenderer = $[2];
         items = $[3];
         onOverflow = $[4];
-        overflowHeaderLabel = $[5];
-        overflowRenderer = $[6];
-        props = $[7];
-        t1 = $[8];
-        t2 = $[9];
-        t3 = $[10];
-        t4 = $[11];
-        t5 = $[12];
-        t6 = $[13];
+        props = $[5];
+        t1 = $[6];
+        t2 = $[7];
+        t3 = $[8];
+        t4 = $[9];
+        testId = $[10];
     }
-    const showAll = void 0 === t1 ? true : t1;
-    const overlayOrigin = void 0 === t2 ? false : t2;
-    const dimVisibleItems = void 0 === t3 ? true : t3;
-    const collapseFrom = void 0 === t4 ? "end" : t4;
-    const minVisibleItems = void 0 === t5 ? 0 : t5;
-    const alwaysRenderOverflow = void 0 === t6 ? false : t6;
+    const overflowRenderer = void 0 === t1 ? renderDefaultOverflow : t1;
+    const collapseFrom = void 0 === t2 ? "end" : t2;
+    const minVisibleItems = void 0 === t3 ? 0 : t3;
+    const alwaysRenderOverflow = void 0 === t4 ? false : t4;
     let map;
-    if ($[14] !== items) {
+    if ($[11] !== items) {
         map = new Map();
         items.forEach((item, index)=>{
             if (!map.has(item)) map.set(item, index);
         });
-        $[14] = items;
-        $[15] = map;
-    } else map = $[15];
+        $[11] = items;
+        $[12] = map;
+    } else map = $[12];
     const indexMap = map;
-    let t7;
+    let t5;
+    if ($[13] !== indexMap || $[14] !== itemRenderer) {
+        t5 = (item_0)=>itemRenderer(item_0, indexMap.get(item_0) ?? 0);
+        $[13] = indexMap;
+        $[14] = itemRenderer;
+        $[15] = t5;
+    } else t5 = $[15];
+    const memoizedItemRenderer = t5;
+    let t6;
     if ($[16] !== indexMap || $[17] !== itemRenderer) {
-        t7 = (item_0)=>itemRenderer(item_0, indexMap.get(item_0) ?? 0);
+        t6 = (item_1)=>itemRenderer(item_1, indexMap.get(item_1) ?? 0);
         $[16] = indexMap;
         $[17] = itemRenderer;
-        $[18] = t7;
-    } else t7 = $[18];
-    const memoizedItemRenderer = t7;
-    let t8;
-    if ($[19] !== indexMap || $[20] !== itemRenderer) {
-        t8 = (item_1)=>itemRenderer(item_1, indexMap.get(item_1) ?? 0);
-        $[19] = indexMap;
-        $[20] = itemRenderer;
-        $[21] = t8;
-    } else t8 = $[21];
-    const memoizedMeasurementRenderer = t8;
-    const [overlayOffset, setOverlayOffset] = useState(0);
-    const triggerRef = useRef(null);
-    let t9;
-    if ($[22] !== dimVisibleItems || $[23] !== itemRenderer || $[24] !== overflowHeaderLabel || $[25] !== overlayOffset || $[26] !== overlayOrigin || $[27] !== showAll) {
-        t9 = (data)=>/*#__PURE__*/ jsx(DefaultOverflowRenderer, {
-                data: data,
-                itemRenderer: itemRenderer,
-                overflowHeaderLabel: overflowHeaderLabel,
-                showAll: showAll,
-                overlayOrigin: overlayOrigin,
-                dimVisibleItems: dimVisibleItems,
-                overlayOffset: overlayOffset,
-                triggerRef: triggerRef
+        $[18] = t6;
+    } else t6 = $[18];
+    const memoizedMeasurementRenderer = t6;
+    let t7;
+    if ($[19] !== overflowRenderer) {
+        t7 = (allItems)=>overflowRenderer(allItems, {
+                allItems,
+                visibleItems: NO_ITEMS
             });
-        $[22] = dimVisibleItems;
-        $[23] = itemRenderer;
-        $[24] = overflowHeaderLabel;
-        $[25] = overlayOffset;
-        $[26] = overlayOrigin;
-        $[27] = showAll;
-        $[28] = t9;
-    } else t9 = $[28];
-    const defaultOverflowRenderer = t9;
-    const finalOverflowRenderer = overflowRenderer ?? defaultOverflowRenderer;
-    let t10;
-    if ($[29] !== finalOverflowRenderer || $[30] !== items) {
-        t10 = (hiddenItems)=>{
-            const data_0 = {
-                allItems: items,
-                visibleCount: items.length - hiddenItems.length,
-                hiddenCount: hiddenItems.length
-            };
-            return finalOverflowRenderer(data_0);
-        };
-        $[29] = finalOverflowRenderer;
-        $[30] = items;
-        $[31] = t10;
-    } else t10 = $[31];
-    const wrappedOverflowRenderer = t10;
-    let t11;
-    if ($[32] !== items || $[33] !== memoizedMeasurementRenderer || $[34] !== wrappedOverflowRenderer) {
-        t11 = {
+        $[19] = overflowRenderer;
+        $[20] = t7;
+    } else t7 = $[20];
+    const measurementOverflowRenderer = t7;
+    let t8;
+    if ($[21] !== items || $[22] !== measurementOverflowRenderer || $[23] !== memoizedMeasurementRenderer) {
+        t8 = {
             items,
             renderItem: memoizedMeasurementRenderer,
-            overflowRenderer: wrappedOverflowRenderer,
+            overflowRenderer: measurementOverflowRenderer,
             reserveSpace: OVERFLOW_RESERVE_SPACE
         };
-        $[32] = items;
-        $[33] = memoizedMeasurementRenderer;
-        $[34] = wrappedOverflowRenderer;
-        $[35] = t11;
-    } else t11 = $[35];
-    const { containerRef, visibleItems, hiddenItems: hiddenItems_0, MeasurementContainer } = useOverflowItems(t11);
-    let t12;
-    let t13;
-    if ($[36] !== containerRef || $[37] !== overlayOrigin) {
-        t12 = ()=>{
-            if (!overlayOrigin || !containerRef.current || !triggerRef.current) return;
-            const updateOffset = ()=>{
-                if (containerRef.current && triggerRef.current) {
-                    const containerRect = containerRef.current.getBoundingClientRect();
-                    const triggerRect = triggerRef.current.getBoundingClientRect();
-                    const offset = -(triggerRect.left - containerRect.left);
-                    setOverlayOffset(offset);
-                }
-            };
-            updateOffset();
-            const resizeObserver = new ResizeObserver(updateOffset);
-            resizeObserver.observe(containerRef.current);
-            if (triggerRef.current) resizeObserver.observe(triggerRef.current);
-            return ()=>resizeObserver.disconnect();
-        };
-        t13 = [
-            overlayOrigin,
-            containerRef
-        ];
-        $[36] = containerRef;
-        $[37] = overlayOrigin;
-        $[38] = t12;
-        $[39] = t13;
-    } else {
-        t12 = $[38];
-        t13 = $[39];
-    }
-    useEffect(t12, t13);
-    let t14;
-    if ($[40] !== hiddenItems_0 || $[41] !== items || $[42] !== minVisibleItems || $[43] !== visibleItems) {
-        t14 = resolveVisibleItems({
+        $[21] = items;
+        $[22] = measurementOverflowRenderer;
+        $[23] = memoizedMeasurementRenderer;
+        $[24] = t8;
+    } else t8 = $[24];
+    const { containerRef, visibleItems, hiddenItems, MeasurementContainer } = useOverflowItems(t8);
+    let t9;
+    if ($[25] !== hiddenItems || $[26] !== items || $[27] !== minVisibleItems || $[28] !== visibleItems) {
+        t9 = resolveVisibleItems({
             items,
             visibleItems,
-            hiddenItems: hiddenItems_0,
+            hiddenItems,
             minVisibleItems
         });
-        $[40] = hiddenItems_0;
-        $[41] = items;
-        $[42] = minVisibleItems;
-        $[43] = visibleItems;
-        $[44] = t14;
-    } else t14 = $[44];
-    const { visibleItems: finalVisibleItems, hiddenItems: finalHiddenItems } = t14;
-    const finalHiddenCount = finalHiddenItems.length;
+        $[25] = hiddenItems;
+        $[26] = items;
+        $[27] = minVisibleItems;
+        $[28] = visibleItems;
+        $[29] = t9;
+    } else t9 = $[29];
+    const { visibleItems: finalVisibleItems, hiddenItems: finalHiddenItems } = t9;
     const prevHiddenRef = useRef(null);
-    let t15;
-    let t16;
-    if ($[45] !== finalHiddenItems || $[46] !== onOverflow) {
-        t15 = ()=>{
+    let t10;
+    let t11;
+    if ($[30] !== finalHiddenItems || $[31] !== onOverflow) {
+        t10 = ()=>{
             if (!onOverflow || 0 === finalHiddenItems.length) {
                 prevHiddenRef.current = finalHiddenItems;
                 return;
@@ -196,97 +126,156 @@ const OverflowListComponent = (t0)=>{
             if (!areItemsShallowEqual(prevHiddenRef.current, finalHiddenItems)) onOverflow(finalHiddenItems);
             prevHiddenRef.current = finalHiddenItems;
         };
-        t16 = [
+        t11 = [
             finalHiddenItems,
             onOverflow
         ];
-        $[45] = finalHiddenItems;
-        $[46] = onOverflow;
-        $[47] = t15;
-        $[48] = t16;
+        $[30] = finalHiddenItems;
+        $[31] = onOverflow;
+        $[32] = t10;
+        $[33] = t11;
     } else {
-        t15 = $[47];
-        t16 = $[48];
+        t10 = $[32];
+        t11 = $[33];
     }
-    useEffect(t15, t16);
-    let t17;
+    useEffect(t10, t11);
+    let t12;
+    if ($[34] !== containerRef || $[35] !== finalHiddenItems || $[36] !== finalVisibleItems || $[37] !== itemRenderer || $[38] !== items || $[39] !== testId) {
+        t12 = {
+            allItems: items,
+            visibleItems: finalVisibleItems,
+            hiddenItems: finalHiddenItems,
+            itemRenderer,
+            containerRef,
+            measuring: false,
+            testId
+        };
+        $[34] = containerRef;
+        $[35] = finalHiddenItems;
+        $[36] = finalVisibleItems;
+        $[37] = itemRenderer;
+        $[38] = items;
+        $[39] = testId;
+        $[40] = t12;
+    } else t12 = $[40];
+    const context = t12;
+    let t13;
+    if ($[41] !== containerRef || $[42] !== itemRenderer || $[43] !== items) {
+        t13 = {
+            allItems: items,
+            visibleItems: NO_ITEMS,
+            hiddenItems: items,
+            itemRenderer,
+            containerRef,
+            measuring: true,
+            testId: void 0
+        };
+        $[41] = containerRef;
+        $[42] = itemRenderer;
+        $[43] = items;
+        $[44] = t13;
+    } else t13 = $[44];
+    const measurementContext = t13;
+    let t14;
     bb0: {
-        if (0 === finalHiddenCount && !alwaysRenderOverflow) {
-            t17 = null;
+        if (0 === finalHiddenItems.length && !alwaysRenderOverflow) {
+            t14 = null;
             break bb0;
         }
-        let t18;
-        if ($[49] !== finalHiddenCount || $[50] !== finalOverflowRenderer || $[51] !== finalVisibleItems.length || $[52] !== items) {
-            const overflowData = {
+        let t15;
+        if ($[45] !== finalHiddenItems || $[46] !== finalVisibleItems || $[47] !== items || $[48] !== overflowRenderer) {
+            t15 = overflowRenderer(finalHiddenItems, {
                 allItems: items,
-                visibleCount: finalVisibleItems.length,
-                hiddenCount: finalHiddenCount
-            };
-            t18 = finalOverflowRenderer(overflowData);
-            $[49] = finalHiddenCount;
-            $[50] = finalOverflowRenderer;
-            $[51] = finalVisibleItems.length;
-            $[52] = items;
-            $[53] = t18;
-        } else t18 = $[53];
-        t17 = t18;
+                visibleItems: finalVisibleItems
+            });
+            $[45] = finalHiddenItems;
+            $[46] = finalVisibleItems;
+            $[47] = items;
+            $[48] = overflowRenderer;
+            $[49] = t15;
+        } else t15 = $[49];
+        t14 = t15;
     }
-    const overflowElement = t17;
+    const overflowElement = t14;
+    let t15;
+    if ($[50] !== finalVisibleItems || $[51] !== memoizedItemRenderer) {
+        t15 = finalVisibleItems.map(memoizedItemRenderer);
+        $[50] = finalVisibleItems;
+        $[51] = memoizedItemRenderer;
+        $[52] = t15;
+    } else t15 = $[52];
+    const visibleElements = t15;
+    let t16;
+    if ($[53] !== context || $[54] !== overflowElement) {
+        t16 = overflowElement && /*#__PURE__*/ jsx(OverflowListProvider, {
+            value: context,
+            children: overflowElement
+        });
+        $[53] = context;
+        $[54] = overflowElement;
+        $[55] = t16;
+    } else t16 = $[55];
+    const overflow = t16;
+    const t17 = measurementContext;
     let t18;
-    if ($[54] !== finalVisibleItems || $[55] !== memoizedItemRenderer) {
-        t18 = finalVisibleItems.map(memoizedItemRenderer);
-        $[54] = finalVisibleItems;
-        $[55] = memoizedItemRenderer;
-        $[56] = t18;
-    } else t18 = $[56];
-    const visibleElements = t18;
+    if ($[56] !== MeasurementContainer) {
+        t18 = /*#__PURE__*/ jsx(MeasurementContainer, {});
+        $[56] = MeasurementContainer;
+        $[57] = t18;
+    } else t18 = $[57];
     let t19;
-    if ($[57] !== MeasurementContainer) {
-        t19 = /*#__PURE__*/ jsx(MeasurementContainer, {});
-        $[57] = MeasurementContainer;
-        $[58] = t19;
-    } else t19 = $[58];
+    if ($[58] !== t17 || $[59] !== t18) {
+        t19 = /*#__PURE__*/ jsx(OverflowListProvider, {
+            value: t17,
+            children: t18
+        });
+        $[58] = t17;
+        $[59] = t18;
+        $[60] = t19;
+    } else t19 = $[60];
     let t20;
-    if ($[59] !== className) {
+    if ($[61] !== className) {
         t20 = cn("flex w-full min-w-0", className);
-        $[59] = className;
-        $[60] = t20;
-    } else t20 = $[60];
-    const t21 = "start" === collapseFrom && overflowElement;
-    const t22 = "end" === collapseFrom && overflowElement;
+        $[61] = className;
+        $[62] = t20;
+    } else t20 = $[62];
+    const t21 = "start" === collapseFrom && overflow;
+    const t22 = "end" === collapseFrom && overflow;
     let t23;
-    if ($[61] !== containerRef || $[62] !== props || $[63] !== t20 || $[64] !== t21 || $[65] !== t22 || $[66] !== visibleElements) {
+    if ($[63] !== containerRef || $[64] !== props || $[65] !== t20 || $[66] !== t21 || $[67] !== t22 || $[68] !== testId || $[69] !== visibleElements) {
         t23 = /*#__PURE__*/ jsxs("div", {
+            ...props,
             ref: containerRef,
             "data-slot": "overflow-list",
+            "data-testid": testId,
             className: t20,
-            ...props,
             children: [
                 t21,
                 visibleElements,
                 t22
             ]
         });
-        $[61] = containerRef;
-        $[62] = props;
-        $[63] = t20;
-        $[64] = t21;
-        $[65] = t22;
-        $[66] = visibleElements;
-        $[67] = t23;
-    } else t23 = $[67];
+        $[63] = containerRef;
+        $[64] = props;
+        $[65] = t20;
+        $[66] = t21;
+        $[67] = t22;
+        $[68] = testId;
+        $[69] = visibleElements;
+        $[70] = t23;
+    } else t23 = $[70];
     let t24;
-    if ($[68] !== t19 || $[69] !== t23) {
+    if ($[71] !== t19 || $[72] !== t23) {
         t24 = /*#__PURE__*/ jsxs(Fragment, {
             children: [
                 t19,
                 t23
             ]
         });
-        $[68] = t19;
-        $[69] = t23;
-        $[70] = t24;
-    } else t24 = $[70];
+        $[71] = t19;
+        $[72] = t23;
+        $[73] = t24;
+    } else t24 = $[73];
     return t24;
 };
 const OverflowList = /*#__PURE__*/ memo(OverflowListComponent);

package/dist/components/OverflowList/OverflowListContext.d.ts

@@ -0,0 +1,25 @@
+import { type ReactNode, type RefObject } from 'react';
+export interface OverflowListContextValue<T = unknown> {
+    /** Full source list, in order. */
+    allItems: T[];
+    /** Items rendered in the row. */
+    visibleItems: T[];
+    /** Items folded into the overflow indicator. */
+    hiddenItems: T[];
+    /** The list's own `itemRenderer`, reused by `OverflowListMoreItems`. */
+    itemRenderer: (item: T, index: number) => ReactNode;
+    /** The row element — the anchor for `OverflowListMore placement='cover'`. */
+    containerRef: RefObject<HTMLDivElement | null>;
+    /**
+     * True inside the hidden measurement layer. `OverflowListMore` parts render
+     * only the bare trigger chip there — no popover, no refs, no test ids.
+     */
+    measuring: boolean;
+    /** The list's `data-testid` — the base `OverflowListMore` derives `--more` from. */
+    testId: string | undefined;
+}
+export declare const OverflowListProvider: import("react").Provider<OverflowListContextValue<unknown> | null>;
+export declare const useOverflowListContext: <T = unknown>() => OverflowListContextValue<T>;
+export declare const OverflowListMoreTriggerRefProvider: import("react").Provider<RefObject<HTMLButtonElement | null> | null>;
+/** The `OverflowListMore` trigger ref — `cover` placement anchors to its top edge. */
+export declare const useOverflowListMoreTriggerRef: () => RefObject<HTMLButtonElement | null> | null;

package/dist/components/OverflowList/OverflowListContext.js

@@ -0,0 +1,12 @@
+import { createContext, useContext } from "react";
+const OverflowListContext = createContext(null);
+const OverflowListProvider = OverflowListContext.Provider;
+const useOverflowListContext = ()=>{
+    const context = useContext(OverflowListContext);
+    if (!context) throw new Error("OverflowListMore parts must be rendered inside an OverflowList overflowRenderer");
+    return context;
+};
+const OverflowListMoreTriggerRefContext = createContext(null);
+const OverflowListMoreTriggerRefProvider = OverflowListMoreTriggerRefContext.Provider;
+const useOverflowListMoreTriggerRef = ()=>useContext(OverflowListMoreTriggerRefContext);
+export { OverflowListMoreTriggerRefProvider, OverflowListProvider, useOverflowListContext, useOverflowListMoreTriggerRef };

package/dist/components/OverflowList/OverflowListMore.d.ts

@@ -0,0 +1,17 @@
+import { type FC, type ReactNode } from 'react';
+import { type TestableProps } from '../../utils/testId.js';
+import { type PopoverProps } from '../Popover/index.js';
+export interface OverflowListMoreProps extends Pick<PopoverProps, 'open' | 'onOpenChange'>, TestableProps {
+    /**
+     * Defaults to `<OverflowListMoreTrigger />` + `<OverflowListMoreContent />`.
+     * Compose from the `OverflowListMore*` parts only — they know to render a bare
+     * chip in the hidden measurement layer, where there is no popover root.
+     */
+    children?: ReactNode;
+    /**
+     * `trigger` — the popover opens below the "+N" chip.
+     * `cover` — the popover opens over the row, from the list's left edge.
+     */
+    placement?: 'trigger' | 'cover';
+}
+export declare const OverflowListMore: FC<OverflowListMoreProps>;

package/dist/components/OverflowList/OverflowListMore.js

@@ -0,0 +1,85 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { c } from "react/compiler-runtime";
+import { useRef } from "react";
+import { TestIdProvider } from "../../utils/testId.js";
+import { Popover } from "../Popover/index.js";
+import { OverflowListMoreTriggerRefProvider, useOverflowListContext } from "./OverflowListContext.js";
+import { OverflowListMoreContent } from "./OverflowListMoreContent.js";
+import { OverflowListMoreTrigger } from "./OverflowListMoreTrigger.js";
+const DEFAULT_CHILDREN = /*#__PURE__*/ jsxs(Fragment, {
+    children: [
+        /*#__PURE__*/ jsx(OverflowListMoreTrigger, {}),
+        /*#__PURE__*/ jsx(OverflowListMoreContent, {})
+    ]
+});
+const OverflowListMore = (t0)=>{
+    const $ = c(11);
+    const { children: t1, placement: t2, open, onOpenChange, "data-testid": testIdProp } = t0;
+    const children = void 0 === t1 ? DEFAULT_CHILDREN : t1;
+    const placement = void 0 === t2 ? "trigger" : t2;
+    const { hiddenItems, containerRef, measuring, testId: listTestId } = useOverflowListContext();
+    const testId = testIdProp ?? (listTestId ? `${listTestId}--more` : void 0);
+    const triggerRef = useRef(null);
+    if (measuring) {
+        let t3;
+        if ($[0] !== children) {
+            t3 = /*#__PURE__*/ jsx(TestIdProvider, {
+                value: void 0,
+                children: children
+            });
+            $[0] = children;
+            $[1] = t3;
+        } else t3 = $[1];
+        return t3;
+    }
+    if (0 === hiddenItems.length) return null;
+    let t3;
+    if ($[2] !== containerRef || $[3] !== placement) {
+        t3 = "cover" === placement ? {
+            placement: "bottom-start",
+            gutter: 0,
+            offset: {
+                mainAxis: 0,
+                crossAxis: 0
+            },
+            getAnchorElement: ()=>{
+                const container = containerRef.current;
+                if (!container) return null;
+                return {
+                    contextElement: container,
+                    getBoundingClientRect: ()=>{
+                        const row = container.getBoundingClientRect();
+                        const top = triggerRef.current?.getBoundingClientRect().top ?? row.top;
+                        return new DOMRect(row.left, top, row.width, 0);
+                    }
+                };
+            }
+        } : void 0;
+        $[2] = containerRef;
+        $[3] = placement;
+        $[4] = t3;
+    } else t3 = $[4];
+    const positioning = t3;
+    let t4;
+    if ($[5] !== children || $[6] !== onOpenChange || $[7] !== open || $[8] !== positioning || $[9] !== testId) {
+        t4 = /*#__PURE__*/ jsx(OverflowListMoreTriggerRefProvider, {
+            value: triggerRef,
+            children: /*#__PURE__*/ jsx(Popover, {
+                open: open,
+                onOpenChange: onOpenChange,
+                positioning: positioning,
+                "data-testid": testId,
+                children: children
+            })
+        });
+        $[5] = children;
+        $[6] = onOpenChange;
+        $[7] = open;
+        $[8] = positioning;
+        $[9] = testId;
+        $[10] = t4;
+    } else t4 = $[10];
+    return t4;
+};
+OverflowListMore.displayName = "OverflowListMore";
+export { OverflowListMore };

package/dist/components/OverflowList/OverflowListMoreContent.d.ts

@@ -0,0 +1,7 @@
+import type { FC, ReactNode } from 'react';
+import { type PopoverContentProps } from '../Popover/index.js';
+export interface OverflowListMoreContentProps extends Omit<PopoverContentProps, 'children'> {
+    /** Defaults to `<OverflowListMoreItems />`. */
+    children?: ReactNode;
+}
+export declare const OverflowListMoreContent: FC<OverflowListMoreContentProps>;