@sectile/vue 0.11.1 → 0.12.0

package/dist/chart.d.ts

@@ -0,0 +1,542 @@
+import type { StableID } from '@sectile/core';
+import type { RevisionSnapshot } from '@sectile/core/revision';
+import type { UnitID } from '@sectile/core/units';
+import { type ChartController } from '@sectile/chart/controller';
+import type { ChartAccessor, ChartAxisDomainInput, ChartAxisInputValue, ChartAxisViewUpdateMode, ChartAxisViewWindow, ChartHeatmapReduction, ChartViewState } from '@sectile/chart/contract';
+import type { ChartDefinition, ChartDefinitionState, ResolvedChartLayer } from '@sectile/chart/definition';
+import type { ChartCommand, ChartEvent, ChartSelection, ChartState } from '@sectile/chart/interaction';
+import type { ChartLimits, ChartModel, ChartPatch } from '@sectile/chart/model';
+import type { ChartProjection } from '@sectile/chart/projection';
+import type { ChartResult } from '@sectile/chart/result';
+import type { ChartScaleKind } from '@sectile/chart/scale';
+import type { ChartAxisViewCapability } from '@sectile/chart/view';
+import type { ResolvedChartAxis } from '@sectile/chart/layout';
+import { type DOMChartConnection, type DOMChartDragMode, type DOMChartOptions, type DOMChartWheelMode, type DOMChartWheelModifier } from '@sectile/dom/chart';
+import { type AllowedComponentProps, type ComponentCustomProps, type MaybeRefOrGetter, type PropType, type ShallowRef, type VNodeChild, type VNodeProps } from 'vue';
+export interface ChartWritableRef<T> {
+    value: T;
+}
+export type ChartReactiveModel<ID extends StableID = StableID> = MaybeRefOrGetter<ChartModel<ID>>;
+export type ChartReactiveDefinition<ID extends StableID = StableID> = MaybeRefOrGetter<ChartDefinition<any, ID>>;
+interface UseChartStateOptions<ID extends StableID> {
+    readonly limits?: ChartLimits;
+    readonly activeDatum?: ChartWritableRef<ID | null>;
+    readonly defaultActiveDatum?: ID | null;
+    readonly cursor?: ChartWritableRef<ID | null>;
+    readonly defaultCursor?: ID | null;
+    readonly selection?: ChartWritableRef<ChartSelection<ID>>;
+    readonly defaultSelection?: ChartSelection<ID>;
+    readonly view?: ChartWritableRef<ChartViewState<ID> | null>;
+    readonly defaultView?: ChartViewState<ID> | null;
+    readonly onActiveDatumChange?: (value: ID | null) => void;
+    readonly onCursorChange?: (value: ID | null) => void;
+    readonly onSelectionChange?: (value: ChartSelection<ID>) => void;
+    readonly onViewChange?: (value: ChartViewState<ID> | null) => void;
+    readonly onCommand?: (command: ChartCommand<ID>) => void;
+}
+export type UseChartOptions<ID extends StableID = StableID> = UseChartStateOptions<ID> & ({
+    readonly model: ChartReactiveModel<ID>;
+    readonly definition?: never;
+    readonly viewCapabilities?: never;
+} | {
+    readonly model?: never;
+    readonly definition: ChartReactiveDefinition<ID>;
+    readonly viewCapabilities?: MaybeRefOrGetter<readonly ChartAxisViewCapability<ID>[]>;
+});
+export interface UseChartResult<ID extends StableID = StableID> {
+    readonly controller: ChartController<ID>;
+    readonly snapshot: ShallowRef<RevisionSnapshot<ChartState<ID>>>;
+    readonly projection: ShallowRef<ChartProjection<ID> | null>;
+    readonly connection: ShallowRef<DOMChartConnection<ID> | null>;
+    replaceModel(model: ChartModel<ID>, expectedRevision?: number): ChartResult<RevisionSnapshot<ChartState<ID>>>;
+    replaceDefinition<Datum>(definition: ChartDefinition<Datum, ID>, viewCapabilities?: readonly ChartAxisViewCapability<ID>[], expectedRevision?: number): ChartResult<RevisionSnapshot<ChartState<ID>>>;
+    applyPatch(patch: ChartPatch<ID>, expectedRevision?: number): ChartResult<RevisionSnapshot<ChartState<ID>>>;
+    dispatch(event: ChartEvent<ID>, expectedRevision?: number): ChartResult<{
+        readonly snapshot: RevisionSnapshot<ChartState<ID>>;
+        readonly commands: readonly ChartCommand<ID>[];
+    }>;
+    syncControlledValues(): ChartResult<RevisionSnapshot<ChartState<ID>>>;
+    dispose(): void;
+}
+export interface ChartContext<ID extends StableID = StableID> {
+    readonly controller: Readonly<ShallowRef<ChartController<ID> | null>>;
+    readonly snapshot: Readonly<ShallowRef<RevisionSnapshot<ChartState<ID>> | null>>;
+    dispatch(event: ChartEvent<ID>): ChartResult<RevisionSnapshot<ChartState<ID>> | null>;
+    applyPatch(patch: ChartPatch<ID>): ChartResult<RevisionSnapshot<ChartState<ID>> | null>;
+}
+export declare function useChart<ID extends StableID>(options: UseChartOptions<ID>): UseChartResult<ID>;
+export interface ChartRootProps<ID extends StableID = StableID> {
+    readonly limits?: ChartLimits;
+    readonly modelValue?: ChartSelection<ID>;
+    readonly defaultModelValue?: ChartSelection<ID>;
+    readonly activeDatum?: ID | null;
+    readonly defaultActiveDatum?: ID | null;
+    readonly cursor?: ID | null;
+    readonly defaultCursor?: ID | null;
+    readonly view?: ChartViewState<ID> | null;
+    readonly defaultView?: ChartViewState<ID> | null;
+    readonly patch?: ChartPatch<ID> | null;
+    readonly dom?: Omit<DOMChartOptions<ID>, 'root' | 'canvas' | 'controller' | 'navigation'>;
+    readonly onError?: (error: unknown) => void;
+}
+export interface ChartRootSlotProps<ID extends StableID = StableID> {
+    readonly controller: ChartController<ID> | null;
+    readonly snapshot: RevisionSnapshot<ChartState<ID>> | null;
+    readonly state: ChartState<ID> | null;
+    readonly projection: ChartProjection<ID> | null;
+    readonly definition: ChartDefinitionState<ID> | null;
+}
+export interface ChartDeclarationDiagnostics {
+    readonly registeredRecords: number;
+    readonly publications: number;
+    readonly readRecords: number;
+}
+export type ChartRootPublicProps<ID extends StableID = StableID> = ChartRootProps<ID> & VNodeProps & AllowedComponentProps & ComponentCustomProps & {
+    readonly 'onUpdate:modelValue'?: (value: ChartSelection<ID>) => unknown;
+    readonly 'onUpdate:activeDatum'?: (value: ID | null) => unknown;
+    readonly 'onUpdate:cursor'?: (value: ID | null) => unknown;
+    readonly 'onUpdate:view'?: (value: ChartViewState<ID> | null) => unknown;
+    readonly onCommand?: (command: ChartCommand<ID>) => unknown;
+};
+export interface ChartRootComponent {
+    new <ID extends StableID = StableID>(props: ChartRootPublicProps<ID>): {
+        $props: ChartRootPublicProps<ID>;
+        $slots: {
+            default?: (props: ChartRootSlotProps<ID>) => VNodeChild;
+        };
+        readonly controller: ShallowRef<ChartController<ID> | null>;
+        getDeclarationDiagnostics(): ChartDeclarationDiagnostics;
+        refresh(): void;
+    };
+}
+export declare function useChartContext<ID extends StableID = StableID>(): ChartContext<ID>;
+export interface ChartProviderProps<ID extends StableID = StableID> {
+    readonly controller: ChartController<ID>;
+}
+export interface ChartProviderSlotProps<ID extends StableID = StableID> {
+    readonly controller: ChartController<ID>;
+    readonly snapshot: RevisionSnapshot<ChartState<ID>>;
+    readonly state: ChartState<ID>;
+    readonly definition: ChartDefinitionState<ID> | null;
+}
+export interface ChartProviderComponent {
+    new <ID extends StableID = StableID>(props: ChartProviderProps<ID>): {
+        $props: ChartProviderProps<ID>;
+        $slots: {
+            default?: (props: ChartProviderSlotProps<ID>) => VNodeChild;
+        };
+    };
+}
+export declare const ChartProvider: ChartProviderComponent;
+export type ChartSelectorFunction<ID extends StableID, Selected> = (state: ChartState<ID> | null) => Selected;
+export type ChartLayerSelectorFunction<ID extends StableID, Selected> = (layer: ResolvedChartLayer<ID> | null) => Selected;
+export type ChartAxisSelectorFunction<ID extends StableID, Selected> = (axis: ResolvedChartAxis<ID> | null) => Selected;
+export interface ChartSelectorOptions<Selected> {
+    readonly equals?: (previous: Selected, next: Selected) => boolean;
+}
+export declare function useChartSelector<ID extends StableID, Selected>(selector: ChartSelectorFunction<ID, Selected>, options?: ChartSelectorOptions<Selected>): Readonly<ShallowRef<Selected>>;
+export declare function useChartLayerSelector<ID extends StableID, Selected>(id: ID, selector: ChartLayerSelectorFunction<ID, Selected>, options?: ChartSelectorOptions<Selected>): Readonly<ShallowRef<Selected>>;
+export declare function useChartAxisSelector<ID extends StableID, Selected>(id: ID, selector: ChartAxisSelectorFunction<ID, Selected>, options?: ChartSelectorOptions<Selected>): Readonly<ShallowRef<Selected>>;
+export declare const ChartRoot: ChartRootComponent;
+export declare const ChartCartesian: import("vue").DefineComponent<{}, () => VNodeChild, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export declare const ChartRadial: import("vue").DefineComponent<{}, () => VNodeChild, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export interface ChartAxisProps<ID extends StableID = StableID> {
+    readonly id: ID;
+    readonly scale?: ChartScaleKind;
+    readonly domain?: ChartAxisDomainInput;
+    readonly field?: string;
+    readonly getValue?: ChartAccessor<any, ChartAxisInputValue>;
+    readonly ticks?: number;
+    readonly label?: string;
+    readonly unit?: UnitID;
+}
+export declare const ChartXAxis: GenericSemanticComponent<ChartAxisProps>;
+export declare const ChartYAxis: GenericSemanticComponent<ChartAxisProps>;
+interface GenericSemanticComponent<Props> {
+    new <ID extends StableID = StableID>(props: Props & {
+        readonly id: ID;
+    } & VNodeProps & AllowedComponentProps & ComponentCustomProps): {
+        $props: Props & {
+            readonly id: ID;
+        };
+    };
+}
+interface ChartLayerBaseProps<Datum, ID extends StableID> {
+    readonly id: ID;
+    readonly data: readonly Datum[];
+    readonly getId?: ChartAccessor<Datum, ID>;
+    readonly label?: string;
+}
+export interface ChartCartesianLayerProps<Datum = unknown, ID extends StableID = StableID> extends ChartLayerBaseProps<Datum, ID> {
+    readonly xAxis: ID;
+    readonly yAxis: ID;
+    readonly getX?: ChartAccessor<Datum, ChartAxisInputValue>;
+    readonly getY?: ChartAccessor<Datum, ChartAxisInputValue>;
+}
+export interface ChartScatterProps<Datum = unknown, ID extends StableID = StableID> extends ChartCartesianLayerProps<Datum, ID> {
+    readonly projection?: 'raw' | 'density';
+}
+export interface ChartBarProps<Datum = unknown, ID extends StableID = StableID> extends ChartCartesianLayerProps<Datum, ID> {
+    readonly orientation?: 'vertical' | 'horizontal';
+}
+export interface ChartHeatmapProps<Datum = unknown, ID extends StableID = StableID> extends ChartCartesianLayerProps<Datum, ID> {
+    readonly getValue?: ChartAccessor<Datum, number>;
+    readonly valueField?: string;
+    readonly projection?: 'raw' | {
+        readonly kind: 'aggregate';
+        readonly reduction: ChartHeatmapReduction;
+    };
+}
+export interface ChartRadialLayerProps<Datum = unknown, ID extends StableID = StableID> extends ChartLayerBaseProps<Datum, ID> {
+    readonly getValue?: ChartAccessor<Datum, number>;
+    readonly valueField?: string;
+    readonly getLabel?: ChartAccessor<Datum, string>;
+    readonly labelField?: string;
+}
+export interface ChartDonutProps<Datum = unknown, ID extends StableID = StableID> extends ChartRadialLayerProps<Datum, ID> {
+    readonly innerRadius?: number;
+    readonly outerRadius?: number;
+}
+type ChartSemanticPublicProps<Props> = Props & VNodeProps & AllowedComponentProps & ComponentCustomProps;
+export interface ChartLineComponent {
+    new <Datum = unknown, ID extends StableID = StableID>(props: ChartSemanticPublicProps<ChartCartesianLayerProps<Datum, ID>>): {
+        $props: ChartCartesianLayerProps<Datum, ID>;
+    };
+}
+export interface ChartScatterComponent {
+    new <Datum = unknown, ID extends StableID = StableID>(props: ChartSemanticPublicProps<ChartScatterProps<Datum, ID>>): {
+        $props: ChartScatterProps<Datum, ID>;
+    };
+}
+export interface ChartBarComponent {
+    new <Datum = unknown, ID extends StableID = StableID>(props: ChartSemanticPublicProps<ChartBarProps<Datum, ID>>): {
+        $props: ChartBarProps<Datum, ID>;
+    };
+}
+export interface ChartHeatmapComponent {
+    new <Datum = unknown, ID extends StableID = StableID>(props: ChartSemanticPublicProps<ChartHeatmapProps<Datum, ID>>): {
+        $props: ChartHeatmapProps<Datum, ID>;
+    };
+}
+export interface ChartPieComponent {
+    new <Datum = unknown, ID extends StableID = StableID>(props: ChartSemanticPublicProps<ChartRadialLayerProps<Datum, ID>>): {
+        $props: ChartRadialLayerProps<Datum, ID>;
+    };
+}
+export interface ChartDonutComponent {
+    new <Datum = unknown, ID extends StableID = StableID>(props: ChartSemanticPublicProps<ChartDonutProps<Datum, ID>>): {
+        $props: ChartDonutProps<Datum, ID>;
+    };
+}
+export declare const ChartLine: ChartLineComponent;
+export declare const ChartScatter: ChartScatterComponent;
+export declare const ChartBar: ChartBarComponent;
+export declare const ChartBars: ChartBarComponent;
+export declare const ChartHeatmap: ChartHeatmapComponent;
+export declare const ChartPie: ChartPieComponent;
+export declare const ChartDonut: ChartDonutComponent;
+export interface ChartAxisViewProps<ID extends StableID = StableID> {
+    readonly axis?: ID;
+    readonly initial?: ChartAxisViewWindow;
+    readonly minimumSpan?: number;
+    readonly maximumSpan?: number;
+    readonly update?: ChartAxisViewUpdateMode;
+}
+export declare const ChartAxisView: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    axis: {
+        type: PropType<StableID>;
+        default: undefined;
+    };
+    initial: {
+        type: PropType<ChartAxisViewWindow>;
+        default: undefined;
+    };
+    minimumSpan: {
+        type: NumberConstructor;
+        default: undefined;
+    };
+    maximumSpan: {
+        type: NumberConstructor;
+        default: undefined;
+    };
+    update: {
+        type: PropType<ChartAxisViewUpdateMode>;
+        default: string;
+    };
+}>, () => null, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    axis: {
+        type: PropType<StableID>;
+        default: undefined;
+    };
+    initial: {
+        type: PropType<ChartAxisViewWindow>;
+        default: undefined;
+    };
+    minimumSpan: {
+        type: NumberConstructor;
+        default: undefined;
+    };
+    maximumSpan: {
+        type: NumberConstructor;
+        default: undefined;
+    };
+    update: {
+        type: PropType<ChartAxisViewUpdateMode>;
+        default: string;
+    };
+}>> & Readonly<{}>, {
+    axis: StableID;
+    initial: ChartAxisViewWindow;
+    minimumSpan: number;
+    maximumSpan: number;
+    update: ChartAxisViewUpdateMode;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export interface ChartNavigationProps<ID extends StableID = StableID> {
+    readonly axes?: readonly ID[];
+    readonly drag?: DOMChartDragMode;
+    readonly wheel?: DOMChartWheelMode;
+    readonly wheelModifier?: DOMChartWheelModifier;
+    readonly pinch?: boolean;
+    readonly keyboard?: boolean;
+}
+export declare const ChartNavigation: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    axes: {
+        type: PropType<readonly StableID[]>;
+        default: undefined;
+    };
+    drag: {
+        type: PropType<DOMChartDragMode>;
+        default: string;
+    };
+    wheel: {
+        type: PropType<DOMChartWheelMode>;
+        default: string;
+    };
+    wheelModifier: {
+        type: PropType<DOMChartWheelModifier>;
+        default: string;
+    };
+    pinch: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    keyboard: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>, () => null, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    axes: {
+        type: PropType<readonly StableID[]>;
+        default: undefined;
+    };
+    drag: {
+        type: PropType<DOMChartDragMode>;
+        default: string;
+    };
+    wheel: {
+        type: PropType<DOMChartWheelMode>;
+        default: string;
+    };
+    wheelModifier: {
+        type: PropType<DOMChartWheelModifier>;
+        default: string;
+    };
+    pinch: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    keyboard: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>> & Readonly<{}>, {
+    axes: readonly StableID[];
+    drag: DOMChartDragMode;
+    wheel: DOMChartWheelMode;
+    wheelModifier: DOMChartWheelModifier;
+    pinch: boolean;
+    keyboard: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export declare const ChartViewControls: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    axis: {
+        type: PropType<StableID>;
+        default: undefined;
+    };
+}>, () => VNodeChild, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    axis: {
+        type: PropType<StableID>;
+        default: undefined;
+    };
+}>> & Readonly<{}>, {
+    axis: StableID;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export declare const ChartExternalViewControls: import("vue").DefineComponent<{}, () => null, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export declare const ChartPanControl: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    axis: {
+        type: PropType<StableID>;
+        default: undefined;
+    };
+    label: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    direction: {
+        type: PropType<'backward' | 'forward'>;
+        required: true;
+    };
+    step: {
+        type: NumberConstructor;
+        default: number;
+    };
+}>, () => VNodeChild, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    axis: {
+        type: PropType<StableID>;
+        default: undefined;
+    };
+    label: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    direction: {
+        type: PropType<'backward' | 'forward'>;
+        required: true;
+    };
+    step: {
+        type: NumberConstructor;
+        default: number;
+    };
+}>> & Readonly<{}>, {
+    axis: StableID;
+    label: string;
+    step: number;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export declare const ChartZoomControl: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    axis: {
+        type: PropType<StableID>;
+        default: undefined;
+    };
+    label: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    direction: {
+        type: PropType<'in' | 'out'>;
+        required: true;
+    };
+    factor: {
+        type: NumberConstructor;
+        default: number;
+    };
+}>, () => VNodeChild, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    axis: {
+        type: PropType<StableID>;
+        default: undefined;
+    };
+    label: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    direction: {
+        type: PropType<'in' | 'out'>;
+        required: true;
+    };
+    factor: {
+        type: NumberConstructor;
+        default: number;
+    };
+}>> & Readonly<{}>, {
+    axis: StableID;
+    label: string;
+    factor: number;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export declare const ChartResetView: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    axis: {
+        type: PropType<StableID>;
+        default: undefined;
+    };
+    label: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    to: {
+        type: PropType<'initial' | 'latest'>;
+        default: string;
+    };
+}>, () => VNodeChild, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    axis: {
+        type: PropType<StableID>;
+        default: undefined;
+    };
+    label: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    to: {
+        type: PropType<'initial' | 'latest'>;
+        default: string;
+    };
+}>> & Readonly<{}>, {
+    axis: StableID;
+    label: string;
+    to: "initial" | "latest";
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export declare const ChartPlot: import("vue").DefineComponent<{}, () => VNodeChild, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export declare const ChartRenderer: import("vue").DefineComponent<{}, () => VNodeChild, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export declare const ChartCanvas: import("vue").DefineComponent<{}, () => VNodeChild, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export declare const ChartGrid: import("vue").DefineComponent<{}, () => null, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export declare const ChartGridLines: import("vue").DefineComponent<{}, () => null, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export declare const ChartLegend: import("vue").DefineComponent<{}, () => null, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export declare const ChartAxisTicks: import("vue").DefineComponent<{}, () => null, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export declare const ChartTicks: import("vue").DefineComponent<{}, () => null, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export type ChartBoundProviderPublicProps = VNodeProps & AllowedComponentProps & ComponentCustomProps;
+export interface ChartBoundProviderComponent<ID extends StableID = StableID> {
+    new (props: ChartBoundProviderPublicProps): {
+        $props: ChartBoundProviderPublicProps;
+        $slots: {
+            default?: (props: ChartProviderSlotProps<ID>) => VNodeChild;
+        };
+    };
+}
+export interface ChartBoundRootComponent<ID extends StableID = StableID> {
+    new (props: ChartRootPublicProps<ID>): {
+        $props: ChartRootPublicProps<ID>;
+        $slots: {
+            default?: (props: ChartRootSlotProps<ID>) => VNodeChild;
+        };
+        readonly controller: ShallowRef<ChartController<ID> | null>;
+        getDeclarationDiagnostics(): ChartDeclarationDiagnostics;
+        refresh(): void;
+    };
+}
+export interface ChartComponents<ID extends StableID = StableID> {
+    readonly Provider: ChartBoundProviderComponent<ID>;
+    readonly Root: ChartBoundRootComponent<ID>;
+    readonly Cartesian: typeof ChartCartesian;
+    readonly Radial: typeof ChartRadial;
+    readonly XAxis: typeof ChartXAxis;
+    readonly YAxis: typeof ChartYAxis;
+    readonly AxisView: typeof ChartAxisView;
+    readonly Line: typeof ChartLine;
+    readonly Scatter: typeof ChartScatter;
+    readonly Bar: typeof ChartBar;
+    readonly Bars: typeof ChartBars;
+    readonly Heatmap: typeof ChartHeatmap;
+    readonly Pie: typeof ChartPie;
+    readonly Donut: typeof ChartDonut;
+    readonly Navigation: typeof ChartNavigation;
+    readonly ViewControls: typeof ChartViewControls;
+    readonly ExternalViewControls: typeof ChartExternalViewControls;
+    readonly PanControl: typeof ChartPanControl;
+    readonly ZoomControl: typeof ChartZoomControl;
+    readonly ResetView: typeof ChartResetView;
+    readonly Plot: typeof ChartPlot;
+    readonly Renderer: typeof ChartRenderer;
+    readonly Canvas: typeof ChartCanvas;
+    readonly Grid: typeof ChartGrid;
+    readonly GridLines: typeof ChartGridLines;
+    readonly Legend: typeof ChartLegend;
+    readonly AxisTicks: typeof ChartAxisTicks;
+    readonly Ticks: typeof ChartTicks;
+}
+export declare function createChartComponents<ID extends StableID>(controller: ChartController<ID>): ChartComponents<ID>;
+export {};

package/dist/chart.js

@@ -0,0 +1,2 @@
+import{createChartController}from"@sectile/chart/controller";import{createDOMChart}from"@sectile/dom/chart";import{defineComponent,getCurrentScope,h,inject,nextTick,onBeforeUnmount,onMounted,onScopeDispose,provide,shallowRef,toValue,watch}from"vue";function useChart(options){if(options===null||typeof options!=="object")throw new TypeError("useChart options must be an object.");if(options.model===void 0===(options.definition===void 0)){throw new TypeError("useChart requires exactly one model or declarative definition.")}assertControlledDefaults(options);const controlled=controlledValues(options);const source=options.definition===void 0?{model:toValue(options.model)}:{definition:toValue(options.definition),viewCapabilities:toValue(options.viewCapabilities??(()=>Object.freeze([])))};const controller=createChartController({...source,...options.limits===void 0?{}:{limits:options.limits},...defaultValues(options),...Object.keys(controlled).length===0?{}:{controlled}});const binding=bindController(controller,options,true);const stops=[];if(options.model!==void 0){stops.push(watch(()=>toValue(options.model),model=>{binding.replaceModel(model)},{deep:false}))}else{stops.push(watch(()=>[toValue(options.definition),toValue(options.viewCapabilities??(()=>Object.freeze([])))],([definition,capabilities])=>{binding.replaceDefinition(definition,capabilities)},{deep:false}))}for(const sourceRef of[options.activeDatum,options.cursor,options.selection,options.view]){if(sourceRef!==void 0)stops.push(watch(()=>sourceRef.value,()=>{binding.syncControlledValues()},{deep:false}))}const disposeBinding=binding.dispose;const result=Object.freeze({...binding,dispose(){for(const stop of stops.splice(0))stop();disposeBinding()}});if(getCurrentScope()!==void 0)onScopeDispose(result.dispose);return result}class ChartDeclarations{#records=new Map;#publish;#token=0;#scheduled=false;#active=true;#publications=0;#readRecords=0;constructor(publish){this.#publish=publish}register(kind,read){const token=++this.#token;this.#records.set(token,{token,kind,read});this.schedule();let active=true;return Object.freeze({touch:()=>{if(active)this.schedule()},dispose:()=>{if(!active)return;active=false;this.#records.delete(token);this.schedule()}})}publishNow(){if(!this.#active)return;this.#scheduled=false;this.#publish(this.assemble());this.#publications+=1}getDiagnostics(){return Object.freeze({registeredRecords:this.#records.size,publications:this.#publications,readRecords:this.#readRecords})}schedule(){if(!this.#active||this.#scheduled)return;this.#scheduled=true;void nextTick(()=>{if(this.#scheduled)this.publishNow()})}assemble(){const records=[...this.#records.values()].sort((left,right)=>left.token-right.token);this.#readRecords=records.length;const coordinates=records.filter(record=>record.kind==="coordinate");if(coordinates.length!==1)throw new TypeError("ChartRoot requires exactly one ChartCartesian or ChartRadial coordinate.");const coordinate=coordinates[0]?.read();const axes=records.filter(record=>record.kind==="axis").map(record=>record.read());const layers=records.filter(record=>record.kind==="layer").map(record=>record.read());const capabilities=records.filter(record=>record.kind==="view").map(record=>record.read());const navigationRecords=records.filter(record=>record.kind==="navigation");if(navigationRecords.length>1)throw new TypeError("ChartRoot accepts at most one ChartNavigation declaration.");const controls=records.filter(record=>record.kind==="controls").map(record=>record.read());const navigation=navigationRecords[0]?.read();const alternative=controls.includes("built-in")?"built-in":controls.includes("external")?"external":void 0;if(navigation!==void 0&&((navigation.drag??"none")!=="none"||navigation.pinch===true)&&alternative===void 0){throw new TypeError("Chart direct gestures require ChartViewControls or ChartExternalViewControls.")}return Object.freeze({definition:Object.freeze({coordinate:coordinate.kind==="cartesian"?Object.freeze({kind:"cartesian",axes:Object.freeze(axes)}):Object.freeze({kind:"radial"}),layers:Object.freeze(layers)}),viewCapabilities:Object.freeze(capabilities),navigation:Object.freeze({...navigation??{},...alternative===void 0?{}:{controlAlternative:alternative}})})}dispose(){if(!this.#active)return;this.#active=false;this.#scheduled=false;this.#records.clear()}}const chartKey=Symbol("SectileChart");const chartPublicKey=Symbol("SectileChartPublic");const chartOwnerKey=Symbol("SectileChartOwner");const chartAxisKey=Symbol("SectileChartAxis");const chartControlAxisKey=Symbol("SectileChartControlAxis");function useInternalChart(){const context=inject(chartKey);if(context===void 0)throw new TypeError("Chart component must be used inside ChartRoot.");return context}function useChartContext(){const context=inject(chartPublicKey);if(context===void 0)throw new TypeError("useChartContext must be used inside ChartRoot or ChartProvider.");return context}const ChartProviderRuntime=defineComponent({name:"SectileChartProvider",props:{controller:{type:Object,required:true}},setup(props,{slots}){const controller=shallowRef(props.controller);const snapshot=shallowRef(controller.value.getSnapshot());const unsubscribe=controller.value.subscribeSnapshots(next=>{snapshot.value=next});const owner=Object.freeze({controller});const context=Object.freeze({controller,snapshot,dispatch(event){const result=controller.value.dispatch(event);return result.ok?Object.freeze({ok:true,value:result.value.snapshot}):result},applyPatch(patch){return controller.value.applyPatch(patch)}});provide(chartOwnerKey,owner);provide(chartPublicKey,context);onScopeDispose(unsubscribe);return()=>slots["default"]?.({controller:controller.value,snapshot:snapshot.value,state:snapshot.value.state,definition:controller.value.getDefinition()})??null}});const ChartProvider=ChartProviderRuntime;function useChartSelector(selector,options={}){const context=useChartContext();return useChartContextSelector(context,()=>selector(context.snapshot.value?.state??null),options.equals)}function useChartLayerSelector(id,selector,options={}){const context=useChartContext();return useChartContextSelector(context,()=>{const layers=context.controller.value?.getDefinition()?.layers;return selector(layers?.find(layer=>layer.id===id)??null)},options.equals)}function useChartAxisSelector(id,selector,options={}){const context=useChartContext();return useChartContextSelector(context,()=>{const axes=context.controller.value?.getDefinition()?.axes;return selector(axes?.find(axis=>axis.id===id)??null)},options.equals)}function useChartContextSelector(context,read,equals=Object.is){const selected=shallowRef(read());const stop=watch([context.controller,context.snapshot],()=>{const next=read();if(!equals(selected.value,next))selected.value=next},{deep:false,flush:"sync"});onScopeDispose(stop);return selected}const ChartRootRuntime=defineComponent({name:"SectileChartRoot",inheritAttrs:false,props:{limits:{type:Object,default:void 0},modelValue:{type:Object,default:void 0},defaultModelValue:{type:Object,default:void 0},activeDatum:{type:[String,Number],default:void 0},defaultActiveDatum:{type:[String,Number],default:void 0},cursor:{type:[String,Number],default:void 0},defaultCursor:{type:[String,Number],default:void 0},view:{type:Object,default:void 0},defaultView:{type:Object,default:void 0},patch:{type:Object,default:void 0},dom:{type:Object,default:void 0},onError:{type:Function,default:void 0}},emits:{"update:modelValue":_value=>true,"update:activeDatum":_value=>true,"update:cursor":_value=>true,"update:view":_value=>true,command:_command=>true},setup(props,{attrs,emit,expose,slots}){assertRootControlledDefaults(props);const ownerContext=inject(chartOwnerKey,void 0);const ownsController=ownerContext===void 0;const root=shallowRef(null);const canvas=shallowRef(null);const controller=shallowRef(ownerContext?.controller.value??null);const snapshot=shallowRef(controller.value?.getSnapshot()??null);const projection=shallowRef(null);const connection=shallowRef(null);let assembled=null;let unsubscribeCommands=null;let unsubscribeSnapshots=null;let previousState=snapshot.value?.state??null;let mounted=false;let definitionAccepted=false;const controlled=Object.freeze({activeDatum:props.activeDatum!==void 0,cursor:props.cursor!==void 0,selection:props.modelValue!==void 0,view:props.view!==void 0});const report=error=>{if(props.onError!==void 0)props.onError(error);else throw error};const publishSnapshot=()=>{const owner=controller.value;if(owner===null)return;const current=owner.getSnapshot();if(snapshot.value===current)return;const prior=previousState;snapshot.value=current;previousState=current.state;if(prior!==null){if(!controlled.activeDatum&&prior.activeDatum!==current.state.activeDatum)emit("update:activeDatum",current.state.activeDatum);if(!controlled.cursor&&prior.cursor!==current.state.cursor)emit("update:cursor",current.state.cursor);if(!controlled.selection&&prior.selection!==current.state.selection)emit("update:modelValue",current.state.selection);if(!controlled.view&&prior.view!==current.state.view)emit("update:view",current.state.view)}};const onCommand=command=>{emit("command",command);if(command.type==="active-change-requested")emit("update:activeDatum",command.id);else if(command.type==="cursor-change-requested")emit("update:cursor",command.id);else if(command.type==="selection-change-requested")emit("update:modelValue",command.selection);else if(command.type==="view-change-requested")emit("update:view",command.view);publishSnapshot()};const connect=()=>{const owner=controller.value;if(!mounted||owner===null||root.value===null||canvas.value===null||connection.value!==null)return;const dom=props.dom??{};try{connection.value=createDOMChart({...dom,root:root.value,canvas:canvas.value,controller:owner,...assembled===null?{}:{navigation:assembled.navigation},onCommand:command=>{dom.onCommand?.(command)},onProjectionChange:next=>{projection.value=next;dom.onProjectionChange?.(next)}});projection.value=connection.value.getProjection()}catch(error){report(error)}};const publishDefinition=next=>{assembled=next;definitionAccepted=false;const owner=controller.value;if(!mounted||owner===null)return;const replaced=owner.replaceDefinition(next.definition,next.viewCapabilities);if(!replaced.ok){report(new TypeError(`${replaced.error.code}: ${replaced.error.message}`));return}definitionAccepted=true;publishSnapshot();const navigation=connection.value?.setNavigation(next.navigation);if(navigation!==void 0&&!navigation.ok)report(new TypeError(`${navigation.error.code}: ${navigation.error.message}`));connection.value?.refresh()};const declarations=new ChartDeclarations(next=>{try{publishDefinition(next)}catch(error){report(error)}});const context=Object.freeze({declarations,controller,canvas,dispatch(event){const result=controller.value?.dispatch(event);if(result!==void 0&&!result.ok)report(new TypeError(`${result.error.code}: ${result.error.message}`));publishSnapshot()}});provide(chartKey,context);const publicContext=Object.freeze({controller,snapshot,dispatch(event){const result=controller.value?.dispatch(event);if(result===void 0)return Object.freeze({ok:true,value:null});publishSnapshot();return result.ok?Object.freeze({ok:true,value:result.value.snapshot}):result},applyPatch(patch){const result=controller.value?.applyPatch(patch);if(result===void 0)return Object.freeze({ok:true,value:null});publishSnapshot();return result}});provide(chartPublicKey,publicContext);const syncControlled=()=>{const owner=controller.value;if(owner===null)return;const result=owner.syncControlledValues(Object.freeze({...controlled.activeDatum?{activeDatum:props.activeDatum??null}:{},...controlled.cursor?{cursor:props.cursor??null}:{},...controlled.selection?{selection:props.modelValue}:{},...controlled.view?{view:props.view??null}:{}}));if(!result.ok)report(new TypeError(`${result.error.code}: ${result.error.message}`));publishSnapshot()};watch(()=>[props.activeDatum,props.cursor,props.modelValue,props.view],syncControlled,{deep:false});watch(()=>props.patch,patch=>{if(patch===null||patch===void 0||controller.value===null)return;const result=controller.value.applyPatch(patch);if(!result.ok)report(new TypeError(`${result.error.code}: ${result.error.message}`));publishSnapshot()},{deep:false});watch(()=>props.dom?.accessibilityLabel,label=>{connection.value?.setAccessibilityLabel(label)},{flush:"post"});onMounted(()=>{mounted=true;try{declarations.publishNow();const next=assembled;const controlledValues2=Object.freeze({...controlled.activeDatum?{activeDatum:props.activeDatum??null}:{},...controlled.cursor?{cursor:props.cursor??null}:{},...controlled.selection?{selection:props.modelValue}:{},...controlled.view?{view:props.view??null}:{}});const initialValues=Object.freeze({...!controlled.activeDatum&&props.defaultActiveDatum!==void 0?{activeDatum:props.defaultActiveDatum}:{},...!controlled.cursor&&props.defaultCursor!==void 0?{cursor:props.defaultCursor}:{},...!controlled.selection&&props.defaultModelValue!==void 0?{selection:props.defaultModelValue}:{},...!controlled.view&&props.defaultView!==void 0?{view:props.defaultView}:{}});if(ownerContext===void 0){controller.value=createChartController({definition:next.definition,viewCapabilities:next.viewCapabilities,...props.limits===void 0?{}:{limits:props.limits},...Object.keys(controlledValues2).length===0?{}:{controlled:controlledValues2},...Object.keys(initialValues).length===0?{}:{initialValues}})}else{const borrowed=ownerContext.controller.value;if(!definitionAccepted)return;controller.value=borrowed;if(Object.keys(controlledValues2).length!==0){const synced=borrowed.syncControlledValues(controlledValues2);if(!synced.ok)throw new TypeError(`${synced.error.code}: ${synced.error.message}`)}}snapshot.value=controller.value.getSnapshot();previousState=snapshot.value.state;unsubscribeCommands=controller.value.subscribeCommands(onCommand);unsubscribeSnapshots=controller.value.subscribeSnapshots(()=>{publishSnapshot()});void nextTick(connect)}catch(error){report(error)}});onBeforeUnmount(()=>{mounted=false;declarations.dispose();connection.value?.disconnect();connection.value=null;unsubscribeCommands?.();unsubscribeCommands=null;unsubscribeSnapshots?.();unsubscribeSnapshots=null;if(ownsController)controller.value?.dispose();controller.value=null});expose({controller,getDeclarationDiagnostics:()=>declarations.getDiagnostics(),refresh:()=>connection.value?.refresh()});return()=>h("div",{...attrs,ref:element=>{root.value=element},"data-scope":"chart","data-part":"root"},slots["default"]?.({controller:controller.value,snapshot:snapshot.value,state:snapshot.value?.state??null,projection:projection.value,definition:controller.value?.getDefinition()??null}))}});const ChartRoot=ChartRootRuntime;const coordinateProps={};const ChartCartesian=defineComponent({name:"SectileChartCartesian",props:coordinateProps,setup(_props,{slots}){const context=useInternalChart();const record=context.declarations.register("coordinate",()=>Object.freeze({kind:"cartesian"}));onBeforeUnmount(record.dispose);return()=>slots["default"]?.()??null}});const ChartRadial=defineComponent({name:"SectileChartRadial",props:coordinateProps,setup(_props,{slots}){const context=useInternalChart();const record=context.declarations.register("coordinate",()=>Object.freeze({kind:"radial"}));onBeforeUnmount(record.dispose);return()=>slots["default"]?.()??null}});const axisProps={id:{type:[String,Number],required:true},scale:{type:String,default:"linear"},domain:{type:[String,Object],default:"auto"},field:{type:String,default:void 0},getValue:{type:Function,default:void 0},ticks:{type:Number,default:void 0},label:{type:String,default:void 0},unit:{type:String,default:void 0}};function axisComponent(orientation){return defineComponent({name:orientation==="x"?"SectileChartXAxis":"SectileChartYAxis",props:axisProps,setup(props,{slots}){const context=useInternalChart();const axis=shallowRef(props.id);provide(chartAxisKey,axis);const value=shallowRef(axisDefinition(props,orientation));const record=context.declarations.register("axis",()=>value.value);watch(()=>[props.id,props.scale,props.domain,props.field,props.getValue,props.ticks,props.label,props.unit],()=>{axis.value=props.id;value.value=axisDefinition(props,orientation);record.touch()},{deep:false,flush:"post"});onBeforeUnmount(record.dispose);return()=>slots["default"]?.()??null}})}const ChartXAxis=axisComponent("x");const ChartYAxis=axisComponent("y");function axisDefinition(props,orientation){return defined({id:props["id"],orientation,scale:props["scale"],domain:props["domain"],field:props["field"],getValue:props["getValue"],ticks:props["ticks"],label:props["label"],unit:props["unit"]})}const layerBaseProps={id:{type:[String,Number],required:true},data:{type:Array,required:true},getId:{type:Function,default:void 0},label:{type:String,default:void 0}};const cartesianLayerProps={...layerBaseProps,xAxis:{type:[String,Number],required:true},yAxis:{type:[String,Number],required:true},getX:{type:Function,default:void 0},getY:{type:Function,default:void 0}};function layerComponent(kind,extraProps={}){return defineComponent({name:`SectileChart${kind[0]?.toUpperCase()}${kind.slice(1)}`,props:{...kind==="pie"||kind==="donut"?layerBaseProps:cartesianLayerProps,...extraProps},setup(props){const context=useInternalChart();const value=shallowRef(layerDefinition(props,kind));const record=context.declarations.register("layer",()=>value.value);watch(()=>Object.values(props),()=>{value.value=layerDefinition(props,kind);record.touch()},{deep:false,flush:"post"});onBeforeUnmount(record.dispose);return()=>null}})}const ChartLine=layerComponent("line");const ChartScatter=layerComponent("scatter",{projection:{type:String,default:"raw"}});const ChartBar=layerComponent("bar",{orientation:{type:String,default:"vertical"}});const ChartBars=ChartBar;const ChartHeatmap=layerComponent("heatmap",{getValue:{type:Function,default:void 0},valueField:{type:String,default:void 0},projection:{type:[String,Object],default:"raw"}});const ChartPie=layerComponent("pie",{getValue:{type:Function,default:void 0},valueField:{type:String,default:void 0},getLabel:{type:Function,default:void 0},labelField:{type:String,default:void 0}});const ChartDonut=layerComponent("donut",{getValue:{type:Function,default:void 0},valueField:{type:String,default:void 0},getLabel:{type:Function,default:void 0},labelField:{type:String,default:void 0},innerRadius:{type:Number,default:.5},outerRadius:{type:Number,default:1}});function layerDefinition(props,kind){return defined({kind,id:props["id"],data:props["data"],getId:props["getId"],label:props["label"],xAxis:props["xAxis"],yAxis:props["yAxis"],getX:props["getX"],getY:props["getY"],projection:props["projection"],orientation:props["orientation"],getValue:props["getValue"],valueField:props["valueField"],getLabel:props["getLabel"],labelField:props["labelField"],innerRadius:props["innerRadius"],outerRadius:props["outerRadius"]})}const ChartAxisView=defineComponent({name:"SectileChartAxisView",props:{axis:{type:[String,Number],default:void 0},initial:{type:Object,default:void 0},minimumSpan:{type:Number,default:void 0},maximumSpan:{type:Number,default:void 0},update:{type:String,default:"preserve"}},setup(props){const context=useInternalChart();const inheritedAxis=inject(chartAxisKey,void 0);const read=()=>viewCapability(props,inheritedAxis?.value);const value=shallowRef(read());const record=context.declarations.register("view",()=>value.value);watch(()=>[props.axis,inheritedAxis?.value,props.initial,props.minimumSpan,props.maximumSpan,props.update],()=>{value.value=read();record.touch()},{deep:false,flush:"post"});onBeforeUnmount(record.dispose);return()=>null}});function viewCapability(props,inheritedAxis){const axisID=props["axis"]??inheritedAxis;if(axisID===void 0)throw new TypeError("ChartAxisView requires an axis prop or an enclosing ChartXAxis or ChartYAxis.");return Object.freeze(defined({axisID,initial:props["initial"],minimumSpan:props["minimumSpan"],maximumSpan:props["maximumSpan"],update:props["update"]}))}const ChartNavigation=defineComponent({name:"SectileChartNavigation",props:{axes:{type:Array,default:void 0},drag:{type:String,default:"none"},wheel:{type:String,default:"native"},wheelModifier:{type:String,default:"none"},pinch:{type:Boolean,default:false},keyboard:{type:Boolean,default:false}},setup(props){const context=useInternalChart();const value=shallowRef(navigationDefinition(props));const record=context.declarations.register("navigation",()=>value.value);watch(()=>[props.axes,props.drag,props.wheel,props.wheelModifier,props.pinch,props.keyboard],()=>{const next=navigationDefinition(props);if(sameNavigation(value.value,next))return;value.value=next;record.touch()},{deep:false,flush:"post"});onBeforeUnmount(record.dispose);return()=>null}});function navigationDefinition(props){return Object.freeze(defined({axes:props["axes"],drag:props["drag"],wheel:props["wheel"],wheelModifier:props["wheelModifier"],pinch:props["pinch"],keyboard:props["keyboard"]}))}function sameNavigation(left,right){return sameStableIDs(left.axes,right.axes)&&left.drag===right.drag&&left.wheel===right.wheel&&left.wheelModifier===right.wheelModifier&&left.pinch===right.pinch&&left.keyboard===right.keyboard}function sameStableIDs(left,right){if(left===right)return true;if(left===void 0||right===void 0||left.length!==right.length)return false;for(let index=0;index<left.length;index+=1)if(left[index]!==right[index])return false;return true}const ChartViewControls=defineComponent({name:"SectileChartViewControls",inheritAttrs:false,props:{axis:{type:[String,Number],default:void 0}},setup(props,{attrs,slots}){const context=useInternalChart();const inheritedAxis=inject(chartAxisKey,void 0);const initialAxis=props.axis??inheritedAxis?.value;if(initialAxis===void 0)throw new TypeError("ChartViewControls requires an axis prop or an enclosing ChartXAxis or ChartYAxis.");const axis=shallowRef(initialAxis);provide(chartControlAxisKey,axis);watch(()=>[props.axis,inheritedAxis?.value],()=>{axis.value=props.axis??inheritedAxis?.value},{deep:false,flush:"sync"});const record=context.declarations.register("controls",()=>"built-in");onBeforeUnmount(record.dispose);return()=>h("div",{...attrs,"data-scope":"chart","data-part":"view-controls"},slots["default"]?.())}});const ChartExternalViewControls=defineComponent({name:"SectileChartExternalViewControls",setup(){const context=useInternalChart();const record=context.declarations.register("controls",()=>"external");onBeforeUnmount(record.dispose);return()=>null}});const axisControlProps={axis:{type:[String,Number],default:void 0},label:{type:String,default:void 0}};const ChartPanControl=defineComponent({name:"SectileChartPanControl",inheritAttrs:false,props:{...axisControlProps,direction:{type:String,required:true},step:{type:Number,default:.1}},setup(props,{attrs,slots}){const context=useInternalChart();const inheritedAxis=inject(chartControlAxisKey,inject(chartAxisKey,void 0));const axis=()=>requiredControlAxis(props.axis,inheritedAxis?.value);return()=>h("button",{...attrs,type:"button",disabled:context.controller.value===null,"aria-label":props.label??`Pan ${String(axis())} ${props.direction}`,"data-scope":"chart","data-part":"pan-control",onClick:()=>context.dispatch({type:"pan-axis-view",axisID:axis(),fraction:props.direction==="backward"?-props.step:props.step,phase:"settled"})},slots["default"]?.()??props.direction)}});const ChartZoomControl=defineComponent({name:"SectileChartZoomControl",inheritAttrs:false,props:{...axisControlProps,direction:{type:String,required:true},factor:{type:Number,default:1.25}},setup(props,{attrs,slots}){const context=useInternalChart();const inheritedAxis=inject(chartControlAxisKey,inject(chartAxisKey,void 0));const axis=()=>requiredControlAxis(props.axis,inheritedAxis?.value);return()=>h("button",{...attrs,type:"button",disabled:context.controller.value===null,"aria-label":props.label??`Zoom ${String(axis())} ${props.direction}`,"data-scope":"chart","data-part":"zoom-control",onClick:()=>context.dispatch({type:"zoom-axis-view",axisID:axis(),factor:props.direction==="in"?props.factor:1/props.factor,anchor:.5,phase:"settled"})},slots["default"]?.()??props.direction)}});const ChartResetView=defineComponent({name:"SectileChartResetView",inheritAttrs:false,props:{...axisControlProps,to:{type:String,default:"initial"}},setup(props,{attrs,slots}){const context=useInternalChart();const inheritedAxis=inject(chartControlAxisKey,inject(chartAxisKey,void 0));const axis=()=>requiredControlAxis(props.axis,inheritedAxis?.value);return()=>h("button",{...attrs,type:"button",disabled:context.controller.value===null,"aria-label":props.label??`Reset ${String(axis())} view`,"data-scope":"chart","data-part":"reset-view",onClick:()=>context.dispatch({type:"reset-axis-view",axisID:axis(),to:props.to,phase:"settled"})},slots["default"]?.()??"Reset")}});const ChartPlot=defineComponent({name:"SectileChartPlot",inheritAttrs:false,setup(_props,{attrs,slots}){return()=>h("div",{...attrs,"data-scope":"chart","data-part":"plot"},slots["default"]?.())}});const ChartRenderer=defineComponent({name:"SectileChartRenderer",inheritAttrs:false,setup(_props,{attrs}){const context=useInternalChart();return()=>h("canvas",{...attrs,ref:element=>{context.canvas.value=element},"aria-hidden":"true","data-scope":"chart","data-part":"renderer"})}});const ChartCanvas=ChartRenderer;function semanticMarker(name,part){return defineComponent({name,setup(){useInternalChart();return()=>null}})}const ChartGrid=semanticMarker("SectileChartGrid","grid");const ChartGridLines=ChartGrid;const ChartLegend=semanticMarker("SectileChartLegend","legend");const ChartAxisTicks=semanticMarker("SectileChartAxisTicks","axis-ticks");const ChartTicks=ChartAxisTicks;const chartSuiteKey=Symbol("SectileChartSuite");const chartComponentSuites=new WeakMap;function createChartComponents(controller){if(controller===null||typeof controller!=="object")throw new TypeError("createChartComponents requires a Chart controller.");const cached=chartComponentSuites.get(controller);if(cached!==void 0)return cached;const token=Object.freeze({controller});const suite=Object.freeze({Provider:boundChartProvider(controller,token),Root:boundChartRoot(token),Cartesian:ChartCartesian,Radial:ChartRadial,XAxis:ChartXAxis,YAxis:ChartYAxis,AxisView:ChartAxisView,Line:ChartLine,Scatter:ChartScatter,Bar:ChartBar,Bars:ChartBars,Heatmap:ChartHeatmap,Pie:ChartPie,Donut:ChartDonut,Navigation:ChartNavigation,ViewControls:ChartViewControls,ExternalViewControls:ChartExternalViewControls,PanControl:ChartPanControl,ZoomControl:ChartZoomControl,ResetView:ChartResetView,Plot:ChartPlot,Renderer:ChartRenderer,Canvas:ChartCanvas,Grid:ChartGrid,GridLines:ChartGridLines,Legend:ChartLegend,AxisTicks:ChartAxisTicks,Ticks:ChartTicks});chartComponentSuites.set(controller,suite);return suite}function boundChartProvider(controller,token){return defineComponent({name:"SectileBoundChartProvider",inheritAttrs:false,setup(_props,{attrs,slots}){provide(chartSuiteKey,token);return()=>h(ChartProviderRuntime,{...attrs,controller},slots)}})}function boundChartRoot(token){return defineComponent({name:"SectileBoundChartRoot",inheritAttrs:false,setup(_props,{attrs,slots}){if(inject(chartSuiteKey,void 0)!==token){throw new TypeError("Controller-bound Chart.Root requires its matching Chart.Provider.")}return()=>h(ChartRootRuntime,attrs,slots)}})}function requiredControlAxis(axis,inheritedAxis){const resolved=axis??inheritedAxis;if(resolved===void 0)throw new TypeError("Chart view control requires an axis prop or an enclosing axis control scope.");return resolved}function bindController(controller,options,owned){const snapshot=shallowRef(controller.getSnapshot());const projection=shallowRef(null);const connection=shallowRef(null);let active=true;const controlledFlags={activeDatum:options.activeDatum!==void 0,cursor:options.cursor!==void 0,selection:options.selection!==void 0,view:options.view!==void 0};const publish=()=>{if(!active)return;const previous=snapshot.value;const current=controller.getSnapshot();if(current===previous)return;snapshot.value=current;if(!controlledFlags.activeDatum&&current.state.activeDatum!==previous.state.activeDatum)options.onActiveDatumChange?.(current.state.activeDatum);if(!controlledFlags.cursor&&current.state.cursor!==previous.state.cursor)options.onCursorChange?.(current.state.cursor);if(!controlledFlags.selection&&current.state.selection!==previous.state.selection)options.onSelectionChange?.(current.state.selection);if(!controlledFlags.view&&current.state.view!==previous.state.view)options.onViewChange?.(current.state.view)};const unsubscribeCommands=controller.subscribeCommands(command=>{options.onCommand?.(command);if(command.type==="active-change-requested"){if(options.activeDatum!==void 0)options.activeDatum.value=command.id;options.onActiveDatumChange?.(command.id)}else if(command.type==="cursor-change-requested"){if(options.cursor!==void 0)options.cursor.value=command.id;options.onCursorChange?.(command.id)}else if(command.type==="selection-change-requested"){if(options.selection!==void 0)options.selection.value=command.selection;options.onSelectionChange?.(command.selection)}else if(command.type==="view-change-requested"){if(options.view!==void 0)options.view.value=command.view;options.onViewChange?.(command.view)}publish()});const unsubscribeSnapshots=controller.subscribeSnapshots(()=>{publish()});const result={controller,snapshot,projection,connection,replaceModel(model,expectedRevision){const value=controller.replaceModel(model,expectedRevision);publish();return value},replaceDefinition(definition,viewCapabilities,expectedRevision){const value=controller.replaceDefinition(definition,viewCapabilities,expectedRevision);publish();return value},applyPatch(patch,expectedRevision){const value=controller.applyPatch(patch,expectedRevision);publish();return value},dispatch(event,expectedRevision){const value=controller.dispatch(event,expectedRevision);publish();return value},syncControlledValues(){const value=controller.syncControlledValues(controlledValues(options));publish();return value},dispose(){if(!active)return;active=false;connection.value?.disconnect();connection.value=null;unsubscribeCommands();unsubscribeSnapshots();if(owned)controller.dispose()}};return Object.freeze(result)}function controlledValues(options){return Object.freeze({...options.activeDatum===void 0?{}:{activeDatum:options.activeDatum.value},...options.cursor===void 0?{}:{cursor:options.cursor.value},...options.selection===void 0?{}:{selection:options.selection.value},...options.view===void 0?{}:{view:options.view.value}})}function defaultValues(options){const values=Object.freeze({...options.activeDatum!==void 0||options.defaultActiveDatum===void 0?{}:{activeDatum:options.defaultActiveDatum},...options.cursor!==void 0||options.defaultCursor===void 0?{}:{cursor:options.defaultCursor},...options.selection!==void 0||options.defaultSelection===void 0?{}:{selection:options.defaultSelection},...options.view!==void 0||options.defaultView===void 0?{}:{view:options.defaultView}});return Object.keys(values).length===0?{}:{initialValues:values}}function assertControlledDefaults(options){if(options.activeDatum!==void 0&&options.defaultActiveDatum!==void 0||options.cursor!==void 0&&options.defaultCursor!==void 0||options.selection!==void 0&&options.defaultSelection!==void 0||options.view!==void 0&&options.defaultView!==void 0){throw new TypeError("Chart controlled values and their default counterparts are mutually exclusive.")}}function assertRootControlledDefaults(props){if(props["modelValue"]!==void 0&&props["defaultModelValue"]!==void 0||props["activeDatum"]!==void 0&&props["defaultActiveDatum"]!==void 0||props["cursor"]!==void 0&&props["defaultCursor"]!==void 0||props["view"]!==void 0&&props["defaultView"]!==void 0){throw new TypeError("ChartRoot controlled props and their default counterparts are mutually exclusive.")}}function defined(value){return Object.fromEntries(Object.entries(value).filter(([,entry])=>entry!==void 0))}export{ChartAxisTicks,ChartAxisView,ChartBar,ChartBars,ChartCanvas,ChartCartesian,ChartDonut,ChartExternalViewControls,ChartGrid,ChartGridLines,ChartHeatmap,ChartLegend,ChartLine,ChartNavigation,ChartPanControl,ChartPie,ChartPlot,ChartProvider,ChartRadial,ChartRenderer,ChartResetView,ChartRoot,ChartScatter,ChartTicks,ChartViewControls,ChartXAxis,ChartYAxis,ChartZoomControl,createChartComponents,useChart,useChartAxisSelector,useChartContext,useChartLayerSelector,useChartSelector};
+//# sourceMappingURL=chart.js.map