|
import { overridable, toWritableStores } from '../../internal/helpers/index.js'; |
|
import { withGet } from '../../internal/helpers/withGet.js'; |
|
import { writable } from 'svelte/store'; |
|
import { omit } from '../../internal/helpers/object.js'; |
|
import { createMenuBuilder } from '../menu/index.js'; |
|
const defaults = { |
|
arrowSize: 8, |
|
positioning: { |
|
placement: 'bottom', |
|
}, |
|
preventScroll: true, |
|
closeOnEscape: true, |
|
closeOnOutsideClick: true, |
|
portal: undefined, |
|
loop: false, |
|
dir: 'ltr', |
|
defaultOpen: false, |
|
forceVisible: false, |
|
typeahead: true, |
|
closeFocus: undefined, |
|
disableFocusFirstItem: false, |
|
closeOnItemClick: true, |
|
onOutsideClick: undefined, |
|
}; |
|
export function createDropdownMenu(props) { |
|
const withDefaults = { ...defaults, ...props }; |
|
const rootOptions = toWritableStores(omit(withDefaults, 'ids')); |
|
const openWritable = withDefaults.open ?? writable(withDefaults.defaultOpen); |
|
const rootOpen = overridable(openWritable, withDefaults?.onOpenChange); |
|
const rootActiveTrigger = withGet(writable(null)); |
|
const nextFocusable = withGet(writable(null)); |
|
const prevFocusable = withGet(writable(null)); |
|
const { elements, builders, ids, states, options } = createMenuBuilder({ |
|
rootOptions, |
|
rootOpen, |
|
rootActiveTrigger: withGet(rootActiveTrigger), |
|
nextFocusable: withGet(nextFocusable), |
|
prevFocusable: withGet(prevFocusable), |
|
selector: 'dropdown-menu', |
|
removeScroll: true, |
|
ids: withDefaults.ids, |
|
}); |
|
return { |
|
ids, |
|
elements, |
|
states, |
|
builders, |
|
options, |
|
}; |
|
} |
|
|