@gechiui/block-editor
Version:
57 lines (53 loc) • 1.65 kB
JavaScript
import { createElement } from "@gechiui/element";
/**
* External dependencies
*/
import classnames from 'classnames';
/**
* GeChiUI dependencies
*/
import { __ } from '@gechiui/i18n';
import { Button, Placeholder } from '@gechiui/components';
import { layout } from '@gechiui/icons';
function BlockVariationPicker(_ref) {
let {
icon = layout,
label = __('选择变体'),
instructions = __('选择变体以开始。'),
variations,
onSelect,
allowSkip
} = _ref;
const classes = classnames('block-editor-block-variation-picker', {
'has-many-variations': variations.length > 4
});
return createElement(Placeholder, {
icon: icon,
label: label,
instructions: instructions,
className: classes
}, createElement("ul", {
className: "block-editor-block-variation-picker__variations",
role: "list",
"aria-label": __('区块变体')
}, variations.map(variation => createElement("li", {
key: variation.name
}, createElement(Button, {
variant: "secondary",
icon: variation.icon,
iconSize: 48,
onClick: () => onSelect(variation),
className: "block-editor-block-variation-picker__variation",
label: variation.description || variation.title
}), createElement("span", {
className: "block-editor-block-variation-picker__variation-label",
role: "presentation"
}, variation.title)))), allowSkip && createElement("div", {
className: "block-editor-block-variation-picker__skip"
}, createElement(Button, {
variant: "link",
onClick: () => onSelect()
}, __('跳过'))));
}
export default BlockVariationPicker;
//# sourceMappingURL=index.js.map