@atlaskit/editor-plugin-toolbar-lists-indentation 2.0.2 → 3.0.0

package/dist/esm/ui/ToolbarDropdown.js

@@ -1,21 +1,13 @@
+/* ToolbarDropdown.tsx generated by @compiled/babel-plugin v0.36.1 */
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
+import { ax, ix } from "@compiled/react/runtime";
 import React from 'react';
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { jsx } from '@emotion/react';
 import { useIntl } from 'react-intl-next';
 import { toggleBulletList as toggleBulletListKeymap, indent as toggleIndentKeymap, toggleOrderedList as toggleOrderedListKeymap, outdent as toggleOutdentKeymap, tooltip } from '@atlaskit/editor-common/keymaps';
 import { indentationMessages, listMessages } from '@atlaskit/editor-common/messages';
-import { expandIconContainerStyle, separatorStyles, wrapperStyle } from '@atlaskit/editor-common/styles';
+import { Shortcut, ToolbarDropdownTriggerWrapper, ToolbarDropdownWrapper, ToolbarExpandIcon, ToolbarSeparator } from '@atlaskit/editor-common/ui';
 import { DropdownMenuWithKeyboardNavigation as DropdownMenu, ToolbarButton } from '@atlaskit/editor-common/ui-menu';
-import { shortcutStyle } from '@atlaskit/editor-shared-styles/shortcut';
 import BulletListIcon from '@atlaskit/icon/core/migration/list-bulleted--editor-bullet-list';
-import ExpandIcon from '@atlaskit/icon/utility/migration/chevron-down';
-import { fg } from '@atlaskit/platform-feature-flags';
 import { ToolbarType } from '../types';
 export function ToolbarDropdown(props) {
   var _useIntl = useIntl(),
@@ -68,62 +60,39 @@ export function ToolbarDropdown(props) {
     });
   };
   var reducedSpacing = props.toolbarType === ToolbarType.FLOATING ? 'compact' : 'none';
-  return (
-    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-    jsx("span", {
-      css: wrapperStyle
-    }, jsx(DropdownMenu, {
-      items: items,
-      onItemActivated: handleOnItemActivated,
-      mountTo: popupsMountPoint,
-      boundariesElement: popupsBoundariesElement,
-      scrollableElement: popupsScrollableElement,
-      isOpen: isDropdownOpen,
-      onOpenChange: onOpenChange,
-      fitHeight: 188,
-      fitWidth: 175,
-      shouldUseDefaultRole: true,
-      shouldFocusFirstItem: function shouldFocusFirstItem() {
-        if (isOpenedByKeyboard) {
-          setOpenedByKeyboard(false);
-        }
-        return isOpenedByKeyboard;
+  return /*#__PURE__*/React.createElement(ToolbarDropdownWrapper, null, /*#__PURE__*/React.createElement(DropdownMenu, {
+    items: items,
+    onItemActivated: handleOnItemActivated,
+    mountTo: popupsMountPoint,
+    boundariesElement: popupsBoundariesElement,
+    scrollableElement: popupsScrollableElement,
+    isOpen: isDropdownOpen,
+    onOpenChange: onOpenChange,
+    fitHeight: 188,
+    fitWidth: 175,
+    shouldUseDefaultRole: true,
+    shouldFocusFirstItem: function shouldFocusFirstItem() {
+      if (isOpenedByKeyboard) {
+        setOpenedByKeyboard(false);
       }
-    }, jsx(ToolbarButton, {
-      spacing: isReducedSpacing ? reducedSpacing : 'default',
-      selected: bulletListActive || orderedListActive || isDropdownOpen,
-      "aria-expanded": isDropdownOpen,
-      "aria-haspopup": true,
-      "aria-label": labelLists,
-      disabled: disabled,
-      onClick: handleTriggerClick,
-      onKeyDown: handleOnKeyDown,
-      title: labelLists,
-      iconBefore:
-      // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-      jsx("span", {
-        css: wrapperStyle
-      }, jsx(BulletListIcon, {
-        color: "currentColor",
-        spacing: "spacious",
-        label: labelLists
-      }), jsx("span", {
-        css: [
-        // eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-registration
-        fg('platform-visual-refresh-icons') &&
-        //eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
-        expandIconContainerStyle]
-      }, jsx(ExpandIcon, {
-        color: "currentColor",
-        label: "",
-        LEGACY_margin: "0 0 0 -8px"
-      })))
-    })), !(pluginInjectionApi !== null && pluginInjectionApi !== void 0 && pluginInjectionApi.primaryToolbar) && /* eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage */
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
-    jsx("span", {
-      css: separatorStyles
-    }))
-  );
+      return isOpenedByKeyboard;
+    }
+  }, /*#__PURE__*/React.createElement(ToolbarButton, {
+    spacing: isReducedSpacing ? reducedSpacing : 'default',
+    selected: bulletListActive || orderedListActive || isDropdownOpen,
+    "aria-expanded": isDropdownOpen,
+    "aria-haspopup": true,
+    "aria-label": labelLists,
+    disabled: disabled,
+    onClick: handleTriggerClick,
+    onKeyDown: handleOnKeyDown,
+    title: labelLists,
+    iconBefore: /*#__PURE__*/React.createElement(ToolbarDropdownTriggerWrapper, null, /*#__PURE__*/React.createElement(BulletListIcon, {
+      color: "currentColor",
+      spacing: "spacious",
+      label: labelLists
+    }), /*#__PURE__*/React.createElement(ToolbarExpandIcon, null))
+  })), !(pluginInjectionApi !== null && pluginInjectionApi !== void 0 && pluginInjectionApi.primaryToolbar) && /*#__PURE__*/React.createElement(ToolbarSeparator, null));
 }
 function useItems(props) {
   var _useIntl2 = useIntl(),
@@ -138,11 +107,7 @@ function useItems(props) {
     },
     isDisabled: props.bulletListDisabled,
     isActive: Boolean(props.bulletListActive),
-    elemAfter:
-    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-    jsx("div", {
-      css: shortcutStyle
-    }, tooltip(toggleBulletListKeymap))
+    elemAfter: /*#__PURE__*/React.createElement(Shortcut, null, tooltip(toggleBulletListKeymap))
   }, {
     key: 'orderedList',
     content: labelOrderedList,
@@ -151,11 +116,7 @@ function useItems(props) {
     },
     isDisabled: props.orderedListDisabled,
     isActive: Boolean(props.orderedListActive),
-    elemAfter:
-    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-    jsx("div", {
-      css: shortcutStyle
-    }, tooltip(toggleOrderedListKeymap))
+    elemAfter: /*#__PURE__*/React.createElement(Shortcut, null, tooltip(toggleOrderedListKeymap))
   }];
   if (props.showIndentationButtons) {
     var labelIndent = formatMessage(indentationMessages.indent);
@@ -168,11 +129,7 @@ function useItems(props) {
       },
       isDisabled: props.outdentDisabled,
       isActive: false,
-      elemAfter:
-      // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-      jsx("div", {
-        css: shortcutStyle
-      }, tooltip(toggleOutdentKeymap))
+      elemAfter: /*#__PURE__*/React.createElement(Shortcut, null, tooltip(toggleOutdentKeymap))
     }, {
       key: 'indent',
       content: labelIndent,
@@ -181,10 +138,7 @@ function useItems(props) {
       },
       isDisabled: props.indentDisabled,
       isActive: false,
-      // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-      elemAfter: jsx("div", {
-        css: shortcutStyle
-      }, tooltip(toggleIndentKeymap))
+      elemAfter: /*#__PURE__*/React.createElement(Shortcut, null, tooltip(toggleIndentKeymap))
     });
   }
   return [{

package/dist/esm/ui/index.js

@@ -1,9 +1,6 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { jsx } from '@emotion/react';
+/* index.tsx generated by @compiled/babel-plugin v0.36.1 */
+import * as React from 'react';
+import { ax, ix } from "@compiled/react/runtime";
 import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { ToolbarType } from '../types';
@@ -40,7 +37,7 @@ export default function ToolbarListsIndentation(props) {
     } else {
       isDisabled = disabled;
     }
-    return jsx(ToolbarDropdown, {
+    return /*#__PURE__*/React.createElement(ToolbarDropdown, {
       editorView: props.editorView,
       isReducedSpacing: isReducedSpacing,
       popupsMountPoint: popupsMountPoint,
@@ -60,7 +57,7 @@ export default function ToolbarListsIndentation(props) {
       toolbarType: toolbarType
     });
   }
-  return jsx(Toolbar, {
+  return /*#__PURE__*/React.createElement(Toolbar, {
     editorView: props.editorView,
     isReducedSpacing: isReducedSpacing,
     bulletListActive: bulletListActive,

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

@@ -1,3 +1,3 @@
-import { jsx } from '@emotion/react';
+/// <reference types="react" />
 import type { ToolbarProps } from '../types';
-export declare function Toolbar(props: ToolbarProps): jsx.JSX.Element;
+export declare function Toolbar(props: ToolbarProps): JSX.Element;

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

@@ -1,4 +1,4 @@
-import { jsx } from '@emotion/react';
+/// <reference types="react" />
 import { type ToolbarProps, ToolbarType } from '../types';
 export type DropdownProps = ToolbarProps & {
     popupsMountPoint?: HTMLElement;
@@ -6,4 +6,4 @@ export type DropdownProps = ToolbarProps & {
     popupsScrollableElement?: HTMLElement;
     toolbarType: ToolbarType;
 };
-export declare function ToolbarDropdown(props: DropdownProps): jsx.JSX.Element;
+export declare function ToolbarDropdown(props: DropdownProps): JSX.Element;

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

@@ -1,8 +1,4 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-import { jsx } from '@emotion/react';
+/// <reference types="react" />
 import type { ExtractInjectionAPI, FeatureFlags } from '@atlaskit/editor-common/types';
 import type { EditorView } from '@atlaskit/editor-prosemirror/view';
 import type { IndentationButtonNode } from '../pm-plugins/indentation-buttons';
@@ -28,4 +24,4 @@ export interface Props {
     pluginInjectionApi?: ExtractInjectionAPI<ToolbarListsIndentationPlugin> | undefined;
     toolbarType: ToolbarType;
 }
-export default function ToolbarListsIndentation(props: Props): jsx.JSX.Element;
+export default function ToolbarListsIndentation(props: Props): JSX.Element;

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

@@ -1,3 +1,3 @@
-import { jsx } from '@emotion/react';
+/// <reference types="react" />
 import type { ToolbarProps } from '../types';
-export declare function Toolbar(props: ToolbarProps): jsx.JSX.Element;
+export declare function Toolbar(props: ToolbarProps): JSX.Element;

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

@@ -1,4 +1,4 @@
-import { jsx } from '@emotion/react';
+/// <reference types="react" />
 import { type ToolbarProps, ToolbarType } from '../types';
 export type DropdownProps = ToolbarProps & {
     popupsMountPoint?: HTMLElement;
@@ -6,4 +6,4 @@ export type DropdownProps = ToolbarProps & {
     popupsScrollableElement?: HTMLElement;
     toolbarType: ToolbarType;
 };
-export declare function ToolbarDropdown(props: DropdownProps): jsx.JSX.Element;
+export declare function ToolbarDropdown(props: DropdownProps): JSX.Element;

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

@@ -1,8 +1,4 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-import { jsx } from '@emotion/react';
+/// <reference types="react" />
 import type { ExtractInjectionAPI, FeatureFlags } from '@atlaskit/editor-common/types';
 import type { EditorView } from '@atlaskit/editor-prosemirror/view';
 import type { IndentationButtonNode } from '../pm-plugins/indentation-buttons';
@@ -28,4 +24,4 @@ export interface Props {
     pluginInjectionApi?: ExtractInjectionAPI<ToolbarListsIndentationPlugin> | undefined;
     toolbarType: ToolbarType;
 }
-export default function ToolbarListsIndentation(props: Props): jsx.JSX.Element;
+export default function ToolbarListsIndentation(props: Props): JSX.Element;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-toolbar-lists-indentation",
-	"version": "2.0.2",
+	"version": "3.0.0",
 	"description": "Toolbar lists and indentation plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -25,13 +25,16 @@
 			]
 		}
 	},
-	"sideEffects": false,
+	"sideEffects": [
+		"**/*.compiled.css"
+	],
 	"atlaskit:src": "src/index.ts",
 	"af:exports": {
 		".": "./src/index.ts"
 	},
 	"dependencies": {
-		"@atlaskit/editor-common": "^100.1.0",
+		"@atlaskit/css": "^0.10.0",
+		"@atlaskit/editor-common": "^100.2.0",
 		"@atlaskit/editor-plugin-analytics": "^2.0.0",
 		"@atlaskit/editor-plugin-block-type": "^5.0.0",
 		"@atlaskit/editor-plugin-feature-flags": "^1.3.0",
@@ -39,15 +42,14 @@
 		"@atlaskit/editor-plugin-list": "^4.0.0",
 		"@atlaskit/editor-plugin-primary-toolbar": "^3.0.0",
 		"@atlaskit/editor-plugin-selection-toolbar": "^2.0.0",
-		"@atlaskit/editor-plugin-tasks-and-decisions": "^3.0.0",
+		"@atlaskit/editor-plugin-tasks-and-decisions": "^4.0.0",
 		"@atlaskit/editor-prosemirror": "7.0.0",
 		"@atlaskit/editor-shared-styles": "^3.3.0",
 		"@atlaskit/icon": "^24.1.0",
 		"@atlaskit/platform-feature-flags": "^1.1.0",
 		"@atlaskit/tmp-editor-statsig": "^3.2.0",
 		"@atlaskit/tokens": "4.2.0",
-		"@babel/runtime": "^7.0.0",
-		"@emotion/react": "^11.7.1"
+		"@babel/runtime": "^7.0.0"
 	},
 	"peerDependencies": {
 		"react": "^18.2.0",
@@ -95,8 +97,7 @@
 			],
 			"deprecation": "no-deprecated-imports",
 			"styling": [
-				"emotion",
-				"emotion"
+				"compiled"
 			],
 			"imports": [
 				"import-no-extraneous-disable-for-examples-and-docs"
@@ -104,6 +105,9 @@
 		}
 	},
 	"platform-feature-flags": {
+		"platform-visual-refresh-icons": {
+			"type": "boolean"
+		},
 		"platform_editor_toolbar_fix_for_disabled_options": {
 			"type": "boolean"
 		}