@gechiui/block-editor
Version:
168 lines (142 loc) • 4.79 kB
JavaScript
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.PaddingEdit = PaddingEdit;
exports.hasPaddingSupport = hasPaddingSupport;
exports.hasPaddingValue = hasPaddingValue;
exports.resetPadding = resetPadding;
exports.useIsPaddingDisabled = useIsPaddingDisabled;
var _element = require("@gechiui/element");
var _i18n = require("@gechiui/i18n");
var _blocks = require("@gechiui/blocks");
var _components = require("@gechiui/components");
var _useSetting = _interopRequireDefault(require("../components/use-setting"));
var _dimensions = require("./dimensions");
var _utils = require("./utils");
/**
* GeChiUI dependencies
*/
/**
* Internal dependencies
*/
/**
* Determines if there is padding support.
*
* @param {string|Object} blockType Block name or Block Type object.
*
* @return {boolean} Whether there is support.
*/
function hasPaddingSupport(blockType) {
const support = (0, _blocks.getBlockSupport)(blockType, _dimensions.SPACING_SUPPORT_KEY);
return !!(true === support || support !== null && support !== void 0 && support.padding);
}
/**
* Checks if there is a current value in the padding block support attributes.
*
* @param {Object} props Block props.
* @return {boolean} Whether or not the block has a padding value set.
*/
function hasPaddingValue(props) {
var _props$attributes$sty, _props$attributes$sty2;
return ((_props$attributes$sty = props.attributes.style) === null || _props$attributes$sty === void 0 ? void 0 : (_props$attributes$sty2 = _props$attributes$sty.spacing) === null || _props$attributes$sty2 === void 0 ? void 0 : _props$attributes$sty2.padding) !== undefined;
}
/**
* Resets the padding block support attributes. This can be used when disabling
* the padding support controls for a block via a `ToolsPanel`.
*
* @param {Object} props Block props.
* @param {Object} props.attributes Block's attributes.
* @param {Object} props.setAttributes Function to set block's attributes.
*/
function resetPadding(_ref) {
let {
attributes = {},
setAttributes
} = _ref;
const {
style
} = attributes;
setAttributes({
style: (0, _utils.cleanEmptyObject)({ ...style,
spacing: { ...(style === null || style === void 0 ? void 0 : style.spacing),
padding: undefined
}
})
});
}
/**
* Custom hook that checks if padding settings have been disabled.
*
* @param {string} name The name of the block.
*
* @return {boolean} Whether padding setting is disabled.
*/
function useIsPaddingDisabled() {
let {
name: blockName
} = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
const isDisabled = !(0, _useSetting.default)('spacing.padding');
const isInvalid = !(0, _dimensions.useIsDimensionsSupportValid)(blockName, 'padding');
return !hasPaddingSupport(blockName) || isDisabled || isInvalid;
}
/**
* Inspector control panel containing the padding related configuration
*
* @param {Object} props
*
* @return {GCElement} Padding edit element.
*/
function PaddingEdit(props) {
var _style$spacing;
const {
name: blockName,
attributes: {
style
},
setAttributes
} = props;
const units = (0, _components.__experimentalUseCustomUnits)({
availableUnits: (0, _useSetting.default)('spacing.units') || ['%', 'px', 'em', 'rem', 'vw']
});
const sides = (0, _dimensions.useCustomSides)(blockName, 'padding');
const splitOnAxis = sides && sides.some(side => _dimensions.AXIAL_SIDES.includes(side));
if (useIsPaddingDisabled(props)) {
return null;
}
const onChange = next => {
const newStyle = { ...style,
spacing: { ...(style === null || style === void 0 ? void 0 : style.spacing),
padding: next
}
};
setAttributes({
style: (0, _utils.cleanEmptyObject)(newStyle)
});
};
const onChangeShowVisualizer = next => {
const newStyle = { ...style,
visualizers: {
padding: next
}
};
setAttributes({
style: (0, _utils.cleanEmptyObject)(newStyle)
});
};
return _element.Platform.select({
web: (0, _element.createElement)(_element.Fragment, null, (0, _element.createElement)(_components.__experimentalBoxControl, {
values: style === null || style === void 0 ? void 0 : (_style$spacing = style.spacing) === null || _style$spacing === void 0 ? void 0 : _style$spacing.padding,
onChange: onChange,
onChangeShowVisualizer: onChangeShowVisualizer,
label: (0, _i18n.__)('内边距'),
sides: sides,
units: units,
allowReset: false,
splitOnAxis: splitOnAxis
})),
native: null
});
}
//# sourceMappingURL=padding.js.map