fix: shorten runes options and snippet renders

hperrin · hperrin · commit d1368a603351 · 2024-11-27T18:51:15.000-08:00
diff --git a/packages/badge/src/Badge.svelte b/packages/badge/src/Badge.svelte
@@ -1,4 +1,4 @@
-<svelte:options runes={true} />
+<svelte:options runes />
 
 <span
   bind:this={element}
@@ -14,7 +14,7 @@
   role="status"
   {...restProps}
 >
-  {#if children}{@render children()}{/if}
+  {@render children?.()}
 </span>
 
 <script lang="ts">
diff --git a/packages/bottom-app-bar/src/AutoAdjust.svelte b/packages/bottom-app-bar/src/AutoAdjust.svelte
@@ -1,4 +1,4 @@
-<svelte:options runes={true} />
+<svelte:options runes />
 
 <MyComponent
   {tag}
@@ -14,7 +14,7 @@
     .join(' ')}
   {...restProps}
 >
-  {#if children}{@render children()}{/if}
+  {@render children?.()}
 </MyComponent>
 
 <script lang="ts" generics="TagName extends SmuiEveryElement = 'main'">
diff --git a/packages/bottom-app-bar/src/BottomAppBar.svelte b/packages/bottom-app-bar/src/BottomAppBar.svelte
@@ -1,4 +1,4 @@
-<svelte:options runes={true} />
+<svelte:options runes />
 
 <svelte:window onscroll={handleTargetScroll} onresize={handleWindowResize} />
 
@@ -17,7 +17,7 @@
     .join(' ')}
   {...restProps}
 >
-  {#if children}{@render children()}{/if}
+  {@render children?.()}
 </div>
 
 <script lang="ts">
diff --git a/packages/bottom-app-bar/src/Section.svelte b/packages/bottom-app-bar/src/Section.svelte
@@ -1,4 +1,4 @@
-<svelte:options runes={true} />
+<svelte:options runes />
 
 <Paper
   bind:this={element}
@@ -11,8 +11,7 @@
   color={$color}
   variant="unelevated"
   square
-  {...restProps}
-  >{#if children}{@render children()}{/if}</Paper
+  {...restProps}>{@render children?.()}</Paper
 >
 
 <script lang="ts">
diff --git a/packages/button/src/Button.svelte b/packages/button/src/Button.svelte
@@ -1,4 +1,4 @@
-<svelte:options runes={true} />
+<svelte:options runes />
 
 <MyComponent
   {tag}
@@ -51,7 +51,7 @@
     restProps.onclick?.(e);
   }}
   ><div class="mdc-button__ripple"></div>
-  {#if children}{@render children()}{/if}{#if touch}<div
+  {@render children?.()}{#if touch}<div
       class="mdc-button__touch"
     ></div>{/if}</MyComponent
 >
diff --git a/packages/button/src/Group.svelte b/packages/button/src/Group.svelte
@@ -1,4 +1,4 @@
-<svelte:options runes={true} />
+<svelte:options runes />
 
 <div
   bind:this={element}
@@ -10,7 +10,7 @@
   })}
   {...restProps}
 >
-  {#if children}{@render children()}{/if}
+  {@render children?.()}
 </div>
 
 <script lang="ts">
diff --git a/packages/checkbox/src/Checkbox.svelte b/packages/checkbox/src/Checkbox.svelte
@@ -1,4 +1,4 @@
-<svelte:options runes={true} />
+<svelte:options runes />
 
 <div
   bind:this={element}
diff --git a/packages/common/src/CommonIcon.svelte b/packages/common/src/CommonIcon.svelte
@@ -1,4 +1,4 @@
-<svelte:options runes={true} />
+<svelte:options runes />
 
 <MyComponent
   {tag}
@@ -16,8 +16,7 @@
   })}
   aria-hidden="true"
   {...svg ? { focusable: 'false', tabindex: '-1' } : {}}
-  {...restProps}
-  >{#if children}{@render children()}{/if}</MyComponent
+  {...restProps}>{@render children?.()}</MyComponent
 >
 
 <script lang="ts" generics="TagName extends SmuiEveryElement = 'i'">
diff --git a/packages/common/src/CommonLabel.svelte b/packages/common/src/CommonLabel.svelte
@@ -1,4 +1,4 @@
-<svelte:options runes={true} />
+<svelte:options runes />
 
 <MyComponent
   {tag}
@@ -20,8 +20,7 @@
   })}
   {...context === 'snackbar' ? { 'aria-atomic': 'false' } : {}}
   {tabindex}
-  {...restProps}
-  >{#if children}{@render children()}{/if}</MyComponent
+  {...restProps}>{@render children?.()}</MyComponent
 >
 
 <script lang="ts" generics="TagName extends SmuiEveryElement = 'span'">
diff --git a/packages/common/src/ContextFragment.svelte b/packages/common/src/ContextFragment.svelte
@@ -1,6 +1,6 @@
-<svelte:options runes={true} />
+<svelte:options runes />
 
-{#if children}{@render children()}{/if}
+{@render children?.()}
 
 <script lang="ts">
   import type { Snippet } from 'svelte';
diff --git a/packages/common/src/SmuiElement.svelte b/packages/common/src/SmuiElement.svelte
@@ -1,8 +1,8 @@
-<svelte:options runes={true} />
+<svelte:options runes />
 
 {#if tag === 'svg'}
   <svg bind:this={element} use:useActions={use} {...restProps}
-    >{#if children}{@render children()}{/if}</svg
+    >{@render children?.()}</svg
   >
 {:else if selfClosing}
   <svelte:element
@@ -16,8 +16,7 @@
     this={tag}
     bind:this={element}
     use:useActions={use}
-    {...restProps}
-    >{#if children}{@render children()}{/if}</svelte:element
+    {...restProps}>{@render children?.()}</svelte:element
   >
 {/if}
 
diff --git a/packages/common/src/Svg.svelte b/packages/common/src/Svg.svelte
@@ -1,7 +1,7 @@
-<svelte:options runes={true} />
+<svelte:options runes />
 
 <svg bind:this={element} use:useActions={use} {...restProps}
-  >{#if children}{@render children()}{/if}</svg
+  >{@render children?.()}</svg
 >
 
 <script lang="ts">
diff --git a/packages/common/src/classadder/ClassAdder.svelte b/packages/common/src/classadder/ClassAdder.svelte
@@ -1,4 +1,4 @@
-<svelte:options runes={true} />
+<svelte:options runes />
 
 <MyComponent
   {tag}
@@ -10,8 +10,7 @@
     ...smuiClassMap,
   })}
   {...props}
-  {...restProps}
-  >{#if children}{@render children()}{/if}</MyComponent
+  {...restProps}>{@render children?.()}</MyComponent
 >
 
 <script lang="ts">
diff --git a/packages/drawer/src/Drawer.svelte b/packages/drawer/src/Drawer.svelte
@@ -1,4 +1,4 @@
-<svelte:options runes={true} />
+<svelte:options runes />
 
 <aside
   bind:this={element}
@@ -25,7 +25,7 @@
     restProps.ontransitionend?.(e);
   }}
 >
-  {#if children}{@render children()}{/if}
+  {@render children?.()}
 </aside>
 
 <script lang="ts">
diff --git a/packages/drawer/src/Scrim.svelte b/packages/drawer/src/Scrim.svelte
@@ -1,4 +1,4 @@
-<svelte:options runes={true} />
+<svelte:options runes />
 
 <MyComponent
   {tag}
@@ -15,7 +15,7 @@
     restProps.onclick?.(e);
   }}
 >
-  {#if children}{@render children()}{/if}
+  {@render children?.()}
 </MyComponent>
 
 <script lang="ts" generics="TagName extends SmuiEveryElement = 'div'">
diff --git a/packages/fab/src/Fab.svelte b/packages/fab/src/Fab.svelte
@@ -1,4 +1,4 @@
-<svelte:options runes={true} />
+<svelte:options runes />
 
 <MyComponent
   {tag}
@@ -36,7 +36,7 @@
   {...restProps}
   ><div class="mdc-fab__ripple"></div>
   {#if focusRing}<div class="mdc-fab__focus-ring"></div>{/if}
-  {#if children}{@render children()}{/if}{#if touch}<div
+  {@render children?.()}{#if touch}<div
       class="mdc-fab__touch"
     ></div>{/if}</MyComponent
 >
diff --git a/packages/form-field/src/FormField.svelte b/packages/form-field/src/FormField.svelte
@@ -1,4 +1,4 @@
-<svelte:options runes={true} />
+<svelte:options runes />
 
 <div
   bind:this={element}
@@ -11,13 +11,12 @@
   })}
   {...exclude(restProps, ['label$'])}
 >
-  {#if children}{@render children()}{/if}
+  {@render children?.()}
   <label
     bind:this={labelEl}
     use:useActions={label$use}
     for={inputId}
-    {...prefixFilter(restProps, 'label$')}
-    >{#if label}{@render label()}{/if}</label
+    {...prefixFilter(restProps, 'label$')}>{@render label?.()}</label
   >
 </div>
 
diff --git a/packages/icon-button/src/IconButton.svelte b/packages/icon-button/src/IconButton.svelte
@@ -1,4 +1,4 @@
-<svelte:options runes={true} />
+<svelte:options runes />
 
 <MyComponent
   {tag}
@@ -67,7 +67,7 @@
     restProps.onclick?.(e);
   }}
   ><div class="mdc-icon-button__ripple"></div>
-  {#if children}{@render children()}{/if}{#if touch}<div
+  {@render children?.()}{#if touch}<div
       class="mdc-icon-button__touch"
     ></div>{/if}</MyComponent
 >
diff --git a/packages/list/src/Graphic.svelte b/packages/list/src/Graphic.svelte
@@ -1,4 +1,4 @@
-<svelte:options runes={true} />
+<svelte:options runes />
 
 <span
   bind:this={element}
@@ -8,8 +8,7 @@
     'mdc-deprecated-list-item__graphic': true,
     'mdc-menu__selection-group-icon': menuSelectionGroup,
   })}
-  {...restProps}
-  >{#if children}{@render children()}{/if}</span
+  {...restProps}>{@render children?.()}</span
 >
 
 <script lang="ts">
diff --git a/packages/list/src/Item.svelte b/packages/list/src/Item.svelte
@@ -1,4 +1,4 @@
-<svelte:options runes={true} />
+<svelte:options runes />
 
 <MyComponent
   {tag}
@@ -61,7 +61,7 @@
     restProps.onkeydown?.(e);
   }}
   >{#if ripple}<span class="mdc-deprecated-list-item__ripple"
-    ></span>{/if}{#if children}{@render children()}{/if}</MyComponent
+    ></span>{/if}{@render children?.()}</MyComponent
 >
 
 <script context="module" lang="ts">
diff --git a/packages/list/src/Label.svelte b/packages/list/src/Label.svelte
@@ -1,4 +1,4 @@
-<svelte:options runes={true} />
+<svelte:options runes />
 
 <label
   bind:this={element}
@@ -8,8 +8,7 @@
     'mdc-deprecated-list-item__text': true,
   })}
   for={inputProps ? inputProps.id : undefined}
-  {...restProps}
-  >{#if children}{@render children()}{/if}</label
+  {...restProps}>{@render children?.()}</label
 >
 
 <script lang="ts">
diff --git a/packages/list/src/List.svelte b/packages/list/src/List.svelte
@@ -1,4 +1,4 @@
-<svelte:options runes={true} />
+<svelte:options runes />
 
 <MyComponent
   {tag}
@@ -43,7 +43,7 @@
     restProps.onSMUIAction?.(e);
   }}
 >
-  {#if children}{@render children()}{/if}
+  {@render children?.()}
 </MyComponent>
 
 <script lang="ts" generics="TagName extends SmuiEveryElement = 'ul'">
diff --git a/packages/list/src/Separator.svelte b/packages/list/src/Separator.svelte
@@ -1,4 +1,4 @@
-<svelte:options runes={true} />
+<svelte:options runes />
 
 <MyComponent
   {tag}
diff --git a/packages/menu-surface/src/MenuSurface.svelte b/packages/menu-surface/src/MenuSurface.svelte
@@ -1,4 +1,4 @@
-<svelte:options runes={true} />
+<svelte:options runes />
 
 <svelte:body onclickcapture={handleBodyClick} />
 
@@ -27,7 +27,7 @@
     restProps.onkeydown?.(e);
   }}
 >
-  {#if children}{@render children()}{/if}
+  {@render children?.()}
 </div>
 
 <script lang="ts">
diff --git a/packages/menu/src/Menu.svelte b/packages/menu/src/Menu.svelte
@@ -1,4 +1,4 @@
-<svelte:options runes={true} />
+<svelte:options runes />
 
 <MenuSurface
   bind:this={element}
@@ -27,8 +27,7 @@
       );
     }
     restProps.onSMUIListAction?.(e);
-  }}
-  >{#if children}{@render children()}{/if}</MenuSurface
+  }}>{@render children?.()}</MenuSurface
 >
 
 <script lang="ts">
diff --git a/packages/menu/src/SelectionGroup.svelte b/packages/menu/src/SelectionGroup.svelte
@@ -1,4 +1,4 @@
-<svelte:options runes={true} />
+<svelte:options runes />
 
 <li bind:this={element} use:useActions={use} {...exclude(restProps, ['list$'])}>
   <ul
@@ -9,7 +9,7 @@
     })}
     {...prefixFilter(restProps, 'list$')}
   >
-    {#if children}{@render children()}{/if}
+    {@render children?.()}
   </ul>
 </li>
 
diff --git a/packages/paper/src/Paper.svelte b/packages/paper/src/Paper.svelte
@@ -1,4 +1,4 @@
-<svelte:options runes={true} />
+<svelte:options runes />
 
 <div
   bind:this={element}
@@ -17,9 +17,7 @@
   })}
   {...restProps}
 >
-  {#if children}
-    {@render children()}
-  {/if}
+  {@render children?.()}
 </div>
 
 <script lang="ts">
diff --git a/packages/radio/src/Radio.svelte b/packages/radio/src/Radio.svelte
diff --git a/packages/site/src/routes/+layout.svelte b/packages/site/src/routes/+layout.svelte
diff --git a/packages/site/src/routes/demo/common/_ExcludeAndPrefixFilterComponent.svelte b/packages/site/src/routes/demo/common/_ExcludeAndPrefixFilterComponent.svelte
diff --git a/packages/site/src/routes/demo/common/_UseActionsComponent.svelte b/packages/site/src/routes/demo/common/_UseActionsComponent.svelte
diff --git a/packages/switch/src/Switch.svelte b/packages/switch/src/Switch.svelte
diff --git a/packages/top-app-bar/src/AutoAdjust.svelte b/packages/top-app-bar/src/AutoAdjust.svelte
diff --git a/packages/top-app-bar/src/Section.svelte b/packages/top-app-bar/src/Section.svelte
diff --git a/packages/top-app-bar/src/TopAppBar.svelte b/packages/top-app-bar/src/TopAppBar.svelte

Original file line number	Diff line number	Diff line change
`@@ -1,4 +1,4 @@`
`1`		`-<svelte:options runes={true} />`
	`1`	`+<svelte:options runes />`
`2`	`2`
`3`	`3`	`<div`
`4`	`4`	`bind:this={element}`