@gechiui/block-editor
Version:
56 lines (53 loc) • 1.87 kB
JavaScript
import { createElement, Fragment } from "@gechiui/element";
/**
* External dependencies
*/
import classnames from 'classnames';
/**
* GeChiUI dependencies
*/
import { useViewportMatch } from '@gechiui/compose';
import { DropdownMenu, MenuGroup, MenuItem } from '@gechiui/components';
import { __ } from '@gechiui/i18n';
import { check } from '@gechiui/icons';
export default function PreviewOptions(_ref) {
let {
children,
className,
isEnabled = true,
deviceType,
setDeviceType
} = _ref;
const isMobile = useViewportMatch('small', '<');
if (isMobile) return null;
const popoverProps = {
className: classnames(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: __('预览')
};
return createElement(DropdownMenu, {
className: "block-editor-post-preview__dropdown",
popoverProps: popoverProps,
toggleProps: toggleProps,
icon: null
}, () => createElement(Fragment, null, createElement(MenuGroup, null, createElement(MenuItem, {
className: "block-editor-post-preview__button-resize",
onClick: () => setDeviceType('Desktop'),
icon: deviceType === 'Desktop' && check
}, __('桌面端')), createElement(MenuItem, {
className: "block-editor-post-preview__button-resize",
onClick: () => setDeviceType('Tablet'),
icon: deviceType === 'Tablet' && check
}, __('平板电脑')), createElement(MenuItem, {
className: "block-editor-post-preview__button-resize",
onClick: () => setDeviceType('Mobile'),
icon: deviceType === 'Mobile' && check
}, __('移动端'))), children));
}
//# sourceMappingURL=index.js.map