fix(angular): stop a selected field-picker option rendering white-on-panel - #58
Merged
Merged
Conversation
…panel The rule meant to give a selected option a --lpx-brand fill carried !important on its colour but not on its background, while the .ant-select-item rule below it zeroes every option background with !important to stop ant-design's own idle-state default painting through. !important beats specificity, so the background never applied and the white text always did: a selected option rendered white on whatever the panel was - invisible while that was still #fff, and merely illegible once the panel started following --bs-secondary-bg. The hover rule directly above has !important on both halves, which is why hovering a selected option looked right and moving off it did not. Rather than adding the missing !important, the rule is removed. A selected option now reads exactly like an unselected one and ant-design's own checkmark (.ant-select-item-option-state) is the indicator. This picker is nzMode="multiple": several options are selected at once, so filling each of their rows competes with the hover state for attention rather than adding information. @dignite/ng.flex-fields' Select control carried an identical copy of the same rule and gets the same fix.
This was referenced Sep 4, 2026
duguankui
added a commit
that referenced
this pull request
Sep 4, 2026
Moves @dignite/ng.flex-fields, its -ckeditor and -file-explorer adapters and @dignite/ng.file-explorer from ^10.0.0-rc.13 to ^10.0.0-rc.14, in both the Host dev app and the published library. The library-side change in rc.14 is CSS only - the Tree control's config and search components stop painting hardcoded light-mode ng-zorro chrome and follow the host theme instead, matching what #57 and #58 did for this repository's own pickers. No API surface moved. The release-side change is the one that matters here. Through rc.13 the two adapter packages declared their intra-repo siblings at "^10.0.0-rc.4"; that range admits an older sibling, and Yarn Classic prefers the latest-tagged version for any range that admits it, so a plain install produced two copies of @dignite/ng.flex-fields - which, FLEX_FIELD_TYPES being a module-scoped InjectionToken, is two distinct DI keys and every field type absent at runtime. rc.14 declares those siblings at the released version. Verified rather than assumed, because abp-modules' own post-publish single-copy check never ran green against rc.14 - it failed on an unrelated npmrc bug in the release workflow, fixed after the tag was cut and never re-run against it. A full re-resolve here with no lockfile and the "resolutions" block removed installs exactly one copy of each of the four packages at rc.14, so the upstream fix does hold. yarn test (29 tests), ng build site and ng build Host all pass. The "resolutions" block is bumped rather than dropped: only the manifest half of the problem is gone. abp-modules still publishes pre-releases under the "next" dist-tag alone, so npmjs' "latest" keeps lagging, and the block makes the single-copy guarantee independent of a dist-tag this repository does not control. check-angular-package-duplicates.mjs is what will say when it has become redundant.
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.
Description
A selected option in the field picker's dropdown rendered white text on the panel background once
the mouse left it. Same defect, same shape, as dignite-projects/abp-modules#222 — this picker carried
an identical copy of the rule.
The rule meant to give a selected option a
--lpx-brandfill carried!importanton its colour butnot on its background:
while the
.ant-select-itemrule below it zeroes every option background with!important, to stopant-design's own idle-state default painting through.
!importantbeats specificity, so thebackground never applied and the white text always did — invisible while the panel was still
#fff,merely illegible once it started following
--bs-secondary-bg. The hover rule directly above has!importanton both halves, which is why hovering a selected option looked right and moving off itdid not.
Rather than adding the missing
!important, the rule is removed. A selected option now readsexactly like an unselected one, with ant-design's own checkmark (
.ant-select-item-option-state) asthe indicator. The picker is
nzMode="multiple"— several options are selected at once, so fillingeach of their rows competes with the hover state for attention rather than adding information.
The page-parent picker is untouched: it is single-select, and its own selected-node rule already
carries
!importanton both halves, so it never had this problem.How to test it?
Open the content-type editor's field picker, select two or three fields, and move the mouse off the
dropdown. Every option should read the same, with checkmarks marking the selected ones; hovering
should still give the blue
--bs-primaryrow with white text.ng build sitepasses. The compiled output no longer carries the selected-option rule and keeps thepanel, hover and idle-option rules unchanged. No tests added — this is emitted CSS, and the repo has
no stylesheet coverage to extend.