@atlaskit/editor-plugin-hyperlink 5.4.0 → 5.4.2

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @atlaskit/editor-plugin-hyperlink
 
+## 5.4.2
+
+### Patch Changes
+
+- Updated dependencies
+
+## 5.4.1
+
+### Patch Changes
+
+- [#199487](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/199487)
+  [`54098ba4cc83c`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/54098ba4cc83c) -
+  Add LinkSection and TextSection and add logic to hide them when toolbar is pinned. Add
+  UserPreferencesPlugin and EditorViewModePlugin as a dependency to editor-plugin-toolbar.
+- Updated dependencies
+
 ## 5.4.0
 
 ### Minor Changes

package/dist/cjs/hyperlinkPlugin.js

@@ -25,8 +25,8 @@ var _inputRule = require("./pm-plugins/input-rule");
 var _keymap = require("./pm-plugins/keymap");
 var _main = require("./pm-plugins/main");
 var _toolbarButtons = require("./pm-plugins/toolbar-buttons");
+var _toolbarComponents = require("./ui/toolbar-components");
 var _Toolbar = require("./ui/toolbar/Toolbar");
-var _ToolbarComponents = require("./ui/ToolbarComponents");
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var getPosFromActiveLinkMark = function getPosFromActiveLinkMark(state) {
@@ -54,7 +54,7 @@ var hyperlinkPlugin = exports.hyperlinkPlugin = function hyperlinkPlugin(_ref) {
   var primaryToolbarComponent;
   if ((0, _expValEquals.expValEquals)('platform_editor_toolbar_aifc', 'isEnabled', true)) {
     var _api$toolbar;
-    api === null || api === void 0 || (_api$toolbar = api.toolbar) === null || _api$toolbar === void 0 || _api$toolbar.actions.registerComponents((0, _ToolbarComponents.getToolbarComponents)(api));
+    api === null || api === void 0 || (_api$toolbar = api.toolbar) === null || _api$toolbar === void 0 || _api$toolbar.actions.registerComponents((0, _toolbarComponents.getToolbarComponents)(api));
   }
   return {
     name: 'hyperlink',

package/dist/cjs/ui/toolbar/LinkButton.js

@@ -37,7 +37,7 @@ var LinkButton = exports.LinkButton = function LinkButton(_ref) {
         label: formatMessage(_messages.toolbarInsertBlockMessages.link)
       }),
       onClick: onClick,
-      testId: "editor-toolbar__link-button",
+      testId: 'editor-toolbar__link-button',
       isDisabled: !isEnabled
     }))
   );

package/dist/cjs/ui/toolbar/LinkSection.js

@@ -0,0 +1,37 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.LinkSection = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _toolbar = require("@atlaskit/editor-common/toolbar");
+var _useSharedPluginStateSelector = require("@atlaskit/editor-common/use-shared-plugin-state-selector");
+var _editorToolbar = require("@atlaskit/editor-toolbar");
+var shouldShowLinkSection = function shouldShowLinkSection(editMode, toolbar, toolbarDocking) {
+  if (editMode === 'view') {
+    return false;
+  }
+  if ((toolbar === null || toolbar === void 0 ? void 0 : toolbar.key) === _toolbar.TOOLBARS.INLINE_TEXT_TOOLBAR && toolbarDocking !== 'top') {
+    return true;
+  }
+  if ((toolbar === null || toolbar === void 0 ? void 0 : toolbar.key) === _toolbar.TOOLBARS.PRIMARY_TOOLBAR && toolbarDocking !== 'none') {
+    return true;
+  }
+  return false;
+};
+var LinkSection = exports.LinkSection = function LinkSection(_ref) {
+  var children = _ref.children,
+    parents = _ref.parents,
+    api = _ref.api;
+  var editMode = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'editorViewMode.mode');
+  var toolbarDocking = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'userPreferences.preferences.toolbarDockingPosition');
+  var toolbar = parents.find(function (parent) {
+    return parent.type === 'toolbar';
+  });
+  if (!shouldShowLinkSection(editMode, toolbar, toolbarDocking)) {
+    return null;
+  }
+  return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarSection, null, children);
+};

package/dist/cjs/ui/{ToolbarComponents.js → toolbar-components.js}

@@ -8,6 +8,7 @@ exports.getToolbarComponents = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _toolbar = require("@atlaskit/editor-common/toolbar");
 var _LinkButton = require("./toolbar/LinkButton");
+var _LinkSection = require("./toolbar/LinkSection");
 var getToolbarComponents = exports.getToolbarComponents = function getToolbarComponents(api) {
   var toolbarComponents = [{
     type: _toolbar.LINKING_SECTION.type,
@@ -16,7 +17,19 @@ var getToolbarComponents = exports.getToolbarComponents = function getToolbarCom
       type: 'toolbar',
       key: _toolbar.TOOLBARS.INLINE_TEXT_TOOLBAR,
       rank: _toolbar.TOOLBAR_RANK[_toolbar.LINKING_SECTION.key]
-    }]
+    }, {
+      type: 'toolbar',
+      key: _toolbar.TOOLBARS.PRIMARY_TOOLBAR,
+      rank: _toolbar.TOOLBAR_RANK[_toolbar.LINKING_SECTION.key]
+    }],
+    component: function component(_ref) {
+      var children = _ref.children,
+        parents = _ref.parents;
+      return /*#__PURE__*/_react.default.createElement(_LinkSection.LinkSection, {
+        parents: parents,
+        api: api
+      }, children);
+    }
   }, {
     type: _toolbar.LINKING_GROUP.type,
     key: _toolbar.LINKING_GROUP.key,

package/dist/es2019/hyperlinkPlugin.js

@@ -17,8 +17,8 @@ import { createInputRulePlugin } from './pm-plugins/input-rule';
 import { createKeymapPlugin } from './pm-plugins/keymap';
 import { plugin, stateKey } from './pm-plugins/main';
 import { toolbarButtonsPlugin } from './pm-plugins/toolbar-buttons';
+import { getToolbarComponents } from './ui/toolbar-components';
 import { getToolbarConfig } from './ui/toolbar/Toolbar';
-import { getToolbarComponents } from './ui/ToolbarComponents';
 const getPosFromActiveLinkMark = state => {
   if (state === undefined) {
     return undefined;

package/dist/es2019/ui/toolbar/LinkButton.js

@@ -34,7 +34,7 @@ export const LinkButton = ({
         label: formatMessage(messages.link)
       }),
       onClick: onClick,
-      testId: "editor-toolbar__link-button",
+      testId: 'editor-toolbar__link-button',
       isDisabled: !isEnabled
     }))
   );

package/dist/es2019/ui/toolbar/LinkSection.js

@@ -0,0 +1,29 @@
+import React from 'react';
+import { TOOLBARS } from '@atlaskit/editor-common/toolbar';
+import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
+import { ToolbarSection } from '@atlaskit/editor-toolbar';
+const shouldShowLinkSection = (editMode, toolbar, toolbarDocking) => {
+  if (editMode === 'view') {
+    return false;
+  }
+  if ((toolbar === null || toolbar === void 0 ? void 0 : toolbar.key) === TOOLBARS.INLINE_TEXT_TOOLBAR && toolbarDocking !== 'top') {
+    return true;
+  }
+  if ((toolbar === null || toolbar === void 0 ? void 0 : toolbar.key) === TOOLBARS.PRIMARY_TOOLBAR && toolbarDocking !== 'none') {
+    return true;
+  }
+  return false;
+};
+export const LinkSection = ({
+  children,
+  parents,
+  api
+}) => {
+  const editMode = useSharedPluginStateSelector(api, 'editorViewMode.mode');
+  const toolbarDocking = useSharedPluginStateSelector(api, 'userPreferences.preferences.toolbarDockingPosition');
+  const toolbar = parents.find(parent => parent.type === 'toolbar');
+  if (!shouldShowLinkSection(editMode, toolbar, toolbarDocking)) {
+    return null;
+  }
+  return /*#__PURE__*/React.createElement(ToolbarSection, null, children);
+};

package/dist/es2019/ui/{ToolbarComponents.js → toolbar-components.js}

@@ -1,6 +1,7 @@
 import React from 'react';
 import { LINKING_BUTTON, LINKING_GROUP, LINKING_GROUP_RANK, LINKING_SECTION, LINKING_SECTION_RANK, TOOLBAR_RANK, TOOLBARS } from '@atlaskit/editor-common/toolbar';
 import { LinkButton } from './toolbar/LinkButton';
+import { LinkSection } from './toolbar/LinkSection';
 export const getToolbarComponents = api => {
   const toolbarComponents = [{
     type: LINKING_SECTION.type,
@@ -9,7 +10,20 @@ export const getToolbarComponents = api => {
       type: 'toolbar',
       key: TOOLBARS.INLINE_TEXT_TOOLBAR,
       rank: TOOLBAR_RANK[LINKING_SECTION.key]
-    }]
+    }, {
+      type: 'toolbar',
+      key: TOOLBARS.PRIMARY_TOOLBAR,
+      rank: TOOLBAR_RANK[LINKING_SECTION.key]
+    }],
+    component: ({
+      children,
+      parents
+    }) => {
+      return /*#__PURE__*/React.createElement(LinkSection, {
+        parents: parents,
+        api: api
+      }, children);
+    }
   }, {
     type: LINKING_GROUP.type,
     key: LINKING_GROUP.key,

package/dist/esm/hyperlinkPlugin.js

@@ -20,8 +20,8 @@ import { createInputRulePlugin } from './pm-plugins/input-rule';
 import { createKeymapPlugin } from './pm-plugins/keymap';
 import { plugin as _plugin, stateKey } from './pm-plugins/main';
 import { toolbarButtonsPlugin } from './pm-plugins/toolbar-buttons';
+import { getToolbarComponents } from './ui/toolbar-components';
 import { getToolbarConfig } from './ui/toolbar/Toolbar';
-import { getToolbarComponents } from './ui/ToolbarComponents';
 var getPosFromActiveLinkMark = function getPosFromActiveLinkMark(state) {
   if (state === undefined) {
     return undefined;

package/dist/esm/ui/toolbar/LinkButton.js

@@ -30,7 +30,7 @@ export var LinkButton = function LinkButton(_ref) {
         label: formatMessage(messages.link)
       }),
       onClick: onClick,
-      testId: "editor-toolbar__link-button",
+      testId: 'editor-toolbar__link-button',
       isDisabled: !isEnabled
     }))
   );

package/dist/esm/ui/toolbar/LinkSection.js

@@ -0,0 +1,30 @@
+import React from 'react';
+import { TOOLBARS } from '@atlaskit/editor-common/toolbar';
+import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
+import { ToolbarSection } from '@atlaskit/editor-toolbar';
+var shouldShowLinkSection = function shouldShowLinkSection(editMode, toolbar, toolbarDocking) {
+  if (editMode === 'view') {
+    return false;
+  }
+  if ((toolbar === null || toolbar === void 0 ? void 0 : toolbar.key) === TOOLBARS.INLINE_TEXT_TOOLBAR && toolbarDocking !== 'top') {
+    return true;
+  }
+  if ((toolbar === null || toolbar === void 0 ? void 0 : toolbar.key) === TOOLBARS.PRIMARY_TOOLBAR && toolbarDocking !== 'none') {
+    return true;
+  }
+  return false;
+};
+export var LinkSection = function LinkSection(_ref) {
+  var children = _ref.children,
+    parents = _ref.parents,
+    api = _ref.api;
+  var editMode = useSharedPluginStateSelector(api, 'editorViewMode.mode');
+  var toolbarDocking = useSharedPluginStateSelector(api, 'userPreferences.preferences.toolbarDockingPosition');
+  var toolbar = parents.find(function (parent) {
+    return parent.type === 'toolbar';
+  });
+  if (!shouldShowLinkSection(editMode, toolbar, toolbarDocking)) {
+    return null;
+  }
+  return /*#__PURE__*/React.createElement(ToolbarSection, null, children);
+};

package/dist/esm/ui/{ToolbarComponents.js → toolbar-components.js}

@@ -1,6 +1,7 @@
 import React from 'react';
 import { LINKING_BUTTON, LINKING_GROUP, LINKING_GROUP_RANK, LINKING_SECTION, LINKING_SECTION_RANK, TOOLBAR_RANK, TOOLBARS } from '@atlaskit/editor-common/toolbar';
 import { LinkButton } from './toolbar/LinkButton';
+import { LinkSection } from './toolbar/LinkSection';
 export var getToolbarComponents = function getToolbarComponents(api) {
   var toolbarComponents = [{
     type: LINKING_SECTION.type,
@@ -9,7 +10,19 @@ export var getToolbarComponents = function getToolbarComponents(api) {
       type: 'toolbar',
       key: TOOLBARS.INLINE_TEXT_TOOLBAR,
       rank: TOOLBAR_RANK[LINKING_SECTION.key]
-    }]
+    }, {
+      type: 'toolbar',
+      key: TOOLBARS.PRIMARY_TOOLBAR,
+      rank: TOOLBAR_RANK[LINKING_SECTION.key]
+    }],
+    component: function component(_ref) {
+      var children = _ref.children,
+        parents = _ref.parents;
+      return /*#__PURE__*/React.createElement(LinkSection, {
+        parents: parents,
+        api: api
+      }, children);
+    }
   }, {
     type: LINKING_GROUP.type,
     key: LINKING_GROUP.key,

package/dist/types/pm-plugins/decorations.d.ts

@@ -5,7 +5,7 @@ import { type PluginKey } from '@atlaskit/editor-prosemirror/state';
 import { type EditorView } from '@atlaskit/editor-prosemirror/view';
 export declare const ButtonWrapper: ({ editorView, pos, stateKey, intl, onOpenLinkClick, }: {
     editorView: EditorView;
-    pos?: number | undefined;
+    pos?: number;
     stateKey: PluginKey<HyperlinkState>;
     intl: IntlShape;
     /** Callback fired when the Open Link dropdown item is clicked */

package/dist/types/ui/PrimaryToolbarComponent.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { WrappedComponentProps } from 'react-intl-next';
 import { type EditorAnalyticsAPI } from '@atlaskit/editor-common/analytics';
 import { type ExtractInjectionAPI } from '@atlaskit/editor-common/types';

package/dist/types/ui/toolbar/LinkButton.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
-import type { ExtractInjectionAPI } from "@atlaskit/editor-common/types";
-import type { HyperlinkPlugin } from "../../hyperlinkPluginType";
+import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
+import type { HyperlinkPlugin } from '../../hyperlinkPluginType';
 type LinkButtonProps = {
     api?: ExtractInjectionAPI<HyperlinkPlugin>;
 };

package/dist/types/ui/toolbar/LinkSection.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
+import type { ToolbarComponentTypes } from '@atlaskit/editor-toolbar-model';
+import type { HyperlinkPlugin } from '../../hyperlinkPluginType';
+type LinkSectionProps = {
+    children: React.ReactNode;
+    parents: ToolbarComponentTypes;
+    api?: ExtractInjectionAPI<HyperlinkPlugin>;
+};
+export declare const LinkSection: ({ children, parents, api }: LinkSectionProps) => React.JSX.Element | null;
+export {};

package/dist/types-ts4.5/pm-plugins/decorations.d.ts

@@ -5,7 +5,7 @@ import { type PluginKey } from '@atlaskit/editor-prosemirror/state';
 import { type EditorView } from '@atlaskit/editor-prosemirror/view';
 export declare const ButtonWrapper: ({ editorView, pos, stateKey, intl, onOpenLinkClick, }: {
     editorView: EditorView;
-    pos?: number | undefined;
+    pos?: number;
     stateKey: PluginKey<HyperlinkState>;
     intl: IntlShape;
     /** Callback fired when the Open Link dropdown item is clicked */

package/dist/types-ts4.5/ui/PrimaryToolbarComponent.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { WrappedComponentProps } from 'react-intl-next';
 import { type EditorAnalyticsAPI } from '@atlaskit/editor-common/analytics';
 import { type ExtractInjectionAPI } from '@atlaskit/editor-common/types';

package/dist/types-ts4.5/ui/toolbar/LinkButton.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
-import type { ExtractInjectionAPI } from "@atlaskit/editor-common/types";
-import type { HyperlinkPlugin } from "../../hyperlinkPluginType";
+import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
+import type { HyperlinkPlugin } from '../../hyperlinkPluginType';
 type LinkButtonProps = {
     api?: ExtractInjectionAPI<HyperlinkPlugin>;
 };

package/dist/types-ts4.5/ui/toolbar/LinkSection.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
+import type { ToolbarComponentTypes } from '@atlaskit/editor-toolbar-model';
+import type { HyperlinkPlugin } from '../../hyperlinkPluginType';
+type LinkSectionProps = {
+    children: React.ReactNode;
+    parents: ToolbarComponentTypes;
+    api?: ExtractInjectionAPI<HyperlinkPlugin>;
+};
+export declare const LinkSection: ({ children, parents, api }: LinkSectionProps) => React.JSX.Element | null;
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-hyperlink",
-	"version": "5.4.0",
+	"version": "5.4.2",
 	"description": "Hyperlink plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -35,25 +35,25 @@
 		"@atlaskit/adf-schema": "^50.2.0",
 		"@atlaskit/analytics-next": "^11.1.0",
 		"@atlaskit/editor-plugin-analytics": "^3.0.0",
-		"@atlaskit/editor-plugin-card": "^7.2.0",
+		"@atlaskit/editor-plugin-card": "^7.4.0",
 		"@atlaskit/editor-plugin-connectivity": "^3.1.0",
 		"@atlaskit/editor-plugin-editor-viewmode": "^5.0.0",
 		"@atlaskit/editor-plugin-primary-toolbar": "^4.1.0",
 		"@atlaskit/editor-plugin-selection-toolbar": "^4.3.0",
-		"@atlaskit/editor-plugin-toolbar": "^0.1.0",
+		"@atlaskit/editor-plugin-toolbar": "^0.2.0",
 		"@atlaskit/editor-prosemirror": "7.0.0",
-		"@atlaskit/editor-toolbar": "^0.1.0",
-		"@atlaskit/editor-toolbar-model": "^0.0.4",
-		"@atlaskit/icon": "^27.10.0",
+		"@atlaskit/editor-toolbar": "^0.3.0",
+		"@atlaskit/editor-toolbar-model": "^0.1.0",
+		"@atlaskit/icon": "^27.12.0",
 		"@atlaskit/platform-feature-flags": "^1.1.0",
 		"@atlaskit/prosemirror-input-rules": "^3.4.0",
-		"@atlaskit/tmp-editor-statsig": "^9.25.0",
+		"@atlaskit/tmp-editor-statsig": "^9.28.0",
 		"@babel/runtime": "^7.0.0",
 		"@emotion/react": "^11.7.1",
 		"uuid": "^3.1.0"
 	},
 	"peerDependencies": {
-		"@atlaskit/editor-common": "^107.19.0",
+		"@atlaskit/editor-common": "^107.23.0",
 		"react": "^18.2.0",
 		"react-dom": "^18.2.0",
 		"react-intl-next": "npm:react-intl@^5.18.1"
@@ -61,9 +61,9 @@
 	"devDependencies": {
 		"@atlaskit/activity-provider": "^2.5.0",
 		"@atlaskit/link-test-helpers": "^8.3.0",
-		"@atlaskit/media-test-helpers": "^37.0.0",
+		"@atlaskit/media-test-helpers": "^38.0.0",
 		"@atlaskit/ssr": "workspace:^",
-		"@atlaskit/util-data-test": "^18.0.0",
+		"@atlaskit/util-data-test": "^18.1.0",
 		"@atlaskit/visual-regression": "workspace:^",
 		"@testing-library/react": "^13.4.0",
 		"raf-stub": "^2.0.1",