@gechiui/block-editor/build/components/preview-options/index.js

Generic block editor.

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = PreviewOptions;

var _element = require("@gechiui/element");

var _classnames = _interopRequireDefault(require("classnames"));

var _compose = require("@gechiui/compose");

var _components = require("@gechiui/components");

var _i18n = require("@gechiui/i18n");

var _icons = require("@gechiui/icons");

/**
 * External dependencies
 */

/**
 * GeChiUI dependencies
 */
function PreviewOptions(_ref) {
  let {
    children,
    className,
    isEnabled = true,
    deviceType,
    setDeviceType
  } = _ref;
  const isMobile = (0, _compose.useViewportMatch)('small', '<');
  if (isMobile) return null;
  const popoverProps = {
    className: (0, _classnames.default)(className, 'block-editor-post-preview__dropdown-content'),
    position: 'bottom left'
  };
  const toggleProps = {
    variant: 'tertiary',
    className: 'block-editor-post-preview__button-toggle',
    disabled: !isEnabled,

    /* translators: button label text should, if possible, be under 16 characters. */
    children: (0, _i18n.__)('预览')
  };
  return (0, _element.createElement)(_components.DropdownMenu, {
    className: "block-editor-post-preview__dropdown",
    popoverProps: popoverProps,
    toggleProps: toggleProps,
    icon: null
  }, () => (0, _element.createElement)(_element.Fragment, null, (0, _element.createElement)(_components.MenuGroup, null, (0, _element.createElement)(_components.MenuItem, {
    className: "block-editor-post-preview__button-resize",
    onClick: () => setDeviceType('Desktop'),
    icon: deviceType === 'Desktop' && _icons.check
  }, (0, _i18n.__)('桌面端')), (0, _element.createElement)(_components.MenuItem, {
    className: "block-editor-post-preview__button-resize",
    onClick: () => setDeviceType('Tablet'),
    icon: deviceType === 'Tablet' && _icons.check
  }, (0, _i18n.__)('平板电脑')), (0, _element.createElement)(_components.MenuItem, {
    className: "block-editor-post-preview__button-resize",
    onClick: () => setDeviceType('Mobile'),
    icon: deviceType === 'Mobile' && _icons.check
  }, (0, _i18n.__)('移动端'))), children));
}
//# sourceMappingURL=index.js.map