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.

Sign up for GitHub

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

Make font size an implicit attribute of the block #21153

Merged
merged 13 commits into from
Apr 6, 2020
Merged

Make font size an implicit attribute of the block #21153

Changes from 1 commit
Commits
Show all changes
13 commits
Select commit Hold shift + click to select a range
0487f45
Make font size an implicit attribute of the block
oandregal Mar 25, 2020
1fbd486
Export getFontSizeObjectByValue utility
oandregal Mar 27, 2020
364cf70
Remove withFontSizes HOC
oandregal Mar 27, 2020
23f62e6
Destructure props
oandregal Mar 27, 2020
66da488
Add CSS variable to block style
oandregal Mar 27, 2020
619b0dd
Refactor
youknowriad Apr 3, 2020
51e0122
Add custom font-size attribute deprecation
youknowriad Apr 3, 2020
e60bce1
Prevent overriding other typography atts
oandregal Apr 6, 2020
8e7e9b4
Do not render line-height control if block doesnt declare support
oandregal Apr 6, 2020
d05f2b2
Update paragraph example to use fontSize from style
oandregal Apr 6, 2020
519c96c
Dedupe classes
oandregal Apr 6, 2020
652e85b
Remove unnecessary classnames
oandregal Apr 6, 2020
b3bc3dd
Update snapshot
oandregal Apr 6, 2020
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: 5 additions & 3 deletions packages/block-editor/src/hooks/font-size.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@ import classnames from 'classnames';
import { addFilter } from '@wordpress/hooks';
import { hasBlockSupport } from '@wordpress/blocks';
import { useSelect } from '@wordpress/data';
import TokenList from '@wordpress/token-list';

/**
* Internal dependencies
Expand Down Expand Up @@ -60,10 +61,11 @@ function addSaveProps( props, blockType, attributes ) {
return props;
}

const { fontSize } = attributes;
// Use TokenList to dedupe classes.
const classes = new TokenList( props.className );
classes.add( getFontSizeClass( attributes.fontSize ) );
const newClassName = classnames( classes.value );
oandregal marked this conversation as resolved.
Show resolved Hide resolved

const fontSizeClass = getFontSizeClass( fontSize );
const newClassName = classnames( props.className, fontSizeClass );
props.className = newClassName ? newClassName : undefined;
Copy link
Member Author

@oandregal oandregal Apr 6, 2020 •
edited
Loading

Choose a reason for hiding this comment

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

Noting here that this has the side-effect of removing duplicated classes for old blocks that are updated. I can't think of any reason why this would be a problem but thought to highlight anyway before merging. cc @youknowriad

I've tested this with old content (preset values, custom values, duplicated classes) and works nicely, so I'm going to land in a few hours.


return props;
Expand Down