@wordpress/block-library
Version:
Block library for the WordPress editor.
65 lines (53 loc) • 2.13 kB
JavaScript
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = SeparatorEdit;
var _element = require("@wordpress/element");
var _classnames = _interopRequireDefault(require("classnames"));
var _components = require("@wordpress/components");
var _blockEditor = require("@wordpress/block-editor");
var _useDeprecatedOpacity = _interopRequireDefault(require("./use-deprecated-opacity"));
/**
* External dependencies
*/
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
function SeparatorEdit(_ref) {
var _colorProps$style, _style$color;
let {
attributes,
setAttributes
} = _ref;
const {
backgroundColor,
opacity,
style
} = attributes;
const colorProps = (0, _blockEditor.__experimentalUseColorProps)(attributes);
const currentColor = colorProps === null || colorProps === void 0 ? void 0 : (_colorProps$style = colorProps.style) === null || _colorProps$style === void 0 ? void 0 : _colorProps$style.backgroundColor;
const hasCustomColor = !!(style !== null && style !== void 0 && (_style$color = style.color) !== null && _style$color !== void 0 && _style$color.background);
(0, _useDeprecatedOpacity.default)(opacity, currentColor, setAttributes); // The dots styles uses text for the dots, to change those dots color is
// using color, not backgroundColor.
const colorClass = (0, _blockEditor.getColorClassName)('color', backgroundColor);
const className = (0, _classnames.default)({
'has-text-color': backgroundColor || currentColor,
[colorClass]: colorClass,
'has-css-opacity': opacity === 'css',
'has-alpha-channel-opacity': opacity === 'alpha-channel'
}, colorProps.className);
const styles = {
color: currentColor,
backgroundColor: currentColor
};
return (0, _element.createElement)(_element.Fragment, null, (0, _element.createElement)(_components.HorizontalRule, (0, _blockEditor.useBlockProps)({
className,
style: hasCustomColor ? styles : undefined
})));
}
//# sourceMappingURL=edit.js.map