nuxt-ui-tools 1.12.0 → 1.13.0

package/dist/runtime/spreadsheet/composables/use-spreadsheet-import.js

@@ -1,120 +1,351 @@
-import { computed, shallowRef, toValue, watch } from "vue";
-import { createSpreadsheetInternals } from "./use-spreadsheet-internals.js";
-function mapSpreadsheetParsedRows(rows) {
-  return rows;
-}
-function mapSpreadsheetResolvedRows(rows) {
-  return rows;
-}
-function mapSpreadsheetRowData(rows) {
-  return rows.map((row) => row.data);
-}
-async function createSpreadsheetSubmitPayloads(params) {
-  if (!params.schema.buildRow) {
-    return params.rows.map((row) => row.data);
-  }
-  return Promise.all(
-    params.rows.map(
-      (row) => params.schema.buildRow({
-        context: params.context,
-        row: row.data
-      })
-    )
-  );
-}
-export function useSpreadsheetImport(schema) {
-  const resolvedSchema = computed(() => toValue(schema));
-  const sourceRef = shallowRef(null);
-  const fileNameRef = shallowRef();
-  const internals = createSpreadsheetInternals({
-    fileName: fileNameRef,
-    rawSchema: resolvedSchema,
-    source: sourceRef
+import { computed, toValue, watch } from "vue";
+import { useUiToolsLocale } from "#ui-tools/i18n";
+import { createSpreadsheetTemplateWorkbook, suggestSpreadsheetColumns } from "../utils/index.js";
+import { useSpreadsheetAnswers } from "./use-spreadsheet-answers.js";
+import { useSpreadsheetColumns } from "./use-spreadsheet-columns.js";
+import { useSpreadsheetContext } from "./use-spreadsheet-context.js";
+import { useSpreadsheetEdits } from "./use-spreadsheet-edits.js";
+import { useSpreadsheetFields } from "./use-spreadsheet-fields.js";
+import { useSpreadsheetFile } from "./use-spreadsheet-file.js";
+import { useSpreadsheetLayout } from "./use-spreadsheet-layout.js";
+import { useSpreadsheetOptions } from "./use-spreadsheet-options.js";
+import { useSpreadsheetReview } from "./use-spreadsheet-review.js";
+import { useSpreadsheetRows } from "./use-spreadsheet-rows.js";
+import { useSpreadsheetSubmit } from "./use-spreadsheet-submit.js";
+import { useSpreadsheetValues } from "./use-spreadsheet-values.js";
+export function useSpreadsheetImport(schemaInput, options = {}) {
+  const { t } = useUiToolsLocale();
+  const schema = computed(() => toValue(schemaInput));
+  const context = useSpreadsheetContext({ input: () => options.context });
+  const file = useSpreadsheetFile();
+  const edits = useSpreadsheetEdits();
+  const answers = useSpreadsheetAnswers();
+  const fields = useSpreadsheetFields({ context, schema, t });
+  const layout = useSpreadsheetLayout({ context, fields, file, schema });
+  const columns = useSpreadsheetColumns({ context, fields, layout });
+  const options$ = useSpreadsheetOptions({ columns, context, edits, fields, layout });
+  const rows = useSpreadsheetRows({
+    answers,
+    columns,
+    context,
+    edits,
+    fields,
+    layout,
+    options: options$,
+    schema,
+    t
   });
-  const parsedRows = computed(
-    () => mapSpreadsheetParsedRows(internals.rows.parsedRows.value)
-  );
-  const resolvedRows = computed(
-    () => mapSpreadsheetResolvedRows(internals.resolutions.resolvedRows.value)
+  const values = useSpreadsheetValues({ answers, fields, options: options$, rows });
+  const review = useSpreadsheetReview({ layout, rows });
+  const submit = useSpreadsheetSubmit({
+    batchSize: options.submit?.batchSize,
+    context,
+    fields,
+    onSubmit: options.onSubmit,
+    rows,
+    schema,
+    t,
+    values
+  });
+  watch(file.workbook, () => {
+    edits.clear();
+    answers.clear();
+    columns.clear();
+    rows.reset();
+    submit.reset();
+  });
+  const suggestions = computed(() => {
+    const missing2 = new Set(
+      columns.states.value.filter((state) => state.status === "missing").map((state) => state.path)
+    );
+    if (!missing2.size)
+      return /* @__PURE__ */ new Map();
+    return suggestSpreadsheetColumns({
+      ctx: context.ctx.value,
+      fields: fields.columnFields.value.filter((field) => missing2.has(field.path)),
+      headers: columns.unusedHeaders.value,
+      options: options$.options.value,
+      raws: layout.dataRaws.value,
+      rows: layout.dataRows.value,
+      t
+    });
+  });
+  const fieldStates = computed(
+    () => columns.states.value.map((state) => ({
+      ...state,
+      suggestion: suggestions.value.get(state.path) ?? null
+    }))
   );
-  const rowData = computed(
-    () => mapSpreadsheetRowData(internals.resolutions.resolvedRows.value)
+  const missing = computed(() => fieldStates.value.filter((state) => state.status === "missing"));
+  const loading = computed(
+    () => context.loading.value || file.reading.value || options$.loading.value || rows.loading.value
   );
-  const submitPayloads = computedAsyncPayloads({
-    context: internals.context.contextData,
-    rows: computed(() => internals.resolutions.resolvedRows.value),
-    schema: resolvedSchema
+  const readiness = computed(() => {
+    const importable = rows.importable.value.length;
+    const openValues = values.open.value.length;
+    return {
+      canSubmit: Boolean(file.workbook.value) && !loading.value && !missing.value.length && !openValues && importable > 0,
+      importable,
+      invalidRows: rows.invalid.value.length,
+      loading: loading.value,
+      missingColumns: missing.value.length,
+      openValues
+    };
   });
-  const status = computed(() => ({
-    initialized: internals.source.status.value.initialized || internals.context.status.value.initialized || internals.rows.status.value.initialized,
-    isLoadingContext: internals.context.status.value.isPending || internals.context.status.value.isFetching,
-    isParsingRows: internals.rows.status.value.isParsing,
-    isParsingSource: internals.source.status.value.isParsing,
-    isReady: internals.source.status.value.isReady && internals.context.status.value.isReady && internals.rows.status.value.isReady
-  }));
-  function loadSource(params) {
-    sourceRef.value = params.source;
-    fileNameRef.value = params.fileName;
+  function ready() {
+    return new Promise((resolve) => {
+      const stop = watch(
+        () => !loading.value && (!file.workbook.value || fields.fields.value.length > 0 || !context.ready.value),
+        (settled) => {
+          if (!settled) return;
+          queueMicrotask(() => stop());
+          resolve();
+        },
+        { immediate: true }
+      );
+    });
   }
-  function clearSource() {
-    sourceRef.value = null;
-    fileNameRef.value = void 0;
+  function template() {
+    return createSpreadsheetTemplateWorkbook({
+      fields: fields.fields.value,
+      guideHeaders: [
+        t("spreadsheet.template.column"),
+        t("spreadsheet.template.required"),
+        t("spreadsheet.template.allowed"),
+        t("spreadsheet.template.description")
+      ],
+      guideName: t("spreadsheet.template.guide"),
+      options: options$.options.value,
+      sheetName: t("spreadsheet.template.sheet"),
+      yes: t("spreadsheet.template.yes")
+    });
   }
-  async function refresh() {
-    await internals.source.refreshWorkbook();
-    await internals.context.refreshContext();
-    await internals.rows.refreshRows();
+  function reset() {
+    file.clear();
   }
-  return {
-    __internals: internals,
-    activeSheet: internals.source.sheet,
-    assignColumn: ({ headerIndex, columnKey }) => internals.rows.assignColumn(headerIndex, columnKey),
-    clearColumnAssignment: (headerIndex) => internals.rows.clearColumnAssignment(headerIndex),
-    clearReference: internals.resolutions.clearReference,
-    clearSource,
-    contextError: internals.context.error,
-    headerCells: internals.rows.headerCells,
-    headers: internals.source.headers,
-    loadSource,
-    parsedRows,
-    referenceResolutions: computed(() => internals.resolutions.resolutions.value),
-    refresh,
-    resolvedRows,
-    rowData,
-    rowError: internals.rows.error,
-    rowSummary: internals.rows.summary,
-    rows: internals.source.rows,
-    schema: resolvedSchema,
-    selectReference: internals.resolutions.selectReference,
-    selection: internals.source.selection,
-    setHeaderRowIndex: internals.source.setHeaderRowIndex,
-    setSheetName: internals.source.setSheetName,
-    sourceError: internals.source.error,
-    status,
-    submitPayloads,
-    unresolvedReferenceResolutions: computed(
-      () => internals.resolutions.unresolvedResolutions.value
-    ),
-    workbook: internals.source.workbook
+  const contextModel = {
+    get ctx() {
+      return context.ctx.value;
+    },
+    get error() {
+      return context.error.value;
+    },
+    get loading() {
+      return context.loading.value;
+    },
+    get ready() {
+      return context.ready.value;
+    }
   };
-}
-function computedAsyncPayloads(params) {
-  const payloads = shallowRef([]);
-  async function refreshPayloads() {
-    payloads.value = await createSpreadsheetSubmitPayloads({
-      context: params.context.value,
-      rows: params.rows.value,
-      schema: params.schema.value
-    });
-  }
-  watch(
-    [params.schema, params.context, params.rows],
-    () => {
-      void refreshPayloads();
+  const fileModel = {
+    clear: file.clear,
+    get error() {
+      return file.error.value;
+    },
+    load: (source, name) => void file.load(source, name),
+    get loaded() {
+      return Boolean(file.workbook.value);
+    },
+    get name() {
+      return file.workbook.value?.name ?? "";
     },
-    {
-      immediate: true
+    paste: file.paste,
+    get reading() {
+      return file.reading.value;
+    },
+    get sheets() {
+      return file.sheets.value;
     }
-  );
-  return computed(() => payloads.value);
+  };
+  const layoutModel = {
+    get ambiguous() {
+      return layout.detection.value?.ambiguous ?? false;
+    },
+    get candidates() {
+      return layout.candidates.value;
+    },
+    get detected() {
+      return layout.detected.value;
+    },
+    get detection() {
+      return layout.detection.value;
+    },
+    get headerRow() {
+      return layout.selection.value.headerRow;
+    },
+    get headerRowNumber() {
+      return layout.sheet.value?.rowNumbers[layout.selection.value.headerRow] ?? layout.selection.value.headerRow + 1;
+    },
+    get headers() {
+      return layout.headers.value;
+    },
+    get preview() {
+      return layout.preview.value;
+    },
+    redetect: layout.redetect,
+    setHeaderRow: layout.setHeaderRow,
+    setSheet: layout.setSheet,
+    get sheet() {
+      return layout.selection.value.sheet;
+    }
+  };
+  const columnsModel = {
+    assign: columns.assign,
+    get fields() {
+      return fieldStates.value;
+    },
+    get groups() {
+      return fields.groups.value;
+    },
+    get headers() {
+      return layout.headers.value;
+    },
+    ignore: columns.ignore,
+    get missing() {
+      return missing.value;
+    },
+    reset: columns.reset,
+    get unusedHeaders() {
+      return columns.unusedHeaders.value;
+    }
+  };
+  const valuesModel = {
+    answer: values.answer,
+    choices: values.choices,
+    clear: values.clear,
+    get loading() {
+      return options$.loading.value;
+    },
+    get open() {
+      return values.open.value;
+    },
+    get questions() {
+      return values.questions.value;
+    },
+    get recognized() {
+      return values.recognized.value;
+    },
+    search: values.search
+  };
+  const rowsModel = {
+    get all() {
+      return rows.rows.value;
+    },
+    get byMode() {
+      return rows.byMode.value;
+    },
+    cell: rows.cell,
+    discard: rows.discard,
+    get discarded() {
+      return rows.discarded.value;
+    },
+    distinct: rows.distinct,
+    edit: rows.edit,
+    exportInvalid: () => rows.exportInvalid(t("spreadsheet.review.issuesColumn")),
+    get importable() {
+      return rows.importable.value;
+    },
+    get invalid() {
+      return rows.invalid.value;
+    },
+    issues: rows.issues,
+    get keyFields() {
+      return rows.keyFields.value;
+    },
+    get loading() {
+      return rows.loading.value;
+    },
+    restore: rows.restore,
+    revert: edits.revert,
+    row: (index) => rows.rows.value[index],
+    get valid() {
+      return rows.valid.value;
+    }
+  };
+  const reviewModel = {
+    clearSelection: review.clearSelection,
+    get fieldIssues() {
+      return review.fieldIssues.value;
+    },
+    inspect: review.inspect,
+    get inspected() {
+      return review.inspected.value;
+    },
+    get issue() {
+      return review.issue.value;
+    },
+    get issueTypes() {
+      return review.issueTypes.value;
+    },
+    get level() {
+      return review.level.value;
+    },
+    get mode() {
+      return review.mode.value;
+    },
+    next: review.next,
+    get position() {
+      return review.position.value;
+    },
+    previous: review.previous,
+    get search() {
+      return review.search.value;
+    },
+    select: review.select,
+    get selection() {
+      return review.selection.value;
+    },
+    setIssue: review.setIssue,
+    setLevel: review.setLevel,
+    setMode: review.setMode,
+    setSearch: review.setSearch,
+    setTab: review.setTab,
+    get tab() {
+      return review.tab.value;
+    },
+    get visible() {
+      return review.visible.value;
+    }
+  };
+  const submitModel = {
+    get error() {
+      return submit.error.value;
+    },
+    get imported() {
+      return submit.imported.value;
+    },
+    get progress() {
+      return submit.progress.value;
+    },
+    get rejected() {
+      return submit.rejected.value;
+    },
+    reset: submit.reset,
+    retryRejected: submit.retryRejected,
+    run: submit.run,
+    get status() {
+      return submit.status.value;
+    }
+  };
+  return {
+    columns: columnsModel,
+    context: contextModel,
+    file: fileModel,
+    get layout() {
+      return layoutModel;
+    },
+    get readiness() {
+      return readiness.value;
+    },
+    ready,
+    reset,
+    review: reviewModel,
+    rows: rowsModel,
+    get schema() {
+      return schema.value;
+    },
+    submit: submitModel,
+    template,
+    values: valuesModel
+  };
 }

package/dist/runtime/spreadsheet/composables/use-spreadsheet-layout.d.ts

@@ -0,0 +1,36 @@
+import type { ComputedRef } from 'vue';
+import type { SpreadsheetPreviewRow, SpreadsheetRuntimeSchema } from '../types/index.js';
+import type { useSpreadsheetContext } from './use-spreadsheet-context.js';
+import type { useSpreadsheetFields } from './use-spreadsheet-fields.js';
+import type { useSpreadsheetFile } from './use-spreadsheet-file.js';
+export interface UseSpreadsheetLayoutParams {
+    schema: ComputedRef<SpreadsheetRuntimeSchema>;
+    file: ReturnType<typeof useSpreadsheetFile>;
+    fields: ReturnType<typeof useSpreadsheetFields>;
+    context: ReturnType<typeof useSpreadsheetContext>;
+}
+/**
+ * The sheet and header row read. Detection runs on each new file and applies the schema's `sheet`
+ * and `headerRow`; the user can change both.
+ */
+export declare function useSpreadsheetLayout(params: UseSpreadsheetLayoutParams): {
+    candidates: ComputedRef<readonly import("..").SpreadsheetHeaderRowCandidate[]>;
+    dataRaws: ComputedRef<(readonly unknown[] | undefined)[]>;
+    dataRowNumbers: ComputedRef<number[]>;
+    dataRows: ComputedRef<(readonly string[])[]>;
+    detected: ComputedRef<boolean>;
+    detection: ComputedRef<import("..").SpreadsheetLayoutDetection | null>;
+    headers: ComputedRef<import("..").SpreadsheetHeaderCell[]>;
+    preview: ComputedRef<SpreadsheetPreviewRow[]>;
+    redetect: () => void;
+    selection: import("vue").ShallowRef<{
+        sheet: string | null;
+        headerRow: number;
+    }, {
+        sheet: string | null;
+        headerRow: number;
+    }>;
+    setHeaderRow: (index: number) => void;
+    setSheet: (name: string) => void;
+    sheet: ComputedRef<import("..").SpreadsheetSheet | null>;
+};

package/dist/runtime/spreadsheet/composables/use-spreadsheet-layout.js

@@ -0,0 +1,95 @@
+import { computed, shallowRef, watch } from "vue";
+import { createSpreadsheetHeaderCells, detectSpreadsheetLayout } from "../utils/index.js";
+export function useSpreadsheetLayout(params) {
+  const selection = shallowRef({
+    headerRow: 0,
+    sheet: null
+  });
+  const detection = computed(() => {
+    const workbook = params.file.workbook.value;
+    if (!workbook || !params.fields.columnFields.value.length) return null;
+    return detectSpreadsheetLayout({
+      ctx: params.context.ctx.value,
+      fields: params.fields.columnFields.value,
+      workbook
+    });
+  });
+  function detectedSelection() {
+    const workbook = params.file.workbook.value;
+    const definition = params.schema.value.file ?? {};
+    const best = detection.value?.best;
+    const sheetName = definition.sheet && definition.sheet !== "auto" ? definition.sheet : best?.sheet ?? workbook?.sheets[0]?.name ?? null;
+    const sheet2 = workbook?.sheets.find((entry) => entry.name === sheetName);
+    const layout = detection.value?.sheets.find((entry) => entry.name === sheetName);
+    const headerRow = typeof definition.headerRow === "number" ? Math.max(sheet2?.rowNumbers.indexOf(definition.headerRow) ?? -1, 0) : layout?.headerRow ?? 0;
+    return { headerRow, sheet: sheetName };
+  }
+  function redetect() {
+    selection.value = detectedSelection();
+  }
+  watch(
+    () => [params.file.workbook.value, detection.value !== null],
+    ([workbook], previous) => {
+      if (!workbook) {
+        selection.value = { headerRow: 0, sheet: null };
+        return;
+      }
+      if (previous?.[0] !== workbook || !previous[1]) redetect();
+    },
+    { immediate: true }
+  );
+  const sheet = computed(
+    () => params.file.workbook.value?.sheets.find((entry) => entry.name === selection.value.sheet) ?? null
+  );
+  const headers = computed(
+    () => createSpreadsheetHeaderCells(sheet.value?.rows[selection.value.headerRow] ?? [])
+  );
+  const dataRows = computed(() => sheet.value?.rows.slice(selection.value.headerRow + 1) ?? []);
+  const dataRaws = computed(() => sheet.value?.raws.slice(selection.value.headerRow + 1) ?? []);
+  const dataRowNumbers = computed(
+    () => sheet.value?.rowNumbers.slice(selection.value.headerRow + 1) ?? []
+  );
+  const candidates = computed(
+    () => detection.value?.sheets.find((entry) => entry.name === selection.value.sheet)?.candidates ?? []
+  );
+  const detected = computed(() => {
+    const expected = detectedSelection();
+    return Boolean(detection.value?.best) && expected.sheet === selection.value.sheet && expected.headerRow === selection.value.headerRow;
+  });
+  const preview = computed(() => {
+    const rows = sheet.value?.rows ?? [];
+    const numbers = sheet.value?.rowNumbers ?? [];
+    const header = selection.value.headerRow;
+    const start = Math.max(0, header - 2);
+    return rows.slice(start, header + 4).map((cells, offset) => {
+      const index = start + offset;
+      return {
+        cells,
+        kind: index < header ? "title" : index === header ? "header" : "data",
+        rowNumber: numbers[index] ?? index + 1
+      };
+    });
+  });
+  function setSheet(name) {
+    const layout = detection.value?.sheets.find((entry) => entry.name === name);
+    selection.value = { headerRow: layout?.headerRow ?? 0, sheet: name };
+  }
+  function setHeaderRow(index) {
+    selection.value = { ...selection.value, headerRow: index };
+  }
+  return {
+    candidates,
+    dataRaws,
+    dataRowNumbers,
+    dataRows,
+    detected,
+    detection,
+    headers,
+    preview,
+    redetect,
+    selection,
+    setHeaderRow,
+    setSheet,
+    sheet
+  };
+}

package/dist/runtime/spreadsheet/composables/use-spreadsheet-options.d.ts

@@ -0,0 +1,24 @@
+import type { SpreadsheetField, SpreadsheetFieldOptions, SpreadsheetRecord, SpreadsheetResolvedOption } from '../types/index.js';
+import type { SpreadsheetRowOptions } from '../utils/index.js';
+import type { useSpreadsheetColumns } from './use-spreadsheet-columns.js';
+import type { useSpreadsheetContext } from './use-spreadsheet-context.js';
+import type { useSpreadsheetEdits } from './use-spreadsheet-edits.js';
+import type { useSpreadsheetFields } from './use-spreadsheet-fields.js';
+import type { useSpreadsheetLayout } from './use-spreadsheet-layout.js';
+export interface UseSpreadsheetOptionsParams {
+    fields: ReturnType<typeof useSpreadsheetFields>;
+    columns: ReturnType<typeof useSpreadsheetColumns>;
+    layout: ReturnType<typeof useSpreadsheetLayout>;
+    edits: ReturnType<typeof useSpreadsheetEdits>;
+    context: ReturnType<typeof useSpreadsheetContext>;
+}
+/**
+ * Options of every select field: lists as they are, queries once loaded, and remote loaders
+ * resolved for the values the file holds, exactly.
+ */
+export declare function useSpreadsheetOptions(params: UseSpreadsheetOptionsParams): {
+    loading: import("vue").ComputedRef<boolean>;
+    options: import("vue").ComputedRef<Map<string, SpreadsheetFieldOptions>>;
+    optionsOf: (field: SpreadsheetField, row: SpreadsheetRecord) => SpreadsheetRowOptions;
+    search: (path: string, text: string) => Promise<readonly SpreadsheetResolvedOption[]>;
+};