@primeui/vue-chart 0.0.1-alpha.1

package/LICENSE

@@ -0,0 +1,23 @@
+# License
+
+MIT License
+
+Copyright (c) 2026 PrimeTek
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1 @@
+# PrimeUI Vue Chart

package/dist/Chart.parts.d.ts

@@ -0,0 +1,39 @@
+export { default as Canvas } from './ChartCanvas.vue';
+export { default as Svg } from './ChartSvg.vue';
+export { default as Bar } from './components/charts/ChartBar.vue';
+export { default as Candlestick } from './components/charts/ChartCandlestick.vue';
+export { default as Heatmap } from './components/charts/ChartHeatmap.vue';
+export { default as Line } from './components/charts/ChartLine.vue';
+export { default as Pie } from './components/charts/ChartPie.vue';
+export { default as Polar } from './components/charts/ChartPolar.vue';
+export { default as Radar } from './components/charts/ChartRadar.vue';
+export { default as Scatter } from './components/charts/ChartScatter.vue';
+export { default as Treemap } from './components/charts/ChartTreemap.vue';
+export { default as Item } from './components/items/ChartItem.vue';
+export { default as TreemapGroup } from './components/items/ChartTreemapGroup.vue';
+export { default as Accessibility } from './components/customizations/ChartAccessibility.vue';
+export { default as Annotation } from './components/customizations/ChartAnnotation.vue';
+export { default as AxisCategory } from './components/customizations/ChartAxisCategory.vue';
+export { default as AxisGroup } from './components/customizations/ChartAxisGroup.vue';
+export { default as Breadcrumb } from './components/customizations/ChartBreadcrumb.vue';
+export { default as Caption } from './components/customizations/ChartCaption.vue';
+export { default as ColorLegend } from './components/customizations/ChartColorLegend.vue';
+export { default as DataLabels } from './components/customizations/ChartDataLabels.vue';
+export { default as ExportMenu } from './components/customizations/ChartExportMenu.vue';
+export { default as Hover } from './components/customizations/ChartHover.vue';
+export { default as Legend } from './components/customizations/ChartLegend.vue';
+export { default as Navigator } from './components/customizations/ChartNavigator.vue';
+export { default as ReferenceBand } from './components/customizations/ChartReferenceBand.vue';
+export { default as ReferenceLine } from './components/customizations/ChartReferenceLine.vue';
+export { default as Responsive } from './components/customizations/ChartResponsive.vue';
+export { default as Title } from './components/customizations/ChartTitle.vue';
+export { default as Tooltip } from './components/customizations/ChartTooltip.vue';
+export { default as XAxis } from './components/customizations/ChartXAxis.vue';
+export { default as YAxis } from './components/customizations/ChartYAxis.vue';
+export { default as Zoom } from './components/customizations/ChartZoom.vue';
+export { default as Decimation } from './components/containers/ChartDecimation.vue';
+export { default as Group } from './components/containers/ChartGroup.vue';
+export { default as Overlap } from './components/containers/ChartOverlap.vue';
+export { default as Range } from './components/containers/ChartRange.vue';
+export { default as Stacked } from './components/containers/ChartStacked.vue';
+export { default as Waterfall } from './components/containers/ChartWaterfall.vue';

package/dist/Chart.vue.d.ts

@@ -0,0 +1,27 @@
+import type { ChartCanvasProps } from './types';
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<ChartCanvasProps & {
+    renderer: "svg" | "canvas";
+}, {
+    redraw: () => void;
+    $plugins: import("vue").ShallowRef<Record<string, unknown>, Record<string, unknown>>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    resize: (width: number, height: number) => any;
+}, string, import("vue").PublicProps, Readonly<ChartCanvasProps & {
+    renderer: "svg" | "canvas";
+}> & Readonly<{
+    onResize?: ((width: number, height: number) => any) | undefined;
+}>, {
+    responsive: boolean;
+    dir: "ltr" | "rtl" | "auto";
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
+    default?: (props: {
+        plugins: Record<string, unknown>;
+    }) => any;
+}>;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/ChartCanvas.mjs

@@ -0,0 +1,14 @@
+export { ChartCanvas_default as default } from './chunk-72KINEJ6.mjs';
+import './chunk-372K2BMN.mjs';
+import './chunk-5FTUGKPC.mjs';
+import './chunk-E4ROAOPT.mjs';
+import './chunk-GX2MK6VT.mjs';
+import './chunk-CQHNYT2V.mjs';
+import './chunk-TEOO4OLV.mjs';
+import './chunk-PQV55JYI.mjs';
+import './chunk-J43KLCZF.mjs';
+import './chunk-NLXOJSKK.mjs';
+import './chunk-HANSF33Z.mjs';
+import './chunk-LD57I4SY.mjs';
+import './chunk-FZ3PZ66C.mjs';
+import './chunk-7P6ASYW6.mjs';

package/dist/ChartCanvas.render.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/ChartCanvas.vue.d.ts

@@ -0,0 +1,23 @@
+import type { ChartCanvasProps } from './types';
+declare var __VLS_11: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_11) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<ChartCanvasProps, {
+    redraw: () => void | undefined;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    resize: (width: number, height: number) => any;
+}, string, import("vue").PublicProps, Readonly<ChartCanvasProps> & Readonly<{
+    onResize?: ((width: number, height: number) => any) | undefined;
+}>, {
+    animation: import("packages/components/chart/chart-types/src/animations.types.js").AnimationSpec | false;
+    responsive: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/ChartStacked.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/ChartSvg.axes.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/ChartSvg.context.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/ChartSvg.customizations.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/ChartSvg.features.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/ChartSvg.legend.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/ChartSvg.mjs

@@ -0,0 +1,14 @@
+export { ChartSvg_default as default } from './chunk-44BAFHPK.mjs';
+import './chunk-372K2BMN.mjs';
+import './chunk-5FTUGKPC.mjs';
+import './chunk-E4ROAOPT.mjs';
+import './chunk-GX2MK6VT.mjs';
+import './chunk-CQHNYT2V.mjs';
+import './chunk-TEOO4OLV.mjs';
+import './chunk-PQV55JYI.mjs';
+import './chunk-J43KLCZF.mjs';
+import './chunk-NLXOJSKK.mjs';
+import './chunk-HANSF33Z.mjs';
+import './chunk-LD57I4SY.mjs';
+import './chunk-FZ3PZ66C.mjs';
+import './chunk-7P6ASYW6.mjs';

package/dist/ChartSvg.registration.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/ChartSvg.render.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/ChartSvg.vue.d.ts

@@ -0,0 +1,23 @@
+import type { ChartSvgProps } from './types';
+declare var __VLS_11: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_11) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<ChartSvgProps, {
+    redraw: () => void | undefined;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    resize: (width: number, height: number) => any;
+}, string, import("vue").PublicProps, Readonly<ChartSvgProps> & Readonly<{
+    onResize?: ((width: number, height: number) => any) | undefined;
+}>, {
+    animation: import("packages/components/chart/chart-types/src/animations.types.js").AnimationSpec | false;
+    responsive: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/_test/fixtures.d.ts

@@ -0,0 +1,34 @@
+import { type VueWrapper } from '@vue/test-utils';
+import { type Component } from 'vue';
+import ChartSvg from '../ChartSvg.vue';
+import ChartCanvas from '../ChartCanvas.vue';
+import ChartBar from '../components/charts/ChartBar.vue';
+import ChartLine from '../components/charts/ChartLine.vue';
+import ChartPie from '../components/charts/ChartPie.vue';
+import ChartScatter from '../components/charts/ChartScatter.vue';
+import ChartRadar from '../components/charts/ChartRadar.vue';
+import ChartPolar from '../components/charts/ChartPolar.vue';
+import ChartCandlestick from '../components/charts/ChartCandlestick.vue';
+import ChartHeatmap from '../components/charts/ChartHeatmap.vue';
+import ChartTreemap from '../components/charts/ChartTreemap.vue';
+export interface ChartFixture {
+    label: string;
+    Comp: Component;
+    type: string;
+    props: Record<string, unknown>;
+}
+/** One realistic minimal fixture per chart type, keyed by the dataset `type`
+ *  the component registers. Field names match each ChartX.vue's defineProps. */
+export declare const CHART_FIXTURES: ChartFixture[];
+export interface MountedChart {
+    wrapper: VueWrapper<any>;
+    /** The reactive ChartState read from inside the provider (datasets, visibility, …). */
+    state: () => any;
+}
+/** Mount a chart container with arbitrary child nodes plus a hidden probe that
+ *  captures the injected ChartState so tests can assert registration/visibility. */
+export declare function mountChart(children: unknown, opts?: {
+    renderer?: 'svg' | 'canvas';
+    props?: Record<string, unknown>;
+}): Promise<MountedChart>;
+export { ChartBar, ChartLine, ChartPie, ChartScatter, ChartRadar, ChartPolar, ChartCandlestick, ChartHeatmap, ChartTreemap, ChartSvg, ChartCanvas };

package/dist/bundle-discipline.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/chunk-2D3PWFR2.mjs

@@ -0,0 +1,214 @@
+import { RectRenderer_default } from './chunk-VWABO23U.mjs';
+import { registerFamilyRenderer, useDatasetAnimationRegistration, useDatasetRegistration, useItemCollector } from './chunk-CQHNYT2V.mjs';
+import { useRendererHint, useChartMethods } from './chunk-HANSF33Z.mjs';
+import { defineComponent, useSlots, computed, onMounted, watch, onUnmounted, renderSlot, createCommentVNode } from 'vue';
+
+var treemapIdCounter = 0;
+var _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "ChartTreemap",
+  props: {
+    id: {},
+    data: {},
+    categoryField: {},
+    valueField: {},
+    nodeId: {},
+    parentField: {},
+    color: {},
+    opacity: {},
+    hoverColor: {},
+    hoverBorderColor: {},
+    colorValueField: {},
+    colorScale: {},
+    colorRange: {},
+    layout: {},
+    spacing: {},
+    groupPadding: {},
+    labelMinSize: {},
+    showGroupLabel: {
+      type: Boolean,
+      default: void 0
+    },
+    groupLabelHeight: {},
+    secondaryLabelField: {},
+    levels: {},
+    rootLabel: {},
+    drilldown: {
+      type: Boolean,
+      default: void 0
+    },
+    drilldownMode: {},
+    interactByLeaf: {
+      type: Boolean,
+      default: void 0
+    },
+    renderContent: {},
+    name: {},
+    order: {},
+    borderColor: {},
+    borderStrokeWidth: {},
+    borderDash: {},
+    borderDashOffset: {},
+    borderJoinStyle: {},
+    borderAlign: {},
+    borderRadius: {},
+    keyField: {},
+    animations: {}
+  },
+  setup(__props) {
+    useRendererHint("rect");
+    registerFamilyRenderer("rect", RectRenderer_default);
+    const props = __props;
+    function generateTreemapId() {
+      return `treemap-auto-${++treemapIdCounter}`;
+    }
+    const slots = useSlots();
+    const hasChildren = computed(() => !!slots.default);
+    const hasData = computed(() => !!props.data);
+    if (hasData.value && hasChildren.value) {
+      throw new Error('ChartTreemap: Provide either a `data` prop or <ChartItem>/<ChartTreemapGroup> children, not both.\n\nData array mode:\n  <ChartTreemap :data="data" value="marketCap" label="name" />\n\nDeclarative mode:\n  <ChartTreemap>\n    <ChartTreemapGroup label="Tech">\n      <ChartItem :value="45" label="Apple" />\n    </ChartTreemapGroup>\n  </ChartTreemap>');
+    }
+    const autoId = props.id || generateTreemapId();
+    useDatasetAnimationRegistration(() => autoId, () => props.animations);
+    if (!hasChildren.value) {
+      const datasetId = computed(() => autoId);
+      const datasetProps = computed(() => {
+        const p = {
+          id: autoId,
+          data: props.data,
+          categoryField: props.categoryField,
+          valueField: props.valueField,
+          nodeId: props.nodeId,
+          parentField: props.parentField,
+          color: props.color,
+          colorValueField: props.colorValueField,
+          colorScale: props.colorScale,
+          colorRange: props.colorRange,
+          layout: props.layout,
+          spacing: props.spacing,
+          groupPadding: props.groupPadding,
+          labelMinSize: props.labelMinSize,
+          groupLabelHeight: props.groupLabelHeight,
+          secondaryLabelField: props.secondaryLabelField,
+          levels: props.levels,
+          rootLabel: props.rootLabel,
+          drilldownMode: props.drilldownMode,
+          renderContent: props.renderContent,
+          name: props.name,
+          order: props.order,
+          borderColor: props.borderColor,
+          borderStrokeWidth: props.borderStrokeWidth,
+          borderDash: props.borderDash,
+          borderDashOffset: props.borderDashOffset,
+          borderJoinStyle: props.borderJoinStyle,
+          borderAlign: props.borderAlign,
+          borderRadius: props.borderRadius,
+          opacity: props.opacity,
+          hoverColor: props.hoverColor,
+          hoverBorderColor: props.hoverBorderColor
+        };
+        if (props.drilldown) p.drilldown = true;
+        if (props.showGroupLabel !== void 0) p.showGroupLabel = props.showGroupLabel;
+        if (props.interactByLeaf !== void 0) p.interactByLeaf = props.interactByLeaf;
+        return p;
+      });
+      useDatasetRegistration({
+        id: datasetId,
+        type: "treemap",
+        props: datasetProps
+      });
+    }
+    if (hasChildren.value) {
+      let buildSynthesizedProps2 = function() {
+        const items = getItems();
+        const hasHierarchy = items.some((item) => item.nodeId != null);
+        const hasSecondaryLabel = items.some((item) => item.secondaryLabel != null);
+        const p = {
+          id: autoId,
+          data: items,
+          categoryField: "label",
+          valueField: "value",
+          name: props.name,
+          nodeId: hasHierarchy ? "nodeId" : props.nodeId,
+          parentField: hasHierarchy ? "parentId" : props.parentField,
+          color: props.color,
+          colorValueField: props.colorValueField,
+          colorScale: props.colorScale,
+          colorRange: props.colorRange,
+          layout: props.layout,
+          spacing: props.spacing,
+          groupPadding: props.groupPadding,
+          labelMinSize: props.labelMinSize,
+          groupLabelHeight: props.groupLabelHeight,
+          secondaryLabelField: hasSecondaryLabel ? "secondaryLabel" : props.secondaryLabelField,
+          levels: props.levels,
+          rootLabel: props.rootLabel,
+          drilldownMode: props.drilldownMode,
+          renderContent: props.renderContent,
+          borderColor: props.borderColor,
+          borderStrokeWidth: props.borderStrokeWidth,
+          borderDash: props.borderDash,
+          borderDashOffset: props.borderDashOffset,
+          borderJoinStyle: props.borderJoinStyle,
+          borderAlign: props.borderAlign,
+          borderRadius: props.borderRadius,
+          opacity: props.opacity,
+          hoverColor: props.hoverColor,
+          hoverBorderColor: props.hoverBorderColor
+        };
+        if (props.drilldown) p.drilldown = true;
+        if (props.showGroupLabel !== void 0) p.showGroupLabel = props.showGroupLabel;
+        if (props.interactByLeaf !== void 0) p.interactByLeaf = props.interactByLeaf;
+        return p;
+      };
+      const methods = useChartMethods();
+      const { getItems } = useItemCollector();
+      let isRegistered = false;
+      onMounted(() => {
+        const synthesizedProps = buildSynthesizedProps2();
+        methods.registerDataset(autoId, "treemap", synthesizedProps);
+        isRegistered = true;
+      });
+      watch([
+        () => props.name,
+        () => props.color,
+        () => props.colorValueField,
+        () => props.colorScale,
+        () => props.colorRange,
+        () => props.layout,
+        () => props.spacing,
+        () => props.groupPadding,
+        () => props.labelMinSize,
+        () => props.showGroupLabel,
+        () => props.groupLabelHeight,
+        () => props.secondaryLabelField,
+        () => props.levels,
+        () => props.rootLabel,
+        () => props.drilldown,
+        () => props.drilldownMode,
+        () => props.interactByLeaf,
+        () => props.renderContent,
+        () => props.borderColor,
+        () => props.borderStrokeWidth,
+        () => props.borderDash,
+        () => props.borderDashOffset,
+        () => props.borderJoinStyle,
+        () => props.borderAlign,
+        () => props.borderRadius
+      ], () => {
+        if (!isRegistered) return;
+        const synthesizedProps = buildSynthesizedProps2();
+        methods.updateDataset(autoId, synthesizedProps);
+      }, { flush: "post" });
+      onUnmounted(() => {
+        methods.unregisterDataset(autoId);
+        isRegistered = false;
+      });
+    }
+    return (_ctx, _cache) => {
+      return hasChildren.value ? renderSlot(_ctx.$slots, "default", { key: 0 }) : createCommentVNode("", true);
+    };
+  }
+});
+var ChartTreemap_default = _sfc_main;
+
+export { ChartTreemap_default };

package/dist/chunk-32XIRBZ7.mjs

@@ -0,0 +1,87 @@
+import { AXIS_GROUP_REGISTRY_KEY } from './chunk-5SRBQVU5.mjs';
+import { useAxisComponentBase } from './chunk-CQHNYT2V.mjs';
+import { defineComponent, useSlots, computed, provide, renderSlot } from 'vue';
+
+var __default__ = { inheritAttrs: false };
+var _sfc_main = /* @__PURE__ */ defineComponent({
+  ...__default__,
+  __name: "ChartXAxis",
+  props: {
+    position: { default: "bottom" },
+    render: {},
+    renderTick: {},
+    id: { default: "default" },
+    type: {},
+    min: {},
+    max: {},
+    label: {},
+    labelFontSize: {},
+    titleGap: {},
+    tickCount: {},
+    tickFormat: {},
+    tickRotation: {},
+    tickStyle: {},
+    color: {},
+    gridLines: { type: Boolean },
+    gridColor: {},
+    gridStyle: {},
+    gridStrokeWidth: {},
+    gridShape: {},
+    category: {},
+    gridOpacity: {},
+    tickInterval: {},
+    minorGridLines: { type: Boolean },
+    minorGridColor: {},
+    minorGridStrokeWidth: {},
+    minorGridOpacity: {},
+    minorGridCount: {},
+    minorGridStyle: {},
+    alternateGridColor: {},
+    alternateGridOpacity: {},
+    visible: { type: Boolean },
+    scale: {},
+    timezone: {},
+    dateTimeFormats: {},
+    tickConfig: {},
+    minUnit: {},
+    gapless: { type: Boolean },
+    grouping: {},
+    autoRotate: { type: Boolean },
+    autoRotateAngle: {},
+    labelMinSpacing: {},
+    autoSkip: { type: Boolean },
+    minGridDistance: {},
+    startFromZero: { type: Boolean },
+    reversed: { type: Boolean },
+    softMin: {},
+    softMax: {},
+    tickPosition: {},
+    minorTicks: { type: Boolean },
+    minorTickLength: {},
+    minorTickColor: {},
+    minorTickStrokeWidth: {},
+    showFirstLabel: { type: Boolean },
+    showLastLabel: { type: Boolean },
+    showLine: { type: Boolean },
+    showTicks: { type: Boolean },
+    showLabels: { type: Boolean },
+    chartPaddingMin: {},
+    chartPaddingMax: {}
+  },
+  setup(__props) {
+    const props = __props;
+    const slots = useSlots();
+    const hasChildren = !!slots.default;
+    const axisId = computed(() => props.id);
+    const { collectorValue } = useAxisComponentBase("x", axisId, props, hasChildren);
+    if (hasChildren) {
+      provide(AXIS_GROUP_REGISTRY_KEY, collectorValue);
+    }
+    return (_ctx, _cache) => {
+      return renderSlot(_ctx.$slots, "default");
+    };
+  }
+});
+var ChartXAxis_default = _sfc_main;
+
+export { ChartXAxis_default };