@atlaskit/editor-plugin-grid 2.0.5 → 2.0.6

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.
Files changed (5) hide show
  1. package/CHANGELOG.md +9 -0
  2. package/dist/cjs/gridPlugin.js +33 -9
  3. package/dist/es2019/gridPlugin.js +35 -10
  4. package/dist/esm/gridPlugin.js +34 -10
  5. package/package.json +2 -2
package/CHANGELOG.md CHANGED
@@ -1,5 +1,14 @@
1
1
  # @atlaskit/editor-plugin-grid
2
2
 
3
+ ## 2.0.6
4
+
5
+ ### Patch Changes
6
+
7
+ - [#148126](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/148126)
8
+ [`2839a051cf613`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/2839a051cf613) -
9
+ Migrate to useSharedPluginStateSelector for grid, guideline, help-dialog, highlight and hyperlink
10
+ plugins
11
+
3
12
  ## 2.0.5
4
13
 
5
14
  ### Patch Changes
package/dist/cjs/gridPlugin.js CHANGED
@@ -12,6 +12,7 @@ var _react2 = require("@emotion/react");
12
12
  var _classnames = _interopRequireDefault(require("classnames"));
13
13
  var _hooks = require("@atlaskit/editor-common/hooks");
14
14
  var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
15
+ var _useSharedPluginStateSelector = require("@atlaskit/editor-common/use-shared-plugin-state-selector");
15
16
  var _state = require("@atlaskit/editor-prosemirror/state");
16
17
  var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
17
18
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
@@ -120,27 +121,50 @@ var Grid = function Grid(_ref3) {
120
121
  );
121
122
  };
122
123
  var ThemedGrid = (0, _react2.withTheme)(Grid);
124
+ var useSharedState = (0, _hooks.sharedPluginStateHookMigratorFactory)(function (api) {
125
+ var width = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'width.width');
126
+ var visible = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'grid.visible');
127
+ var gridType = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'grid.gridType');
128
+ var highlight = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'grid.highlight');
129
+ return {
130
+ width: width,
131
+ visible: visible,
132
+ gridType: gridType,
133
+ highlight: highlight
134
+ };
135
+ }, function (api) {
136
+ var _useSharedPluginState = (0, _hooks.useSharedPluginState)(api, ['width', 'grid']),
137
+ widthState = _useSharedPluginState.widthState,
138
+ gridState = _useSharedPluginState.gridState;
139
+ return {
140
+ width: widthState === null || widthState === void 0 ? void 0 : widthState.width,
141
+ visible: gridState === null || gridState === void 0 ? void 0 : gridState.visible,
142
+ gridType: gridState === null || gridState === void 0 ? void 0 : gridState.gridType,
143
+ highlight: gridState === null || gridState === void 0 ? void 0 : gridState.highlight
144
+ };
145
+ });
123
146
  var ContentComponent = function ContentComponent(_ref4) {
124
- var _widthState$width, _gridState$gridType;
125
147
  var api = _ref4.api,
126
148
  editorView = _ref4.editorView,
127
149
  options = _ref4.options;
128
- var _useSharedPluginState = (0, _hooks.useSharedPluginState)(api, ['width', 'grid']),
129
- widthState = _useSharedPluginState.widthState,
130
- gridState = _useSharedPluginState.gridState;
131
- if (!gridState) {
150
+ var _useSharedState = useSharedState(api),
151
+ width = _useSharedState.width,
152
+ visible = _useSharedState.visible,
153
+ gridType = _useSharedState.gridType,
154
+ highlight = _useSharedState.highlight;
155
+ if (visible === undefined || !highlight) {
132
156
  return null;
133
157
  }
134
158
  return /*#__PURE__*/_react.default.createElement(ThemedGrid, {
135
159
  shouldCalcBreakoutGridLines: options && options.shouldCalcBreakoutGridLines,
136
- editorWidth: (_widthState$width = widthState === null || widthState === void 0 ? void 0 : widthState.width) !== null && _widthState$width !== void 0 ? _widthState$width : _editorSharedStyles.akEditorFullPageMaxWidth
160
+ editorWidth: width !== null && width !== void 0 ? width : _editorSharedStyles.akEditorFullPageMaxWidth
137
161
  // Ignored via go/ees005
138
162
  // eslint-disable-next-line @atlaskit/editor/no-as-casting
139
163
  ,
140
164
  containerElement: editorView.dom,
141
- visible: gridState.visible,
142
- gridType: (_gridState$gridType = gridState.gridType) !== null && _gridState$gridType !== void 0 ? _gridState$gridType : 'full',
143
- highlight: gridState.highlight
165
+ visible: visible,
166
+ gridType: gridType !== null && gridType !== void 0 ? gridType : 'full',
167
+ highlight: highlight
144
168
  });
145
169
  };
146
170
  var EMPTY_STATE = {
package/dist/es2019/gridPlugin.js CHANGED
@@ -3,8 +3,9 @@ import React from 'react';
3
3
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
4
4
  import { withTheme } from '@emotion/react';
5
5
  import classnames from 'classnames';
6
- import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
6
+ import { useSharedPluginState, sharedPluginStateHookMigratorFactory } from '@atlaskit/editor-common/hooks';
7
7
  import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
8
+ import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
8
9
  import { PluginKey } from '@atlaskit/editor-prosemirror/state';
9
10
  import { akEditorBreakoutPadding, akEditorFullPageMaxWidth, breakoutWideScaleRatio } from '@atlaskit/editor-shared-styles';
10
11
  export const GRID_SIZE = 12;
@@ -113,29 +114,53 @@ const Grid = ({
113
114
  );
114
115
  };
115
116
  const ThemedGrid = withTheme(Grid);
117
+ const useSharedState = sharedPluginStateHookMigratorFactory(api => {
118
+ const width = useSharedPluginStateSelector(api, 'width.width');
119
+ const visible = useSharedPluginStateSelector(api, 'grid.visible');
120
+ const gridType = useSharedPluginStateSelector(api, 'grid.gridType');
121
+ const highlight = useSharedPluginStateSelector(api, 'grid.highlight');
122
+ return {
123
+ width,
124
+ visible,
125
+ gridType,
126
+ highlight
127
+ };
128
+ }, api => {
129
+ const {
130
+ widthState,
131
+ gridState
132
+ } = useSharedPluginState(api, ['width', 'grid']);
133
+ return {
134
+ width: widthState === null || widthState === void 0 ? void 0 : widthState.width,
135
+ visible: gridState === null || gridState === void 0 ? void 0 : gridState.visible,
136
+ gridType: gridState === null || gridState === void 0 ? void 0 : gridState.gridType,
137
+ highlight: gridState === null || gridState === void 0 ? void 0 : gridState.highlight
138
+ };
139
+ });
116
140
  const ContentComponent = ({
117
141
  api,
118
142
  editorView,
119
143
  options
120
144
  }) => {
121
- var _widthState$width, _gridState$gridType;
122
145
  const {
123
- widthState,
124
- gridState
125
- } = useSharedPluginState(api, ['width', 'grid']);
126
- if (!gridState) {
146
+ width,
147
+ visible,
148
+ gridType,
149
+ highlight
150
+ } = useSharedState(api);
151
+ if (visible === undefined || !highlight) {
127
152
  return null;
128
153
  }
129
154
  return /*#__PURE__*/React.createElement(ThemedGrid, {
130
155
  shouldCalcBreakoutGridLines: options && options.shouldCalcBreakoutGridLines,
131
- editorWidth: (_widthState$width = widthState === null || widthState === void 0 ? void 0 : widthState.width) !== null && _widthState$width !== void 0 ? _widthState$width : akEditorFullPageMaxWidth
156
+ editorWidth: width !== null && width !== void 0 ? width : akEditorFullPageMaxWidth
132
157
  // Ignored via go/ees005
133
158
  // eslint-disable-next-line @atlaskit/editor/no-as-casting
134
159
  ,
135
160
  containerElement: editorView.dom,
136
- visible: gridState.visible,
137
- gridType: (_gridState$gridType = gridState.gridType) !== null && _gridState$gridType !== void 0 ? _gridState$gridType : 'full',
138
- highlight: gridState.highlight
161
+ visible: visible,
162
+ gridType: gridType !== null && gridType !== void 0 ? gridType : 'full',
163
+ highlight: highlight
139
164
  });
140
165
  };
141
166
  const EMPTY_STATE = {
package/dist/esm/gridPlugin.js CHANGED
@@ -5,8 +5,9 @@ import React from 'react';
5
5
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
6
6
  import { withTheme } from '@emotion/react';
7
7
  import classnames from 'classnames';
8
- import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
8
+ import { useSharedPluginState, sharedPluginStateHookMigratorFactory } from '@atlaskit/editor-common/hooks';
9
9
  import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
10
+ import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
10
11
  import { PluginKey } from '@atlaskit/editor-prosemirror/state';
11
12
  import { akEditorBreakoutPadding, akEditorFullPageMaxWidth, breakoutWideScaleRatio } from '@atlaskit/editor-shared-styles';
12
13
  export var GRID_SIZE = 12;
@@ -113,27 +114,50 @@ var Grid = function Grid(_ref3) {
113
114
  );
114
115
  };
115
116
  var ThemedGrid = withTheme(Grid);
117
+ var useSharedState = sharedPluginStateHookMigratorFactory(function (api) {
118
+ var width = useSharedPluginStateSelector(api, 'width.width');
119
+ var visible = useSharedPluginStateSelector(api, 'grid.visible');
120
+ var gridType = useSharedPluginStateSelector(api, 'grid.gridType');
121
+ var highlight = useSharedPluginStateSelector(api, 'grid.highlight');
122
+ return {
123
+ width: width,
124
+ visible: visible,
125
+ gridType: gridType,
126
+ highlight: highlight
127
+ };
128
+ }, function (api) {
129
+ var _useSharedPluginState = useSharedPluginState(api, ['width', 'grid']),
130
+ widthState = _useSharedPluginState.widthState,
131
+ gridState = _useSharedPluginState.gridState;
132
+ return {
133
+ width: widthState === null || widthState === void 0 ? void 0 : widthState.width,
134
+ visible: gridState === null || gridState === void 0 ? void 0 : gridState.visible,
135
+ gridType: gridState === null || gridState === void 0 ? void 0 : gridState.gridType,
136
+ highlight: gridState === null || gridState === void 0 ? void 0 : gridState.highlight
137
+ };
138
+ });
116
139
  var ContentComponent = function ContentComponent(_ref4) {
117
- var _widthState$width, _gridState$gridType;
118
140
  var api = _ref4.api,
119
141
  editorView = _ref4.editorView,
120
142
  options = _ref4.options;
121
- var _useSharedPluginState = useSharedPluginState(api, ['width', 'grid']),
122
- widthState = _useSharedPluginState.widthState,
123
- gridState = _useSharedPluginState.gridState;
124
- if (!gridState) {
143
+ var _useSharedState = useSharedState(api),
144
+ width = _useSharedState.width,
145
+ visible = _useSharedState.visible,
146
+ gridType = _useSharedState.gridType,
147
+ highlight = _useSharedState.highlight;
148
+ if (visible === undefined || !highlight) {
125
149
  return null;
126
150
  }
127
151
  return /*#__PURE__*/React.createElement(ThemedGrid, {
128
152
  shouldCalcBreakoutGridLines: options && options.shouldCalcBreakoutGridLines,
129
- editorWidth: (_widthState$width = widthState === null || widthState === void 0 ? void 0 : widthState.width) !== null && _widthState$width !== void 0 ? _widthState$width : akEditorFullPageMaxWidth
153
+ editorWidth: width !== null && width !== void 0 ? width : akEditorFullPageMaxWidth
130
154
  // Ignored via go/ees005
131
155
  // eslint-disable-next-line @atlaskit/editor/no-as-casting
132
156
  ,
133
157
  containerElement: editorView.dom,
134
- visible: gridState.visible,
135
- gridType: (_gridState$gridType = gridState.gridType) !== null && _gridState$gridType !== void 0 ? _gridState$gridType : 'full',
136
- highlight: gridState.highlight
158
+ visible: visible,
159
+ gridType: gridType !== null && gridType !== void 0 ? gridType : 'full',
160
+ highlight: highlight
137
161
  });
138
162
  };
139
163
  var EMPTY_STATE = {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-grid",
3
- "version": "2.0.5",
3
+ "version": "2.0.6",
4
4
  "description": "Grid plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -25,7 +25,7 @@
25
25
  ".": "./src/index.ts"
26
26
  },
27
27
  "dependencies": {
28
- "@atlaskit/editor-common": "^104.0.0",
28
+ "@atlaskit/editor-common": "^104.1.0",
29
29
  "@atlaskit/editor-plugin-width": "^3.0.0",
30
30
  "@atlaskit/editor-prosemirror": "7.0.0",
31
31
  "@atlaskit/editor-shared-styles": "^3.4.0",