Remove the webfont side effect from the renderer entrypoint - #2053
Open
KyleOps wants to merge 4 commits into
Open
Remove the webfont side effect from the renderer entrypoint#2053KyleOps wants to merge 4 commits into
KyleOps wants to merge 4 commits into
Conversation
packages/smart-forms-renderer/src/index.ts imported '@fontsource/inter' at the top of the public barrel, so importing anything from the package ran a CSS side effect. That included consumers who only wanted a store, a type or a pure utility, and consumers with no DOM at all (React Native, SSR, node-side $populate and $extract tooling). apps/smart-forms-app already had to neutralise the import in two places to run its tests. Provide Inter at the in-repo consumers instead: apps/smart-forms-app imports it in src/main.tsx, and documentation pulls it into its global stylesheet for the live code blocks. @fontsource/inter becomes an optional peerDependency of the renderer, which keeps the expectation visible in package metadata without forcing a browser-only asset on every consumer. Web consumers that do not provide Inter now fall back to the platform default sans-serif, so this suits a minor version. Removing the side effect is also a prerequisite for declaring sideEffects: false and adding an exports map.
This was referenced Jul 28, 2026
No source file imports the package and npm neither installs nor warns about an absent optional peer, so the entry was inert metadata. The renderer README and documentation describe the font expectation instead.
The README duplicated the install and import instructions from renderer-overview.mdx. Keep the canonical copy in the documentation and link to it, matching the README's existing pointer style.
The app loaded Inter twice: the rsms.me stylesheet in index.html and the @fontsource/inter import in main.tsx. Keep the self-hosted import, which pins the font version and removes the external CDN dependency, and drop the CDN link.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Fixes #2050
src/index.tsopened withimport '@fontsource/inter', so importing anything from@aehrc/smart-forms-renderer(a store, a type,buildForm) loaded a webfont as a side effect, which is meaningless or breaking in React Native, SSR, and node-side populate and extract tooling. The import is removed and the barrel is now side-effect free, a prerequisite for ever declaringsideEffects: falseor adding an exports map.Consumer-visible impact: a web consumer that does not provide Inter falls back to the platform sans-serif. Layout is unaffected, only the typeface, but this suits a minor version rather than a patch. The migration is one line,
import '@fontsource/inter'at the app entry, documented in the Typography section ofdocumentation/docs/dev/renderer-overview.mdx; the renderer README points there.In this repo:
apps/smart-forms-appself-hosts Inter through its own@fontsource/interimport and thersms.meCDN link inindex.htmlis removed, leaving one font source.documentationimports it incustom.cssso the live code blocks keep their typography. The renderer itself keeps no reference to the package: an optional peerDependency was considered and dropped as inert, since npm neither installs optional peers nor warns when they are absent.Testing: renderer and app jest suites match main's baseline, and the renderer, app, and documentation builds are green, with the app bundle still emitting the Inter woff files from its own import.
Known follow-up: the nested
packages/smart-forms-renderer/package-lock.jsonstill lists@fontsource/inter; regenerating it standalone is blocked by a pre-existing storybook ERESOLVE, so it is left for dependabot.