fix(core): scope the 16px input floor to iOS - #6085

@ManoharPaturi ManoharPaturi commented Sep 6, 2026

Copy link

Copy Markdown

Contributor

Fixes #6015

Summary

Text controls carried @media (pointer: coarse) { font-size: max(1rem, var(--text-body-size)) } — the iOS no-zoom floor — for every coarse pointer. Only iOS Safari zooms on focus below 16px; Android and desktop-touch browsers do not, so non-iOS touch users got inflated text for no benefit. This nests the floor in @supports (-webkit-touch-callout: none) inside the existing coarse-pointer branch (option 1 from the issue): iOS output is byte-identical, every other platform keeps the theme's token size.

Scope

All 19 floored sites, found by recursive scan rather than by hand: 16 body-size controls (including RichTextEditor in packages/richtext, which carried the identical rule), 3 label-size controls (Selector, ComplexSelector, PanelSearchInput), and the two derived height: firstThatWorks('1lh', ...) fallbacks in NativeDateField/nativePickerSegmentStyles, which became conditional so pre-1lh browsers stay height-consistent on both sides of the gate.

Tests

New family-wide source-invariant suite packages/core/src/inputFontFloor.test.ts: asserts every floored control carries the iOS gate and (recursively) that no bare coarse-pointer floor remains anywhere in core — so a future control can't reintroduce the over-broad rule.
A declaredValue read-back test in TextInput.test.tsx. (Source-level assertions are necessary: jsdom's CSSOM silently drops at-rule-wrapped max(1rem, ...) declarations — verified empirically against the old pattern too, so the old code was equally untestable that way.)

Docs (ChatComposerInput.doc.mjs, all locales) now say "iOS" where they said "touch device". Changeset included.

Verification

Affected suites 714 + 656 passed, dependents 183 passed, final commit pass 77; tsc --noEmit clean (core + richtext); eslint 0 errors on touched files; check:sync and check:changesets clean.


 fix(core): scope the 16px input floor to iOS

3de57a9

ManoharPaturi requested review from cixzhang and imdreamrunner as code owners

Copilot AI lite review requested due to automatic review settings

ManoharPaturi requested review from josephfarina and potatowagon as code owners

@vercel

vercel Bot commented Sep 6, 2026 •

edited

Loading

Copy link

Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated
astryx	Ready Ready	Preview	Sep 6, 2026 8:08am UTC

Request Review

@meta-cla meta-cla Bot added the CLA Signed label

Copilot AI reviewed

Copilot AI left a comment

Copy link

Copy Markdown

Choose a reason for hiding this comment

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

Copilot was unable to review this pull request because the user who requested the review has reached their quota limit.

@github-actions github-actions Bot added community needs:code-review needs:design-review labels

github-actions Bot requested review from cvkxx, ernestt, kentonquatman and rubyycheung

@vercel

vercel Bot deployed to Preview

September 6, 2026 06:56

View deployment

github-actions Bot added a commit that referenced this pull request


 Deploy PR #6085 preview

e8e6bdd

github-actions Bot commented Sep 6, 2026 •

edited

Loading

Copy link

Copy Markdown

Contributor

PR Analysis Report

📚 Storybook Preview

View Storybook for this PR
GitHub Pages may take up to a minute to hydrate after deploy.

🧪 Sandbox Preview

View Sandbox for this PR
GitHub Pages may take up to a minute to hydrate after deploy.

Modified Components

Chat _{(@astryxdesign/core)} · View in Storybook

Metric	Before	After	Delta
Bundle Size (ESM)	N/A	N/A	N/A
Lines of Code	N/A	5600	-
Complexity	N/A	Very High (456)	-

CommandPalette _{(@astryxdesign/core)} · View in Storybook

Metric	Before	After	Delta
Bundle Size (ESM)	N/A	N/A	N/A
Lines of Code	N/A	1012	-
Complexity	N/A	Very High (114)	-

ComplexSelector _{(@astryxdesign/core)} · View in Storybook

Metric	Before	After	Delta
Bundle Size (ESM)	N/A	N/A	N/A
Lines of Code	N/A	461	-
Complexity	N/A	Very High (44)	-

DateInput _{(@astryxdesign/core)} · View in Storybook

Metric	Before	After	Delta
Bundle Size (ESM)	N/A	N/A	N/A
Lines of Code	N/A	3312	-
Complexity	N/A	Very High (356)	-

DateRangeInput _{(@astryxdesign/core)} · View in Storybook

Metric	Before	After	Delta
Bundle Size (ESM)	N/A	N/A	N/A
Lines of Code	N/A	541	-
Complexity	N/A	Very High (66)	-

DateTimeInput _{(@astryxdesign/core)} · View in Storybook

Metric	Before	After	Delta
Bundle Size (ESM)	N/A	N/A	N/A
Lines of Code	N/A	3404	-
Complexity	N/A	Very High (532)	-

Field _{(@astryxdesign/core)} · View in Storybook

Metric	Before	After	Delta
Bundle Size (ESM)	N/A	N/A	N/A
Lines of Code	N/A	805	-
Complexity	N/A	Very High (50)	-

FileInput _{(@astryxdesign/core)} · View in Storybook

Metric	Before	After	Delta
Bundle Size (ESM)	N/A	N/A	N/A
Lines of Code	N/A	663	-
Complexity	N/A	Very High (102)	-

NumberInput _{(@astryxdesign/core)} · View in Storybook

Metric	Before	After	Delta
Bundle Size (ESM)	N/A	N/A	N/A
Lines of Code	N/A	1071	-
Complexity	N/A	Very High (151)	-

Selector _{(@astryxdesign/core)} · View in Storybook

Metric	Before	After	Delta
Bundle Size (ESM)	N/A	N/A	N/A
Lines of Code	N/A	2001	-
Complexity	N/A	Very High (222)	-

TextArea _{(@astryxdesign/core)} · View in Storybook

Metric	Before	After	Delta
Bundle Size (ESM)	N/A	N/A	N/A
Lines of Code	N/A	436	-
Complexity	N/A	Very High (65)	-

TextInput _{(@astryxdesign/core)} · View in Storybook

Metric	Before	After	Delta
Bundle Size (ESM)	N/A	N/A	N/A
Lines of Code	N/A	333	-
Complexity	N/A	Very High (55)	-

TimeInput _{(@astryxdesign/core)} · View in Storybook

Metric	Before	After	Delta
Bundle Size (ESM)	N/A	N/A	N/A
Lines of Code	N/A	528	-
Complexity	N/A	Very High (91)	-

Typeahead _{(@astryxdesign/core)} · View in Storybook

Metric	Before	After	Delta
Bundle Size (ESM)	N/A	N/A	N/A
Lines of Code	N/A	1354	-
Complexity	N/A	Very High (188)	-

RichTextEditor _{(@astryxdesign/richtext)} · View in Storybook

Metric	Before	After	Delta
Bundle Size (ESM)	N/A	N/A	N/A
Lines of Code	N/A	604	-
Complexity	N/A	Very High (57)	-

Bundle Size Summary

Package	Size (ESM)	Size (CJS)	Gzipped
@astryxdesign/core	N/A	4.8KB	1.2KB
@astryxdesign/richtext	N/A	N/A	N/A

Accessibility Audit

Status: 4 accessibility violation(s) found — 2 critical, 2 serious.

DateRangeInput - 1 issue(s)

🔴 critical: Ensure an element's role supports its ARIA attributes
- Rule: aria-allowed-attr · Affects 1/20 stories · Learn more
- WCAG: 4.1.2 (Level A)

FileInput - 1 issue(s)

🟠 serious: Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds
- Rule: color-contrast · Affects 3/15 stories · Learn more
- WCAG: 1.4.3 (Level AA)

RichTextEditor - 2 issue(s)

🟠 serious: Ensure every ARIA input field has an accessible name
- Rule: aria-input-field-name · Affects 2/18 stories · Learn more
- WCAG: 4.1.2 (Level A)
🔴 critical: Ensure every form element has a label
- Rule: label · Affects 1/18 stories · Learn more
- WCAG: 4.1.2 (Level A)

Visual Regression

2 of 32 shot(s) changed. View the report

A repository maintainer can accept these exact frames: /accept-visual 34020809682/1 <why every changed frame is correct>

A change here is a question, not a failure: check whether the after is the
picture you intended. If it is, say so in the PR — the release gate's baseline
is updated deliberately, and this check never rewrites it.

component	story	theme	mode	pixels
ComplexSelector	Fruit ripeness selector	neutral	light	3,992
ComplexSelector	Fruit ripeness selector	neutral	dark	3,825

ComplexSelector — Fruit ripeness selector — neutral light

Before	After	Diff
Before visual regression frame	After visual regression frame	Pixel difference frame

ComplexSelector — Fruit ripeness selector — neutral dark

Before	After	Diff
Before visual regression frame	After visual regression frame	Pixel difference frame

_{Generated by PR Enrichment workflow | Storybook | Sandbox | View full report}

cixzhang

cixzhang requested changes

View reviewed changes

@cixzhang cixzhang left a comment

Copy link

Copy Markdown

Contributor

Choose a reason for hiding this comment

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

Thanks for tightening the floor to iOS. The Chromium path and generated CSS look right, but the family regression guard omits RichTextEditor. Please include the rich-text package so all 19 changed controls are protected.

[Reviewed by Robohands]

packages/core/src/inputFontFloor.test.ts

'TextArea/TextArea.tsx',

'TextInput/TextInput.tsx',

'TimeInput/TimeInput.tsx',

'Typeahead/BaseTypeahead.tsx',

@cixzhang cixzhang Sep 6, 2026

Copy link

Copy Markdown

Contributor

Choose a reason for hiding this comment

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

This omits RichTextEditor, so its broad coarse-pointer floor can regress while this ‘family-wide’ suite stays green.

[Reviewed by Robohands]


 test(core): cover the rich-text package in the input-font-floor guard

d2b04b4

ManoharPaturi commented Sep 6, 2026

Copy link

Copy Markdown

Contributor Author

Done in the updated branch — inputFontFloor.test.ts now scans the rich-text package too: RichTextEditor.tsx is in the gated-controls list (path relative to core), and the bare-floor offender scan covers packages/richtext/src alongside core, so a reintroduced ungated floor fails wherever it lands in either tree. Both guard tests green.

github-actions Bot requested a review from cixzhang

September 6, 2026 08:04

@vercel

vercel Bot deployed to Preview

September 6, 2026 08:08

View deployment

github-actions Bot added a commit that referenced this pull request


 Deploy PR #6085 preview

664166e

cixzhang

cixzhang requested changes

View reviewed changes

@cixzhang cixzhang left a comment

Copy link

Copy Markdown

Contributor

Choose a reason for hiding this comment

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

Thanks for fixing the RichTextEditor coverage gap—the family guard and non-iOS path now check out. I still can’t verify the iOS half of this compatibility fix. Please add latest-stable iOS Safari evidence showing the nested gate computes the input to 16px and focusing it keeps visualViewport.scale at 1, with the device/OS/Safari version and this exact head recorded. Chromium or Playwright WebKit cannot establish that browser-specific behavior.

[Reviewed by Robohands]