@gravity-ui/dashkit 7.0.0 → 7.1.1

package/build/esm/shared/types/config.d.ts

@@ -6,6 +6,12 @@ export interface ConfigLayout {
     x: number;
     y: number;
 }
+export type ConfigItemGroup = {
+    id: string;
+    defaults?: StringParams;
+    namespace: string;
+    [key: string]: unknown;
+};
 export interface ConfigItemData {
     _editActive?: boolean;
     tabs?: {
@@ -14,11 +20,15 @@ export interface ConfigItemData {
         params?: StringParams;
         [key: string]: unknown;
     }[];
+    group?: ConfigItemGroup[];
     [key: string]: unknown;
 }
 export interface ConfigItemDataWithTabs extends Omit<ConfigItemData, 'tabs'> {
     tabs: NonNullable<ConfigItemData['tabs']>;
 }
+export interface ConfigItemDataWithGroup extends Omit<ConfigItemData, 'group'> {
+    group: NonNullable<ConfigItemData['group']>;
+}
 export interface ConfigItem {
     id: string;
     data: ConfigItemData;
@@ -31,6 +41,9 @@ export interface ConfigItem {
 export interface ConfigItemWithTabs extends Omit<ConfigItem, 'data'> {
     data: ConfigItemDataWithTabs;
 }
+export interface ConfigItemWithGroup extends Omit<ConfigItem, 'data'> {
+    data: ConfigItemDataWithGroup;
+}
 export interface ConfigAliases {
     [namespace: string]: string[][];
 }

package/build/esm/shared/types/state-and-params.d.ts

@@ -6,6 +6,7 @@ export interface ItemState {
 export interface QueueItem {
     id: string;
     tabId?: string;
+    groupItemId?: string;
 }
 export type StateAndParamsMetaData = {
     queue: QueueItem[];
@@ -15,11 +16,12 @@ export type StateAndParamsMeta = {
     [META_KEY]: StateAndParamsMetaData;
 };
 export type ItemStateAndParams = {
-    params?: StringParams;
+    params?: StringParams | Record<string, StringParams>;
     state?: ItemState;
 };
 export type ItemStateAndParamsChangeOptions = {
-    action: 'setParams' | 'removeItem';
+    action?: 'setParams' | 'removeItem';
+    groupItemIds?: string[];
 };
 export type ItemsStateAndParamsBase = Record<string, ItemStateAndParams>;
 export type ItemsStateAndParams = ItemsStateAndParamsBase | StateAndParamsMeta;

package/build/esm/typings/common.d.ts

@@ -1,8 +1,8 @@
-import type { ReactGridLayoutProps } from 'react-grid-layout';
+import type ReactGridLayout from 'react-grid-layout';
 import { OverlayCustomControlItem } from '../components/OverlayControls/OverlayControls';
 import { MenuItems } from '../constants';
 export interface Settings {
-    gridLayout?: ReactGridLayoutProps;
+    gridLayout?: ReactGridLayout.ReactGridLayoutProps;
     theme?: string;
     isMobile?: boolean;
     menu?: Array<MenuItem>;

package/build/esm/typings/plugin.d.ts

@@ -1,11 +1,11 @@
 import React from 'react';
-import type { ReactGridLayoutProps } from 'react-grid-layout';
+import ReactGridLayout from 'react-grid-layout';
 import { ConfigItem, ItemState, ItemStateAndParams, ItemStateAndParamsChangeOptions, PluginBase, StringParams } from '../shared';
 import { ContextProps, SettingsProps, WidgetLayout } from './common';
-export interface PluginWidgetProps {
+export interface PluginWidgetProps<T = StringParams> {
     id: string;
     editMode: boolean;
-    params: StringParams;
+    params: T;
     state: ItemState;
     onStateAndParamsChange: (stateAndParams: ItemStateAndParams, options?: ItemStateAndParamsChangeOptions) => void;
     width: number;
@@ -16,7 +16,7 @@ export interface PluginWidgetProps {
     settings: SettingsProps;
     context: ContextProps;
     layout: WidgetLayout[];
-    gridLayout: ReactGridLayoutProps;
+    gridLayout: ReactGridLayout.ReactGridLayoutProps;
     adjustWidgetLayout: (data: {
         widgetId: string;
         needSetDefault?: boolean;
@@ -33,7 +33,7 @@ export interface PluginDefaultLayout {
     minH?: number;
     maxH?: number;
 }
-export interface Plugin<P extends PluginWidgetProps = any> extends PluginBase {
+export interface Plugin<P extends PluginWidgetProps<T> = any, T = StringParams> extends PluginBase {
     defaultLayout?: PluginDefaultLayout;
     renderer: (props: P, forwardedRef: React.RefObject<any>) => React.ReactNode;
 }

package/build/esm/utils/__tests__/update-manager.test.js

@@ -115,6 +115,61 @@ const config = {
             },
             namespace: 'default',
         },
+        {
+            id: 'qY',
+            data: {
+                group: [
+                    {
+                        id: '9YN',
+                        title: 'Category',
+                        width: '',
+                        source: {
+                            datasetId: 'rfvnhj345gugf',
+                            fieldType: 'string',
+                            elementType: 'select',
+                            datasetFieldId: 'ab089',
+                            datasetFieldType: 'DIMENSION',
+                        },
+                        defaults: {
+                            ab089: '',
+                        },
+                        sourceType: 'dataset',
+                        placementMode: 'auto',
+                        namespace: 'default',
+                    },
+                    {
+                        id: 'qav',
+                        title: 'Селектор 1',
+                        width: '',
+                        source: {
+                            fieldName: 'sds',
+                            elementType: 'select',
+                            acceptableValues: [
+                                {
+                                    title: '2',
+                                    value: '2',
+                                },
+                                {
+                                    title: '34',
+                                    value: '34',
+                                },
+                            ],
+                        },
+                        defaults: {
+                            sds: '',
+                        },
+                        sourceType: 'manual',
+                        placementMode: 'auto',
+                        namespace: 'default',
+                    },
+                ],
+                autoHeight: true,
+                buttonApply: false,
+                buttonReset: false,
+            },
+            type: 'group_control',
+            namespace: 'default',
+        },
     ],
     layout: [
         { h: 4, i: 'al', w: 4, x: 8, y: 0 },
@@ -122,6 +177,7 @@ const config = {
         { h: 2, i: 'L5', w: 8, x: 0, y: 2 },
         { h: 2, i: 'C8', w: 8, x: 10, y: 30 },
         { h: 2, i: 'lko', w: 8, x: 0, y: 12 },
+        { h: 2, i: 'qY', w: 8, x: 0, y: 24 },
     ],
     aliases: {},
     connections: [],
@@ -131,7 +187,7 @@ beforeEach(() => {
 });
 describe('UpdateManager', () => {
     describe('changeStateAndParams', () => {
-        it('control adds params to empty itemsStateAndParams', () => {
+        it('control adds params to empty itemsStateAndParams: common control', () => {
             expect(UpdateManager.changeStateAndParams({
                 id: 'L5',
                 config,
@@ -150,6 +206,30 @@ describe('UpdateManager', () => {
                 __meta__: { queue: [{ id: 'L5' }], version: 2 },
             });
         });
+        it('control adds params to empty itemsStateAndParams: group control', () => {
+            expect(UpdateManager.changeStateAndParams({
+                id: 'qY',
+                config,
+                itemsStateAndParams: {},
+                stateAndParams: {
+                    params: {
+                        ab089: ['red'],
+                    },
+                },
+                options: {
+                    groupItemIds: ['9YN'],
+                },
+            })).toEqual({
+                qY: {
+                    params: {
+                        '9YN': {
+                            ab089: ['red'],
+                        },
+                    },
+                },
+                __meta__: { queue: [{ id: 'qY', groupItemId: '9YN' }], version: 2 },
+            });
+        });
         it('state changes only do not push into the queue', () => {
             expect(UpdateManager.changeStateAndParams({
                 id: 'al',
@@ -160,7 +240,17 @@ describe('UpdateManager', () => {
                             d079: ['Russia'],
                         },
                     },
-                    __meta__: { queue: [{ id: 'L5' }, { id: 'Unk' }], version: 2 },
+                    qY: {
+                        params: {
+                            '9YN': {
+                                ab089: ['red'],
+                            },
+                        },
+                    },
+                    __meta__: {
+                        queue: [{ id: 'L5' }, { id: 'qY', groupItemId: '9YN' }, { id: 'Unk' }],
+                        version: 2,
+                    },
                 },
                 stateAndParams: {
                     state: { tabId: 'Pf' },
@@ -171,12 +261,19 @@ describe('UpdateManager', () => {
                         d079: ['Russia'],
                     },
                 },
+                qY: {
+                    params: {
+                        '9YN': {
+                            ab089: ['red'],
+                        },
+                    },
+                },
                 al: {
                     state: {
                         tabId: 'Pf',
                     },
                 },
-                __meta__: { queue: [{ id: 'L5' }], version: 2 },
+                __meta__: { queue: [{ id: 'L5' }, { id: 'qY', groupItemId: '9YN' }], version: 2 },
             });
         });
         it('tab changes clear previous tab params', () => {
@@ -206,7 +303,7 @@ describe('UpdateManager', () => {
                 __meta__: { queue: [], version: 2 },
             });
         });
-        it('control changes rearrange position in the queue', () => {
+        it('control changes rearrange position in the queue: common control', () => {
             expect(UpdateManager.changeStateAndParams({
                 id: 'L5',
                 config,
@@ -264,6 +361,74 @@ describe('UpdateManager', () => {
                 },
             });
         });
+        it('control changes rearrange position in the queue: group control', () => {
+            expect(UpdateManager.changeStateAndParams({
+                id: 'qY',
+                config,
+                itemsStateAndParams: {
+                    al: {
+                        params: {
+                            Country: 'USA',
+                        },
+                    },
+                    qY: {
+                        params: {
+                            qav: {
+                                sds: ['yellow'],
+                            },
+                            '9YN': {
+                                ab089: ['red'],
+                            },
+                        },
+                    },
+                    __meta__: {
+                        queue: [
+                            { id: 'qY', groupItemId: 'qav' },
+                            { id: 'qY', groupItemId: '9YN' },
+                            { id: 'al' },
+                        ],
+                        version: 2,
+                    },
+                },
+                stateAndParams: {
+                    params: {
+                        qav: {
+                            sds: ['violet'],
+                        },
+                        '9YN': {
+                            ab089: ['purple'],
+                        },
+                    },
+                },
+                options: {
+                    groupItemIds: ['qav'],
+                },
+            })).toEqual({
+                al: {
+                    params: {
+                        Country: 'USA',
+                    },
+                },
+                qY: {
+                    params: {
+                        qav: {
+                            sds: ['violet'],
+                        },
+                        '9YN': {
+                            ab089: ['red'],
+                        },
+                    },
+                },
+                __meta__: {
+                    queue: [
+                        { id: 'qY', groupItemId: '9YN' },
+                        { id: 'al' },
+                        { id: 'qY', groupItemId: 'qav' },
+                    ],
+                    version: 2,
+                },
+            });
+        });
         it('control params should merge', () => {
             expect(UpdateManager.changeStateAndParams({
                 id: 'lko',
@@ -307,7 +472,7 @@ describe('UpdateManager', () => {
                 __meta__: { queue: [{ id: 'L5' }, { id: 'lko' }], version: 2 },
             });
         });
-        it('control cannot set params not from defaults', () => {
+        it('control cannot set params not from defaults: common control', () => {
             expect(UpdateManager.changeStateAndParams({
                 id: 'lko',
                 config,
@@ -327,6 +492,29 @@ describe('UpdateManager', () => {
                 __meta__: { queue: [{ id: 'lko' }], version: 2 },
             });
         });
+        it('control cannot set params not from defaults: group control', () => {
+            expect(UpdateManager.changeStateAndParams({
+                id: 'qY',
+                config,
+                itemsStateAndParams: {},
+                stateAndParams: {
+                    params: {
+                        sds: ['value'],
+                        UnknownParam: ['Value'],
+                    },
+                },
+                options: { groupItemIds: ['qav'] },
+            })).toEqual({
+                qY: {
+                    params: {
+                        qav: {
+                            sds: ['value'],
+                        },
+                    },
+                },
+                __meta__: { queue: [{ id: 'qY', groupItemId: 'qav' }], version: 2 },
+            });
+        });
         it('filtering_charts_table can set action params not from defaults', () => {
             expect(UpdateManager.changeStateAndParams({
                 id: 'Q8',

package/build/esm/utils/register-manager.d.ts

@@ -1,4 +1,4 @@
-import type { ReactGridLayoutProps } from 'react-grid-layout';
+import ReactGridLayout from 'react-grid-layout';
 import { Plugin, PluginDefaultLayout, Settings } from '../typings';
 interface RegisterManagerDefaultLayout {
     x: number;
@@ -23,7 +23,7 @@ export declare class RegisterManager {
     registerPlugin(plugin: Plugin): void;
     setSettings(settings?: Settings): void;
     get settings(): RegisterManagerSettings;
-    get gridLayout(): ReactGridLayoutProps;
+    get gridLayout(): ReactGridLayout.ReactGridLayoutProps;
     getPlugins(): RegisterManagerPlugin[];
     getItem(type: string): RegisterManagerPlugin;
     check(type: string): boolean;

package/build/esm/utils/update-manager.js

@@ -2,7 +2,7 @@ import update, { extend } from 'immutability-helper';
 import omit from 'lodash/omit';
 import pick from 'lodash/pick';
 import { DEFAULT_NAMESPACE } from '../constants';
-import { META_KEY, addToQueue, deleteFromQueue, getCurrentVersion, getInitialItemsStateAndParamsMeta, getItemsStateAndParamsMeta, isItemWithTabs, mergeParamsWithAliases, pickActionParamsFromParams, resolveItemInnerId, transformParamsToActionParams, } from '../shared';
+import { META_KEY, addGroupToQueue, addToQueue, deleteFromQueue, getCurrentVersion, getInitialItemsStateAndParamsMeta, getItemsStateAndParamsMeta, isItemWithGroup, isItemWithTabs, mergeParamsWithAliases, pickActionParamsFromParams, resolveItemInnerId, transformParamsToActionParams, } from '../shared';
 import { getNewId } from './get-new-id';
 extend('$auto', (value, object) => (object ? update(object, value) : update({}, value)));
 function removeItemVersion1({ id, config, itemsStateAndParams }) {
@@ -86,7 +86,12 @@ function getAllowableChangedParams(item, stateAndParams, itemsStateAndParams, pa
         allowedParams = pick(stateParamsConf, Object.keys((tab === null || tab === void 0 ? void 0 : tab.params) || {}));
     }
     else {
-        allowedParams = pick(stateParamsConf, Object.keys(item.defaults || {}));
+        // check if structure is StringParams or Record<string, StringParams>
+        const paramsConf = typeof (stateParamsConf === null || stateParamsConf === void 0 ? void 0 : stateParamsConf[item.id]) === 'object' &&
+            !Array.isArray(stateParamsConf === null || stateParamsConf === void 0 ? void 0 : stateParamsConf[item.id])
+            ? stateParamsConf[item.id]
+            : stateParamsConf;
+        allowedParams = pick(paramsConf, Object.keys(item.defaults || {}));
     }
     if (Object.keys(allowedParams || {}).length !== Object.keys(stateParamsConf || {}).length) {
         console.warn('Параметры, которых нет в defaults, будут проигнорированы!');
@@ -157,8 +162,54 @@ function getNewItemData({ item, config, counter: argsCounter, salt, options }) {
         });
         data = Object.assign(Object.assign({}, item.data), { tabs });
     }
+    if (isItemWithGroup(item)) {
+        const group = item.data.group.map((groupItem) => {
+            if (groupItem.id) {
+                return groupItem;
+            }
+            const newIdGroupData = getNewId({ config, salt, counter, excludeIds });
+            counter = newIdGroupData.counter;
+            excludeIds.push(newIdGroupData.id);
+            return Object.assign(Object.assign({}, groupItem), { id: newIdGroupData.id, namespace: groupItem.namespace || DEFAULT_NAMESPACE });
+        });
+        data = Object.assign(Object.assign({}, item.data), { group });
+    }
     return { data, counter, excludeIds };
 }
+function changeGroupParams({ groupItemIds, initiatorId, initiatorItem, itemsStateAndParams, stateAndParams, config, unusedIds, }) {
+    var _a;
+    const meta = addGroupToQueue({
+        id: initiatorId,
+        groupItemIds,
+        config,
+        itemsStateAndParams,
+    });
+    const updatedItems = {};
+    const currentItemParams = (_a = itemsStateAndParams[initiatorId]) === null || _a === void 0 ? void 0 : _a.params;
+    for (const groupItem of initiatorItem.data.group) {
+        if (groupItemIds.includes(groupItem.id)) {
+            const allowableParams = getAllowableChangedParams(groupItem, stateAndParams, itemsStateAndParams);
+            const allowableActionParams = getAllowableChangedParams(groupItem, stateAndParams, itemsStateAndParams, { type: 'actionParams', returnPrefix: true });
+            updatedItems[groupItem.id] = Object.assign(Object.assign({}, allowableParams), allowableActionParams);
+            continue;
+        }
+        if (currentItemParams && currentItemParams[groupItem.id]) {
+            updatedItems[groupItem.id] = currentItemParams[groupItem.id];
+        }
+    }
+    const obj = {
+        $unset: unusedIds,
+        [initiatorId]: {
+            $auto: {
+                params: {
+                    $set: updatedItems,
+                },
+            },
+        },
+        [META_KEY]: { $set: meta },
+    };
+    return update(itemsStateAndParams, obj);
+}
 export class UpdateManager {
     static addItem({ item, namespace = DEFAULT_NAMESPACE, layout, config, options, }) {
         const layoutY = Math.max(0, ...config.layout.map(({ h, y }) => h + y));
@@ -195,9 +246,13 @@ export class UpdateManager {
         }
         const itemIndex = config.items.findIndex((item) => item.id === id);
         const item = config.items[itemIndex];
-        const itemIds = isItemWithTabs(item)
-            ? [id].concat(item.data.tabs.map((tab) => tab.id))
-            : [id];
+        let itemIds = [id];
+        if (isItemWithTabs(item)) {
+            itemIds = [id].concat(item.data.tabs.map((tab) => tab.id));
+        }
+        if (isItemWithGroup(item)) {
+            itemIds = [id].concat(item.data.group.map((groupItem) => groupItem.id));
+        }
         const connections = config.connections.filter(({ from, to }) => !itemIds.includes(from) && !itemIds.includes(to));
         return {
             config: update(config, {
@@ -250,6 +305,7 @@ export class UpdateManager {
         const newTabId = (_a = stateAndParams.state) === null || _a === void 0 ? void 0 : _a.tabId;
         const isTabSwitched = isItemWithTabs(initiatorItem) && Boolean(newTabId);
         const currentMeta = getItemsStateAndParamsMeta(itemsStateAndParams);
+        const groupItemIds = options === null || options === void 0 ? void 0 : options.groupItemIds;
         if (action === 'removeItem') {
             return update(itemsStateAndParams, {
                 $unset: [...unusedIds, initiatorId],
@@ -264,6 +320,17 @@ export class UpdateManager {
                 },
             });
         }
+        if (isItemWithGroup(initiatorItem) && groupItemIds) {
+            return changeGroupParams({
+                initiatorId,
+                initiatorItem,
+                groupItemIds,
+                itemsStateAndParams,
+                stateAndParams,
+                config,
+                unusedIds,
+            });
+        }
         if ('params' in stateAndParams) {
             const allowableParams = getAllowableChangedParams(initiatorItem, stateAndParams, itemsStateAndParams);
             const allowableActionParams = getAllowableChangedParams(initiatorItem, stateAndParams, itemsStateAndParams, { type: 'actionParams', returnPrefix: true });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gravity-ui/dashkit",
-  "version": "7.0.0",
+  "version": "7.1.1",
   "description": "Library for rendering dashboard grid layout",
   "license": "MIT",
   "repository": {