@wordpress/block-editor
Version:
63 lines (58 loc) • 2.17 kB
JavaScript
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.getTypographyClassesAndStyles = getTypographyClassesAndStyles;
var _clsx = _interopRequireDefault(require("clsx"));
var _components = require("@wordpress/components");
var _style = require("./style");
var _fontSizes = require("../components/font-sizes");
var _typographyUtils = require("../components/global-styles/typography-utils");
var _lockUnlock = require("../lock-unlock");
/**
* External dependencies
*/
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
const {
kebabCase
} = (0, _lockUnlock.unlock)(_components.privateApis);
/*
* This utility is intended to assist where the serialization of the typography
* block support is being skipped for a block but the typography related CSS
* styles still need to be generated so they can be applied to inner elements.
*/
/**
* Provides the CSS class names and inline styles for a block's typography support
* attributes.
*
* @param {Object} attributes Block attributes.
* @param {Object|boolean} settings Merged theme.json settings
*
* @return {Object} Typography block support derived CSS classes & styles.
*/
function getTypographyClassesAndStyles(attributes, settings) {
let typographyStyles = attributes?.style?.typography || {};
typographyStyles = {
...typographyStyles,
fontSize: (0, _typographyUtils.getTypographyFontSizeValue)({
size: attributes?.style?.typography?.fontSize
}, settings)
};
const style = (0, _style.getInlineStyles)({
typography: typographyStyles
});
const fontFamilyClassName = !!attributes?.fontFamily ? `has-${kebabCase(attributes.fontFamily)}-font-family` : '';
const textAlignClassName = !!attributes?.style?.typography?.textAlign ? `has-text-align-${attributes?.style?.typography?.textAlign}` : '';
const className = (0, _clsx.default)(fontFamilyClassName, textAlignClassName, (0, _fontSizes.getFontSizeClass)(attributes?.fontSize));
return {
className,
style
};
}
//# sourceMappingURL=use-typography-props.js.map
;