@reshape-biotech/design-system 1.2.6 → 1.2.7

package/dist/components/graphs/scatterplot/Scatterplot.stories.svelte

@@ -1,105 +1,105 @@
 <script module lang="ts">
-	import { defineMeta } from '@storybook/addon-svelte-csf';
-	import Scatterplot from './Scatterplot.svelte';
-	import type { DataPoint } from './Scatterplot.svelte';
+  import { defineMeta } from '@storybook/addon-svelte-csf';
+  import Scatterplot from './Scatterplot.svelte';
+  import type { DataPoint } from './Scatterplot.svelte';
 
-	const { Story } = defineMeta({
-		component: Scatterplot,
-		title: 'Design System/Graphs/Scatterplot',
-		tags: ['autodocs']
-	});
+  const { Story } = defineMeta({
+    component: Scatterplot,
+    title: 'Design System/Graphs/Scatterplot',
+    tags: ['autodocs'],
+  });
 
-	const data: DataPoint[] = [
-		{ value: [10.0, 8.04], metadata: { blip: '1', blop: 1, user_id: '1' } },
-		{ value: [8.07, 6.95], metadata: { blip: '2', blop: 2, user_id: '2' } },
-		{ value: [13.0, 7.58], metadata: { blip: '3', blop: 3, user_id: '3' } },
-		{ value: [9.05, 8.81], metadata: { blip: '4', blop: 4, user_id: '4' } },
-		{ value: [12.0, 8.33], metadata: { blip: '5', blop: 5, user_id: '5' } },
-		{ value: [14.0, 7.66], metadata: { blip: '6', blop: 6, user_id: '6' } }
-	];
+  const data: DataPoint[] = [
+    { value: [10.0, 8.04], metadata: { blip: '1', blop: 1, user_id: '1' } },
+    { value: [8.07, 6.95], metadata: { blip: '2', blop: 2, user_id: '2' } },
+    { value: [13.0, 7.58], metadata: { blip: '3', blop: 3, user_id: '3' } },
+    { value: [9.05, 8.81], metadata: { blip: '4', blop: 4, user_id: '4' } },
+    { value: [12.0, 8.33], metadata: { blip: '5', blop: 5, user_id: '5' } },
+    { value: [14.0, 7.66], metadata: { blip: '6', blop: 6, user_id: '6' } },
+  ];
 
-	const errorBarsData: DataPoint[] = data.map((d) => ({
-		...d,
-		error_value: 1.5
-	}));
+  const errorBarsData: DataPoint[] = data.map((d) => ({
+    ...d,
+    error_value: 1.5,
+  }));
 
-	const lineData: [[number, number], [number, number]] = [
-		[0, 2],
-		[12, 14]
-	];
+  const lineData: [[number, number], [number, number]] = [
+    [0, 2],
+    [12, 14],
+  ];
 
-	function handleItemClick(params: echarts.ECElementEvent) {}
+  function handleItemClick(params: echarts.ECElementEvent) {}
 
-	function handleMouseOver(params: echarts.ECElementEvent) {}
+  function handleMouseOver(params: echarts.ECElementEvent) {}
 
-	function handleMouseOut() {}
+  function handleMouseOut() {}
 </script>
 
 <Story name="Base" asChild>
-	<div class="h-[400px] w-full">
-		<Scatterplot
-			{data}
-			xAxisName="Manual count"
-			yAxisName="Analysis count"
-			onitemclick={handleItemClick}
-			onmouseover={handleMouseOver}
-			onmouseout={handleMouseOut}
-		/>
-	</div>
+  <div class="h-[400px] w-full">
+    <Scatterplot
+      {data}
+      xAxisName="Manual count"
+      yAxisName="Analysis count"
+      onitemclick={handleItemClick}
+      onmouseover={handleMouseOver}
+      onmouseout={handleMouseOut}
+    />
+  </div>
 </Story>
 
 <Story name="With Line Data" asChild>
-	<div class="h-[400px] w-full">
-		<Scatterplot
-			{data}
-			{lineData}
-			xAxisName="Manual count"
-			yAxisName="Analysis count"
-			onitemclick={handleItemClick}
-			onmouseover={handleMouseOver}
-			onmouseout={handleMouseOut}
-		/>
-	</div>
+  <div class="h-[400px] w-full">
+    <Scatterplot
+      {data}
+      {lineData}
+      xAxisName="Manual count"
+      yAxisName="Analysis count"
+      onitemclick={handleItemClick}
+      onmouseover={handleMouseOver}
+      onmouseout={handleMouseOut}
+    />
+  </div>
 </Story>
 <Story name="Error bars" asChild>
-	<div class="h-[400px] w-full">
-		<Scatterplot
-			data={errorBarsData}
-			{lineData}
-			xAxisName="Manual count"
-			yAxisName="Analysis count"
-			onitemclick={handleItemClick}
-			onmouseover={handleMouseOver}
-			onmouseout={handleMouseOut}
-		/>
-	</div>
+  <div class="h-[400px] w-full">
+    <Scatterplot
+      data={errorBarsData}
+      {lineData}
+      xAxisName="Manual count"
+      yAxisName="Analysis count"
+      onitemclick={handleItemClick}
+      onmouseover={handleMouseOver}
+      onmouseout={handleMouseOut}
+    />
+  </div>
 </Story>
 <Story name="Error bars with confidence band" asChild>
-	<div class="h-[400px] w-full">
-		<Scatterplot
-			data={errorBarsData}
-			{lineData}
-			xAxisName="Manual count"
-			yAxisName="Analysis count"
-			showConfidenceBand
-			onitemclick={handleItemClick}
-			onmouseover={handleMouseOver}
-			onmouseout={handleMouseOut}
-		/>
-	</div>
+  <div class="h-[400px] w-full">
+    <Scatterplot
+      data={errorBarsData}
+      {lineData}
+      xAxisName="Manual count"
+      yAxisName="Analysis count"
+      showConfidenceBand
+      onitemclick={handleItemClick}
+      onmouseover={handleMouseOver}
+      onmouseout={handleMouseOut}
+    />
+  </div>
 </Story>
 <Story name="Confidence band and legend" asChild>
-	<div class="h-[400px] w-full">
-		<Scatterplot
-			{data}
-			{lineData}
-			xAxisName="Manual count"
-			yAxisName="Analysis count"
-			showConfidenceBand
-			showLegend
-			onitemclick={handleItemClick}
-			onmouseover={handleMouseOver}
-			onmouseout={handleMouseOut}
-		/>
-	</div>
+  <div class="h-[400px] w-full">
+    <Scatterplot
+      {data}
+      {lineData}
+      xAxisName="Manual count"
+      yAxisName="Analysis count"
+      showConfidenceBand
+      showLegend
+      onitemclick={handleItemClick}
+      onmouseover={handleMouseOver}
+      onmouseout={handleMouseOut}
+    />
+  </div>
 </Story>