@primeui/vue-chart 0.0.1-alpha.1

package/dist/chunk-K326BBF7.mjs

@@ -0,0 +1,276 @@
+import { BarLayerSvg_default } from './chunk-RRHYGSK6.mjs';
+import { BarLayerCanvas_default } from './chunk-MDA22SIZ.mjs';
+import { CartesianRenderer_default } from './chunk-HTZVV6VV.mjs';
+import { registerFamilyRenderer, registerChartLayer, useDatasetAnimationRegistration, useDatasetRegistration, useItemCollector } from './chunk-CQHNYT2V.mjs';
+import { STACKED_CONTEXT_KEY } from './chunk-TEOO4OLV.mjs';
+import { useRendererHint, useChartMethods } from './chunk-HANSF33Z.mjs';
+import { defineComponent, useSlots, computed, inject, onMounted, watch, onUnmounted, renderSlot, createCommentVNode } from 'vue';
+import { resolveAccessor } from '@primeui/chart-core';
+import { getBarAxisHints } from '@primeui/chart-core/series/bar';
+
+var barIdCounter = 0;
+var _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "ChartBar",
+  props: {
+    id: {},
+    data: {},
+    categoryField: { type: [
+      String,
+      Function,
+      Array
+    ] },
+    valueField: { type: [
+      String,
+      Function,
+      Number,
+      null,
+      Array
+    ] },
+    name: {},
+    color: { type: [
+      String,
+      Function,
+      Array
+    ] },
+    opacity: { type: [
+      String,
+      Function,
+      Number,
+      Array
+    ] },
+    hoverColor: { type: [
+      String,
+      Function,
+      Array
+    ] },
+    hoverBorderColor: { type: [
+      String,
+      Function,
+      Array
+    ] },
+    xAxisId: {},
+    yAxisId: {},
+    order: {},
+    stackId: {},
+    barGap: {},
+    categoryGap: {},
+    orientation: {},
+    weightField: { type: [
+      String,
+      Function,
+      Number,
+      Array
+    ] },
+    renderShape: { type: Function },
+    barThickness: {},
+    maxBarThickness: {},
+    minBarLength: {},
+    connectNulls: { type: [Boolean, String] },
+    sort: {},
+    sortAggregate: {},
+    openField: { type: [
+      String,
+      Function,
+      Number,
+      Array
+    ] },
+    keyField: {},
+    borderColor: { type: [
+      String,
+      Function,
+      Array
+    ] },
+    borderStrokeWidth: { type: [
+      String,
+      Function,
+      Number,
+      Array
+    ] },
+    borderDash: { type: [
+      Array,
+      String,
+      Function
+    ] },
+    borderDashOffset: { type: [
+      String,
+      Function,
+      Number,
+      Array
+    ] },
+    borderJoinStyle: {},
+    borderAlign: {},
+    borderRadius: { type: [
+      String,
+      Function,
+      Number,
+      Object,
+      Array
+    ] },
+    borderSkipped: { type: [
+      String,
+      Function,
+      Boolean,
+      Array
+    ] },
+    animations: {}
+  },
+  setup(__props) {
+    useRendererHint("cartesian");
+    registerFamilyRenderer("cartesian", CartesianRenderer_default);
+    registerChartLayer("bar", {
+      family: "cartesian",
+      frameKind: "grid",
+      layerByMode: {
+        svg: BarLayerSvg_default,
+        canvas: BarLayerCanvas_default
+      },
+      axisHints: { getAxisHints: getBarAxisHints }
+    });
+    const props = __props;
+    function generateBarId() {
+      return `bar-auto-${++barIdCounter}`;
+    }
+    const slots = useSlots();
+    const hasChildren = computed(() => !!slots.default);
+    const autoId = props.id || generateBarId();
+    const stackedContext = inject(STACKED_CONTEXT_KEY, null);
+    let autoOrder;
+    if (stackedContext && props.order === void 0) {
+      autoOrder = stackedContext.getNextOrder();
+    }
+    const effectiveOrder = props.order ?? autoOrder;
+    const stackId = stackedContext?.stackId;
+    useDatasetAnimationRegistration(() => autoId, () => props.animations);
+    if (!hasChildren.value) {
+      const datasetId = computed(() => autoId);
+      const datasetProps = computed(() => ({
+        id: autoId,
+        data: props.data,
+        categoryField: props.categoryField,
+        valueField: props.valueField,
+        color: props.color,
+        name: props.name,
+        order: effectiveOrder,
+        stackId,
+        orientation: props.orientation,
+        xAxisId: props.xAxisId,
+        yAxisId: props.yAxisId,
+        barGap: props.barGap,
+        categoryGap: props.categoryGap,
+        barThickness: props.barThickness,
+        maxBarThickness: props.maxBarThickness,
+        minBarLength: props.minBarLength,
+        borderRadius: props.borderRadius,
+        borderColor: props.borderColor,
+        borderStrokeWidth: props.borderStrokeWidth,
+        borderAlign: props.borderAlign,
+        borderDash: props.borderDash,
+        borderDashOffset: props.borderDashOffset,
+        borderJoinStyle: props.borderJoinStyle,
+        borderSkipped: props.borderSkipped,
+        opacity: props.opacity,
+        hoverColor: props.hoverColor,
+        hoverBorderColor: props.hoverBorderColor,
+        renderShape: props.renderShape,
+        openField: props.openField,
+        weightField: props.weightField,
+        sort: props.sort,
+        sortAggregate: props.sortAggregate,
+        connectNulls: props.connectNulls,
+        keyField: props.keyField
+      }));
+      useDatasetRegistration({
+        id: datasetId,
+        type: "bar",
+        props: datasetProps
+      });
+    }
+    if (hasChildren.value) {
+      let buildSynthesizedProps2 = function() {
+        const items = getItems();
+        const p = {
+          id: autoId,
+          data: items,
+          categoryField: (ctx) => ctx.datum.label ?? "",
+          valueField: (ctx) => ctx.datum.value,
+          color: ((ctx) => ctx.datum.color ?? resolveAccessor(props.color, ctx)),
+          borderRadius: (ctx) => ctx.datum.borderRadius,
+          borderColor: (ctx) => ctx.datum.borderColor,
+          borderStrokeWidth: (ctx) => ctx.datum.borderStrokeWidth,
+          name: props.name,
+          orientation: props.orientation,
+          xAxisId: props.xAxisId,
+          yAxisId: props.yAxisId,
+          order: effectiveOrder,
+          stackId,
+          barGap: props.barGap,
+          categoryGap: props.categoryGap,
+          renderShape: props.renderShape,
+          barThickness: props.barThickness,
+          maxBarThickness: props.maxBarThickness,
+          minBarLength: props.minBarLength,
+          borderAlign: props.borderAlign,
+          borderDash: props.borderDash,
+          borderDashOffset: props.borderDashOffset,
+          borderJoinStyle: props.borderJoinStyle,
+          borderSkipped: props.borderSkipped,
+          openField: (ctx) => ctx.datum.open,
+          weightField: props.weightField,
+          sort: props.sort,
+          sortAggregate: props.sortAggregate,
+          connectNulls: props.connectNulls,
+          keyField: props.keyField
+        };
+        return p;
+      };
+      const methods = useChartMethods();
+      const { getItems } = useItemCollector();
+      let isRegistered = false;
+      onMounted(() => {
+        methods.registerDataset(autoId, "bar", buildSynthesizedProps2());
+        isRegistered = true;
+      });
+      watch([
+        () => props.name,
+        () => props.color,
+        () => props.orientation,
+        () => props.order,
+        () => props.barGap,
+        () => props.categoryGap,
+        () => props.barThickness,
+        () => props.maxBarThickness,
+        () => props.minBarLength,
+        () => props.connectNulls,
+        () => props.borderRadius,
+        () => props.borderColor,
+        () => props.borderStrokeWidth,
+        () => props.borderAlign,
+        () => props.borderDash,
+        () => props.borderDashOffset,
+        () => props.borderJoinStyle,
+        () => props.borderSkipped,
+        () => props.renderShape,
+        () => props.xAxisId,
+        () => props.yAxisId,
+        () => props.openField,
+        () => props.weightField,
+        () => props.sort,
+        () => props.sortAggregate,
+        () => props.keyField
+      ], () => {
+        if (!isRegistered) return;
+        methods.updateDataset(autoId, buildSynthesizedProps2());
+      }, { flush: "post" });
+      onUnmounted(() => {
+        methods.unregisterDataset(autoId);
+        isRegistered = false;
+      });
+    }
+    return (_ctx, _cache) => {
+      return hasChildren.value ? renderSlot(_ctx.$slots, "default", { key: 0 }) : createCommentVNode("", true);
+    };
+  }
+});
+var ChartBar_default = _sfc_main;
+
+export { ChartBar_default };

package/dist/chunk-KOWFD2AE.mjs

@@ -0,0 +1,72 @@
+import { ITEM_COLLECTOR_KEY } from './chunk-FZ3PZ66C.mjs';
+import { defineComponent, inject, onMounted, watch, onUnmounted } from 'vue';
+
+var _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "ChartItem",
+  props: {
+    borderRadius: {},
+    y: {},
+    value: {},
+    label: {},
+    color: {},
+    borderColor: {},
+    borderStrokeWidth: {},
+    x: {},
+    size: {},
+    secondaryLabel: {},
+    opacity: {},
+    time: {},
+    open: {},
+    high: {},
+    low: {},
+    close: {},
+    row: {},
+    column: {},
+    nodeId: {},
+    parentId: {}
+  },
+  setup(__props) {
+    const props = __props;
+    const collector = inject(ITEM_COLLECTOR_KEY);
+    if (!collector) {
+      throw new Error("ChartItem must be used within a chart component (e.g., <ChartPie>, <ChartBar>)");
+    }
+    const itemIndex = collector.getNextIndex();
+    function buildItemProps() {
+      return {
+        value: props.value,
+        label: props.label,
+        color: props.color,
+        borderRadius: props.borderRadius,
+        borderColor: props.borderColor,
+        borderStrokeWidth: props.borderStrokeWidth,
+        x: props.x,
+        y: props.y,
+        time: props.time,
+        open: props.open,
+        high: props.high,
+        low: props.low,
+        close: props.close,
+        row: props.row,
+        column: props.column,
+        nodeId: props.nodeId,
+        parentId: props.parentId
+      };
+    }
+    onMounted(() => {
+      collector.registerItem(itemIndex, buildItemProps());
+    });
+    watch(() => buildItemProps(), (newProps) => {
+      collector.registerItem(itemIndex, newProps);
+    });
+    onUnmounted(() => {
+      collector.unregisterItem(itemIndex);
+    });
+    return (_ctx, _cache) => {
+      return null;
+    };
+  }
+});
+var ChartItem_default = _sfc_main;
+
+export { ChartItem_default };

package/dist/chunk-LD57I4SY.mjs

@@ -0,0 +1,5 @@
+// src/context/syncKeys.ts
+var SYNC_BUS_KEY = /* @__PURE__ */ Symbol.for("sync-bus");
+var CHART_SYNC_INFO_KEY = /* @__PURE__ */ Symbol.for("chart-sync-info");
+
+export { CHART_SYNC_INFO_KEY, SYNC_BUS_KEY };

package/dist/chunk-MDA22SIZ.mjs

@@ -0,0 +1,29 @@
+import { useBarLayer, useBarRendererBase } from './chunk-YRKAI2R2.mjs';
+import { defineComponent, unref, openBlock, createElementBlock, createCommentVNode } from 'vue';
+import { createBarRendererCanvas } from '@primeui/chart-core/series/bar/controller-canvas';
+
+function useBarRenderer(options) {
+  return useBarRendererBase(createBarRendererCanvas(), options);
+}
+
+// src/components/renderers/layers/BarLayerCanvas.vue
+var _hoisted_1 = ["clip-path"];
+var _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "BarLayerCanvas",
+  setup(__props) {
+    const { bar, methods, frame } = useBarLayer(useBarRenderer);
+    return (_ctx, _cache) => {
+      return unref(methods).renderer === "svg" && unref(bar).hasBarData.value ? (openBlock(), createElementBlock("g", {
+        key: 0,
+        ref: (el) => {
+          unref(bar).groupRef.value = el;
+        },
+        class: "bar-chart",
+        "clip-path": unref(frame).layoutData.value?.cartesianArea ? `url(#${unref(frame).plotClipId})` : void 0
+      }, null, 8, _hoisted_1)) : createCommentVNode("", true);
+    };
+  }
+});
+var BarLayerCanvas_default = _sfc_main;
+
+export { BarLayerCanvas_default };