@wordpress/block-editor
Version:
50 lines (48 loc) • 1.57 kB
JavaScript
import { createElement } from "@wordpress/element";
/**
* WordPress dependencies
*/
import { Button } from '@wordpress/components';
import { __ } from '@wordpress/i18n';
import { formatCapitalize, formatLowercase, formatUppercase } from '@wordpress/icons';
const TEXT_TRANSFORMS = [{
name: __('Uppercase'),
value: 'uppercase',
icon: formatUppercase
}, {
name: __('Lowercase'),
value: 'lowercase',
icon: formatLowercase
}, {
name: __('Capitalize'),
value: 'capitalize',
icon: formatCapitalize
}];
/**
* Control to facilitate text transform selections.
*
* @param {Object} props Component props.
* @param {string} props.value Currently selected text transform.
* @param {Function} props.onChange Handles change in text transform selection.
* @return {WPElement} Text transform control.
*/
export default function TextTransformControl({
value,
onChange
}) {
return createElement("fieldset", {
className: "block-editor-text-transform-control"
}, createElement("legend", null, __('Letter case')), createElement("div", {
className: "block-editor-text-transform-control__buttons"
}, TEXT_TRANSFORMS.map(textTransform => {
return createElement(Button, {
key: textTransform.value,
icon: textTransform.icon,
isSmall: true,
isPressed: value === textTransform.value,
"aria-label": textTransform.name,
onClick: () => onChange(value === textTransform.value ? undefined : textTransform.value)
});
})));
}
//# sourceMappingURL=index.js.map