@blokkli/editor 2.0.0-alpha.58 → 2.0.0-alpha.59

package/dist/modules/charts/runtime/blokkli/chart-types/heatmap/definition.js

@@ -0,0 +1,29 @@
+import { defineChartType } from "#blokkli/charts/definition";
+import {
+  xAxisOptions,
+  legendOptions,
+  gridOptions,
+  categoryFilterOptions,
+  mergeShared
+} from "#blokkli/charts/definition/options";
+export default defineChartType("heatmap", ($t) => {
+  const shared = mergeShared(
+    xAxisOptions($t),
+    legendOptions($t),
+    gridOptions($t),
+    categoryFilterOptions($t)
+  );
+  return {
+    hasSeriesColors: false,
+    hasCategoryColors: false,
+    editor: {
+      label: $t("chartsTypeHeatmap", "Heatmap"),
+      description: $t(
+        "chartsTypeHeatmapDescription",
+        "Visualises values across two dimensions using colour intensity to reveal patterns and outliers."
+      ),
+      icon: "bk_mdi_grid_view",
+      options: { ...shared.options }
+    }
+  };
+});

package/dist/modules/charts/runtime/blokkli/chart-types/heatmap/illustration.d.vue.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/modules/charts/runtime/blokkli/chart-types/heatmap/illustration.vue

@@ -0,0 +1,27 @@
+<template>
+  <svg viewBox="0 0 120 80" xmlns="http://www.w3.org/2000/svg">
+    <g class="_bk_fill-accent-500">
+      <template v-for="(row, ri) in rows" :key="ri">
+        <rect
+          v-for="(opacity, ci) in row"
+          :key="ci"
+          :x="13 + ci * 16"
+          :y="9 + ri * 16"
+          width="14"
+          height="14"
+          rx="1"
+          :fill-opacity="opacity"
+        />
+      </template>
+    </g>
+  </svg>
+</template>
+
+<script setup>
+const rows = [
+  [0.2, 0.3, 0.5, 0.7, 0.9, 1],
+  [0.3, 0.5, 0.7, 0.9, 1, 0.8],
+  [0.2, 0.4, 0.6, 0.8, 0.6, 0.5],
+  [0.15, 0.25, 0.4, 0.5, 0.4, 0.3]
+];
+</script>

package/dist/modules/charts/runtime/blokkli/chart-types/heatmap/illustration.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/modules/charts/runtime/blokkli/chart-types/heatmap/render.d.vue.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<any, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, any, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/modules/charts/runtime/blokkli/chart-types/heatmap/render.vue

@@ -0,0 +1,113 @@
+<template>
+  <VChart :option="option" autoresize style="height: 550px; width: 100%" />
+</template>
+
+<script setup>
+import { computed } from "#imports";
+import VChart from "vue-echarts";
+import { use } from "echarts/core";
+import { CanvasRenderer } from "echarts/renderers";
+import { HeatmapChart } from "echarts/charts";
+import {
+  GridComponent,
+  TooltipComponent,
+  TitleComponent,
+  VisualMapComponent
+} from "echarts/components";
+import { createNumberFormatter } from "../../../helpers/numberFormat";
+use([
+  CanvasRenderer,
+  HeatmapChart,
+  GridComponent,
+  TooltipComponent,
+  TitleComponent,
+  VisualMapComponent
+]);
+const props = defineProps({
+  title: { type: String, required: true },
+  categories: { type: Array, required: true },
+  series: { type: Array, required: true },
+  seriesHexColors: { type: Array, required: true },
+  categoryHexColors: { type: Array, required: true },
+  typeOptions: { type: Object, required: true },
+  numberFormat: { type: Object, required: false },
+  isEditing: { type: Boolean, required: true },
+  advancedConfig: { type: Object, required: false }
+});
+const opts = computed(() => {
+  const t = props.typeOptions;
+  return {
+    xaxisRotation: t.xaxisRotation ?? "auto",
+    gridLines: t.gridLines ?? true
+  };
+});
+const option = computed(() => {
+  const o = opts.value;
+  const valueFormatter = createNumberFormatter(props.numberFormat);
+  const data = [];
+  let min = Infinity;
+  let max = -Infinity;
+  for (let y = 0; y < props.series.length; y++) {
+    const row = props.series[y];
+    if (!row) continue;
+    for (let x = 0; x < props.categories.length; x++) {
+      const value = row.data[x] ?? 0;
+      data.push([x, y, value]);
+      if (value < min) min = value;
+      if (value > max) max = value;
+    }
+  }
+  if (!Number.isFinite(min)) min = 0;
+  if (!Number.isFinite(max)) max = 1;
+  const xAxis = {
+    type: "category",
+    data: props.categories,
+    splitArea: { show: o.gridLines }
+  };
+  if (o.xaxisRotation !== "auto") {
+    xAxis.axisLabel = { rotate: Number(o.xaxisRotation) };
+  }
+  return {
+    title: props.title ? { text: props.title, left: "left" } : void 0,
+    animation: !props.isEditing,
+    tooltip: {
+      position: "top",
+      formatter: (p) => {
+        const [x, y, v] = p.data;
+        const cat = props.categories[x] ?? "";
+        const row = props.series[y]?.name ?? "";
+        return `${row} / ${cat}: ${valueFormatter(v)}`;
+      }
+    },
+    grid: { containLabel: true, top: 50, left: 10, right: 50, bottom: 60 },
+    xAxis,
+    yAxis: {
+      type: "category",
+      data: props.series.map((s) => s.name),
+      splitArea: { show: o.gridLines }
+    },
+    visualMap: {
+      min,
+      max,
+      calculable: true,
+      orient: "horizontal",
+      left: "center",
+      bottom: 0,
+      formatter: (v) => valueFormatter(v)
+    },
+    series: [
+      {
+        type: "heatmap",
+        data,
+        label: {
+          show: true,
+          formatter: (p) => valueFormatter(p.data[2])
+        },
+        emphasis: {
+          itemStyle: { shadowBlur: 10, shadowColor: "rgba(0,0,0,0.5)" }
+        }
+      }
+    ]
+  };
+});
+</script>

package/dist/modules/charts/runtime/blokkli/chart-types/heatmap/render.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<any, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, any, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/modules/charts/runtime/blokkli/chart-types/line/definition.d.ts

@@ -0,0 +1,7 @@
+import type { XAxisTypeOptions, DataLabelsTypeOptions, LegendTypeOptions, GridTypeOptions, StrokeWidthTypeOptions, YAxisMinTypeOptions, CategoryFilterTypeOptions } from '#blokkli/charts/types';
+export type TypeOptions = {
+    curved: boolean;
+    markers: boolean;
+} & XAxisTypeOptions & DataLabelsTypeOptions & LegendTypeOptions & GridTypeOptions & StrokeWidthTypeOptions & YAxisMinTypeOptions & CategoryFilterTypeOptions;
+declare const _default: any;
+export default _default;

package/dist/modules/charts/runtime/blokkli/chart-types/line/definition.js

@@ -0,0 +1,49 @@
+import { defineChartType } from "#blokkli/charts/definition";
+import {
+  xAxisOptions,
+  dataLabelsOptions,
+  legendOptions,
+  gridOptions,
+  strokeWidthOptions,
+  yAxisMinOptions,
+  categoryFilterOptions,
+  mergeShared
+} from "#blokkli/charts/definition/options";
+export default defineChartType("line", ($t) => {
+  const shared = mergeShared(
+    xAxisOptions($t),
+    dataLabelsOptions($t),
+    legendOptions($t),
+    gridOptions($t),
+    strokeWidthOptions($t),
+    yAxisMinOptions($t),
+    categoryFilterOptions($t)
+  );
+  return {
+    hasSeriesColors: true,
+    hasCategoryColors: false,
+    editor: {
+      label: $t("chartsTypeLine", "Line"),
+      description: $t(
+        "chartsTypeLineDescription",
+        "Connects data points with lines to show trends and changes across a continuous range."
+      ),
+      icon: "bk_mdi_show_chart",
+      options: {
+        curved: {
+          type: "checkbox",
+          label: $t("smoothCurves", "Smooth curves"),
+          default: false,
+          group: "display"
+        },
+        markers: {
+          type: "checkbox",
+          label: $t("showMarkers", "Show markers"),
+          default: false,
+          group: "display"
+        },
+        ...shared.options
+      }
+    }
+  };
+});

package/dist/modules/charts/runtime/blokkli/chart-types/line/illustration.d.vue.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/modules/charts/runtime/blokkli/chart-types/line/illustration.vue

@@ -0,0 +1,59 @@
+<template>
+  <svg viewBox="0 0 120 80" xmlns="http://www.w3.org/2000/svg">
+    <polyline
+      :points="toPoints(secondary)"
+      fill="none"
+      stroke-width="2"
+      stroke-linecap="round"
+      stroke-linejoin="round"
+      class="_bk_stroke-accent-300"
+    />
+    <polyline
+      :points="toPoints(primary)"
+      fill="none"
+      stroke-width="2.5"
+      stroke-linecap="round"
+      stroke-linejoin="round"
+      class="_bk_stroke-accent-500"
+    />
+    <circle
+      v-for="([cx, cy], i) in primary"
+      :key="i"
+      :cx="cx"
+      :cy="cy"
+      r="2.5"
+      class="_bk_fill-accent-500"
+    />
+    <line
+      x1="10"
+      y1="65"
+      x2="110"
+      y2="65"
+      stroke-width="1.5"
+      stroke-linecap="round"
+      class="_bk_stroke-accent-900"
+    />
+  </svg>
+</template>
+
+<script setup>
+const primary = [
+  [15, 42],
+  [33, 22],
+  [51, 35],
+  [69, 15],
+  [87, 30],
+  [105, 12]
+];
+const secondary = [
+  [15, 52],
+  [33, 45],
+  [51, 50],
+  [69, 40],
+  [87, 46],
+  [105, 38]
+];
+function toPoints(points) {
+  return points.map((p) => p.join(",")).join(" ");
+}
+</script>

package/dist/modules/charts/runtime/blokkli/chart-types/line/illustration.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/modules/charts/runtime/blokkli/chart-types/line/render.d.vue.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<any, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, any, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/modules/charts/runtime/blokkli/chart-types/line/render.vue

@@ -0,0 +1,98 @@
+<template>
+  <VChart :option="option" autoresize style="height: 550px; width: 100%" />
+</template>
+
+<script setup>
+import { computed } from "#imports";
+import VChart from "vue-echarts";
+import { use } from "echarts/core";
+import { CanvasRenderer } from "echarts/renderers";
+import { LineChart } from "echarts/charts";
+import {
+  GridComponent,
+  TooltipComponent,
+  LegendComponent,
+  TitleComponent
+} from "echarts/components";
+import { legendPositionToEcharts } from "../../../helpers/echarts";
+import { createNumberFormatter } from "../../../helpers/numberFormat";
+use([
+  CanvasRenderer,
+  LineChart,
+  GridComponent,
+  TooltipComponent,
+  LegendComponent,
+  TitleComponent
+]);
+const props = defineProps({
+  title: { type: String, required: true },
+  categories: { type: Array, required: true },
+  series: { type: Array, required: true },
+  seriesHexColors: { type: Array, required: true },
+  categoryHexColors: { type: Array, required: true },
+  typeOptions: { type: Object, required: true },
+  numberFormat: { type: Object, required: false },
+  isEditing: { type: Boolean, required: true },
+  advancedConfig: { type: Object, required: false }
+});
+const opts = computed(() => {
+  const t = props.typeOptions;
+  return {
+    curved: t.curved ?? false,
+    markers: t.markers ?? false,
+    xaxisRotation: t.xaxisRotation ?? "auto",
+    dataLabels: t.dataLabels ?? false,
+    gridLines: t.gridLines ?? true,
+    legendPosition: t.legendPosition ?? "bottom",
+    strokeWidth: Number(t.strokeWidth ?? 2) || 2,
+    yaxisMin: typeof t.yaxisMin === "number" && Number.isFinite(t.yaxisMin) ? t.yaxisMin : void 0
+  };
+});
+const option = computed(() => {
+  const o = opts.value;
+  const valueFormatter = createNumberFormatter(props.numberFormat);
+  const xAxis = {
+    type: "category",
+    data: props.categories,
+    boundaryGap: false
+  };
+  if (o.xaxisRotation !== "auto") {
+    xAxis.axisLabel = { rotate: Number(o.xaxisRotation) };
+  }
+  const yAxis = {
+    type: "value",
+    axisLabel: { formatter: (v) => valueFormatter(v) },
+    splitLine: { show: o.gridLines }
+  };
+  if (o.yaxisMin !== void 0) yAxis.min = o.yaxisMin;
+  return {
+    title: props.title ? { text: props.title, left: "left" } : void 0,
+    animation: !props.isEditing,
+    tooltip: {
+      trigger: "axis",
+      valueFormatter: (v) => valueFormatter(v)
+    },
+    legend: {
+      ...legendPositionToEcharts(o.legendPosition),
+      data: props.series.map((s) => s.name)
+    },
+    grid: { containLabel: true, top: 50, left: 10, right: 10, bottom: 40 },
+    xAxis,
+    yAxis,
+    series: props.series.map((s, i) => ({
+      type: "line",
+      name: s.name,
+      data: s.data,
+      smooth: o.curved,
+      showSymbol: o.markers,
+      symbolSize: 6,
+      lineStyle: { width: o.strokeWidth, color: props.seriesHexColors[i] },
+      itemStyle: { color: props.seriesHexColors[i] },
+      label: {
+        show: o.dataLabels,
+        formatter: (p) => valueFormatter(p.value)
+      }
+    }))
+  };
+});
+</script>

package/dist/modules/charts/runtime/blokkli/chart-types/line/render.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<any, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, any, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/modules/charts/runtime/blokkli/chart-types/pie/definition.d.ts

@@ -0,0 +1,6 @@
+import type { CategoryFilterTypeOptions } from '#blokkli/charts/types';
+export type TypeOptions = {
+    showLabels: boolean;
+} & CategoryFilterTypeOptions;
+declare const _default: any;
+export default _default;

package/dist/modules/charts/runtime/blokkli/chart-types/pie/definition.js

@@ -0,0 +1,29 @@
+import { defineChartType } from "#blokkli/charts/definition";
+import {
+  categoryFilterOptions,
+  mergeShared
+} from "#blokkli/charts/definition/options";
+export default defineChartType("pie", ($t) => {
+  const shared = mergeShared(categoryFilterOptions($t));
+  return {
+    hasSeriesColors: false,
+    hasCategoryColors: true,
+    editor: {
+      label: $t("chartsTypePie", "Pie"),
+      description: $t(
+        "chartsTypePieDescription",
+        "Divides a circle into slices to show proportional shares of a whole."
+      ),
+      icon: "bk_mdi_pie_chart",
+      options: {
+        showLabels: {
+          type: "checkbox",
+          label: $t("showLabels", "Show labels"),
+          default: true,
+          group: "labels"
+        },
+        ...shared.options
+      }
+    }
+  };
+});

package/dist/modules/charts/runtime/blokkli/chart-types/pie/illustration.d.vue.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/modules/charts/runtime/blokkli/chart-types/pie/illustration.vue

@@ -0,0 +1,20 @@
+<template>
+  <svg viewBox="0 0 120 80" xmlns="http://www.w3.org/2000/svg">
+    <path
+      v-for="(s, i) in slices"
+      :key="i"
+      :d="`M 60 40 L ${s.start[0]} ${s.start[1]} A 28 28 0 0 1 ${s.end[0]} ${s.end[1]} Z`"
+      :class="s.color"
+    />
+  </svg>
+</template>
+
+<script setup>
+import { tw } from "#blokkli/helpers/tw";
+const slices = [
+  { start: [88, 40], end: [55.1, 67.6], color: tw("_bk_fill-accent-500") },
+  { start: [55.1, 67.6], end: [32, 40], color: tw("_bk_fill-accent-800") },
+  { start: [32, 40], end: [60, 12], color: tw("_bk_fill-accent-300") },
+  { start: [60, 12], end: [88, 40], color: tw("_bk_fill-accent-400") }
+];
+</script>

package/dist/modules/charts/runtime/blokkli/chart-types/pie/illustration.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/modules/charts/runtime/blokkli/chart-types/pie/render.d.vue.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<any, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, any, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/modules/charts/runtime/blokkli/chart-types/pie/render.vue

@@ -0,0 +1,71 @@
+<template>
+  <VChart :option="option" autoresize style="height: 550px; width: 100%" />
+</template>
+
+<script setup>
+import { computed } from "#imports";
+import VChart from "vue-echarts";
+import { use } from "echarts/core";
+import { CanvasRenderer } from "echarts/renderers";
+import { PieChart } from "echarts/charts";
+import {
+  TooltipComponent,
+  LegendComponent,
+  TitleComponent
+} from "echarts/components";
+import {
+  createNumberFormatter,
+  createPercentFormatter
+} from "../../../helpers/numberFormat";
+use([
+  CanvasRenderer,
+  PieChart,
+  TooltipComponent,
+  LegendComponent,
+  TitleComponent
+]);
+const props = defineProps({
+  title: { type: String, required: true },
+  categories: { type: Array, required: true },
+  series: { type: Array, required: true },
+  seriesHexColors: { type: Array, required: true },
+  categoryHexColors: { type: Array, required: true },
+  typeOptions: { type: Object, required: true },
+  numberFormat: { type: Object, required: false },
+  isEditing: { type: Boolean, required: true },
+  advancedConfig: { type: Object, required: false }
+});
+const option = computed(() => {
+  const t = props.typeOptions;
+  const showLabels = t.showLabels ?? true;
+  const values = props.series[0]?.data ?? [];
+  const valueFormatter = createNumberFormatter(props.numberFormat);
+  const percentFormatter = createPercentFormatter(props.numberFormat);
+  const data = props.categories.map((name, i) => ({
+    name,
+    value: values[i] ?? 0,
+    itemStyle: { color: props.categoryHexColors[i] }
+  }));
+  return {
+    title: props.title ? { text: props.title, left: "left" } : void 0,
+    animation: !props.isEditing,
+    tooltip: {
+      trigger: "item",
+      valueFormatter: (v) => valueFormatter(v)
+    },
+    legend: { left: "center", bottom: 0, orient: "horizontal" },
+    series: [
+      {
+        type: "pie",
+        radius: "60%",
+        center: ["50%", "50%"],
+        data,
+        label: {
+          show: showLabels,
+          formatter: (p) => percentFormatter(p.percent)
+        }
+      }
+    ]
+  };
+});
+</script>

package/dist/modules/charts/runtime/blokkli/chart-types/pie/render.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<any, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, any, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/modules/charts/runtime/blokkli/chart-types/radar/definition.d.ts

@@ -0,0 +1,7 @@
+import type { DataLabelsTypeOptions, LegendTypeOptions, CategoryFilterTypeOptions } from '#blokkli/charts/types';
+export type TypeOptions = {
+    markers: boolean;
+    fillOpacity: string;
+} & DataLabelsTypeOptions & LegendTypeOptions & CategoryFilterTypeOptions;
+declare const _default: any;
+export default _default;

package/dist/modules/charts/runtime/blokkli/chart-types/radar/definition.js

@@ -0,0 +1,45 @@
+import { defineChartType } from "#blokkli/charts/definition";
+import {
+  dataLabelsOptions,
+  legendOptions,
+  categoryFilterOptions,
+  mergeShared
+} from "#blokkli/charts/definition/options";
+export default defineChartType("radar", ($t) => {
+  const shared = mergeShared(
+    dataLabelsOptions($t),
+    legendOptions($t),
+    categoryFilterOptions($t)
+  );
+  return {
+    hasSeriesColors: true,
+    hasCategoryColors: false,
+    editor: {
+      label: $t("chartsTypeRadar", "Radar"),
+      description: $t(
+        "chartsTypeRadarDescription",
+        "Plots several variables on radial axes to compare strengths and weaknesses across categories."
+      ),
+      icon: "bk_mdi_radar",
+      options: {
+        markers: {
+          type: "checkbox",
+          label: $t("showMarkers", "Show markers"),
+          default: false,
+          group: "display"
+        },
+        fillOpacity: {
+          type: "radios",
+          label: $t("chartsRadarFillOpacity", "Fill opacity"),
+          default: "0.2",
+          options: {
+            "0.2": $t("chartsOpacityTransparent", "Transparent"),
+            "0.4": $t("chartsOpacityLight", "Light"),
+            "0.8": $t("chartsOpacitySolid", "Solid")
+          }
+        },
+        ...shared.options
+      }
+    }
+  };
+});

package/dist/modules/charts/runtime/blokkli/chart-types/radar/illustration.d.vue.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;