@atlaskit/editor-plugin-quick-insert/dist/es2019/ui/getLegacyCompatibleComponents.js

Quick insert plugin for @atlaskit/editor-core

import React from 'react';
import { createQuickInsertMatcher } from '@atlaskit/editor-common/quick-insert/create-quick-insert-matcher';
import { getQuickInsertMenuItemParents } from '@atlaskit/editor-common/quick-insert/get-menu-item-parents';
import { getQuickInsertProviderMenuItemKey } from '@atlaskit/editor-common/quick-insert/get-provider-menu-item-key';
import { QuickInsertMenuItem } from '@atlaskit/editor-common/quick-insert/menu-item';
import { useQuickInsertContext } from '@atlaskit/editor-common/quick-insert/use-quick-insert-context';
import AppsIcon from '@atlaskit/icon/core/apps';
const LegacyQuickInsertProviderMenuItem = ({
  item,
  onInsert
}) => {
  const {
    editorView,
    isOffline
  } = useQuickInsertContext();
  const isDisabled = item.isDisabledOffline === true && isOffline;
  const onSelect = ({
    insert,
    source
  }) => {
    const result = item.action(insert, editorView.state, source);
    if (result) {
      onInsert(item);
    }
    return result;
  };
  const Icon = item.icon;
  return /*#__PURE__*/React.createElement(QuickInsertMenuItem, {
    description: item.description,
    iconBefore: Icon ? /*#__PURE__*/React.createElement(Icon, null) : /*#__PURE__*/React.createElement(AppsIcon, {
      label: ""
    }),
    isDisabled: isDisabled,
    onSelect: onSelect,
    preview: item.preview,
    shortcut: item.keyshortcut,
    title: item.title
  });
};
const getItemIdentity = (item, index) => {
  var _ref, _item$key;
  return String((_ref = (_item$key = item.key) !== null && _item$key !== void 0 ? _item$key : item.id) !== null && _ref !== void 0 ? _ref : index);
};
const getComponentsFromLegacyItems = (items, onInsert) => items.map((item, index) => {
  var _item$priority;
  const identity = getItemIdentity(item, index);
  return {
    type: 'menu-item',
    key: getQuickInsertProviderMenuItemKey(identity, item.app),
    parents: getQuickInsertMenuItemParents({
      category: item.category,
      legacyCategories: item.categories,
      rank: (_item$priority = item.priority) !== null && _item$priority !== void 0 ? _item$priority : index
    }),
    isHidden: item.isHidden,
    component: () => /*#__PURE__*/React.createElement(LegacyQuickInsertProviderMenuItem, {
      item: item,
      onInsert: onInsert
    }),
    match: createQuickInsertMatcher(() => ({
      description: item.description,
      keywords: item.keywords,
      shortcut: item.keyshortcut,
      title: item.title
    }))
  };
});
export const getLegacyCompatibleComponents = ({
  directComponents,
  itemFilter,
  onInsert,
  providedItems
}) => {
  const filteredItems = itemFilter ? providedItems.filter(itemFilter) : providedItems;
  const allowedKeys = new Set(filteredItems.map((item, index) => getItemIdentity(item, index)));
  const directComponentsWithRenderer = directComponents.filter(component => typeof component.component === 'function');
  const namespacedDirectComponents = directComponentsWithRenderer.filter(component => !itemFilter || allowedKeys.has(component.key)).map(component => {
    var _component$match;
    const item = filteredItems.find((candidate, index) => getItemIdentity(candidate, index) === component.key);
    return {
      ...component,
      isHidden: item !== null && item !== void 0 && item.isHidden ? options => {
        var _component$isHidden, _item$isHidden;
        return ((_component$isHidden = component.isHidden) === null || _component$isHidden === void 0 ? void 0 : _component$isHidden.call(component, options)) === true || ((_item$isHidden = item.isHidden) === null || _item$isHidden === void 0 ? void 0 : _item$isHidden.call(item)) === true;
      } : component.isHidden,
      key: getQuickInsertProviderMenuItemKey(component.key, item === null || item === void 0 ? void 0 : item.app),
      component: item ? props => component.component({
        ...props,
        onInsert: () => onInsert(item)
      }) : component.component,
      match: (_component$match = component.match) !== null && _component$match !== void 0 ? _component$match : item ? createQuickInsertMatcher(() => ({
        description: item.description,
        keywords: item.keywords,
        shortcut: item.keyshortcut,
        title: item.title
      })) : undefined
    };
  });
  const directComponentKeys = new Set(directComponentsWithRenderer.map(component => component.key));
  const fallbackComponents = getComponentsFromLegacyItems(filteredItems.filter((item, index) => !directComponentKeys.has(getItemIdentity(item, index))), onInsert);
  return [...fallbackComponents, ...namespacedDirectComponents];
};