diff --git a/etc/lime-elements.api.md b/etc/lime-elements.api.md index 1c496524ed..dfe2fa7afd 100644 --- a/etc/lime-elements.api.md +++ b/etc/lime-elements.api.md @@ -4224,6 +4224,7 @@ export type OpenDirection = 'left-start' | 'left' | 'left-end' | 'right-start' | // @public interface Option_2 { disabled?: boolean; + hotkey?: string; icon?: string | Icon; // @deprecated iconColor?: Color; diff --git a/src/components/select/examples/select-hotkeys.tsx b/src/components/select/examples/select-hotkeys.tsx new file mode 100644 index 0000000000..e8768ad371 --- /dev/null +++ b/src/components/select/examples/select-hotkeys.tsx @@ -0,0 +1,89 @@ +import { + LimelSelectCustomEvent, + Option, + ListSeparator, +} from '@limetech/lime-elements'; +import { Component, h, Host, State } from '@stencil/core'; + +/** + * Select with option hotkeys. + * + * Use `hotkey` on options to bind keyboard interaction while the select + * dropdown is open. + * + * :::note + * 1. Hotkeys work only while the custom dropdown is open. + * 2. On mobile/iOS, `limel-select` uses a native `