mcp/carbon-components-svelte
1
0
Fork 0
mirror of https://github.com/carbon-design-system/carbon-components-svelte.git synced 2025-09-18 11:36:36 +00:00
Code Issues Projects Releases Packages Wiki Activity

feat(dropdown): add direction prop

Browse source
This commit is contained in:
Eric Liu 2021-02-19 15:53:21 -08:00
commit f6c2007636
6 changed files with 36 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

13
src/Dropdown/Dropdown.svelte
View file

@ -27,6 +27,12 @@
*/
export let type = "default";
/**
* Specify the direction of the dropdown menu
* @type {"bottom" | "top"}
*/
export let direction = "bottom";
/**
* Specify the size of the dropdown field
* @type {"sm" | "lg" | "xl"}
@ -105,8 +111,8 @@
let selectedId = undefined;
let highlightedIndex = -1;
function change(direction) {
let index = highlightedIndex + direction;
function change(dir) {
let index = highlightedIndex + dir;
if (index < 0) {
index = items.length - 1;
@ -159,7 +165,8 @@
id="{id}"
name="{name}"
aria-label="{$$props['aria-label']}"
class="bx--dropdown {invalid && 'bx--dropdown--invalid'} {!invalid &&
class="bx--dropdown {direction === 'top' && 'bx--list-box--up'} {invalid &&
'bx--dropdown--invalid'} {!invalid &&
warn &&
'bx--dropdown--warning'} {open && 'bx--dropdown--open'}
{size ===