@atlaskit/editor-common 72.1.1 → 72.2.0

package/dist/types/types/editor-plugin.d.ts

@@ -9,9 +9,20 @@ import type { TypeAheadHandler } from './type-ahead';
 import type { UIComponentFactory } from './ui-components';
 export declare type PluginsOptions = {
     [pluginName: string]: any;
+    /**
+     * Handler returns an array of QuickInsertItem that are added to the Element Browser, Insert Menu and Quick Insert
+     */
     quickInsert?: QuickInsertHandler;
     typeAhead?: TypeAheadHandler;
+    /**
+     * See: `FloatingToolbarConfig`
+     */
     floatingToolbar?: FloatingToolbarHandler;
+    /**
+     * Handler returning a React component that is added to the context panel.
+     *
+     * See https://product-fabric.atlassian.net/wiki/spaces/E/pages/1406016239/Context+Panel
+     */
     contextPanel?: ContextPanelHandler;
 };
 declare type EditorViewStateUpdatedCallbackProps = {
@@ -34,19 +45,27 @@ export interface EditorPlugin {
      */
     pmPlugins?: (pluginOptions?: any) => Array<PMPlugin>;
     /**
-     * List of Nodes to add to the schema.
+     * A list of `NodeConfig`s with a name and a `NodeSpec`. (`NodeSpec` is imported from @atlaskit/adf-schema)
+     *
      */
     nodes?: () => NodeConfig[];
     /**
-     * List of Marks to add to the schema.
+     * A list of `MarkConfig`s with a name and a `MarkSpec` (`MarkSpec` is imported from @atlaskit/adf-schema)
      */
     marks?: () => MarkConfig[];
     /**
      * Optional UI-component that lives inside the actual content-area (like mention-picker, floating toolbar for links, etc.)
+     *
+     * Handler returns a React component that is added to the top of the editor content area (PluginSlot).
+     * Although it’s common to specify a custom mount point (eg. date picker)
      */
     contentComponent?: UIComponentFactory;
     /**
      * Optional UI-component that will be added to the toolbar at the top of the editor (doesn't exist in the compact-editor).
+     *
+     * Handler returns a React component that is added to the toolbar at the top of the editor
+     *
+     * Plugins use <ToolbarButton> component to maintain design consistency.
      */
     primaryToolbarComponent?: ToolbarUIComponentFactory;
     /**
@@ -54,6 +73,9 @@ export interface EditorPlugin {
      * In compact mode this toolbar lives on the right-hand side of the editor.
      */
     secondaryToolbarComponent?: UIComponentFactory;
+    /**
+     * Called after EditorView state is updated.
+     */
     onEditorViewStateUpdated?: (props: EditorViewStateUpdatedCallbackProps) => void;
 }
 export declare type getPosHandler = getPosHandlerNode | boolean;

package/dist/types/types/floating-toolbar.d.ts

@@ -204,6 +204,7 @@ declare type FloatingToolbarExtensionsPlaceholder = {
 export declare type FloatingToolbarFallbackItem<T> = FloatingToolbarButton<T> | FloatingToolbarCopyButton | FloatingToolbarDropdown<T> | FloatingToolbarSelect<T> | FloatingToolbarInput<T> | FloatingToolbarSeparator;
 export declare type FloatingToolbarItem<T> = FloatingToolbarButton<T> | FloatingToolbarCopyButton | FloatingToolbarDropdown<T> | FloatingToolbarSelect<T> | FloatingToolbarInput<T> | FloatingToolbarCustom<T> | FloatingToolbarSeparator | FloatingToolbarExtensionsPlaceholder;
 export interface FloatingToolbarConfig {
+    /** Used for the ariaLabel on the <Popup /> component */
     title: string;
     /**
      * Override the DOM reference used to apply as the target for the
@@ -213,17 +214,26 @@ export interface FloatingToolbarConfig {
      * head of the current selection.
      */
     getDomRef?: (view: EditorView) => HTMLElement | undefined;
+    /** Can prevent the Toolbar from rendering */
     visible?: boolean;
     /**
      * nodeType or list of `nodeType`s this floating toolbar should be shown for.
      **/
     nodeType: NodeType | NodeType[];
+    /** Items that will populate the Toolbar.
+     *
+     * See: `FloatingToolbarItem`
+     */
     items: Array<FloatingToolbarItem<Command>> | ((node: Node) => Array<FloatingToolbarItem<Command>>);
     align?: AlignType;
+    /** Class added to Toolbar wrapper */
     className?: string;
+    /** Toolbar height */
     height?: number;
+    /** Toolbar width */
     width?: number;
     zIndex?: number;
+    /** Offset the position of the toolbar. */
     offset?: [number, number];
     forcePlacement?: boolean;
     onPositionCalculated?: (editorView: EditorView, nextPos: Position) => Position;

package/dist/types/types/type-ahead.d.ts

@@ -42,17 +42,25 @@ export declare type TypeAheadItem = {
 export declare type TypeAheadForceSelect = (props: TypeAheadForceSelectProps) => TypeAheadItem | undefined;
 export declare type TypeAheadHandler = {
     id: TypeAheadAvailableNodes;
+    /** Pattern that will trigger the TypeAhead */
     trigger: string;
+    /** Custom regex must have a capture group around trigger so it's possible to
+     * use it without needing to scan through all triggers again */
     customRegex?: string;
     headless?: boolean;
+    /** Handler returns typeahead item based on query. Used to find which item to insert. */
     forceSelect?: TypeAheadForceSelect;
     onInvokeAnalytics?: TypeAheadPayload;
+    /** Handler executes logic when TypeAhead opens */
     onOpen?: (editorState: EditorState) => void;
+    /** Handler returns an array of TypeAheadItem based on query to be displayed in the TypeAhead */
     getItems: (props: {
         query: string;
         editorState: EditorState;
     }) => Promise<Array<TypeAheadItem>>;
+    /** Handler returns a transaction which inserts the TypeAheadItem into the doc */
     selectItem: TypeAheadSelectItem;
+    /** Handler executes logic when TypeAhead is dismissed */
     dismiss?: (props: {
         editorState: EditorState;
         query: string;

package/dist/types/ui-menu/DropdownMenu/index.d.ts

@@ -13,7 +13,7 @@ export default class DropdownMenuWrapper extends PureComponent<Props, State> {
     state: State;
     private handleRef;
     private updatePopupPlacement;
-    private handleCloseandFocus;
+    private handleCloseAndFocus;
     private handleClose;
     private renderDropdownMenu;
     render(): jsx.JSX.Element;

package/dist/types/ui-menu/DropdownMenu/types.d.ts

@@ -48,4 +48,5 @@ export interface MenuItem {
 export interface State {
     target?: HTMLElement;
     popupPlacement: [string, string];
+    selectionIndex: number;
 }

package/dist/types/ui-menu/MenuArrowKeyNavigationProvider/index.d.ts

@@ -5,11 +5,12 @@ declare type SimpleEventHandler<T> = (event: T) => void;
  * This component is a wrapper of vertical menus which listens to keydown events of children
  * and handles up/down arrow key navigation
  */
-export declare const MenuArrowKeyNavigationProvider: ({ children, handleClose, disableArrowKeyNavigation, keyDownHandlerContext, closeonTab, }: {
+export declare const MenuArrowKeyNavigationProvider: ({ children, handleClose, disableArrowKeyNavigation, keyDownHandlerContext, closeOnTab, onSelection, }: {
     children: ReactNode;
     handleClose?: SimpleEventHandler<KeyboardEvent> | undefined;
     disableArrowKeyNavigation?: boolean | undefined;
     keyDownHandlerContext?: KeyDownHandlerContext | undefined;
-    closeonTab?: boolean | undefined;
+    onSelection?: ((index: number) => void) | undefined;
+    closeOnTab?: boolean | undefined;
 }) => JSX.Element;
 export {};

package/dist/types/ui-react/with-react-editor-view-outer-listeners.d.ts

@@ -5,7 +5,7 @@ export interface WithOutsideClickProps {
     handleEscapeKeydown?: SimpleEventHandler<KeyboardEvent>;
     handleEnterKeydown?: SimpleEventHandler<KeyboardEvent>;
     targetRef?: any;
-    closeonTab?: boolean;
+    closeOnTab?: boolean;
 }
 export default function withReactEditorViewOuterListeners<P>(Component: ComponentClass<P> | StatelessComponent<P>): React.FC<P & WithOutsideClickProps>;
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/editor-common",
-  "version": "72.1.1",
+  "version": "72.2.0",
   "description": "A package that contains common classes and components for editor and renderer",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -59,7 +59,7 @@
     "@atlaskit/activity-provider": "^2.3.0",
     "@atlaskit/adf-schema": "^25.1.0",
     "@atlaskit/adf-utils": "^18.0.0",
-    "@atlaskit/analytics-listeners": "^8.4.0",
+    "@atlaskit/analytics-listeners": "^8.5.0",
     "@atlaskit/analytics-namespaced-context": "^6.6.0",
     "@atlaskit/analytics-next": "^8.2.0",
     "@atlaskit/analytics-next-stable-react-context": "1.0.1",
@@ -67,18 +67,18 @@
     "@atlaskit/code": "^14.4.0",
     "@atlaskit/codemod-utils": "^4.1.0",
     "@atlaskit/editor-json-transformer": "^8.8.0",
-    "@atlaskit/editor-palette": "0.1.0",
+    "@atlaskit/editor-palette": "1.0.0",
     "@atlaskit/editor-shared-styles": "^2.3.0",
     "@atlaskit/emoji": "^67.0.0",
     "@atlaskit/icon": "^21.11.0",
     "@atlaskit/in-product-testing": "^0.1.0",
-    "@atlaskit/media-card": "^74.4.0",
+    "@atlaskit/media-card": "^74.5.0",
     "@atlaskit/media-client": "^20.0.0",
-    "@atlaskit/media-picker": "^64.1.0",
+    "@atlaskit/media-picker": "^64.2.0",
     "@atlaskit/mention": "^21.0.0",
     "@atlaskit/menu": "^1.4.0",
     "@atlaskit/profilecard": "^18.2.0",
-    "@atlaskit/smart-card": "^23.13.0",
+    "@atlaskit/smart-card": "^23.14.0",
     "@atlaskit/smart-user-picker": "^6.0.0",
     "@atlaskit/task-decision": "^17.5.0",
     "@atlaskit/theme": "^12.2.0",
@@ -114,9 +114,9 @@
     "react-intl-next": "npm:react-intl@^5.18.1"
   },
   "devDependencies": {
-    "@atlaskit/editor-core": "^178.0.0",
+    "@atlaskit/editor-core": "^178.1.0",
     "@atlaskit/editor-json-transformer": "^8.8.0",
-    "@atlaskit/editor-plugin-table": "^1.0.0",
+    "@atlaskit/editor-plugin-table": "^1.1.0",
     "@atlaskit/editor-test-helpers": "^18.0.0",
     "@atlaskit/media-core": "^34.0.0",
     "@atlaskit/util-data-test": "^17.6.0",