chore(deps-dev): upgrade prettier-plugin-svelte (#498)

tests/DataTable.test.svelte

@@ -73,13 +73,13 @@
 
 <DataTable headers="{headers}" rows="{rows}">
   <span slot="cell-header" let:header>
-    {#if header.key === 'port'}
+    {#if header.key === "port"}
       {header.value}
       (network)
     {:else}{header.value}{/if}
   </span>
   <span slot="cell" let:cell>
-    {#if cell.key === 'rule' && cell.value === 'Round robin'}
+    {#if cell.key === "rule" && cell.value === "Round robin"}
       <Link
         inline
         href="https://en.wikipedia.org/wiki/Round-robin_DNS"
@@ -156,8 +156,68 @@
   sortable
   title="Load balancers"
   description="Your organization's active load balancers."
-  headers="{[{ key: 'name', value: 'Name' }, { key: 'protocol', value: 'Protocol' }, { key: 'port', value: 'Port' }, { key: 'cost', value: 'Cost', display: (cost) => cost + ' €' }, { key: 'expireDate', value: 'Expire date', display: (date) => new Date(date).toLocaleString(), sort }]}"
-  rows="{[{ id: 'a', name: 'Load Balancer 3', protocol: 'HTTP', port: 3000, cost: 100, expireDate: '2020-10-21' }, { id: 'b', name: 'Load Balancer 1', protocol: 'HTTP', port: 443, cost: 200, expireDate: '2020-09-10' }, { id: 'c', name: 'Load Balancer 2', protocol: 'HTTP', port: 80, cost: 150, expireDate: '2020-11-24' }, { id: 'd', name: 'Load Balancer 6', protocol: 'HTTP', port: 3000, cost: 250, expireDate: '2020-12-01' }, { id: 'e', name: 'Load Balancer 4', protocol: 'HTTP', port: 443, cost: 550, expireDate: '2021-03-21' }, { id: 'f', name: 'Load Balancer 5', protocol: 'HTTP', port: 80, cost: 400, expireDate: '2020-11-14' }]}"
+  headers="{[
+    { key: 'name', value: 'Name' },
+    { key: 'protocol', value: 'Protocol' },
+    { key: 'port', value: 'Port' },
+    { key: 'cost', value: 'Cost', display: (cost) => cost + ' €' },
+    {
+      key: 'expireDate',
+      value: 'Expire date',
+      display: (date) => new Date(date).toLocaleString(),
+      sort,
+    },
+  ]}"
+  rows="{[
+    {
+      id: 'a',
+      name: 'Load Balancer 3',
+      protocol: 'HTTP',
+      port: 3000,
+      cost: 100,
+      expireDate: '2020-10-21',
+    },
+    {
+      id: 'b',
+      name: 'Load Balancer 1',
+      protocol: 'HTTP',
+      port: 443,
+      cost: 200,
+      expireDate: '2020-09-10',
+    },
+    {
+      id: 'c',
+      name: 'Load Balancer 2',
+      protocol: 'HTTP',
+      port: 80,
+      cost: 150,
+      expireDate: '2020-11-24',
+    },
+    {
+      id: 'd',
+      name: 'Load Balancer 6',
+      protocol: 'HTTP',
+      port: 3000,
+      cost: 250,
+      expireDate: '2020-12-01',
+    },
+    {
+      id: 'e',
+      name: 'Load Balancer 4',
+      protocol: 'HTTP',
+      port: 443,
+      cost: 550,
+      expireDate: '2021-03-21',
+    },
+    {
+      id: 'f',
+      name: 'Load Balancer 5',
+      protocol: 'HTTP',
+      port: 80,
+      cost: 400,
+      expireDate: '2020-11-14',
+    },
+  ]}"
 />
 
 <DataTable expandable headers="{headers}" rows="{rows}">
@@ -184,7 +244,12 @@
 />
 
 <DataTableSkeleton
-  headers="{[{ value: 'Name' }, { value: 'Protocol' }, { value: 'Port' }, { value: 'Rule' }]}"
+  headers="{[
+    { value: 'Name' },
+    { value: 'Protocol' },
+    { value: 'Port' },
+    { value: 'Rule' },
+  ]}"
   rows="{10}"
 />
 

tests/DataTableAppendColumns.test.svelte

@@ -20,7 +20,7 @@
 
 <DataTable sortable headers="{headers}" rows="{rows}">
   <span slot="cell" let:cell>
-    {#if cell.key === 'overflow'}
+    {#if cell.key === "overflow"}
       <OverflowMenu flipped>
         <OverflowMenuItem text="Restart" />
         <OverflowMenuItem

tests/Dropdown.test.svelte

@@ -5,7 +5,11 @@
 <Dropdown
   titleText="Contact"
   selectedIndex="{0}"
-  items="{[{ id: '0', text: 'Slack' }, { id: '1', text: 'Email' }, { id: '2', text: 'Fax' }]}"
+  items="{[
+    { id: '0', text: 'Slack' },
+    { id: '1', text: 'Email' },
+    { id: '2', text: 'Fax' },
+  ]}"
 />
 
 <Dropdown
@@ -14,42 +18,66 @@
   }}"
   titleText="Contact"
   selectedIndex="{0}"
-  items="{[{ id: '0', text: 'Slack' }, { id: '1', text: 'Email' }, { id: '2', text: 'Fax' }]}"
+  items="{[
+    { id: '0', text: 'Slack' },
+    { id: '1', text: 'Email' },
+    { id: '2', text: 'Fax' },
+  ]}"
 />
 
 <Dropdown
   light
   titleText="Contact"
   selectedIndex="{0}"
-  items="{[{ id: '0', text: 'Slack' }, { id: '1', text: 'Email' }, { id: '2', text: 'Fax' }]}"
+  items="{[
+    { id: '0', text: 'Slack' },
+    { id: '1', text: 'Email' },
+    { id: '2', text: 'Fax' },
+  ]}"
 />
 
 <Dropdown
   type="inline"
   titleText="Contact"
   selectedIndex="{0}"
-  items="{[{ id: '0', text: 'Slack' }, { id: '1', text: 'Email' }, { id: '2', text: 'Fax' }]}"
+  items="{[
+    { id: '0', text: 'Slack' },
+    { id: '1', text: 'Email' },
+    { id: '2', text: 'Fax' },
+  ]}"
 />
 
 <Dropdown
   size="xl"
   titleText="Contact"
   selectedIndex="{0}"
-  items="{[{ id: '0', text: 'Slack' }, { id: '1', text: 'Email' }, { id: '2', text: 'Fax' }]}"
+  items="{[
+    { id: '0', text: 'Slack' },
+    { id: '1', text: 'Email' },
+    { id: '2', text: 'Fax' },
+  ]}"
 />
 
 <Dropdown
   size="sm"
   titleText="Contact"
   selectedIndex="{0}"
-  items="{[{ id: '0', text: 'Slack' }, { id: '1', text: 'Email' }, { id: '2', text: 'Fax' }]}"
+  items="{[
+    { id: '0', text: 'Slack' },
+    { id: '1', text: 'Email' },
+    { id: '2', text: 'Fax' },
+  ]}"
 />
 
 <Dropdown
   disabled
   titleText="Contact"
   selectedIndex="{0}"
-  items="{[{ id: '0', text: 'Slack' }, { id: '1', text: 'Email' }, { id: '2', text: 'Fax' }]}"
+  items="{[
+    { id: '0', text: 'Slack' },
+    { id: '1', text: 'Email' },
+    { id: '2', text: 'Fax' },
+  ]}"
 />
 
 <DropdownSkeleton />

tests/FilterableComboBox.test.svelte

@@ -10,6 +10,10 @@
 <ComboBox
   titleText="Contact"
   placeholder="Select contact method"
-  items="{[{ id: '0', text: 'Slack' }, { id: '1', text: 'Email' }, { id: '2', text: 'Fax' }]}"
+  items="{[
+    { id: '0', text: 'Slack' },
+    { id: '1', text: 'Email' },
+    { id: '2', text: 'Fax' },
+  ]}"
   shouldFilterItem="{shouldFilterItem}"
 />

tests/HiddenCodeSnippet.test.svelte

@@ -6,12 +6,6 @@
   const code = Array.from({ length: 20 }, (_, i) => i + 1).join("\n");
 </script>
 
-<style>
-  .hidden {
-    display: none;
-  }
-</style>
-
 <ToggleSmall
   style="margin-bottom: var(--cds-spacing-05)"
   labelText="Show code snippets"
@@ -19,7 +13,8 @@
 />
 
 {#if toggled}
-  <h5>"Show more" will not render</h5><br />
+  <h5>"Show more" will not render</h5>
+  <br />
 {/if}
 <div class:hidden="{!toggled}">
   <CodeSnippet type="multi" code="{code}" />
@@ -27,8 +22,15 @@
 
 {#if toggled}
   <br /><br />
-  <h5>"Show more" will render</h5><br />
+  <h5>"Show more" will render</h5>
+  <br />
   <div class:hidden="{!toggled}">
     <CodeSnippet type="multi" code="{code}" />
   </div>
 {/if}
+
+<style>
+  .hidden {
+    display: none;
+  }
+</style>

tests/InlineLoadingUx.test.svelte

@@ -44,7 +44,7 @@
   >
     Cancel
   </Button>
-  {#if state !== 'dormant'}
+  {#if state !== "dormant"}
     <InlineLoading status="{state}" description="{descriptionMap[state]}" />
   {:else}
     <Button on:click="{() => (state = 'active')}">Submit</Button>

tests/MultiSelect.test.svelte

@@ -5,13 +5,21 @@
 <MultiSelect
   titleText="Contact"
   label="Select contact methods..."
-  items="{[{ id: '0', text: 'Slack' }, { id: '1', text: 'Email' }, { id: '2', text: 'Fax' }]}"
+  items="{[
+    { id: '0', text: 'Slack' },
+    { id: '1', text: 'Email' },
+    { id: '2', text: 'Fax' },
+  ]}"
 />
 
 <MultiSelect
   titleText="Contact"
   label="Select contact methods..."
-  items="{[{ id: '0', text: 'Slack' }, { id: '1', text: 'Email' }, { id: '2', text: 'Fax' }]}"
+  items="{[
+    { id: '0', text: 'Slack' },
+    { id: '1', text: 'Email' },
+    { id: '2', text: 'Fax' },
+  ]}"
   sortItem="{() => {}}"
 />
 
@@ -19,7 +27,11 @@
   selectedIds="{['0', '1']}"
   titleText="Contact"
   label="Select contact methods..."
-  items="{[{ id: '0', text: 'Slack' }, { id: '1', text: 'Email' }, { id: '2', text: 'Fax' }]}"
+  items="{[
+    { id: '0', text: 'Slack' },
+    { id: '1', text: 'Email' },
+    { id: '2', text: 'Fax' },
+  ]}"
 />
 
 <MultiSelect
@@ -28,7 +40,11 @@
   }}"
   titleText="Contact"
   label="Select contact methods..."
-  items="{[{ id: '0', text: 'Slack' }, { id: '1', text: 'Email' }, { id: '2', text: 'Fax' }]}"
+  items="{[
+    { id: '0', text: 'Slack' },
+    { id: '1', text: 'Email' },
+    { id: '2', text: 'Fax' },
+  ]}"
   sortItem="{() => {}}"
 />
 
@@ -36,33 +52,53 @@
   light
   titleText="Contact"
   label="Select contact methods..."
-  items="{[{ id: '0', text: 'Slack' }, { id: '1', text: 'Email' }, { id: '2', text: 'Fax' }]}"
+  items="{[
+    { id: '0', text: 'Slack' },
+    { id: '1', text: 'Email' },
+    { id: '2', text: 'Fax' },
+  ]}"
 />
 
 <MultiSelect
   type="inline"
   titleText="Contact"
   label="Select contact methods..."
-  items="{[{ id: '0', text: 'Slack' }, { id: '1', text: 'Email' }, { id: '2', text: 'Fax' }]}"
+  items="{[
+    { id: '0', text: 'Slack' },
+    { id: '1', text: 'Email' },
+    { id: '2', text: 'Fax' },
+  ]}"
 />
 
 <MultiSelect
   size="xl"
   titleText="Contact"
   label="Select contact methods..."
-  items="{[{ id: '0', text: 'Slack' }, { id: '1', text: 'Email' }, { id: '2', text: 'Fax' }]}"
+  items="{[
+    { id: '0', text: 'Slack' },
+    { id: '1', text: 'Email' },
+    { id: '2', text: 'Fax' },
+  ]}"
 />
 
 <MultiSelect
   size="sm"
   titleText="Contact"
   label="Select contact methods..."
-  items="{[{ id: '0', text: 'Slack' }, { id: '1', text: 'Email' }, { id: '2', text: 'Fax' }]}"
+  items="{[
+    { id: '0', text: 'Slack' },
+    { id: '1', text: 'Email' },
+    { id: '2', text: 'Fax' },
+  ]}"
 />
 
 <MultiSelect
   filterable
   titleText="Contact"
   placeholder="Filter contact methods..."
-  items="{[{ id: '0', text: 'Slack' }, { id: '1', text: 'Email' }, { id: '2', text: 'Fax' }]}"
+  items="{[
+    { id: '0', text: 'Slack' },
+    { id: '1', text: 'Email' },
+    { id: '2', text: 'Fax' },
+  ]}"
 />

tests/StructuredList.test.svelte

@@ -59,7 +59,7 @@
       <StructuredListCell head>ColumnA</StructuredListCell>
       <StructuredListCell head>ColumnB</StructuredListCell>
       <StructuredListCell head>ColumnC</StructuredListCell>
-      <StructuredListCell head>{''}</StructuredListCell>
+      <StructuredListCell head>{""}</StructuredListCell>
     </StructuredListRow>
   </StructuredListHead>
   <StructuredListBody>