@atlaskit/editor-plugin-grid 2.0.9 → 3.0.1

package/CHANGELOG.md

@@ -1,5 +1,53 @@
 # @atlaskit/editor-plugin-grid
 
+## 3.0.1
+
+### Patch Changes
+
+- [#182839](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/182839)
+  [`81f1c3383bdab`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/81f1c3383bdab) -
+  refactor: use useSharedPluginStateWithSelector instead of useSharedPluginStateSelector
+
+## 3.0.0
+
+### Major Changes
+
+- [#181024](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/181024)
+  [`8e80c487ca307`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/8e80c487ca307) - ##
+  Make `@atlaskit/editor-common` a peer dependency
+
+  **WHAT:** `@atlaskit/editor-common` has been moved from `dependencies` to `peerDependencies` in
+  all editor plugin packages.
+
+  **WHY:** This change ensures that only a single version of `@atlaskit/editor-common` is used in
+  consuming applications, preventing issues caused by multiple versions of singleton libraries (such
+  as context mismatches or duplicated state). This is especially important for packages that rely on
+  shared context or singletons.
+
+  **HOW TO ADJUST:**
+
+  - Consumers must now explicitly install `@atlaskit/editor-common` in their own project if they use
+    any of these editor plugins.
+  - Ensure the version you install matches the version required by the plugins.
+  - You can use the
+    [`check-peer-dependencies`](https://www.npmjs.com/package/check-peer-dependencies) package to
+    verify that all required peer dependencies are installed and compatible.
+  - Example install command:
+    ```
+    npm install @atlaskit/editor-common
+    ```
+    or
+    ```
+    yarn add @atlaskit/editor-common
+    ```
+
+  **Note:** This is a breaking change. If `@atlaskit/editor-common` is not installed at the
+  application level, you may see errors or unexpected behavior.
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 2.0.9
 
 ### Patch Changes

package/dist/cjs/gridPlugin.js

@@ -12,7 +12,6 @@ var _react2 = require("@emotion/react");
 var _classnames = _interopRequireDefault(require("classnames"));
 var _hooks = require("@atlaskit/editor-common/hooks");
 var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
-var _useSharedPluginStateSelector = require("@atlaskit/editor-common/use-shared-plugin-state-selector");
 var _state = require("@atlaskit/editor-prosemirror/state");
 var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
@@ -121,17 +120,17 @@ var Grid = function Grid(_ref3) {
   );
 };
 var ThemedGrid = (0, _react2.withTheme)(Grid);
-var useSharedState = (0, _hooks.sharedPluginStateHookMigratorFactory)(function (api) {
-  var width = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'width.width');
-  var visible = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'grid.visible');
-  var gridType = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'grid.gridType');
-  var highlight = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'grid.highlight');
+var selector = function selector(states) {
+  var _states$widthState, _states$gridState, _states$gridState2, _states$gridState3;
   return {
-    width: width,
-    visible: visible,
-    gridType: gridType,
-    highlight: highlight
+    width: (_states$widthState = states.widthState) === null || _states$widthState === void 0 ? void 0 : _states$widthState.width,
+    visible: (_states$gridState = states.gridState) === null || _states$gridState === void 0 ? void 0 : _states$gridState.visible,
+    gridType: (_states$gridState2 = states.gridState) === null || _states$gridState2 === void 0 ? void 0 : _states$gridState2.gridType,
+    highlight: (_states$gridState3 = states.gridState) === null || _states$gridState3 === void 0 ? void 0 : _states$gridState3.highlight
   };
+};
+var useSharedState = (0, _hooks.sharedPluginStateHookMigratorFactory)(function (api) {
+  return (0, _hooks.useSharedPluginStateWithSelector)(api, ['width', 'grid'], selector);
 }, function (api) {
   var _useSharedPluginState = (0, _hooks.useSharedPluginState)(api, ['width', 'grid']),
     widthState = _useSharedPluginState.widthState,

package/dist/es2019/gridPlugin.js

@@ -3,9 +3,8 @@ import React from 'react';
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { withTheme } from '@emotion/react';
 import classnames from 'classnames';
-import { useSharedPluginState, sharedPluginStateHookMigratorFactory } from '@atlaskit/editor-common/hooks';
+import { useSharedPluginState, sharedPluginStateHookMigratorFactory, useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
-import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
 import { PluginKey } from '@atlaskit/editor-prosemirror/state';
 import { akEditorBreakoutPadding, akEditorFullPageMaxWidth, breakoutWideScaleRatio } from '@atlaskit/editor-shared-styles';
 export const GRID_SIZE = 12;
@@ -114,17 +113,17 @@ const Grid = ({
   );
 };
 const ThemedGrid = withTheme(Grid);
-const useSharedState = sharedPluginStateHookMigratorFactory(api => {
-  const width = useSharedPluginStateSelector(api, 'width.width');
-  const visible = useSharedPluginStateSelector(api, 'grid.visible');
-  const gridType = useSharedPluginStateSelector(api, 'grid.gridType');
-  const highlight = useSharedPluginStateSelector(api, 'grid.highlight');
+const selector = states => {
+  var _states$widthState, _states$gridState, _states$gridState2, _states$gridState3;
   return {
-    width,
-    visible,
-    gridType,
-    highlight
+    width: (_states$widthState = states.widthState) === null || _states$widthState === void 0 ? void 0 : _states$widthState.width,
+    visible: (_states$gridState = states.gridState) === null || _states$gridState === void 0 ? void 0 : _states$gridState.visible,
+    gridType: (_states$gridState2 = states.gridState) === null || _states$gridState2 === void 0 ? void 0 : _states$gridState2.gridType,
+    highlight: (_states$gridState3 = states.gridState) === null || _states$gridState3 === void 0 ? void 0 : _states$gridState3.highlight
   };
+};
+const useSharedState = sharedPluginStateHookMigratorFactory(api => {
+  return useSharedPluginStateWithSelector(api, ['width', 'grid'], selector);
 }, api => {
   const {
     widthState,

package/dist/esm/gridPlugin.js

@@ -5,9 +5,8 @@ import React from 'react';
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { withTheme } from '@emotion/react';
 import classnames from 'classnames';
-import { useSharedPluginState, sharedPluginStateHookMigratorFactory } from '@atlaskit/editor-common/hooks';
+import { useSharedPluginState, sharedPluginStateHookMigratorFactory, useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
-import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
 import { PluginKey } from '@atlaskit/editor-prosemirror/state';
 import { akEditorBreakoutPadding, akEditorFullPageMaxWidth, breakoutWideScaleRatio } from '@atlaskit/editor-shared-styles';
 export var GRID_SIZE = 12;
@@ -114,17 +113,17 @@ var Grid = function Grid(_ref3) {
   );
 };
 var ThemedGrid = withTheme(Grid);
-var useSharedState = sharedPluginStateHookMigratorFactory(function (api) {
-  var width = useSharedPluginStateSelector(api, 'width.width');
-  var visible = useSharedPluginStateSelector(api, 'grid.visible');
-  var gridType = useSharedPluginStateSelector(api, 'grid.gridType');
-  var highlight = useSharedPluginStateSelector(api, 'grid.highlight');
+var selector = function selector(states) {
+  var _states$widthState, _states$gridState, _states$gridState2, _states$gridState3;
   return {
-    width: width,
-    visible: visible,
-    gridType: gridType,
-    highlight: highlight
+    width: (_states$widthState = states.widthState) === null || _states$widthState === void 0 ? void 0 : _states$widthState.width,
+    visible: (_states$gridState = states.gridState) === null || _states$gridState === void 0 ? void 0 : _states$gridState.visible,
+    gridType: (_states$gridState2 = states.gridState) === null || _states$gridState2 === void 0 ? void 0 : _states$gridState2.gridType,
+    highlight: (_states$gridState3 = states.gridState) === null || _states$gridState3 === void 0 ? void 0 : _states$gridState3.highlight
   };
+};
+var useSharedState = sharedPluginStateHookMigratorFactory(function (api) {
+  return useSharedPluginStateWithSelector(api, ['width', 'grid'], selector);
 }, function (api) {
   var _useSharedPluginState = useSharedPluginState(api, ['width', 'grid']),
     widthState = _useSharedPluginState.widthState,

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-grid",
-	"version": "2.0.9",
+	"version": "3.0.1",
 	"description": "Grid plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -9,8 +9,7 @@
 	},
 	"atlassian": {
 		"team": "Editor: Jenga",
-		"singleton": true,
-		"runReact18": true
+		"singleton": true
 	},
 	"repository": "https://bitbucket.org/atlassian/atlassian-frontend-mirror",
 	"main": "dist/cjs/index.js",
@@ -25,8 +24,7 @@
 		".": "./src/index.ts"
 	},
 	"dependencies": {
-		"@atlaskit/editor-common": "^107.0.0",
-		"@atlaskit/editor-plugin-width": "^3.0.0",
+		"@atlaskit/editor-plugin-width": "^4.0.0",
 		"@atlaskit/editor-prosemirror": "7.0.0",
 		"@atlaskit/editor-shared-styles": "^3.4.0",
 		"@babel/runtime": "^7.0.0",
@@ -34,6 +32,7 @@
 		"classnames": "^2.2.5"
 	},
 	"peerDependencies": {
+		"@atlaskit/editor-common": "^107.7.0",
 		"react": "^18.2.0",
 		"react-dom": "^18.2.0"
 	},