@gechiui/block-editor
Version:
116 lines (88 loc) • 4.25 kB
JavaScript
;
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