@snack-uikit/list 0.31.0 → 0.31.2

package/CHANGELOG.md

@@ -3,6 +3,28 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## 0.31.2 (2025-07-09)
+
+
+### Bug Fixes
+
+* **PDS-2584:** fix scroll size ([f4a253e](https://github.com/cloud-ru-tech/snack-uikit/commit/f4a253e7f6d62094167219c4006e05e2b255cb50))
+
+
+
+
+
+## 0.31.1 (2025-07-07)
+
+
+### Bug Fixes
+
+* **PDS-2556:** prop closeOnPopstate for dropdown ([139dc62](https://github.com/cloud-ru-tech/snack-uikit/commit/139dc62e1e03212a748977f197e1e5dca8736789))
+
+
+
+
+
 # 0.31.0 (2025-07-07)
 
 

package/README.md

@@ -65,6 +65,7 @@
 | open | `boolean` | - | Управляет состоянием показан/не показан. |
 | onOpenChange | `(isOpen: boolean) => void` | - | Колбек отображения компонента. Срабатывает при изменении состояния open. |
 | widthStrategy | enum PopoverWidthStrategy: `"auto"`, `"gte"`, `"eq"` | auto | Стратегия управления шириной контейнера поповера <br> - `auto` - соответствует ширине контента, <br> - `gte` - Great Than or Equal, равен ширине таргета или больше ее, если контент в поповере шире, <br> - `eq` - Equal, строго равен ширине таргета. |
+| closeOnPopstate | `boolean` | - | Закрывать ли поповер при пекреходе по истории браузера |
 | trigger | enum Trigger: `"click"`, `"hover"`, `"focusVisible"`, `"focus"`, `"hoverAndFocusVisible"`, `"hoverAndFocus"`, `"clickAndFocusVisible"` | - | Условие отображения поповера: <br> - `click` - открывать по клику <br> - `hover` - открывать по ховеру <br> - `focusVisible` - открывать по focus-visible <br> - `focus` - открывать по фокусу <br> - `hoverAndFocusVisible` - открывать по ховеру и focus-visible <br> - `hoverAndFocus` - открывать по ховеру и фокусу <br> - `clickAndFocusVisible` - открывать по клику и focus-visible |
 | placement | enum Placement: `"left"`, `"left-start"`, `"left-end"`, `"right"`, `"right-start"`, `"right-end"`, `"top"`, `"top-start"`, `"top-end"`, `"bottom"`, `"bottom-start"`, `"bottom-end"` | top | Положение поповера относительно своего триггера (children). |
 | className | `string` | - | CSS-класс |

package/dist/cjs/components/Lists/Droplist/DropList.d.ts

@@ -1,2 +1,2 @@
 import { DroplistProps } from '../types';
-export declare function Droplist({ items: itemsProp, search, pinBottom: pinBottomProp, pinTop: pinTopProp, footerActiveElementsRefs, children, trigger, placement, widthStrategy, triggerElemRef: triggerElemRefProp, open: openProp, onOpenChange, collapse, triggerClassName, selection, contentRender, size, marker, closeDroplistOnItemClick, className, listRef: listRefProp, untouchableScrollbars, virtualized, ...props }: DroplistProps): import("react/jsx-runtime").JSX.Element;
+export declare function Droplist({ items: itemsProp, search, pinBottom: pinBottomProp, pinTop: pinTopProp, footerActiveElementsRefs, children, trigger, placement, widthStrategy, triggerElemRef: triggerElemRefProp, open: openProp, onOpenChange, collapse, triggerClassName, selection, contentRender, size, marker, closeDroplistOnItemClick, className, listRef: listRefProp, untouchableScrollbars, virtualized, closeOnPopstate, ...props }: DroplistProps): import("react/jsx-runtime").JSX.Element;

package/dist/cjs/components/Lists/Droplist/DropList.js

@@ -54,9 +54,10 @@ function Droplist(_a) {
       className,
       listRef: listRefProp,
       untouchableScrollbars = false,
-      virtualized = false
+      virtualized = false,
+      closeOnPopstate
     } = _a,
-    props = __rest(_a, ["items", "search", "pinBottom", "pinTop", "footerActiveElementsRefs", "children", "trigger", "placement", "widthStrategy", "triggerElemRef", "open", "onOpenChange", "collapse", "triggerClassName", "selection", "contentRender", "size", "marker", "closeDroplistOnItemClick", "className", "listRef", "untouchableScrollbars", "virtualized"]);
+    props = __rest(_a, ["items", "search", "pinBottom", "pinTop", "footerActiveElementsRefs", "children", "trigger", "placement", "widthStrategy", "triggerElemRef", "open", "onOpenChange", "collapse", "triggerClassName", "selection", "contentRender", "size", "marker", "closeDroplistOnItemClick", "className", "listRef", "untouchableScrollbars", "virtualized", "closeOnPopstate"]);
   const hasSearch = (0, react_1.useMemo)(() => Boolean(search), [search]);
   const [openCollapseItems = [], setOpenCollapsedItems] = (0, utils_1.useValueControl)(collapse);
   const toggleOpenCollapseItem = (0, react_1.useCallback)(id => setOpenCollapsedItems(items => (items === null || items === void 0 ? void 0 : items.includes(id)) ? items.filter(item => item !== id) : (items !== null && items !== void 0 ? items : []).concat([id])), [setOpenCollapsedItems]);
@@ -262,6 +263,7 @@ function Droplist(_a) {
               triggerRef: !triggerElemRefProp ? triggerElemRef : isValid && triggerElemRefProp || undefined,
               open: open,
               onOpenChange: handleOpenChange,
+              closeOnPopstate: closeOnPopstate,
               children: triggerElem
             })
           })

package/dist/cjs/components/Lists/ListPrivate/ListPrivate.js

@@ -245,7 +245,7 @@ exports.ListPrivate = (0, react_1.forwardRef)((_a, ref) => {
         [styles_module_scss_1.default.scrollContainerL]: scroll && limitedScrollHeight && size === 'l'
       }, scrollContainerClassName),
       barHideStrategy: barHideStrategy,
-      size: size === 's' ? 's' : 'm',
+      size: 's',
       ref: (0, merge_refs_1.default)(innerScrollRef, scrollContainerRef),
       untouchableScrollbars: untouchableScrollbars,
       onScroll: onScroll,

package/dist/esm/components/Lists/Droplist/DropList.d.ts

@@ -1,2 +1,2 @@
 import { DroplistProps } from '../types';
-export declare function Droplist({ items: itemsProp, search, pinBottom: pinBottomProp, pinTop: pinTopProp, footerActiveElementsRefs, children, trigger, placement, widthStrategy, triggerElemRef: triggerElemRefProp, open: openProp, onOpenChange, collapse, triggerClassName, selection, contentRender, size, marker, closeDroplistOnItemClick, className, listRef: listRefProp, untouchableScrollbars, virtualized, ...props }: DroplistProps): import("react/jsx-runtime").JSX.Element;
+export declare function Droplist({ items: itemsProp, search, pinBottom: pinBottomProp, pinTop: pinTopProp, footerActiveElementsRefs, children, trigger, placement, widthStrategy, triggerElemRef: triggerElemRefProp, open: openProp, onOpenChange, collapse, triggerClassName, selection, contentRender, size, marker, closeDroplistOnItemClick, className, listRef: listRefProp, untouchableScrollbars, virtualized, closeOnPopstate, ...props }: DroplistProps): import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/Lists/Droplist/DropList.js

@@ -23,7 +23,7 @@ import { ListPrivate } from '../ListPrivate';
 import styles from '../styles.module.css';
 const DEFAULT_FALLBACK_PLACEMENTS = ['top', 'right', 'bottom', 'left'];
 export function Droplist(_a) {
-    var { items: itemsProp, search, pinBottom: pinBottomProp = [], pinTop: pinTopProp = [], footerActiveElementsRefs, children, trigger, placement, widthStrategy, triggerElemRef: triggerElemRefProp, open: openProp, onOpenChange, collapse = {}, triggerClassName, selection, contentRender, size = 's', marker = true, closeDroplistOnItemClick = false, className, listRef: listRefProp, untouchableScrollbars = false, virtualized = false } = _a, props = __rest(_a, ["items", "search", "pinBottom", "pinTop", "footerActiveElementsRefs", "children", "trigger", "placement", "widthStrategy", "triggerElemRef", "open", "onOpenChange", "collapse", "triggerClassName", "selection", "contentRender", "size", "marker", "closeDroplistOnItemClick", "className", "listRef", "untouchableScrollbars", "virtualized"]);
+    var { items: itemsProp, search, pinBottom: pinBottomProp = [], pinTop: pinTopProp = [], footerActiveElementsRefs, children, trigger, placement, widthStrategy, triggerElemRef: triggerElemRefProp, open: openProp, onOpenChange, collapse = {}, triggerClassName, selection, contentRender, size = 's', marker = true, closeDroplistOnItemClick = false, className, listRef: listRefProp, untouchableScrollbars = false, virtualized = false, closeOnPopstate } = _a, props = __rest(_a, ["items", "search", "pinBottom", "pinTop", "footerActiveElementsRefs", "children", "trigger", "placement", "widthStrategy", "triggerElemRef", "open", "onOpenChange", "collapse", "triggerClassName", "selection", "contentRender", "size", "marker", "closeDroplistOnItemClick", "className", "listRef", "untouchableScrollbars", "virtualized", "closeOnPopstate"]);
     const hasSearch = useMemo(() => Boolean(search), [search]);
     const [openCollapseItems = [], setOpenCollapsedItems] = useValueControl(collapse);
     const toggleOpenCollapseItem = useCallback((id) => setOpenCollapsedItems((items) => (items === null || items === void 0 ? void 0 : items.includes(id)) ? items.filter(item => item !== id) : (items !== null && items !== void 0 ? items : []).concat([id])), [setOpenCollapsedItems]);
@@ -146,5 +146,5 @@ export function Droplist(_a) {
                         }, children: _jsx(Dropdown, { content: _jsx("div", { className: cn(styles.wrapper, className), children: _jsx(ListPrivate, Object.assign({}, props, { items: memorizedItems.items.focusCloseChildIds, pinTop: memorizedItems.pinTop.focusCloseChildIds, pinBottom: memorizedItems.pinBottom.focusCloseChildIds, virtualized: virtualized, onKeyDown: handleListKeyDown, searchItem: searchItem, tabIndex: 0, ref: mergeRefs(listRef, listRefProp), search: search, onFocus: e => {
                                         e.stopPropagation();
                                         forceUpdateActiveItemId === null || forceUpdateActiveItemId === void 0 ? void 0 : forceUpdateActiveItemId(ids[0]);
-                                    }, limitedScrollHeight: true, untouchableScrollbars: untouchableScrollbars })) }), outsideClick: true, triggerClassName: triggerClassName, fallbackPlacements: DEFAULT_FALLBACK_PLACEMENTS, trigger: trigger, placement: placement, widthStrategy: widthStrategy, triggerRef: !triggerElemRefProp ? triggerElemRef : (isValid && triggerElemRefProp) || undefined, open: open, onOpenChange: handleOpenChange, children: triggerElem }) }) }) }) })) }));
+                                    }, limitedScrollHeight: true, untouchableScrollbars: untouchableScrollbars })) }), outsideClick: true, triggerClassName: triggerClassName, fallbackPlacements: DEFAULT_FALLBACK_PLACEMENTS, trigger: trigger, placement: placement, widthStrategy: widthStrategy, triggerRef: !triggerElemRefProp ? triggerElemRef : (isValid && triggerElemRefProp) || undefined, open: open, onOpenChange: handleOpenChange, closeOnPopstate: closeOnPopstate, children: triggerElem }) }) }) }) })) }));
 }

package/dist/esm/components/Lists/ListPrivate/ListPrivate.js

@@ -139,7 +139,7 @@ export const ListPrivate = forwardRef((_a, ref) => {
                     [commonStyles.scrollContainerS]: scroll && limitedScrollHeight && size === 's',
                     [commonStyles.scrollContainerM]: scroll && limitedScrollHeight && size === 'm',
                     [commonStyles.scrollContainerL]: scroll && limitedScrollHeight && size === 'l',
-                }, scrollContainerClassName), barHideStrategy: barHideStrategy, size: size === 's' ? 's' : 'm', ref: mergeRefs(innerScrollRef, scrollContainerRef), untouchableScrollbars: untouchableScrollbars, onScroll: onScroll, onInitialized: onScrollInitialized, children: [content, _jsx("div", { className: styles.scrollStub, ref: scrollRef })] })) : (_jsx(_Fragment, { children: content })), Number(pinBottom === null || pinBottom === void 0 ? void 0 : pinBottom.length) > 0 && _jsx(PinBottomGroupItem, { children: itemsPinBottomJSX }), footer && (_jsx("div", { className: styles.footer, onFocus: stopPropagation, children: footer }))] })));
+                }, scrollContainerClassName), barHideStrategy: barHideStrategy, size: 's', ref: mergeRefs(innerScrollRef, scrollContainerRef), untouchableScrollbars: untouchableScrollbars, onScroll: onScroll, onInitialized: onScrollInitialized, children: [content, _jsx("div", { className: styles.scrollStub, ref: scrollRef })] })) : (_jsx(_Fragment, { children: content })), Number(pinBottom === null || pinBottom === void 0 ? void 0 : pinBottom.length) > 0 && _jsx(PinBottomGroupItem, { children: itemsPinBottomJSX }), footer && (_jsx("div", { className: styles.footer, onFocus: stopPropagation, children: footer }))] })));
     if (!nested) {
         return listJSX;
     }

package/package.json

@@ -4,7 +4,7 @@
     "access": "public"
   },
   "title": "List",
-  "version": "0.31.0",
+  "version": "0.31.2",
   "sideEffects": [
     "*.css",
     "*.woff",
@@ -54,5 +54,5 @@
   "peerDependencies": {
     "@snack-uikit/locale": "*"
   },
-  "gitHead": "9e08a5c61a90e739f44ba128242a95d866452dc0"
+  "gitHead": "e25c748c1a490abfd80ba40b9ef26c077080af29"
 }

package/src/components/Lists/Droplist/DropList.tsx

@@ -45,6 +45,7 @@ export function Droplist({
   listRef: listRefProp,
   untouchableScrollbars = false,
   virtualized = false,
+  closeOnPopstate,
   ...props
 }: DroplistProps) {
   const hasSearch = useMemo(() => Boolean(search), [search]);
@@ -267,6 +268,7 @@ export function Droplist({
                 triggerRef={!triggerElemRefProp ? triggerElemRef : (isValid && triggerElemRefProp) || undefined}
                 open={open}
                 onOpenChange={handleOpenChange}
+                closeOnPopstate={closeOnPopstate}
               >
                 {triggerElem}
               </Dropdown>

package/src/components/Lists/ListPrivate/ListPrivate.tsx

@@ -277,7 +277,7 @@ export const ListPrivate = forwardRef(
               scrollContainerClassName,
             )}
             barHideStrategy={barHideStrategy}
-            size={size === 's' ? 's' : 'm'}
+            size={ 's' }
             ref={mergeRefs(innerScrollRef, scrollContainerRef)}
             untouchableScrollbars={untouchableScrollbars}
             onScroll={onScroll}