chore: format TS examples using Prettier

frontend/demo/component/accordion/accordion-summary.ts

@@ -62,11 +62,16 @@ export class Example extends LitElement {
           <vaadin-accordion-heading slot="summary">
             <vaadin-horizontal-layout theme="spacing">
               Customer details
-              ${this.customerComplete
-                ? html`
-                    <vaadin-icon icon="vaadin:check" style="--vaadin-icon-size: 1rem"></vaadin-icon>
-                  `
-                : nothing}
+              ${
+                this.customerComplete
+                  ? html`
+                      <vaadin-icon
+                        icon="vaadin:check"
+                        style="--vaadin-icon-size: 1rem"
+                      ></vaadin-icon>
+                    `
+                  : nothing
+              }
             </vaadin-horizontal-layout>
           </vaadin-accordion-heading>
           <!-- end::snippet[] -->
@@ -94,11 +99,16 @@ export class Example extends LitElement {
           <vaadin-accordion-heading slot="summary">
             <vaadin-horizontal-layout theme="spacing">
               Billing address
-              ${this.billingComplete
-                ? html`
-                    <vaadin-icon icon="vaadin:check" style="--vaadin-icon-size: 1rem"></vaadin-icon>
-                  `
-                : nothing}
+              ${
+                this.billingComplete
+                  ? html`
+                      <vaadin-icon
+                        icon="vaadin:check"
+                        style="--vaadin-icon-size: 1rem"
+                      ></vaadin-icon>
+                    `
+                  : nothing
+              }
             </vaadin-horizontal-layout>
           </vaadin-accordion-heading>
 
@@ -130,11 +140,16 @@ export class Example extends LitElement {
           <vaadin-accordion-heading slot="summary">
             <vaadin-horizontal-layout theme="spacing">
               Payment
-              ${this.paymentComplete
-                ? html`
-                    <vaadin-icon icon="vaadin:check" style="--vaadin-icon-size: 1rem"></vaadin-icon>
-                  `
-                : nothing}
+              ${
+                this.paymentComplete
+                  ? html`
+                      <vaadin-icon
+                        icon="vaadin:check"
+                        style="--vaadin-icon-size: 1rem"
+                      ></vaadin-icon>
+                    `
+                  : nothing
+              }
             </vaadin-horizontal-layout>
           </vaadin-accordion-heading>
 

frontend/demo/component/dashboard/dashboard-item-removal.ts

@@ -8,9 +8,7 @@ import type { DashboardItem, DashboardItemBeforeRemoveEvent } from '@vaadin/dash
 
 export class Example extends LitElement {
   @state()
-  items: DashboardItem[] = [
-    /* Item definitions */
-  ];
+  items: DashboardItem[] = [/* Item definitions */];
 
   @state()
   itemToRemove: DashboardItem | null = null;

frontend/demo/component/dashboard/react/dashboard-item-removal.tsx

@@ -5,9 +5,7 @@ import type { DashboardItem, DashboardItemBeforeRemoveEvent } from '@vaadin/reac
 import { Dashboard } from '@vaadin/react-components-pro';
 
 export function Example() {
-  const items = useSignal<DashboardItem[]>([
-    /* Item definitions */
-  ]);
+  const items = useSignal<DashboardItem[]>([/* Item definitions */]);
 
   const itemToRemove = useSignal<DashboardItem | null>(null);
 

frontend/demo/component/grid/grid-dynamic-height.ts

@@ -67,9 +67,11 @@ export class Example extends LitElement {
         </vaadin-button>
       </vaadin-horizontal-layout>
 
-      ${this.invitedPeople.length === 0
-        ? this.renderNoInvitationAlert()
-        : this.renderInvitedPeopleTable()}
+      ${
+        this.invitedPeople.length === 0
+          ? this.renderNoInvitationAlert()
+          : this.renderInvitedPeopleTable()
+      }
     `;
   }
 

frontend/demo/component/login/react/login-event.tsx

@@ -2,7 +2,10 @@ import { reactExample } from 'Frontend/demo/react-example'; // hidden-source-lin
 import React from 'react';
 import { useSignals } from '@preact/signals-react/runtime'; // hidden-source-line
 import { useSignal } from '@vaadin/hilla-react-signals';
-import { LoginForm, type LoginFormDisabledChangedEvent } from '@vaadin/react-components/LoginForm.js';
+import {
+  LoginForm,
+  type LoginFormDisabledChangedEvent,
+} from '@vaadin/react-components/LoginForm.js';
 import { loginHostStyles } from './login-host-styles';
 
 function Example() {

frontend/demo/component/multi-select-combo-box/multi-select-combo-box-collapse-chips.ts

@@ -29,7 +29,7 @@ export class Example extends LitElement {
 
   protected override async firstUpdated() {
     const countries = await getCountries();
-    this.items = countries
+    this.items = countries;
     this.selectedCountries = countries.slice(0, 3);
   }
 

frontend/demo/component/popover/popover-notification-panel.ts

@@ -97,9 +97,11 @@ export class Example extends LitElement {
           <vaadin-tab id="all-tab">All</vaadin-tab>
         </vaadin-tabs>
         <div tab="unread-tab">
-          ${unread.length
-            ? html`<vaadin-message-list .items="${unread}"></vaadin-message-list>`
-            : html`<div class="no-notifications-msg">No unread notifications</div>`}
+          ${
+            unread.length
+              ? html`<vaadin-message-list .items="${unread}"></vaadin-message-list>`
+              : html`<div class="no-notifications-msg">No unread notifications</div>`
+          }
         </div>
         <div tab="all-tab">
           <vaadin-message-list .items="${all}"></vaadin-message-list>

frontend/demo/component/popover/react/popover-notification-panel.tsx

@@ -76,9 +76,7 @@ function Example() {
             padding: 'var(--vaadin-padding-l) var(--vaadin-padding-l) var(--vaadin-padding-s)',
           }}
         >
-          <h4 id="notifications-heading">
-            Notifications
-          </h4>
+          <h4 id="notifications-heading">Notifications</h4>
           <Button
             slot="end"
             theme="small"

frontend/demo/component/select/select-presentation.ts

@@ -25,10 +25,7 @@ export class Example extends LitElement {
   protected override render() {
     return html`
       <!-- tag::snippet[] -->
-      <vaadin-select
-        label="Choose doctor"
-        style="width: 15em;"
-      >
+      <vaadin-select label="Choose doctor" style="width: 15em;">
         <vaadin-select-list-box slot="overlay">
           ${this.people.map(
             (person) => html`

frontend/demo/component/slider/react/range-slider-custom-validation.tsx

@@ -29,7 +29,7 @@ function Example() {
           invalid.value = true;
         } else {
           errorMessage.value = '';
-          invalid.value = false
+          invalid.value = false;
         }
       }}
     />

frontend/demo/component/tabs/tabsheet-lazy-initialization.ts

@@ -31,15 +31,21 @@ export class Example extends LitElement {
           <vaadin-tab id="shipping-tab">Shipping</vaadin-tab>
         </vaadin-tabs>
 
-        ${this.visitedTabs.has(0)
-          ? html`<div tab="dashboard-tab">This is the Dashboard tab content</div>`
-          : ''}
-        ${this.visitedTabs.has(1)
-          ? html`<div tab="payment-tab">This is the Payment tab content</div>`
-          : ''}
-        ${this.visitedTabs.has(2)
-          ? html`<div tab="shipping-tab">This is the Shipping tab content</div>`
-          : ''}
+        ${
+          this.visitedTabs.has(0)
+            ? html`<div tab="dashboard-tab">This is the Dashboard tab content</div>`
+            : ''
+        }
+        ${
+          this.visitedTabs.has(1)
+            ? html`<div tab="payment-tab">This is the Payment tab content</div>`
+            : ''
+        }
+        ${
+          this.visitedTabs.has(2)
+            ? html`<div tab="shipping-tab">This is the Shipping tab content</div>`
+            : ''
+        }
       </vaadin-tabsheet>
     `;
   }