@atlaskit/editor-common 78.26.5 → 78.27.1

package/CHANGELOG.md

@@ -1,5 +1,26 @@
 # @atlaskit/editor-common
 
+## 78.27.1
+
+### Patch Changes
+
+- [#90864](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/90864) [`c8a41fe8962b`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/c8a41fe8962b) - [ux] Removes hover overlay and adds hover border for inline macros for macro interaction design update
+
+## 78.27.0
+
+### Minor Changes
+
+- [#89386](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/89386) [`91d0fdc31828`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/91d0fdc31828) - Updates card plugin to leverage hyperlink plugins addToolbarItems action in order to inject link preferences button into the hyperlink floating toolbar. Also adds support to configure the link via card plugin options (smart links). Requires platform feature flag `platform.editor.card.inject-settings-button`.
+
+  Example usage:
+
+  ```tsx
+  <Editor
+    linking={{ smartLinks: { userPreferencesLink: 'https://example.com' } }}
+    {...restProps}
+  />
+  ```
+
 ## 78.26.5
 
 ### Patch Changes

package/dist/cjs/extensibility/Extension/InlineExtension/index.js

@@ -31,9 +31,12 @@ var InlineExtension = function InlineExtension(props) {
   var _useSharedPluginState = (0, _hooks.useSharedPluginState)(pluginInjectionApi, ['width']),
     widthState = _useSharedPluginState.widthState;
   var hasChildren = !!children;
-  var classNames = (0, _classnames.default)('extension-container', 'inline', 'with-overlay', {
+  var classNames = (0, _classnames.default)('extension-container', 'inline', {
+    'with-overlay': !showMacroInteractionDesignUpdates,
     'with-children': hasChildren,
-    'with-danger-overlay': showMacroInteractionDesignUpdates
+    'with-danger-overlay': showMacroInteractionDesignUpdates,
+    'with-border': showMacroInteractionDesignUpdates,
+    'with-hover-border': showMacroInteractionDesignUpdates && isNodeHovered
   });
   var rendererContainerWidth = widthState ? widthState.width - _editorSharedStyles.akEditorGutterPadding * 2 : 0;
   var extendedInlineExtension = (0, _platformFeatureFlags.getBooleanFF)('platform.editor.inline_extension.extended_lcqdn') || false;
@@ -49,7 +52,7 @@ var InlineExtension = function InlineExtension(props) {
     showMacroInteractionDesignUpdates: showMacroInteractionDesignUpdates
   }), (0, _react2.jsx)("div", {
     "data-testid": "inline-extension-wrapper",
-    css: [_styles2.wrapperStyle, extendedInlineExtension && _styles2.inlineWrapperStyels],
+    css: [_styles2.wrapperStyle, extendedInlineExtension && _styles2.inlineWrapperStyles],
     className: classNames,
     onMouseEnter: function onMouseEnter() {
       return handleMouseEvent(true);

package/dist/cjs/extensibility/Extension/InlineExtension/styles.js

@@ -3,8 +3,9 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.wrapperStyle = exports.inlineWrapperStyels = void 0;
+exports.wrapperStyle = exports.inlineWrapperStyles = void 0;
 var _react = require("@emotion/react");
+var _colors = require("@atlaskit/theme/colors");
 var _styles = require("../styles");
 var wrapperStyle = exports.wrapperStyle = (0, _react.css)(_styles.wrapperDefault, {
   cursor: 'pointer',
@@ -22,9 +23,15 @@ var wrapperStyle = exports.wrapperStyle = (0, _react.css)(_styles.wrapperDefault
   '&.with-children': {
     padding: 0,
     background: "var(--ds-background-neutral-subtle, white)"
+  },
+  '&.with-border': {
+    border: "1px solid transparent" // adding this so macro doesn't jump when hover border is shown
+  },
+  '&.with-hover-border': {
+    border: "1px solid ".concat("var(--ds-border-input, ".concat(_colors.N500, ")"))
   }
 });
-var inlineWrapperStyels = exports.inlineWrapperStyels = (0, _react.css)({
+var inlineWrapperStyles = exports.inlineWrapperStyles = (0, _react.css)({
   maxWidth: '100%',
   'tr &': {
     maxWidth: 'inherit'

package/dist/cjs/monitoring/error.js

@@ -16,7 +16,7 @@ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 var SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
 var packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
-var packageVersion = "78.26.5";
+var packageVersion = "78.27.1";
 var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
   // Remove URL as it has UGC
   // TODO: Sanitise the URL instead of just removing it

package/dist/cjs/ui/DropList/index.js

@@ -22,7 +22,7 @@ var _templateObject, _templateObject2, _templateObject3;
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); } /** @jsx jsx */
 var packageName = "@atlaskit/editor-common";
-var packageVersion = "78.26.5";
+var packageVersion = "78.27.1";
 var halfFocusRing = 1;
 var dropOffset = '0, 8';
 var DropList = /*#__PURE__*/function (_Component) {

package/dist/es2019/extensibility/Extension/InlineExtension/index.js

@@ -8,7 +8,7 @@ import { useSharedPluginState } from '../../../hooks';
 import { createWidthContext, WidthContext } from '../../../ui';
 import ExtensionLozenge from '../Lozenge';
 import { overlay } from '../styles';
-import { inlineWrapperStyels, wrapperStyle } from './styles';
+import { inlineWrapperStyles, wrapperStyle } from './styles';
 const InlineExtension = props => {
   const {
     node,
@@ -23,9 +23,12 @@ const InlineExtension = props => {
     widthState
   } = useSharedPluginState(pluginInjectionApi, ['width']);
   const hasChildren = !!children;
-  const classNames = classnames('extension-container', 'inline', 'with-overlay', {
+  const classNames = classnames('extension-container', 'inline', {
+    'with-overlay': !showMacroInteractionDesignUpdates,
     'with-children': hasChildren,
-    'with-danger-overlay': showMacroInteractionDesignUpdates
+    'with-danger-overlay': showMacroInteractionDesignUpdates,
+    'with-border': showMacroInteractionDesignUpdates,
+    'with-hover-border': showMacroInteractionDesignUpdates && isNodeHovered
   });
   const rendererContainerWidth = widthState ? widthState.width - akEditorGutterPadding * 2 : 0;
   const extendedInlineExtension = getBooleanFF('platform.editor.inline_extension.extended_lcqdn') || false;
@@ -41,7 +44,7 @@ const InlineExtension = props => {
     showMacroInteractionDesignUpdates: showMacroInteractionDesignUpdates
   }), jsx("div", {
     "data-testid": "inline-extension-wrapper",
-    css: [wrapperStyle, extendedInlineExtension && inlineWrapperStyels],
+    css: [wrapperStyle, extendedInlineExtension && inlineWrapperStyles],
     className: classNames,
     onMouseEnter: () => handleMouseEvent(true),
     onMouseLeave: () => handleMouseEvent(false)

package/dist/es2019/extensibility/Extension/InlineExtension/styles.js

@@ -1,4 +1,5 @@
 import { css } from '@emotion/react';
+import { N500 } from '@atlaskit/theme/colors';
 import { wrapperDefault } from '../styles';
 export const wrapperStyle = css(wrapperDefault, {
   cursor: 'pointer',
@@ -16,9 +17,15 @@ export const wrapperStyle = css(wrapperDefault, {
   '&.with-children': {
     padding: 0,
     background: "var(--ds-background-neutral-subtle, white)"
+  },
+  '&.with-border': {
+    border: `1px solid transparent` // adding this so macro doesn't jump when hover border is shown
+  },
+  '&.with-hover-border': {
+    border: `1px solid ${`var(--ds-border-input, ${N500})`}`
   }
 });
-export const inlineWrapperStyels = css({
+export const inlineWrapperStyles = css({
   maxWidth: '100%',
   'tr &': {
     maxWidth: 'inherit'

package/dist/es2019/monitoring/error.js

@@ -1,6 +1,6 @@
 const SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
 const packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
-const packageVersion = "78.26.5";
+const packageVersion = "78.27.1";
 const sanitiseSentryEvents = (data, _hint) => {
   // Remove URL as it has UGC
   // TODO: Sanitise the URL instead of just removing it

package/dist/es2019/ui/DropList/index.js

@@ -7,7 +7,7 @@ import { createAndFireEvent, withAnalyticsContext, withAnalyticsEvents } from '@
 import { N0, N50A, N60A, N900 } from '@atlaskit/theme/colors';
 import Layer from '../Layer';
 const packageName = "@atlaskit/editor-common";
-const packageVersion = "78.26.5";
+const packageVersion = "78.27.1";
 const halfFocusRing = 1;
 const dropOffset = '0, 8';
 class DropList extends Component {

package/dist/esm/extensibility/Extension/InlineExtension/index.js

@@ -8,7 +8,7 @@ import { useSharedPluginState } from '../../../hooks';
 import { createWidthContext, WidthContext } from '../../../ui';
 import ExtensionLozenge from '../Lozenge';
 import { overlay } from '../styles';
-import { inlineWrapperStyels, wrapperStyle } from './styles';
+import { inlineWrapperStyles, wrapperStyle } from './styles';
 var InlineExtension = function InlineExtension(props) {
   var node = props.node,
     pluginInjectionApi = props.pluginInjectionApi,
@@ -20,9 +20,12 @@ var InlineExtension = function InlineExtension(props) {
   var _useSharedPluginState = useSharedPluginState(pluginInjectionApi, ['width']),
     widthState = _useSharedPluginState.widthState;
   var hasChildren = !!children;
-  var classNames = classnames('extension-container', 'inline', 'with-overlay', {
+  var classNames = classnames('extension-container', 'inline', {
+    'with-overlay': !showMacroInteractionDesignUpdates,
     'with-children': hasChildren,
-    'with-danger-overlay': showMacroInteractionDesignUpdates
+    'with-danger-overlay': showMacroInteractionDesignUpdates,
+    'with-border': showMacroInteractionDesignUpdates,
+    'with-hover-border': showMacroInteractionDesignUpdates && isNodeHovered
   });
   var rendererContainerWidth = widthState ? widthState.width - akEditorGutterPadding * 2 : 0;
   var extendedInlineExtension = getBooleanFF('platform.editor.inline_extension.extended_lcqdn') || false;
@@ -38,7 +41,7 @@ var InlineExtension = function InlineExtension(props) {
     showMacroInteractionDesignUpdates: showMacroInteractionDesignUpdates
   }), jsx("div", {
     "data-testid": "inline-extension-wrapper",
-    css: [wrapperStyle, extendedInlineExtension && inlineWrapperStyels],
+    css: [wrapperStyle, extendedInlineExtension && inlineWrapperStyles],
     className: classNames,
     onMouseEnter: function onMouseEnter() {
       return handleMouseEvent(true);

package/dist/esm/extensibility/Extension/InlineExtension/styles.js

@@ -1,4 +1,5 @@
 import { css } from '@emotion/react';
+import { N500 } from '@atlaskit/theme/colors';
 import { wrapperDefault } from '../styles';
 export var wrapperStyle = css(wrapperDefault, {
   cursor: 'pointer',
@@ -16,9 +17,15 @@ export var wrapperStyle = css(wrapperDefault, {
   '&.with-children': {
     padding: 0,
     background: "var(--ds-background-neutral-subtle, white)"
+  },
+  '&.with-border': {
+    border: "1px solid transparent" // adding this so macro doesn't jump when hover border is shown
+  },
+  '&.with-hover-border': {
+    border: "1px solid ".concat("var(--ds-border-input, ".concat(N500, ")"))
   }
 });
-export var inlineWrapperStyels = css({
+export var inlineWrapperStyles = css({
   maxWidth: '100%',
   'tr &': {
     maxWidth: 'inherit'

package/dist/esm/monitoring/error.js

@@ -6,7 +6,7 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
 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) { _defineProperty(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 SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
 var packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
-var packageVersion = "78.26.5";
+var packageVersion = "78.27.1";
 var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
   // Remove URL as it has UGC
   // TODO: Sanitise the URL instead of just removing it

package/dist/esm/ui/DropList/index.js

@@ -17,7 +17,7 @@ import { createAndFireEvent, withAnalyticsContext, withAnalyticsEvents } from '@
 import { N0, N50A, N60A, N900 } from '@atlaskit/theme/colors';
 import Layer from '../Layer';
 var packageName = "@atlaskit/editor-common";
-var packageVersion = "78.26.5";
+var packageVersion = "78.27.1";
 var halfFocusRing = 1;
 var dropOffset = '0, 8';
 var DropList = /*#__PURE__*/function (_Component) {

package/dist/types/card/cardOptions.d.ts

@@ -18,4 +18,8 @@ export interface CardOptions {
     allowAlignment?: boolean;
     allowWrapping?: boolean;
     showUpgradeDiscoverability?: boolean;
+    /**
+     * Customises the outbound link to configure user preferences
+     */
+    userPreferencesLink?: string;
 }

package/dist/types/extensibility/Extension/InlineExtension/styles.d.ts

@@ -1,2 +1,2 @@
 export declare const wrapperStyle: import("@emotion/react").SerializedStyles;
-export declare const inlineWrapperStyels: import("@emotion/react").SerializedStyles;
+export declare const inlineWrapperStyles: import("@emotion/react").SerializedStyles;

package/dist/types-ts4.5/card/cardOptions.d.ts

@@ -18,4 +18,8 @@ export interface CardOptions {
     allowAlignment?: boolean;
     allowWrapping?: boolean;
     showUpgradeDiscoverability?: boolean;
+    /**
+     * Customises the outbound link to configure user preferences
+     */
+    userPreferencesLink?: string;
 }

package/dist/types-ts4.5/extensibility/Extension/InlineExtension/styles.d.ts

@@ -1,2 +1,2 @@
 export declare const wrapperStyle: import("@emotion/react").SerializedStyles;
-export declare const inlineWrapperStyels: import("@emotion/react").SerializedStyles;
+export declare const inlineWrapperStyles: import("@emotion/react").SerializedStyles;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/editor-common",
-  "version": "78.26.5",
+  "version": "78.27.1",
   "description": "A package that contains common classes and components for editor and renderer",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"