Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(VVirtualScroll): correct keyboard navigation for selection controls #20592

Open
wants to merge 1 commit into
base: master
Choose a base branch
from

Conversation

J-Sek
Copy link
Contributor

@J-Sek J-Sek commented Oct 18, 2024

Description

TODO:

  • avoid scrolling for next and prev
  • apply to VCombobox and VAutocomplete

fixes #18383

Markup:

<template>
  <v-app theme="dark">
    <v-container>
      <h5>VSelect</h5>
      <v-select v-model="selection1" :items="options" clearable />
      <h5>VCombobox</h5>
      <v-combobox v-model="selection2" :items="options" clearable />
      <h5>VAutocomplete</h5>
      <v-autocomplete v-model="selection3" :items="options" clearable />
    </v-container>
  </v-app>
</template>

<script setup>
  import { ref } from 'vue'
  const selection1 = ref(null)
  const selection2 = ref(null)
  const selection3 = ref(null)
  const options = [
    { title: 'Alabama', value: 'AL' },
    { title: 'Alaska', value: 'AK' },
    { title: 'American Samoa', value: 'AS' },
    { title: 'Arizona', value: 'AZ' },
    { title: 'Arkansas', value: 'AR' },
    { title: 'California', value: 'CA' },
    { title: 'Colorado', value: 'CO' },
    { title: 'Connecticut', value: 'CT' },
    { title: 'Delaware', value: 'DE' },
    { title: 'District Of Columbia', value: 'DC' },
    { title: 'Federated States Of Micronesia', value: 'FM' },
    { title: 'Florida', value: 'FL' },
    { title: 'Georgia', value: 'GA' },
    { title: 'Guam', value: 'GU' },
    { title: 'Hawaii', value: 'HI' },
    { title: 'Idaho', value: 'ID' },
    { title: 'Illinois', value: 'IL' },
    { title: 'Indiana', value: 'IN' },
    { title: 'Iowa', value: 'IA' },
    { title: 'Kansas', value: 'KS' },
    { title: 'Kentucky', value: 'KY' },
    { title: 'Louisiana', value: 'LA' },
    { title: 'Maine', value: 'ME' },
    { title: 'Marshall Islands', value: 'MH' },
    { title: 'Maryland', value: 'MD' },
    { title: 'Massachusetts', value: 'MA' },
    { title: 'Michigan', value: 'MI' },
    { title: 'Minnesota', value: 'MN' },
    { title: 'Mississippi', value: 'MS' },
    { title: 'Missouri', value: 'MO' },
    { title: 'Montana', value: 'MT' },
    { title: 'Nebraska', value: 'NE' },
    { title: 'Nevada', value: 'NV' },
    { title: 'New Hampshire', value: 'NH' },
    { title: 'New Jersey', value: 'NJ' },
    { title: 'New Mexico', value: 'NM' },
    { title: 'New York', value: 'NY' },
    { title: 'North Carolina', value: 'NC' },
    { title: 'North Dakota', value: 'ND' },
    { title: 'Northern Mariana Islands', value: 'MP' },
    { title: 'Ohio', value: 'OH' },
    { title: 'Oklahoma', value: 'OK' },
    { title: 'Oregon', value: 'OR' },
    { title: 'Palau', value: 'PW' },
    { title: 'Pennsylvania', value: 'PA' },
    { title: 'Puerto Rico', value: 'PR' },
    { title: 'Rhode Island', value: 'RI' },
    { title: 'South Carolina', value: 'SC' },
    { title: 'South Dakota', value: 'SD' },
    { title: 'Tennessee', value: 'TN' },
    { title: 'Texas', value: 'TX' },
    { title: 'Utah', value: 'UT' },
    { title: 'Vermont', value: 'VT' },
    { title: 'Virgin Islands', value: 'VI' },
    { title: 'Virginia', value: 'VA' },
    { title: 'Washington', value: 'WA' },
    { title: 'West Virginia', value: 'WV' },
    { title: 'Wisconsin', value: 'WI' },
    { title: 'Wyoming', value: 'WY' },
  ]
</script>

@J-Sek J-Sek changed the title fix(VSelect): correct keyboard navigation within large lists fix(VVirtualScroll): correct keyboard navigation for selection controls Oct 19, 2024
@J-Sek J-Sek marked this pull request as ready for review October 19, 2024 19:08
@MajesticPotatoe MajesticPotatoe added T: bug Functionality that does not work as intended/expected C: VVirtualScroll labels Oct 28, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
C: VVirtualScroll T: bug Functionality that does not work as intended/expected
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[Bug Report][3.3.19] VAutoComplete / VSelect with more than 12 items breaks list wrapping behavior
2 participants