layerchart 2.0.0-next.5 → 2.0.0-next.51

package/dist/components/tooltip/tooltipMetaContext.js

@@ -1,139 +0,0 @@
-// Additional meta data that can be set by the various simplified chart components
-// to provide additional payload data to the tooltip for ease of composition.
-import { accessor, findRelatedData } from '../../utils/common.js';
-import { asAny } from '../../utils/types.js';
-import { format } from '@layerstack/utils';
-import { Context } from 'runed';
-function handleBarTooltipPayload({ ctx, data, metaCtx, }) {
-    const seriesItems = metaCtx.stackSeries
-        ? [...metaCtx.visibleSeries].reverse()
-        : metaCtx.visibleSeries;
-    const payload = seriesItems.map((s) => {
-        const seriesTooltipData = s.data ? findRelatedData(s.data, data, ctx.x) : data;
-        const valueAccessor = accessor(s.value ?? (s.data ? ctx.y : s.key));
-        const label = metaCtx.orientation === 'vertical' ? ctx.x(data) : ctx.y(data);
-        const name = s.label ?? (s.key !== 'default' ? s.key : 'value');
-        const value = seriesTooltipData ? valueAccessor(seriesTooltipData) : undefined;
-        const color = s.color ?? ctx.cScale?.(ctx.c(data));
-        return {
-            ...s.data,
-            chartType: 'bar',
-            color,
-            label,
-            name,
-            value,
-            valueAccessor,
-            key: s.key,
-            payload: data,
-            rawSeriesData: s,
-            formatter: format,
-        };
-    });
-    return payload;
-}
-function handleAreaTooltipPayload({ ctx, data, metaCtx, }) {
-    const seriesItems = metaCtx.stackSeries
-        ? [...metaCtx.visibleSeries].reverse()
-        : metaCtx.visibleSeries;
-    const payload = seriesItems.map((s) => {
-        const seriesTooltipData = s.data ? findRelatedData(s.data, data, ctx.x) : data;
-        const valueAccessor = accessor(s.value ?? (s.data ? asAny(ctx.y) : s.key));
-        const label = ctx.x(data);
-        const name = s.label ?? (s.key !== 'default' ? s.key : 'value');
-        const value = seriesTooltipData ? valueAccessor(seriesTooltipData) : undefined;
-        const color = s.color ?? ctx.cScale?.(ctx.c(data));
-        return {
-            ...s.data,
-            chartType: 'area',
-            color,
-            label,
-            name,
-            value,
-            valueAccessor,
-            key: s.key,
-            payload: data,
-            rawSeriesData: s,
-            formatter: format,
-        };
-    });
-    return payload;
-}
-function handleLineTooltipPayload({ ctx, data, metaCtx, }) {
-    return metaCtx.visibleSeries.map((s) => {
-        const seriesTooltipData = s.data ? findRelatedData(s.data, data, ctx.x) : data;
-        const label = ctx.x(data);
-        const valueAccessor = accessor(s.value ?? (s.data ? asAny(ctx.y) : s.key));
-        const name = s.label ?? (s.key !== 'default' ? s.key : 'value');
-        const value = seriesTooltipData ? valueAccessor(seriesTooltipData) : undefined;
-        const color = s.color ?? ctx.cScale?.(ctx.c(data));
-        return {
-            ...s.data,
-            chartType: 'line',
-            color,
-            label,
-            name,
-            value,
-            valueAccessor,
-            key: s.key,
-            payload: data,
-            rawSeriesData: s,
-            formatter: format,
-        };
-    });
-}
-function handlePieOrArcTooltipPayload({ ctx, data, metaCtx, }) {
-    const keyAccessor = accessor(metaCtx.key);
-    const labelAccessor = accessor(metaCtx.label);
-    const valueAccessor = accessor(metaCtx.value);
-    const colorAccessor = accessor(metaCtx.color);
-    return [
-        {
-            key: keyAccessor(data),
-            label: labelAccessor(data) || keyAccessor(data),
-            value: valueAccessor(data),
-            color: colorAccessor(data) ?? ctx.cScale?.(ctx.c(data)),
-            payload: data,
-            chartType: 'pie',
-            labelAccessor,
-            keyAccessor,
-            valueAccessor,
-            colorAccessor,
-        },
-    ];
-}
-export function handleScatterTooltipPayload({ ctx, data, metaCtx, }) {
-    // TODO: implement scatter tooltip payload handling
-    return [{ payload: data, key: '' }];
-}
-const _TooltipMetaContext = new Context('TooltipMetaContext');
-/**
- * Retrieves the current tooltip meta context value, or null if not set.
- */
-export function getTooltipMetaContext() {
-    return _TooltipMetaContext.getOr(null);
-}
-/**
- * Sets the tooltip meta context value, used to provide additional payload data to the tooltip.
- * This is typically set by the various simplified chart components, such as BarChart, AreaChart,
- * etc.
- */
-export function setTooltipMetaContext(v) {
-    return _TooltipMetaContext.set(v);
-}
-export function getTooltipPayload({ ctx, tooltipData, metaCtx, }) {
-    if (!metaCtx)
-        return [{ payload: tooltipData, key: '' }];
-    switch (metaCtx.type) {
-        case 'bar':
-            return handleBarTooltipPayload({ ctx, data: tooltipData, metaCtx });
-        case 'area':
-            return handleAreaTooltipPayload({ ctx, data: tooltipData, metaCtx });
-        case 'line':
-            return handleLineTooltipPayload({ ctx, data: tooltipData, metaCtx });
-        case 'pie':
-        case 'arc':
-            return handlePieOrArcTooltipPayload({ ctx, data: tooltipData, metaCtx });
-        case 'scatter':
-            return handleScatterTooltipPayload({ ctx, data: tooltipData, metaCtx });
-    }
-}

package/dist/docs/Blockquote.svelte

@@ -1,15 +0,0 @@
-<script lang="ts">
-  import { mdiInformation } from '@mdi/js';
-  import { Icon } from 'svelte-ux';
-  import { cls } from '@layerstack/tailwind';
-</script>
-
-<div
-  class={cls(
-    'bg-primary/10 border border-l-[6px] border-primary/30 border-l-primary text-primary px-4 py-2 my-4 rounded-sm flex items-center gap-2 text-sm',
-    '[&>a]:font-medium [&>a]:underline [&>a]:decoration-dashed [&>a]:decoration-primary/50 [&>a]:underline-offset-2'
-  )}
->
-  <Icon data={mdiInformation} class="text-primary" />
-  <slot />
-</div>

package/dist/docs/Code.svelte

@@ -1,38 +0,0 @@
-<script lang="ts">
-  import Prism from 'prismjs';
-  import 'prism-svelte';
-  import { CopyButton } from 'svelte-ux';
-  import { cls } from '@layerstack/tailwind';
-
-  export let source: string | null = null;
-  export let language = 'svelte';
-  export let highlightedSource = source
-    ? Prism.highlight(source, Prism.languages[language] ?? Prism.languages.text, language)
-    : '';
-
-  export let classes: {
-    root?: string;
-    pre?: string;
-    code?: string;
-  } = {};
-</script>
-
-<div class={cls('Code', 'rounded-sm', classes.root, $$props.class)}>
-  {#if source}
-    <div class="relative">
-      <pre
-        class={cls('language-{language} rounded-sm', classes.pre)}
-        style="margin: 0; white-space: normal;">
-          <code class={cls('language-{language}', classes.code)}>{@html highlightedSource}</code>
-      </pre>
-
-      <div class="absolute top-0 right-0 p-2 z-10">
-        <CopyButton
-          value={source ?? ''}
-          class="text-white/70 hover:bg-surface-100/20 py-1 backdrop-blur-md"
-          size="sm"
-        />
-      </div>
-    </div>
-  {/if}
-</div>

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

@@ -1,29 +0,0 @@
-import 'prism-svelte';
-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;
-}
-declare const Code: $$__sveltets_2_IsomorphicComponent<{
-    [x: string]: any;
-    source?: string | null | undefined;
-    language?: string | undefined;
-    highlightedSource?: string | undefined;
-    classes?: {
-        root?: string;
-        pre?: string;
-        code?: string;
-    } | undefined;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
-type Code = InstanceType<typeof Code>;
-export default Code;

package/dist/docs/ConnectorSweepMenuField.svelte

@@ -1,17 +0,0 @@
-<script lang="ts">
-  import { MenuField } from 'svelte-ux';
-  import type { ConnectorSweep } from '../utils/connectorUtils.js';
-
-  let {
-    value = $bindable('horizontal-vertical'),
-  }: {
-    value?: ConnectorSweep;
-  } = $props();
-
-  const options = ['horizontal-vertical', 'vertical-horizontal', 'none'].map((type) => ({
-    label: type,
-    value: type,
-  }));
-</script>
-
-<MenuField label="Connector Sweep" {options} bind:value stepper classes={{ menuIcon: 'hidden' }} />

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

@@ -1,7 +0,0 @@
-import type { ConnectorSweep } from '../utils/connectorUtils.js';
-type $$ComponentProps = {
-    value?: ConnectorSweep;
-};
-declare const ConnectorSweepMenuField: import("svelte").Component<$$ComponentProps, {}, "value">;
-type ConnectorSweepMenuField = ReturnType<typeof ConnectorSweepMenuField>;
-export default ConnectorSweepMenuField;

package/dist/docs/ConnectorTypeMenuField.svelte

@@ -1,17 +0,0 @@
-<script lang="ts">
-  import { MenuField } from 'svelte-ux';
-  import type { ConnectorType } from '../utils/connectorUtils.js';
-
-  let {
-    value = $bindable('rounded'),
-  }: {
-    value?: ConnectorType;
-  } = $props();
-
-  const options = ['straight', 'square', 'beveled', 'rounded', 'd3'].map((type) => ({
-    label: type,
-    value: type,
-  }));
-</script>
-
-<MenuField label="Connector Type" {options} bind:value stepper classes={{ menuIcon: 'hidden' }} />

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

@@ -1,7 +0,0 @@
-import type { ConnectorType } from '../utils/connectorUtils.js';
-type $$ComponentProps = {
-    value?: ConnectorType;
-};
-declare const ConnectorTypeMenuField: import("svelte").Component<$$ComponentProps, {}, "value">;
-type ConnectorTypeMenuField = ReturnType<typeof ConnectorTypeMenuField>;
-export default ConnectorTypeMenuField;

package/dist/docs/CurveMenuField.svelte

@@ -1,44 +0,0 @@
-<script lang="ts">
-  import * as d3shapes from 'd3-shape';
-
-  import { MenuField } from 'svelte-ux';
-  import { entries } from '@layerstack/utils';
-  import type { ComponentProps } from 'svelte';
-
-  let {
-    value = $bindable(),
-    showOpenClosed = false,
-    ...restProps
-  }: {
-    value?: any;
-    showOpenClosed?: boolean;
-  } & ComponentProps<MenuField> = $props();
-
-  if (value === undefined) {
-    value = d3shapes['curveLinear'];
-  }
-
-  const options = entries(d3shapes)
-    .filter(([key]) => {
-      return (
-        key.startsWith('curve') &&
-        (showOpenClosed ? true : !key.endsWith('Open') && !key.endsWith('Closed')) &&
-        !key.includes('Bundle') // Not compatibile with area
-      );
-    })
-    .map(([key, value]) => {
-      return {
-        label: key.replace('curve', ''),
-        value: value,
-      };
-    });
-</script>
-
-<MenuField
-  label="Curve"
-  {options}
-  bind:value
-  stepper
-  classes={{ menuIcon: 'hidden' }}
-  {...restProps}
-/>

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

@@ -1,9 +0,0 @@
-import { MenuField } from 'svelte-ux';
-import type { ComponentProps } from 'svelte';
-type $$ComponentProps = {
-    value?: any;
-    showOpenClosed?: boolean;
-} & ComponentProps<MenuField>;
-declare const CurveMenuField: import("svelte").Component<$$ComponentProps, {}, "value">;
-type CurveMenuField = ReturnType<typeof CurveMenuField>;
-export default CurveMenuField;

package/dist/docs/GeoDebug.svelte

@@ -1,60 +0,0 @@
-<script lang="ts">
-  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';
-
-  const ctx = getChartContext();
-  const geoCtx = getGeoContext();
-
-  let { class: className }: HTMLAttributes<HTMLElement> = $props();
-
-  let showCenter = $state(false);
-</script>
-
-{#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>
-
-  {#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,4 +0,0 @@
-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

@@ -1,14 +0,0 @@
-<script lang="ts">
-  import { SectionDivider } from 'svelte-ux';
-</script>
-
-<!--
-  TODO:
-    - [ ] Set id based on slot value
-      - Needed for #examples, #api, etc
-      - Maybe possible to set/get props from markdown/mdsvex
-        - Example: `#API { id: 'api' }
--->
-<SectionDivider {...$$restProps}>
-  <slot />
-</SectionDivider>

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

@@ -1,29 +0,0 @@
-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;
-}
-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

@@ -1,28 +0,0 @@
-<script lang="ts">
-  import JsonTree from 'svelte-json-tree';
-  import { cls } from '@layerstack/tailwind';
-
-  export let value: any;
-  export let defaultExpandedPaths = ['$'];
-</script>
-
-<div class={cls('overflow-auto px-4 py-2 bg-[#1e1e1e]', $$props.class)}>
-  <JsonTree
-    {value}
-    {defaultExpandedPaths}
-    shouldTreatIterableAsObject
-    --json-tree-property-color="#72a2d3"
-    --json-tree-string-color="#6cd1c7"
-    --json-tree-symbol-color="#6cd1c7"
-    --json-tree-boolean-color="#9681f7"
-    --json-tree-function-color="#e59b6f"
-    --json-tree-number-color="#9681f7"
-    --json-tree-label-color="#9ca0a5"
-    --json-tree-arrow-color="#e8eaed"
-    --json-tree-null-color="#81868a"
-    --json-tree-undefined-color="#81868a"
-    --json-tree-date-color="#9ca0a5"
-    --json-tree-operator-color="#e8eaed"
-    --json-tree-regex-color="#6cd1c7"
-  />
-</div>

package/dist/docs/Layout.svelte

@@ -1,18 +0,0 @@
-<script context="module">
-  // Custom components: https://mdsvex.com/docs#custom-components
-  import blockquote from './Blockquote.svelte';
-  import a from './Link.svelte';
-  import h1 from './Header1.svelte';
-
-  export { a, blockquote };
-</script>
-
-<script lang="ts">
-  // frontmatter: https://mdsvex.com/docs#frontmatter-1
-  // export let name = undefined;
-  // export let sourceUrl = undefined;
-  // export let docUrl = undefined;
-  // export let description = undefined;
-</script>
-
-<slot />

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

@@ -1,23 +0,0 @@
-import blockquote from './Blockquote.svelte';
-import a from './Link.svelte';
-export { a, blockquote };
-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;
-    };
-    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

@@ -1,5 +0,0 @@
-<!-- href provided by markdown/mdsvex -->
-<!-- svelte-ignore a11y-missing-attribute -->
-<a class="text-primary font-medium" {...$$restProps}>
-  <slot />
-</a>

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

@@ -1,39 +0,0 @@
-export default Link;
-type Link = SvelteComponent<$$__sveltets_2_PropsWithChildren<{
-    [x: string]: any;
-}, {
-    default: {};
-}>, {
-    [evt: string]: CustomEvent<any>;
-}, {
-    default: {};
-}> & {
-    $$bindings?: string | undefined;
-};
-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,78 +0,0 @@
-<script lang="ts">
-  import { onMount } from 'svelte';
-  import * as easings from 'svelte/easing';
-  import { MenuField } from 'svelte-ux';
-
-  let {
-    value = $bindable(),
-    amplitude = 1,
-    frequency = 10,
-    phase = 0,
-  }: {
-    value?: any;
-    amplitude?: number;
-    frequency?: number;
-    phase?: number;
-  } = $props();
-
-  const mathOptions = $derived([
-    {
-      label: 'sin',
-      group: 'math',
-      value: (x: number) => amplitude * Math.sin(x * frequency) + phase,
-    },
-    {
-      label: 'cos',
-      group: 'math',
-      value: (x: number) => amplitude * Math.cos(x * frequency) + phase,
-    },
-    {
-      label: 'tan',
-      group: 'math',
-      value: (x: number) => amplitude * Math.tan(x * frequency) + phase,
-    },
-    {
-      label: 'sqrt',
-      group: 'math',
-      value: (x: number) => amplitude * Math.sqrt(x * frequency) + phase,
-    },
-    {
-      label: 'ceil',
-      group: 'math',
-      value: (x: number) => amplitude * Math.ceil(x * frequency) + phase,
-    },
-    {
-      label: 'floor',
-      group: 'math',
-      value: (x: number) => amplitude * Math.floor(x * frequency) + phase,
-    },
-    {
-      label: 'round',
-      group: 'math',
-      value: (x: number) => amplitude * Math.round(x * frequency) + phase,
-    },
-    { label: 'random', group: 'math', value: (x: number) => amplitude * Math.random() + phase },
-    {
-      label: 'pow',
-      group: 'math',
-      value: (x: number) => amplitude * Math.pow(x, frequency) + phase,
-    },
-  ]);
-
-  const easingOptions = Object.entries(easings).map(([key, value]) => {
-    return {
-      label: key,
-      value,
-      group: 'easing',
-    };
-  });
-
-  const options = $derived([...mathOptions, ...easingOptions]);
-
-  // Select initial option
-  onMount(() => {
-    value = options[0].value;
-  });
-</script>
-
-<MenuField label="Path data" {options} bind:value stepper classes={{ menuIcon: 'hidden' }} />

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

@@ -1,9 +0,0 @@
-type $$ComponentProps = {
-    value?: any;
-    amplitude?: number;
-    frequency?: number;
-    phase?: number;
-};
-declare const PathDataMenuField: import("svelte").Component<$$ComponentProps, {}, "value">;
-type PathDataMenuField = ReturnType<typeof PathDataMenuField>;
-export default PathDataMenuField;