@revenexx/editor 0.1.0

package/dist/modules/charts/runtime/components/ChartRenderer/index.vue

@@ -0,0 +1,221 @@
+<template>
+  <div>
+    <div v-if="showCategoryFilter" class="_bk_blokkli-chart-category-filter">
+      <label>
+        <span v-if="categoryFilterLabel">{{ categoryFilterLabel }}:</span>
+        <select v-model.number="selectedCategoryIndex">
+          <option v-for="(c, i) in formattedCategories" :key="i" :value="i">
+            {{ c }}
+          </option>
+        </select>
+      </label>
+    </div>
+    <ClientOnly>
+      <component
+        :is="typeComponent"
+        v-if="typeComponent && finalRenderProps"
+        v-bind="finalRenderProps"
+      />
+      <ol v-if="resolvedFootnotes.length" class="_bk_blokkli-chart-footnotes">
+        <li v-for="(note, i) in resolvedFootnotes" :key="i">
+          <span class="_bk_blokkli-chart-footnote-marker">{{
+            superscriptFor(i + 1)
+          }}</span>
+          {{ note }}
+        </li>
+      </ol>
+    </ClientOnly>
+  </div>
+</template>
+
+<script setup>
+import { computed, inject, ref, useBlokkliRuntimeConfig } from "#imports";
+import { applyFootnotes, SUPERSCRIPTS } from "../../helpers";
+import { detectDateFormat, formatDateCategory } from "../../helpers/dateFormat";
+import { INJECT_CHART_PREVIEW_DYNAMIC_DATA } from "../../helpers/previewInjection";
+import { chartTypeComponents } from "#blokkli-build/charts-components";
+import {
+  INJECT_IS_EDITING,
+  INJECT_PROVIDER_CONTEXT
+} from "#blokkli/helpers/injections";
+const props = defineProps({
+  title: { type: String, required: true },
+  categories: { type: Array, required: true },
+  series: { type: Array, required: true },
+  categoryColors: { type: Array, required: true },
+  footnotes: { type: Array, required: true },
+  numberFormat: { type: Object, required: false },
+  dateFormat: { type: Object, required: false },
+  translations: { type: Object, required: false },
+  dataSource: { type: Object, required: false },
+  advancedConfig: { type: Object, required: false },
+  type: { type: String, required: true },
+  typeOptions: { type: Object, required: false },
+  languageOverride: { type: String, required: false },
+  dynamicData: { type: [Object, null], required: false }
+});
+const isEditing = inject(INJECT_IS_EDITING, false);
+const { resolveColorHex, colorPalette } = useBlokkliRuntimeConfig();
+const providerEntity = inject(INJECT_PROVIDER_CONTEXT, null);
+const previewDynamicData = inject(INJECT_CHART_PREVIEW_DYNAMIC_DATA, null);
+const currentLanguage = computed(
+  () => props.languageOverride ?? providerEntity?.value.language ?? ""
+);
+const hasDynamicSource = computed(() => !!props.dataSource);
+const effectiveDynamicPayload = computed(() => {
+  if (props.dynamicData !== void 0 && props.dynamicData !== null) {
+    return props.dynamicData;
+  }
+  return previewDynamicData?.value ?? null;
+});
+const effectiveData = computed(() => {
+  if (hasDynamicSource.value) {
+    const payload = effectiveDynamicPayload.value;
+    if (!payload) return null;
+    const overrides = props.dataSource?.seriesOverrides ?? {};
+    const categoryOverrides = props.dataSource?.categoryColorOverrides ?? {};
+    const palette = colorPalette.value;
+    const fallback = palette[0] ?? "";
+    const visibleSeries = payload.series.filter(
+      (s) => overrides[s.name]?.hidden !== true
+    );
+    const series = visibleSeries.map((s, i) => ({
+      name: s.name,
+      color: overrides[s.name]?.color ?? palette[i % Math.max(palette.length, 1)] ?? fallback,
+      data: s.data
+    }));
+    const categoryColors = payload.categories.map((label, i) => {
+      return categoryOverrides[label] ?? palette[i % Math.max(palette.length, 1)] ?? fallback;
+    });
+    return {
+      categories: payload.categories,
+      series,
+      categoryColors
+    };
+  }
+  return {
+    categories: props.categories,
+    series: props.series,
+    categoryColors: props.categoryColors
+  };
+});
+const resolvedTitle = computed(() => {
+  const t = props.translations?.[currentLanguage.value];
+  return t?.title || props.title;
+});
+const resolvedCategories = computed(() => {
+  const data = effectiveData.value;
+  if (!data) return [];
+  if (hasDynamicSource.value) return data.categories;
+  const t = props.translations?.[currentLanguage.value];
+  if (!t?.categories) return data.categories;
+  return data.categories.map((c, i) => t.categories?.[i] || c);
+});
+const resolvedSeries = computed(() => {
+  const data = effectiveData.value;
+  if (!data) return [];
+  if (hasDynamicSource.value) return data.series;
+  const t = props.translations?.[currentLanguage.value];
+  if (!t?.seriesNames) return data.series;
+  return data.series.map((s, i) => ({
+    ...s,
+    name: t.seriesNames?.[i] || s.name
+  }));
+});
+const resolvedFootnotes = computed(() => {
+  const t = props.translations?.[currentLanguage.value];
+  if (!t?.footnotes) return props.footnotes;
+  return props.footnotes.map((f, i) => t.footnotes?.[i] || f);
+});
+const formattedCategories = computed(() => {
+  const cats = resolvedCategories.value;
+  const detected = detectDateFormat(cats);
+  if (!detected) return cats;
+  const locale = props.numberFormat?.locale;
+  return cats.map(
+    (c) => formatDateCategory(c, detected, props.dateFormat, locale)
+  );
+});
+const resolvedNumberFormat = computed(() => {
+  if (!props.numberFormat) return void 0;
+  const t = props.translations?.[currentLanguage.value];
+  if (!t || t.prefix === void 0 && t.suffix === void 0) {
+    return props.numberFormat;
+  }
+  return {
+    ...props.numberFormat,
+    prefix: t.prefix || props.numberFormat.prefix,
+    suffix: t.suffix || props.numberFormat.suffix
+  };
+});
+function superscriptFor(n) {
+  if (import.meta.server) {
+    return "";
+  }
+  return String(n).split("").map((d) => SUPERSCRIPTS[d] || d).join("");
+}
+const typeComponent = computed(
+  () => chartTypeComponents[props.type]
+);
+const renderProps = computed(() => {
+  const data = effectiveData.value;
+  if (!data) return null;
+  return {
+    title: applyFootnotes(resolvedTitle.value),
+    categories: formattedCategories.value.map(applyFootnotes),
+    series: resolvedSeries.value.map((s) => ({
+      name: applyFootnotes(s.name),
+      data: s.data
+    })),
+    seriesHexColors: data.series.map((s) => resolveColorHex(s.color)),
+    categoryHexColors: data.categoryColors.map(resolveColorHex),
+    typeOptions: props.typeOptions ?? {},
+    numberFormat: resolvedNumberFormat.value,
+    isEditing,
+    advancedConfig: props.advancedConfig?.parsed
+  };
+});
+const typeOptionsBag = computed(
+  () => props.typeOptions ?? {}
+);
+const categoryFilterEnabled = computed(
+  () => typeOptionsBag.value.categoryFilter === true
+);
+const categoryFilterLabel = computed(
+  () => typeOptionsBag.value.categoryFilterLabel ?? ""
+);
+const selectedCategoryIndex = ref(0);
+const clampedSelectedIndex = computed(() => {
+  const max = (renderProps.value?.categories.length ?? 0) - 1;
+  if (max < 0) return -1;
+  return Math.min(Math.max(selectedCategoryIndex.value, 0), max);
+});
+const showCategoryFilter = computed(() => {
+  if (!categoryFilterEnabled.value) return false;
+  const base = renderProps.value;
+  if (!base) return false;
+  return base.categories.length > 1 && base.series.length > 0;
+});
+const finalRenderProps = computed(() => {
+  const base = renderProps.value;
+  if (!base) return null;
+  if (!categoryFilterEnabled.value) return base;
+  const idx = clampedSelectedIndex.value;
+  if (idx < 0) return base;
+  return {
+    ...base,
+    categories: base.series.map((s) => s.name),
+    series: [
+      {
+        name: base.categories[idx] ?? "",
+        data: base.series.map((s) => s.data[idx] ?? 0)
+      }
+    ],
+    // The original series colors become per-bar colors via the
+    // category-color slot — types that natively colour per category
+    // (bar in filter mode, donut, pie) pick them up automatically.
+    categoryHexColors: base.seriesHexColors,
+    seriesHexColors: [base.seriesHexColors[0] ?? "#888888"]
+  };
+});
+</script>

package/dist/modules/charts/runtime/components/ChartRenderer/index.vue.d.ts

@@ -0,0 +1,21 @@
+import type { BlokkliChartData, ChartDataSourcePayload } from '../../types.js';
+type __VLS_Props = BlokkliChartData & {
+    /**
+     * Override the language used to resolve translated strings. When unset,
+     * the language comes from the surrounding BlokkliProvider context.
+     */
+    languageOverride?: string;
+    /**
+     * Data fetched at runtime for a dynamic data source. Required when
+     * `props.dataSource` is set; otherwise ignored.
+     *
+     * The integrator's chart block component is responsible for fetching
+     * (e.g. via `useFetch` / `useLazyFetch`) and passing the result here.
+     * For large payloads, prefer `useLazyFetch` or `useAsyncData` with
+     * `server: false` to avoid bloating SSR HTML.
+     */
+    dynamicData?: ChartDataSourcePayload | null;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

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

@@ -0,0 +1 @@
+export { default as ChartRenderer } from './ChartRenderer/index.vue.js';

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

@@ -0,0 +1 @@
+export { default as ChartRenderer } from "./ChartRenderer/index.vue";

package/dist/modules/charts/runtime/features/charts/Editor/AdvancedConfigPanel/index.d.vue.ts

@@ -0,0 +1,11 @@
+import type { ChartAdvancedConfig } from '../../../../types.js';
+type __VLS_ModelProps = {
+    modelValue: ChartAdvancedConfig;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_ModelProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: ChartAdvancedConfig) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_ModelProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: ChartAdvancedConfig) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/modules/charts/runtime/features/charts/Editor/AdvancedConfigPanel/index.vue

@@ -0,0 +1,149 @@
+<template>
+  <PanelSection
+    :title="$t('chartsAdvancedConfigTitle', 'ECharts configuration')"
+  >
+    <div class="_bk_p-panel-gap _bk_flex _bk_flex-col _bk_gap-10">
+      <p class="_bk_text-mono-700 _bk_leading-snug">
+        {{
+          $t(
+  "chartsAdvancedConfigHelp",
+  "Paste any ECharts option object. Keys without quotes, single quotes and trailing commas are allowed. Functions (e.g. custom formatters) are not supported."
+)
+        }}
+      </p>
+      <FlexTextarea
+        :model-value="displayedSource"
+        textarea-class
+        class="bk-is-mono"
+        spellcheck="false"
+        autocapitalize="off"
+        autocomplete="off"
+        :min-height="320"
+        :on-before-paste="onBeforePaste"
+        @update:model-value="onSourceChange"
+      />
+      <div
+        v-if="parseError"
+        class="bk-advanced-config-error _bk_font-mono _bk_text-mono-900"
+      >
+        <div class="_bk_font-sans _bk_font-semibold _bk_mb-3 _bk_text-red-normal">
+          {{ $t("chartsAdvancedParseError", "Parse error") }}
+        </div>
+        <div class="_bk_whitespace-pre-wrap _bk_break-words">{{ parseError }}</div>
+      </div>
+    </div>
+    <template #actions>
+      <PanelAction
+        :title="$t('chartsAdvancedOpenExamples', 'Open examples')"
+        icon="bk_mdi_open_in_new"
+        @click="openExamples"
+      />
+    </template>
+  </PanelSection>
+</template>
+
+<script setup>
+import { computed, ref, useBlokkli } from "#imports";
+import JSON5 from "json5";
+import PanelSection from "#blokkli/editor/components/Panel/Section/index.vue";
+import PanelAction from "#blokkli/editor/components/Panel/Action/index.vue";
+import FlexTextarea from "#blokkli/editor/components/FlexTextarea/index.vue";
+const { $t } = useBlokkli();
+const config = defineModel({ type: Object, ...{ required: true } });
+function formatParsed(parsed) {
+  try {
+    return JSON.stringify(parsed, null, 2);
+  } catch {
+    return "";
+  }
+}
+const displayedSource = computed(() => {
+  if (typeof config.value.source === "string") return config.value.source;
+  return formatParsed(config.value.parsed);
+});
+const parseError = ref("");
+function parseSource(raw) {
+  const trimmed = raw.trim();
+  if (!trimmed) {
+    return { ok: true, value: {} };
+  }
+  try {
+    const value = JSON5.parse(trimmed);
+    if (!value || typeof value !== "object" || Array.isArray(value)) {
+      return {
+        ok: false,
+        error: $t(
+          "chartsAdvancedParseErrorNotObject",
+          "Configuration must be an object."
+        )
+      };
+    }
+    return { ok: true, value };
+  } catch (e) {
+    return { ok: false, error: e.message };
+  }
+}
+function onSourceChange(next) {
+  const result = parseSource(next);
+  if (result.ok) {
+    parseError.value = "";
+    config.value = { source: next, parsed: result.value };
+  } else {
+    parseError.value = result.error;
+    config.value = { source: next, parsed: config.value.parsed };
+  }
+}
+function cleanPastedConfig(raw) {
+  const trimmed = raw.trim();
+  const text = trimmed.replace(/^(?:var|let|const)\s+option\s*=\s*/, "").replace(/^option\s*=\s*/, "").replace(/;\s*$/, "").trim();
+  return text === trimmed ? null : text;
+}
+function onBeforePaste(data) {
+  const pasted = data.toText();
+  if (!pasted) return false;
+  const cleaned = cleanPastedConfig(pasted);
+  if (cleaned === null) return false;
+  const result = parseSource(cleaned);
+  if (result.ok) {
+    parseError.value = "";
+    config.value = {
+      source: JSON.stringify(result.value, null, 2),
+      parsed: result.value
+    };
+  } else {
+    parseError.value = result.error;
+    config.value = { source: cleaned, parsed: config.value.parsed };
+  }
+  return true;
+}
+function openExamples() {
+  window.open("https://echarts.apache.org/examples/en/index.html", "_blank")?.focus();
+}
+</script>
+
+<style>/*! tailwindcss v4.2.4 | MIT License | https://tailwindcss.com */
+.bk-advanced-config-error {
+  border-radius: 4px;
+  border-style: var(--bk-tw-border-style);
+  border-width: 2px;
+  border-color: rgb(var(--bk-theme-red-normal) / 1);
+}
+@supports (color: color-mix(in lab, red, red)) {
+  .bk-advanced-config-error {
+    border-color: color-mix(in oklab, rgb(var(--bk-theme-red-normal) / 1) 40%, transparent);
+  }
+}
+.bk-advanced-config-error {
+  background-color: rgb(var(--bk-theme-red-light) / 1);
+}
+@supports (color: color-mix(in lab, red, red)) {
+  .bk-advanced-config-error {
+    background-color: color-mix(in oklab, rgb(var(--bk-theme-red-light) / 1) 20%, transparent);
+  }
+}
+.bk-advanced-config-error {
+  padding: 10px;
+  font-size: var(--text-sm, 14px);
+  line-height: var(--bk-tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
+}
+</style>

package/dist/modules/charts/runtime/features/charts/Editor/AdvancedConfigPanel/index.vue.d.ts

@@ -0,0 +1,11 @@
+import type { ChartAdvancedConfig } from '../../../../types.js';
+type __VLS_ModelProps = {
+    modelValue: ChartAdvancedConfig;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_ModelProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: ChartAdvancedConfig) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_ModelProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: ChartAdvancedConfig) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/modules/charts/runtime/features/charts/Editor/CategoryColorOverridesPanel/index.d.vue.ts

@@ -0,0 +1,11 @@
+type __VLS_Props = {
+    categories: string[];
+    overrides: Record<string, string>;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:overrides": (args_0: Record<string, string>) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:overrides"?: ((args_0: Record<string, string>) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/modules/charts/runtime/features/charts/Editor/CategoryColorOverridesPanel/index.vue

@@ -0,0 +1,62 @@
+<template>
+  <div class="_bk_flex _bk_flex-col _bk_gap-5 _bk_p-panel-gap">
+    <div class="bk-form-label">
+      {{ $t("chartsDynamicCategoryColors", "Category colors") }}
+    </div>
+    <InfoBox
+      v-if="categories.length > MAX_OVERRIDE_ROWS"
+      small
+      :text="
+  $t(
+    'chartsDynamicOverridesTooMany',
+    'Too many items to configure inline (@count, max @max).'
+  ).replace('@count', String(categories.length)).replace('@max', String(MAX_OVERRIDE_ROWS))
+"
+    />
+    <div v-else-if="!categories.length" class="_bk_text-sm _bk_text-mono-500">
+      {{ $t("chartsDynamicNoCategories", "No categories.") }}
+    </div>
+    <div v-else class="_bk_flex _bk_flex-col _bk_gap-5">
+      <div
+        v-for="(label, i) in categories"
+        :key="label"
+        class="_bk_flex _bk_items-center _bk_gap-10 _bk_bg-white _bk_border _bk_border-mono-300 _bk_rounded _bk_px-5 _bk_py-3"
+      >
+        <ColorDropdown
+          :color-id="colorFor(label, i)"
+          @select="setColor(label, $event)"
+        />
+        <span class="_bk_flex-1 _bk_truncate _bk_text-sm _bk_font-medium _bk_text-mono-800">
+          {{ label }}
+        </span>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { computed, useBlokkli } from "#imports";
+import { InfoBox } from "#blokkli/editor/components";
+import ColorDropdown from "../ColorDropdown/index.vue";
+const props = defineProps({
+  categories: { type: Array, required: true },
+  overrides: { type: Object, required: true }
+});
+const emit = defineEmits(["update:overrides"]);
+const { $t, config } = useBlokkli();
+const MAX_OVERRIDE_ROWS = 200;
+const colorOptions = computed(() => config.colorOptions.value);
+function fallbackColor(index) {
+  const opts = colorOptions.value;
+  if (opts.length === 0) return "";
+  return opts[index % opts.length]?.id ?? opts[0]?.id ?? "";
+}
+function colorFor(label, index) {
+  return props.overrides[label] ?? fallbackColor(index);
+}
+function setColor(label, colorId) {
+  const next = { ...props.overrides };
+  next[label] = colorId;
+  emit("update:overrides", next);
+}
+</script>

package/dist/modules/charts/runtime/features/charts/Editor/CategoryColorOverridesPanel/index.vue.d.ts

@@ -0,0 +1,11 @@
+type __VLS_Props = {
+    categories: string[];
+    overrides: Record<string, string>;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:overrides": (args_0: Record<string, string>) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:overrides"?: ((args_0: Record<string, string>) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/modules/charts/runtime/features/charts/Editor/ChartTypeOptions/Field.d.vue.ts

@@ -0,0 +1,14 @@
+import type { ChartTypeDefinition } from '../../../../types.js';
+type ChartOption = ChartTypeDefinition['editor']['options'][string];
+type __VLS_Props = {
+    optionKey: string;
+    option: ChartOption;
+    value: unknown;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    update: (value: unknown) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onUpdate?: ((value: unknown) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/modules/charts/runtime/features/charts/Editor/ChartTypeOptions/Field.vue

@@ -0,0 +1,89 @@
+<template>
+  <FormToggle
+    v-if="option.type === 'checkbox'"
+    :label="option.label"
+    :description="option.description"
+    :model-value="!!(value ?? option.default)"
+    @update:model-value="$emit('update', $event)"
+  />
+  <FormRadio
+    v-else-if="option.type === 'radios'"
+    :id="`chart-option-${optionKey}`"
+    :label="option.label"
+    :description="option.description"
+    inline
+    :options="radioOptions"
+    :model-value="String(value ?? option.default ?? '')"
+    @update:model-value="$emit('update', $event)"
+  />
+  <FormNumber
+    v-else-if="option.type === 'number'"
+    :id="`chart-option-${optionKey}`"
+    :label="option.label"
+    :description="option.description"
+    :min="numberMin"
+    :max="numberMax"
+    :nullable="option.nullable"
+    :model-value="numberValue"
+    lazy
+    @update:model-value="$emit('update', $event)"
+  />
+  <FormText
+    v-else-if="option.type === 'text'"
+    :id="`chart-option-${optionKey}`"
+    :label="option.label"
+    :description="option.description"
+    :model-value="String(value ?? option.default ?? '')"
+    lazy
+    @update:model-value="$emit('update', $event ?? '')"
+  />
+</template>
+
+<script setup>
+import { computed } from "#imports";
+import {
+  FormToggle,
+  FormRadio,
+  FormNumber,
+  FormText
+} from "#blokkli/editor/components";
+const props = defineProps({
+  optionKey: { type: String, required: true },
+  option: { type: null, required: true },
+  value: { type: null, required: true }
+});
+defineEmits(["update"]);
+const radioOptions = computed(() => {
+  if (props.option.type !== "radios") {
+    return [];
+  }
+  const opts = props.option.options;
+  return Object.entries(opts).map(([value, raw]) => ({
+    value,
+    label: typeof raw === "string" ? raw : raw.label
+  }));
+});
+const numberValue = computed(() => {
+  if (typeof props.value === "number" && Number.isFinite(props.value)) {
+    return props.value;
+  }
+  if (typeof props.value === "string" && props.value.trim() !== "") {
+    const parsed = Number(props.value);
+    if (Number.isFinite(parsed)) return parsed;
+  }
+  if (props.option.type === "number" && typeof props.option.default === "number") {
+    return props.option.default;
+  }
+  return void 0;
+});
+const numberMin = computed(() => {
+  if (props.option.type !== "number") return void 0;
+  const opt = props.option;
+  return typeof opt.min === "number" ? opt.min : void 0;
+});
+const numberMax = computed(() => {
+  if (props.option.type !== "number") return void 0;
+  const opt = props.option;
+  return typeof opt.max === "number" ? opt.max : void 0;
+});
+</script>

package/dist/modules/charts/runtime/features/charts/Editor/ChartTypeOptions/Field.vue.d.ts

@@ -0,0 +1,14 @@
+import type { ChartTypeDefinition } from '../../../../types.js';
+type ChartOption = ChartTypeDefinition['editor']['options'][string];
+type __VLS_Props = {
+    optionKey: string;
+    option: ChartOption;
+    value: unknown;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    update: (value: unknown) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onUpdate?: ((value: unknown) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/modules/charts/runtime/features/charts/Editor/ChartTypeOptions/index.d.vue.ts

@@ -0,0 +1,16 @@
+import type { ChartTypeDefinition } from '../../../../types.js';
+type ChartOption = ChartTypeDefinition['editor']['options'][string];
+type __VLS_Props = {
+    title: string;
+    options: Record<string, ChartOption>;
+    typeOptions: Record<string, unknown>;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:title": (value: string) => any;
+    "update:typeOptions": (value: Record<string, unknown>) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:title"?: ((value: string) => any) | undefined;
+    "onUpdate:typeOptions"?: ((value: Record<string, unknown>) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;