diff --git a/packages/materialdesign-components/src/List/ListItem.svelte b/packages/materialdesign-components/src/List/ListItem.svelte index f60396ae4d..deae994b7f 100644 --- a/packages/materialdesign-components/src/List/ListItem.svelte +++ b/packages/materialdesign-components/src/List/ListItem.svelte @@ -27,6 +27,15 @@ let role = "option" + const itemData = () => ({ + _id, + value, + text, + secondaryText, + selected, + disabled, + }) + onMount(() => { _id = generate() @@ -35,20 +44,19 @@ listProps = _bb.getContext("BBMD:list:props") let context = _bb.getContext("BBMD:list:context") + const _addItem = _bb.getContext("BBMD:list:addItem") + if (context === "menu") { role = "menuitem" } + + if (_addItem) { + _addItem(itemData()) + } }) function handleClick() { - let item = { - _id, - value, - text, - secondaryText, - selected, - disabled, - } + let item = itemData() if (!disabled) { if ( listProps.singleSelection || diff --git a/packages/materialdesign-components/src/Select/Select.svelte b/packages/materialdesign-components/src/Select/Select.svelte index e6bf7c9e01..c9b4a3bd91 100644 --- a/packages/materialdesign-components/src/Select/Select.svelte +++ b/packages/materialdesign-components/src/Select/Select.svelte @@ -16,8 +16,8 @@ let select let selectList let instance - let _helperId = "" + let listItems = [] export let _bb export let onSelect = items => {} @@ -32,19 +32,18 @@ onMount(() => { _bb.setContext("BBMD:list:props", { singleSelection: true }) + _bb.setContext("BBMD:list:addItem", i => listItems = [...listItems, i]) - const setValue = v => { - _bb.setStateFromBinding(_bb.props.value, v) - value = v - } selectedItemsStore = createItemsStore(() => { - if($selectedItemsStore && $selectedItemsStore.length > 0) - setValue($selectedItemsStore[0].value) - else - setValue("") + const v = $selectedItemsStore && $selectedItemsStore.length > 0 + ? $selectedItemsStore[0].value + : ""; + + value = v + _bb.setStateFromBinding(_bb.props.value, v) + _bb.call(onSelect, v) - _bb.call(onSelect, $selectedItemsStore) }) _bb.setContext("BBMD:list:selectItemStore", selectedItemsStore) @@ -59,15 +58,19 @@ } }) + $: useNotchedOutline = variant === "outlined" $: selectList && _bb.attachChildren(selectList) + $: modifiers = { variant, disabled, required, noLabel: !label } $: props = { modifiers } $: selectClass = cb.build({ props }) - $: if (value !== undefined && selectedItemsStore) { - selectedItemsStore.addSingleItem(value) + $: if (value !== undefined && instance && listItems.length > 0) { + instance.selectedIndex = listItems.findIndex(i => i.value === value) } + +