UNPKG

@gechiui/block-editor

Version:
116 lines (88 loc) 4.25 kB
"use strict"; var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); Object.defineProperty(exports, "__esModule", { value: true }); exports.BORDER_SUPPORT_KEY = void 0; exports.BorderPanel = BorderPanel; exports.hasBorderSupport = hasBorderSupport; exports.shouldSkipSerialization = shouldSkipSerialization; var _element = require("@gechiui/element"); var _blocks = require("@gechiui/blocks"); var _components = require("@gechiui/components"); var _i18n = require("@gechiui/i18n"); var _inspectorControls = _interopRequireDefault(require("../components/inspector-controls")); var _useSetting = _interopRequireDefault(require("../components/use-setting")); var _borderColor = require("./border-color"); var _borderRadius = require("./border-radius"); var _borderStyle = require("./border-style"); var _borderWidth = require("./border-width"); /** * GeChiUI dependencies */ /** * Internal dependencies */ const BORDER_SUPPORT_KEY = '__experimentalBorder'; exports.BORDER_SUPPORT_KEY = BORDER_SUPPORT_KEY; function BorderPanel(props) { const isDisabled = useIsBorderDisabled(props); const isSupported = hasBorderSupport(props.name); const isColorSupported = (0, _useSetting.default)('border.color') && hasBorderSupport(props.name, 'color'); const isRadiusSupported = (0, _useSetting.default)('border.radius') && hasBorderSupport(props.name, 'radius'); const isStyleSupported = (0, _useSetting.default)('border.style') && hasBorderSupport(props.name, 'style'); const isWidthSupported = (0, _useSetting.default)('border.width') && hasBorderSupport(props.name, 'width'); if (isDisabled || !isSupported) { return null; } return (0, _element.createElement)(_inspectorControls.default, null, (0, _element.createElement)(_components.PanelBody, { className: "block-editor-hooks__border-controls", title: (0, _i18n.__)('边框'), initialOpen: false }, (isWidthSupported || isStyleSupported) && (0, _element.createElement)("div", { className: "block-editor-hooks__border-controls-row" }, isWidthSupported && (0, _element.createElement)(_borderWidth.BorderWidthEdit, props), isStyleSupported && (0, _element.createElement)(_borderStyle.BorderStyleEdit, props)), isColorSupported && (0, _element.createElement)(_borderColor.BorderColorEdit, props), isRadiusSupported && (0, _element.createElement)(_borderRadius.BorderRadiusEdit, props))); } /** * Determine whether there is block support for border properties. * * @param {string} blockName Block name. * @param {string} feature Border feature to check support for. * * @return {boolean} Whether there is support. */ function hasBorderSupport(blockName) { let feature = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'any'; if (_element.Platform.OS !== 'web') { return false; } const support = (0, _blocks.getBlockSupport)(blockName, BORDER_SUPPORT_KEY); if (support === true) { return true; } if (feature === 'any') { return !!(support !== null && support !== void 0 && support.color || support !== null && support !== void 0 && support.radius || support !== null && support !== void 0 && support.width || support !== null && support !== void 0 && support.style); } return !!(support !== null && support !== void 0 && support[feature]); } /** * Check whether serialization of border classes and styles should be skipped. * * @param {string|Object} blockType Block name or block type object. * * @return {boolean} Whether serialization of border properties should occur. */ function shouldSkipSerialization(blockType) { const support = (0, _blocks.getBlockSupport)(blockType, BORDER_SUPPORT_KEY); return support === null || support === void 0 ? void 0 : support.__experimentalSkipSerialization; } /** * Determines if all border support features have been disabled. * * @return {boolean} If border support is completely disabled. */ const useIsBorderDisabled = () => { const configs = [!(0, _useSetting.default)('border.color'), !(0, _useSetting.default)('border.radius'), !(0, _useSetting.default)('border.style'), !(0, _useSetting.default)('border.width')]; return configs.every(Boolean); }; //# sourceMappingURL=border.js.map