@cloud-ru/ds-list 2.0.4-preview-9005559b.0 → 2.0.4-preview-5926424e.0

package/README.md

@@ -900,6 +900,7 @@ export function DroplistWithHeader() {
 | `selection` | `SelectionMultipleState` \| `SelectionSingleState` | — | Настройки выбора элементов. `mode: 'single'` — один выбранный элемент (`value: ItemId`), <br/> `mode: 'multiple'` — множественный выбор (`value: ItemId[]`). Без `selection` выбора нет — <br/> клик вызывает только `onClick` элемента. |
 | `size` | `"l"` \| `"m"` \| `"s"` | — | Размер списка |
 | `slotAfterTitle` | `ReactNode` | — | Только mobile (`BottomSheet`): slot справа от заголовка. |
+| `snapPoints` | `SnapPoint` | — | Массив фиксированных позиций sheet'а от меньшей к большей. По дефолту `undefined` — <br/> sheet `height: auto` с одним snap'ом по высоте контента. <br/> Пример: `[0.5, 1]` — sheet открывается на половину экрана, drag вверх раскрывает <br/> до full-viewport; drag вниз ниже `0.5` ведёт к закрытию. <br/> Контракт массива (движок не сортирует и не дедуплицирует — порядок и различимость на <br/> стороне потребителя): <br/> - строго по возрастанию: индекс `0` — самая компактная позиция, последний — top / expanded; <br/> - значения должны резолвиться в различные высоты (`['50%', 0.5]` на типичном вьюпорте дадут <br/> одну высоту → дубль-индекс будет недостижим свайпом); <br/> - `'fit-content'` имеет смысл только как ЕДИНСТВЕННЫЙ snap (без `snapPoints`); внутри массива <br/> фиксированных позиций его «контентная» высота не определена. |
 | `trigger` | `"click"` \| `"clickAndFocusVisible"` \| `"focus"` \| `"focusVisible"` \| `"hover"` \| `"hoverAndFocus"` \| `"hoverAndFocusVisible"` | — | Условие отображения поповера: <br/> - `click` - открывать по клику <br/> - `hover` - открывать по ховеру <br/> - `focusVisible` - открывать по focus-visible <br/> - `focus` - открывать по фокусу <br/> - `hoverAndFocusVisible` - открывать по ховеру и focus-visible <br/> - `hoverAndFocus` - открывать по ховеру и фокусу <br/> - `clickAndFocusVisible` - открывать по клику и focus-visible |
 | `triggerClassName` | `string` | — | CSS-класс триггера |
 | `triggerElemRef` | `RefObject<HTMLElement>` | — | Ссылка на элемент-триггер для дроплиста |
@@ -962,8 +963,6 @@ export function DroplistWithHeader() {
 
 - `Item` = `BaseItem | GroupItem | GroupSelectItem | NextListItem | AccordionItem`
 
-- `ItemId` = `string | number`
-
 **ScrollProps**
 
 | Prop | Type | Default | Description |

package/dist/cjs/components/Lists/types.d.ts

@@ -1,4 +1,5 @@
 import { DragEndEvent } from '@dnd-kit/core';
+import { BottomSheetProps } from '@cloud-ru/ds-bottom-sheet';
 import { DropdownProps } from '@cloud-ru/ds-dropdown';
 import { WithSupportProps } from '@cloud-ru/ds-utils';
 import { FocusEvent, KeyboardEvent, ReactNode, RefObject } from 'react';
@@ -161,7 +162,7 @@ type DroplistMobileSlots = {
  * (список size `l` в `BottomSheet`), иначе — `DesktopDroplist` (анкорный popover). Mobile-слоты
  * применяются только на mobile.
  */
-export type DroplistProps = BaseDroplistProps & DroplistMobileSlots;
+export type DroplistProps = BaseDroplistProps & DroplistMobileSlots & Pick<BottomSheetProps, 'snapPoints'>;
 /**
  * Props адаптивного `ReorderableDroplist`: props `ReorderableList` + popover/mobile-обвязка
  * `Droplist`. Отдельный компонент по той же причине, что и `ReorderableList`.
@@ -173,7 +174,7 @@ export type DroplistImplProps = DesktopDroplistProps & DroplistMobileSlots;
  * @internal Props mobile-реализации (`BottomSheet`): реализация дроплиста без popover-пропов
  * + mobile-слоты.
  */
-export type MobileDroplistProps = Omit<DesktopDroplistProps, 'trigger' | 'placement' | 'widthStrategy' | 'triggerElemRef' | 'listRef' | 'triggerClassName'> & DroplistMobileSlots;
+export type MobileDroplistProps = Omit<DesktopDroplistProps, 'trigger' | 'placement' | 'widthStrategy' | 'triggerElemRef' | 'listRef' | 'triggerClassName'> & Pick<BottomSheetProps, 'snapPoints'> & DroplistMobileSlots;
 export type ListPrivateProps = Omit<ListImplProps, 'pinTop' | 'pinBottom' | 'items' | 'hasListInFocusChain' | 'onItemsReorder' | 'virtualized'> & {
     nested?: boolean;
     active?: boolean;

package/dist/cjs/helperComponents/MobileDroplist/MobileDroplist.d.ts

@@ -6,4 +6,4 @@ import { MobileDroplistProps } from '../../components/Lists/types';
  * вложенного списка, в шапке появляется его заголовок и кнопка «назад». Internal — наружу не реэкспортится;
  * рендерится адаптивным `Droplist` на `layoutType='mobile'`.
  */
-export declare function MobileDroplist({ items, selection, open: openProp, onOpenChange, children, search, label, actionButton, slotAfterTitle, onBackButtonClick, virtualized, closeDroplistOnItemClick, scroll, container, closeOnPopstate, size, footer, onItemsReorder, ...rest }: MobileDroplistProps): import("react/jsx-runtime").JSX.Element;
+export declare function MobileDroplist({ items, selection, open: openProp, onOpenChange, children, search, label, actionButton, slotAfterTitle, onBackButtonClick, virtualized, closeDroplistOnItemClick, scroll, container, closeOnPopstate, size, snapPoints, footer, onItemsReorder, ...rest }: MobileDroplistProps): import("react/jsx-runtime").JSX.Element;

package/dist/cjs/helperComponents/MobileDroplist/MobileDroplist.js

@@ -20,7 +20,7 @@ const utils_2 = require("./utils");
  * вложенного списка, в шапке появляется его заголовок и кнопка «назад». Internal — наружу не реэкспортится;
  * рендерится адаптивным `Droplist` на `layoutType='mobile'`.
  */
-function MobileDroplist({ items, selection, open: openProp, onOpenChange, children, search, label, actionButton, slotAfterTitle, onBackButtonClick, virtualized, closeDroplistOnItemClick, scroll, container, closeOnPopstate, size, 
+function MobileDroplist({ items, selection, open: openProp, onOpenChange, children, search, label, actionButton, slotAfterTitle, onBackButtonClick, virtualized, closeDroplistOnItemClick, scroll, container, closeOnPopstate, size, snapPoints, 
 // `footer` уводим в sticky-футер `BottomSheet` (кнопки действия прилипают к низу sheet'а, а не
 // скроллятся вместе со списком). `header` + `headerDivider` / `footerDivider` НЕ деструктурируем —
 // они уходят в `...rest` на корневой `List` (он рендерит шапку и её divider).
@@ -143,6 +143,6 @@ footer, onItemsReorder, ...rest }) {
                     container: container?.current ?? containerRef, open: isRoot ? open : true, 
                     // Dismiss (backdrop / swipe / Esc): на корне — закрыть весь droplist; глубже — вернуться на уровень вверх,
                     // как ждёт пользователь на mobile (а не закрывать всю цепочку разом).
-                    onClose: isRoot ? handleClose : popLevel, withDividers: true, title: title, onBackButtonClick: handleBack, actionButton: isRoot ? actionButton : undefined, slotAfterTitle: isRoot ? slotAfterTitle : undefined, content: content, footer: isRoot ? footer : undefined, snapPoints: expanded ? [1] : undefined, closeOnPopstate: closeOnPopstate ?? true }, isRoot ? 'root' : String(item?.id ?? levelIndex)));
+                    onClose: isRoot ? handleClose : popLevel, withDividers: true, title: title, onBackButtonClick: handleBack, actionButton: isRoot ? actionButton : undefined, slotAfterTitle: isRoot ? slotAfterTitle : undefined, content: content, footer: isRoot ? footer : undefined, snapPoints: expanded ? [1] : snapPoints, closeOnPopstate: closeOnPopstate ?? true }, isRoot ? 'root' : String(item?.id ?? levelIndex)));
             })] }));
 }

package/dist/esm/components/Lists/types.d.ts

@@ -1,4 +1,5 @@
 import { DragEndEvent } from '@dnd-kit/core';
+import { BottomSheetProps } from '@cloud-ru/ds-bottom-sheet';
 import { DropdownProps } from '@cloud-ru/ds-dropdown';
 import { WithSupportProps } from '@cloud-ru/ds-utils';
 import { FocusEvent, KeyboardEvent, ReactNode, RefObject } from 'react';
@@ -161,7 +162,7 @@ type DroplistMobileSlots = {
  * (список size `l` в `BottomSheet`), иначе — `DesktopDroplist` (анкорный popover). Mobile-слоты
  * применяются только на mobile.
  */
-export type DroplistProps = BaseDroplistProps & DroplistMobileSlots;
+export type DroplistProps = BaseDroplistProps & DroplistMobileSlots & Pick<BottomSheetProps, 'snapPoints'>;
 /**
  * Props адаптивного `ReorderableDroplist`: props `ReorderableList` + popover/mobile-обвязка
  * `Droplist`. Отдельный компонент по той же причине, что и `ReorderableList`.
@@ -173,7 +174,7 @@ export type DroplistImplProps = DesktopDroplistProps & DroplistMobileSlots;
  * @internal Props mobile-реализации (`BottomSheet`): реализация дроплиста без popover-пропов
  * + mobile-слоты.
  */
-export type MobileDroplistProps = Omit<DesktopDroplistProps, 'trigger' | 'placement' | 'widthStrategy' | 'triggerElemRef' | 'listRef' | 'triggerClassName'> & DroplistMobileSlots;
+export type MobileDroplistProps = Omit<DesktopDroplistProps, 'trigger' | 'placement' | 'widthStrategy' | 'triggerElemRef' | 'listRef' | 'triggerClassName'> & Pick<BottomSheetProps, 'snapPoints'> & DroplistMobileSlots;
 export type ListPrivateProps = Omit<ListImplProps, 'pinTop' | 'pinBottom' | 'items' | 'hasListInFocusChain' | 'onItemsReorder' | 'virtualized'> & {
     nested?: boolean;
     active?: boolean;

package/dist/esm/helperComponents/MobileDroplist/MobileDroplist.d.ts

@@ -6,4 +6,4 @@ import { MobileDroplistProps } from '../../components/Lists/types.js';
  * вложенного списка, в шапке появляется его заголовок и кнопка «назад». Internal — наружу не реэкспортится;
  * рендерится адаптивным `Droplist` на `layoutType='mobile'`.
  */
-export declare function MobileDroplist({ items, selection, open: openProp, onOpenChange, children, search, label, actionButton, slotAfterTitle, onBackButtonClick, virtualized, closeDroplistOnItemClick, scroll, container, closeOnPopstate, size, footer, onItemsReorder, ...rest }: MobileDroplistProps): import("react/jsx-runtime").JSX.Element;
+export declare function MobileDroplist({ items, selection, open: openProp, onOpenChange, children, search, label, actionButton, slotAfterTitle, onBackButtonClick, virtualized, closeDroplistOnItemClick, scroll, container, closeOnPopstate, size, snapPoints, footer, onItemsReorder, ...rest }: MobileDroplistProps): import("react/jsx-runtime").JSX.Element;

package/dist/esm/helperComponents/MobileDroplist/MobileDroplist.js

@@ -14,7 +14,7 @@ import { buildLevelItems, nextListOption, resolveItemByPath } from './utils.js';
  * вложенного списка, в шапке появляется его заголовок и кнопка «назад». Internal — наружу не реэкспортится;
  * рендерится адаптивным `Droplist` на `layoutType='mobile'`.
  */
-export function MobileDroplist({ items, selection, open: openProp, onOpenChange, children, search, label, actionButton, slotAfterTitle, onBackButtonClick, virtualized, closeDroplistOnItemClick, scroll, container, closeOnPopstate, size, 
+export function MobileDroplist({ items, selection, open: openProp, onOpenChange, children, search, label, actionButton, slotAfterTitle, onBackButtonClick, virtualized, closeDroplistOnItemClick, scroll, container, closeOnPopstate, size, snapPoints, 
 // `footer` уводим в sticky-футер `BottomSheet` (кнопки действия прилипают к низу sheet'а, а не
 // скроллятся вместе со списком). `header` + `headerDivider` / `footerDivider` НЕ деструктурируем —
 // они уходят в `...rest` на корневой `List` (он рендерит шапку и её divider).
@@ -137,6 +137,6 @@ footer, onItemsReorder, ...rest }) {
                     container: container?.current ?? containerRef, open: isRoot ? open : true, 
                     // Dismiss (backdrop / swipe / Esc): на корне — закрыть весь droplist; глубже — вернуться на уровень вверх,
                     // как ждёт пользователь на mobile (а не закрывать всю цепочку разом).
-                    onClose: isRoot ? handleClose : popLevel, withDividers: true, title: title, onBackButtonClick: handleBack, actionButton: isRoot ? actionButton : undefined, slotAfterTitle: isRoot ? slotAfterTitle : undefined, content: content, footer: isRoot ? footer : undefined, snapPoints: expanded ? [1] : undefined, closeOnPopstate: closeOnPopstate ?? true }, isRoot ? 'root' : String(item?.id ?? levelIndex)));
+                    onClose: isRoot ? handleClose : popLevel, withDividers: true, title: title, onBackButtonClick: handleBack, actionButton: isRoot ? actionButton : undefined, slotAfterTitle: isRoot ? slotAfterTitle : undefined, content: content, footer: isRoot ? footer : undefined, snapPoints: expanded ? [1] : snapPoints, closeOnPopstate: closeOnPopstate ?? true }, isRoot ? 'root' : String(item?.id ?? levelIndex)));
             })] }));
 }