Fluid typography API makes impossible to set a fixed font-size

[matiasbenedetto]

Description

If you add "fluid": true, in your theme.json you are not able to set static font size. I would expect to be able to set a fixed font size if I haven't defined, min and/or max settings. The current behavior makes it impossible to mix fluid and static font sizes definition as in the following example:

            "fluid": true,
            "fontSizes": [
                {
                    "size": "1rem",
                    "fluid": {
                        "min": "0.875rem",
                        "max": "1rem"
                    },
                    "slug": "small",
                    "name": "Small"
                },
                {
                    "size": "1.25rem",
                    "slug": "default",
                    "name": "Default"
                },

If you add a static font size, as the default font size defined in the previous snippet, it is rendered as a fluid font size even though I haven't defined fluid.min or fluid.max as this:

--wp--preset--font-size--default: clamp(0.9375rem, 0.9375rem + ((1vw - 0.48rem) * 1.803), 1.875rem);

I would expect:
--wp--preset--font-size--default: 1.25rem;

Step-by-step reproduction instructions

1. Add the previous snippet to your theme.json
2. Apply the default font size defined to a block
3. Check that the font size is fluid instead of static.

Screenshots, screen recording, code snippet

No response

Environment info

• WordPress 6.0.1
• Gutenberg Trunk

Please confirm that you have searched existing issues in the repo.

Yes

Please confirm that you have tested with all plugins deactivated except Gutenberg.

Yes

[ramonjd]

If you add "fluid": true, in your theme.json you are not able to set static font size. I would expect to be able to set a fixed font size if I haven't defined, min and/or max settings. The current behavior makes it impossible to mix fluid and static font sizes definition

Thanks for reporting!

This is intended behaviour since 00c51d1.

Related discussion starts around here.

I had originally designed things to work as you describe in this issue.

What do folks think?

cc @mtias @scruffian

[mtias]

Yes, this is intended. Would an explicit fluid: false for a given size work to opt-out? We want to dial in fluid type heuristics as a general thing that work most of the time.

[matiasbenedetto]

Yes, this is intended. Would an explicit fluid: false for a given size work to opt-out? We want to dial in fluid type heuristics as a general thing that work most of the time.

Yep, I think that could work.

[scruffian]

Alternatively could you set a min and max which are the same?

[ramonjd]

Alternatively could you set a min and max which are the same?

Good point. This also works out of the box. 🎉

I'm happy to throw a PR up so there's an explicit fluid: false check as well.

[eric-michel]

Would an explicit fluid: false for a given size work to opt-out?

I'm experimenting with this feature now, and without looking at the theme.json schema tried adding fluid: false to my smaller font sizes in the hopes that would cause those fonts to remain static in size. I think this would be a great addition as it seems very intuitive.

I was able to solve the issue by setting min and max to the same size for now.

edit: I'm way behind, clearly 😁 #42757