Skip to content

Bring back the component-layer rules the utilities fix dropped - #400

Merged
sivert-io merged 2 commits into
mainfrom
claude/welcome-modal-bubble-and-persistence
Sep 5, 2026
Merged

Bring back the component-layer rules the utilities fix dropped#400
sivert-io merged 2 commits into
mainfrom
claude/welcome-modal-bubble-and-persistence

Conversation

@sivert-io

Copy link
Copy Markdown
Member

Blocked on @gryt/ui 0.26.0. Draft until that's released, because the
import doesn't resolve before it.

Ships with Gryt-chat/ui#161.

What broke

Sivert: "seems the welcome to gryt modal got changed? it has a square
background on the text now?"

It did. GRYT-858 replaced @import "@gryt/ui/styles.css" with
@source "../node_modules/@gryt/ui/dist" to stop two utilities layers fighting,
which was right. But @source regenerates utilities, and the library's
@layer components rules are hand-written, so they went with it. Measured in
the running client: .gryt-message-bubble computes border-radius: 0px and
padding: 0px, and neither it nor .gryt-composer is in any loaded stylesheet.

Five components lost their rules. The bubble is the one you can see.

What changed

One import of @gryt/ui/components.css, which is the components layer with no
utilities attached, plus the dependency bump that provides it.

What I checked

Ran the client with the new file dropped into node_modules. The bubble
computes border-radius: 28px and padding: 12px 16px, and the dialog reads as
a message again rather than a rectangle.

What to look at

The dependency bump. ^0.25.1 won't take 0.26.0, so it has to move, and this
can't merge before that release exists.

🤖 Generated with Claude Code

GRYT-858 stopped importing @gryt/ui/styles.css and scanned dist for class names
instead, which fixed two utilities layers fighting. It also dropped every rule
in the library's components layer, because those are not utilities and scanning
cannot recover them.

So the welcome dialog's message bubble has been a square with no padding, and
the composer, the conversation item, the indeterminate progress bar and the
label hover have been running without their rules too.

@gryt/ui ships those separately now. This imports them, with no utilities layer
attached, so GRYT-858 stays fixed.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
The version that ships components.css is out, so the lockfile can name it. CI
installs with --frozen-lockfile, which fails on a lockfile that still resolves
^0.26.0 to 0.25.1.

Verified against the published package rather than a local build:
.gryt-message-bubble is in a loaded stylesheet again, and the welcome bubble
computes border-radius 28px and padding 12px 16px.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
@sivert-io
sivert-io marked this pull request as ready for review September 5, 2026 10:09
@sivert-io
sivert-io merged commit cd3ed4c into main Sep 5, 2026
2 checks passed
@sivert-io
sivert-io deleted the claude/welcome-modal-bubble-and-persistence branch September 5, 2026 10:29
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant