fix: various visual component fixes + floating-ui/colorpicker positioning#1255
Merged
Arnold Stoba (arnoldstoba) merged 22 commits intoJul 8, 2026
Merged
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
Arnold Stoba (arnoldstoba)
force-pushed
the
ntr/various-visual-component-fixes
branch
from
July 3, 2026 15:38
9d2cf17 to
f9df666
Compare
…and font-size for mt-base-field labels
The floating-ui root carries both .mt-floating-ui (position: relative) and .mt-colorpicker__colorpicker-position (position: absolute). Both are plain, equal-specificity class selectors in unscoped stylesheets, so the winner depended on bundle source order — intermittently letting .mt-floating-ui win and dropping the closed popover back into document flow. Qualify the rule with the .mt-colorpicker ancestor so it deterministically wins, mirroring the existing --compact rule. Removes the need for a :deep override in consuming code. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
The teleported .mt-floating-ui__content is positioned by writing the floating-ui coordinates inline, but `position` was left to CSS. Consumer classes passed on <mt-floating-ui class="..."> are copied onto this element, so a class carrying `position: absolute` (e.g. mt-colorpicker's positioning class) flipped the fixed-strategy coordinates into document space — the popover then rendered in a seemingly random spot and drifted away on scroll. Write `position: strategy` inline alongside top/left so it always matches the coordinate space floating-ui computed for. Inline style wins over any copied class, immunizing every consumer against this class of misposition. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
The checkbox check/partial icons changed from regular-checkmark-xxs / regular-minus-xxs to solid-checkmark-xs / solid-minus-xs. Update the references that still pointed at the old names: - mt-popover-item spec assertions (was failing in CI) - mt-checkbox interactive story assertion - mt-segmented-control checkmark sizing selector (was silently no longer matching) Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
- mt-number-field: the increment/decrement controls become a bordered box (1px border, --border-radius-xs) split 50/50 by a 1px separator, icons centered, 32px wide, height matched to the field in every size - mt-unit-field: inherits the stepper box from the number field, drops the doubled gap toward the unit select trigger, and hides the stepper via a container query below 240px - mt-radio-group-item: indicator-to-label gap 4px -> 8px, matching the earlier checkbox and switch spacing adjustment Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
- mt-checkbox: restore centered box alignment by default; gate the first-line offset (margin-top) behind the new consistentLabelLineHeight future flag and a has-label check, so label-less checkboxes (data tables, custom layouts) are no longer pushed down - mt-checkbox: bordered variant gets min-height like the switch instead of relying on vertical padding, fixing its height - mt-base-field: label line-height stays the legacy 16px by default; the token line-height (--font-line-height-xs) is opt-in via consistentLabelLineHeight so existing label baselines are preserved - mt-segmented-control: checkbox keeps no first-line offset (the action centers its content itself) - mt-modal: center the close button icon (a bare button does not, so the inline-block icon sat low on the baseline) - mt-number-field: add a disabled state for the stepper box; hide the stepper via a container query when the field is too narrow (e.g. the number fields inside a range slider), moved off mt-unit-field so it applies to plain number fields and sliders too Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Keeps the functional smoke checks; whole-page pixel regression is redundant with the component library's own visual snapshots and broke on every component restyle.
Arnold Stoba (arnoldstoba)
force-pushed
the
ntr/various-visual-component-fixes
branch
from
July 8, 2026 08:46
603d17b to
6cfcda5
Compare
Alastair Fraser (alastair-simon)
approved these changes
Jul 8, 2026
@shopware-ag/meteor-admin-sdk
@shopware-ag/meteor-component-library
@shopware-ag/create-meteor-extension
@shopware-ag/meteor-icon-kit
@shopware-ag/meteor-prettier-config
@shopware-ag/stylelint-plugin-meteor
@shopware-ag/meteor-tokens
commit: |
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
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.
What changed
positionto the computed strategy inline, so copied consumer classes can't knock it out of its coordinate space — fixes overlays landing in a random spot and drifting on scroll.:deepoverride in consuming code).Notes
🤖 Generated with Claude Code