fix: fullpage sizes to its container; viewport only as attribute-gated fallback#21
Merged
Merged
Conversation
…d fallback :host and .panel.fullpage both pinned min-height:100vh, so mountFullPageChat into a fixed-height overflow-hidden box overflowed it and clipped the composer (visitors saw only example-prompt chips — no text input; hit live on chakrabpc.com/transformation-posture). The host now hands its box down a .wrap flex chain (.panel.fullpage flex:1), and data-viewport-fallback — set only when a probe finds the container gives the host no resolved height (bare <body> mounts) — restores min-height:100dvh for full-page routes. ::part(panel) overrides remain compatible.
🦋 Changeset detectedLatest commit: e2516a0 The changes in this PR will be included in the next version bump. This PR includes changesets to release 1 package
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
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.
Bug
:hostand.panel.fullpageboth pinnedmin-height: 100vh, somountFullPageChatinto a fixed-heightoverflow: hiddencontainer overflowed it and clipped the composer out of view — visitors saw only the example-prompt chips with no way to type. Hit live on chakrabpc.com/transformation-posture (widget 0.10.0); the page is running an interim::part(panel)override until this lands.Fix
:hostbecomes a flex column filling its box (height: 100%, no viewport unit); the rendercontainergets a.wrapclass (flex: 1; min-height: 0) so the host's box flows down;.panel.fullpageisflex: 1— never a hardcoded100vh.syncViewportFallback()probes at render (with.wraphidden,height:100%of a sized container still resolves >0; an auto-height<body>collapses to ~0) and only then setsdata-viewport-fallback, whose CSS appliesmin-height: 100dvh.::part(panel)overrides (no double-apply breakage).Tests
styles.test.ts: fullpage CSS has no unconditionalmin-height: 100vh; ships the attribute-gated100dvhrule +.wrapchain +.panel.fullpage { flex: 1 }.element.test.ts(new describefullpage container sizing):.wrap .panel.fullpagerenders; sized container (mockedclientHeight) → no fallback attribute; heightless mount → fallback attribute set.pnpm checkgreen: typecheck + 108 tests + build.🤖 Generated with Claude Code