@gravity-ui/dashkit 8.14.1-beta.0 → 8.15.0-beta.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/build/cjs/components/ActionPanel/ActionPanel.js +2 -2
- package/build/cjs/components/ActionPanel/types.d.ts +2 -2
- package/build/cjs/components/GridLayout/GridLayout.js +2 -1
- package/build/cjs/components/OverlayControls/OverlayControls.js +4 -2
- package/build/cjs/constants/common.d.ts +1 -0
- package/build/cjs/constants/common.js +2 -1
- package/build/esm/components/ActionPanel/ActionPanel.js +2 -2
- package/build/esm/components/ActionPanel/types.d.ts +2 -2
- package/build/esm/components/GridLayout/GridLayout.js +3 -2
- package/build/esm/components/OverlayControls/OverlayControls.js +5 -3
- package/build/esm/constants/common.d.ts +1 -0
- package/build/esm/constants/common.js +1 -0
- package/package.json +1 -1
|
@@ -20,10 +20,10 @@ const ActionPanel = (props) => {
|
|
|
20
20
|
const isAnimated = (_b = props.toggleAnimation) !== null && _b !== void 0 ? _b : false;
|
|
21
21
|
const nodeRef = react_1.default.useRef(null);
|
|
22
22
|
const content = (react_1.default.createElement("div", { ref: nodeRef, className: b(null, props.className) }, props.items.map((_a) => {
|
|
23
|
-
var {
|
|
23
|
+
var { wrapTo } = _a, item = tslib_1.__rest(_a, ["wrapTo"]);
|
|
24
24
|
const key = `dk-action-panel-${item.id}`;
|
|
25
25
|
const children = react_1.default.createElement(exports.ActionPanelItemContainer, { key: key, item: item });
|
|
26
|
-
return
|
|
26
|
+
return wrapTo ? wrapTo(Object.assign(Object.assign({}, item), { key, children })) : children;
|
|
27
27
|
})));
|
|
28
28
|
if (isAnimated) {
|
|
29
29
|
return (react_1.default.createElement(react_transition_group_1.CSSTransition, { in: !isDisabled, nodeRef: nodeRef, classNames: b(null), timeout: 300, unmountOnExit: true }, content));
|
|
@@ -8,10 +8,10 @@ export type ActionPanelItem = {
|
|
|
8
8
|
qa?: string;
|
|
9
9
|
onClick?: () => void;
|
|
10
10
|
dragProps?: ItemDragProps;
|
|
11
|
-
|
|
11
|
+
wrapTo?: (props: Omit<ActionPanelItem, 'wrapTo'> & {
|
|
12
12
|
key: React.Key;
|
|
13
13
|
children: React.ReactNode;
|
|
14
|
-
}) =>
|
|
14
|
+
}) => React.ReactNode;
|
|
15
15
|
};
|
|
16
16
|
export type ActionPanelProps = {
|
|
17
17
|
items: ActionPanelItem[];
|
|
@@ -320,6 +320,7 @@ class GridLayout extends react_1.default.PureComponent {
|
|
|
320
320
|
}
|
|
321
321
|
_onResizeStop(group, layout, oldItem, newItem, placeholder, e, element) {
|
|
322
322
|
var _a;
|
|
323
|
+
this._onStop(group, layout);
|
|
323
324
|
(_a = this.context.onResizeStop) === null || _a === void 0 ? void 0 : _a.call(this, this.prepareDefaultArguments(group, layout, oldItem, newItem, placeholder, e, element));
|
|
324
325
|
}
|
|
325
326
|
_onTargetRestore() {
|
|
@@ -362,7 +363,7 @@ class GridLayout extends react_1.default.PureComponent {
|
|
|
362
363
|
// Group properties
|
|
363
364
|
, Object.assign({}, properties, {
|
|
364
365
|
// Layout props
|
|
365
|
-
compactType: compactType, layout: layout, key: `group_${group}`, isDraggable: editMode, isResizable: editMode, draggableCancel: `.${constants_1.
|
|
366
|
+
compactType: compactType, layout: layout, key: `group_${group}`, isDraggable: editMode, isResizable: editMode, draggableCancel: `.${constants_1.DRAGGABLE_CANCEL_CLASS_NAME}` }, (draggableHandleClassName
|
|
366
367
|
? { draggableHandle: `.${draggableHandleClassName}` }
|
|
367
368
|
: null), {
|
|
368
369
|
// Default callbacks
|
|
@@ -105,7 +105,7 @@ class OverlayControls extends react_1.default.Component {
|
|
|
105
105
|
const controls = hasCustomControlsWithWidgets
|
|
106
106
|
? this.getCustomControlsWithWidgets()
|
|
107
107
|
: this.renderControls();
|
|
108
|
-
return react_1.default.createElement("div", { className: b({ position }) }, controls);
|
|
108
|
+
return react_1.default.createElement("div", { className: b({ position }, [constants_1.DRAGGABLE_CANCEL_CLASS_NAME]) }, controls);
|
|
109
109
|
}
|
|
110
110
|
getDropDownMenuItemConfig(menuName, isDefaultMenu) {
|
|
111
111
|
switch (menuName) {
|
|
@@ -203,7 +203,9 @@ class OverlayControls extends react_1.default.Component {
|
|
|
203
203
|
return null;
|
|
204
204
|
}
|
|
205
205
|
return (react_1.default.createElement(uikit_1.DropdownMenu, { items: items, renderSwitcher: (props) => (react_1.default.createElement(uikit_1.Button, Object.assign({}, props, { view: view, size: size, pin: isOnlyOneItem ? 'round-round' : 'brick-round', qa: "dashkit-overlay-control-menu" }),
|
|
206
|
-
react_1.default.createElement(uikit_1.Icon, { data: icons_1.Ellipsis, size: constants_1.OVERLAY_ICON_SIZE })))
|
|
206
|
+
react_1.default.createElement(uikit_1.Icon, { data: icons_1.Ellipsis, size: constants_1.OVERLAY_ICON_SIZE }))), popupProps: {
|
|
207
|
+
contentClassName: constants_1.DRAGGABLE_CANCEL_CLASS_NAME,
|
|
208
|
+
} }));
|
|
207
209
|
}
|
|
208
210
|
getControlItemPinStyle(index, itemsLength) {
|
|
209
211
|
const isOnlyOneItem = itemsLength === 1;
|
|
@@ -13,3 +13,4 @@ export declare const DEFAULT_WIDGET_HEIGHT = 3;
|
|
|
13
13
|
export declare const DEFAULT_WIDGET_WIDTH = 3;
|
|
14
14
|
export declare const DEFAULT_GROUP = "__default";
|
|
15
15
|
export declare const COMPACT_TYPE_HORIZONTAL_NOWRAP = "horizontal-nowrap";
|
|
16
|
+
export declare const DRAGGABLE_CANCEL_CLASS_NAME = "dashkit_draggable_cancel";
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.COMPACT_TYPE_HORIZONTAL_NOWRAP = exports.DEFAULT_GROUP = exports.DEFAULT_WIDGET_WIDTH = exports.DEFAULT_WIDGET_HEIGHT = exports.MenuItems = exports.TEMPORARY_ITEM_ID = exports.OVERLAY_ICON_SIZE = exports.OVERLAY_CLASS_NAME = exports.OVERLAY_CONTROLS_CLASS_NAME = exports.DEFAULT_NAMESPACE = exports.COPIED_WIDGET_STORE_KEY = void 0;
|
|
3
|
+
exports.DRAGGABLE_CANCEL_CLASS_NAME = exports.COMPACT_TYPE_HORIZONTAL_NOWRAP = exports.DEFAULT_GROUP = exports.DEFAULT_WIDGET_WIDTH = exports.DEFAULT_WIDGET_HEIGHT = exports.MenuItems = exports.TEMPORARY_ITEM_ID = exports.OVERLAY_ICON_SIZE = exports.OVERLAY_CLASS_NAME = exports.OVERLAY_CONTROLS_CLASS_NAME = exports.DEFAULT_NAMESPACE = exports.COPIED_WIDGET_STORE_KEY = void 0;
|
|
4
4
|
exports.COPIED_WIDGET_STORE_KEY = 'dashCopiedItem';
|
|
5
5
|
exports.DEFAULT_NAMESPACE = 'default';
|
|
6
6
|
exports.OVERLAY_CONTROLS_CLASS_NAME = 'dashkit-overlay-controls';
|
|
@@ -16,3 +16,4 @@ exports.DEFAULT_WIDGET_HEIGHT = 3;
|
|
|
16
16
|
exports.DEFAULT_WIDGET_WIDTH = 3;
|
|
17
17
|
exports.DEFAULT_GROUP = '__default';
|
|
18
18
|
exports.COMPACT_TYPE_HORIZONTAL_NOWRAP = 'horizontal-nowrap';
|
|
19
|
+
exports.DRAGGABLE_CANCEL_CLASS_NAME = 'dashkit_draggable_cancel';
|
|
@@ -17,10 +17,10 @@ export const ActionPanel = (props) => {
|
|
|
17
17
|
const isAnimated = (_b = props.toggleAnimation) !== null && _b !== void 0 ? _b : false;
|
|
18
18
|
const nodeRef = React.useRef(null);
|
|
19
19
|
const content = (React.createElement("div", { ref: nodeRef, className: b(null, props.className) }, props.items.map((_a) => {
|
|
20
|
-
var {
|
|
20
|
+
var { wrapTo } = _a, item = __rest(_a, ["wrapTo"]);
|
|
21
21
|
const key = `dk-action-panel-${item.id}`;
|
|
22
22
|
const children = React.createElement(ActionPanelItemContainer, { key: key, item: item });
|
|
23
|
-
return
|
|
23
|
+
return wrapTo ? wrapTo(Object.assign(Object.assign({}, item), { key, children })) : children;
|
|
24
24
|
})));
|
|
25
25
|
if (isAnimated) {
|
|
26
26
|
return (React.createElement(CSSTransition, { in: !isDisabled, nodeRef: nodeRef, classNames: b(null), timeout: 300, unmountOnExit: true }, content));
|
|
@@ -8,10 +8,10 @@ export type ActionPanelItem = {
|
|
|
8
8
|
qa?: string;
|
|
9
9
|
onClick?: () => void;
|
|
10
10
|
dragProps?: ItemDragProps;
|
|
11
|
-
|
|
11
|
+
wrapTo?: (props: Omit<ActionPanelItem, 'wrapTo'> & {
|
|
12
12
|
key: React.Key;
|
|
13
13
|
children: React.ReactNode;
|
|
14
|
-
}) =>
|
|
14
|
+
}) => React.ReactNode;
|
|
15
15
|
};
|
|
16
16
|
export type ActionPanelProps = {
|
|
17
17
|
items: ActionPanelItem[];
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { COMPACT_TYPE_HORIZONTAL_NOWRAP, DEFAULT_GROUP,
|
|
2
|
+
import { COMPACT_TYPE_HORIZONTAL_NOWRAP, DEFAULT_GROUP, DRAGGABLE_CANCEL_CLASS_NAME, TEMPORARY_ITEM_ID, } from '../../constants';
|
|
3
3
|
import { DashKitContext } from '../../context/DashKitContext';
|
|
4
4
|
import { resolveLayoutGroup } from '../../utils';
|
|
5
5
|
import GridItem from '../GridItem/GridItem';
|
|
@@ -317,6 +317,7 @@ class GridLayout extends React.PureComponent {
|
|
|
317
317
|
}
|
|
318
318
|
_onResizeStop(group, layout, oldItem, newItem, placeholder, e, element) {
|
|
319
319
|
var _a;
|
|
320
|
+
this._onStop(group, layout);
|
|
320
321
|
(_a = this.context.onResizeStop) === null || _a === void 0 ? void 0 : _a.call(this, this.prepareDefaultArguments(group, layout, oldItem, newItem, placeholder, e, element));
|
|
321
322
|
}
|
|
322
323
|
_onTargetRestore() {
|
|
@@ -359,7 +360,7 @@ class GridLayout extends React.PureComponent {
|
|
|
359
360
|
// Group properties
|
|
360
361
|
, Object.assign({}, properties, {
|
|
361
362
|
// Layout props
|
|
362
|
-
compactType: compactType, layout: layout, key: `group_${group}`, isDraggable: editMode, isResizable: editMode, draggableCancel: `.${
|
|
363
|
+
compactType: compactType, layout: layout, key: `group_${group}`, isDraggable: editMode, isResizable: editMode, draggableCancel: `.${DRAGGABLE_CANCEL_CLASS_NAME}` }, (draggableHandleClassName
|
|
363
364
|
? { draggableHandle: `.${draggableHandleClassName}` }
|
|
364
365
|
: null), {
|
|
365
366
|
// Default callbacks
|
|
@@ -2,7 +2,7 @@ import React from 'react';
|
|
|
2
2
|
import { Ellipsis, Gear, Xmark } from '@gravity-ui/icons';
|
|
3
3
|
import { Button, DropdownMenu, Icon, } from '@gravity-ui/uikit';
|
|
4
4
|
import noop from 'lodash/noop';
|
|
5
|
-
import { COPIED_WIDGET_STORE_KEY, MenuItems, OVERLAY_CONTROLS_CLASS_NAME, OVERLAY_ICON_SIZE, } from '../../constants';
|
|
5
|
+
import { COPIED_WIDGET_STORE_KEY, DRAGGABLE_CANCEL_CLASS_NAME, MenuItems, OVERLAY_CONTROLS_CLASS_NAME, OVERLAY_ICON_SIZE, } from '../../constants';
|
|
6
6
|
import { DashkitOvelayControlsContext } from '../../context/DashKitContext';
|
|
7
7
|
import { i18n } from '../../i18n';
|
|
8
8
|
import { cn } from '../../utils/cn';
|
|
@@ -102,7 +102,7 @@ class OverlayControls extends React.Component {
|
|
|
102
102
|
const controls = hasCustomControlsWithWidgets
|
|
103
103
|
? this.getCustomControlsWithWidgets()
|
|
104
104
|
: this.renderControls();
|
|
105
|
-
return React.createElement("div", { className: b({ position }) }, controls);
|
|
105
|
+
return React.createElement("div", { className: b({ position }, [DRAGGABLE_CANCEL_CLASS_NAME]) }, controls);
|
|
106
106
|
}
|
|
107
107
|
getDropDownMenuItemConfig(menuName, isDefaultMenu) {
|
|
108
108
|
switch (menuName) {
|
|
@@ -200,7 +200,9 @@ class OverlayControls extends React.Component {
|
|
|
200
200
|
return null;
|
|
201
201
|
}
|
|
202
202
|
return (React.createElement(DropdownMenu, { items: items, renderSwitcher: (props) => (React.createElement(Button, Object.assign({}, props, { view: view, size: size, pin: isOnlyOneItem ? 'round-round' : 'brick-round', qa: "dashkit-overlay-control-menu" }),
|
|
203
|
-
React.createElement(Icon, { data: Ellipsis, size: OVERLAY_ICON_SIZE })))
|
|
203
|
+
React.createElement(Icon, { data: Ellipsis, size: OVERLAY_ICON_SIZE }))), popupProps: {
|
|
204
|
+
contentClassName: DRAGGABLE_CANCEL_CLASS_NAME,
|
|
205
|
+
} }));
|
|
204
206
|
}
|
|
205
207
|
getControlItemPinStyle(index, itemsLength) {
|
|
206
208
|
const isOnlyOneItem = itemsLength === 1;
|
|
@@ -13,3 +13,4 @@ export declare const DEFAULT_WIDGET_HEIGHT = 3;
|
|
|
13
13
|
export declare const DEFAULT_WIDGET_WIDTH = 3;
|
|
14
14
|
export declare const DEFAULT_GROUP = "__default";
|
|
15
15
|
export declare const COMPACT_TYPE_HORIZONTAL_NOWRAP = "horizontal-nowrap";
|
|
16
|
+
export declare const DRAGGABLE_CANCEL_CLASS_NAME = "dashkit_draggable_cancel";
|