@atlaskit/editor-plugin-insert-block/dist/esm/ui/ToolbarInsertBlock/item.js

Insert block plugin for @atlaskit/editor-core

/**
 * @jsxRuntime classic
 * @jsx jsx
 */
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 memoizeOne from 'memoize-one';
import { addLink, getAriaKeyshortcuts, toggleTable, tooltip } from '@atlaskit/editor-common/keymaps';
import { shortcutStyle } from '@atlaskit/editor-shared-styles/shortcut';
import FieldTextIcon from '@atlaskit/icon-lab/core/field-text';
import LozengeIcon from '@atlaskit/icon-lab/core/lozenge';
import AngleBracketsIcon from '@atlaskit/icon/core/angle-brackets';
import CalendarIcon from '@atlaskit/icon/core/calendar';
import ChevronDownIcon from '@atlaskit/icon/core/chevron-down';
import ExpandNodeIcon from '@atlaskit/icon/core/chevron-right';
import DecisionIcon from '@atlaskit/icon/core/decision';
import EmojiIcon from '@atlaskit/icon/core/emoji';
import GridIcon from '@atlaskit/icon/core/grid';
import ImageIcon from '@atlaskit/icon/core/image';
import LayoutTwoColumnsIcon from '@atlaskit/icon/core/layout-two-columns';
import LinkIcon from '@atlaskit/icon/core/link';
import MentionIcon from '@atlaskit/icon/core/mention';
import HorizontalRuleIcon from '@atlaskit/icon/core/minus';
import QuotationMarkIcon from '@atlaskit/icon/core/quotation-mark';
import InformationIcon from '@atlaskit/icon/core/status-information';
import TaskIcon from '@atlaskit/icon/core/task';
import { shallowEquals } from './shallow-equals';
var from = function from(init) {
  return {
    content: init.content,
    tooltipDescription: init.tooltipDescription,
    value: {
      name: init.name
    },
    elemBefore: jsx(init.Icon, {
      label: "",
      color: "currentColor",
      spacing: "spacious"
    }),
    elemAfter: init.shortcut ?
    // 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
    }, init.shortcut) : undefined,
    'aria-label': init.shortcut ? init.content + ' ' + init.shortcut : init.content,
    'aria-haspopup': init['aria-haspopup'],
    'aria-keyshortcuts': init['aria-keyshortcuts'],
    shortcut: init.shortcut,
    isDisabled: init.disabled
  };
};
var mem = function mem(fn) {
  return memoizeOne(fn, shallowEquals);
};
export var action = mem(function (init) {
  return from({
    content: init.content,
    tooltipDescription: init.tooltipDescription,
    disabled: init.disabled,
    name: 'action',
    shortcut: '[]',
    Icon: function Icon() {
      return jsx(TaskIcon, {
        label: "",
        color: "currentColor",
        spacing: "spacious"
      });
    },
    'aria-keyshortcuts': '[ ] Space'
  });
});
export var link = mem(function (init) {
  return from({
    content: init.content,
    tooltipDescription: init.tooltipDescription,
    disabled: init.disabled,
    name: 'link',
    shortcut: tooltip(addLink),
    Icon: LinkIcon,
    'aria-haspopup': init['aria-haspopup'],
    'aria-keyshortcuts': getAriaKeyshortcuts(addLink)
  });
});
export var media = mem(function (init) {
  return from({
    content: init.content,
    tooltipDescription: init.tooltipDescription,
    disabled: init.disabled,
    name: 'media',
    Icon: ImageIcon
  });
});
export var imageUpload = mem(function (init) {
  return from({
    content: init.content,
    tooltipDescription: init.tooltipDescription,
    disabled: init.disabled,
    name: 'image upload',
    Icon: ImageIcon
  });
});
export var mention = mem(function (init) {
  return from({
    content: init.content,
    tooltipDescription: init.tooltipDescription,
    disabled: init.disabled,
    name: 'mention',
    Icon: MentionIcon,
    shortcut: '@',
    'aria-haspopup': init['aria-haspopup'],
    'aria-keyshortcuts': 'Shift+2 Space'
  });
});
export var emoji = mem(function (init) {
  return from({
    content: init.content,
    tooltipDescription: init.tooltipDescription,
    disabled: init.disabled,
    name: 'emoji',
    Icon: EmojiIcon,
    shortcut: ':',
    'aria-haspopup': init['aria-haspopup'],
    'aria-keyshortcuts': 'Shift+;'
  });
});
export var table = mem(function (init) {
  return from({
    content: init.content,
    tooltipDescription: init.tooltipDescription,
    disabled: init.disabled,
    name: 'table',
    Icon: GridIcon,
    shortcut: tooltip(toggleTable),
    'aria-keyshortcuts': getAriaKeyshortcuts(toggleTable)
  });
});
export var tableSelector = mem(function (init) {
  return from({
    content: init.content,
    tooltipDescription: init.tooltipDescription,
    disabled: init.disabled,
    name: 'table selector',
    Icon: function Icon() {
      return jsx(ChevronDownIcon, {
        label: "",
        color: "currentColor",
        size: "small"
      });
    }
  });
});
export var layout = mem(function (init) {
  return from({
    content: init.content,
    tooltipDescription: init.tooltipDescription,
    disabled: init.disabled,
    name: 'layout',
    Icon: LayoutTwoColumnsIcon
  });
});
export var codeblock = mem(function (init) {
  return from({
    content: init.content,
    tooltipDescription: init.tooltipDescription,
    disabled: init.disabled,
    name: 'codeblock',
    Icon: AngleBracketsIcon,
    shortcut: init.shortcut,
    'aria-keyshortcuts': getAriaKeyshortcuts(init.shortcut)
  });
});
export var panel = mem(function (init) {
  return from({
    content: init.content,
    tooltipDescription: init.tooltipDescription,
    disabled: init.disabled,
    name: 'panel',
    Icon: InformationIcon,
    shortcut: init.shortcut,
    'aria-keyshortcuts': getAriaKeyshortcuts(init.shortcut)
  });
});
export var blockquote = mem(function (init) {
  return from({
    content: init.content,
    tooltipDescription: init.tooltipDescription,
    disabled: init.disabled,
    name: 'blockquote',
    Icon: QuotationMarkIcon,
    shortcut: init.shortcut,
    'aria-keyshortcuts': 'Shift+. Space'
  });
});
export var decision = mem(function (init) {
  return from({
    content: init.content,
    tooltipDescription: init.tooltipDescription,
    disabled: init.disabled,
    name: 'decision',
    Icon: DecisionIcon,
    shortcut: '<>',
    'aria-keyshortcuts': 'Shift+, Shift+. Space'
  });
});
export var horizontalrule = mem(function (init) {
  return from({
    content: init.content,
    tooltipDescription: init.tooltipDescription,
    disabled: init.disabled,
    name: 'horizontalrule',
    Icon: HorizontalRuleIcon,
    shortcut: '---',
    'aria-keyshortcuts': '- - -'
  });
});
export var expand = mem(function (init) {
  return from({
    content: init.content,
    tooltipDescription: init.tooltipDescription,
    disabled: init.disabled,
    name: 'expand',
    Icon: function Icon(iconProps) {
      return jsx(ExpandNodeIcon, {
        label: iconProps.label,
        size: "small"
      });
    }
  });
});
export var date = mem(function (init) {
  return from({
    content: init.content,
    tooltipDescription: init.tooltipDescription,
    disabled: init.disabled,
    name: 'date',
    Icon: CalendarIcon,
    shortcut: '//',
    'aria-keyshortcuts': '/ / Enter'
  });
});
export var placeholder = mem(function (init) {
  return from({
    content: init.content,
    tooltipDescription: init.tooltipDescription,
    disabled: init.disabled,
    name: 'placeholder text',
    Icon: function Icon() {
      return jsx(FieldTextIcon, {
        label: "",
        spacing: "spacious",
        color: "currentColor"
      });
    }
  });
});
export var status = mem(function (init) {
  return from({
    content: init.content,
    tooltipDescription: init.tooltipDescription,
    disabled: init.disabled,
    name: 'status',
    Icon: function Icon() {
      return jsx(LozengeIcon, {
        label: "",
        color: "currentColor",
        spacing: "spacious"
      });
    }
  });
});