@gravity-ui/dashkit 9.2.1-beta → 9.2.1-beta1
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/README.md +1 -1
- package/build/cjs/components/DashKit/DashKit.d.ts +1 -1
- package/build/cjs/components/GridLayout/GridLayout.d.ts +65 -51
- package/build/cjs/components/GridLayout/GridLayout.js +17 -60
- package/build/cjs/components/GridLayout/GridLayout.js.map +1 -1
- package/build/cjs/components/MobileLayout/MobileLayout.d.ts +4 -4
- package/build/cjs/components/MobileLayout/MobileLayout.js.map +1 -1
- package/build/cjs/context/DashKitContext.d.ts +6 -14
- package/build/cjs/context/DashKitContext.js.map +1 -1
- package/build/cjs/typings/config.d.ts +2 -2
- package/build/cjs/typings/config.js.map +1 -1
- package/build/cjs/typings/plugin.d.ts +0 -1
- package/build/cjs/typings/plugin.js.map +1 -1
- package/build/esm/components/DashKit/DashKit.d.ts +1 -1
- package/build/esm/components/GridLayout/GridLayout.d.ts +65 -51
- package/build/esm/components/GridLayout/GridLayout.js +17 -60
- package/build/esm/components/GridLayout/GridLayout.js.map +1 -1
- package/build/esm/components/MobileLayout/MobileLayout.d.ts +4 -4
- package/build/esm/components/MobileLayout/MobileLayout.js.map +1 -1
- package/build/esm/context/DashKitContext.d.ts +6 -14
- package/build/esm/context/DashKitContext.js.map +1 -1
- package/build/esm/typings/config.d.ts +2 -2
- package/build/esm/typings/config.js.map +1 -1
- package/build/esm/typings/plugin.d.ts +0 -1
- package/build/esm/typings/plugin.js.map +1 -1
- package/package.json +1 -1
- package/build/cjs/components/GridLayout/types.d.ts +0 -60
- package/build/cjs/components/GridLayout/types.js +0 -3
- package/build/cjs/components/GridLayout/types.js.map +0 -1
- package/build/esm/components/GridLayout/types.d.ts +0 -60
- package/build/esm/components/GridLayout/types.js +0 -2
- package/build/esm/components/GridLayout/types.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MobileLayout.js","sourceRoot":"../../../../src","sources":["components/MobileLayout/MobileLayout.tsx"],"names":[],"mappings":";;;AAAA,0DAA0B;AAE1B,wEAAqC;
|
|
1
|
+
{"version":3,"file":"MobileLayout.js","sourceRoot":"../../../../src","sources":["components/MobileLayout/MobileLayout.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport groupBy from 'lodash/groupBy';\n\nimport {DEFAULT_GROUP} from '../../constants';\nimport {DashKitContext} from '../../context';\nimport {cn} from '../../utils/cn';\nimport Item from '../Item/Item';\n\nimport {getSortedConfigItems} from './helpers';\n\nimport './MobileLayout.scss';\n\nconst b = cn('dashkit-mobile-layout');\n\ntype MobileLayoutProps = {};\n\ntype MobileLayoutState = {\n itemsWithActiveAutoheight: Record<string, boolean>;\n};\n\ntype PlugibRefObject = React.RefObject<any>;\n\nexport default class MobileLayout extends React.PureComponent<\n MobileLayoutProps,\n MobileLayoutState\n> {\n static contextType = DashKitContext;\n context!: React.ContextType<typeof DashKitContext>;\n\n pluginsRefs: PlugibRefObject[] = [];\n sortedLayoutItems: Record<string, ReturnType<typeof getSortedConfigItems>> | null = null;\n\n _memoLayout = this.context.layout;\n _memoForwardedPluginRef: Array<(refObject: PlugibRefObject) => void> = [];\n _memoAdjustWidgetLayout: Record<string, (props: {needSetDefault: boolean}) => void> = {};\n\n state: MobileLayoutState = {\n itemsWithActiveAutoheight: {},\n };\n\n render() {\n const {\n config,\n layout,\n groups = [{id: DEFAULT_GROUP}],\n context,\n editMode,\n configItems,\n } = this.context;\n\n this.pluginsRefs.length = configItems.length;\n\n const sortedItems = this.getSortedLayoutItems();\n let indexOffset = 0;\n\n return (\n <div className={b()}>\n {groups.map((group) => {\n const groupId = group.id || DEFAULT_GROUP;\n const items = sortedItems[groupId] || [];\n\n const children = items.map((item, index) => {\n const isItemWithActiveAutoheight =\n item.id in this.state.itemsWithActiveAutoheight;\n\n return (\n <div\n className={b('item', {autoheight: isItemWithActiveAutoheight})}\n key={item.id}\n >\n <Item\n id={item.id}\n item={item}\n layout={layout}\n shouldItemUpdate={false}\n adjustWidgetLayout={this.getMemoAdjustWidgetLayout(item.id)}\n forwardedPluginRef={this.getMemoForwardRefCallback(\n indexOffset + index,\n )}\n onItemMountChange={this.context.onItemMountChange}\n onItemRender={this.context.onItemRender}\n />\n </div>\n );\n });\n\n indexOffset += items.length;\n\n if (group.render) {\n return group.render(groupId, children, {\n isMobile: true,\n config,\n context,\n editMode,\n items,\n layout,\n });\n }\n\n return children;\n })}\n </div>\n );\n }\n\n getSortedLayoutItems() {\n if (this.sortedLayoutItems && this.context.layout === this._memoLayout) {\n return this.sortedLayoutItems;\n }\n\n this._memoLayout = this.context.layout;\n\n const hasOrderId = Boolean(this.context.configItems.find((item) => item.orderId));\n\n this.sortedLayoutItems = groupBy(\n getSortedConfigItems(this.context.config, this.context.configItems, hasOrderId),\n (item) => item.parent || DEFAULT_GROUP,\n );\n\n return this.sortedLayoutItems;\n }\n\n getMemoForwardRefCallback(refIndex: number) {\n if (!this._memoForwardedPluginRef[refIndex]) {\n this._memoForwardedPluginRef[refIndex] = (pluginRef: PlugibRefObject) => {\n this.pluginsRefs[refIndex] = pluginRef;\n };\n }\n\n return this._memoForwardedPluginRef[refIndex];\n }\n\n adjustWidgetLayout(id: string, {needSetDefault}: {needSetDefault: boolean}) {\n if (needSetDefault) {\n const indexesOfItemsWithActiveAutoheight = {\n ...this.state.itemsWithActiveAutoheight,\n };\n\n delete indexesOfItemsWithActiveAutoheight[id];\n\n this.setState({itemsWithActiveAutoheight: indexesOfItemsWithActiveAutoheight});\n } else {\n this.setState({\n itemsWithActiveAutoheight: Object.assign({}, this.state.itemsWithActiveAutoheight, {\n [id]: true,\n }),\n });\n }\n }\n\n getMemoAdjustWidgetLayout(id: string) {\n if (!this._memoAdjustWidgetLayout[id]) {\n this._memoAdjustWidgetLayout[id] = this.adjustWidgetLayout.bind(this, id);\n }\n\n return this._memoAdjustWidgetLayout[id];\n }\n}\n"]}
|
|
@@ -1,37 +1,29 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import type { RegisterManager } from "../utils/index.js";
|
|
3
3
|
import type { DashKitProps } from "../components/DashKit/index.js";
|
|
4
|
-
import type { ConfigItem, ConfigLayout,
|
|
5
|
-
import type { PluginRef, ReactGridLayoutProps } from "../typings/index.js";
|
|
4
|
+
import type { ConfigItem, ConfigLayout, ItemParams, ItemState, ItemStateAndParams, ItemStateAndParamsChangeOptions } from "../shared/index.js";
|
|
6
5
|
type DashkitPropsPassedToCtx = Pick<DashKitProps, 'config' | 'groups' | 'context' | 'noOverlay' | 'focusable' | 'globalParams' | 'editMode' | 'settings' | 'onItemMountChange' | 'onItemRender' | 'draggableHandleClassName' | 'onDragStart' | 'onDrag' | 'onDragStop' | 'onResizeStart' | 'onResize' | 'onResizeStop'>;
|
|
7
6
|
type PluginType = string;
|
|
8
|
-
type TemporaryLayout = {
|
|
9
|
-
data: ConfigLayout[];
|
|
10
|
-
dragProps: ItemDragProps;
|
|
11
|
-
};
|
|
12
7
|
export type DashKitCtxShape = DashkitPropsPassedToCtx & {
|
|
13
8
|
registerManager: RegisterManager;
|
|
14
9
|
forwardedMetaRef: React.ForwardedRef<any>;
|
|
15
10
|
configItems: ConfigItem[];
|
|
16
11
|
layout: ConfigLayout[];
|
|
17
|
-
|
|
18
|
-
temporaryLayout: TemporaryLayout | null;
|
|
12
|
+
temporaryLayout: ConfigLayout[] | null;
|
|
19
13
|
memorizeOriginalLayout: (widgetId: string, preAutoHeightLayout: ConfigLayout, postAutoHeightLayout: ConfigLayout) => void;
|
|
20
14
|
revertToOriginalLayout: (widgetId: string) => void;
|
|
21
15
|
itemsState?: Record<string, ItemState>;
|
|
22
16
|
itemsParams: Record<string, ItemParams>;
|
|
23
17
|
onItemStateAndParamsChange: (id: string, stateAndParams: ItemStateAndParams, options: ItemStateAndParamsChangeOptions) => void;
|
|
24
|
-
getItemsMeta: (pluginsRefs: Array<
|
|
25
|
-
reloadItems: (pluginsRefs: Array<
|
|
18
|
+
getItemsMeta: (pluginsRefs: Array<React.RefObject<any>>) => Array<Promise<any>>;
|
|
19
|
+
reloadItems: (pluginsRefs: Array<React.RefObject<any>>, data: {
|
|
26
20
|
silentLoading: boolean;
|
|
27
21
|
noVeil: boolean;
|
|
28
22
|
}) => void;
|
|
29
|
-
onDrop: (newLayout: ConfigLayout
|
|
30
|
-
onDropDragOver: (e: DragEvent | MouseEvent, group: string | void, gridProps: ReactGridLayoutProps
|
|
23
|
+
onDrop: (newLayout: ConfigLayout, item: ConfigItem) => void;
|
|
24
|
+
onDropDragOver: (e: DragEvent | MouseEvent, group: string | void, gridProps: Partial<ReactGridLayout.ReactGridLayoutProps>, groupLayout: ConfigLayout[], sharedItem: (Partial<ConfigLayout> & {
|
|
31
25
|
type: PluginType;
|
|
32
26
|
}) | void) => void | boolean;
|
|
33
|
-
onItemBlur: (item: ConfigItem) => void;
|
|
34
|
-
onItemFocus: (item: ConfigItem) => void;
|
|
35
27
|
outerDnDEnable: boolean;
|
|
36
28
|
dragOverPlugin: null | PluginType;
|
|
37
29
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DashKitContext.js","sourceRoot":"../../../src","sources":["context/DashKitContext.ts"],"names":[],"mappings":";;;;AAAA,0DAA0B;
|
|
1
|
+
{"version":3,"file":"DashKitContext.js","sourceRoot":"../../../src","sources":["context/DashKitContext.ts"],"names":[],"mappings":";;;;AAAA,0DAA0B;AA6E1B,MAAM,cAAc,GAAG,eAAK,CAAC,aAAa,CAAkB,EAAqB,CAAC,CAAC;AAE3E,wCAAc","sourcesContent":["import React from 'react';\n\nimport type {RegisterManager} from '..//utils';\nimport type {DashKitProps} from '../components/DashKit';\nimport type {\n ConfigItem,\n ConfigLayout,\n ItemParams,\n ItemState,\n ItemStateAndParams,\n ItemStateAndParamsChangeOptions,\n} from '../shared';\n\ntype DashkitPropsPassedToCtx = Pick<\n DashKitProps,\n | 'config'\n | 'groups'\n | 'context'\n | 'noOverlay'\n | 'focusable'\n | 'globalParams'\n | 'editMode'\n | 'settings'\n | 'onItemMountChange'\n | 'onItemRender'\n | 'draggableHandleClassName'\n // default handlers bypass\n | 'onDragStart'\n | 'onDrag'\n | 'onDragStop'\n | 'onResizeStart'\n | 'onResize'\n | 'onResizeStop'\n>;\n\ntype PluginType = string;\n\nexport type DashKitCtxShape = DashkitPropsPassedToCtx & {\n registerManager: RegisterManager;\n forwardedMetaRef: React.ForwardedRef<any>;\n\n configItems: ConfigItem[];\n layout: ConfigLayout[];\n temporaryLayout: ConfigLayout[] | null;\n memorizeOriginalLayout: (\n widgetId: string,\n preAutoHeightLayout: ConfigLayout,\n postAutoHeightLayout: ConfigLayout,\n ) => void;\n revertToOriginalLayout: (widgetId: string) => void;\n\n itemsState?: Record<string, ItemState>;\n itemsParams: Record<string, ItemParams>;\n onItemStateAndParamsChange: (\n id: string,\n stateAndParams: ItemStateAndParams,\n options: ItemStateAndParamsChangeOptions,\n ) => void;\n\n getItemsMeta: (pluginsRefs: Array<React.RefObject<any>>) => Array<Promise<any>>;\n reloadItems: (\n pluginsRefs: Array<React.RefObject<any>>,\n data: {silentLoading: boolean; noVeil: boolean},\n ) => void;\n\n onDrop: (newLayout: ConfigLayout, item: ConfigItem) => void;\n onDropDragOver: (\n e: DragEvent | MouseEvent,\n group: string | void,\n gridProps: Partial<ReactGridLayout.ReactGridLayoutProps>,\n groupLayout: ConfigLayout[],\n sharedItem: (Partial<ConfigLayout> & {type: PluginType}) | void,\n ) => void | boolean;\n outerDnDEnable: boolean;\n dragOverPlugin: null | PluginType;\n};\n\nconst DashKitContext = React.createContext<DashKitCtxShape>({} as DashKitCtxShape);\n\nexport {DashKitContext};\n"]}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type { Layout } from 'react-grid-layout';
|
|
1
|
+
import type { Layout, Layouts } from 'react-grid-layout';
|
|
2
2
|
import type { Config, ConfigItem, ConfigLayout } from "../shared/index.js";
|
|
3
3
|
import { GridLayoutSettings } from "./common.js";
|
|
4
4
|
export interface AddConfigItem extends Omit<ConfigItem, 'id' | 'namespace'> {
|
|
@@ -42,7 +42,7 @@ export interface DashKitGroup {
|
|
|
42
42
|
gridProperties?: (props: ReactGridLayoutProps) => ReactGridLayoutProps;
|
|
43
43
|
}
|
|
44
44
|
export type ItemManipulationCallback = (eventData: {
|
|
45
|
-
layout:
|
|
45
|
+
layout: Layouts;
|
|
46
46
|
oldItem: Layout;
|
|
47
47
|
newItem: Layout;
|
|
48
48
|
placeholder: Layout;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"config.js","sourceRoot":"../../../src","sources":["typings/config.ts"],"names":[],"mappings":"","sourcesContent":["import type {Layout} from 'react-grid-layout';\n\nimport type {Config, ConfigItem, ConfigLayout} from '../shared';\n\nimport {GridLayoutSettings} from './common';\n\nexport interface AddConfigItem extends Omit<ConfigItem, 'id' | 'namespace'> {\n id?: null;\n namespace?: string;\n layout?: Omit<ConfigLayout, 'i'>;\n}\nexport type SetConfigItem = ConfigItem | AddConfigItem;\n\nexport type SetItemOptions = {\n excludeIds?: string[];\n useGlobalItems?: boolean;\n};\n\nexport type GridReflowOptions = {\n cols: number;\n maxRows?: number;\n compactType?: CompactType;\n};\n\nexport type CompactType = ReactGridLayout.ReactGridLayoutProps['compactType'] | 'horizontal-nowrap';\n\nexport type ReflowLayoutOptions = {\n defaultProps: GridReflowOptions;\n groups?: Record<string, GridReflowOptions>;\n};\n\nexport type AddNewItemOptions = SetItemOptions & {\n updateLayout?: ConfigLayout[];\n reflowLayoutOptions?: ReflowLayoutOptions;\n};\n\nexport interface DashkitGroupRenderProps {\n config: Config;\n editMode: boolean;\n isMobile: boolean;\n items: ConfigItem[];\n layout: ConfigLayout[];\n context: any;\n}\n\nexport type ReactGridLayoutProps = Omit<\n GridLayoutSettings,\n | 'children'\n | 'compactType'\n | 'innerRef'\n | 'key'\n | 'layout'\n | 'onDragStart'\n | 'onDragStop'\n | 'onResizeStart'\n | 'onResizeStop'\n | 'draggableHandle'\n | 'isDroppable'\n | 'onDropDragOver'\n | 'onDrop'\n | 'draggableCancel'\n> & {\n compactType?: CompactType;\n};\n\nexport interface DashKitGroup {\n id?: string;\n render?: (\n id: string,\n children: React.ReactNode,\n props: DashkitGroupRenderProps,\n ) => React.ReactNode;\n gridProperties?: (props: ReactGridLayoutProps) => ReactGridLayoutProps;\n}\n\nexport type ItemManipulationCallback = (eventData: {\n layout:
|
|
1
|
+
{"version":3,"file":"config.js","sourceRoot":"../../../src","sources":["typings/config.ts"],"names":[],"mappings":"","sourcesContent":["import type {Layout, Layouts} from 'react-grid-layout';\n\nimport type {Config, ConfigItem, ConfigLayout} from '../shared';\n\nimport {GridLayoutSettings} from './common';\n\nexport interface AddConfigItem extends Omit<ConfigItem, 'id' | 'namespace'> {\n id?: null;\n namespace?: string;\n layout?: Omit<ConfigLayout, 'i'>;\n}\nexport type SetConfigItem = ConfigItem | AddConfigItem;\n\nexport type SetItemOptions = {\n excludeIds?: string[];\n useGlobalItems?: boolean;\n};\n\nexport type GridReflowOptions = {\n cols: number;\n maxRows?: number;\n compactType?: CompactType;\n};\n\nexport type CompactType = ReactGridLayout.ReactGridLayoutProps['compactType'] | 'horizontal-nowrap';\n\nexport type ReflowLayoutOptions = {\n defaultProps: GridReflowOptions;\n groups?: Record<string, GridReflowOptions>;\n};\n\nexport type AddNewItemOptions = SetItemOptions & {\n updateLayout?: ConfigLayout[];\n reflowLayoutOptions?: ReflowLayoutOptions;\n};\n\nexport interface DashkitGroupRenderProps {\n config: Config;\n editMode: boolean;\n isMobile: boolean;\n items: ConfigItem[];\n layout: ConfigLayout[];\n context: any;\n}\n\nexport type ReactGridLayoutProps = Omit<\n GridLayoutSettings,\n | 'children'\n | 'compactType'\n | 'innerRef'\n | 'key'\n | 'layout'\n | 'onDragStart'\n | 'onDragStop'\n | 'onResizeStart'\n | 'onResizeStop'\n | 'draggableHandle'\n | 'isDroppable'\n | 'onDropDragOver'\n | 'onDrop'\n | 'draggableCancel'\n> & {\n compactType?: CompactType;\n};\n\nexport interface DashKitGroup {\n id?: string;\n render?: (\n id: string,\n children: React.ReactNode,\n props: DashkitGroupRenderProps,\n ) => React.ReactNode;\n gridProperties?: (props: ReactGridLayoutProps) => ReactGridLayoutProps;\n}\n\nexport type ItemManipulationCallback = (eventData: {\n layout: Layouts;\n oldItem: Layout;\n newItem: Layout;\n placeholder: Layout;\n e: MouseEvent;\n element: HTMLElement;\n}) => void;\n"]}
|
|
@@ -25,7 +25,6 @@ export interface PluginWidgetProps<T = StringParams> {
|
|
|
25
25
|
}) => void;
|
|
26
26
|
}
|
|
27
27
|
export type PluginDefaultLayout = Partial<Omit<WidgetLayout, 'i'>>;
|
|
28
|
-
export type PluginRef = React.RefObject<any> | Record<string, unknown>;
|
|
29
28
|
export interface Plugin<P extends PluginWidgetProps<T> = any, T = StringParams> extends PluginBase {
|
|
30
29
|
defaultLayout?: PluginDefaultLayout;
|
|
31
30
|
renderer: (props: P, forwardedRef: React.RefObject<any>) => React.ReactNode;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"plugin.js","sourceRoot":"../../../src","sources":["typings/plugin.ts"],"names":[],"mappings":"","sourcesContent":["import React from 'react';\n\nimport ReactGridLayout from 'react-grid-layout';\n\nimport type {\n ConfigItem,\n ItemState,\n ItemStateAndParams,\n ItemStateAndParamsChangeOptions,\n PluginBase,\n StringParams,\n} from '../shared';\n\nimport type {ContextProps, SettingsProps, WidgetLayout} from './common';\n\nexport interface PluginWidgetProps<T = StringParams> {\n id: string;\n editMode: boolean;\n params: T;\n state: ItemState;\n onStateAndParamsChange: (\n stateAndParams: ItemStateAndParams,\n options?: ItemStateAndParamsChangeOptions,\n ) => void;\n onBeforeLoad: () => () => void;\n width: number;\n height: number;\n data: ConfigItem['data'];\n defaults: ConfigItem['defaults'];\n namespace: ConfigItem['namespace'];\n settings: SettingsProps;\n context: ContextProps;\n layout: WidgetLayout[];\n gridLayout: ReactGridLayout.ReactGridLayoutProps;\n adjustWidgetLayout: (data: {\n widgetId: string;\n needSetDefault?: boolean;\n adjustedWidgetLayout?: WidgetLayout;\n }) => void;\n}\n\nexport type PluginDefaultLayout = Partial<Omit<WidgetLayout, 'i'>>;\n\nexport
|
|
1
|
+
{"version":3,"file":"plugin.js","sourceRoot":"../../../src","sources":["typings/plugin.ts"],"names":[],"mappings":"","sourcesContent":["import React from 'react';\n\nimport ReactGridLayout from 'react-grid-layout';\n\nimport type {\n ConfigItem,\n ItemState,\n ItemStateAndParams,\n ItemStateAndParamsChangeOptions,\n PluginBase,\n StringParams,\n} from '../shared';\n\nimport type {ContextProps, SettingsProps, WidgetLayout} from './common';\n\nexport interface PluginWidgetProps<T = StringParams> {\n id: string;\n editMode: boolean;\n params: T;\n state: ItemState;\n onStateAndParamsChange: (\n stateAndParams: ItemStateAndParams,\n options?: ItemStateAndParamsChangeOptions,\n ) => void;\n onBeforeLoad: () => () => void;\n width: number;\n height: number;\n data: ConfigItem['data'];\n defaults: ConfigItem['defaults'];\n namespace: ConfigItem['namespace'];\n settings: SettingsProps;\n context: ContextProps;\n layout: WidgetLayout[];\n gridLayout: ReactGridLayout.ReactGridLayoutProps;\n adjustWidgetLayout: (data: {\n widgetId: string;\n needSetDefault?: boolean;\n adjustedWidgetLayout?: WidgetLayout;\n }) => void;\n}\n\nexport type PluginDefaultLayout = Partial<Omit<WidgetLayout, 'i'>>;\n\nexport interface Plugin<P extends PluginWidgetProps<T> = any, T = StringParams> extends PluginBase {\n defaultLayout?: PluginDefaultLayout;\n renderer: (props: P, forwardedRef: React.RefObject<any>) => React.ReactNode;\n placeholderRenderer?: (props: P, forwardedRef: React.RefObject<any>) => React.ReactNode;\n}\n"]}
|
|
@@ -73,7 +73,7 @@ export declare class DashKit extends React.PureComponent<DashKitInnerProps> {
|
|
|
73
73
|
}): ConfigLayout[];
|
|
74
74
|
metaRef: React.RefObject<GridLayout>;
|
|
75
75
|
render(): JSX.Element;
|
|
76
|
-
getItemsMeta():
|
|
76
|
+
getItemsMeta(): any;
|
|
77
77
|
reloadItems(options?: {
|
|
78
78
|
targetIds?: string[];
|
|
79
79
|
force?: boolean;
|
|
@@ -1,59 +1,73 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
private _memoGroupsLayouts;
|
|
13
|
-
private _memoCallbacksForGroups;
|
|
14
|
-
private _timeout?;
|
|
15
|
-
private _lastReloadAt?;
|
|
16
|
-
private _parendDragNode;
|
|
17
|
-
constructor(props: GridLayoutProps, context: DashKitCtxShape);
|
|
1
|
+
export default class GridLayout extends React.PureComponent<any, any, any> {
|
|
2
|
+
static contextType: React.Context<import("../../context/index.js").DashKitCtxShape>;
|
|
3
|
+
constructor(props: any, context: any);
|
|
4
|
+
pluginsRefs: any[];
|
|
5
|
+
state: {
|
|
6
|
+
isDragging: boolean;
|
|
7
|
+
isDraggedOut: boolean;
|
|
8
|
+
isPageHidden: boolean;
|
|
9
|
+
currentDraggingElement: null;
|
|
10
|
+
draggedOverGroup: null;
|
|
11
|
+
};
|
|
18
12
|
componentDidMount(): void;
|
|
19
13
|
componentDidUpdate(): void;
|
|
20
14
|
componentWillUnmount(): void;
|
|
15
|
+
_memoCallbacksForGroups: {};
|
|
16
|
+
_memoGroupsProps: {};
|
|
17
|
+
_memoGroupsLayouts: {};
|
|
18
|
+
_memoForwardedPluginRef: any[];
|
|
19
|
+
_timeout: any;
|
|
20
|
+
_lastReloadAt: any;
|
|
21
21
|
onVisibilityChange: () => void;
|
|
22
|
-
adjustWidgetLayout: ({ widgetId, needSetDefault, adjustedWidgetLayout
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
22
|
+
adjustWidgetLayout: ({ widgetId, needSetDefault, adjustedWidgetLayout }: {
|
|
23
|
+
widgetId: any;
|
|
24
|
+
needSetDefault: any;
|
|
25
|
+
adjustedWidgetLayout: any;
|
|
26
|
+
}) => void;
|
|
27
|
+
getItemsMeta: () => any;
|
|
28
|
+
getActiveLayout(): any;
|
|
29
|
+
getMemoGroupLayout(group: any, layout: any): any;
|
|
30
|
+
getMemoGroupCallbacks(group: any): any;
|
|
31
|
+
getMemoGroupProps: (group: any, renderLayout: any, properties: any) => {
|
|
32
|
+
layout: any;
|
|
33
|
+
callbacks: any;
|
|
34
|
+
};
|
|
35
|
+
getLayoutAndPropsByGroup: (group: any) => {
|
|
36
|
+
properties: any;
|
|
37
|
+
layout: any;
|
|
30
38
|
};
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
39
|
+
getMemoForwardRefCallback: (refIndex: any) => any;
|
|
40
|
+
mergeGroupsLayout(group: any, newLayout: any, temporaryItem: any): any;
|
|
41
|
+
reloadItems(options: any): void;
|
|
42
|
+
prepareDefaultArguments(group: any, layout: any, oldItem: any, newItem: any, placeholder: any, e: any, element: any): {
|
|
43
|
+
group: any;
|
|
44
|
+
layout: any;
|
|
45
|
+
oldItem: any;
|
|
46
|
+
newItem: any;
|
|
47
|
+
placeholder: any;
|
|
48
|
+
e: any;
|
|
49
|
+
element: any;
|
|
50
|
+
};
|
|
51
|
+
updateDraggingElementState(group: any, layoutItem: any, e: any): void;
|
|
52
|
+
_initDragCoordinatesWatcher(element: any): void;
|
|
53
|
+
_parendDragNode: any;
|
|
54
|
+
_forceCursorCapture(parentElement: any, position: any, parentRect: any): void;
|
|
55
|
+
_updateDragCoordinates(e: any): void;
|
|
43
56
|
_resetDragWatcher(): void;
|
|
44
|
-
_onDragStart(group:
|
|
45
|
-
_onDrag(group:
|
|
46
|
-
_onDragStop(group:
|
|
47
|
-
_onResizeStart(group:
|
|
48
|
-
_onResize(group:
|
|
49
|
-
_onResizeStop(group:
|
|
57
|
+
_onDragStart(group: any, _newLayout: any, layoutItem: any, _newItem: any, _placeholder: any, e: any, element: any): void;
|
|
58
|
+
_onDrag(group: any, layout: any, oldItem: any, newItem: any, placeholder: any, e: any, element: any): void;
|
|
59
|
+
_onDragStop(group: any, layout: any, oldItem: any, newItem: any, placeholder: any, e: any, element: any): void;
|
|
60
|
+
_onResizeStart(group: any, layout: any, oldItem: any, newItem: any, placeholder: any, e: any, element: any): void;
|
|
61
|
+
_onResize(group: any, layout: any, oldItem: any, newItem: any, placeholder: any, e: any, element: any): void;
|
|
62
|
+
_onResizeStop(group: any, layout: any, oldItem: any, newItem: any, placeholder: any, e: any, element: any): void;
|
|
50
63
|
_onTargetRestore(): void;
|
|
51
|
-
_onStop: (group:
|
|
52
|
-
_onSharedDrop: (targetGroup:
|
|
53
|
-
_onExternalDrop: (group:
|
|
54
|
-
_onDrop: (group:
|
|
55
|
-
_onDropDragOver: (group:
|
|
56
|
-
renderTemporaryPlaceholder(gridLayout:
|
|
57
|
-
renderGroup(group:
|
|
58
|
-
render():
|
|
64
|
+
_onStop: (group: any, newLayout: any) => void;
|
|
65
|
+
_onSharedDrop: (targetGroup: any, newLayout: any, tempItem: any) => void;
|
|
66
|
+
_onExternalDrop: (group: any, newLayout: any, item: any, e: any) => void;
|
|
67
|
+
_onDrop: (group: any, newLayout: any, item: any, e: any) => false | undefined;
|
|
68
|
+
_onDropDragOver: (group: any, e: any) => any;
|
|
69
|
+
renderTemporaryPlaceholder(gridLayout: any): JSX.Element | null;
|
|
70
|
+
renderGroup(group: any, renderLayout: any, renderItems: any, offset: number | undefined, groupGridProperties: any): JSX.Element;
|
|
71
|
+
render(): any;
|
|
59
72
|
}
|
|
73
|
+
import React from 'react';
|
|
@@ -4,13 +4,6 @@ import { DashKitContext } from "../../context/index.js";
|
|
|
4
4
|
import { resolveLayoutGroup } from "../../utils/index.js";
|
|
5
5
|
import GridItem from "../GridItem/GridItem.js";
|
|
6
6
|
import { Layout } from "./ReactGridLayout.js";
|
|
7
|
-
const hasPluginId = (value) => {
|
|
8
|
-
return ('props' in value &&
|
|
9
|
-
typeof value.props === 'object' &&
|
|
10
|
-
value.props !== null &&
|
|
11
|
-
'id' in value.props &&
|
|
12
|
-
typeof value.props.id === 'string');
|
|
13
|
-
};
|
|
14
7
|
class GridLayout extends React.PureComponent {
|
|
15
8
|
constructor(props, context) {
|
|
16
9
|
super(props, context);
|
|
@@ -18,13 +11,12 @@ class GridLayout extends React.PureComponent {
|
|
|
18
11
|
this._memoGroupsProps = {};
|
|
19
12
|
this._memoGroupsLayouts = {};
|
|
20
13
|
this._memoCallbacksForGroups = {};
|
|
21
|
-
this._parendDragNode = null;
|
|
22
14
|
this.onVisibilityChange = () => {
|
|
23
15
|
this.setState({
|
|
24
16
|
isPageHidden: document.hidden,
|
|
25
17
|
});
|
|
26
18
|
};
|
|
27
|
-
this.adjustWidgetLayout = ({ widgetId, needSetDefault, adjustedWidgetLayout
|
|
19
|
+
this.adjustWidgetLayout = ({ widgetId, needSetDefault, adjustedWidgetLayout }) => {
|
|
28
20
|
const { layout, memorizeOriginalLayout, revertToOriginalLayout } = this.context;
|
|
29
21
|
if (needSetDefault) {
|
|
30
22
|
revertToOriginalLayout(widgetId);
|
|
@@ -79,10 +71,7 @@ class GridLayout extends React.PureComponent {
|
|
|
79
71
|
draggedOverGroup: null,
|
|
80
72
|
});
|
|
81
73
|
if (temporaryLayout) {
|
|
82
|
-
|
|
83
|
-
if (onDrop && temporaryItem) {
|
|
84
|
-
onDrop(groupedLayout, temporaryItem);
|
|
85
|
-
}
|
|
74
|
+
onDrop === null || onDrop === void 0 ? void 0 : onDrop(groupedLayout, groupedLayout.find(({ i }) => i === TEMPORARY_ITEM_ID));
|
|
86
75
|
}
|
|
87
76
|
else {
|
|
88
77
|
layoutChange(groupedLayout);
|
|
@@ -223,7 +212,7 @@ class GridLayout extends React.PureComponent {
|
|
|
223
212
|
const onResizeStop = this._onResizeStop.bind(this, group);
|
|
224
213
|
const onDrop = this._onDrop.bind(this, group);
|
|
225
214
|
const onDropDragOver = this._onDropDragOver.bind(this, group);
|
|
226
|
-
const onDragTargetRestore = this._onTargetRestore.bind(this);
|
|
215
|
+
const onDragTargetRestore = this._onTargetRestore.bind(this, group);
|
|
227
216
|
this._memoCallbacksForGroups[group] = {
|
|
228
217
|
onDragStart,
|
|
229
218
|
onDrag,
|
|
@@ -245,8 +234,7 @@ class GridLayout extends React.PureComponent {
|
|
|
245
234
|
return memo;
|
|
246
235
|
}, temporaryItem ? { [temporaryItem.i]: temporaryItem } : {});
|
|
247
236
|
const newItemsLayoutById = newLayout.reduce((memo, item) => {
|
|
248
|
-
|
|
249
|
-
const parent = (_a = itemsByGroup[item.i]) === null || _a === void 0 ? void 0 : _a.parent;
|
|
237
|
+
const parent = itemsByGroup[item.i].parent;
|
|
250
238
|
memo[item.i] = Object.assign({}, item);
|
|
251
239
|
if (parent) {
|
|
252
240
|
memo[item.i].parent = parent;
|
|
@@ -267,19 +255,19 @@ class GridLayout extends React.PureComponent {
|
|
|
267
255
|
const { isPageHidden } = this.state;
|
|
268
256
|
const autoupdateIntervalMs = Number(autoupdateInterval) * 1000;
|
|
269
257
|
const targetPlugins = targetIds
|
|
270
|
-
? this.pluginsRefs.filter((plugin) =>
|
|
258
|
+
? this.pluginsRefs.filter((plugin) => targetIds.includes(plugin.props.id))
|
|
271
259
|
: this.pluginsRefs;
|
|
272
260
|
if (autoupdateIntervalMs) {
|
|
273
261
|
const timeSinceLastReload = new Date().getTime() - (this._lastReloadAt || 0);
|
|
274
262
|
const reloadIntervalRemains = autoupdateIntervalMs - timeSinceLastReload;
|
|
275
263
|
if (force || (!isPageHidden && !editMode && reloadIntervalRemains <= 0)) {
|
|
276
264
|
this._lastReloadAt = new Date().getTime();
|
|
277
|
-
reloadItems(targetPlugins, { silentLoading
|
|
265
|
+
reloadItems(targetPlugins, { silentLoading, noVeil: true });
|
|
278
266
|
}
|
|
279
267
|
this._timeout = setTimeout(() => this.reloadItems(), reloadIntervalRemains <= 0 ? autoupdateIntervalMs : reloadIntervalRemains);
|
|
280
268
|
}
|
|
281
269
|
else if (force) {
|
|
282
|
-
reloadItems(targetPlugins, { silentLoading
|
|
270
|
+
reloadItems(targetPlugins, { silentLoading, noVeil: true });
|
|
283
271
|
}
|
|
284
272
|
}
|
|
285
273
|
prepareDefaultArguments(group, layout, oldItem, newItem, placeholder, e, element) {
|
|
@@ -301,15 +289,11 @@ class GridLayout extends React.PureComponent {
|
|
|
301
289
|
const item = temporaryLayout
|
|
302
290
|
? temporaryLayout.dragProps
|
|
303
291
|
: this.context.configItems.find(({ id }) => id === layoutId);
|
|
304
|
-
if (!item) {
|
|
305
|
-
return;
|
|
306
|
-
}
|
|
307
292
|
let { offsetX, offsetY } = e.nativeEvent || {};
|
|
308
293
|
if (offsetX === undefined || offsetY === undefined) {
|
|
309
|
-
const
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
offsetY = e.clientY - ((gridRect === null || gridRect === void 0 ? void 0 : gridRect.top) || 0);
|
|
294
|
+
const gridRect = e.currentTarget.getBoundingClientRect();
|
|
295
|
+
offsetX = e.clientX - gridRect.left;
|
|
296
|
+
offsetY = e.clientY - gridRect.top;
|
|
313
297
|
}
|
|
314
298
|
currentDraggingElement = {
|
|
315
299
|
group,
|
|
@@ -347,9 +331,6 @@ class GridLayout extends React.PureComponent {
|
|
|
347
331
|
}
|
|
348
332
|
_updateDragCoordinates(e) {
|
|
349
333
|
const parent = this._parendDragNode;
|
|
350
|
-
if (!parent) {
|
|
351
|
-
return;
|
|
352
|
-
}
|
|
353
334
|
const parentRect = parent.getBoundingClientRect();
|
|
354
335
|
const { clientX, clientY } = e;
|
|
355
336
|
let isDraggedOut = this.state.isDraggedOut;
|
|
@@ -435,10 +416,7 @@ class GridLayout extends React.PureComponent {
|
|
|
435
416
|
}
|
|
436
417
|
const id = TEMPORARY_ITEM_ID;
|
|
437
418
|
const { type } = temporaryLayout.dragProps;
|
|
438
|
-
return (React.createElement(GridItem, { key: id,
|
|
439
|
-
// TODO remove the expected error after translating GridItem to TS
|
|
440
|
-
// @ts-expect-error
|
|
441
|
-
id: id, item: { id, type, data: {} }, layout: temporaryLayout.data, adjustWidgetLayout: this.adjustWidgetLayout, isDragging: this.state.isDragging, isPlaceholder: true, noOverlay: noOverlay, withCustomHandle: Boolean(draggableHandleClassName), gridLayout: gridLayout }));
|
|
419
|
+
return (React.createElement(GridItem, { key: id, id: id, item: { id, type, data: {} }, layout: temporaryLayout.data, adjustWidgetLayout: this.adjustWidgetLayout, isDragging: this.state.isDragging, isPlaceholder: true, noOverlay: noOverlay, withCustomHandle: Boolean(draggableHandleClassName), gridLayout: gridLayout }));
|
|
442
420
|
}
|
|
443
421
|
renderGroup(group, renderLayout, renderItems, offset = 0, groupGridProperties) {
|
|
444
422
|
const { registerManager, editMode, noOverlay, focusable, draggableHandleClassName, outerDnDEnable, onItemMountChange, onItemRender, onItemFocus, onItemBlur, } = this.context;
|
|
@@ -457,43 +435,22 @@ class GridLayout extends React.PureComponent {
|
|
|
457
435
|
group === currentDraggingElement.group &&
|
|
458
436
|
draggedOverGroup !== null &&
|
|
459
437
|
draggedOverGroup !== group;
|
|
460
|
-
return (React.createElement(Layout, Object.assign({
|
|
438
|
+
return (React.createElement(Layout, Object.assign({ isDraggable: editMode, isResizable: editMode }, properties, { key: `group_${group}`,
|
|
461
439
|
// Layout props
|
|
462
|
-
compactType,
|
|
463
|
-
layout, draggableCancel: `.${DRAGGABLE_CANCEL_CLASS_NAME}`, draggableHandle: draggableHandleClassName
|
|
464
|
-
? `.${draggableHandleClassName}`
|
|
465
|
-
: null,
|
|
440
|
+
compactType: compactType, layout: layout, draggableCancel: `.${DRAGGABLE_CANCEL_CLASS_NAME}`, draggableHandle: draggableHandleClassName ? `.${draggableHandleClassName}` : null,
|
|
466
441
|
// Default callbacks
|
|
467
442
|
onDragStart: callbacks.onDragStart, onDrag: callbacks.onDrag, onDragStop: callbacks.onDragStop, onResizeStart: callbacks.onResizeStart, onResize: callbacks.onResize, onResizeStop: callbacks.onResizeStop,
|
|
468
443
|
// External Drag N Drop options
|
|
469
|
-
onDragTargetRestore: callbacks.onDragTargetRestore, onDropDragOver: callbacks.onDropDragOver, onDrop: callbacks.onDrop, hasSharedDragItem, sharedDragPosition: currentDraggingElement === null || currentDraggingElement === void 0 ? void 0 : currentDraggingElement.cursorPosition, isDragCaptured, isDroppable: Boolean(outerDnDEnable) && editMode })
|
|
444
|
+
onDragTargetRestore: callbacks.onDragTargetRestore, onDropDragOver: callbacks.onDropDragOver, onDrop: callbacks.onDrop, hasSharedDragItem: hasSharedDragItem, sharedDragPosition: currentDraggingElement === null || currentDraggingElement === void 0 ? void 0 : currentDraggingElement.cursorPosition, isDragCaptured: isDragCaptured, isDroppable: Boolean(outerDnDEnable) && editMode }),
|
|
470
445
|
renderItems.map((item, i) => {
|
|
471
446
|
const keyId = item.id;
|
|
472
447
|
const isDragging = this.state.isDragging;
|
|
473
|
-
const isCurrentDraggedItem = currentDraggingElement
|
|
474
|
-
'id' in currentDraggingElement.item &&
|
|
475
|
-
currentDraggingElement.item.id === keyId;
|
|
448
|
+
const isCurrentDraggedItem = (currentDraggingElement === null || currentDraggingElement === void 0 ? void 0 : currentDraggingElement.item.id) === keyId;
|
|
476
449
|
const isDraggedOut = isCurrentDraggedItem && this.state.isDraggedOut;
|
|
477
450
|
const itemNoOverlay = hasOwnGroupProperties && 'noOverlay' in properties
|
|
478
451
|
? properties.noOverlay
|
|
479
452
|
: noOverlay;
|
|
480
|
-
return (React.createElement(GridItem,
|
|
481
|
-
forwardedPluginRef: this.getMemoForwardRefCallback(offset + i),
|
|
482
|
-
id: keyId,
|
|
483
|
-
item,
|
|
484
|
-
layout,
|
|
485
|
-
adjustWidgetLayout: this.adjustWidgetLayout,
|
|
486
|
-
isDragging,
|
|
487
|
-
isDraggedOut,
|
|
488
|
-
noOverlay: itemNoOverlay,
|
|
489
|
-
focusable,
|
|
490
|
-
withCustomHandle: Boolean(draggableHandleClassName),
|
|
491
|
-
onItemMountChange,
|
|
492
|
-
onItemRender,
|
|
493
|
-
gridLayout: properties,
|
|
494
|
-
onItemFocus,
|
|
495
|
-
onItemBlur,
|
|
496
|
-
})));
|
|
453
|
+
return (React.createElement(GridItem, { forwardedPluginRef: this.getMemoForwardRefCallback(offset + i), key: keyId, id: keyId, item: item, layout: layout, adjustWidgetLayout: this.adjustWidgetLayout, isDragging: isDragging, isDraggedOut: isDraggedOut, noOverlay: itemNoOverlay, focusable: focusable, withCustomHandle: Boolean(draggableHandleClassName), onItemMountChange: onItemMountChange, onItemRender: onItemRender, gridLayout: properties, onItemFocus: onItemFocus, onItemBlur: onItemBlur }));
|
|
497
454
|
}),
|
|
498
455
|
this.renderTemporaryPlaceholder(properties)));
|
|
499
456
|
}
|
|
@@ -515,7 +472,7 @@ class GridLayout extends React.PureComponent {
|
|
|
515
472
|
defaultRenderLayout.push(item);
|
|
516
473
|
}
|
|
517
474
|
return memo;
|
|
518
|
-
},
|
|
475
|
+
}, []);
|
|
519
476
|
const itemsByGroup = this.context.configItems.reduce((memo, item) => {
|
|
520
477
|
const group = layoutMap[item.id];
|
|
521
478
|
if (group) {
|