@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.
@@ -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 { renderItem } = _a, item = tslib_1.__rest(_a, ["renderItem"]);
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 renderItem ? renderItem(Object.assign(Object.assign({}, item), { key, children })) : children;
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
- renderItem?: (props: Omit<ActionPanelItem, 'renderItem'> & {
11
+ wrapTo?: (props: Omit<ActionPanelItem, 'wrapTo'> & {
12
12
  key: React.Key;
13
13
  children: React.ReactNode;
14
- }) => JSX.Element;
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.OVERLAY_CONTROLS_CLASS_NAME}` }, (draggableHandleClassName
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 { renderItem } = _a, item = __rest(_a, ["renderItem"]);
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 renderItem ? renderItem(Object.assign(Object.assign({}, item), { key, children })) : children;
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
- renderItem?: (props: Omit<ActionPanelItem, 'renderItem'> & {
11
+ wrapTo?: (props: Omit<ActionPanelItem, 'wrapTo'> & {
12
12
  key: React.Key;
13
13
  children: React.ReactNode;
14
- }) => JSX.Element;
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, OVERLAY_CONTROLS_CLASS_NAME, TEMPORARY_ITEM_ID, } from '../../constants';
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: `.${OVERLAY_CONTROLS_CLASS_NAME}` }, (draggableHandleClassName
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";
@@ -13,3 +13,4 @@ export const DEFAULT_WIDGET_HEIGHT = 3;
13
13
  export const DEFAULT_WIDGET_WIDTH = 3;
14
14
  export const DEFAULT_GROUP = '__default';
15
15
  export const COMPACT_TYPE_HORIZONTAL_NOWRAP = 'horizontal-nowrap';
16
+ export const DRAGGABLE_CANCEL_CLASS_NAME = 'dashkit_draggable_cancel';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gravity-ui/dashkit",
3
- "version": "8.14.1-beta.0",
3
+ "version": "8.15.0-beta.0",
4
4
  "description": "Library for rendering dashboard grid layout",
5
5
  "license": "MIT",
6
6
  "repository": {