@wordpress/block-editor
Version:
78 lines (68 loc) • 2.15 kB
JavaScript
;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = TextTransformControl;
var _element = require("@wordpress/element");
var _classnames = _interopRequireDefault(require("classnames"));
var _components = require("@wordpress/components");
var _i18n = require("@wordpress/i18n");
var _icons = require("@wordpress/icons");
/**
* External dependencies
*/
/**
* WordPress dependencies
*/
const TEXT_TRANSFORMS = [{
name: (0, _i18n.__)('None'),
value: 'none',
icon: _icons.reset
}, {
name: (0, _i18n.__)('Uppercase'),
value: 'uppercase',
icon: _icons.formatUppercase
}, {
name: (0, _i18n.__)('Lowercase'),
value: 'lowercase',
icon: _icons.formatLowercase
}, {
name: (0, _i18n.__)('Capitalize'),
value: 'capitalize',
icon: _icons.formatCapitalize
}];
/**
* Control to facilitate text transform selections.
*
* @param {Object} props Component props.
* @param {string} props.className Class name to add to the control.
* @param {string} props.value Currently selected text transform.
* @param {Function} props.onChange Handles change in text transform selection.
*
* @return {WPElement} Text transform control.
*/
function TextTransformControl({
className,
value,
onChange
}) {
return (0, _element.createElement)("fieldset", {
className: (0, _classnames.default)('block-editor-text-transform-control', className)
}, (0, _element.createElement)(_components.BaseControl.VisualLabel, {
as: "legend"
}, (0, _i18n.__)('Letter case')), (0, _element.createElement)("div", {
className: "block-editor-text-transform-control__buttons"
}, TEXT_TRANSFORMS.map(textTransform => {
return (0, _element.createElement)(_components.Button, {
key: textTransform.value,
icon: textTransform.icon,
label: textTransform.name,
isPressed: textTransform.value === value,
onClick: () => {
onChange(textTransform.value === value ? undefined : textTransform.value);
}
});
})));
}
//# sourceMappingURL=index.js.map