Menu: fix typo slot => slotProps
This will have caused class as a function to not work correctly for Menu
This commit is contained in:
@@ -58,6 +58,7 @@
|
||||
export let use: HTMLActionArray = [];
|
||||
export let as: SupportedAs = "div";
|
||||
const forwardEvents = forwardEventsBuilder(get_current_component());
|
||||
|
||||
let menuState: StateDefinition["menuState"] = MenuStates.Closed;
|
||||
let buttonStore: StateDefinition["buttonStore"] = writable(null);
|
||||
let itemsStore: StateDefinition["itemsStore"] = writable(null);
|
||||
@@ -163,7 +164,7 @@
|
||||
[MenuStates.Closed]: State.Closed,
|
||||
});
|
||||
|
||||
$: slot = { open: menuState === MenuStates.Open };
|
||||
$: slotProps = { open: menuState === MenuStates.Open };
|
||||
</script>
|
||||
|
||||
<svelte:window on:mousedown={handleWindowMousedown} />
|
||||
@@ -171,8 +172,8 @@
|
||||
{...$$restProps}
|
||||
use={[...use, forwardEvents]}
|
||||
{as}
|
||||
{slot}
|
||||
{slotProps}
|
||||
name={"Menu"}
|
||||
>
|
||||
<slot {...slot} />
|
||||
<slot {...slotProps} />
|
||||
</Render>
|
||||
|
||||
13
src/lib/components/menu/menu.test.ts
vendored
13
src/lib/components/menu/menu.test.ts
vendored
@@ -337,9 +337,9 @@ describe('Rendering composition', () => {
|
||||
render(
|
||||
TestRenderer, {
|
||||
allProps: [
|
||||
[Menu, {}, [
|
||||
[MenuButton, {}, "Trigger"],
|
||||
[MenuItems, {}, [
|
||||
[Menu, { class: (bag: any) => JSON.stringify(bag), id: "menu" }, [
|
||||
[MenuButton, { class: (bag: any) => JSON.stringify(bag) }, "Trigger"],
|
||||
[MenuItems, { class: (bag: any) => JSON.stringify(bag) }, [
|
||||
[MenuItem, { as: "a", class: (bag: any) => JSON.stringify(bag) }, "Item A"],
|
||||
[MenuItem, { as: "a", disabled: true, class: (bag: any) => JSON.stringify(bag) }, "Item B"],
|
||||
[MenuItem, { as: "a", class: "no-special-treatment" }, "Item C"],
|
||||
@@ -354,12 +354,19 @@ describe('Rendering composition', () => {
|
||||
})
|
||||
assertMenu({ state: MenuState.InvisibleUnmounted })
|
||||
|
||||
// Verify correct classNames
|
||||
expect("" + document.querySelector('[id="menu"]')?.classList).toEqual(JSON.stringify({ open: false }))
|
||||
expect("" + getMenuButton()?.classList).toEqual(JSON.stringify({ open: false }))
|
||||
|
||||
// Open menu
|
||||
await click(getMenuButton())
|
||||
|
||||
let items = getMenuItems()
|
||||
|
||||
// Verify correct classNames
|
||||
expect("" + document.querySelector('[id="menu"]')?.classList).toEqual(JSON.stringify({ open: true }))
|
||||
expect("" + getMenu()?.classList).toEqual(JSON.stringify({ open: true }))
|
||||
expect("" + getMenuButton()?.classList).toEqual(JSON.stringify({ open: true }))
|
||||
expect('' + items[0].classList).toEqual(JSON.stringify({ active: false, disabled: false }))
|
||||
expect('' + items[1].classList).toEqual(JSON.stringify({ active: false, disabled: true }))
|
||||
expect('' + items[2].classList).toEqual('no-special-treatment')
|
||||
|
||||
Reference in New Issue
Block a user