@cloud-ru/ds-uikit-product-header 1.2.2-preview-ea035b95.0 → 1.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +14 -0
- package/README.md +2 -0
- package/dist/cjs/components/MainMenu/helperComponents/Content/Content.js +1 -1
- package/dist/cjs/components/MainMenu/helperComponents/Content/helperComponents/SortableGroup/SortableGroup.d.ts +3 -2
- package/dist/cjs/components/MainMenu/helperComponents/Content/helperComponents/SortableGroup/SortableGroup.js +4 -4
- package/dist/cjs/components/MainMenu/helperComponents/Content/helperComponents/SortableGroup/components/SortableGroupCards.d.ts +2 -1
- package/dist/cjs/components/MainMenu/helperComponents/Content/helperComponents/SortableGroup/components/SortableGroupCards.js +2 -2
- package/dist/cjs/components/MainMenu/helperComponents/Content/helperComponents/SortableGroup/components/SubCategory/SubCategory.d.ts +2 -1
- package/dist/cjs/components/MainMenu/helperComponents/Content/helperComponents/SortableGroup/components/SubCategory/SubCategory.js +2 -2
- package/dist/cjs/components/MainMenu/helperComponents/ServiceCard/ServiceCard.js +4 -2
- package/dist/cjs/components/MainMenu/types.d.ts +2 -0
- package/dist/esm/components/MainMenu/helperComponents/Content/Content.js +1 -1
- package/dist/esm/components/MainMenu/helperComponents/Content/helperComponents/SortableGroup/SortableGroup.d.ts +3 -2
- package/dist/esm/components/MainMenu/helperComponents/Content/helperComponents/SortableGroup/SortableGroup.js +4 -4
- package/dist/esm/components/MainMenu/helperComponents/Content/helperComponents/SortableGroup/components/SortableGroupCards.d.ts +2 -1
- package/dist/esm/components/MainMenu/helperComponents/Content/helperComponents/SortableGroup/components/SortableGroupCards.js +2 -2
- package/dist/esm/components/MainMenu/helperComponents/Content/helperComponents/SortableGroup/components/SubCategory/SubCategory.d.ts +2 -1
- package/dist/esm/components/MainMenu/helperComponents/Content/helperComponents/SortableGroup/components/SubCategory/SubCategory.js +2 -2
- package/dist/esm/components/MainMenu/helperComponents/ServiceCard/ServiceCard.js +4 -2
- package/dist/esm/components/MainMenu/types.d.ts +2 -0
- package/dist/tsconfig.cjs.tsbuildinfo +1 -1
- package/dist/tsconfig.esm.tsbuildinfo +1 -1
- package/package.json +27 -27
- package/src/components/MainMenu/helperComponents/Content/Content.tsx +3 -2
- package/src/components/MainMenu/helperComponents/Content/helperComponents/SortableGroup/SortableGroup.tsx +6 -0
- package/src/components/MainMenu/helperComponents/Content/helperComponents/SortableGroup/components/SortableGroupCards.tsx +3 -0
- package/src/components/MainMenu/helperComponents/Content/helperComponents/SortableGroup/components/SubCategory/SubCategory.tsx +3 -1
- package/src/components/MainMenu/helperComponents/ServiceCard/ServiceCard.tsx +4 -2
- package/src/components/MainMenu/types.ts +2 -0
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,20 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
# 1.3.0 (2026-09-02)
|
|
7
|
+
|
|
8
|
+
### Bug Fixes
|
|
9
|
+
|
|
10
|
+
- **FF-8964:** export MenuMobile from new header ([38d1de7](https://github.com/cloud-ru-tech/snack-v2/commit/38d1de7cffd16cc8743b1cb51b229539cef2f3a0))
|
|
11
|
+
|
|
12
|
+
### Features
|
|
13
|
+
|
|
14
|
+
- **FF-8932:** allow to disable favorite for InnerLink ([8dbc81d](https://github.com/cloud-ru-tech/snack-v2/commit/8dbc81da951ca73674cde2e6d7c5b7656eaed0a4))
|
|
15
|
+
|
|
16
|
+
## 1.2.2 (2026-09-02)
|
|
17
|
+
|
|
18
|
+
**Note:** Version bump only for package @ds/uikit-product-header
|
|
19
|
+
|
|
6
20
|
## 1.2.1 (2026-09-01)
|
|
7
21
|
|
|
8
22
|
**Note:** Version bump only for package @ds/uikit-product-header
|
package/README.md
CHANGED
|
@@ -342,6 +342,7 @@ function LocalMainMenu() {
|
|
|
342
342
|
| `badge` | `CardServiceLightProps` \| `PromoTagPredefinedBaseProps` | — | |
|
|
343
343
|
| `description` | `string \| undefined` | — | Краткое описание сервиса — отображается при включённом переключателе «Описание». |
|
|
344
344
|
| `disabled` | `boolean \| undefined` | — | |
|
|
345
|
+
| `favoritesEnabled` | `boolean \| undefined` | — | Разрешено ли добавление карточки в избранное. default=true - разрешено |
|
|
345
346
|
| `hidden` | `boolean \| undefined` | — | |
|
|
346
347
|
| `href` | `string \| undefined` | — | |
|
|
347
348
|
| `icon` | `JSXElementConstructor<{ size?: number; className?: string; }> \| undefined` | — | Иконка карточки. |
|
|
@@ -512,6 +513,7 @@ import { MainMenu, MenuMobile } from '@cloud-ru/ds-uikit-product-header';
|
|
|
512
513
|
| `badge` | `CardServiceLightProps` \| `PromoTagPredefinedBaseProps` | — | |
|
|
513
514
|
| `description` | `string \| undefined` | — | Краткое описание сервиса — отображается при включённом переключателе «Описание». |
|
|
514
515
|
| `disabled` | `boolean \| undefined` | — | |
|
|
516
|
+
| `favoritesEnabled` | `boolean \| undefined` | — | Разрешено ли добавление карточки в избранное. default=true - разрешено |
|
|
515
517
|
| `hidden` | `boolean \| undefined` | — | |
|
|
516
518
|
| `href` | `string \| undefined` | — | |
|
|
517
519
|
| `icon` | `JSXElementConstructor<{ size?: number; className?: string; }> \| undefined` | — | Иконка карточки. |
|
|
@@ -90,7 +90,7 @@ function Content({ searchValue, search, rightTop, segments, searchGroups = [], s
|
|
|
90
90
|
return Array.from({ length: 5 }).map((_, index) => (0, jsx_runtime_1.jsx)(SortableGroup_1.SortableGroupSkeleton, { isMobile: isMobile }, index));
|
|
91
91
|
}
|
|
92
92
|
if (hasCards) {
|
|
93
|
-
return ((0, jsx_runtime_1.jsx)(sortable_1.SortableContext, { items: visibleGroups.map(({ id }) => id), strategy: sortable_1.verticalListSortingStrategy, children: (0, jsx_runtime_1.jsx)(accordion_1.Accordion, { selectionMode: 'multiple', expanded: expandedIds, onExpandedChange: onExpandedChange, children: visibleGroups.map(({ id, label, icon, items, favoritesEnabled
|
|
93
|
+
return ((0, jsx_runtime_1.jsx)(sortable_1.SortableContext, { items: visibleGroups.map(({ id }) => id), strategy: sortable_1.verticalListSortingStrategy, children: (0, jsx_runtime_1.jsx)(accordion_1.Accordion, { selectionMode: 'multiple', expanded: expandedIds, onExpandedChange: onExpandedChange, children: visibleGroups.map(({ id, label, icon, items, favoritesEnabled, blockColor, highlight }) => ((0, jsx_runtime_1.jsx)(SortableGroup_1.SortableGroup, { id: id, icon: icon, label: label, items: items, isExpanded: expandedIds.includes(id), blockColor: (0, utils_2.resolveGroupBlockColor)(blockColor, preferences?.showGroupsColors?.value), showDescription: showDescription, isMobile: isMobile, enableServiceDrag: enableServiceDrag, favorite: favorite, groupFavoritesEnabled: favoritesEnabled, onServiceClick: handleLinkClick, highlight: highlight }, id))) }) }));
|
|
94
94
|
}
|
|
95
95
|
return ((0, jsx_runtime_1.jsx)(info_block_1.InfoBlock, { size: 'm', icon: {
|
|
96
96
|
icon: isSearching ? system_1.SearchSVG : system_1.CrossSVG,
|
|
@@ -6,6 +6,7 @@ export type SortableGroupProps = Omit<SortableGroupCardsProps, 'groupId'> & Pick
|
|
|
6
6
|
isExpanded?: boolean;
|
|
7
7
|
blockColor?: LinksGroupBlockColor;
|
|
8
8
|
highlight?: boolean;
|
|
9
|
+
groupFavoritesEnabled?: boolean;
|
|
9
10
|
};
|
|
10
|
-
export declare function SortableGroup({ id, icon, label, items, isExpanded, showDescription, isMobile, enableServiceDrag, favorite, onServiceClick, blockColor, highlight, }: SortableGroupProps): import("react/jsx-runtime").JSX.Element;
|
|
11
|
-
export declare function SortableGroupDragPreview({ id, label, items, isExpanded, showDescription, isMobile, favorite, blockColor, highlight, }: Omit<SortableGroupProps, 'enableServiceDrag'>): import("react/jsx-runtime").JSX.Element;
|
|
11
|
+
export declare function SortableGroup({ id, icon, label, items, isExpanded, showDescription, isMobile, enableServiceDrag, favorite, groupFavoritesEnabled, onServiceClick, blockColor, highlight, }: SortableGroupProps): import("react/jsx-runtime").JSX.Element;
|
|
12
|
+
export declare function SortableGroupDragPreview({ id, label, items, isExpanded, showDescription, isMobile, favorite, groupFavoritesEnabled, blockColor, highlight, }: Omit<SortableGroupProps, 'enableServiceDrag'>): import("react/jsx-runtime").JSX.Element;
|
|
@@ -14,7 +14,7 @@ const theme_1 = require("@cloud-ru/ds-theme");
|
|
|
14
14
|
const constants_1 = require("../../constants");
|
|
15
15
|
const components_1 = require("./components");
|
|
16
16
|
const styles_module_scss_1 = __importDefault(require('./styles.module.css'));
|
|
17
|
-
function SortableGroup({ id, icon, label, items, isExpanded, showDescription, isMobile, enableServiceDrag, favorite, onServiceClick, blockColor, highlight, }) {
|
|
17
|
+
function SortableGroup({ id, icon, label, items, isExpanded, showDescription, isMobile, enableServiceDrag, favorite, groupFavoritesEnabled = true, onServiceClick, blockColor, highlight, }) {
|
|
18
18
|
const { attributes, listeners, setNodeRef, transform, transition, isDragging } = (0, sortable_1.useSortable)({
|
|
19
19
|
id,
|
|
20
20
|
disabled: !enableServiceDrag,
|
|
@@ -28,9 +28,9 @@ function SortableGroup({ id, icon, label, items, isExpanded, showDescription, is
|
|
|
28
28
|
transition,
|
|
29
29
|
};
|
|
30
30
|
const { colorScheme } = (0, theme_1.useThemeAppearance)().appearance;
|
|
31
|
-
return ((0, jsx_runtime_1.jsxs)(drag_and_drop_1.DragGhost, { innerRef: setNodeRef, id: id, style: style, className: styles_module_scss_1.default.group, dragging: isDragging, mode: drag_and_drop_1.DRAG_MODE.Dynamic, "data-test-id": `${constants_1.TEST_IDS.groupCard}-${id}`, children: [(0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.decoration, "data-color-scheme": colorScheme, "data-is-highlighted": highlight || undefined, children: (0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.decorationBackground, children: (0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.colorMarker, "data-block-color": blockColor }) }) }), (0, jsx_runtime_1.jsx)(accordion_1.Accordion.CollapseBlockTertiary, { id: id, showChevron: false, afterTitle: (0, jsx_runtime_1.jsx)(components_1.SortableGroupHeader, { label: label, icon: icon, isExpanded: isExpanded, enableServiceDrag: enableServiceDrag, attributes: attributes, listeners: listeners, isMobile: isMobile }), children: (0, jsx_runtime_1.jsx)(components_1.SortableGroupCards, { groupId: id, items: items, showDescription: showDescription, isMobile: isMobile, enableServiceDrag: enableServiceDrag, favorite: favorite, onServiceClick: onServiceClick }) })] }));
|
|
31
|
+
return ((0, jsx_runtime_1.jsxs)(drag_and_drop_1.DragGhost, { innerRef: setNodeRef, id: id, style: style, className: styles_module_scss_1.default.group, dragging: isDragging, mode: drag_and_drop_1.DRAG_MODE.Dynamic, "data-test-id": `${constants_1.TEST_IDS.groupCard}-${id}`, children: [(0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.decoration, "data-color-scheme": colorScheme, "data-is-highlighted": highlight || undefined, children: (0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.decorationBackground, children: (0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.colorMarker, "data-block-color": blockColor }) }) }), (0, jsx_runtime_1.jsx)(accordion_1.Accordion.CollapseBlockTertiary, { id: id, showChevron: false, afterTitle: (0, jsx_runtime_1.jsx)(components_1.SortableGroupHeader, { label: label, icon: icon, isExpanded: isExpanded, enableServiceDrag: enableServiceDrag, attributes: attributes, listeners: listeners, isMobile: isMobile }), children: (0, jsx_runtime_1.jsx)(components_1.SortableGroupCards, { groupId: id, items: items, showDescription: showDescription, isMobile: isMobile, enableServiceDrag: enableServiceDrag, favorite: favorite, groupFavoritesEnabled: groupFavoritesEnabled, onServiceClick: onServiceClick }) })] }));
|
|
32
32
|
}
|
|
33
|
-
function SortableGroupDragPreview({ id, label, items, isExpanded, showDescription, isMobile, favorite, blockColor, highlight, }) {
|
|
33
|
+
function SortableGroupDragPreview({ id, label, items, isExpanded, showDescription, isMobile, favorite, groupFavoritesEnabled, blockColor, highlight, }) {
|
|
34
34
|
const { colorScheme } = (0, theme_1.useThemeAppearance)().appearance;
|
|
35
|
-
return ((0, jsx_runtime_1.jsx)(drag_and_drop_1.DragPreview, { className: styles_module_scss_1.default.groupDragPreview, children: (0, jsx_runtime_1.jsxs)("div", { className: styles_module_scss_1.default.group, "data-drag-preview": true, "data-block-color": blockColor, children: [(0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.decoration, "data-color-scheme": colorScheme, "data-is-highlighted": highlight || undefined, children: (0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.decorationBackground, children: (0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.colorMarker, "data-block-color": blockColor }) }) }), (0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.groupDragPreviewHeader, children: (0, jsx_runtime_1.jsx)(components_1.SortableGroupHeader, { label: label, isExpanded: isExpanded, isMobile: isMobile, enableServiceDrag: true }) }), isExpanded && ((0, jsx_runtime_1.jsx)(components_1.SortableGroupCards, { groupId: id, items: items, showDescription: showDescription, isMobile: isMobile, favorite: favorite }))] }) }));
|
|
35
|
+
return ((0, jsx_runtime_1.jsx)(drag_and_drop_1.DragPreview, { className: styles_module_scss_1.default.groupDragPreview, children: (0, jsx_runtime_1.jsxs)("div", { className: styles_module_scss_1.default.group, "data-drag-preview": true, "data-block-color": blockColor, children: [(0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.decoration, "data-color-scheme": colorScheme, "data-is-highlighted": highlight || undefined, children: (0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.decorationBackground, children: (0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.colorMarker, "data-block-color": blockColor }) }) }), (0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.groupDragPreviewHeader, children: (0, jsx_runtime_1.jsx)(components_1.SortableGroupHeader, { label: label, isExpanded: isExpanded, isMobile: isMobile, enableServiceDrag: true }) }), isExpanded && ((0, jsx_runtime_1.jsx)(components_1.SortableGroupCards, { groupId: id, items: items, showDescription: showDescription, isMobile: isMobile, favorite: favorite, groupFavoritesEnabled: groupFavoritesEnabled }))] }) }));
|
|
36
36
|
}
|
|
@@ -4,5 +4,6 @@ export type SortableGroupCardsProps = Pick<ServiceCardProps, 'showDescription' |
|
|
|
4
4
|
groupId: string;
|
|
5
5
|
items: InnerLink[];
|
|
6
6
|
enableServiceDrag?: boolean;
|
|
7
|
+
groupFavoritesEnabled?: boolean;
|
|
7
8
|
};
|
|
8
|
-
export declare function SortableGroupCards({ groupId, items, showDescription, isMobile, enableServiceDrag, favorite, onServiceClick, }: SortableGroupCardsProps): import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
export declare function SortableGroupCards({ groupId, items, showDescription, isMobile, enableServiceDrag, favorite, groupFavoritesEnabled, onServiceClick, }: SortableGroupCardsProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -9,14 +9,14 @@ const innerLink_1 = require("../../../../../utils/innerLink");
|
|
|
9
9
|
const ServiceCard_1 = require("../../../../ServiceCard");
|
|
10
10
|
const styles_module_scss_1 = __importDefault(require('../styles.module.css'));
|
|
11
11
|
const SubCategory_1 = require("./SubCategory");
|
|
12
|
-
function SortableGroupCards({ groupId, items, showDescription, isMobile, enableServiceDrag, favorite, onServiceClick, }) {
|
|
12
|
+
function SortableGroupCards({ groupId, items, showDescription, isMobile, enableServiceDrag, favorite, groupFavoritesEnabled, onServiceClick, }) {
|
|
13
13
|
return ((0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.groupBody, "data-mobile": isMobile || undefined, children: items.map(service => {
|
|
14
14
|
if (service.hidden) {
|
|
15
15
|
return null;
|
|
16
16
|
}
|
|
17
17
|
const key = String(groupId) + service.id;
|
|
18
18
|
if ((0, innerLink_1.hasNestedItems)(service)) {
|
|
19
|
-
return ((0, jsx_runtime_1.jsx)(SubCategory_1.SubCategory, { groupId: groupId, service: service, showDescription: showDescription, isMobile: isMobile, dragDisabled: !enableServiceDrag, favorite: favorite, onServiceClick: onServiceClick }, key));
|
|
19
|
+
return ((0, jsx_runtime_1.jsx)(SubCategory_1.SubCategory, { groupId: groupId, service: service, showDescription: showDescription, isMobile: isMobile, dragDisabled: !enableServiceDrag, favorite: favorite, groupFavoritesEnabled: groupFavoritesEnabled, onServiceClick: onServiceClick }, key));
|
|
20
20
|
}
|
|
21
21
|
return ((0, jsx_runtime_1.jsx)(ServiceCard_1.DraggableServiceCard, { groupId: groupId, service: service, favorite: favorite, isMobile: isMobile, onServiceClick: onServiceClick, showDescription: showDescription, dragDisabled: !enableServiceDrag }, key));
|
|
22
22
|
}) }));
|
|
@@ -2,5 +2,6 @@ import { ServiceCardProps } from '../../../../../ServiceCard';
|
|
|
2
2
|
export type SubCategoryProps = Pick<ServiceCardProps, 'service' | 'onServiceClick' | 'favorite' | 'showDescription' | 'isMobile'> & {
|
|
3
3
|
groupId: string;
|
|
4
4
|
dragDisabled?: boolean;
|
|
5
|
+
groupFavoritesEnabled?: boolean;
|
|
5
6
|
};
|
|
6
|
-
export declare function SubCategory({ groupId, service, showDescription, isMobile, dragDisabled, favorite, onServiceClick, }: SubCategoryProps): import("react/jsx-runtime").JSX.Element;
|
|
7
|
+
export declare function SubCategory({ groupId, service, showDescription, isMobile, dragDisabled, favorite, onServiceClick, groupFavoritesEnabled, }: SubCategoryProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -13,7 +13,7 @@ const constants_1 = require("../../../../constants");
|
|
|
13
13
|
const styles_module_scss_1 = __importDefault(require('../../styles.module.css'));
|
|
14
14
|
const styles_module_scss_2 = __importDefault(require('./styles.module.css'));
|
|
15
15
|
const SubCategoryTitle_1 = require("./SubCategoryTitle");
|
|
16
|
-
function SubCategory({ groupId, service, showDescription, isMobile, dragDisabled, favorite, onServiceClick, }) {
|
|
16
|
+
function SubCategory({ groupId, service, showDescription, isMobile, dragDisabled, favorite, onServiceClick, groupFavoritesEnabled, }) {
|
|
17
17
|
const subcategoryId = (0, innerLink_1.getSubCategoryId)(groupId, service.id);
|
|
18
18
|
const nestedGroupId = (0, innerLink_1.getNestedServiceGroupId)(groupId, service.id);
|
|
19
19
|
const nestedItems = (0, react_1.useMemo)(() => service.items?.filter(item => !item.hidden) ?? [], [service.items]);
|
|
@@ -25,5 +25,5 @@ function SubCategory({ groupId, service, showDescription, isMobile, dragDisabled
|
|
|
25
25
|
return ((0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_2.default.subcategory, "data-test-id": `${constants_1.TEST_IDS.subcategory}-${service.id}`, children: (0, jsx_runtime_1.jsx)(accordion_1.Accordion, { selectionMode: 'single', expanded: isExpanded, onExpandedChange: handleExpandedChange, children: (0, jsx_runtime_1.jsx)(accordion_1.Accordion.CollapseBlockTertiary, { id: subcategoryId, showChevron: false, className: styles_module_scss_2.default.subcategoryAccordion, afterTitle: (0, jsx_runtime_1.jsx)(SubCategoryTitle_1.SubCategoryTitle, { groupId: groupId, service: service, expandable: {
|
|
26
26
|
value: Boolean(isExpanded),
|
|
27
27
|
onClick: handleExpandedChange,
|
|
28
|
-
}, showDescription: showDescription, isMobile: isMobile, dragDisabled: dragDisabled, favorite: favorite, onServiceClick: onServiceClick }), children: (0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.groupBody, "data-subcategory-body": true, "data-mobile": isMobile || undefined, children: nestedItems.map(nestedService => ((0, jsx_runtime_1.jsx)(ServiceCard_1.DraggableServiceCard, { groupId: nestedGroupId, service: nestedService, favorite: favorite, isMobile: isMobile, onServiceClick: onServiceClick, showDescription: showDescription, dragDisabled: dragDisabled }, nestedGroupId + nestedService.id))) }) }) }) }));
|
|
28
|
+
}, showDescription: showDescription, isMobile: isMobile, dragDisabled: dragDisabled, favorite: groupFavoritesEnabled ? favorite : undefined, onServiceClick: onServiceClick }), children: (0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.groupBody, "data-subcategory-body": true, "data-mobile": isMobile || undefined, children: nestedItems.map(nestedService => ((0, jsx_runtime_1.jsx)(ServiceCard_1.DraggableServiceCard, { groupId: nestedGroupId, service: nestedService, favorite: favorite, isMobile: isMobile, onServiceClick: onServiceClick, showDescription: showDescription, dragDisabled: dragDisabled }, nestedGroupId + nestedService.id))) }) }) }) }));
|
|
29
29
|
}
|
|
@@ -14,11 +14,12 @@ const utils_1 = require("../../utils");
|
|
|
14
14
|
const styles_module_scss_1 = __importDefault(require('./styles.module.css'));
|
|
15
15
|
function ServiceCard({ service, favorite, isMobile, onServiceClick, showDescription, className, tabIndex, dragPreview, expandable, }) {
|
|
16
16
|
const isInFavorites = favorite?.value.includes(service.id) ?? false;
|
|
17
|
+
const isFavoriteEnabled = service.favoritesEnabled ?? true;
|
|
17
18
|
const favoriteProps = !dragPreview && favorite
|
|
18
19
|
? {
|
|
19
20
|
checked: isInFavorites,
|
|
20
21
|
onChange: favorite.onChange(service.id),
|
|
21
|
-
enabled: !service.disabled,
|
|
22
|
+
enabled: !service.disabled && isFavoriteEnabled,
|
|
22
23
|
}
|
|
23
24
|
: undefined;
|
|
24
25
|
const commonProps = {
|
|
@@ -43,7 +44,8 @@ function ServiceCard({ service, favorite, isMobile, onServiceClick, showDescript
|
|
|
43
44
|
return dragPreview ? (0, jsx_runtime_1.jsx)(drag_and_drop_1.DragPreview, { className: styles_module_scss_1.default.dragCardPreview, children: card }) : card;
|
|
44
45
|
}
|
|
45
46
|
function DraggableServiceCard({ groupId, service, favorite, dragDisabled, ...props }) {
|
|
46
|
-
const
|
|
47
|
+
const isFavoriteEnabled = service.favoritesEnabled ?? true;
|
|
48
|
+
const disabled = dragDisabled || service.disabled || favorite?.value.includes(service.id) || !isFavoriteEnabled;
|
|
47
49
|
const { attributes, listeners, setNodeRef, isDragging } = (0, core_1.useDraggable)({
|
|
48
50
|
id: (0, utils_1.getServiceSourceDragId)(groupId, service.id),
|
|
49
51
|
disabled,
|
|
@@ -34,6 +34,8 @@ export type InnerLink = {
|
|
|
34
34
|
disabled?: boolean;
|
|
35
35
|
hidden?: boolean;
|
|
36
36
|
badge?: CardServiceLightProps['promoTag'];
|
|
37
|
+
/** Разрешено ли добавление карточки в избранное. default=true - разрешено */
|
|
38
|
+
favoritesEnabled?: boolean;
|
|
37
39
|
/**
|
|
38
40
|
* Вложенные сервисы подкатегории.
|
|
39
41
|
*
|
|
@@ -84,7 +84,7 @@ export function Content({ searchValue, search, rightTop, segments, searchGroups
|
|
|
84
84
|
return Array.from({ length: 5 }).map((_, index) => _jsx(SortableGroupSkeleton, { isMobile: isMobile }, index));
|
|
85
85
|
}
|
|
86
86
|
if (hasCards) {
|
|
87
|
-
return (_jsx(SortableContext, { items: visibleGroups.map(({ id }) => id), strategy: verticalListSortingStrategy, children: _jsx(Accordion, { selectionMode: 'multiple', expanded: expandedIds, onExpandedChange: onExpandedChange, children: visibleGroups.map(({ id, label, icon, items, favoritesEnabled
|
|
87
|
+
return (_jsx(SortableContext, { items: visibleGroups.map(({ id }) => id), strategy: verticalListSortingStrategy, children: _jsx(Accordion, { selectionMode: 'multiple', expanded: expandedIds, onExpandedChange: onExpandedChange, children: visibleGroups.map(({ id, label, icon, items, favoritesEnabled, blockColor, highlight }) => (_jsx(SortableGroup, { id: id, icon: icon, label: label, items: items, isExpanded: expandedIds.includes(id), blockColor: resolveGroupBlockColor(blockColor, preferences?.showGroupsColors?.value), showDescription: showDescription, isMobile: isMobile, enableServiceDrag: enableServiceDrag, favorite: favorite, groupFavoritesEnabled: favoritesEnabled, onServiceClick: handleLinkClick, highlight: highlight }, id))) }) }));
|
|
88
88
|
}
|
|
89
89
|
return (_jsx(InfoBlock, { size: 'm', icon: {
|
|
90
90
|
icon: isSearching ? SearchSVG : CrossSVG,
|
|
@@ -6,6 +6,7 @@ export type SortableGroupProps = Omit<SortableGroupCardsProps, 'groupId'> & Pick
|
|
|
6
6
|
isExpanded?: boolean;
|
|
7
7
|
blockColor?: LinksGroupBlockColor;
|
|
8
8
|
highlight?: boolean;
|
|
9
|
+
groupFavoritesEnabled?: boolean;
|
|
9
10
|
};
|
|
10
|
-
export declare function SortableGroup({ id, icon, label, items, isExpanded, showDescription, isMobile, enableServiceDrag, favorite, onServiceClick, blockColor, highlight, }: SortableGroupProps): import("react/jsx-runtime").JSX.Element;
|
|
11
|
-
export declare function SortableGroupDragPreview({ id, label, items, isExpanded, showDescription, isMobile, favorite, blockColor, highlight, }: Omit<SortableGroupProps, 'enableServiceDrag'>): import("react/jsx-runtime").JSX.Element;
|
|
11
|
+
export declare function SortableGroup({ id, icon, label, items, isExpanded, showDescription, isMobile, enableServiceDrag, favorite, groupFavoritesEnabled, onServiceClick, blockColor, highlight, }: SortableGroupProps): import("react/jsx-runtime").JSX.Element;
|
|
12
|
+
export declare function SortableGroupDragPreview({ id, label, items, isExpanded, showDescription, isMobile, favorite, groupFavoritesEnabled, blockColor, highlight, }: Omit<SortableGroupProps, 'enableServiceDrag'>): import("react/jsx-runtime").JSX.Element;
|
|
@@ -7,7 +7,7 @@ import { useThemeAppearance } from '@cloud-ru/ds-theme';
|
|
|
7
7
|
import { TEST_IDS } from '../../constants.js';
|
|
8
8
|
import { SortableGroupCards, SortableGroupHeader } from './components/index.js';
|
|
9
9
|
import styles from './styles.module.css';
|
|
10
|
-
export function SortableGroup({ id, icon, label, items, isExpanded, showDescription, isMobile, enableServiceDrag, favorite, onServiceClick, blockColor, highlight, }) {
|
|
10
|
+
export function SortableGroup({ id, icon, label, items, isExpanded, showDescription, isMobile, enableServiceDrag, favorite, groupFavoritesEnabled = true, onServiceClick, blockColor, highlight, }) {
|
|
11
11
|
const { attributes, listeners, setNodeRef, transform, transition, isDragging } = useSortable({
|
|
12
12
|
id,
|
|
13
13
|
disabled: !enableServiceDrag,
|
|
@@ -21,9 +21,9 @@ export function SortableGroup({ id, icon, label, items, isExpanded, showDescript
|
|
|
21
21
|
transition,
|
|
22
22
|
};
|
|
23
23
|
const { colorScheme } = useThemeAppearance().appearance;
|
|
24
|
-
return (_jsxs(DragGhost, { innerRef: setNodeRef, id: id, style: style, className: styles.group, dragging: isDragging, mode: DRAG_MODE.Dynamic, "data-test-id": `${TEST_IDS.groupCard}-${id}`, children: [_jsx("div", { className: styles.decoration, "data-color-scheme": colorScheme, "data-is-highlighted": highlight || undefined, children: _jsx("div", { className: styles.decorationBackground, children: _jsx("div", { className: styles.colorMarker, "data-block-color": blockColor }) }) }), _jsx(Accordion.CollapseBlockTertiary, { id: id, showChevron: false, afterTitle: _jsx(SortableGroupHeader, { label: label, icon: icon, isExpanded: isExpanded, enableServiceDrag: enableServiceDrag, attributes: attributes, listeners: listeners, isMobile: isMobile }), children: _jsx(SortableGroupCards, { groupId: id, items: items, showDescription: showDescription, isMobile: isMobile, enableServiceDrag: enableServiceDrag, favorite: favorite, onServiceClick: onServiceClick }) })] }));
|
|
24
|
+
return (_jsxs(DragGhost, { innerRef: setNodeRef, id: id, style: style, className: styles.group, dragging: isDragging, mode: DRAG_MODE.Dynamic, "data-test-id": `${TEST_IDS.groupCard}-${id}`, children: [_jsx("div", { className: styles.decoration, "data-color-scheme": colorScheme, "data-is-highlighted": highlight || undefined, children: _jsx("div", { className: styles.decorationBackground, children: _jsx("div", { className: styles.colorMarker, "data-block-color": blockColor }) }) }), _jsx(Accordion.CollapseBlockTertiary, { id: id, showChevron: false, afterTitle: _jsx(SortableGroupHeader, { label: label, icon: icon, isExpanded: isExpanded, enableServiceDrag: enableServiceDrag, attributes: attributes, listeners: listeners, isMobile: isMobile }), children: _jsx(SortableGroupCards, { groupId: id, items: items, showDescription: showDescription, isMobile: isMobile, enableServiceDrag: enableServiceDrag, favorite: favorite, groupFavoritesEnabled: groupFavoritesEnabled, onServiceClick: onServiceClick }) })] }));
|
|
25
25
|
}
|
|
26
|
-
export function SortableGroupDragPreview({ id, label, items, isExpanded, showDescription, isMobile, favorite, blockColor, highlight, }) {
|
|
26
|
+
export function SortableGroupDragPreview({ id, label, items, isExpanded, showDescription, isMobile, favorite, groupFavoritesEnabled, blockColor, highlight, }) {
|
|
27
27
|
const { colorScheme } = useThemeAppearance().appearance;
|
|
28
|
-
return (_jsx(DragPreview, { className: styles.groupDragPreview, children: _jsxs("div", { className: styles.group, "data-drag-preview": true, "data-block-color": blockColor, children: [_jsx("div", { className: styles.decoration, "data-color-scheme": colorScheme, "data-is-highlighted": highlight || undefined, children: _jsx("div", { className: styles.decorationBackground, children: _jsx("div", { className: styles.colorMarker, "data-block-color": blockColor }) }) }), _jsx("div", { className: styles.groupDragPreviewHeader, children: _jsx(SortableGroupHeader, { label: label, isExpanded: isExpanded, isMobile: isMobile, enableServiceDrag: true }) }), isExpanded && (_jsx(SortableGroupCards, { groupId: id, items: items, showDescription: showDescription, isMobile: isMobile, favorite: favorite }))] }) }));
|
|
28
|
+
return (_jsx(DragPreview, { className: styles.groupDragPreview, children: _jsxs("div", { className: styles.group, "data-drag-preview": true, "data-block-color": blockColor, children: [_jsx("div", { className: styles.decoration, "data-color-scheme": colorScheme, "data-is-highlighted": highlight || undefined, children: _jsx("div", { className: styles.decorationBackground, children: _jsx("div", { className: styles.colorMarker, "data-block-color": blockColor }) }) }), _jsx("div", { className: styles.groupDragPreviewHeader, children: _jsx(SortableGroupHeader, { label: label, isExpanded: isExpanded, isMobile: isMobile, enableServiceDrag: true }) }), isExpanded && (_jsx(SortableGroupCards, { groupId: id, items: items, showDescription: showDescription, isMobile: isMobile, favorite: favorite, groupFavoritesEnabled: groupFavoritesEnabled }))] }) }));
|
|
29
29
|
}
|
|
@@ -4,5 +4,6 @@ export type SortableGroupCardsProps = Pick<ServiceCardProps, 'showDescription' |
|
|
|
4
4
|
groupId: string;
|
|
5
5
|
items: InnerLink[];
|
|
6
6
|
enableServiceDrag?: boolean;
|
|
7
|
+
groupFavoritesEnabled?: boolean;
|
|
7
8
|
};
|
|
8
|
-
export declare function SortableGroupCards({ groupId, items, showDescription, isMobile, enableServiceDrag, favorite, onServiceClick, }: SortableGroupCardsProps): import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
export declare function SortableGroupCards({ groupId, items, showDescription, isMobile, enableServiceDrag, favorite, groupFavoritesEnabled, onServiceClick, }: SortableGroupCardsProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -3,14 +3,14 @@ import { hasNestedItems } from '../../../../../utils/innerLink.js';
|
|
|
3
3
|
import { DraggableServiceCard } from '../../../../ServiceCard/index.js';
|
|
4
4
|
import styles from '../styles.module.css';
|
|
5
5
|
import { SubCategory } from './SubCategory/index.js';
|
|
6
|
-
export function SortableGroupCards({ groupId, items, showDescription, isMobile, enableServiceDrag, favorite, onServiceClick, }) {
|
|
6
|
+
export function SortableGroupCards({ groupId, items, showDescription, isMobile, enableServiceDrag, favorite, groupFavoritesEnabled, onServiceClick, }) {
|
|
7
7
|
return (_jsx("div", { className: styles.groupBody, "data-mobile": isMobile || undefined, children: items.map(service => {
|
|
8
8
|
if (service.hidden) {
|
|
9
9
|
return null;
|
|
10
10
|
}
|
|
11
11
|
const key = String(groupId) + service.id;
|
|
12
12
|
if (hasNestedItems(service)) {
|
|
13
|
-
return (_jsx(SubCategory, { groupId: groupId, service: service, showDescription: showDescription, isMobile: isMobile, dragDisabled: !enableServiceDrag, favorite: favorite, onServiceClick: onServiceClick }, key));
|
|
13
|
+
return (_jsx(SubCategory, { groupId: groupId, service: service, showDescription: showDescription, isMobile: isMobile, dragDisabled: !enableServiceDrag, favorite: favorite, groupFavoritesEnabled: groupFavoritesEnabled, onServiceClick: onServiceClick }, key));
|
|
14
14
|
}
|
|
15
15
|
return (_jsx(DraggableServiceCard, { groupId: groupId, service: service, favorite: favorite, isMobile: isMobile, onServiceClick: onServiceClick, showDescription: showDescription, dragDisabled: !enableServiceDrag }, key));
|
|
16
16
|
}) }));
|
|
@@ -2,5 +2,6 @@ import { ServiceCardProps } from '../../../../../ServiceCard/index.js';
|
|
|
2
2
|
export type SubCategoryProps = Pick<ServiceCardProps, 'service' | 'onServiceClick' | 'favorite' | 'showDescription' | 'isMobile'> & {
|
|
3
3
|
groupId: string;
|
|
4
4
|
dragDisabled?: boolean;
|
|
5
|
+
groupFavoritesEnabled?: boolean;
|
|
5
6
|
};
|
|
6
|
-
export declare function SubCategory({ groupId, service, showDescription, isMobile, dragDisabled, favorite, onServiceClick, }: SubCategoryProps): import("react/jsx-runtime").JSX.Element;
|
|
7
|
+
export declare function SubCategory({ groupId, service, showDescription, isMobile, dragDisabled, favorite, onServiceClick, groupFavoritesEnabled, }: SubCategoryProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -7,7 +7,7 @@ import { TEST_IDS } from '../../../../constants.js';
|
|
|
7
7
|
import baseGroupStyles from '../../styles.module.css';
|
|
8
8
|
import styles from './styles.module.css';
|
|
9
9
|
import { SubCategoryTitle } from './SubCategoryTitle.js';
|
|
10
|
-
export function SubCategory({ groupId, service, showDescription, isMobile, dragDisabled, favorite, onServiceClick, }) {
|
|
10
|
+
export function SubCategory({ groupId, service, showDescription, isMobile, dragDisabled, favorite, onServiceClick, groupFavoritesEnabled, }) {
|
|
11
11
|
const subcategoryId = getSubCategoryId(groupId, service.id);
|
|
12
12
|
const nestedGroupId = getNestedServiceGroupId(groupId, service.id);
|
|
13
13
|
const nestedItems = useMemo(() => service.items?.filter(item => !item.hidden) ?? [], [service.items]);
|
|
@@ -19,5 +19,5 @@ export function SubCategory({ groupId, service, showDescription, isMobile, dragD
|
|
|
19
19
|
return (_jsx("div", { className: styles.subcategory, "data-test-id": `${TEST_IDS.subcategory}-${service.id}`, children: _jsx(Accordion, { selectionMode: 'single', expanded: isExpanded, onExpandedChange: handleExpandedChange, children: _jsx(Accordion.CollapseBlockTertiary, { id: subcategoryId, showChevron: false, className: styles.subcategoryAccordion, afterTitle: _jsx(SubCategoryTitle, { groupId: groupId, service: service, expandable: {
|
|
20
20
|
value: Boolean(isExpanded),
|
|
21
21
|
onClick: handleExpandedChange,
|
|
22
|
-
}, showDescription: showDescription, isMobile: isMobile, dragDisabled: dragDisabled, favorite: favorite, onServiceClick: onServiceClick }), children: _jsx("div", { className: baseGroupStyles.groupBody, "data-subcategory-body": true, "data-mobile": isMobile || undefined, children: nestedItems.map(nestedService => (_jsx(DraggableServiceCard, { groupId: nestedGroupId, service: nestedService, favorite: favorite, isMobile: isMobile, onServiceClick: onServiceClick, showDescription: showDescription, dragDisabled: dragDisabled }, nestedGroupId + nestedService.id))) }) }) }) }));
|
|
22
|
+
}, showDescription: showDescription, isMobile: isMobile, dragDisabled: dragDisabled, favorite: groupFavoritesEnabled ? favorite : undefined, onServiceClick: onServiceClick }), children: _jsx("div", { className: baseGroupStyles.groupBody, "data-subcategory-body": true, "data-mobile": isMobile || undefined, children: nestedItems.map(nestedService => (_jsx(DraggableServiceCard, { groupId: nestedGroupId, service: nestedService, favorite: favorite, isMobile: isMobile, onServiceClick: onServiceClick, showDescription: showDescription, dragDisabled: dragDisabled }, nestedGroupId + nestedService.id))) }) }) }) }));
|
|
23
23
|
}
|
|
@@ -7,11 +7,12 @@ import { getLinkEmblem, getServiceSourceDragId } from '../../utils/index.js';
|
|
|
7
7
|
import styles from './styles.module.css';
|
|
8
8
|
export function ServiceCard({ service, favorite, isMobile, onServiceClick, showDescription, className, tabIndex, dragPreview, expandable, }) {
|
|
9
9
|
const isInFavorites = favorite?.value.includes(service.id) ?? false;
|
|
10
|
+
const isFavoriteEnabled = service.favoritesEnabled ?? true;
|
|
10
11
|
const favoriteProps = !dragPreview && favorite
|
|
11
12
|
? {
|
|
12
13
|
checked: isInFavorites,
|
|
13
14
|
onChange: favorite.onChange(service.id),
|
|
14
|
-
enabled: !service.disabled,
|
|
15
|
+
enabled: !service.disabled && isFavoriteEnabled,
|
|
15
16
|
}
|
|
16
17
|
: undefined;
|
|
17
18
|
const commonProps = {
|
|
@@ -36,7 +37,8 @@ export function ServiceCard({ service, favorite, isMobile, onServiceClick, showD
|
|
|
36
37
|
return dragPreview ? _jsx(DragPreview, { className: styles.dragCardPreview, children: card }) : card;
|
|
37
38
|
}
|
|
38
39
|
export function DraggableServiceCard({ groupId, service, favorite, dragDisabled, ...props }) {
|
|
39
|
-
const
|
|
40
|
+
const isFavoriteEnabled = service.favoritesEnabled ?? true;
|
|
41
|
+
const disabled = dragDisabled || service.disabled || favorite?.value.includes(service.id) || !isFavoriteEnabled;
|
|
40
42
|
const { attributes, listeners, setNodeRef, isDragging } = useDraggable({
|
|
41
43
|
id: getServiceSourceDragId(groupId, service.id),
|
|
42
44
|
disabled,
|
|
@@ -34,6 +34,8 @@ export type InnerLink = {
|
|
|
34
34
|
disabled?: boolean;
|
|
35
35
|
hidden?: boolean;
|
|
36
36
|
badge?: CardServiceLightProps['promoTag'];
|
|
37
|
+
/** Разрешено ли добавление карточки в избранное. default=true - разрешено */
|
|
38
|
+
favoritesEnabled?: boolean;
|
|
37
39
|
/**
|
|
38
40
|
* Вложенные сервисы подкатегории.
|
|
39
41
|
*
|