Prettier

Author: igorkamyshev

apps/website/docs/.vitepress/theme/LiveDemo.vue

@@ -15,7 +15,7 @@ const props = defineProps(['demoFile']);
 const files = {
   '/src/App.vue': props.demoFile,
   ...localPackage({ name: 'web-api', content: webApiRaw }),
-  ...localPackage({ name: 'contracts', content: contractsRaw })
+  ...localPackage({ name: 'contracts', content: contractsRaw }),
 };
 
 const customSetup = {
@@ -43,5 +43,10 @@ function localPackage({ name, content }) {
 </script>
 
 <template>
-  <Sandpack template="vue3" theme="auto" :files="files" :customSetup="customSetup" />
+  <Sandpack
+    template="vue3"
+    theme="auto"
+    :files="files"
+    :customSetup="customSetup"
+  />
 </template>

apps/website/docs/contracts/array_numbers.live.vue

@@ -5,28 +5,28 @@ const contract = arr(num);
 </script>
 
 <template>
-    <h1>
-        Out <em>Contract</em> is ensuring that passed data is an array of numbers
-    </h1>
-    <section>
-        <h2>Valid data example</h2>
-        <p>Let us pass [1, 2, 3] to the <em>Contract</em></p>
-        <p>isData() 👉 {{ contract.isData([1, 2, 3]) }}</p>
-        <p>getErrorMessages() 👉 {{
-            JSON.stringify(contract.getErrorMessages([1, 2, 3]))
-            }}</p>
-    </section>
+  <h1>
+    Out <em>Contract</em> is ensuring that passed data is an array of numbers
+  </h1>
+  <section>
+    <h2>Valid data example</h2>
+    <p>Let us pass [1, 2, 3] to the <em>Contract</em></p>
+    <p>isData() 👉 {{ contract.isData([1, 2, 3]) }}</p>
+    <p>
+      getErrorMessages() 👉
+      {{ JSON.stringify(contract.getErrorMessages([1, 2, 3])) }}
+    </p>
+  </section>
 
-    <section>
-        <h2>Invalid data example</h2>
-        <p>Let us pass [1, 'WHOA', 3] to the <em>Contract</em>.
-            instead
-            of number.</p>
-        <p>
-            isData() 👉 {{ contract.isData([1, 'WHOA', 3]) }}</p>
-        <p>
-            getErrorMessages() 👉 {{
-                JSON.stringify(contract.getErrorMessages([1, 'WHOA', 3]))
-            }}</p>
-    </section>
+  <section>
+    <h2>Invalid data example</h2>
+    <p>
+      Let us pass [1, 'WHOA', 3] to the <em>Contract</em>. instead of number.
+    </p>
+    <p>isData() 👉 {{ contract.isData([1, 'WHOA', 3]) }}</p>
+    <p>
+      getErrorMessages() 👉
+      {{ JSON.stringify(contract.getErrorMessages([1, 'WHOA', 3])) }}
+    </p>
+  </section>
 </template>

apps/website/docs/contracts/size_chart.vue

@@ -2,55 +2,58 @@
 import { computed, defineProps } from 'vue';
 import { Bar } from 'vue-chartjs';
 import {
-    Chart as ChartJS,
-    Title,
-    Tooltip,
-    BarElement,
-    CategoryScale,
-    LinearScale,
+  Chart as ChartJS,
+  Title,
+  Tooltip,
+  BarElement,
+  CategoryScale,
+  LinearScale,
 } from 'chart.js';
 import prettyBytes from 'pretty-bytes';
 
 ChartJS.register(Title, Tooltip, BarElement, CategoryScale, LinearScale);
 
 const props = defineProps({
-    sizes: {
-        type: Array,
-        required: true,
-    },
+  sizes: {
+    type: Array,
+    required: true,
+  },
 });
 const chartData = computed(() => {
-    const sortedSizes = props.sizes.toSorted((a, b) => a.size - b.size);
-    return {
-        labels: sortedSizes.map((item) => item.name),
-        datasets: [
-            { data: sortedSizes.map((item) => item.size), backgroundColor: '#3451b2' },
-        ],
-    }
+  const sortedSizes = props.sizes.toSorted((a, b) => a.size - b.size);
+  return {
+    labels: sortedSizes.map((item) => item.name),
+    datasets: [
+      {
+        data: sortedSizes.map((item) => item.size),
+        backgroundColor: '#3451b2',
+      },
+    ],
+  };
 });
 
 const chartOptions = {
-    responsive: true,
-    scales: {
-        y: {
-            beginAtZero: true,
-            ticks: {
-                callback: (value) =>
-                    typeof value === 'number' ? prettyBytes(value) : value,
-            },
-        },
+  responsive: true,
+  scales: {
+    y: {
+      beginAtZero: true,
+      ticks: {
+        callback: (value) =>
+          typeof value === 'number' ? prettyBytes(value) : value,
+      },
     },
-    plugins: {
-        tooltip: {
-            callbacks: {
-                label: (item) => prettyBytes(item.parsed.y),
-                title: ([item]) => item?.label,
-            },
-        },
+  },
+  plugins: {
+    tooltip: {
+      callbacks: {
+        label: (item) => prettyBytes(item.parsed.y),
+        title: ([item]) => item?.label,
+      },
     },
+  },
 };
 </script>
 
 <template>
-    <Bar id="size-chart" :options="chartOptions" :data="chartData" />
+  <Bar id="size-chart" :options="chartOptions" :data="chartData" />
 </template>