chore: format files with Prettier 3

docs/src/pages/framed/TreeView/TreeView.svelte

@@ -47,12 +47,12 @@
 
 <TreeView
   labelText="Cloud Products"
-  nodes="{nodes}"
+  {nodes}
   bind:activeId
   bind:selectedIds
-  on:select="{({ detail }) => console.log('select', detail)}"
-  on:toggle="{({ detail }) => console.log('toggle', detail)}"
-  on:focus="{({ detail }) => console.log('focus', detail)}"
+  on:select={({ detail }) => console.log("select", detail)}
+  on:toggle={({ detail }) => console.log("toggle", detail)}
+  on:focus={({ detail }) => console.log("focus", detail)}
 />
 
 <div>Active node id: {activeId}</div>

docs/src/pages/framed/TreeView/TreeViewActive.svelte

@@ -47,12 +47,12 @@
 
 <TreeView
   labelText="Cloud Products"
-  nodes="{nodes}"
+  {nodes}
   bind:activeId
   bind:selectedIds
-  on:select="{({ detail }) => console.log('select', detail)}"
-  on:toggle="{({ detail }) => console.log('toggle', detail)}"
-  on:focus="{({ detail }) => console.log('focus', detail)}"
+  on:select={({ detail }) => console.log("select", detail)}
+  on:toggle={({ detail }) => console.log("toggle", detail)}
+  on:focus={({ detail }) => console.log("focus", detail)}
 />
 
 <div>Active node id: {activeId}</div>

docs/src/pages/framed/TreeView/TreeViewCollapseAll.svelte

@@ -46,14 +46,14 @@
 </script>
 
 <div>
-  <Button on:click="{treeview?.collapseAll}">Collapse all</Button>
+  <Button on:click={treeview?.collapseAll}>Collapse all</Button>
 </div>
 
 <TreeView
-  bind:this="{treeview}"
+  bind:this={treeview}
   bind:expandedIds
   labelText="Cloud Products"
-  nodes="{nodes}"
+  {nodes}
 />
 
 <style>

docs/src/pages/framed/TreeView/TreeViewCollapseNodes.svelte

@@ -49,19 +49,19 @@
 
 <div>
   <Button
-    on:click="{() => {
+    on:click={() => {
       treeview?.collapseNodes((node) => node.disabled);
-    }}"
+    }}
   >
     Collapse disabled nodes
   </Button>
 </div>
 
 <TreeView
-  bind:this="{treeview}"
+  bind:this={treeview}
   bind:expandedIds
   labelText="Cloud Products"
-  nodes="{nodes}"
+  {nodes}
 />
 
 <style>

docs/src/pages/framed/TreeView/TreeViewCompact.svelte

@@ -48,12 +48,12 @@
 <TreeView
   size="compact"
   labelText="Cloud Products"
-  nodes="{nodes}"
+  {nodes}
   bind:activeId
   bind:selectedIds
-  on:select="{({ detail }) => console.log('select', detail)}"
-  on:toggle="{({ detail }) => console.log('toggle', detail)}"
-  on:focus="{({ detail }) => console.log('focus', detail)}"
+  on:select={({ detail }) => console.log("select", detail)}
+  on:toggle={({ detail }) => console.log("toggle", detail)}
+  on:focus={({ detail }) => console.log("focus", detail)}
 />
 
 <div>Active node id: {activeId}</div>

docs/src/pages/framed/TreeView/TreeViewExpandAll.svelte

@@ -45,14 +45,10 @@
 </script>
 
 <div>
-  <Button on:click="{treeview?.expandAll}">Expand all</Button>
+  <Button on:click={treeview?.expandAll}>Expand all</Button>
 </div>
 
-<TreeView
-  bind:this="{treeview}"
-  labelText="Cloud Products"
-  nodes="{nodes}"
-/>
+<TreeView bind:this={treeview} labelText="Cloud Products" {nodes} />
 
 <style>
   div {

docs/src/pages/framed/TreeView/TreeViewExpandNodes.svelte

@@ -46,19 +46,15 @@
 
 <div>
   <Button
-    on:click="{() => {
+    on:click={() => {
       treeview?.expandNodes((node) => /^IBM/.test(node.text));
-    }}"
+    }}
   >
     Expand nodes starting with "IBM"
   </Button>
 </div>
 
-<TreeView
-  bind:this="{treeview}"
-  labelText="Cloud Products"
-  nodes="{nodes}"
-/>
+<TreeView bind:this={treeview} labelText="Cloud Products" {nodes} />
 
 <style>
   div {

docs/src/pages/framed/TreeView/TreeViewExpanded.svelte

@@ -48,13 +48,13 @@
 
 <TreeView
   labelText="Cloud Products"
-  nodes="{nodes}"
+  {nodes}
   bind:activeId
   bind:selectedIds
   bind:expandedIds
-  on:select="{({ detail }) => console.log('select', detail)}"
-  on:toggle="{({ detail }) => console.log('toggle', detail)}"
-  on:focus="{({ detail }) => console.log('focus', detail)}"
+  on:select={({ detail }) => console.log("select", detail)}
+  on:toggle={({ detail }) => console.log("toggle", detail)}
+  on:focus={({ detail }) => console.log("focus", detail)}
 />
 
 <div>Active node id: {activeId}</div>

docs/src/pages/framed/TreeView/TreeViewIcons.svelte

@@ -76,12 +76,12 @@
 
 <TreeView
   labelText="Cloud Products"
-  nodes="{nodes}"
+  {nodes}
   bind:activeId
   bind:selectedIds
-  on:select="{({ detail }) => console.log('select', detail)}"
-  on:toggle="{({ detail }) => console.log('toggle', detail)}"
-  on:focus="{({ detail }) => console.log('focus', detail)}"
+  on:select={({ detail }) => console.log("select", detail)}
+  on:toggle={({ detail }) => console.log("toggle", detail)}
+  on:focus={({ detail }) => console.log("focus", detail)}
 />
 
 <div>Active node id: {activeId}</div>

docs/src/pages/framed/TreeView/TreeViewMultiselect.svelte

@@ -47,12 +47,12 @@
 
 <TreeView
   labelText="Cloud Products"
-  nodes="{nodes}"
+  {nodes}
   bind:activeId
   bind:selectedIds
-  on:select="{({ detail }) => console.log('select', detail)}"
-  on:toggle="{({ detail }) => console.log('toggle', detail)}"
-  on:focus="{({ detail }) => console.log('focus', detail)}"
+  on:select={({ detail }) => console.log("select", detail)}
+  on:toggle={({ detail }) => console.log("toggle", detail)}
+  on:focus={({ detail }) => console.log("focus", detail)}
 />
 
 <div>Active node id: {activeId}</div>

docs/src/pages/framed/TreeView/TreeViewShowNode.svelte

@@ -31,19 +31,14 @@
 <ButtonSet style="margin-bottom: var(--cds-spacing-05)">
   {#each [nodeSpark, nodeBlockchain] as { id, text }}
     <Button
-      on:click="{() => {
+      on:click={() => {
         treeview?.showNode(id);
-      }}"
+      }}
     >
       Show "{text}"
     </Button>
   {/each}
-  <Button kind="tertiary" on:click="{treeview.collapseAll}">Collapse all</Button
-  >
+  <Button kind="tertiary" on:click={treeview.collapseAll}>Collapse all</Button>
 </ButtonSet>
 
-<TreeView
-  bind:this="{treeview}"
-  labelText="Cloud Products"
-  nodes="{nodes}"
-/>
+<TreeView bind:this={treeview} labelText="Cloud Products" {nodes} />

docs/src/pages/framed/TreeView/TreeViewSlot.svelte

@@ -45,16 +45,10 @@
   ];
 </script>
 
-<TreeView
-  labelText="Cloud Products"
-  activeId="{activeId}"
-  selectedIds="{selectedIds}"
-  nodes="{nodes}"
-  let:node
->
+<TreeView labelText="Cloud Products" {activeId} {selectedIds} {nodes} let:node>
   <span
-    style:color="{node.selected ? "var(--cds-interactive-04)" : "inherit"}"
-    style:text-decoration="{node.disabled ? "inherit" : "underline"}"
+    style:color={node.selected ? "var(--cds-interactive-04)" : "inherit"}
+    style:text-decoration={node.disabled ? "inherit" : "underline"}
   >
     {node.text} (id: {node.id})
   </span>