@atlaskit/editor-common/dist/es2019/element-browser/ViewMore.js

A package that contains common classes and components for editor and renderer

/** @jsx jsx */
import { useEffect, useRef } from 'react';
import { css, jsx } from '@emotion/react';
import { ButtonItem, Section } from '@atlaskit/menu';
const itemBefore = css`
  width: 40px;
  height: 40px;
  box-sizing: border-box;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-right: ${"var(--ds-space-050, 4px)"};
`;
export const ViewMore = ({
  item,
  focus
}) => {
  const ref = useRef(null);
  useEffect(() => {
    if (ref.current && focus) {
      ref.current.focus();
    }
  }, [focus]);
  return jsx(Section, {
    hasSeparator: true
  }, jsx(ButtonItem, {
    onClick: item.action,
    iconBefore: jsx("div", {
      css: itemBefore
    }, item.icon()),
    "aria-describedby": item.title,
    "data-testid": "view-more-elements-item"
    // @ts-ignore Overriding Menu styles is not supported
    ,
    css: css`
          padding: 0px ${"var(--ds-space-150, 12px)"};
        `,
    ref: ref
  }, item.title));
};