Clicked: {clicked}{clicked === 69 ? ', nice' diff --git a/packages/site/src/routes/demo/dialog/_Mandatory.svelte b/packages/site/src/routes/demo/dialog/_Mandatory.svelte index b2e808f61..9600489d9 100644 --- a/packages/site/src/routes/demo/dialog/_Mandatory.svelte +++ b/packages/site/src/routes/demo/dialog/_Mandatory.svelte @@ -13,22 +13,22 @@ How old is Alice's brother now? - (response = 'Wrong answer. Thrown in the lake.')}> + (response = 'Wrong answer. Thrown in the lake.')}> Fifty - (response = 'You are correct. You may pass.')}> + (response = 'You are correct. You may pass.')}> Eighty-Seven - (response = 'Wrong answer. Thrown in the lake.')}> + (response = 'Wrong answer. Thrown in the lake.')}> Forty-Five - (response = 'Wrong answer. Thrown in the lake.')}> + (response = 'Wrong answer. Thrown in the lake.')}> Seventy-Five - (open = true)}> + (open = true)}> Open Dialog diff --git a/packages/site/src/routes/demo/dialog/_ManyActions.svelte b/packages/site/src/routes/demo/dialog/_ManyActions.svelte index 5819f1240..30318de93 100644 --- a/packages/site/src/routes/demo/dialog/_ManyActions.svelte +++ b/packages/site/src/routes/demo/dialog/_ManyActions.svelte @@ -3,7 +3,7 @@ aria-labelledby="buttons-title" aria-describedby="buttons-content" autoStackButtons={false} - on:SMUIDialog:closed={(e) => (buttoned = e.detail.action)} + onSMUIDialogClosed={(e) => (buttoned = e.detail.action)} > Use speed bost? @@ -24,7 +24,7 @@ - (open = true)}> + (open = true)}> Open Dialog diff --git a/packages/site/src/routes/demo/dialog/_OverFullscreen.svelte b/packages/site/src/routes/demo/dialog/_OverFullscreen.svelte index e7584995e..72d67a5d0 100644 --- a/packages/site/src/routes/demo/dialog/_OverFullscreen.svelte +++ b/packages/site/src/routes/demo/dialog/_OverFullscreen.svelte @@ -3,14 +3,14 @@ fullscreen aria-labelledby="over-fullscreen-title" aria-describedby="over-fullscreen-content" - on:SMUIDialog:closed={closeHandler} + onSMUIDialogClosed={closeHandler} > Terms and Conditions close - (subOpen = true)}> + (subOpen = true)}> Open Confirmation Dialog {#each Array(3) as _item} @@ -32,7 +32,7 @@ selection aria-labelledby="over-fullscreen-confirmation-title" aria-describedby="over-fullscreen-confirmation-content" - on:SMUIDialog:closed={confirmationCloseHandler} + onSMUIDialogClosed={confirmationCloseHandler} > Confirmation @@ -64,7 +64,7 @@ - (open = true)}> + (open = true)}> Open Dialog diff --git a/packages/site/src/routes/demo/dialog/_Selection.svelte b/packages/site/src/routes/demo/dialog/_Selection.svelte index d6760d6b3..72c6af946 100644 --- a/packages/site/src/routes/demo/dialog/_Selection.svelte +++ b/packages/site/src/routes/demo/dialog/_Selection.svelte @@ -3,7 +3,7 @@ selection aria-labelledby="list-selection-title" aria-describedby="list-selection-content" - on:SMUIDialog:closed={closeHandler} + onSMUIDialogClosed={closeHandler} > Dialog Title @@ -38,7 +38,7 @@ - (open = true)}> + (open = true)}> Open Dialog diff --git a/packages/site/src/routes/demo/dialog/_Sheet.svelte b/packages/site/src/routes/demo/dialog/_Sheet.svelte index 33db17e49..cbd22e791 100644 --- a/packages/site/src/routes/demo/dialog/_Sheet.svelte +++ b/packages/site/src/routes/demo/dialog/_Sheet.svelte @@ -17,11 +17,11 @@ - (open = true)}> + (open = true)}> Open Dialog - (openNoPadding = true)}> + (openNoPadding = true)}> Open No Padding Dialog diff --git a/packages/site/src/routes/demo/dialog/_Simple.svelte b/packages/site/src/routes/demo/dialog/_Simple.svelte index ada14d599..b88098d26 100644 --- a/packages/site/src/routes/demo/dialog/_Simple.svelte +++ b/packages/site/src/routes/demo/dialog/_Simple.svelte @@ -7,16 +7,16 @@ Dialog Title Super awesome dialog body text? - (clicked = 'No')}> + (clicked = 'No')}> No - (clicked = 'Yes')}> + (clicked = 'Yes')}> Yes - (open = true)}> + (open = true)}> Open Dialog diff --git a/packages/site/src/routes/demo/dialog/_Sliders.svelte b/packages/site/src/routes/demo/dialog/_Sliders.svelte index b3799adeb..567d9583a 100644 --- a/packages/site/src/routes/demo/dialog/_Sliders.svelte +++ b/packages/site/src/routes/demo/dialog/_Sliders.svelte @@ -35,7 +35,7 @@ - (open = true)}> + (open = true)}> Open Dialog diff --git a/packages/site/src/routes/demo/drawer/_Dismissible.svelte b/packages/site/src/routes/demo/drawer/_Dismissible.svelte index 379b3afa0..e72f8cfa4 100644 --- a/packages/site/src/routes/demo/drawer/_Dismissible.svelte +++ b/packages/site/src/routes/demo/drawer/_Dismissible.svelte @@ -8,35 +8,35 @@ setActive('Gray Kittens')} + onclick={() => setActive('Gray Kittens')} activated={active === 'Gray Kittens'} > Gray Kittens setActive('A Space Rocket')} + onclick={() => setActive('A Space Rocket')} activated={active === 'A Space Rocket'} > A Space Rocket setActive('100 Pounds of Gravel')} + onclick={() => setActive('100 Pounds of Gravel')} activated={active === '100 Pounds of Gravel'} > 100 Pounds of Gravel setActive('All of the Shrimp')} + onclick={() => setActive('All of the Shrimp')} activated={active === 'All of the Shrimp'} > All of the Shrimp setActive('A Planet with a Mall')} + onclick={() => setActive('A Planet with a Mall')} activated={active === 'A Planet with a Mall'} > A Planet with a Mall @@ -47,7 +47,7 @@ - (open = !open)} + (open = !open)} >Toggle Drawer diff --git a/packages/site/src/routes/demo/drawer/_Modal.svelte b/packages/site/src/routes/demo/drawer/_Modal.svelte index 4177b7a88..a5de586d1 100644 --- a/packages/site/src/routes/demo/drawer/_Modal.svelte +++ b/packages/site/src/routes/demo/drawer/_Modal.svelte @@ -10,7 +10,7 @@ setActive('Inbox')} + onclick={() => setActive('Inbox')} activated={active === 'Inbox'} > inbox @@ -18,7 +18,7 @@ setActive('Star')} + onclick={() => setActive('Star')} activated={active === 'Star'} > star @@ -26,7 +26,7 @@ setActive('Sent Mail')} + onclick={() => setActive('Sent Mail')} activated={active === 'Sent Mail'} > send @@ -34,7 +34,7 @@ setActive('Drafts')} + onclick={() => setActive('Drafts')} activated={active === 'Drafts'} > drafts @@ -45,7 +45,7 @@ Labels setActive('Family')} + onclick={() => setActive('Family')} activated={active === 'Family'} > bookmark @@ -53,7 +53,7 @@ setActive('Friends')} + onclick={() => setActive('Friends')} activated={active === 'Friends'} > bookmark @@ -61,7 +61,7 @@ setActive('Work')} + onclick={() => setActive('Work')} activated={active === 'Work'} > bookmark @@ -76,7 +76,7 @@ - (open = !open)}> + (open = !open)}> Toggle Drawer diff --git a/packages/site/src/routes/demo/drawer/_Permanent.svelte b/packages/site/src/routes/demo/drawer/_Permanent.svelte index bfe9ba36b..b311b3016 100644 --- a/packages/site/src/routes/demo/drawer/_Permanent.svelte +++ b/packages/site/src/routes/demo/drawer/_Permanent.svelte @@ -4,31 +4,31 @@ (clicked = 'Gray Kittens')} + onclick={() => (clicked = 'Gray Kittens')} > Gray Kittens (clicked = 'A Space Rocket')} + onclick={() => (clicked = 'A Space Rocket')} > A Space Rocket (clicked = '100 Pounds of Gravel')} + onclick={() => (clicked = '100 Pounds of Gravel')} > 100 Pounds of Gravel (clicked = 'All of the Shrimp')} + onclick={() => (clicked = 'All of the Shrimp')} > All of the Shrimp (clicked = 'A Planet with a Mall')} + onclick={() => (clicked = 'A Planet with a Mall')} > A Planet with a Mall diff --git a/packages/site/src/routes/demo/fab/_Exited.svelte b/packages/site/src/routes/demo/fab/_Exited.svelte index 8ac24ab8f..5b113fe96 100644 --- a/packages/site/src/routes/demo/fab/_Exited.svelte +++ b/packages/site/src/routes/demo/fab/_Exited.svelte @@ -1,6 +1,6 @@ - clicked++} {exited}> + clicked++} {exited}> favorite @@ -14,7 +14,7 @@ - clicked++} exited={exitedPrimary}> + clicked++} exited={exitedPrimary}> favorite diff --git a/packages/site/src/routes/demo/fab/_Extended.svelte b/packages/site/src/routes/demo/fab/_Extended.svelte index 9e1e4673a..74ce73e37 100644 --- a/packages/site/src/routes/demo/fab/_Extended.svelte +++ b/packages/site/src/routes/demo/fab/_Extended.svelte @@ -1,23 +1,23 @@ - clicked++} extended> + clicked++} extended> favorite Extended - clicked++} extended> + clicked++} extended> favorite Extended - clicked++} extended> + clicked++} extended> Extended W/o Icon - clicked++} extended> + clicked++} extended> Extended W/o Icon diff --git a/packages/site/src/routes/demo/fab/_Link.svelte b/packages/site/src/routes/demo/fab/_Link.svelte index 76f43d5c7..18cd9be1a 100644 --- a/packages/site/src/routes/demo/fab/_Link.svelte +++ b/packages/site/src/routes/demo/fab/_Link.svelte @@ -1,13 +1,13 @@ - clicked++} href="http://example.com" target="_blank"> + clicked++} href="http://example.com" target="_blank"> favorite clicked++} + onclick={() => clicked++} href="http://example.com" target="_blank" > @@ -16,7 +16,7 @@ clicked++} + onclick={() => clicked++} href="http://example.com" target="_blank" extended @@ -27,7 +27,7 @@ clicked++} + onclick={() => clicked++} href="http://example.com" target="_blank" extended diff --git a/packages/site/src/routes/demo/fab/_Mini.svelte b/packages/site/src/routes/demo/fab/_Mini.svelte index a95e10864..713beb191 100644 --- a/packages/site/src/routes/demo/fab/_Mini.svelte +++ b/packages/site/src/routes/demo/fab/_Mini.svelte @@ -1,11 +1,11 @@ - clicked++} mini> + clicked++} mini> favorite - clicked++} mini> + clicked++} mini> favorite diff --git a/packages/site/src/routes/demo/fab/_NoRipple.svelte b/packages/site/src/routes/demo/fab/_NoRipple.svelte index 2b9423e6b..c44200a29 100644 --- a/packages/site/src/routes/demo/fab/_NoRipple.svelte +++ b/packages/site/src/routes/demo/fab/_NoRipple.svelte @@ -1,22 +1,22 @@ - clicked++} ripple={false}> + clicked++} ripple={false}> favorite - clicked++} ripple={false}> + clicked++} ripple={false}> favorite - clicked++} extended ripple={false}> + clicked++} extended ripple={false}> favorite Extended - clicked++} extended ripple={false}> + clicked++} extended ripple={false}> favorite Extended diff --git a/packages/site/src/routes/demo/fab/_PrimaryColor.svelte b/packages/site/src/routes/demo/fab/_PrimaryColor.svelte index d2bc0cf01..adbd539a2 100644 --- a/packages/site/src/routes/demo/fab/_PrimaryColor.svelte +++ b/packages/site/src/routes/demo/fab/_PrimaryColor.svelte @@ -1,6 +1,6 @@ - clicked++}> + clicked++}> favorite diff --git a/packages/site/src/routes/demo/fab/_Simple.svelte b/packages/site/src/routes/demo/fab/_Simple.svelte index 3016dca62..efdb3f159 100644 --- a/packages/site/src/routes/demo/fab/_Simple.svelte +++ b/packages/site/src/routes/demo/fab/_Simple.svelte @@ -1,6 +1,6 @@ - clicked++}> + clicked++}> favorite diff --git a/packages/site/src/routes/demo/fab/_Svg.svelte b/packages/site/src/routes/demo/fab/_Svg.svelte index 405496667..502a4e48e 100644 --- a/packages/site/src/routes/demo/fab/_Svg.svelte +++ b/packages/site/src/routes/demo/fab/_Svg.svelte @@ -5,7 +5,7 @@ viewBox="0 0 24 24" because the mdiPlus icon is particularly small. This embiggens it. --> - clicked++}> + clicked++}> diff --git a/packages/site/src/routes/demo/icon-button/_Simple.svelte b/packages/site/src/routes/demo/icon-button/_Simple.svelte index 2421d771b..28cf97944 100644 --- a/packages/site/src/routes/demo/icon-button/_Simple.svelte +++ b/packages/site/src/routes/demo/icon-button/_Simple.svelte @@ -1,15 +1,14 @@ - clicked++} - >build clicked++}>build - clicked++} disabled + clicked++} disabled >search (disabled) - clicked++} ripple={false} + clicked++} ripple={false} >add_shopping_cart (no ripple) diff --git a/packages/site/src/routes/demo/icon-button/_Sizes.svelte b/packages/site/src/routes/demo/icon-button/_Sizes.svelte index 2f6bc6abb..039fdf2de 100644 --- a/packages/site/src/routes/demo/icon-button/_Sizes.svelte +++ b/packages/site/src/routes/demo/icon-button/_Sizes.svelte @@ -1,19 +1,19 @@ - clicked++} size="normal"> + clicked++} size="normal"> (normal = standard icon button size) - clicked++} size="mini"> + clicked++} size="mini"> (mini = same size as mini FAB) - clicked++} size="button"> + clicked++} size="button"> diff --git a/packages/site/src/routes/demo/icon-button/_Svgs.svelte b/packages/site/src/routes/demo/icon-button/_Svgs.svelte index e5e4495dd..3d39917a3 100644 --- a/packages/site/src/routes/demo/icon-button/_Svgs.svelte +++ b/packages/site/src/routes/demo/icon-button/_Svgs.svelte @@ -1,19 +1,19 @@ - clicked++}> + clicked++}> - clicked++} disabled> + clicked++} disabled> (disabled) - clicked++} ripple={false}> + clicked++} ripple={false}> diff --git a/packages/site/src/routes/demo/icon-button/_Toggle.svelte b/packages/site/src/routes/demo/icon-button/_Toggle.svelte index 9586136e7..03630ee22 100644 --- a/packages/site/src/routes/demo/icon-button/_Toggle.svelte +++ b/packages/site/src/routes/demo/icon-button/_Toggle.svelte @@ -1,11 +1,11 @@ - toggleClicked++} toggle bind:pressed={initialOff}> + toggleClicked++} toggle bind:pressed={initialOff}> star star_border - toggleClicked++} toggle bind:pressed={initialOn}> + toggleClicked++} toggle bind:pressed={initialOn}> alarm_on alarm_off @@ -13,15 +13,17 @@ - (initialOn = !initialOn)}> + (initialOn = !initialOn)}> Toggle Programmatically toggleClicked++} - on:click={() => (usingEvents = !usingEvents)} + onclick={() => { + toggleClicked++; + usingEvents = !usingEvents; + }} pressed={usingEvents} > bookmark diff --git a/packages/site/src/routes/demo/icon-button/_Touch.svelte b/packages/site/src/routes/demo/icon-button/_Touch.svelte index 376462f5b..26df2bcd2 100644 --- a/packages/site/src/routes/demo/icon-button/_Touch.svelte +++ b/packages/site/src/routes/demo/icon-button/_Touch.svelte @@ -1,4 +1,4 @@ - clicked++} touch + clicked++} touch >build diff --git a/packages/site/src/routes/demo/linear-progress/_Simple.svelte b/packages/site/src/routes/demo/linear-progress/_Simple.svelte index 2e9fdff78..7f527f604 100644 --- a/packages/site/src/routes/demo/linear-progress/_Simple.svelte +++ b/packages/site/src/routes/demo/linear-progress/_Simple.svelte @@ -2,7 +2,7 @@ -Reset +Reset diff --git a/packages/site/src/routes/demo/list/_Check.svelte b/packages/site/src/routes/demo/list/_Check.svelte index fea2c391c..4b9810cb8 100644 --- a/packages/site/src/routes/demo/list/_Check.svelte +++ b/packages/site/src/routes/demo/list/_Check.svelte @@ -2,7 +2,7 @@ (changeEvent = event)} + onSMUIListSelectionChange={(event) => (changeEvent = event)} > Bruce Willis diff --git a/packages/site/src/routes/demo/list/_GraphicsDense.svelte b/packages/site/src/routes/demo/list/_GraphicsDense.svelte index 9d1154603..7abf5b3cf 100644 --- a/packages/site/src/routes/demo/list/_GraphicsDense.svelte +++ b/packages/site/src/routes/demo/list/_GraphicsDense.svelte @@ -1,19 +1,19 @@ - (clicked = 'Edit')}> + (clicked = 'Edit')}> edit Edit - (clicked = 'Send')}> + (clicked = 'Send')}> send Send - (clicked = 'Archive')}> + (clicked = 'Archive')}> archive Archive - (clicked = 'Delete')}> + (clicked = 'Delete')}> clear Delete diff --git a/packages/site/src/routes/demo/list/_Groups.svelte b/packages/site/src/routes/demo/list/_Groups.svelte index 6ca9bf5e0..cdddac982 100644 --- a/packages/site/src/routes/demo/list/_Groups.svelte +++ b/packages/site/src/routes/demo/list/_Groups.svelte @@ -2,39 +2,37 @@ Actors - (clicked = 'Bruce Willis')}> + (clicked = 'Bruce Willis')}> Bruce Willis - (clicked = 'Tom Hanks')}> + (clicked = 'Tom Hanks')}> Tom Hanks - (clicked = 'Jack Nicholson')}> + (clicked = 'Jack Nicholson')}> Jack Nicholson - (clicked = 'Leonardo DiCaprio')}> + (clicked = 'Leonardo DiCaprio')}> Leonardo DiCaprio - (clicked = 'Matt Damon')}> + (clicked = 'Matt Damon')}> Matt Damon Books - (clicked = 'To Kill a Mockingbird')}> + (clicked = 'To Kill a Mockingbird')}> To Kill a Mockingbird - (clicked = 'The Great Gatsby')}> + (clicked = 'The Great Gatsby')}> The Great Gatsby - (clicked = '1984')}> + (clicked = '1984')}> 1984 - (clicked = 'Catch-22')}> + (clicked = 'Catch-22')}> Catch-22 - (clicked = "Alice's Adventures in Wonderland")} - > + (clicked = "Alice's Adventures in Wonderland")}> Alice's Adventures in Wonderland diff --git a/packages/site/src/routes/demo/list/_MultiLevel.svelte b/packages/site/src/routes/demo/list/_MultiLevel.svelte index 6d4691203..107a0a502 100644 --- a/packages/site/src/routes/demo/list/_MultiLevel.svelte +++ b/packages/site/src/routes/demo/list/_MultiLevel.svelte @@ -1,33 +1,33 @@ - (clicked = 'Level 1 - 1')}> + (clicked = 'Level 1 - 1')}> Level 1 - 1 - (clicked = 'Level 1 - 2')}> + (clicked = 'Level 1 - 2')}> Level 1 - 2 - (clicked = 'Level 1 - 3')}> + (clicked = 'Level 1 - 3')}> Level 1 - 3 - (clicked = 'Level 2.1 - 1')}> + (clicked = 'Level 2.1 - 1')}> Level 2.1 - 1 - (clicked = 'Level 2.1 - 2')}> + (clicked = 'Level 2.1 - 2')}> Level 2.1 - 2 - (clicked = 'Level 1 - 4')}> + (clicked = 'Level 1 - 4')}> Level 1 - 4 - (clicked = 'Level 2.2 - 1')}> + (clicked = 'Level 2.2 - 1')}> Level 2.2 - 1 - (clicked = 'Level 2.2 - 2')}> + (clicked = 'Level 2.2 - 2')}> Level 2.2 - 2 diff --git a/packages/site/src/routes/demo/list/_Simple.svelte b/packages/site/src/routes/demo/list/_Simple.svelte index 9bd46e158..5ca54afa1 100644 --- a/packages/site/src/routes/demo/list/_Simple.svelte +++ b/packages/site/src/routes/demo/list/_Simple.svelte @@ -1,10 +1,10 @@ - (clicked = 'Cut')}>Cut - (clicked = 'Copy')}>Copy - (clicked = 'Paste')}>Paste + (clicked = 'Cut')}>Cut + (clicked = 'Copy')}>Copy + (clicked = 'Paste')}>Paste - (clicked = 'Delete')}>Delete + (clicked = 'Delete')}>Delete diff --git a/packages/site/src/routes/demo/list/_TwoLineSelection.svelte b/packages/site/src/routes/demo/list/_TwoLineSelection.svelte index 3c017ba8f..f313c4063 100644 --- a/packages/site/src/routes/demo/list/_TwoLineSelection.svelte +++ b/packages/site/src/routes/demo/list/_TwoLineSelection.svelte @@ -9,7 +9,7 @@ > {#each options as item, i} (selectionIndex = i)} + onSMUIAction={() => (selectionIndex = i)} disabled={item.disabled} selected={selectionIndex === i} > @@ -35,7 +35,7 @@ Programmatically select: {#each options as option, i} - (selectionIndex = i)}> + (selectionIndex = i)}> {option.name} {/each} @@ -44,7 +44,7 @@ Programmatically focus: {#each options as option, i} - list.focusItemAtIndex(i)}> + list.focusItemAtIndex(i)}> {option.name} {/each} diff --git a/packages/site/src/routes/demo/menu-surface/_Anchored.svelte b/packages/site/src/routes/demo/menu-surface/_Anchored.svelte index a9863ff16..5e73d3946 100644 --- a/packages/site/src/routes/demo/menu-surface/_Anchored.svelte +++ b/packages/site/src/routes/demo/menu-surface/_Anchored.svelte @@ -1,12 +1,12 @@ - surface.setOpen(true)}>Open Menu Surface + surface.setOpen(true)}>Open Menu Surface - surface.setOpen(false)}> + surface.setOpen(false)}> Submit diff --git a/packages/site/src/routes/demo/menu-surface/_ManualAnchor.svelte b/packages/site/src/routes/demo/menu-surface/_ManualAnchor.svelte index 99209bbad..b3f2fef7c 100644 --- a/packages/site/src/routes/demo/menu-surface/_ManualAnchor.svelte +++ b/packages/site/src/routes/demo/menu-surface/_ManualAnchor.svelte @@ -15,7 +15,7 @@ }} bind:this={anchor} > - surface.setOpen(true)}>Open Menu Surface + surface.setOpen(true)}>Open Menu Surface {#each Array(4) as _unused, i} diff --git a/packages/site/src/routes/demo/menu-surface/_Static.svelte b/packages/site/src/routes/demo/menu-surface/_Static.svelte index 16c4216e5..a00616d61 100644 --- a/packages/site/src/routes/demo/menu-surface/_Static.svelte +++ b/packages/site/src/routes/demo/menu-surface/_Static.svelte @@ -1,16 +1,16 @@ - (clicked = 'Cut')}> + (clicked = 'Cut')}> Cut - (clicked = 'Copy')}> + (clicked = 'Copy')}> Copy - (clicked = 'Paste')}> + (clicked = 'Paste')}> Paste - (clicked = 'Delete')}> + (clicked = 'Delete')}> Delete diff --git a/packages/site/src/routes/demo/menu/_Anchored.svelte b/packages/site/src/routes/demo/menu/_Anchored.svelte index b3fba1681..43f5b33f9 100644 --- a/packages/site/src/routes/demo/menu/_Anchored.svelte +++ b/packages/site/src/routes/demo/menu/_Anchored.svelte @@ -1,20 +1,20 @@ - menu.setOpen(true)}> + menu.setOpen(true)}> Open Menu - (clicked = 'Cut')}> + (clicked = 'Cut')}> Cut - (clicked = 'Copy')}> + (clicked = 'Copy')}> Copy - (clicked = 'Paste')}> + (clicked = 'Paste')}> Paste - (clicked = 'Delete')}> + (clicked = 'Delete')}> Delete diff --git a/packages/site/src/routes/demo/menu/_Portal.svelte b/packages/site/src/routes/demo/menu/_Portal.svelte index ce8fe7b61..b67ea9cb4 100644 --- a/packages/site/src/routes/demo/menu/_Portal.svelte +++ b/packages/site/src/routes/demo/menu/_Portal.svelte @@ -5,21 +5,18 @@ --> - menu.setOpen(true)}> + menu.setOpen(true)}> Open Menu - subMenu.setOpen(false)} - > + subMenu.setOpen(false)}> - (clicked = 'Cut')}> + (clicked = 'Cut')}> Cut - (clicked = 'Copy')}> + (clicked = 'Copy')}> Copy - (clicked = 'Paste')}> + (clicked = 'Paste')}> Paste @@ -70,7 +67,7 @@ > { + onSMUIAction={() => { clicked = 'Move'; menu.setOpen(false); }} @@ -79,7 +76,7 @@ { + onSMUIAction={() => { clicked = 'Delete'; menu.setOpen(false); }} diff --git a/packages/site/src/routes/demo/menu/_SelectionGroup.svelte b/packages/site/src/routes/demo/menu/_SelectionGroup.svelte index e16d33b60..85f83a487 100644 --- a/packages/site/src/routes/demo/menu/_SelectionGroup.svelte +++ b/packages/site/src/routes/demo/menu/_SelectionGroup.svelte @@ -1,5 +1,5 @@ - menu.setOpen(true)}> + menu.setOpen(true)}> Open Menu @@ -7,7 +7,7 @@ {#each ['Red', 'Green', 'Blue'] as item} (selected1 = item)} + onSMUIAction={() => (selected1 = item)} selected={selected1 === item} > @@ -21,7 +21,7 @@ {#each ['Small', 'Medium', 'Large'] as item} (selected2 = item)} + onSMUIAction={() => (selected2 = item)} selected={selected2 === item} > @@ -32,7 +32,7 @@ {/each} - (clicked = 'Save for Later')}> + (clicked = 'Save for Later')}> Save for Later diff --git a/packages/site/src/routes/demo/menu/_Static.svelte b/packages/site/src/routes/demo/menu/_Static.svelte index bdd2064bf..9024779ed 100644 --- a/packages/site/src/routes/demo/menu/_Static.svelte +++ b/packages/site/src/routes/demo/menu/_Static.svelte @@ -1,16 +1,16 @@ - (clicked = 'Cut')}> + (clicked = 'Cut')}> Cut - (clicked = 'Copy')}> + (clicked = 'Copy')}> Copy - (clicked = 'Paste')}> + (clicked = 'Paste')}> Paste - (clicked = 'Delete')}> + (clicked = 'Delete')}> Delete diff --git a/packages/site/src/routes/demo/menu/_TwoLineManunalAnchor.svelte b/packages/site/src/routes/demo/menu/_TwoLineManunalAnchor.svelte index 0194bcf17..aeea8028c 100644 --- a/packages/site/src/routes/demo/menu/_TwoLineManunalAnchor.svelte +++ b/packages/site/src/routes/demo/menu/_TwoLineManunalAnchor.svelte @@ -15,7 +15,7 @@ }} bind:this={anchor} > - menu.setOpen(true)}> + menu.setOpen(true)}> Open Menu - (clicked = 'Cut')}> + (clicked = 'Cut')}> Cut Copy to clipboard and remove. - (clicked = 'Copy')}> + (clicked = 'Copy')}> Copy Copy to clipboard. - (clicked = 'Paste')}> + (clicked = 'Paste')}> Paste Paste from clipboard. - (clicked = 'Delete')}> + (clicked = 'Delete')}> Delete Remove item. diff --git a/packages/site/src/routes/demo/quick-guide/+page.svelte b/packages/site/src/routes/demo/quick-guide/+page.svelte index 9a845ac16..4ead354db 100644 --- a/packages/site/src/routes/demo/quick-guide/+page.svelte +++ b/packages/site/src/routes/demo/quick-guide/+page.svelte @@ -26,8 +26,8 @@ > Events and Modifiers - SMUI supports listening to all events. You can also use modifiers - with the "$" syntax. + SMUI supports listening to all events. You can also add modifiers + from the @smui/common/events endpoint. diff --git a/packages/site/src/routes/demo/quick-guide/_EventsAndModifiers.svelte b/packages/site/src/routes/demo/quick-guide/_EventsAndModifiers.svelte index 3bd63e575..4ee0b9917 100644 --- a/packages/site/src/routes/demo/quick-guide/_EventsAndModifiers.svelte +++ b/packages/site/src/routes/demo/quick-guide/_EventsAndModifiers.svelte @@ -1,22 +1,22 @@ This Button has Event Listeners @@ -37,7 +37,7 @@ - + Capture and Bubble Phase Listeners @@ -60,29 +60,16 @@ - console.log("You tried to go, but didn't make it.")} + onclick={preventDefault(() => + console.log("You tried to go, but didn't make it."), + )} > A Link, with Default Prevented - - - - TypeScript event types can be tricky with SMUI components. This example shows - you how to get them right. - - - - - Correct Event Type - - - -Mouse Button: {button} -
Mouse Button: {button}