Add Tools/Pivot

docs/src/content/components/Pivot.md

@@ -0,0 +1,20 @@
+---
+description: Utility function to reshape and aggregate tabular data, converting between long and wide formats.
+category: tools
+layers: []
+related: []
+---
+
+<script lang="ts">
+  import Example from '$lib/components/Example.svelte';
+</script>
+
+## Usage
+
+### PivotLonger (Columns to Rows)
+
+<Example name="pivot-longer"  />
+
+### PivotWider (Rows to Columns)
+
+<Example name="pivot-wider"  />

docs/src/examples/Pivot/pivot-longer.svelte

@@ -0,0 +1,23 @@
+<script lang="ts">
+	import { pivotLonger } from 'layerchart';
+
+	import Code from '$lib/components/Code.svelte';
+	import Json from '$lib/components/Json.svelte';
+	import { wideData, longData } from '$lib/utils/data';
+</script>
+
+<Code
+	source="pivotLonger(wideData, ['apples', 'bananas', 'cherries', 'grapes'], 'fruit', 'value')"
+	language="js"
+/>
+
+<h2 class="pt-4">Before</h2>
+
+<Json value={wideData} class="rounded-sm" />
+
+<h2>After</h2>
+
+<Json
+	value={pivotLonger(wideData, ['apples', 'bananas', 'cherries', 'grapes'], 'fruit', 'value')}
+	class="rounded-sm"
+/>

docs/src/examples/Pivot/pivot-wider.svelte

@@ -0,0 +1,17 @@
+<script lang="ts">
+	import { pivotWider } from 'layerchart';
+
+	import Code from '$lib/components/Code.svelte';
+	import Json from '$lib/components/Json.svelte';
+	import { longData } from '$lib/utils/data';
+</script>
+
+<Code source="pivotWider(longData, 'year', 'fruit', 'value')" language="js" />
+
+<h2 class="pt-4">Before</h2>
+
+<Json value={longData} class="rounded-sm" />
+
+<h2>After</h2>
+
+<Json value={pivotWider(longData, 'year', 'fruit', 'value')} class="rounded-sm" />