noNameWEB/livewire-material
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Rename <x-choices>'s data-active hook to data-md-active

Browse Source 
Review leftover (plan step 36): the searchable list's highlighted-row
hook was still the plain pre-Phase-F name, in both the view's binding
and its scroll-into-view lookup and the shared rule in menu.css that
paints it. No test named it directly, so none needed a change.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Qwx5USif3wFFmxtHg5U1g9
This commit is contained in:
Andreas Reinhold / reini
2026-09-15 01:57:39 +02:00
co-authored by Claude Sonnet 5
parent f53bee9ef3
commit 3f41bffbdc
2 changed files with 5 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/css/components/menu.css
+3 -3
View File
@@ -298,8 +298,8 @@
cursor: pointer; cursor: pointer;
} }
/* `data-active` is the row the arrow keys or the pointer are on. */ /* `data-md-active` is the row the arrow keys or the pointer are on. */
[data-md-field-option][data-active] { [data-md-field-option][data-md-active] {
background-color: color-mix(in srgb, var(--md-sys-color-on-surface) 8%, transparent); background-color: color-mix(in srgb, var(--md-sys-color-on-surface) 8%, transparent);
} }
@@ -308,7 +308,7 @@
color: var(--md-sys-color-on-secondary-container); color: var(--md-sys-color-on-secondary-container);
} }
[data-md-field-option][aria-selected="true"][data-active] { [data-md-field-option][aria-selected="true"][data-md-active] {
background-color: color-mix(in srgb, var(--md-sys-color-on-secondary-container) 8%, var(--md-sys-color-secondary-container)); background-color: color-mix(in srgb, var(--md-sys-color-on-secondary-container) 8%, var(--md-sys-color-secondary-container));
} }
resources/views/components/choices.blade.php
+2 -2
View File
@@ -128,7 +128,7 @@
this.open = false; this.open = false;
}, },
reveal() { reveal() {
this.$refs.list.querySelector('[data-active]')?.scrollIntoView({ block: 'nearest' }); this.$refs.list.querySelector('[data-md-active]')?.scrollIntoView({ block: 'nearest' });
}, },
}" }"
@if ($model === null) x-modelable="value" @endif @if ($model === null) x-modelable="value" @endif
@@ -185,7 +185,7 @@
x-bind:id="'{{ $id }}-option-' + index" x-bind:id="'{{ $id }}-option-' + index"
x-bind:aria-selected="(option.value === value).toString()" x-bind:aria-selected="(option.value === value).toString()"
x-bind:aria-disabled="option.disabled ? 'true' : null" x-bind:aria-disabled="option.disabled ? 'true' : null"
x-bind:data-active="index === active ? '' : null" x-bind:data-md-active="index === active ? '' : null"
x-on:mousedown.prevent="choose(option)" x-on:mousedown.prevent="choose(option)"
x-on:mousemove="active = index" x-on:mousemove="active = index"
data-md-field-option data-md-field-option