Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update: Skip typography serialization #32444

Merged
merged 1 commit into from
Jun 4, 2021
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 3 additions & 5 deletions lib/block-supports/typography.php
Original file line number Diff line number Diff line change
Expand Up @@ -88,13 +88,11 @@ function gutenberg_apply_typography_support( $block_type, $block_attributes ) {
$has_text_decoration_support = _wp_array_get( $typography_supports, array( '__experimentalTextDecoration' ), false );
$has_text_transform_support = _wp_array_get( $typography_supports, array( '__experimentalTextTransform' ), false );

$skip_font_size_support_serialization = _wp_array_get( $block_type->supports, array( '__experimentalSkipFontSizeSerialization' ), false );

// Covers all typography features _except_ font size.
$skip_typography_serialization = _wp_array_get( $block_type->supports, array( '__experimentalSkipTypographySerialization' ), false );
// Covers all typography features.
$skip_typography_serialization = _wp_array_get( $typography_supports, array( '__experimentalSkipSerialization' ), false );
Copy link
Member

@oandregal oandregal Jun 4, 2021

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

A couple of things here:

  • the letter spacing does not use this flag but should (previous to this PR)
  • instead of having this check for each individual feature, what if we check for __experimentalSkipSerialization after we do it for $typography_supports and before each individual support and return early if there's nothing to do here? (lines 80-82)


// Font Size.
if ( $has_font_size_support && ! $skip_font_size_support_serialization ) {
if ( $has_font_size_support && ! $skip_typography_serialization ) {
$has_named_font_size = array_key_exists( 'fontSize', $block_attributes );
$has_custom_font_size = isset( $block_attributes['style']['typography']['fontSize'] );

Expand Down
7 changes: 5 additions & 2 deletions packages/block-editor/src/hooks/font-size.js
Original file line number Diff line number Diff line change
Expand Up @@ -58,7 +58,10 @@ function addSaveProps( props, blockType, attributes ) {
}

if (
hasBlockSupport( blockType, '__experimentalSkipFontSizeSerialization' )
hasBlockSupport(
blockType,
'typography.__experimentalSkipSerialization'
)
) {
return props;
}
Expand Down Expand Up @@ -182,7 +185,7 @@ const withFontSizeInlineStyles = createHigherOrderComponent(
! hasBlockSupport( blockName, FONT_SIZE_SUPPORT_KEY ) ||
hasBlockSupport(
blockName,
'__experimentalSkipFontSizeSerialization'
'typography.__experimentalSkipSerialization'
) ||
! fontSize ||
style?.typography?.fontSize
Expand Down
23 changes: 8 additions & 15 deletions packages/block-editor/src/hooks/style.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,18 +3,15 @@
*/
import {
capitalize,
find,
first,
forEach,
get,
has,
isEmpty,
isEqual,
kebabCase,
map,
omit,
startsWith,
without,
} from 'lodash';
import classnames from 'classnames';

Expand All @@ -35,8 +32,11 @@ import { createHigherOrderComponent, useInstanceId } from '@wordpress/compose';
*/
import { BORDER_SUPPORT_KEY, BorderPanel } from './border';
import { COLOR_SUPPORT_KEY, ColorEdit } from './color';
import { FONT_SIZE_SUPPORT_KEY } from './font-size';
import { TypographyPanel, TYPOGRAPHY_SUPPORT_KEYS } from './typography';
import {
TypographyPanel,
TYPOGRAPHY_SUPPORT_KEY,
TYPOGRAPHY_SUPPORT_KEYS,
} from './typography';
import { SPACING_SUPPORT_KEY, SpacingPanel } from './spacing';
import useDisplayBlockControls from '../components/use-display-block-controls';

Expand Down Expand Up @@ -140,19 +140,12 @@ const skipSerializationPaths = {
[ `${ COLOR_SUPPORT_KEY }.__experimentalSkipSerialization` ]: [
COLOR_SUPPORT_KEY,
],
[ `${ TYPOGRAPHY_SUPPORT_KEY }.__experimentalSkipSerialization` ]: [
TYPOGRAPHY_SUPPORT_KEY,
],
[ `${ SPACING_SUPPORT_KEY }.__experimentalSkipSerialization` ]: [
'spacing',
],
[ `__experimentalSkipFontSizeSerialization` ]: [ 'typography', 'fontSize' ],
[ `__experimentalSkipTypographySerialization` ]: without(
TYPOGRAPHY_SUPPORT_KEYS,
FONT_SIZE_SUPPORT_KEY
).map(
( feature ) =>
find( STYLE_PROPERTY, ( property ) =>
isEqual( property.support, [ feature ] )
)?.value
),
};

/**
Expand Down
1 change: 1 addition & 0 deletions packages/block-editor/src/hooks/typography.js
Original file line number Diff line number Diff line change
Expand Up @@ -50,6 +50,7 @@ import {
useIsLetterSpacingDisabled,
} from './letter-spacing';

export const TYPOGRAPHY_SUPPORT_KEY = 'typography';
export const TYPOGRAPHY_SUPPORT_KEYS = [
LINE_HEIGHT_SUPPORT_KEY,
FONT_SIZE_SUPPORT_KEY,
Expand Down