layerchart 0.43.8 → 0.44.0

package/dist/components/Chart.svelte

@@ -102,7 +102,7 @@ onMount(() => {
       ? geoFitObjectTransform(geo.projection(), [width, height], geo.fitGeojson)
       : undefined}
 
-  <ChartContext {data} let:data let:flatData>
+  <ChartContext {data} let:data let:flatData on:resize>
     {#key isMounted}
       <TransformContext
         bind:this={transformContext}

package/dist/components/Chart.svelte.d.ts

@@ -218,6 +218,7 @@ declare class __sveltets_Render<TData> {
         transformContext?: TransformContext;
     };
     events(): {
+        resize: CustomEvent<any>;
         transform: CustomEvent<{
             scale: number;
             translate: {

package/dist/components/ChartContext.svelte

@@ -1,5 +1,5 @@
 <!-- Wrapper to allow getting LayerCake context from <Chart> and exposing with a strongly type context getter -->
-<script context="module">import { getContext, setContext } from 'svelte';
+<script context="module">import { createEventDispatcher, getContext, onMount, setContext } from 'svelte';
 import {} from 'svelte/store';
 export const chartContextKey = Symbol();
 export function chartContext() {
@@ -10,8 +10,23 @@ function setChartContext(context) {
 }
 </script>
 
-<script generics="TData">const layerCakeContext = getContext('LayerCake');
+<script generics="TData">const dispatch = createEventDispatcher();
+const layerCakeContext = getContext('LayerCake');
 setChartContext(layerCakeContext);
+const { width, height, containerWidth, containerHeight } = layerCakeContext;
+$: if (isMounted) {
+    dispatch('resize', {
+        width: $width,
+        height: $height,
+        containerWidth: $containerWidth,
+        containerHeight: $containerHeight,
+    });
+}
+// Track when mounted since LayerCake initializes width/height with `100` until binded `clientWidth`/`clientWidth` can run
+let isMounted = false;
+onMount(() => {
+    isMounted = true;
+});
 // Added to try to pass TData downward
 export let data = []; // Same as `ComponentProps<Chart<TData>>` but causes circular reference
 </script>

package/dist/components/ChartContext.svelte.d.ts

@@ -64,6 +64,16 @@ type LayerCakeContext<TData> = {
     rScale: Readable<AnyScale>;
     rGet: Readable<any>;
 };
+export type ChartEvents = {
+    resize: ChartResizeDetail;
+};
+export type ChartResizeDetail = {
+    width: number;
+    height: number;
+    containerWidth: number;
+    containerHeight: number;
+};
+export type ChartResizeEvent = CustomEvent<ChartResizeDetail>;
 export type ChartContext<TData> = LayerCakeContext<TData> & {};
 export declare function chartContext<TData = any>(): ChartContext<TData>;
 import type { SankeyGraph } from 'd3-sankey';

package/package.json

@@ -4,14 +4,14 @@
   "author": "Sean Lynch <techniq35@gmail.com>",
   "license": "MIT",
   "repository": "techniq/layerchart",
-  "version": "0.43.8",
+  "version": "0.44.0",
   "devDependencies": {
     "@changesets/cli": "^2.27.7",
     "@mdi/js": "^7.4.47",
     "@rollup/plugin-dsv": "^3.0.4",
-    "@sveltejs/adapter-cloudflare": "^4.7.0",
-    "@sveltejs/kit": "^2.5.20",
-    "@sveltejs/package": "^2.3.2",
+    "@sveltejs/adapter-cloudflare": "^4.7.2",
+    "@sveltejs/kit": "^2.5.22",
+    "@sveltejs/package": "^2.3.4",
     "@sveltejs/vite-plugin-svelte": "^3.1.1",
     "@svitejs/changesets-changelog-github-compact": "^1.1.0",
     "@tailwindcss/typography": "^0.5.14",
@@ -55,7 +55,7 @@
     "svelte-json-tree": "^2.2.0",
     "svelte-preprocess": "^6.0.2",
     "svelte2tsx": "^0.7.15",
-    "tailwindcss": "^3.4.9",
+    "tailwindcss": "^3.4.10",
     "topojson-client": "^3.1.0",
     "topojson-simplify": "^3.0.3",
     "tslib": "^2.6.3",
@@ -88,9 +88,9 @@
     "date-fns": "^3.6.0",
     "layercake": "^8.3.4",
     "lodash-es": "^4.17.21",
-    "posthog-js": "^1.154.5",
+    "posthog-js": "^1.155.4",
     "shapefile": "^0.6.6",
-    "svelte-ux": "^0.74.3",
+    "svelte-ux": "^0.74.4",
     "topojson-client": "^3.1.0"
   },
   "peerDependencies": {