@atlaskit/editor-plugin-toolbar-lists-indentation 11.1.7 → 11.2.0

package/dist/esm/ui/toolbar-components/NumberedListMenuItem.js

@@ -5,24 +5,45 @@ import { toggleOrderedList as toggleOrderedListKeymap, formatShortcut } from '@a
 import { listMessages } from '@atlaskit/editor-common/messages';
 import { getInputMethodFromParentKeys } from '@atlaskit/editor-common/toolbar';
 import { ListNumberedIcon, ToolbarDropdownItem, ToolbarKeyboardShortcutHint } from '@atlaskit/editor-toolbar';
+import { isMarkdownCompatibleToolbarEnabled } from '../utils/markdown-compatible-toolbar';
 export var NumberedListMenuItem = function NumberedListMenuItem(_ref) {
   var api = _ref.api,
     parents = _ref.parents;
   var _useIntl = useIntl(),
     formatMessage = _useIntl.formatMessage;
-  var _useSharedPluginState = useSharedPluginStateWithSelector(api, ['list', 'taskDecision'], function (states) {
-      var _states$listState, _states$listState2, _states$taskDecisionS;
+  var isMarkdownToolbarEnabled = isMarkdownCompatibleToolbarEnabled();
+  var _useSharedPluginState = useSharedPluginStateWithSelector(api, ['list', 'taskDecision', 'markdownMode'], function (states) {
+      var _states$listState, _states$listState2, _states$taskDecisionS, _states$markdownModeS, _states$markdownModeS2, _states$markdownModeS3;
       return {
         orderedListActive: (_states$listState = states.listState) === null || _states$listState === void 0 ? void 0 : _states$listState.orderedListActive,
         orderedListDisabled: (_states$listState2 = states.listState) === null || _states$listState2 === void 0 ? void 0 : _states$listState2.orderedListDisabled,
-        taskListActive: (_states$taskDecisionS = states.taskDecisionState) === null || _states$taskDecisionS === void 0 ? void 0 : _states$taskDecisionS.isInsideTask
+        taskListActive: (_states$taskDecisionS = states.taskDecisionState) === null || _states$taskDecisionS === void 0 ? void 0 : _states$taskDecisionS.isInsideTask,
+        markdownView: isMarkdownToolbarEnabled ? (_states$markdownModeS = states.markdownModeState) === null || _states$markdownModeS === void 0 ? void 0 : _states$markdownModeS.view : undefined,
+        sourceBlockFormatState: isMarkdownToolbarEnabled ? (_states$markdownModeS2 = states.markdownModeState) === null || _states$markdownModeS2 === void 0 ? void 0 : _states$markdownModeS2.sourceBlockFormatState : null,
+        sourceListFormatState: isMarkdownToolbarEnabled ? (_states$markdownModeS3 = states.markdownModeState) === null || _states$markdownModeS3 === void 0 ? void 0 : _states$markdownModeS3.sourceListFormatState : null
       };
     }),
     orderedListActive = _useSharedPluginState.orderedListActive,
     orderedListDisabled = _useSharedPluginState.orderedListDisabled,
-    taskListActive = _useSharedPluginState.taskListActive;
+    taskListActive = _useSharedPluginState.taskListActive,
+    sourceBlockFormatState = _useSharedPluginState.sourceBlockFormatState,
+    sourceListFormatState = _useSharedPluginState.sourceListFormatState,
+    markdownView = _useSharedPluginState.markdownView;
+  var isInSourceView = isMarkdownToolbarEnabled && markdownView === 'syntax';
+  var isSourceTaskListActive = Boolean(sourceListFormatState === null || sourceListFormatState === void 0 ? void 0 : sourceListFormatState.inTaskList);
   var onClick = function onClick() {
     var _api$taskDecision;
+    if (isInSourceView) {
+      var _api$markdownMode;
+      if (sourceBlockFormatState !== null && sourceBlockFormatState !== void 0 && sourceBlockFormatState.inCodeBlock) {
+        return;
+      }
+      if (isSourceTaskListActive) {
+        return;
+      }
+      api === null || api === void 0 || (_api$markdownMode = api.markdownMode) === null || _api$markdownMode === void 0 || _api$markdownMode.actions.toggleSourceOrderedList();
+      return;
+    }
     api === null || api === void 0 || api.core.actions.execute(taskListActive ? api === null || api === void 0 || (_api$taskDecision = api.taskDecision) === null || _api$taskDecision === void 0 ? void 0 : _api$taskDecision.commands.toggleTaskList('orderedList') : api === null || api === void 0 ? void 0 : api.list.commands.toggleOrderedList(getInputMethodFromParentKeys(parents)));
   };
   var shortcut = formatShortcut(toggleOrderedListKeymap);
@@ -34,8 +55,8 @@ export var NumberedListMenuItem = function NumberedListMenuItem(_ref) {
     elemAfter: shortcut ? /*#__PURE__*/React.createElement(ToolbarKeyboardShortcutHint, {
       shortcut: shortcut
     }) : undefined,
-    isSelected: orderedListActive,
-    isDisabled: orderedListDisabled && !taskListActive,
+    isSelected: isInSourceView ? sourceListFormatState === null || sourceListFormatState === void 0 ? void 0 : sourceListFormatState.inOrderedList : orderedListActive,
+    isDisabled: isInSourceView ? Boolean((sourceBlockFormatState === null || sourceBlockFormatState === void 0 ? void 0 : sourceBlockFormatState.inCodeBlock) || isSourceTaskListActive) : orderedListDisabled && !taskListActive,
     onClick: onClick,
     ariaKeyshortcuts: shortcut
   }, formatMessage(listMessages.orderedList));

package/dist/esm/ui/toolbar-components/TaskListMenuItem.js

@@ -1,22 +1,51 @@
 import React from 'react';
 import { useIntl } from 'react-intl';
+import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
 import { tasksAndDecisionsMessages } from '@atlaskit/editor-common/messages';
 import { useEditorToolbar } from '@atlaskit/editor-common/toolbar';
-import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
 import { ToolbarDropdownItem, ToolbarKeyboardShortcutHint } from '@atlaskit/editor-toolbar';
 import TaskIcon from '@atlaskit/icon/core/task';
+import { isMarkdownCompatibleToolbarEnabled } from '../utils/markdown-compatible-toolbar';
 export var TaskListMenuItem = function TaskListMenuItem(_ref) {
   var api = _ref.api;
   var _useIntl = useIntl(),
     formatMessage = _useIntl.formatMessage;
   var _useEditorToolbar = useEditorToolbar(),
     editorView = _useEditorToolbar.editorView;
-  var taskListActive = useSharedPluginStateSelector(api, 'taskDecision.isInsideTask');
+  var isMarkdownToolbarEnabled = isMarkdownCompatibleToolbarEnabled();
+  // Mirror the sibling BulletedListMenuItem / NumberedListMenuItem pattern:
+  // gate the markdown-mode field reads behind the feature flag inside the
+  // selector so we don't trigger re-renders on CM6 state changes for users
+  // who don't have the markdown-compatible toolbar enabled.
+  var _useSharedPluginState = useSharedPluginStateWithSelector(api, ['taskDecision', 'markdownMode'], function (states) {
+      var _states$taskDecisionS, _states$markdownModeS, _states$markdownModeS2, _states$markdownModeS3;
+      return {
+        taskListActive: (_states$taskDecisionS = states.taskDecisionState) === null || _states$taskDecisionS === void 0 ? void 0 : _states$taskDecisionS.isInsideTask,
+        markdownView: isMarkdownToolbarEnabled ? (_states$markdownModeS = states.markdownModeState) === null || _states$markdownModeS === void 0 ? void 0 : _states$markdownModeS.view : undefined,
+        sourceBlockFormatState: isMarkdownToolbarEnabled ? (_states$markdownModeS2 = states.markdownModeState) === null || _states$markdownModeS2 === void 0 ? void 0 : _states$markdownModeS2.sourceBlockFormatState : null,
+        sourceListFormatState: isMarkdownToolbarEnabled ? (_states$markdownModeS3 = states.markdownModeState) === null || _states$markdownModeS3 === void 0 ? void 0 : _states$markdownModeS3.sourceListFormatState : null
+      };
+    }),
+    taskListActive = _useSharedPluginState.taskListActive,
+    markdownView = _useSharedPluginState.markdownView,
+    sourceBlockFormatState = _useSharedPluginState.sourceBlockFormatState,
+    sourceListFormatState = _useSharedPluginState.sourceListFormatState;
   if (!(editorView !== null && editorView !== void 0 && editorView.state.schema.nodes.taskItem)) {
     return null;
   }
+  var isInSourceView = isMarkdownToolbarEnabled && markdownView === 'syntax';
+  var isSelected = isInSourceView ? sourceListFormatState === null || sourceListFormatState === void 0 ? void 0 : sourceListFormatState.inTaskList : taskListActive;
+  var isDisabled = Boolean(isInSourceView && (sourceBlockFormatState === null || sourceBlockFormatState === void 0 ? void 0 : sourceBlockFormatState.inCodeBlock));
   var handleClick = function handleClick() {
     var _api$taskDecision;
+    if (isDisabled) {
+      return;
+    }
+    if (isInSourceView) {
+      var _api$markdownMode;
+      api === null || api === void 0 || (_api$markdownMode = api.markdownMode) === null || _api$markdownMode === void 0 || _api$markdownMode.actions.toggleSourceTaskList();
+      return;
+    }
     api === null || api === void 0 || api.core.actions.execute(api === null || api === void 0 || (_api$taskDecision = api.taskDecision) === null || _api$taskDecision === void 0 ? void 0 : _api$taskDecision.commands.toggleTaskList());
   };
   return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
@@ -27,8 +56,8 @@ export var TaskListMenuItem = function TaskListMenuItem(_ref) {
     elemAfter: /*#__PURE__*/React.createElement(ToolbarKeyboardShortcutHint, {
       shortcut: "[]"
     }),
-    isSelected: taskListActive,
-    isDisabled: false,
+    isSelected: isSelected,
+    isDisabled: isDisabled,
     onClick: handleClick
   }, formatMessage(tasksAndDecisionsMessages.taskList));
 };

package/dist/esm/ui/utils/markdown-compatible-toolbar.js

@@ -0,0 +1,5 @@
+import { fg } from '@atlaskit/platform-feature-flags';
+import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
+export var isMarkdownCompatibleToolbarEnabled = function isMarkdownCompatibleToolbarEnabled() {
+  return expValEqualsNoExposure('cc-markdown-mode', 'isEnabled', true) && fg('platform_editor_markdown_compatible_toolbar');
+};

package/dist/types/toolbarListsIndentationPluginType.d.ts

@@ -13,7 +13,32 @@ export type ToolbarListsIndentationPluginOptions = {
     allowHeadingAndParagraphIndentation: boolean;
     showIndentationButtons: boolean;
 };
+/**
+ * Minimal duck-typed slice of `@atlassian/editor-plugin-markdown-mode`'s
+ * `MarkdownModePlugin` covering only the list/task source-view surface this
+ * plugin uses. See `editor-plugin-text-formatting/textFormattingPluginType.ts`
+ * for the rationale for not importing the real type.
+ */
+type _MarkdownModePluginStub = NextEditorPlugin<'markdownMode', {
+    actions: {
+        toggleSourceBulletList: () => boolean;
+        toggleSourceOrderedList: () => boolean;
+        toggleSourceTaskList: () => boolean;
+    };
+    sharedState: {
+        sourceBlockFormatState: {
+            inCodeBlock: boolean;
+        } | null;
+        sourceListFormatState: {
+            inBulletList: boolean;
+            inOrderedList: boolean;
+            inTaskList: boolean;
+        } | null;
+        view: 'syntax' | 'split-view' | 'preview';
+    } | undefined;
+}>;
 export type ToolbarListsIndentationPluginDependencies = [
+    OptionalPlugin<_MarkdownModePluginStub>,
     OptionalPlugin<FeatureFlagsPlugin>,
     ListPlugin,
     OptionalPlugin<IndentationPlugin>,
@@ -29,3 +54,4 @@ export type ToolbarListsIndentationPlugin = NextEditorPlugin<'toolbarListsIndent
     dependencies: ToolbarListsIndentationPluginDependencies;
     pluginConfiguration: ToolbarListsIndentationPluginOptions;
 }>;
+export {};

package/dist/types/ui/utils/markdown-compatible-toolbar.d.ts

@@ -0,0 +1 @@
+export declare const isMarkdownCompatibleToolbarEnabled: () => boolean;

package/dist/types-ts4.5/toolbarListsIndentationPluginType.d.ts

@@ -13,7 +13,32 @@ export type ToolbarListsIndentationPluginOptions = {
     allowHeadingAndParagraphIndentation: boolean;
     showIndentationButtons: boolean;
 };
+/**
+ * Minimal duck-typed slice of `@atlassian/editor-plugin-markdown-mode`'s
+ * `MarkdownModePlugin` covering only the list/task source-view surface this
+ * plugin uses. See `editor-plugin-text-formatting/textFormattingPluginType.ts`
+ * for the rationale for not importing the real type.
+ */
+type _MarkdownModePluginStub = NextEditorPlugin<'markdownMode', {
+    actions: {
+        toggleSourceBulletList: () => boolean;
+        toggleSourceOrderedList: () => boolean;
+        toggleSourceTaskList: () => boolean;
+    };
+    sharedState: {
+        sourceBlockFormatState: {
+            inCodeBlock: boolean;
+        } | null;
+        sourceListFormatState: {
+            inBulletList: boolean;
+            inOrderedList: boolean;
+            inTaskList: boolean;
+        } | null;
+        view: 'syntax' | 'split-view' | 'preview';
+    } | undefined;
+}>;
 export type ToolbarListsIndentationPluginDependencies = [
+    OptionalPlugin<_MarkdownModePluginStub>,
     OptionalPlugin<FeatureFlagsPlugin>,
     ListPlugin,
     OptionalPlugin<IndentationPlugin>,
@@ -29,3 +54,4 @@ export type ToolbarListsIndentationPlugin = NextEditorPlugin<'toolbarListsIndent
     dependencies: ToolbarListsIndentationPluginDependencies;
     pluginConfiguration: ToolbarListsIndentationPluginOptions;
 }>;
+export {};

package/dist/types-ts4.5/ui/utils/markdown-compatible-toolbar.d.ts

@@ -0,0 +1 @@
+export declare const isMarkdownCompatibleToolbarEnabled: () => boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-toolbar-lists-indentation",
-	"version": "11.1.7",
+	"version": "11.2.0",
 	"description": "Toolbar lists and indentation plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -38,25 +38,25 @@
 		"@atlaskit/editor-plugin-list": "^12.1.0",
 		"@atlaskit/editor-plugin-primary-toolbar": "^11.1.0",
 		"@atlaskit/editor-plugin-selection-toolbar": "^11.3.0",
-		"@atlaskit/editor-plugin-tasks-and-decisions": "^13.2.0",
+		"@atlaskit/editor-plugin-tasks-and-decisions": "^13.3.0",
 		"@atlaskit/editor-plugin-toolbar": "^7.3.0",
 		"@atlaskit/editor-prosemirror": "^7.3.0",
-		"@atlaskit/editor-toolbar": "^1.7.0",
+		"@atlaskit/editor-toolbar": "^1.8.0",
 		"@atlaskit/editor-toolbar-model": "^0.5.0",
 		"@atlaskit/icon": "^35.3.0",
 		"@atlaskit/platform-feature-flags": "^1.1.0",
-		"@atlaskit/tmp-editor-statsig": "^84.0.0",
+		"@atlaskit/tmp-editor-statsig": "^84.2.0",
 		"@atlaskit/tokens": "^13.0.0",
 		"@babel/runtime": "^7.0.0"
 	},
 	"peerDependencies": {
-		"@atlaskit/editor-common": "^114.47.0",
+		"@atlaskit/editor-common": "^114.48.0",
 		"react": "^18.2.0",
 		"react-dom": "^18.2.0",
 		"react-intl": "^5.25.1 || ^6.0.0 || ^7.0.0"
 	},
 	"devDependencies": {
-		"@atlaskit/adf-schema": "^52.14.0",
+		"@atlaskit/adf-schema": "^52.15.0",
 		"@testing-library/react": "^16.3.0",
 		"react": "^18.2.0",
 		"react-dom": "^18.2.0",
@@ -99,6 +99,9 @@
 		}
 	},
 	"platform-feature-flags": {
+		"platform_editor_markdown_compatible_toolbar": {
+			"type": "boolean"
+		},
 		"platform_editor_use_preferences_plugin": {
 			"type": "boolean"
 		}