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

package/dist/modules/charts/runtime/chartTypes/area.js

@@ -1,68 +0,0 @@
-import { defineChartType } from "./define.js";
-import {
-  xAxisOptions,
-  buildXAxisLabelOptions,
-  dataLabelsOptions,
-  buildDataLabelsOptions,
-  legendOptions,
-  buildLegendOptions,
-  gridOptions,
-  buildGridOptions,
-  strokeWidthOptions,
-  buildStrokeWidthOptions,
-  mergeShared
-} from "./shared.js";
-export default defineChartType(($t) => {
-  const shared = mergeShared(
-    xAxisOptions($t),
-    dataLabelsOptions($t),
-    legendOptions($t),
-    gridOptions($t),
-    strokeWidthOptions($t)
-  );
-  return {
-    id: "area",
-    hasMultipleSeries: true,
-    hasSeriesColors: true,
-    hasCategoryColors: false,
-    buildChartOptions(ctx) {
-      const strokeWidth = buildStrokeWidthOptions(ctx.typeOptions);
-      return {
-        stroke: {
-          curve: ctx.typeOptions.curved ? "smooth" : "straight",
-          ...strokeWidth.stroke
-        },
-        markers: { size: ctx.typeOptions.markers ? 5 : 0 },
-        xaxis: {
-          categories: ctx.categories,
-          ...buildXAxisLabelOptions(ctx.typeOptions)
-        },
-        ...buildDataLabelsOptions(ctx.typeOptions),
-        ...buildLegendOptions(ctx.typeOptions),
-        ...buildGridOptions(ctx.typeOptions)
-      };
-    },
-    buildSeries(ctx) {
-      return ctx.series.map((s) => ({ name: s.name, data: s.data }));
-    },
-    editor: {
-      label: $t("chartsTypeArea", "Area"),
-      icon: "bk_mdi_area_chart",
-      options: {
-        curved: {
-          type: "checkbox",
-          label: $t("chartsAreaCurved", "Smooth curves"),
-          default: false,
-          group: "display"
-        },
-        markers: {
-          type: "checkbox",
-          label: $t("chartsAreaMarkers", "Show markers"),
-          default: false,
-          group: "display"
-        },
-        ...shared.options
-      }
-    }
-  };
-});

package/dist/modules/charts/runtime/chartTypes/define.d.ts

@@ -1,2 +0,0 @@
-import type { ChartTypeFactory } from './types.js';
-export declare function defineChartType<T extends Record<string, unknown>>(factory: ChartTypeFactory<T>): ChartTypeFactory<T>;

package/dist/modules/charts/runtime/chartTypes/define.js

@@ -1,3 +0,0 @@
-export function defineChartType(factory) {
-  return factory;
-}

package/dist/modules/charts/runtime/chartTypes/donut.d.ts

@@ -1,6 +0,0 @@
-export type TypeOptions = {
-    showTotal: boolean;
-    showLabels: boolean;
-};
-declare const _default: import("./types.js").ChartTypeFactory<TypeOptions>;
-export default _default;

package/dist/modules/charts/runtime/chartTypes/donut.js

@@ -1,45 +0,0 @@
-import { defineChartType } from "./define.js";
-export default defineChartType(($t) => ({
-  id: "donut",
-  hasMultipleSeries: false,
-  hasSeriesColors: false,
-  hasCategoryColors: true,
-  buildChartOptions(ctx) {
-    const show = !!ctx.typeOptions.showTotal;
-    return {
-      labels: ctx.categories,
-      dataLabels: { enabled: !!ctx.typeOptions.showLabels },
-      plotOptions: {
-        pie: {
-          donut: {
-            labels: {
-              show,
-              total: { show }
-            }
-          }
-        }
-      }
-    };
-  },
-  buildSeries(ctx) {
-    return ctx.series[0]?.data || [];
-  },
-  editor: {
-    label: $t("chartsTypeDonut", "Donut"),
-    icon: "bk_mdi_donut_large",
-    options: {
-      showTotal: {
-        type: "checkbox",
-        label: $t("chartsDonutShowTotal", "Show total"),
-        default: false,
-        group: "display"
-      },
-      showLabels: {
-        type: "checkbox",
-        label: $t("chartsDonutShowLabels", "Show labels"),
-        default: true,
-        group: "labels"
-      }
-    }
-  }
-}));

package/dist/modules/charts/runtime/chartTypes/heatmap.js

@@ -1,54 +0,0 @@
-import { defineChartType } from "./define.js";
-import {
-  xAxisOptions,
-  buildXAxisLabelOptions,
-  legendOptions,
-  buildLegendOptions,
-  gridOptions,
-  buildGridOptions,
-  mergeShared
-} from "./shared.js";
-export default defineChartType(($t) => {
-  const shared = mergeShared(
-    xAxisOptions($t),
-    legendOptions($t),
-    gridOptions($t)
-  );
-  return {
-    id: "heatmap",
-    hasMultipleSeries: true,
-    hasSeriesColors: false,
-    hasCategoryColors: false,
-    buildChartOptions(ctx) {
-      return {
-        dataLabels: { enabled: true },
-        plotOptions: {
-          heatmap: {
-            colorScale: { ranges: [] }
-          }
-        },
-        xaxis: {
-          ...buildXAxisLabelOptions(ctx.typeOptions)
-        },
-        ...buildLegendOptions(ctx.typeOptions),
-        ...buildGridOptions(ctx.typeOptions)
-      };
-    },
-    buildSeries(ctx) {
-      return ctx.series.map((s) => ({
-        name: s.name,
-        data: s.data.map((value, i) => ({
-          x: ctx.categories[i] || "",
-          y: value
-        }))
-      }));
-    },
-    editor: {
-      label: $t("chartsTypeHeatmap", "Heatmap"),
-      icon: "bk_mdi_grid_view",
-      options: {
-        ...shared.options
-      }
-    }
-  };
-});

package/dist/modules/charts/runtime/chartTypes/index.d.ts

@@ -1,39 +0,0 @@
-import type { TranslateFunction, ChartTypeDefinition } from './types.js';
-import type { TypeOptions as BarTypeOptions } from './bar.js';
-import type { TypeOptions as LineTypeOptions } from './line.js';
-import type { TypeOptions as AreaTypeOptions } from './area.js';
-import type { TypeOptions as PieTypeOptions } from './pie.js';
-import type { TypeOptions as DonutTypeOptions } from './donut.js';
-import type { TypeOptions as HeatmapTypeOptions } from './heatmap.js';
-import type { TypeOptions as RadialBarTypeOptions } from './radialBar.js';
-import type { TypeOptions as RadarTypeOptions } from './radar.js';
-export type ChartTypeOptionsMap = {
-    bar: BarTypeOptions;
-    line: LineTypeOptions;
-    area: AreaTypeOptions;
-    pie: PieTypeOptions;
-    donut: DonutTypeOptions;
-    heatmap: HeatmapTypeOptions;
-    radialBar: RadialBarTypeOptions;
-    radar: RadarTypeOptions;
-};
-/**
- * Get a chart type definition using fallback labels (no real translations).
- * Used by ChartRenderer which runs in both edit mode and production.
- */
-export declare function getChartTypeRuntime(id: string): ChartTypeDefinition | undefined;
-/**
- * Get all chart type definitions with translated labels.
- * Used by editor components only.
- */
-export declare function getChartTypes($t: TranslateFunction): ChartTypeDefinition[];
-/**
- * Get a single chart type definition with translated labels.
- * Used by editor components only.
- */
-export declare function getChartType(id: string, $t: TranslateFunction): ChartTypeDefinition | undefined;
-/**
- * Get the default type options for a chart type.
- */
-export declare function getDefaultTypeOptions(id: string): Record<string, unknown>;
-export type { ChartTypeDefinition, ChartBuildContext, TranslateFunction, } from './types.js';

package/dist/modules/charts/runtime/chartTypes/index.js

@@ -1,47 +0,0 @@
-import barFactory from "./bar.js";
-import lineFactory from "./line.js";
-import areaFactory from "./area.js";
-import pieFactory from "./pie.js";
-import donutFactory from "./donut.js";
-import heatmapFactory from "./heatmap.js";
-import radialBarFactory from "./radialBar.js";
-import radarFactory from "./radar.js";
-const factories = [
-  barFactory,
-  lineFactory,
-  pieFactory,
-  areaFactory,
-  donutFactory,
-  heatmapFactory,
-  radialBarFactory,
-  radarFactory
-];
-const noopT = (_key, fallback) => fallback;
-const runtimeCache = {};
-function ensureRuntimeCache() {
-  if (Object.keys(runtimeCache).length === 0) {
-    for (const factory of factories) {
-      const def = factory(noopT);
-      runtimeCache[def.id] = def;
-    }
-  }
-}
-export function getChartTypeRuntime(id) {
-  ensureRuntimeCache();
-  return runtimeCache[id];
-}
-export function getChartTypes($t) {
-  return factories.map((factory) => factory($t));
-}
-export function getChartType(id, $t) {
-  return getChartTypes($t).find((def) => def.id === id);
-}
-export function getDefaultTypeOptions(id) {
-  const def = getChartTypeRuntime(id);
-  if (!def) return {};
-  const defaults = {};
-  for (const [key, opt] of Object.entries(def.editor.options)) {
-    defaults[key] = opt.default;
-  }
-  return defaults;
-}

package/dist/modules/charts/runtime/chartTypes/line.d.ts

@@ -1,7 +0,0 @@
-import type { XAxisTypeOptions, DataLabelsTypeOptions, LegendTypeOptions, GridTypeOptions, StrokeWidthTypeOptions } from './shared.js';
-export type TypeOptions = {
-    curved: boolean;
-    markers: boolean;
-} & XAxisTypeOptions & DataLabelsTypeOptions & LegendTypeOptions & GridTypeOptions & StrokeWidthTypeOptions;
-declare const _default: import("./types.js").ChartTypeFactory<TypeOptions>;
-export default _default;

package/dist/modules/charts/runtime/chartTypes/line.js

@@ -1,68 +0,0 @@
-import { defineChartType } from "./define.js";
-import {
-  xAxisOptions,
-  buildXAxisLabelOptions,
-  dataLabelsOptions,
-  buildDataLabelsOptions,
-  legendOptions,
-  buildLegendOptions,
-  gridOptions,
-  buildGridOptions,
-  strokeWidthOptions,
-  buildStrokeWidthOptions,
-  mergeShared
-} from "./shared.js";
-export default defineChartType(($t) => {
-  const shared = mergeShared(
-    xAxisOptions($t),
-    dataLabelsOptions($t),
-    legendOptions($t),
-    gridOptions($t),
-    strokeWidthOptions($t)
-  );
-  return {
-    id: "line",
-    hasMultipleSeries: true,
-    hasSeriesColors: true,
-    hasCategoryColors: false,
-    buildChartOptions(ctx) {
-      const strokeWidth = buildStrokeWidthOptions(ctx.typeOptions);
-      return {
-        stroke: {
-          curve: ctx.typeOptions.curved ? "smooth" : "straight",
-          ...strokeWidth.stroke
-        },
-        markers: { size: ctx.typeOptions.markers ? 5 : 0 },
-        xaxis: {
-          categories: ctx.categories,
-          ...buildXAxisLabelOptions(ctx.typeOptions)
-        },
-        ...buildDataLabelsOptions(ctx.typeOptions),
-        ...buildLegendOptions(ctx.typeOptions),
-        ...buildGridOptions(ctx.typeOptions)
-      };
-    },
-    buildSeries(ctx) {
-      return ctx.series.map((s) => ({ name: s.name, data: s.data }));
-    },
-    editor: {
-      label: $t("chartsTypeLine", "Line"),
-      icon: "bk_mdi_show_chart",
-      options: {
-        curved: {
-          type: "checkbox",
-          label: $t("chartsLineCurved", "Smooth curves"),
-          default: false,
-          group: "display"
-        },
-        markers: {
-          type: "checkbox",
-          label: $t("chartsLineMarkers", "Show markers"),
-          default: false,
-          group: "display"
-        },
-        ...shared.options
-      }
-    }
-  };
-});

package/dist/modules/charts/runtime/chartTypes/pie.d.ts

@@ -1,5 +0,0 @@
-export type TypeOptions = {
-    showLabels: boolean;
-};
-declare const _default: import("./types.js").ChartTypeFactory<TypeOptions>;
-export default _default;

package/dist/modules/charts/runtime/chartTypes/pie.js

@@ -1,28 +0,0 @@
-import { defineChartType } from "./define.js";
-export default defineChartType(($t) => ({
-  id: "pie",
-  hasMultipleSeries: false,
-  hasSeriesColors: false,
-  hasCategoryColors: true,
-  buildChartOptions(ctx) {
-    return {
-      labels: ctx.categories,
-      dataLabels: { enabled: !!ctx.typeOptions.showLabels }
-    };
-  },
-  buildSeries(ctx) {
-    return ctx.series[0]?.data || [];
-  },
-  editor: {
-    label: $t("chartsTypePie", "Pie"),
-    icon: "bk_mdi_pie_chart",
-    options: {
-      showLabels: {
-        type: "checkbox",
-        label: $t("chartsPieShowLabels", "Show labels"),
-        default: true,
-        group: "labels"
-      }
-    }
-  }
-}));

package/dist/modules/charts/runtime/chartTypes/radar.d.ts

@@ -1,7 +0,0 @@
-import type { DataLabelsTypeOptions, LegendTypeOptions } from './shared.js';
-export type TypeOptions = {
-    markers: boolean;
-    fillOpacity: string;
-} & DataLabelsTypeOptions & LegendTypeOptions;
-declare const _default: import("./types.js").ChartTypeFactory<TypeOptions>;
-export default _default;

package/dist/modules/charts/runtime/chartTypes/radar.js

@@ -1,52 +0,0 @@
-import { defineChartType } from "./define.js";
-import {
-  dataLabelsOptions,
-  buildDataLabelsOptions,
-  legendOptions,
-  buildLegendOptions,
-  mergeShared
-} from "./shared.js";
-export default defineChartType(($t) => {
-  const shared = mergeShared(dataLabelsOptions($t), legendOptions($t));
-  return {
-    id: "radar",
-    hasMultipleSeries: true,
-    hasSeriesColors: true,
-    hasCategoryColors: false,
-    buildChartOptions(ctx) {
-      return {
-        xaxis: { categories: ctx.categories },
-        markers: { size: ctx.typeOptions.markers ? 5 : 0 },
-        fill: { opacity: Number(ctx.typeOptions.fillOpacity) || 0.2 },
-        ...buildDataLabelsOptions(ctx.typeOptions),
-        ...buildLegendOptions(ctx.typeOptions)
-      };
-    },
-    buildSeries(ctx) {
-      return ctx.series.map((s) => ({ name: s.name, data: s.data }));
-    },
-    editor: {
-      label: $t("chartsTypeRadar", "Radar"),
-      icon: "bk_mdi_radar",
-      options: {
-        markers: {
-          type: "checkbox",
-          label: $t("chartsRadarMarkers", "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/chartTypes/radialBar.d.ts

@@ -1,6 +0,0 @@
-export type TypeOptions = {
-    showLabels: boolean;
-    showTotal: boolean;
-};
-declare const _default: import("./types.js").ChartTypeFactory<TypeOptions>;
-export default _default;

package/dist/modules/charts/runtime/chartTypes/radialBar.js

@@ -1,44 +0,0 @@
-import { defineChartType } from "./define.js";
-export default defineChartType(($t) => ({
-  id: "radialBar",
-  hasMultipleSeries: false,
-  hasSeriesColors: false,
-  hasCategoryColors: true,
-  buildChartOptions(ctx) {
-    const showLabels = !!ctx.typeOptions.showLabels;
-    const showTotal = !!ctx.typeOptions.showTotal;
-    return {
-      labels: ctx.categories,
-      plotOptions: {
-        radialBar: {
-          dataLabels: {
-            name: { show: showLabels },
-            value: { show: showLabels },
-            total: { show: showTotal }
-          }
-        }
-      }
-    };
-  },
-  buildSeries(ctx) {
-    return ctx.series[0]?.data || [];
-  },
-  editor: {
-    label: $t("chartsTypeRadialBar", "Radial Bar"),
-    icon: "bk_mdi_track_changes",
-    options: {
-      showLabels: {
-        type: "checkbox",
-        label: $t("chartsRadialBarShowLabels", "Show labels"),
-        default: true,
-        group: "labels"
-      },
-      showTotal: {
-        type: "checkbox",
-        label: $t("chartsRadialBarShowTotal", "Show total"),
-        default: false,
-        group: "display"
-      }
-    }
-  }
-}));

package/dist/modules/charts/runtime/chartTypes/shared.d.ts

@@ -1,67 +0,0 @@
-import type { BlokkliIcon } from '#blokkli-build/icons';
-import type { BlockOptionDefinitionBase } from '../../../../global/types/blockOptions.js';
-import type { TranslateFunction } from './types.js';
-type SharedOptions = {
-    options: Record<string, BlockOptionDefinitionBase<BlokkliIcon>>;
-};
-export type XAxisTypeOptions = {
-    xaxisRotation: string;
-};
-export type DataLabelsTypeOptions = {
-    dataLabels: boolean;
-};
-export type LegendTypeOptions = {
-    legendPosition: string;
-};
-export type GridTypeOptions = {
-    gridLines: boolean;
-};
-export type StrokeWidthTypeOptions = {
-    strokeWidth: string;
-};
-/**
- * Shared x-axis label options for chart types that display an x-axis.
- */
-export declare function xAxisOptions($t: TranslateFunction): SharedOptions;
-/**
- * Build x-axis label config from type options.
- * Returns properties to merge into the xaxis config object.
- */
-export declare function buildXAxisLabelOptions(typeOptions: XAxisTypeOptions): Record<string, any>;
-/**
- * Data labels option — show values directly on chart elements.
- */
-export declare function dataLabelsOptions($t: TranslateFunction): SharedOptions;
-/**
- * Build data labels config from type options.
- */
-export declare function buildDataLabelsOptions(typeOptions: DataLabelsTypeOptions): Record<string, any>;
-/**
- * Legend position option for multi-series chart types.
- */
-export declare function legendOptions($t: TranslateFunction): SharedOptions;
-/**
- * Build legend config from type options.
- */
-export declare function buildLegendOptions(typeOptions: LegendTypeOptions): Record<string, any>;
-/**
- * Grid lines option for chart types with axes.
- */
-export declare function gridOptions($t: TranslateFunction): SharedOptions;
-/**
- * Build grid config from type options.
- */
-export declare function buildGridOptions(typeOptions: GridTypeOptions): Record<string, any>;
-/**
- * Stroke width option for line-based chart types.
- */
-export declare function strokeWidthOptions($t: TranslateFunction): SharedOptions;
-/**
- * Build stroke width config from type options.
- */
-export declare function buildStrokeWidthOptions(typeOptions: StrokeWidthTypeOptions): Record<string, any>;
-/**
- * Merge multiple shared option sets into one.
- */
-export declare function mergeShared(...sets: SharedOptions[]): SharedOptions;
-export {};

package/dist/modules/charts/runtime/chartTypes/types.d.ts

@@ -1,29 +0,0 @@
-import type { BlokkliIcon } from '#blokkli-build/icons';
-import type { BlockOptionDefinitionBase } from '../../../../global/types/blockOptions.js';
-export type TranslateFunction = (key: string, fallback: string) => string;
-export type ChartBuildContext<T extends Record<string, unknown> = Record<string, unknown>> = {
-    title: string;
-    categories: string[];
-    series: Array<{
-        name: string;
-        color: string;
-        data: number[];
-    }>;
-    seriesColors: string[];
-    categoryColors: string[];
-    typeOptions: T;
-};
-export type ChartTypeDefinition<T extends Record<string, unknown> = Record<string, unknown>> = {
-    id: string;
-    hasMultipleSeries: boolean;
-    hasSeriesColors: boolean;
-    hasCategoryColors: boolean;
-    buildChartOptions: (ctx: ChartBuildContext<T>) => Record<string, any>;
-    buildSeries: (ctx: ChartBuildContext<T>) => any;
-    editor: {
-        label: string;
-        icon: BlokkliIcon;
-        options: Record<string, BlockOptionDefinitionBase<BlokkliIcon>>;
-    };
-};
-export type ChartTypeFactory<T extends Record<string, unknown> = Record<string, unknown>> = ($t: TranslateFunction) => ChartTypeDefinition<T>;

package/dist/runtime/editor/components/AutoHeight/index.vue

@@ -1,55 +0,0 @@
-<template>
-  <div
-    class="bk-auto-height"
-    :class="'bk-is-' + anchor"
-    :style="{ height: height + 'px' }"
-  >
-    <div ref="inner" class="bk-auto-height-inner">
-      <slot />
-    </div>
-  </div>
-</template>
-
-<script setup>
-import { useTemplateRef, ref, onMounted, onBeforeUnmount } from "#imports";
-defineProps({
-  anchor: { type: String, required: true }
-});
-const inner = useTemplateRef("inner");
-const height = ref(0);
-let observer = null;
-onMounted(() => {
-  const el = inner.value;
-  if (!el) return;
-  observer = new ResizeObserver(() => {
-    height.value = el.scrollHeight;
-  });
-  observer.observe(el);
-});
-onBeforeUnmount(() => {
-  observer?.disconnect();
-});
-</script>
-
-<style>
-.bk .bk-auto-height {
-  position: relative;
-  overflow: hidden;
-  transition: 0.3s height;
-  transition-timing-function: cubic-bezier(0.56, 0.04, 0.25, 1)
-}
-
-  .bk .bk-auto-height.bk-is-top .bk-auto-height-inner {
-  top: 0px
-}
-
-  .bk .bk-auto-height.bk-is-bottom .bk-auto-height-inner {
-  bottom: 0px
-}
-
-  .bk .bk-auto-height .bk-auto-height-inner {
-  position: absolute;
-  left: 0px;
-  width: 100%
-}
-</style>