@wordpress/block-editor
Version:
71 lines (62 loc) • 2 kB
JavaScript
import { createElement } from "@wordpress/element";
/**
* WordPress dependencies
*/
import { hasBlockSupport } from '@wordpress/blocks';
/**
* Internal dependencies
*/
import TextTransformControl from '../components/text-transform-control';
import useEditorFeature from '../components/use-editor-feature';
import { cleanEmptyObject } from './utils';
/**
* Key within block settings' supports array indicating support for text
* transforms e.g. settings found in `block.json`.
*/
export const TEXT_TRANSFORM_SUPPORT_KEY = '__experimentalTextTransform';
/**
* Inspector control panel containing the text transform options.
*
* @param {Object} props Block properties.
* @return {WPElement} Text transform edit element.
*/
export function TextTransformEdit(props) {
var _style$typography;
const {
attributes: {
style
},
setAttributes
} = props;
const isDisabled = useIsTextTransformDisabled(props);
if (isDisabled) {
return null;
}
function onChange(newTransform) {
setAttributes({
style: cleanEmptyObject({ ...style,
typography: { ...(style === null || style === void 0 ? void 0 : style.typography),
textTransform: newTransform
}
})
});
}
return createElement(TextTransformControl, {
value: style === null || style === void 0 ? void 0 : (_style$typography = style.typography) === null || _style$typography === void 0 ? void 0 : _style$typography.textTransform,
onChange: onChange
});
}
/**
* Checks if text-transform settings have been disabled.
*
* @param {string} name Name of the block.
* @return {boolean} Whether or not the setting is disabled.
*/
export function useIsTextTransformDisabled({
name: blockName
} = {}) {
const notSupported = !hasBlockSupport(blockName, TEXT_TRANSFORM_SUPPORT_KEY);
const hasTextTransforms = useEditorFeature('typography.customTextTransforms');
return notSupported || !hasTextTransforms;
}
//# sourceMappingURL=text-transform.js.map