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

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

@@ -1,45 +1,48 @@
 <template>
-  <div class="bk-chart-type-options">
-    <OptionsFormItem
-      :option="titleOption"
-      property="title"
-      :mutated-value="title"
-      @update="$emit('update:title', $event)"
-    />
+  <div>
+    <FormItem>
+      <FormText
+        id="chart-title"
+        :label="$t('title', 'Title')"
+        :model-value="title"
+        lazy
+        @update:model-value="$emit('update:title', $event ?? '')"
+      />
+    </FormItem>
 
-    <OptionsFormItem
-      v-for="item in ungroupedOptions"
-      :key="item.key"
-      :option="item.option"
-      :property="item.key"
-      :mutated-value="typeOptions[item.key] ?? item.option.default"
-      @update="updateOption(item.key, $event)"
-    />
+    <FormItem v-if="ungroupedOptions.length">
+      <div class="_bk_grid _bk_gap-15">
+        <Field
+          v-for="item in ungroupedOptions"
+          :key="item.key"
+          :option-key="item.key"
+          :option="item.option"
+          :value="typeOptions[item.key]"
+          @update="updateOption(item.key, $event)"
+        />
+      </div>
+    </FormItem>
 
-    <OptionsFormGroup
-      v-for="group in groups"
-      :key="'group_' + group.label"
-      :label="group.label"
-      :is-active="group.label === activeGroup"
-      @toggle="onToggleGroup(group.label)"
-    >
-      <OptionsFormItem
-        v-for="item in group.options"
-        :key="item.key"
-        :option="item.option"
-        :property="item.key"
-        :mutated-value="typeOptions[item.key] ?? item.option.default"
-        is-grouped
-        @update="updateOption(item.key, $event)"
-      />
-    </OptionsFormGroup>
+    <FormItem v-for="group in groups" :key="'group_' + group.label">
+      <div class="bk-form-label">{{ group.label }}</div>
+      <div class="_bk_grid _bk_gap-15">
+        <Field
+          v-for="item in group.options"
+          :key="item.key"
+          :option-key="item.key"
+          :option="item.option"
+          :value="typeOptions[item.key]"
+          @update="updateOption(item.key, $event)"
+        />
+      </div>
+    </FormItem>
   </div>
 </template>
 
 <script setup>
-import { computed, ref, useBlokkli } from "#imports";
-import OptionsFormItem from "#blokkli/editor/features/options/Form/Item.vue";
-import OptionsFormGroup from "#blokkli/editor/features/options/Form/Group.vue";
+import { computed, useBlokkli } from "#imports";
+import { FormText, FormItem } from "#blokkli/editor/components";
+import Field from "./Field.vue";
 const { $t } = useBlokkli();
 const props = defineProps({
   title: { type: String, required: true },
@@ -47,28 +50,18 @@ const props = defineProps({
   typeOptions: { type: Object, required: true }
 });
 const emit = defineEmits(["update:title", "update:typeOptions"]);
-const titleOption = {
-  type: "text",
-  label: $t("chartsTitle", "Title"),
-  default: ""
-};
-const activeGroup = ref("");
-function onToggleGroup(label) {
-  if (activeGroup.value === label) {
-    activeGroup.value = "";
-  } else {
-    activeGroup.value = label;
-  }
-}
-const allOptions = computed(
-  () => Object.entries(props.options).map(([key, option]) => ({ key, option }))
-);
+const allOptions = computed(() => {
+  const ctx = { options: props.typeOptions };
+  return Object.entries(props.options).filter(
+    ([, option]) => typeof option.shouldRender !== "function" || option.shouldRender(ctx)
+  ).map(([key, option]) => ({ key, option }));
+});
 const ungroupedOptions = computed(
   () => allOptions.value.filter((v) => !v.option.group)
 );
 function getGroupLabel(group) {
   if (group === "display") {
-    return $t("chartsOptionGroupDisplay", "Display");
+    return $t("display", "Display");
   } else if (group === "labels") {
     return $t("chartsOptionGroupLabels", "Labels");
   }

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

@@ -1,4 +1,4 @@
-import type { ChartTypeDefinition } from '../../../../chartTypes/types.js';
+import type { ChartTypeDefinition } from '../../../../types.js';
 type ChartOption = ChartTypeDefinition['editor']['options'][string];
 type __VLS_Props = {
     title: string;
@@ -6,10 +6,10 @@ type __VLS_Props = {
     typeOptions: Record<string, unknown>;
 };
 declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    "update:title": (value: unknown) => any;
+    "update:title": (value: string) => any;
     "update:typeOptions": (value: Record<string, unknown>) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
-    "onUpdate:title"?: ((value: unknown) => any) | undefined;
+    "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;

package/dist/modules/charts/runtime/features/charts/Editor/ChartTypePicker/TypeCard.d.vue.ts

@@ -0,0 +1,7 @@
+import type { ChartTypeDefinition } from '../../../../types.js';
+type __VLS_Props = ChartTypeDefinition & {
+    active: boolean;
+};
+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/features/charts/Editor/ChartTypePicker/TypeCard.vue

@@ -0,0 +1,55 @@
+<template>
+  <button
+    type="button"
+    class="_bk_grid _bk_grid-cols-[auto_1fr] _bk_text-left _bk_rounded _bk_border _bk_bg-white _bk_border-mono-200 _bk_hover:bg-mono-50 _bk_hover:border-mono-400 _bk_overflow-hidden"
+    :class="
+  active ? '_bk_border-accent-600! _bk_outline-4 _bk_outline-accent-200 _bk_bg-accent-50!' : '_bk_border-mono-300'
+"
+  >
+    <div
+      class="_bk_size-[150px] _bk_flex _bk_items-center _bk_justify-center _bk_border-r"
+      :class="
+  active ? '_bk_bg-accent-100 _bk_border-r-accent-200' : '_bk_bg-mono-100 _bk_border-r-mono-200'
+"
+    >
+      <component
+        :is="illustration"
+        v-if="illustration"
+        class="_bk_size-full _bk_block"
+        :class="{
+  '_bk_grayscale-75': !active
+}"
+      />
+      <Icon
+        v-else
+        :name="editor.icon"
+        class="_bk_size-70"
+        :class="active ? '_bk_text-accent-600' : '_bk_text-mono-500'"
+      />
+    </div>
+    <div class="_bk_p-15 _bk_flex-1">
+      <div class="_bk_font-bold _bk_text-mono-900 _bk_text-lg">
+        {{ editor.label }}
+      </div>
+      <div class="_bk_text-sm _bk_text-mono-600 _bk_leading-snug">
+        {{ editor.description }}
+      </div>
+    </div>
+  </button>
+</template>
+
+<script setup>
+import { computed } from "#imports";
+import { Icon } from "#blokkli/editor/components";
+import { chartTypeIllustrations } from "#blokkli-build/charts-illustrations";
+const props = defineProps({
+  hasSeriesColors: { type: Boolean, required: true },
+  hasCategoryColors: { type: Boolean, required: true },
+  editor: { type: Object, required: true },
+  id: { type: String, required: true },
+  active: { type: Boolean, required: true }
+});
+const illustration = computed(
+  () => chartTypeIllustrations[props.id]
+);
+</script>

package/dist/modules/charts/runtime/features/charts/Editor/ChartTypePicker/TypeCard.vue.d.ts

@@ -0,0 +1,7 @@
+import type { ChartTypeDefinition } from '../../../../types.js';
+type __VLS_Props = ChartTypeDefinition & {
+    active: boolean;
+};
+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/features/charts/Editor/ChartTypePicker/TypeGrid.d.vue.ts

@@ -0,0 +1,11 @@
+import type { ChartType } from '../../../../types.js';
+type __VLS_ModelProps = {
+    modelValue: ChartType;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_ModelProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: string) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_ModelProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: 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/ChartTypePicker/TypeGrid.vue

@@ -0,0 +1,24 @@
+<template>
+  <div class="_bk_grid _bk_grid-cols-2 _bk_gap-15 _bk_p-15">
+    <TypeCard
+      v-for="option in chartTypes"
+      :key="option.id"
+      v-bind="option"
+      :active="option.id === modelValue"
+      @click="modelValue = option.id"
+    />
+  </div>
+</template>
+
+<script setup>
+import { computed, useBlokkli } from "#imports";
+import { getChartTypes } from "../../../../chart-types";
+import TypeCard from "./TypeCard.vue";
+const modelValue = defineModel({ type: String, ...{ required: true } });
+const { $t } = useBlokkli();
+const chartTypes = computed(
+  () => getChartTypes($t).sort(
+    (a, b) => a.editor.label.localeCompare(b.editor.label)
+  )
+);
+</script>

package/dist/modules/charts/runtime/features/charts/Editor/ChartTypePicker/TypeGrid.vue.d.ts

@@ -0,0 +1,11 @@
+import type { ChartType } from '../../../../types.js';
+type __VLS_ModelProps = {
+    modelValue: ChartType;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_ModelProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: string) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_ModelProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: 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/ChartTypePicker/index.d.vue.ts

@@ -3,9 +3,9 @@ type __VLS_Props = {
     modelValue: ChartType;
 };
 declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    "update:modelValue": (value: ChartType) => any;
+    "update:modelValue": (value: string) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
-    "onUpdate:modelValue"?: ((value: ChartType) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: 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/ChartTypePicker/index.vue

@@ -1,34 +1,56 @@
 <template>
-  <div class="bk-chart-type-picker">
-    <button
-      v-for="option in chartTypes"
-      :key="option.value"
-      type="button"
-      :class="{ '_bk_is-active': modelValue === option.value }"
-      @click="emit('update:modelValue', option.value)"
-    >
-      <div>
-        <Icon :name="option.icon" />
-        <span>{{ option.label }}</span>
-      </div>
-    </button>
-  </div>
+  <PanelItem
+    :title="activeChartType.editor.label"
+    :description="activeChartType.editor.description"
+    :icon="activeChartType.editor.icon"
+    is-button
+    @click="openDialog"
+  />
+  <Teleport :to="ui.mainLayoutElement.value">
+    <BlokkliTransition name="slide-up">
+      <DialogModal
+        v-if="showDialog"
+        id="charts-type-picker"
+        :title="$t('chartsTypePickerTitle', 'Choose a chart type')"
+        :submit-label="$t('chartsTypePickerSubmit', 'Apply')"
+        :width="1200"
+        z-index="high"
+        :can-submit="pendingType !== modelValue"
+        @submit="onApply"
+        @cancel="showDialog = false"
+      >
+        <TypeGrid v-model="pendingType" />
+      </DialogModal>
+    </BlokkliTransition>
+  </Teleport>
 </template>
 
 <script setup>
-import { computed, useBlokkli } from "#imports";
-import { getChartTypes } from "../../../../chartTypes";
-import { Icon } from "#blokkli/editor/components";
-defineProps({
+import { computed, ref, useBlokkli } from "#imports";
+import { getChartTypes } from "../../../../chart-types";
+import { BlokkliTransition, DialogModal } from "#blokkli/editor/components";
+import PanelItem from "#blokkli/editor/components/Panel/Item/index.vue";
+import { useDialog } from "#blokkli/editor/composables";
+import TypeGrid from "./TypeGrid.vue";
+const props = defineProps({
   modelValue: { type: String, required: true }
 });
 const emit = defineEmits(["update:modelValue"]);
-const { $t } = useBlokkli();
-const chartTypes = computed(
-  () => getChartTypes($t).map((def) => ({
-    value: def.id,
-    label: def.editor.label,
-    icon: def.editor.icon
-  }))
-);
+const { $t, ui } = useBlokkli();
+const chartTypes = computed(() => getChartTypes($t));
+const showDialog = useDialog("charts-type-picker", "center", "high");
+const activeChartType = computed(() => {
+  return chartTypes.value.find((v) => v.id === props.modelValue) || chartTypes.value[0];
+});
+const pendingType = ref(props.modelValue);
+function openDialog() {
+  pendingType.value = props.modelValue;
+  showDialog.value = true;
+}
+function onApply() {
+  if (pendingType.value !== props.modelValue) {
+    emit("update:modelValue", pendingType.value);
+  }
+  showDialog.value = false;
+}
 </script>

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

@@ -3,9 +3,9 @@ type __VLS_Props = {
     modelValue: ChartType;
 };
 declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    "update:modelValue": (value: ChartType) => any;
+    "update:modelValue": (value: string) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
-    "onUpdate:modelValue"?: ((value: ChartType) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: 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/ColorDropdown/index.d.vue.ts

@@ -1,7 +1,5 @@
-import type { ChartColor } from '../../../../types.js';
 type __VLS_Props = {
     colorId: string;
-    colors: Record<string, ChartColor>;
 };
 declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     select: (colorId: string) => any;

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

@@ -1,49 +1,93 @@
 <template>
-  <Dropdown position="top-left">
+  <Dropdown position="top-left" button-class="bk-chart-color-dropdown-button">
     <template #button>
       <span
-        class="bk-chart-color-swatch"
+        class="bk-chart-color-swatch bk-chart-data-table-input"
         :style="{ backgroundColor: displayColor }"
       />
     </template>
     <template #default="{ close }">
       <button
-        v-for="(entry, id) in colors"
-        :key="id"
+        v-for="entry in colorOptions"
+        :key="entry.id"
         type="button"
-        class="bk-chart-color-option"
-        :class="{ '_bk_is-active': colorId === id }"
+        class="bk-dropdown-menu-item _bk_min-w-[200px] _bk_group/item"
+        :class="{ 'bk-is-active': colorId === entry.id }"
         @click="
   () => {
-    emit('select', id);
+    emit('select', entry.id);
     close();
   }
 "
       >
         <span
           class="bk-chart-color-swatch"
-          :style="{ backgroundColor: entry.color }"
+          :style="{ backgroundColor: entry.hex }"
         />
-        <span>{{ entry.label }}</span>
+        <span
+          :class="{
+  '_bk_text-mono-500 _bk_font-normal _bk_group-hover/item:text-mono-900': colorId !== entry.id,
+  '_bk_font-bold': colorId === entry.id
+}"
+          >{{ entry.label }}</span
+        >
       </button>
     </template>
   </Dropdown>
 </template>
 
 <script setup>
-import { computed } from "#imports";
+import { computed, useBlokkli } from "#imports";
 import { Dropdown } from "#blokkli/editor/components";
 const props = defineProps({
-  colorId: { type: String, required: true },
-  colors: { type: Object, required: true }
+  colorId: { type: String, required: true }
 });
 const emit = defineEmits(["select"]);
-const displayColor = computed(() => {
-  const entry = props.colors[props.colorId];
-  if (entry) {
-    return entry.color;
-  }
-  const first = Object.values(props.colors)[0];
-  return first?.color || "#888888";
-});
+const { config } = useBlokkli();
+const colorOptions = computed(() => config.colorOptions.value);
+const displayColor = computed(() => config.getColorHex(props.colorId));
 </script>
+
+<style>/*! tailwindcss v4.2.4 | MIT License | https://tailwindcss.com */
+.bk .bk-chart-color-dropdown-button {
+  display: flex;
+  width: 40px;
+  height: 40px;
+  align-items: center;
+  justify-content: center;
+}
+:is(.bk .bk-chart-color-dropdown-button):hover .bk-chart-color-swatch {
+  outline-style: var(--bk-tw-outline-style);
+  outline-width: 2px;
+  outline-offset: calc(2px * -1);
+  outline-color: rgb(var(--bk-theme-mono-100) / 1);
+}
+@supports (color: color-mix(in lab, red, red)) {
+  :is(.bk .bk-chart-color-dropdown-button):hover .bk-chart-color-swatch {
+    outline-color: color-mix(in oklab, rgb(var(--bk-theme-mono-100) / 1) 40%, transparent);
+  }
+}
+:is(:is(.bk .bk-chart-color-dropdown-button):hover .bk-chart-color-swatch):before {
+  opacity: 80%;
+}
+.bk .bk-chart-color-swatch {
+  position: relative;
+  display: block;
+  width: 20px;
+  height: 20px;
+  border-radius: calc(infinity * 1px);
+}
+:is(.bk .bk-chart-color-swatch):before {
+  content: '';
+  position: absolute;
+  top: 0px;
+  left: 0px;
+  width: 100%;
+  height: 100%;
+  border-radius: calc(infinity * 1px);
+  border-style: var(--bk-tw-border-style);
+  border-width: 1px;
+  border-color: rgb(var(--bk-theme-mono-900) / 1);
+  opacity: 40%;
+}
+</style>

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

@@ -1,7 +1,5 @@
-import type { ChartColor } from '../../../../types.js';
 type __VLS_Props = {
     colorId: string;
-    colors: Record<string, ChartColor>;
 };
 declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     select: (colorId: string) => any;

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

@@ -0,0 +1,9 @@
+import type { ChartSeries } from '../../../../types.js';
+type __VLS_Props = {
+    title: string;
+    categories: string[];
+    series: ChartSeries[];
+};
+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/features/charts/Editor/CsvExport/index.vue

@@ -0,0 +1,55 @@
+<template>
+  <PanelAction
+    :title="$t('chartsExportCsv', 'Export CSV')"
+    icon="bk_mdi_download"
+    @click="exportCsv"
+  />
+</template>
+
+<script setup>
+import PanelAction from "#blokkli/editor/components/Panel/Action/index.vue";
+import { useBlokkli } from "#imports";
+const props = defineProps({
+  title: { type: String, required: true },
+  categories: { type: Array, required: true },
+  series: { type: Array, required: true }
+});
+const { $t } = useBlokkli();
+function escapeCell(value) {
+  if (/[",\n;\t]/.test(value)) {
+    return `"${value.replace(/"/g, '""')}"`;
+  }
+  return value;
+}
+function buildCsv() {
+  const header = ["", ...props.series.map((s) => s.name)];
+  const lines = [header.map(escapeCell).join(",")];
+  for (let ci = 0; ci < props.categories.length; ci++) {
+    const row = [props.categories[ci] || ""];
+    for (const s of props.series) {
+      const value = s.data[ci];
+      row.push(
+        typeof value === "number" && Number.isFinite(value) ? String(value) : ""
+      );
+    }
+    lines.push(row.map(escapeCell).join(","));
+  }
+  return lines.join("\n") + "\n";
+}
+function buildFilename() {
+  const base = (props.title || "chart").toLowerCase().replace(/[^a-z0-9]+/g, "-").replace(/^-+|-+$/g, "");
+  return `${base || "chart"}.csv`;
+}
+function exportCsv() {
+  const csv = buildCsv();
+  const blob = new Blob([csv], { type: "text/csv;charset=utf-8" });
+  const url = URL.createObjectURL(blob);
+  const a = document.createElement("a");
+  a.href = url;
+  a.download = buildFilename();
+  document.body.appendChild(a);
+  a.click();
+  document.body.removeChild(a);
+  URL.revokeObjectURL(url);
+}
+</script>

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

@@ -0,0 +1,9 @@
+import type { ChartSeries } from '../../../../types.js';
+type __VLS_Props = {
+    title: string;
+    categories: string[];
+    series: ChartSeries[];
+};
+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/features/charts/Editor/CsvImport/FilterEditor/index.d.vue.ts

@@ -0,0 +1,16 @@
+import type { CsvGrid, CsvImportFilter } from '../csvHelpers.js';
+type __VLS_Props = {
+    grid: CsvGrid;
+    headerCells: string[];
+    availableColumns: number[];
+    initial: CsvImportFilter | null;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    cancel: () => any;
+    save: (args_0: CsvImportFilter) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onCancel?: (() => any) | undefined;
+    onSave?: ((args_0: CsvImportFilter) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;