UNPKG

@wordpress/block-editor

Version:
63 lines (58 loc) 2.17 kB
"use strict"; 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