mirror of
https://github.com/ArthurDanjou/ui.git
synced 2026-02-02 05:08:03 +01:00
docs(command-palette): disable all autofocus
This commit is contained in:
@@ -58,6 +58,8 @@ You can pass any property from the [Link](/components/link#props) component such
|
|||||||
::component-code
|
::component-code
|
||||||
---
|
---
|
||||||
collapse: true
|
collapse: true
|
||||||
|
hide:
|
||||||
|
- autofocus
|
||||||
ignore:
|
ignore:
|
||||||
- groups
|
- groups
|
||||||
- modelValue
|
- modelValue
|
||||||
@@ -68,6 +70,7 @@ external:
|
|||||||
class: '!p-0'
|
class: '!p-0'
|
||||||
props:
|
props:
|
||||||
modelValue: {}
|
modelValue: {}
|
||||||
|
autofocus: false
|
||||||
groups:
|
groups:
|
||||||
- id: 'users'
|
- id: 'users'
|
||||||
label: 'Users'
|
label: 'Users'
|
||||||
@@ -111,6 +114,8 @@ Use the `multiple` prop to allow multiple selections.
|
|||||||
::component-code
|
::component-code
|
||||||
---
|
---
|
||||||
collapse: true
|
collapse: true
|
||||||
|
hide:
|
||||||
|
- autofocus
|
||||||
ignore:
|
ignore:
|
||||||
- groups
|
- groups
|
||||||
- modelValue
|
- modelValue
|
||||||
@@ -122,6 +127,7 @@ external:
|
|||||||
class: '!p-0'
|
class: '!p-0'
|
||||||
props:
|
props:
|
||||||
multiple: true
|
multiple: true
|
||||||
|
autofocus: false
|
||||||
modelValue: []
|
modelValue: []
|
||||||
groups:
|
groups:
|
||||||
- id: 'users'
|
- id: 'users'
|
||||||
@@ -170,6 +176,8 @@ Use the `placeholder` prop to change the placeholder text.
|
|||||||
::component-code
|
::component-code
|
||||||
---
|
---
|
||||||
collapse: true
|
collapse: true
|
||||||
|
hide:
|
||||||
|
- autofocus
|
||||||
ignore:
|
ignore:
|
||||||
- class
|
- class
|
||||||
- groups
|
- groups
|
||||||
@@ -177,6 +185,7 @@ external:
|
|||||||
- groups
|
- groups
|
||||||
class: '!p-0'
|
class: '!p-0'
|
||||||
props:
|
props:
|
||||||
|
autofocus: false
|
||||||
placeholder: 'Search an app...'
|
placeholder: 'Search an app...'
|
||||||
groups:
|
groups:
|
||||||
- id: 'apps'
|
- id: 'apps'
|
||||||
@@ -198,6 +207,8 @@ Use the `icon` prop to customize the input [Icon](/components/icon). Defaults to
|
|||||||
::component-code
|
::component-code
|
||||||
---
|
---
|
||||||
collapse: true
|
collapse: true
|
||||||
|
hide:
|
||||||
|
- autofocus
|
||||||
ignore:
|
ignore:
|
||||||
- class
|
- class
|
||||||
- groups
|
- groups
|
||||||
@@ -205,6 +216,7 @@ external:
|
|||||||
- groups
|
- groups
|
||||||
class: '!p-0'
|
class: '!p-0'
|
||||||
props:
|
props:
|
||||||
|
autofocus: false
|
||||||
icon: 'i-lucide-box'
|
icon: 'i-lucide-box'
|
||||||
groups:
|
groups:
|
||||||
- id: 'apps'
|
- id: 'apps'
|
||||||
@@ -238,6 +250,8 @@ Use the `loading` prop to show a loading icon on the CommandPalette.
|
|||||||
::component-code
|
::component-code
|
||||||
---
|
---
|
||||||
collapse: true
|
collapse: true
|
||||||
|
hide:
|
||||||
|
- autofocus
|
||||||
ignore:
|
ignore:
|
||||||
- class
|
- class
|
||||||
- groups
|
- groups
|
||||||
@@ -245,6 +259,7 @@ external:
|
|||||||
- groups
|
- groups
|
||||||
class: '!p-0'
|
class: '!p-0'
|
||||||
props:
|
props:
|
||||||
|
autofocus: false
|
||||||
loading: true
|
loading: true
|
||||||
groups:
|
groups:
|
||||||
- id: 'apps'
|
- id: 'apps'
|
||||||
@@ -266,6 +281,8 @@ Use the `loading-icon` prop to customize the loading icon. Defaults to `i-lucide
|
|||||||
::component-code
|
::component-code
|
||||||
---
|
---
|
||||||
collapse: true
|
collapse: true
|
||||||
|
hide:
|
||||||
|
- autofocus
|
||||||
ignore:
|
ignore:
|
||||||
- class
|
- class
|
||||||
- groups
|
- groups
|
||||||
@@ -273,6 +290,7 @@ external:
|
|||||||
- groups
|
- groups
|
||||||
class: '!p-0'
|
class: '!p-0'
|
||||||
props:
|
props:
|
||||||
|
autofocus: false
|
||||||
loading: true
|
loading: true
|
||||||
loadingIcon: 'i-lucide-repeat-2'
|
loadingIcon: 'i-lucide-repeat-2'
|
||||||
groups:
|
groups:
|
||||||
@@ -307,6 +325,8 @@ Use the `disabled` prop to disable the CommandPalette.
|
|||||||
::component-code
|
::component-code
|
||||||
---
|
---
|
||||||
collapse: true
|
collapse: true
|
||||||
|
hide:
|
||||||
|
- autofocus
|
||||||
ignore:
|
ignore:
|
||||||
- groups
|
- groups
|
||||||
- class
|
- class
|
||||||
@@ -314,6 +334,7 @@ external:
|
|||||||
- groups
|
- groups
|
||||||
class: '!p-0'
|
class: '!p-0'
|
||||||
props:
|
props:
|
||||||
|
autofocus: false
|
||||||
disabled: true
|
disabled: true
|
||||||
groups:
|
groups:
|
||||||
- id: 'apps'
|
- id: 'apps'
|
||||||
@@ -339,6 +360,8 @@ An `update:open` event will be emitted when the close button is clicked.
|
|||||||
::component-code
|
::component-code
|
||||||
---
|
---
|
||||||
collapse: true
|
collapse: true
|
||||||
|
hide:
|
||||||
|
- autofocus
|
||||||
ignore:
|
ignore:
|
||||||
- class
|
- class
|
||||||
- groups
|
- groups
|
||||||
@@ -347,6 +370,7 @@ external:
|
|||||||
- groups
|
- groups
|
||||||
class: '!p-0'
|
class: '!p-0'
|
||||||
props:
|
props:
|
||||||
|
autofocus: false
|
||||||
close: true
|
close: true
|
||||||
groups:
|
groups:
|
||||||
- id: 'apps'
|
- id: 'apps'
|
||||||
@@ -367,6 +391,8 @@ You can pass any property from the [Button](/components/button) component to cus
|
|||||||
---
|
---
|
||||||
collapse: true
|
collapse: true
|
||||||
prettier: true
|
prettier: true
|
||||||
|
hide:
|
||||||
|
- autofocus
|
||||||
ignore:
|
ignore:
|
||||||
- close.color
|
- close.color
|
||||||
- close.variant
|
- close.variant
|
||||||
@@ -376,6 +402,7 @@ external:
|
|||||||
- groups
|
- groups
|
||||||
class: '!p-0'
|
class: '!p-0'
|
||||||
props:
|
props:
|
||||||
|
autofocus: false
|
||||||
close:
|
close:
|
||||||
color: primary
|
color: primary
|
||||||
variant: outline
|
variant: outline
|
||||||
@@ -400,6 +427,8 @@ Use the `close-icon` prop to customize the close button [Icon](/components/icon)
|
|||||||
::component-code
|
::component-code
|
||||||
---
|
---
|
||||||
collapse: true
|
collapse: true
|
||||||
|
hide:
|
||||||
|
- autofocus
|
||||||
ignore:
|
ignore:
|
||||||
- class
|
- class
|
||||||
- groups
|
- groups
|
||||||
@@ -408,6 +437,7 @@ external:
|
|||||||
- groups
|
- groups
|
||||||
class: '!p-0'
|
class: '!p-0'
|
||||||
props:
|
props:
|
||||||
|
autofocus: false
|
||||||
close: true
|
close: true
|
||||||
closeIcon: 'i-lucide-arrow-right'
|
closeIcon: 'i-lucide-arrow-right'
|
||||||
groups:
|
groups:
|
||||||
@@ -446,6 +476,8 @@ You can control the selected item(s) by using the `default-value` prop or the `v
|
|||||||
collapse: true
|
collapse: true
|
||||||
name: 'command-palette-select-example'
|
name: 'command-palette-select-example'
|
||||||
class: '!p-0'
|
class: '!p-0'
|
||||||
|
props:
|
||||||
|
autofocus: false
|
||||||
---
|
---
|
||||||
::
|
::
|
||||||
|
|
||||||
@@ -458,6 +490,8 @@ Use the `v-model:search-term` directive to control the search term.
|
|||||||
collapse: true
|
collapse: true
|
||||||
name: 'command-palette-search-term-example'
|
name: 'command-palette-search-term-example'
|
||||||
class: '!p-0'
|
class: '!p-0'
|
||||||
|
props:
|
||||||
|
autofocus: false
|
||||||
---
|
---
|
||||||
::
|
::
|
||||||
|
|
||||||
@@ -474,6 +508,8 @@ You can fetch items from an API and use them in the CommandPalette.
|
|||||||
collapse: true
|
collapse: true
|
||||||
name: 'command-palette-fetch-example'
|
name: 'command-palette-fetch-example'
|
||||||
class: '!p-0'
|
class: '!p-0'
|
||||||
|
props:
|
||||||
|
autofocus: false
|
||||||
---
|
---
|
||||||
::
|
::
|
||||||
|
|
||||||
@@ -486,6 +522,8 @@ You can set the `ignoreFilter` field to `true` on a group to disable the interna
|
|||||||
collapse: true
|
collapse: true
|
||||||
name: 'command-palette-ignore-filter-example'
|
name: 'command-palette-ignore-filter-example'
|
||||||
class: '!p-0'
|
class: '!p-0'
|
||||||
|
props:
|
||||||
|
autofocus: false
|
||||||
---
|
---
|
||||||
::
|
::
|
||||||
|
|
||||||
@@ -502,6 +540,8 @@ You can use the `postFilter` field on a group to filter items after the search h
|
|||||||
collapse: true
|
collapse: true
|
||||||
name: 'command-palette-post-filter-example'
|
name: 'command-palette-post-filter-example'
|
||||||
class: '!p-0'
|
class: '!p-0'
|
||||||
|
props:
|
||||||
|
autofocus: false
|
||||||
---
|
---
|
||||||
::
|
::
|
||||||
|
|
||||||
@@ -536,6 +576,8 @@ You can for example set `{ fuseOptions: { includeMatches: true } }`{lang="ts-typ
|
|||||||
collapse: true
|
collapse: true
|
||||||
name: 'command-palette-fuse-example'
|
name: 'command-palette-fuse-example'
|
||||||
class: '!p-0'
|
class: '!p-0'
|
||||||
|
props:
|
||||||
|
autofocus: false
|
||||||
---
|
---
|
||||||
::
|
::
|
||||||
|
|
||||||
@@ -547,6 +589,8 @@ You can use the CommandPalette component inside a [Popover](/components/popover)
|
|||||||
---
|
---
|
||||||
collapse: true
|
collapse: true
|
||||||
name: 'popover-command-palette-example'
|
name: 'popover-command-palette-example'
|
||||||
|
props:
|
||||||
|
autofocus: false
|
||||||
---
|
---
|
||||||
::
|
::
|
||||||
|
|
||||||
@@ -558,6 +602,8 @@ You can use the CommandPalette component inside a [Modal](/components/modal)'s c
|
|||||||
---
|
---
|
||||||
collapse: true
|
collapse: true
|
||||||
name: 'modal-command-palette-example'
|
name: 'modal-command-palette-example'
|
||||||
|
props:
|
||||||
|
autofocus: false
|
||||||
---
|
---
|
||||||
::
|
::
|
||||||
|
|
||||||
@@ -569,6 +615,8 @@ You can use the CommandPalette component inside a [Drawer](/components/drawer)'s
|
|||||||
---
|
---
|
||||||
collapse: true
|
collapse: true
|
||||||
name: 'drawer-command-palette-example'
|
name: 'drawer-command-palette-example'
|
||||||
|
props:
|
||||||
|
autofocus: false
|
||||||
---
|
---
|
||||||
::
|
::
|
||||||
|
|
||||||
@@ -580,6 +628,8 @@ When using the `close` prop, you can listen to the `update:open` event when the
|
|||||||
---
|
---
|
||||||
collapse: true
|
collapse: true
|
||||||
name: 'command-palette-open-example'
|
name: 'command-palette-open-example'
|
||||||
|
props:
|
||||||
|
autofocus: false
|
||||||
---
|
---
|
||||||
::
|
::
|
||||||
|
|
||||||
@@ -607,6 +657,8 @@ You will have access to the following slots:
|
|||||||
---
|
---
|
||||||
name: 'command-palette-custom-slot-example'
|
name: 'command-palette-custom-slot-example'
|
||||||
class: '!p-0'
|
class: '!p-0'
|
||||||
|
props:
|
||||||
|
autofocus: false
|
||||||
---
|
---
|
||||||
::
|
::
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user