@wordpress/block-editor
Version:
72 lines (59 loc) • 1.83 kB
JavaScript
;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = AxialInputControls;
var _element = require("@wordpress/element");
var _spacingInputControl = _interopRequireDefault(require("./spacing-input-control"));
var _utils = require("../utils");
/**
* Internal dependencies
*/
const groupedSides = ['vertical', 'horizontal'];
function AxialInputControls({
minimumCustomValue,
onChange,
onMouseOut,
onMouseOver,
sides,
spacingSizes,
type,
values
}) {
const createHandleOnChange = side => next => {
if (!onChange) {
return;
}
const nextValues = { ...values
};
if (side === 'vertical') {
nextValues.top = next;
nextValues.bottom = next;
}
if (side === 'horizontal') {
nextValues.left = next;
nextValues.right = next;
}
onChange(nextValues);
}; // Filter sides if custom configuration provided, maintaining default order.
const filteredSides = sides?.length ? groupedSides.filter(side => (0, _utils.hasAxisSupport)(sides, side)) : groupedSides;
return (0, _element.createElement)(_element.Fragment, null, filteredSides.map(side => {
const axisValue = side === 'vertical' ? values.top : values.left;
return (0, _element.createElement)(_spacingInputControl.default, {
key: `spacing-sizes-control-${side}`,
icon: _utils.ICONS[side],
label: _utils.LABELS[side],
minimumCustomValue: minimumCustomValue,
onChange: createHandleOnChange(side),
onMouseOut: onMouseOut,
onMouseOver: onMouseOver,
side: side,
spacingSizes: spacingSizes,
type: type,
value: axisValue,
withInputField: false
});
}));
}
//# sourceMappingURL=axial.js.map