UNPKG

@gechiui/block-editor

Version:
60 lines (53 loc) 1.66 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.default = BorderStyleControl; var _element = require("@gechiui/element"); var _components = require("@gechiui/components"); var _i18n = require("@gechiui/i18n"); var _icons = require("@gechiui/icons"); /** * GeChiUI dependencies */ const BORDER_STYLES = [{ label: (0, _i18n.__)('纯色'), icon: _icons.lineSolid, value: 'solid' }, { label: (0, _i18n.__)('虚线'), icon: _icons.lineDashed, value: 'dashed' }, { label: (0, _i18n.__)('点线'), icon: _icons.lineDotted, value: 'dotted' }]; /** * Control to display border style options. * * @param {Object} props Component props. * @param {Function} props.onChange Handler for changing border style selection. * @param {string} props.value Currently selected border style value. * * @return {GCElement} Custom border style segmented control. */ function BorderStyleControl(_ref) { let { onChange, value } = _ref; return (0, _element.createElement)("fieldset", { className: "components-border-style-control" }, (0, _element.createElement)("legend", null, (0, _i18n.__)('样式')), (0, _element.createElement)("div", { className: "components-border-style-control__buttons" }, BORDER_STYLES.map(borderStyle => (0, _element.createElement)(_components.Button, { key: borderStyle.value, icon: borderStyle.icon, isSmall: true, isPressed: borderStyle.value === value, onClick: () => onChange(borderStyle.value === value ? undefined : borderStyle.value), "aria-label": borderStyle.label })))); } //# sourceMappingURL=index.js.map