@sveltia/ui 0.75.0 → 0.75.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -202,10 +202,11 @@
|
|
|
202
202
|
color: var(--sui-highlight-foreground-color);
|
|
203
203
|
background-color: var(--sui-hover-background-color);
|
|
204
204
|
}
|
|
205
|
-
.option :global(.focused) {
|
|
206
|
-
outline-color: var(--sui-focus-ring-color);
|
|
207
|
-
outline-offset: calc(var(--sui-focus-ring-width) * -1);
|
|
208
|
-
}
|
|
209
205
|
.option :global(.icon.check) {
|
|
210
206
|
margin: -2px;
|
|
207
|
+
}
|
|
208
|
+
|
|
209
|
+
:global([role='listbox']:focus-visible) .option :global(.focused) {
|
|
210
|
+
outline-color: var(--sui-focus-ring-color);
|
|
211
|
+
outline-offset: calc(var(--sui-focus-ring-width) * -1);
|
|
211
212
|
}</style>
|
|
@@ -828,6 +828,18 @@ export class Group {
|
|
|
828
828
|
}
|
|
829
829
|
|
|
830
830
|
this.selectTarget(event, newTarget);
|
|
831
|
+
|
|
832
|
+
// Where the group itself holds focus, as a listbox does, a click still lands it on the member
|
|
833
|
+
// clicked. Take it back, so the keys keep moving the cursor from the group and the focus ring
|
|
834
|
+
// follows the cursor rather than staying on the clicked member. A pointer-driven focus doesn’t
|
|
835
|
+
// match `:focus-visible`, so no ring appears on the click itself.
|
|
836
|
+
if (
|
|
837
|
+
!this.focusChild &&
|
|
838
|
+
document.activeElement !== this.parent &&
|
|
839
|
+
newTarget.contains(document.activeElement)
|
|
840
|
+
) {
|
|
841
|
+
this.parent.focus({ preventScroll: true });
|
|
842
|
+
}
|
|
831
843
|
}
|
|
832
844
|
|
|
833
845
|
/**
|