@cloud-ru/ds-list 1.0.0

package/dist/cjs/components/Items/NextListItem/NextListItem.js

@@ -0,0 +1,71 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.NextListItem = NextListItem;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const dropdown_1 = require("@cloud-ru/ds-dropdown");
+const system_1 = require("@cloud-ru/ds-icons/interface/system");
+const react_1 = require("react");
+const constants_1 = require("../../../constants");
+const contexts_1 = require("../../Lists/contexts");
+const ListPrivate_1 = require("../../Lists/ListPrivate");
+const BaseItem_1 = require("../BaseItem");
+const hooks_1 = require("../hooks");
+const utils_1 = require("../utils");
+const constants_2 = require("./constants");
+function NextListItem({ items, placement = 'right-start', id, scroll, scrollRef, disabled, onSublistOpenChanged, allChildIds, loading = false, dataError = false, dataFiltered = false, focusId = id, untouchableScrollbars = false, ...option }) {
+    const { flattenItems, focusFlattenItems, virtualized } = (0, contexts_1.useNewListContext)();
+    const { value, isSelectionSingle, isSelectionMultiple } = (0, contexts_1.useSelectionContext)();
+    const { openCollapseItems = [] } = (0, contexts_1.useCollapseContext)();
+    const item = flattenItems[id];
+    const { ids, expandedIds } = (0, react_1.useMemo)(() => {
+        const { ids, expandedIds } = (0, utils_1.extractActiveItems)({
+            focusCloseChildIds: items,
+            focusFlattenItems,
+            openCollapseItems,
+            isSelectionMultiple,
+        });
+        return { ids, expandedIds: expandedIds.concat([id]) };
+    }, [focusFlattenItems, id, isSelectionMultiple, items, openCollapseItems]);
+    const { handleListKeyDownFactory, activeItemId, forceUpdateActiveItemId } = (0, contexts_1.useFocusListContext)();
+    const [open, setOpen] = (0, react_1.useState)();
+    const handleListKeyDown = (0, react_1.useCallback)((e) => {
+        handleListKeyDownFactory(ids, expandedIds)(e);
+        if (e.key === 'ArrowLeft') {
+            forceUpdateActiveItemId?.(focusId);
+            setOpen(false);
+            e.stopPropagation();
+            return;
+        }
+    }, [handleListKeyDownFactory, ids, expandedIds, forceUpdateActiveItemId, focusId]);
+    const { indeterminate, checked: checkedProp, handleOnSelect, } = (0, hooks_1.useGroupItemSelection)({
+        items: (0, utils_1.isNextListItem)(item) ? item.items : [],
+        id,
+        disabled,
+        allChildIds,
+    });
+    const handleOutsideClick = (0, react_1.useCallback)(() => {
+        forceUpdateActiveItemId?.(constants_1.ITEM_PREFIXES.dropFocus);
+        setOpen(false);
+        return true;
+    }, [forceUpdateActiveItemId]);
+    const isOpen = (0, react_1.useMemo)(() => Boolean(!disabled && activeItemId && focusFlattenItems[focusId]?.allChildIds.includes(activeItemId)), [activeItemId, disabled, focusFlattenItems, focusId]);
+    const checked = Boolean((indeterminate && !open && isSelectionSingle && value && allChildIds.includes(value)) ||
+        (isSelectionMultiple && checkedProp));
+    (0, react_1.useEffect)(() => {
+        setOpen(open => open && isOpen);
+    }, [isOpen]);
+    const listRef = (0, react_1.useRef)(null);
+    const openSublist = (0, react_1.useCallback)(() => {
+        setOpen(true);
+        setTimeout(() => {
+            listRef.current?.focus();
+        }, 0);
+    }, []);
+    return ((0, jsx_runtime_1.jsx)(dropdown_1.Dropdown, { outsideClick: handleOutsideClick, fallbackPlacements: constants_2.FALLBACK_PLACEMENTS, bodyPadding: false, content: (0, jsx_runtime_1.jsx)(ListPrivate_1.ListPrivate, { onKeyDown: handleListKeyDown, items: items, nested: true, scroll: scroll, virtualized: virtualized, tabIndex: 0, ref: listRef, onFocus: e => {
+                e.stopPropagation();
+                forceUpdateActiveItemId?.(ids[0]);
+            }, scrollRef: scrollRef, limitedScrollHeight: true, untouchableScrollbars: untouchableScrollbars, loading: loading, dataError: dataError, dataFiltered: dataFiltered }), trigger: 'hover', open: isOpen || open, onOpenChange: value => {
+            setOpen(value);
+            onSublistOpenChanged?.(value, id);
+        }, placement: placement, widthStrategy: 'auto', children: (0, jsx_runtime_1.jsx)(BaseItem_1.BaseItem, { ...option, disabled: disabled, open: isOpen || open, expandIcon: (0, jsx_runtime_1.jsx)(system_1.ChevronRightSVG, {}), id: id, isParentNode: true, indeterminate: indeterminate, checked: checked, onOpenNestedList: openSublist, onExpandIconClick: openSublist, onSelect: handleOnSelect }) }));
+}

package/dist/cjs/components/Items/NextListItem/constants.d.ts

@@ -0,0 +1,2 @@
+import { DropdownProps } from '@cloud-ru/ds-dropdown';
+export declare const FALLBACK_PLACEMENTS: DropdownProps['fallbackPlacements'];

package/dist/cjs/components/Items/NextListItem/constants.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FALLBACK_PLACEMENTS = void 0;
+exports.FALLBACK_PLACEMENTS = [
+    'right',
+    'right-start',
+    'right-end',
+    'left',
+    'left-start',
+    'left-end',
+    'bottom',
+    'top',
+];

package/dist/cjs/components/Items/NextListItem/index.d.ts

@@ -0,0 +1 @@
+export * from './NextListItem';

package/dist/cjs/components/Items/NextListItem/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./NextListItem"), exports);

package/dist/cjs/components/Items/NextListItem/types.d.ts

@@ -0,0 +1,4 @@
+import { CommonFlattenProps, FlattenNextListItem, ItemId } from '../types';
+export type NextListItemProps = Omit<FlattenNextListItem, 'type'> & CommonFlattenProps & {
+    focusId?: ItemId;
+};

package/dist/cjs/components/Items/NextListItem/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/cjs/components/Items/PinGroupItem/PinGroupItem.d.ts

@@ -0,0 +1,7 @@
+import { ReactNode } from 'react';
+export declare function PinTopGroupItem({ children }: {
+    children: ReactNode;
+}): import("react/jsx-runtime").JSX.Element | null;
+export declare function PinBottomGroupItem({ children }: {
+    children: ReactNode;
+}): import("react/jsx-runtime").JSX.Element | null;

package/dist/cjs/components/Items/PinGroupItem/PinGroupItem.js

@@ -0,0 +1,27 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PinTopGroupItem = PinTopGroupItem;
+exports.PinBottomGroupItem = PinBottomGroupItem;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const divider_1 = require("@cloud-ru/ds-divider");
+const classnames_1 = __importDefault(require("classnames"));
+const constants_1 = require("../../../constants");
+const contexts_1 = require("../../Lists/contexts");
+const styles_module_scss_1 = __importDefault(require('./styles.module.css'));
+function PinTopGroupItem({ children }) {
+    const { size = 'm' } = (0, contexts_1.useNewListContext)();
+    if (!children) {
+        return null;
+    }
+    return ((0, jsx_runtime_1.jsxs)("div", { className: (0, classnames_1.default)(styles_module_scss_1.default.pinTopItem), "data-size": size, "data-test-id": constants_1.TEST_IDS.pinTopGroupItem, children: [(0, jsx_runtime_1.jsx)("div", { children: children }), (0, jsx_runtime_1.jsx)(divider_1.Divider, { variant: divider_1.VARIANT.Regular })] }));
+}
+function PinBottomGroupItem({ children }) {
+    const { size = 'm' } = (0, contexts_1.useNewListContext)();
+    if (!children) {
+        return null;
+    }
+    return ((0, jsx_runtime_1.jsxs)("div", { className: (0, classnames_1.default)(styles_module_scss_1.default.pinBottomItem), "data-size": size, "data-test-id": constants_1.TEST_IDS.pinBottomGroupItem, children: [(0, jsx_runtime_1.jsx)(divider_1.Divider, { variant: divider_1.VARIANT.Regular }), (0, jsx_runtime_1.jsx)("div", { children: children })] }));
+}

package/dist/cjs/components/Items/PinGroupItem/index.d.ts

@@ -0,0 +1 @@
+export * from './PinGroupItem';

package/dist/cjs/components/Items/PinGroupItem/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./PinGroupItem"), exports);

package/dist/cjs/components/Items/PinGroupItem/styles.module.css

@@ -0,0 +1,12 @@
+.pinTopItem,
+.pinBottomItem{
+  display:flex;
+  flex-direction:column;
+  border:none;
+}
+.pinTopItem li,
+.pinTopItem ul,
+.pinBottomItem li,
+.pinBottomItem ul{
+  list-style-type:none;
+}

package/dist/cjs/components/Items/SearchItem/SearchItem.d.ts

@@ -0,0 +1,17 @@
+import { FocusEvent, KeyboardEvent, RefObject } from 'react';
+import { SearchState } from '../../../types';
+export type SearchItemProps = {
+    search?: SearchState;
+    itemRef?: RefObject<HTMLElement>;
+    /**
+     * Доп. обработчик клавиш навигации по списку. Нужен, когда поле поиска вынесено
+     * из `<ul>` в шапку dropdown (topBar) и события клавиатуры больше не всплывают
+     * на `<ul>`-onKeyDown — DropList передаёт сюда `handleListKeyDown` (factory).
+     */
+    onNavKeyDown?(e: KeyboardEvent<HTMLElement>): void;
+    /** onFocus поля (синхронизация активного item, когда search вне `<ul>`). */
+    onFocus?(e: FocusEvent<HTMLInputElement>): void;
+    /** Рендер для шапки dropdown — без `.listItem`-обёртки. */
+    inTopBar?: boolean;
+};
+export declare function SearchItem({ search, itemRef, onNavKeyDown, onFocus, inTopBar }: SearchItemProps): import("react/jsx-runtime").JSX.Element | null;

package/dist/cjs/components/Items/SearchItem/SearchItem.js

@@ -0,0 +1,28 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SearchItem = SearchItem;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const search_private_1 = require("@cloud-ru/ds-search-private");
+const utils_1 = require("@cloud-ru/ds-utils");
+const constants_1 = require("../../../constants");
+const utils_2 = require("../../../utils");
+const contexts_1 = require("../../Lists/contexts");
+const styles_module_scss_1 = __importDefault(require('./styles.module.css'));
+function SearchItem({ search, itemRef, onNavKeyDown, onFocus, inTopBar }) {
+    // Размер поиска следует за размером айтемов списка (size из контекста), а не фиксирован 's'.
+    const { firstItemId, size = 'm' } = (0, contexts_1.useNewListContext)();
+    const handleKeyDown = (e) => {
+        // Поиск — текстовый input: гасим только Up/Down (навигация по списку), горизонтальные
+        // стрелки оставляем каретке.
+        (0, utils_1.preventScrollOnVerticalArrows)(e);
+        search?.onKeyDown?.(e);
+        onNavKeyDown?.(e);
+    };
+    if (!search) {
+        return null;
+    }
+    return ((0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.searchItem, "data-in-top-bar": inTopBar || undefined, "data-test-id": constants_1.TEST_IDS.searchItem, children: (0, jsx_runtime_1.jsx)(search_private_1.SearchPrivate, { size: size, tabIndex: constants_1.ITEM_PREFIXES.search === firstItemId ? 0 : -1, onKeyDown: handleKeyDown, onFocus: onFocus ?? utils_2.stopPropagation, ...search, ref: itemRef }) }));
+}

package/dist/cjs/components/Items/SearchItem/index.d.ts

@@ -0,0 +1 @@
+export * from './SearchItem';

package/dist/cjs/components/Items/SearchItem/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./SearchItem"), exports);

package/dist/cjs/components/Items/SearchItem/styles.module.css

@@ -0,0 +1,13 @@
+.searchItem{
+  display:flex;
+  align-items:center;
+  box-sizing:border-box;
+  width:100%;
+  min-height:var(--sn-field-anatomy-size-s-fieldContainer-minHeight, var(--sn-density-size-s, var(--sn-primitive-dimension-48, 48px)));
+  padding:var(--sn-field-anatomy-size-s-fieldContainer-paddingVertical, var(--sn-density-spacing-control-container-vertical-s, var(--sn-primitive-dimension-6, 6px))) var(--sn-field-anatomy-size-s-fieldContainer-paddingRight, var(--sn-density-spacing-control-container-horizontal-s, var(--sn-primitive-dimension-12, 12px))) var(--sn-field-anatomy-size-s-fieldContainer-paddingVertical, var(--sn-density-spacing-control-container-vertical-s, var(--sn-primitive-dimension-6, 6px))) var(--sn-field-anatomy-size-s-fieldContainer-paddingLeft, var(--sn-density-spacing-control-container-horizontal-s, var(--sn-primitive-dimension-12, 12px)));
+}
+.searchItem:focus-within, .searchItem:focus-visible{
+  max-width:100%;
+  outline:var(--sn-theme-color-available-complementary, #000000) solid var(--sn-primitive-strokeWeight-strokeSemiBold, 2px);
+  outline-offset:calc(0px - var(--sn-primitive-strokeWeight-strokeSemiBold, 2px));
+}

package/dist/cjs/components/Items/SimpleItem/components/DragHandle/DragHandle.d.ts

@@ -0,0 +1,7 @@
+import { ButtonHTMLAttributes } from 'react';
+/**
+ * Ручка drag&drop строки/заголовка reorder-режима: кнопка с иконкой, `aria-label` и `data-test-id`.
+ * Живой вариант получает sortable-пропы `@dnd-kit` (`attributes`/`listeners`, `onMouseDown`/`onClick`,
+ * `NO_DRAG_ATTRIBUTE`) через `...rest`; статичная копия для `DragOverlay` — `OverlayDragHandle`.
+ */
+export declare function DragHandle(props: ButtonHTMLAttributes<HTMLButtonElement>): import("react/jsx-runtime").JSX.Element;

package/dist/cjs/components/Items/SimpleItem/components/DragHandle/DragHandle.js

@@ -0,0 +1,20 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DragHandle = DragHandle;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const system_1 = require("@cloud-ru/ds-icons/interface/system");
+const constants_1 = require("../../../../../constants");
+const locale_1 = require("../../../../../locale");
+const styles_module_scss_1 = __importDefault(require('../../styles.module.css'));
+/**
+ * Ручка drag&drop строки/заголовка reorder-режима: кнопка с иконкой, `aria-label` и `data-test-id`.
+ * Живой вариант получает sortable-пропы `@dnd-kit` (`attributes`/`listeners`, `onMouseDown`/`onClick`,
+ * `NO_DRAG_ATTRIBUTE`) через `...rest`; статичная копия для `DragOverlay` — `OverlayDragHandle`.
+ */
+function DragHandle(props) {
+    const { t } = locale_1.listLocale.useTranslations();
+    return ((0, jsx_runtime_1.jsx)("button", { type: 'button', "aria-label": t('list.dragHandle'), "data-test-id": constants_1.TEST_IDS.dragHandle, className: styles_module_scss_1.default.dragHandle, ...props, children: (0, jsx_runtime_1.jsx)(system_1.DragDropSVG, {}) }));
+}

package/dist/cjs/components/Items/SimpleItem/components/DragHandle/index.d.ts

@@ -0,0 +1 @@
+export * from './DragHandle';

package/dist/cjs/components/Items/SimpleItem/components/DragHandle/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./DragHandle"), exports);

package/dist/cjs/components/Items/SimpleItem/components/OverlayDragHandle/OverlayDragHandle.d.ts

@@ -0,0 +1,2 @@
+/** Статичная ручка для копий строк/заголовков в `DragOverlay` (без sortable-обработчиков). */
+export declare function OverlayDragHandle(): import("react/jsx-runtime").JSX.Element;

package/dist/cjs/components/Items/SimpleItem/components/OverlayDragHandle/OverlayDragHandle.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.OverlayDragHandle = OverlayDragHandle;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const DragHandle_1 = require("../DragHandle");
+/** Статичная ручка для копий строк/заголовков в `DragOverlay` (без sortable-обработчиков). */
+function OverlayDragHandle() {
+    return (0, jsx_runtime_1.jsx)(DragHandle_1.DragHandle, { tabIndex: -1 });
+}

package/dist/cjs/components/Items/SimpleItem/components/OverlayDragHandle/index.d.ts

@@ -0,0 +1 @@
+export * from './OverlayDragHandle';

package/dist/cjs/components/Items/SimpleItem/components/OverlayDragHandle/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./OverlayDragHandle"), exports);

package/dist/cjs/components/Items/SimpleItem/components/SimpleGroupBlock/SimpleGroupBlock.d.ts

@@ -0,0 +1,19 @@
+import { ReactNode } from 'react';
+import { ItemId } from '../../../types';
+import { GroupHeaderContent } from '../../types';
+export type SimpleGroupBlockProps = GroupHeaderContent & {
+    /** Идентификатор группы — sortable identity для перестановки групп между собой. */
+    id: ItemId;
+    /** Id сортируемых строк группы для вложенного `SortableContext` (переупорядочивание строк внутри группы). */
+    rowIds: ItemId[];
+    /** Отрисованные строки группы (`SimpleItem`). */
+    children: ReactNode;
+};
+/**
+ * Сортируемый блок группы reorder-режима: заголовок с ручкой `@dnd-kit` + строки группы во
+ * вложенном `SortableContext`. Перетаскивается **вся группа целиком** (заголовок и строки едут
+ * вместе), потому что `useSortable` висит на контейнере блока. Строки при этом переставляются
+ * внутри своей группы (собственный `SortableContext`). Копию заголовка на время перетаскивания группы
+ * рендерит `SimpleGroupBlockOverlay` в `DragOverlay`.
+ */
+export declare function SimpleGroupBlock({ id, rowIds, children, ...separatorProps }: SimpleGroupBlockProps): import("react/jsx-runtime").JSX.Element;

package/dist/cjs/components/Items/SimpleItem/components/SimpleGroupBlock/SimpleGroupBlock.js

@@ -0,0 +1,52 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SimpleGroupBlock = SimpleGroupBlock;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const core_1 = require("@dnd-kit/core");
+const sortable_1 = require("@dnd-kit/sortable");
+const utilities_1 = require("@dnd-kit/utilities");
+const bottom_sheet_1 = require("@cloud-ru/ds-bottom-sheet");
+const helperComponents_1 = require("../../../../../helperComponents");
+const utils_1 = require("../../../../../utils");
+const contexts_1 = require("../../../../Lists/contexts");
+const constants_1 = require("../../constants");
+const styles_module_scss_1 = __importDefault(require('../../styles.module.css'));
+const utils_2 = require("../../utils");
+const DragHandle_1 = require("../DragHandle");
+/**
+ * Сортируемый блок группы reorder-режима: заголовок с ручкой `@dnd-kit` + строки группы во
+ * вложенном `SortableContext`. Перетаскивается **вся группа целиком** (заголовок и строки едут
+ * вместе), потому что `useSortable` висит на контейнере блока. Строки при этом переставляются
+ * внутри своей группы (собственный `SortableContext`). Копию заголовка на время перетаскивания группы
+ * рендерит `SimpleGroupBlockOverlay` в `DragOverlay`.
+ */
+function SimpleGroupBlock({ id, rowIds, children, ...separatorProps }) {
+    const { size = 'm' } = (0, contexts_1.useNewListContext)();
+    const { attributes, listeners, setNodeRef, transform, transition, isDragging } = (0, sortable_1.useSortable)({
+        id,
+        // Группа — «брат» строк верхнего уровня: тот же контейнер, что и у строк без группы.
+        data: { container: constants_1.REORDER_TOP_LEVEL },
+        animateLayoutChanges: utils_2.animateLayoutChanges,
+    });
+    // Идёт ли переупорядочивание строки этой группы (а не самой группы). Оно жёстко ограничено
+    // своим контейнером (`container === id` в `data` строки, см. `SimpleItem`), поэтому границы
+    // блока группы подсвечиваются — видно, что строка не выходит за пределы группы, а не «сломалась».
+    const { active } = (0, core_1.useDndContext)();
+    const activeContainer = active?.data.current?.container;
+    const isReorderingWithinGroup = active != null && active.id !== id && activeContainer === id;
+    const style = {
+        transform: utilities_1.CSS.Translate.toString(transform),
+        transition,
+    };
+    const { onMouseDown, ...restListeners } = listeners || {};
+    const handleMouseDown = (e) => {
+        (0, utils_1.stopPropagation)(e);
+        onMouseDown?.(e);
+    };
+    return ((0, jsx_runtime_1.jsxs)("div", { ref: setNodeRef, style: style, className: styles_module_scss_1.default.groupBlock, "data-dragging": isDragging || undefined, "data-reorder-boundary": isReorderingWithinGroup || undefined, children: [(0, jsx_runtime_1.jsxs)("div", { className: styles_module_scss_1.default.groupHeader, "data-size": size, children: [(0, jsx_runtime_1.jsx)(DragHandle_1.DragHandle
+                    // Pointer-жест не доходит до BottomSheet: иначе vertical drag одновременно закрывает sheet.
+                    , { [bottom_sheet_1.NO_DRAG_ATTRIBUTE]: '', ...attributes, ...restListeners, onMouseDown: handleMouseDown, onClick: utils_1.stopPropagation }), (0, jsx_runtime_1.jsx)(helperComponents_1.Separator, { ...separatorProps })] }), (0, jsx_runtime_1.jsx)(sortable_1.SortableContext, { items: rowIds, strategy: sortable_1.verticalListSortingStrategy, children: children })] }));
+}

package/dist/cjs/components/Items/SimpleItem/components/SimpleGroupBlock/index.d.ts

@@ -0,0 +1 @@
+export * from './SimpleGroupBlock';

package/dist/cjs/components/Items/SimpleItem/components/SimpleGroupBlock/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./SimpleGroupBlock"), exports);

package/dist/cjs/components/Items/SimpleItem/components/SimpleGroupBlockOverlay/SimpleGroupBlockOverlay.d.ts

@@ -0,0 +1,15 @@
+import { Size } from '../../../../../types';
+import { FlattenSimpleItem } from '../../../types';
+import { GroupHeaderContent } from '../../types';
+export type SimpleGroupBlockOverlayProps = GroupHeaderContent & {
+    /** Размер списка — заголовок повторяет левую раскладку строки (`padding-left` + ручка + `gap`). */
+    size?: Size;
+    /** Строки группы: копия блока рендерится целиком, вместе с ними. */
+    rows: FlattenSimpleItem[];
+};
+/**
+ * Статичная копия блока группы для `DragOverlay` (без `useSortable`): заголовок + строки группы.
+ * Блок рендерится целиком, чтобы копия совпадала по размеру с перетаскиваемым блоком — `DragOverlay`
+ * подгоняет обёртку под размеры активного узла (весь блок), поэтому одним заголовком её не заполнить.
+ */
+export declare function SimpleGroupBlockOverlay({ size, rows, ...separatorProps }: SimpleGroupBlockOverlayProps): import("react/jsx-runtime").JSX.Element;

package/dist/cjs/components/Items/SimpleItem/components/SimpleGroupBlockOverlay/SimpleGroupBlockOverlay.js

@@ -0,0 +1,19 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SimpleGroupBlockOverlay = SimpleGroupBlockOverlay;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const helperComponents_1 = require("../../../../../helperComponents");
+const styles_module_scss_1 = __importDefault(require('../../styles.module.css'));
+const OverlayDragHandle_1 = require("../OverlayDragHandle");
+const SimpleItemOverlay_1 = require("../SimpleItemOverlay");
+/**
+ * Статичная копия блока группы для `DragOverlay` (без `useSortable`): заголовок + строки группы.
+ * Блок рендерится целиком, чтобы копия совпадала по размеру с перетаскиваемым блоком — `DragOverlay`
+ * подгоняет обёртку под размеры активного узла (весь блок), поэтому одним заголовком её не заполнить.
+ */
+function SimpleGroupBlockOverlay({ size, rows, ...separatorProps }) {
+    return ((0, jsx_runtime_1.jsxs)("div", { className: styles_module_scss_1.default.groupBlock, "data-overlay": true, children: [(0, jsx_runtime_1.jsxs)("div", { className: styles_module_scss_1.default.groupHeader, "data-size": size, children: [(0, jsx_runtime_1.jsx)(OverlayDragHandle_1.OverlayDragHandle, {}), (0, jsx_runtime_1.jsx)(helperComponents_1.Separator, { ...separatorProps })] }), rows.map(row => ((0, jsx_runtime_1.jsx)(SimpleItemOverlay_1.SimpleItemOverlay, { ...row, bare: true }, row.id)))] }));
+}

package/dist/cjs/components/Items/SimpleItem/components/SimpleGroupBlockOverlay/index.d.ts

@@ -0,0 +1 @@
+export * from './SimpleGroupBlockOverlay';

package/dist/cjs/components/Items/SimpleItem/components/SimpleGroupBlockOverlay/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./SimpleGroupBlockOverlay"), exports);

package/dist/cjs/components/Items/SimpleItem/components/SimpleItem/SimpleItem.d.ts

@@ -0,0 +1,11 @@
+import { FlattenSimpleItem, ItemId } from '../../../types';
+type SimpleItemProps = FlattenSimpleItem & {
+    /** Id группы-родителя (если строка внутри группы) — уходит в `data` `useSortable` (kind=row). */
+    groupId?: ItemId;
+};
+/**
+ * Листовая сортируемая строка `List`/`Droplist` в reorder-режиме (проп `onItemsReorder`):
+ * `BaseItem` + ручка `@dnd-kit` слева. Группировку задаёт `SimpleGroupItem` уровнем выше.
+ */
+export declare function SimpleItem({ id, disabled, groupId, ...option }: SimpleItemProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/cjs/components/Items/SimpleItem/components/SimpleItem/SimpleItem.js

@@ -0,0 +1,48 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SimpleItem = SimpleItem;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const sortable_1 = require("@dnd-kit/sortable");
+const utilities_1 = require("@dnd-kit/utilities");
+const bottom_sheet_1 = require("@cloud-ru/ds-bottom-sheet");
+const utils_1 = require("../../../../../utils");
+const BaseItem_1 = require("../../../BaseItem");
+const constants_1 = require("../../constants");
+const styles_module_scss_1 = __importDefault(require('../../styles.module.css'));
+const utils_2 = require("../../utils");
+const DragHandle_1 = require("../DragHandle");
+/**
+ * Листовая сортируемая строка `List`/`Droplist` в reorder-режиме (проп `onItemsReorder`):
+ * `BaseItem` + ручка `@dnd-kit` слева. Группировку задаёт `SimpleGroupItem` уровнем выше.
+ */
+// `option` несёт и служебные поля flatten-модели (`items`/`allChildIds`) — `BaseItem` их не знает
+// и отбрасывает через `extractSupportProps`, в DOM они не попадают.
+function SimpleItem({ id, disabled, groupId, ...option }) {
+    const { attributes, listeners, setNodeRef, transform, transition, isDragging } = (0, sortable_1.useSortable)({
+        id,
+        // `disabled` на строке отключает `Switch` и клик (`BaseItem`), но не переупорядочивание:
+        // ручка всегда активна.
+        // `container` читает кастомный `collisionDetection` в `ListPrivate`: drop разрешён только внутри
+        // одного контейнера. Строка без группы (`groupId` пуст) лежит в общем контейнере верхнего уровня
+        // вместе с группами (можно менять местами строку и группу); строка группы — в контейнере группы.
+        data: { container: groupId ?? constants_1.REORDER_TOP_LEVEL },
+        animateLayoutChanges: utils_2.animateLayoutChanges,
+    });
+    const style = {
+        // Только трансляция без scale: иначе `@dnd-kit` подмешивает scaleY (`adjustScale`) и короткая
+        // строка растягивается под высоту соседа. `CSS.Translate` даёт `translate3d` без scale.
+        transform: utilities_1.CSS.Translate.toString(transform),
+        transition,
+    };
+    const { onMouseDown, ...restListeners } = listeners || {};
+    const handleMouseDown = (e) => {
+        (0, utils_1.stopPropagation)(e);
+        onMouseDown?.(e);
+    };
+    return ((0, jsx_runtime_1.jsx)("div", { ref: setNodeRef, style: style, className: styles_module_scss_1.default.item, "data-dragging": isDragging || undefined, children: (0, jsx_runtime_1.jsx)(BaseItem_1.BaseItem, { ...option, id: id, disabled: disabled, dragHandle: (0, jsx_runtime_1.jsx)(DragHandle_1.DragHandle
+            // Pointer-жест не доходит до BottomSheet: иначе vertical drag одновременно закрывает sheet.
+            , { [bottom_sheet_1.NO_DRAG_ATTRIBUTE]: '', ...attributes, ...restListeners, onMouseDown: handleMouseDown, onClick: utils_1.stopPropagation }) }) }));
+}

package/dist/cjs/components/Items/SimpleItem/components/SimpleItem/index.d.ts

@@ -0,0 +1 @@
+export * from './SimpleItem';

package/dist/cjs/components/Items/SimpleItem/components/SimpleItem/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./SimpleItem"), exports);