@atlaskit/editor-common 119.16.4 → 120.0.0

package/dist/esm/quick-insert/ElementBrowserQuickInsertMenuItem.js

@@ -0,0 +1,121 @@
+import React from 'react';
+
+// eslint-disable-next-line @atlaskit/design-system/no-emotion-primitives -- Compiled primitives do not provide Pressable.
+import { Box, Inline, Pressable, Stack, Text, xcss } from '@atlaskit/primitives';
+import { useQuickInsertMenuItemSelection } from './quickInsertMenuItemUtils';
+import { useQuickInsertContext } from './useQuickInsertContext';
+var itemStyles = xcss({
+  alignItems: 'start',
+  backgroundColor: 'color.background.neutral.subtle',
+  borderColor: 'color.border',
+  borderRadius: 'radius.medium',
+  borderStyle: 'solid',
+  borderWidth: 'border.width',
+  color: 'color.text',
+  cursor: 'pointer',
+  display: 'flex',
+  gap: 'space.150',
+  padding: 'space.150',
+  textAlign: 'start',
+  width: '100%'
+});
+var selectedItemStyles = xcss({
+  alignItems: 'start',
+  backgroundColor: 'color.background.selected',
+  borderColor: 'color.border.selected',
+  borderRadius: 'radius.medium',
+  borderStyle: 'solid',
+  borderWidth: 'border.width',
+  color: 'color.text',
+  cursor: 'pointer',
+  display: 'flex',
+  gap: 'space.150',
+  padding: 'space.150',
+  textAlign: 'start',
+  width: '100%'
+});
+var disabledItemStyles = xcss({
+  alignItems: 'start',
+  backgroundColor: 'color.background.neutral.subtle',
+  borderColor: 'color.border',
+  borderRadius: 'radius.medium',
+  borderStyle: 'solid',
+  borderWidth: 'border.width',
+  color: 'color.text.disabled',
+  cursor: 'not-allowed',
+  display: 'flex',
+  gap: 'space.150',
+  padding: 'space.150',
+  textAlign: 'start',
+  width: '100%'
+});
+var iconStyles = xcss({
+  alignItems: 'center',
+  backgroundColor: 'elevation.surface.overlay',
+  borderColor: 'color.border',
+  borderRadius: 'radius.medium',
+  borderStyle: 'solid',
+  borderWidth: 'border.width',
+  display: 'flex',
+  flexShrink: 0,
+  height: '40px',
+  justifyContent: 'center',
+  overflow: 'hidden',
+  width: '40px'
+});
+var descriptionStyles = xcss({
+  color: 'color.text.subtle'
+});
+var shortcutStyles = xcss({
+  backgroundColor: 'color.background.neutral',
+  borderRadius: 'radius.small',
+  color: 'color.text.subtle',
+  font: 'font.body.small',
+  paddingBlock: 'space.025',
+  paddingInline: 'space.050'
+});
+export var ElementBrowserQuickInsertMenuItem = function ElementBrowserQuickInsertMenuItem(_ref) {
+  var ariaLabel = _ref.ariaLabel,
+    description = _ref.description,
+    iconBefore = _ref.iconBefore,
+    isDisabled = _ref.isDisabled,
+    onSelect = _ref.onSelect,
+    shortcut = _ref.shortcut,
+    _ref$shouldWrapIcon = _ref.shouldWrapIcon,
+    shouldWrapIcon = _ref$shouldWrapIcon === void 0 ? true : _ref$shouldWrapIcon,
+    title = _ref.title;
+  var _useQuickInsertContex = useQuickInsertContext(),
+    item = _useQuickInsertContex.item;
+  var _ref2 = item !== null && item !== void 0 ? item : {
+      id: undefined,
+      isSelected: false
+    },
+    id = _ref2.id,
+    isSelected = _ref2.isSelected;
+  var handleClick = useQuickInsertMenuItemSelection(onSelect);
+  return /*#__PURE__*/React.createElement(Pressable, {
+    "aria-label": ariaLabel,
+    "aria-selected": isSelected,
+    id: id,
+    isDisabled: isDisabled,
+    onClick: handleClick,
+    role: "option",
+    xcss: isDisabled ? disabledItemStyles : isSelected ? selectedItemStyles : itemStyles
+  }, iconBefore && shouldWrapIcon ? /*#__PURE__*/React.createElement(Box, {
+    xcss: iconStyles
+  }, iconBefore) : iconBefore, /*#__PURE__*/React.createElement(Stack, {
+    space: "space.050",
+    grow: "fill"
+  }, /*#__PURE__*/React.createElement(Inline, {
+    alignBlock: "center",
+    spread: "space-between",
+    space: "space.100"
+  }, /*#__PURE__*/React.createElement(Text, {
+    weight: "medium"
+  }, title), shortcut && /*#__PURE__*/React.createElement(Box, {
+    as: "span",
+    xcss: shortcutStyles
+  }, shortcut)), description && /*#__PURE__*/React.createElement(Box, {
+    xcss: descriptionStyles
+  }, /*#__PURE__*/React.createElement(Text, null, description))));
+};

package/dist/esm/quick-insert/QuickInsertMenuItem.js

@@ -1,54 +1,35 @@
-/* QuickInsertMenuItem.tsx generated by @compiled/babel-plugin v2.0.0 */
-import "./QuickInsertMenuItem.compiled.css";
-import { ax, ix } from "@compiled/react/runtime";
-import React, { useCallback } from 'react';
-import ButtonItem from '@atlaskit/menu/button-item';
-import { Box, Inline, Text } from '@atlaskit/primitives/compiled';
+import React from 'react';
+import { ElementBrowserQuickInsertMenuItem } from './ElementBrowserQuickInsertMenuItem';
+import { TypeAheadQuickInsertMenuItem } from './TypeAheadQuickInsertMenuItem';
 import { useQuickInsertContext } from './useQuickInsertContext';
-var styles = {
-  icon: "_2rko1qi0 _1reo15vq _18m915vq _1h6d1l7x _1dqonqa1 _189ee4h9 _4cvr1h6o _bfhk1bhr _1e0c1txw _4t3izwfg _1bah1h6o _1bsbzwfg",
-  shortcut: "_2rko12b0 _11c8wadc _1rjcv77o _18zr1b66 _bfhki8nm _syazazsu"
-};
 export var QuickInsertMenuItem = function QuickInsertMenuItem(_ref) {
-  var _item$isSelected;
   var ariaLabel = _ref.ariaLabel,
+    description = _ref.description,
     iconBefore = _ref.iconBefore,
     isDisabled = _ref.isDisabled,
     onSelect = _ref.onSelect,
     shortcut = _ref.shortcut,
-    _ref$shouldWrapIcon = _ref.shouldWrapIcon,
-    shouldWrapIcon = _ref$shouldWrapIcon === void 0 ? true : _ref$shouldWrapIcon,
+    shouldWrapIcon = _ref.shouldWrapIcon,
     title = _ref.title;
   var _useQuickInsertContex = useQuickInsertContext(),
-    editorView = _useQuickInsertContex.editorView,
-    item = _useQuickInsertContex.item,
-    select = _useQuickInsertContex.select;
-  var isSelected = (_item$isSelected = item === null || item === void 0 ? void 0 : item.isSelected) !== null && _item$isSelected !== void 0 ? _item$isSelected : false;
-  var handleClick = useCallback(function () {
-    return select(function (selectionContext) {
-      return onSelect({
-        editorView: editorView,
-        insert: selectionContext.insert,
-        source: selectionContext.source
-      });
-    });
-  }, [editorView, onSelect, select]);
-  return /*#__PURE__*/React.createElement(ButtonItem, {
-    "aria-label": ariaLabel,
-    "aria-selected": isSelected,
-    iconBefore: iconBefore && shouldWrapIcon ? /*#__PURE__*/React.createElement(Box, {
-      xcss: styles.icon
-    }, iconBefore) : iconBefore,
-    id: item === null || item === void 0 ? void 0 : item.id,
+    surface = _useQuickInsertContex.surface;
+  return surface === 'element-browser' ? /*#__PURE__*/React.createElement(ElementBrowserQuickInsertMenuItem, {
+    ariaLabel: ariaLabel,
+    description: description,
+    iconBefore: iconBefore,
     isDisabled: isDisabled,
-    isSelected: isSelected,
-    onClick: handleClick,
-    role: "option"
-  }, /*#__PURE__*/React.createElement(Inline, {
-    alignBlock: "center",
-    spread: "space-between"
-  }, /*#__PURE__*/React.createElement(Text, null, title), shortcut && /*#__PURE__*/React.createElement(Box, {
-    as: "span",
-    xcss: styles.shortcut
-  }, shortcut)));
+    onSelect: onSelect,
+    shortcut: shortcut,
+    shouldWrapIcon: shouldWrapIcon,
+    title: title
+  }) : /*#__PURE__*/React.createElement(TypeAheadQuickInsertMenuItem, {
+    ariaLabel: ariaLabel,
+    description: description,
+    iconBefore: iconBefore,
+    isDisabled: isDisabled,
+    onSelect: onSelect,
+    shortcut: shortcut,
+    shouldWrapIcon: shouldWrapIcon,
+    title: title
+  });
 };

package/dist/esm/quick-insert/TypeAheadQuickInsertMenuItem.js

@@ -0,0 +1,49 @@
+/* TypeAheadQuickInsertMenuItem.tsx generated by @compiled/babel-plugin v2.0.0 */
+import "./TypeAheadQuickInsertMenuItem.compiled.css";
+import { ax, ix } from "@compiled/react/runtime";
+import React from 'react';
+import ButtonItem from '@atlaskit/menu/button-item';
+import { Box, Inline, Text } from '@atlaskit/primitives/compiled';
+import { useQuickInsertMenuItemSelection } from './quickInsertMenuItemUtils';
+import { useQuickInsertContext } from './useQuickInsertContext';
+var styles = {
+  icon: "_2rko1qi0 _1reo15vq _18m915vq _1h6d1l7x _1dqonqa1 _189ee4h9 _4cvr1h6o _bfhk1bhr _1e0c1txw _4t3izwfg _1bah1h6o _1bsbzwfg",
+  shortcut: "_2rko12b0 _11c8wadc _1rjcv77o _18zr1b66 _bfhki8nm _syazazsu"
+};
+export var TypeAheadQuickInsertMenuItem = function TypeAheadQuickInsertMenuItem(_ref) {
+  var ariaLabel = _ref.ariaLabel,
+    iconBefore = _ref.iconBefore,
+    isDisabled = _ref.isDisabled,
+    onSelect = _ref.onSelect,
+    shortcut = _ref.shortcut,
+    _ref$shouldWrapIcon = _ref.shouldWrapIcon,
+    shouldWrapIcon = _ref$shouldWrapIcon === void 0 ? true : _ref$shouldWrapIcon,
+    title = _ref.title;
+  var _useQuickInsertContex = useQuickInsertContext(),
+    item = _useQuickInsertContex.item;
+  var _ref2 = item !== null && item !== void 0 ? item : {
+      id: undefined,
+      isSelected: false
+    },
+    id = _ref2.id,
+    isSelected = _ref2.isSelected;
+  var handleClick = useQuickInsertMenuItemSelection(onSelect);
+  return /*#__PURE__*/React.createElement(ButtonItem, {
+    "aria-label": ariaLabel,
+    "aria-selected": isSelected,
+    iconBefore: iconBefore && shouldWrapIcon ? /*#__PURE__*/React.createElement(Box, {
+      xcss: styles.icon
+    }, iconBefore) : iconBefore,
+    id: id,
+    isDisabled: isDisabled,
+    isSelected: isSelected,
+    onClick: handleClick,
+    role: "option"
+  }, /*#__PURE__*/React.createElement(Inline, {
+    alignBlock: "center",
+    spread: "space-between"
+  }, /*#__PURE__*/React.createElement(Text, null, title), shortcut && /*#__PURE__*/React.createElement(Box, {
+    as: "span",
+    xcss: styles.shortcut
+  }, shortcut)));
+};

package/dist/esm/quick-insert/quickInsertMenuItemUtils.js

@@ -0,0 +1,16 @@
+import { useCallback } from 'react';
+import { useQuickInsertContext } from './useQuickInsertContext';
+export var useQuickInsertMenuItemSelection = function useQuickInsertMenuItemSelection(onSelect) {
+  var _useQuickInsertContex = useQuickInsertContext(),
+    editorView = _useQuickInsertContex.editorView,
+    select = _useQuickInsertContex.select;
+  return useCallback(function () {
+    return select(function (selectionContext) {
+      return onSelect({
+        editorView: editorView,
+        insert: selectionContext.insert,
+        source: selectionContext.source
+      });
+    });
+  }, [editorView, onSelect, select]);
+};

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

@@ -21,7 +21,7 @@ import withAnalyticsEvents from '@atlaskit/analytics-next/withAnalyticsEvents';
 import { fg } from '@atlaskit/platform-feature-flags/fg';
 import Layer from '../Layer';
 var packageName = "@atlaskit/editor-common";
-var packageVersion = "119.16.3";
+var packageVersion = "119.17.0";
 var halfFocusRing = 1;
 var dropOffset = '0, 8';
 var fadeIn = keyframes({

package/dist/types/media-insert/rank.d.ts

@@ -0,0 +1,3 @@
+import { MEDIA_INSERT_TAB } from '../analytics/types/enums';
+export declare const DEFAULT_MEDIA_INSERT_TAB_RANK = 0;
+export declare const MEDIA_INSERT_TAB_RANK: Readonly<Record<MEDIA_INSERT_TAB, number>>;

package/dist/types/node-anchor/limited-mode-document-thresholds.d.ts

@@ -1,5 +1,32 @@
 /** Fixed document thresholds for limited (performance) mode (previously Statsig-driven). */
 export declare const LIMITED_MODE_DEFAULT_NODE_COUNT_THRESHOLD = 5000;
 export declare const LIMITED_MODE_DEFAULT_DOC_SIZE_THRESHOLD = 30000;
-/** When true, any legacy-content macro triggers limited mode regardless of size/count. */
-export declare const LIMITED_MODE_INCLUDE_LEGACY_CONTENT_IN_THRESHOLD = true;
+/**
+ * Treatment node-count threshold. Production node-count percentiles across all documents are
+ * p90 ≈ 206, p95 ≈ 576, p99 ≈ 2,438 — today's 5,000 sits beyond p99 and fires on only ~0.36% of
+ * documents. 2,500 is p99 rounded, i.e. limited mode becomes a guard on the largest ~1% of pages.
+ *
+ * Deliberately NOT lower: the worst-5%-by-INP cohort has a median document of ~25 nodes, so its
+ * slowness is device/extension/collab-bound and structurally invisible. No node-count value catches
+ * it without enabling limited mode for nearly everyone (300 nodes ⇒ 8% of all sessions for 34%
+ * recall). Chasing that cohort needs a runtime input-latency trigger, not a bigger document guard.
+ */
+export declare const LIMITED_MODE_TWEAKED_NODE_COUNT_THRESHOLD = 2438;
+/**
+ * Treatment `nodeSize` threshold — a backstop for pathologically huge documents, not a routine
+ * trigger. Input latency really does degrade at extreme document sizes: the 100k+ `nodeSize` bucket
+ * sits at p90 113.5ms / p99 899ms, against p90 25.6ms in the 6k–11k bucket. But that curve is smooth
+ * and only becomes severe far past the body of the distribution (production `nodeSize` p99 is
+ * ~91.8k), so this is set well beyond p99 rather than at the control's 30,000 — which fires around
+ * p95 and so degrades a large population of plain long-text pages that type perfectly well.
+ */
+export declare const LIMITED_MODE_TWEAKED_DOC_SIZE_THRESHOLD = 750000;
+export type LimitedModeThresholds = {
+    docSizeThreshold: number;
+    nodeCountThreshold: number;
+};
+/**
+ * The document thresholds currently in force. This is the only place the cohort is resolved — the
+ * limited-mode decision itself is identical either way, only these two numbers change.
+ */
+export declare const getLimitedModeThresholds: () => LimitedModeThresholds;

package/dist/types/node-anchor/should-enable-limited-mode.d.ts

@@ -0,0 +1,21 @@
+import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
+/**
+ * Single source of truth for the limited (performance) mode decision.
+ *
+ * Shared by the limited-mode plugin (`editor-plugin-limited-mode/src/pm-plugins/main.ts`) and the
+ * node-anchor provider (`node-anchor-provider.ts`) so the logic can no longer drift between two
+ * hand-synced copies. It lives in `editor-common` to avoid a circular dependency (the plugin already
+ * depends on `editor-common`; `editor-common` must not depend on the plugin).
+ *
+ * Limited mode is enabled when ANY of the following is true:
+ * 1. `doc.nodeSize` exceeds the doc-size threshold (checked first, O(1))
+ * 2. the document contains a legacy-content macro (LCM)
+ * 3. node count exceeds the node-count threshold
+ *
+ * The thresholds come from `getLimitedModeThresholds()`, which is where the
+ * `platform_editor_limited_threshold_tweaks` cohort is resolved — see
+ * `limited-mode-document-thresholds.ts` for the values and the data behind them.
+ *
+ * Performance: doc size is checked first so an oversized document skips the traversal entirely.
+ */
+export declare const shouldEnableLimitedModeForDocument: (doc: PMNode) => boolean;

package/dist/types/quick-insert/ElementBrowserQuickInsertMenuItem.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import type { QuickInsertMenuItemProps } from './QuickInsertMenuItem';
+export declare const ElementBrowserQuickInsertMenuItem: ({ ariaLabel, description, iconBefore, isDisabled, onSelect, shortcut, shouldWrapIcon, title, }: QuickInsertMenuItemProps) => React.JSX.Element;

package/dist/types/quick-insert/QuickInsertContext.d.ts

@@ -18,5 +18,6 @@ export type QuickInsertContextValue = {
     menuOpenId?: symbol;
     select: (selectionHandler: QuickInsertSelectionHandler) => void;
     surfaceContext?: SurfaceContext;
+    surface: 'typeahead' | 'element-browser';
 };
 export declare const QuickInsertContext: Context<QuickInsertContextValue | null>;

package/dist/types/quick-insert/QuickInsertMenuItem.d.ts

@@ -3,8 +3,14 @@ import type { Transaction } from '@atlaskit/editor-prosemirror/state';
 import type { EditorView } from '@atlaskit/editor-prosemirror/view';
 import type { INPUT_METHOD } from '../analytics';
 import type { TypeAheadInsert } from '../types';
-type Props = {
+export type OnSelectContext = {
+    editorView: EditorView;
+    insert: TypeAheadInsert;
+    source: INPUT_METHOD.ELEMENT_BROWSER | INPUT_METHOD.QUICK_INSERT | INPUT_METHOD.TOOLBAR;
+};
+export type QuickInsertMenuItemProps = {
     ariaLabel?: string;
+    description?: string;
     iconBefore?: React.ReactNode;
     isDisabled?: boolean;
     onSelect: (context: OnSelectContext) => Transaction | false | void;
@@ -12,10 +18,4 @@ type Props = {
     shouldWrapIcon?: boolean;
     title: string;
 };
-export type OnSelectContext = {
-    editorView: EditorView;
-    insert: TypeAheadInsert;
-    source: INPUT_METHOD.ELEMENT_BROWSER | INPUT_METHOD.QUICK_INSERT | INPUT_METHOD.TOOLBAR;
-};
-export declare const QuickInsertMenuItem: ({ ariaLabel, iconBefore, isDisabled, onSelect, shortcut, shouldWrapIcon, title, }: Props) => React.JSX.Element;
-export {};
+export declare const QuickInsertMenuItem: ({ ariaLabel, description, iconBefore, isDisabled, onSelect, shortcut, shouldWrapIcon, title, }: QuickInsertMenuItemProps) => React.JSX.Element;

package/dist/types/quick-insert/TypeAheadQuickInsertMenuItem.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import type { QuickInsertMenuItemProps } from './QuickInsertMenuItem';
+export declare const TypeAheadQuickInsertMenuItem: ({ ariaLabel, iconBefore, isDisabled, onSelect, shortcut, shouldWrapIcon, title, }: QuickInsertMenuItemProps) => React.JSX.Element;

package/dist/types/quick-insert/quickInsertMenuItemUtils.d.ts

@@ -0,0 +1,2 @@
+import type { QuickInsertMenuItemProps } from './QuickInsertMenuItem';
+export declare const useQuickInsertMenuItemSelection: (onSelect: QuickInsertMenuItemProps['onSelect']) => (() => void);

package/media-insert/rank/package.json

@@ -0,0 +1,10 @@
+{
+  "name": "@atlaskit/editor-common/media-insert/rank",
+  "main": "../../dist/cjs/media-insert/rank.js",
+  "module": "../../dist/esm/media-insert/rank.js",
+  "module:es2019": "../../dist/es2019/media-insert/rank.js",
+  "sideEffects": [
+    "**/*.compiled.css"
+  ],
+  "types": "../../dist/types/media-insert/rank.d.ts"
+}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-common",
-	"version": "119.16.4",
+	"version": "120.0.0",
 	"description": "A package that contains common classes and components for editor and renderer",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -29,7 +29,7 @@
 	},
 	"dependencies": {
 		"@atlaskit/activity-provider": "^3.0.0",
-		"@atlaskit/adf-schema": "^57.0.0",
+		"@atlaskit/adf-schema": "^57.1.0",
 		"@atlaskit/adf-utils": "^20.7.0",
 		"@atlaskit/afm-i18n-platform-editor-editor-common": "2.200.0",
 		"@atlaskit/analytics-listeners": "^11.1.0",

package/should-enable-limited-mode/package.json

@@ -0,0 +1,10 @@
+{
+  "name": "@atlaskit/editor-common/should-enable-limited-mode",
+  "main": "../dist/cjs/node-anchor/should-enable-limited-mode.js",
+  "module": "../dist/esm/node-anchor/should-enable-limited-mode.js",
+  "module:es2019": "../dist/es2019/node-anchor/should-enable-limited-mode.js",
+  "sideEffects": [
+    "**/*.compiled.css"
+  ],
+  "types": "../dist/types/node-anchor/should-enable-limited-mode.d.ts"
+}