layerchart 2.0.0-next.0 → 2.0.0-next.2

package/dist/docs/GeoDebug.svelte

@@ -2,54 +2,59 @@
   import { Checkbox } from 'svelte-ux';
   import { cls } from '@layerstack/tailwind';
   import { format } from '@layerstack/utils';
+  import { getChartContext } from '../components/Chart.svelte';
+  import { getGeoContext } from '../components/GeoContext.svelte';
+  import type { HTMLAttributes } from 'svelte/elements';
 
-  import { chartContext } from '../components/ChartContext.svelte';
-  import { geoContext } from '../components/GeoContext.svelte';
+  const ctx = getChartContext();
+  const geoCtx = getGeoContext();
 
-  const { width, height } = chartContext();
-  const geo = geoContext();
+  let { class: className }: HTMLAttributes<HTMLElement> = $props();
 
-  let showCenter = false;
+  let showCenter = $state(false);
 </script>
 
-<div
-  class={cls('bg-surface-300/50 rounded-sm m-1 backdrop-blur-sm p-2 tabular-nums', $$props.class)}
->
-  <div class="grid gap-2 text-xs">
-    <div><span class="opacity-50">scale:</span> {format($geo.scale(), 'decimal')}</div>
-
-    <div>
-      <span class="opacity-50">translate:</span>
-      {#each $geo.translate() as coord}
-        <div class="text-right">{format(coord, 'decimal')}</div>
-      {/each}
-    </div>
-
-    <div>
-      <span class="opacity-50">rotate:</span>
-      {#each $geo.rotate() as angle}
-        <div class="text-right">{format(angle, 'decimal')}</div>
-      {/each}
-    </div>
-
-    <div class="grid grid-cols-[auto_1fr]">
-      <span class="opacity-50">center:</span>
-      <span class="text-right">
-        {$geo.center?.()}
-      </span>
-    </div>
-
-    <div>
-      <span class="opacity-50">long/lat: <Checkbox bind:checked={showCenter} size="xs" /></span>
-      {#each $geo.invert?.([$width / 2, $height / 2]) ?? [] as coord}
-        <div class="text-right">{format(coord, 'decimal')}</div>
-      {/each}
+{#if geoCtx.projection}
+  <div class={cls('bg-surface-300/50 rounded-sm m-1 backdrop-blur-sm p-2 tabular-nums', className)}>
+    <div class="grid gap-2 text-xs">
+      <div>
+        <span class="opacity-50">scale:</span>
+        {format(geoCtx.projection.scale(), 'decimal')}
+      </div>
+
+      <div>
+        <span class="opacity-50">translate:</span>
+        {#each geoCtx.projection.translate() as coord}
+          <div class="text-right">{format(coord, 'decimal')}</div>
+        {/each}
+      </div>
+
+      <div>
+        <span class="opacity-50">rotate:</span>
+        {#each geoCtx.projection.rotate() as angle}
+          <div class="text-right">{format(angle, 'decimal')}</div>
+        {/each}
+      </div>
+
+      <div class="grid grid-cols-[auto_1fr]">
+        <span class="opacity-50">center:</span>
+        <span class="text-right">
+          {geoCtx.projection.center?.()}
+        </span>
+      </div>
+
+      <div>
+        <span class="opacity-50">long/lat: <Checkbox bind:checked={showCenter} size="xs" /></span>
+        {#each geoCtx.projection.invert?.([ctx.width / 2, ctx.height / 2]) ?? [] as coord}
+          <div class="text-right">{format(coord, 'decimal')}</div>
+        {/each}
+      </div>
     </div>
   </div>
-</div>
 
-{#if showCenter}
-  <div
-    class="absolute w-2 h-2 bg-danger/80 rounded-full z-1 left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2"
-  ></div>
+  {#if showCenter}
+    <div
+      class="absolute w-2 h-2 bg-danger/80 rounded-full z-1 left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2"
+    ></div>
+  {/if}
 {/if}

package/dist/docs/GeoDebug.svelte.d.ts

@@ -1,16 +1,4 @@
-import { SvelteComponentTyped } from "svelte";
-declare const __propDef: {
-    props: {
-        [x: string]: any;
-    };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-};
-export type GeoDebugProps = typeof __propDef.props;
-export type GeoDebugEvents = typeof __propDef.events;
-export type GeoDebugSlots = typeof __propDef.slots;
-export default class GeoDebug extends SvelteComponentTyped<GeoDebugProps, GeoDebugEvents, GeoDebugSlots> {
-}
-export {};
+import type { HTMLAttributes } from 'svelte/elements';
+declare const GeoDebug: import("svelte").Component<HTMLAttributes<HTMLElement>, {}, "">;
+type GeoDebug = ReturnType<typeof GeoDebug>;
+export default GeoDebug;

package/dist/docs/Header1.svelte.d.ts

@@ -1,18 +1,29 @@
-import { SvelteComponentTyped } from "svelte";
-declare const __propDef: {
-    props: {
-        [x: string]: any;
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: Props & {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
     };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {
-        default: {};
-    };
-};
-export type Header1Props = typeof __propDef.props;
-export type Header1Events = typeof __propDef.events;
-export type Header1Slots = typeof __propDef.slots;
-export default class Header1 extends SvelteComponentTyped<Header1Props, Header1Events, Header1Slots> {
+    z_$$bindings?: Bindings;
 }
-export {};
+type $$__sveltets_2_PropsWithChildren<Props, Slots> = Props & (Slots extends {
+    default: any;
+} ? Props extends Record<string, never> ? any : {
+    children?: any;
+} : {});
+declare const Header1: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_PropsWithChildren<{
+    [x: string]: any;
+}, {
+    default: {};
+}>, {
+    [evt: string]: CustomEvent<any>;
+}, {
+    default: {};
+}, {}, string>;
+type Header1 = InstanceType<typeof Header1>;
+export default Header1;

package/dist/docs/Json.svelte.d.ts

@@ -1,18 +1,22 @@
-import { SvelteComponentTyped } from "svelte";
-declare const __propDef: {
-    props: {
-        [x: string]: any;
-        value: any;
-        defaultExpandedPaths?: string[] | undefined;
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: Props & {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
     };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-};
-export type JsonProps = typeof __propDef.props;
-export type JsonEvents = typeof __propDef.events;
-export type JsonSlots = typeof __propDef.slots;
-export default class Json extends SvelteComponentTyped<JsonProps, JsonEvents, JsonSlots> {
+    z_$$bindings?: Bindings;
 }
-export {};
+declare const Json: $$__sveltets_2_IsomorphicComponent<{
+    [x: string]: any;
+    value: any;
+    defaultExpandedPaths?: string[] | undefined;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, string>;
+type Json = InstanceType<typeof Json>;
+export default Json;

package/dist/docs/Layout.svelte.d.ts

@@ -1,18 +1,23 @@
-import { SvelteComponentTyped } from "svelte";
 import blockquote from './Blockquote.svelte';
 import a from './Link.svelte';
 export { a, blockquote };
-declare const __propDef: {
-    props: Record<string, never>;
-    events: {
-        [evt: string]: CustomEvent<any>;
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
     };
-    slots: {
-        default: {};
-    };
-};
-export type LayoutProps = typeof __propDef.props;
-export type LayoutEvents = typeof __propDef.events;
-export type LayoutSlots = typeof __propDef.slots;
-export default class Layout extends SvelteComponentTyped<LayoutProps, LayoutEvents, LayoutSlots> {
+    z_$$bindings?: Bindings;
 }
+declare const Layout: $$__sveltets_2_IsomorphicComponent<any, {
+    [evt: string]: CustomEvent<any>;
+}, {
+    default: {};
+}, {}, string>;
+type Layout = InstanceType<typeof Layout>;
+export default Layout;

package/dist/docs/Link.svelte.d.ts

@@ -1,27 +1,39 @@
-/** @typedef {typeof __propDef.props}  LinkProps */
-/** @typedef {typeof __propDef.events}  LinkEvents */
-/** @typedef {typeof __propDef.slots}  LinkSlots */
-export default class Link extends SvelteComponentTyped<{
+export default Link;
+type Link = SvelteComponent<$$__sveltets_2_PropsWithChildren<{
     [x: string]: any;
 }, {
+    default: {};
+}>, {
     [evt: string]: CustomEvent<any>;
 }, {
     default: {};
-}> {
-}
-export type LinkProps = typeof __propDef.props;
-export type LinkEvents = typeof __propDef.events;
-export type LinkSlots = typeof __propDef.slots;
-import { SvelteComponentTyped } from "svelte";
-declare const __propDef: {
-    props: {
-        [x: string]: any;
-    };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {
-        default: {};
-    };
+}> & {
+    $$bindings?: string | undefined;
 };
-export {};
+declare const Link: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_PropsWithChildren<{
+    [x: string]: any;
+}, {
+    default: {};
+}>, {
+    [evt: string]: CustomEvent<any>;
+}, {
+    default: {};
+}, {}, string>;
+type $$__sveltets_2_PropsWithChildren<Props, Slots> = Props & (Slots extends {
+    default: any;
+} ? Props extends Record<string, never> ? any : {
+    children?: any;
+} : {});
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import("svelte").ComponentConstructorOptions<Props>): import("svelte").SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: Props & {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}

package/dist/docs/PathDataMenuField.svelte

@@ -1,17 +1,21 @@
 <script lang="ts">
   import { onMount } from 'svelte';
   import * as easings from 'svelte/easing';
-
   import { MenuField } from 'svelte-ux';
 
-  export let value: any | undefined = undefined;
-
-  // TODO: Allow updating externally without loosing selection
-  export let amplitude = 1;
-  export let frequency = 10;
-  export let phase = 0;
+  let {
+    value = $bindable(),
+    amplitude = 1,
+    frequency = 10,
+    phase = 0,
+  }: {
+    value?: any;
+    amplitude?: number;
+    frequency?: number;
+    phase?: number;
+  } = $props();
 
-  $: mathOptions = [
+  const mathOptions = $derived([
     {
       label: 'sin',
       group: 'math',
@@ -53,7 +57,7 @@
       group: 'math',
       value: (x: number) => amplitude * Math.pow(x, frequency) + phase,
     },
-  ];
+  ]);
 
   const easingOptions = Object.entries(easings).map(([key, value]) => {
     return {
@@ -63,7 +67,7 @@
     };
   });
 
-  $: options = [...mathOptions, ...easingOptions];
+  const options = $derived([...mathOptions, ...easingOptions]);
 
   // Select initial option
   onMount(() => {

package/dist/docs/PathDataMenuField.svelte.d.ts

@@ -1,19 +1,9 @@
-import { SvelteComponentTyped } from "svelte";
-declare const __propDef: {
-    props: {
-        value?: any | undefined;
-        amplitude?: number;
-        frequency?: number;
-        phase?: number;
-    };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
+type $$ComponentProps = {
+    value?: any;
+    amplitude?: number;
+    frequency?: number;
+    phase?: number;
 };
-export type PathDataMenuFieldProps = typeof __propDef.props;
-export type PathDataMenuFieldEvents = typeof __propDef.events;
-export type PathDataMenuFieldSlots = typeof __propDef.slots;
-export default class PathDataMenuField extends SvelteComponentTyped<PathDataMenuFieldProps, PathDataMenuFieldEvents, PathDataMenuFieldSlots> {
-}
-export {};
+declare const PathDataMenuField: import("svelte").Component<$$ComponentProps, {}, "value">;
+type PathDataMenuField = ReturnType<typeof PathDataMenuField>;
+export default PathDataMenuField;

package/dist/docs/Preview.svelte

@@ -10,12 +10,25 @@
 
   import Code from './Code.svelte';
   import Json from './Json.svelte';
+  import type { Snippet } from 'svelte';
 
-  export let code: string | undefined = undefined;
-  export let data: any | undefined = undefined;
-  export let language = 'svelte';
-  export let highlightedCode = code ? Prism.highlight(code, Prism.languages.svelte, language) : '';
-  export let showCode = false;
+  let {
+    code,
+    data,
+    language = 'svelte',
+    highlightedCode = code ? Prism.highlight(code, Prism.languages.svelte, language) : '',
+    showCode = false,
+    class: className,
+    children,
+  }: {
+    code?: string;
+    data?: any;
+    language?: string;
+    highlightedCode?: string;
+    showCode?: boolean;
+    class?: string | null;
+    children: Snippet;
+  } = $props();
 
   /**
    * Custom JSON replacer (to use with JSON.stringify()) to convert `Date` instances to `new Date()`
@@ -41,9 +54,9 @@
   }
 </script>
 
-<div class={cls('Preview border rounded-sm bg-surface-100', $$props.class)}>
+<div class={cls('Preview border rounded-sm bg-surface-100', className)}>
   <div class="p-4">
-    <slot />
+    {@render children?.()}
   </div>
 
   {#if code && showCode}

package/dist/docs/Preview.svelte.d.ts

@@ -1,24 +1,14 @@
-import { SvelteComponentTyped } from "svelte";
 import 'prism-svelte';
-declare const __propDef: {
-    props: {
-        [x: string]: any;
-        code?: string | undefined | undefined;
-        data?: any | undefined;
-        language?: string | undefined;
-        highlightedCode?: string | undefined;
-        showCode?: boolean | undefined;
-    };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {
-        default: {};
-    };
+import type { Snippet } from 'svelte';
+type $$ComponentProps = {
+    code?: string;
+    data?: any;
+    language?: string;
+    highlightedCode?: string;
+    showCode?: boolean;
+    class?: string | null;
+    children: Snippet;
 };
-export type PreviewProps = typeof __propDef.props;
-export type PreviewEvents = typeof __propDef.events;
-export type PreviewSlots = typeof __propDef.slots;
-export default class Preview extends SvelteComponentTyped<PreviewProps, PreviewEvents, PreviewSlots> {
-}
-export {};
+declare const Preview: import("svelte").Component<$$ComponentProps, {}, "">;
+type Preview = ReturnType<typeof Preview>;
+export default Preview;

package/dist/docs/TilesetField.svelte.d.ts

@@ -1,19 +1,23 @@
-import { SvelteComponentTyped } from "svelte";
-declare const __propDef: {
-    props: {
-        doubleScale?: boolean;
-        serviceUrl?: Function;
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: Props & {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
     };
-    events: {
-        click: MouseEvent;
-    } & {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-};
-export type TilesetFieldProps = typeof __propDef.props;
-export type TilesetFieldEvents = typeof __propDef.events;
-export type TilesetFieldSlots = typeof __propDef.slots;
-export default class TilesetField extends SvelteComponentTyped<TilesetFieldProps, TilesetFieldEvents, TilesetFieldSlots> {
+    z_$$bindings?: Bindings;
 }
-export {};
+declare const TilesetField: $$__sveltets_2_IsomorphicComponent<{
+    doubleScale?: boolean;
+    serviceUrl?: Function;
+}, {
+    click: MouseEvent;
+} & {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, string>;
+type TilesetField = InstanceType<typeof TilesetField>;
+export default TilesetField;

package/dist/docs/TransformDebug.svelte

@@ -2,22 +2,21 @@
   import { cls } from '@layerstack/tailwind';
   import { format } from '@layerstack/utils';
 
-  import { transformContext } from '../components/TransformContext.svelte';
+  import { getTransformContext } from '../components/TransformContext.svelte';
 
-  const transform = transformContext();
-  const { translate, scale } = transform;
+  const transform = getTransformContext();
 </script>
 
 <div
   class={cls('bg-surface-300/50 rounded-sm m-1 backdrop-blur-sm p-2 tabular-nums', $$props.class)}
 >
   <div class="grid gap-2 text-xs">
-    <div><span class="opacity-50">scale:</span> {format($scale, 'decimal')}</div>
+    <div><span class="opacity-50">scale:</span> {format(transform.scale, 'decimal')}</div>
 
     <div>
       <span class="opacity-50">translate:</span>
-      <div class="text-right">{format($translate.x, 'decimal')}</div>
-      <div class="text-right">{format($translate.y, 'decimal')}</div>
+      <div class="text-right">{format(transform.translate.x, 'decimal')}</div>
+      <div class="text-right">{format(transform.translate.y, 'decimal')}</div>
     </div>
   </div>
 </div>

package/dist/docs/TransformDebug.svelte.d.ts

@@ -1,16 +1,20 @@
-import { SvelteComponentTyped } from "svelte";
-declare const __propDef: {
-    props: {
-        [x: string]: any;
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: Props & {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
     };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-};
-export type TransformDebugProps = typeof __propDef.props;
-export type TransformDebugEvents = typeof __propDef.events;
-export type TransformDebugSlots = typeof __propDef.slots;
-export default class TransformDebug extends SvelteComponentTyped<TransformDebugProps, TransformDebugEvents, TransformDebugSlots> {
+    z_$$bindings?: Bindings;
 }
-export {};
+declare const TransformDebug: $$__sveltets_2_IsomorphicComponent<{
+    [x: string]: any;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, string>;
+type TransformDebug = InstanceType<typeof TransformDebug>;
+export default TransformDebug;

package/dist/docs/ViewSourceButton.svelte.d.ts

@@ -1,21 +1,25 @@
-import { SvelteComponentTyped } from "svelte";
 import type { ComponentProps } from 'svelte';
 import { Button } from 'svelte-ux';
-declare const __propDef: {
-    props: {
-        label: string;
-        source?: string | undefined;
-        href?: string | undefined;
-        icon: ComponentProps<Button>["icon"];
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: Props & {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
     };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-};
-export type ViewSourceButtonProps = typeof __propDef.props;
-export type ViewSourceButtonEvents = typeof __propDef.events;
-export type ViewSourceButtonSlots = typeof __propDef.slots;
-export default class ViewSourceButton extends SvelteComponentTyped<ViewSourceButtonProps, ViewSourceButtonEvents, ViewSourceButtonSlots> {
+    z_$$bindings?: Bindings;
 }
-export {};
+declare const ViewSourceButton: $$__sveltets_2_IsomorphicComponent<{
+    label: string;
+    source?: string | undefined;
+    href?: string | undefined;
+    icon: ComponentProps<Button>["icon"];
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, string>;
+type ViewSourceButton = InstanceType<typeof ViewSourceButton>;
+export default ViewSourceButton;

package/dist/types/d3-shape-extentions.d.ts

@@ -0,0 +1,7 @@
+import * as d3 from 'd3-shape';
+
+declare module 'd3-shape' {
+  interface Arc<This, Datum> {
+    (): string | null;
+  }
+}

package/dist/utils/afterTick.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Executes a callback function after the next DOM update.
+ * @param cb Callback function to be executed after the next DOM update
+ */
+export declare function afterTick(cb: () => void): void;

package/dist/utils/afterTick.js

@@ -0,0 +1,8 @@
+import { tick } from 'svelte';
+/**
+ * Executes a callback function after the next DOM update.
+ * @param cb Callback function to be executed after the next DOM update
+ */
+export function afterTick(cb) {
+    tick().then(cb);
+}