nuxt-ui-tools 1.12.0 → 1.13.0

package/dist/runtime/i18n/types.d.ts

@@ -148,144 +148,266 @@ export interface UiToolsTableMessages {
     };
 }
 export interface UiToolsSpreadsheetMessages {
-    common: {
-        steps: string;
-        previous: string;
-        continue: string;
-        closeImport: string;
-        preparingReview: string;
-        preparingReviewDescription: string;
-        importRows: string;
-        exportDiscardedRows: string;
-        importSummary: string;
-        clickToChangeHeaderRow: string;
-        referencesStepHint: string;
-        sheetStats: string;
-        arrayValue: string;
-        objectValue: string;
-        arraySummary: string;
-        objectSummary: string;
+    issues: {
+        required: string;
+        number: string;
+        date: string;
+        boolean: string;
+        unknownValue: string;
+        notFound: string;
+        skipped: string;
+        duplicate: string;
+        exists: string;
+        email: string;
+        pattern: string;
+        minLength: string;
+        maxLength: string;
+        min: string;
+        max: string;
+        between: string;
+        notFuture: string;
+    };
+    template: {
+        sheet: string;
+        guide: string;
+        column: string;
+        required: string;
+        allowed: string;
+        description: string;
+        yes: string;
     };
     steps: {
-        upload: {
+        file: string;
+        columns: string;
+        values: string;
+        review: string;
+        submit: string;
+        auto: string;
+    };
+    stepHints: {
+        file: string;
+        columns: string;
+        values: string;
+        review: string;
+        submit: string;
+    };
+    headings: {
+        file: {
             title: string;
             description: string;
-            stageTitle: string;
         };
-        structure: {
+        columns: {
             title: string;
             description: string;
-            stageTitle: string;
-            loadWorkbookFirstTitle: string;
-            loadWorkbookFirstDescription: string;
-            sheetLabel: string;
-            previewTitle: string;
-            autoDetected: string;
-            headerDetectedAtRow: string;
-        };
-        matching: {
+        };
+        values: {
             title: string;
             description: string;
-            matched: string;
-            needsMatch: string;
-            missing: string;
-            autoMapped: string;
-            ignored: string;
-            ignoreField: string;
-            columnFallback: string;
-            systemField: string;
-            requirement: string;
-            spreadsheetColumn: string;
-            statusHeader: string;
-            required: string;
-            optional: string;
-            searchColumns: string;
-            selectColumn: string;
-            assigned: string;
-            available: string;
-            autoMappedField: string;
-            ignoredColumns: string;
-        };
-        references: {
+        };
+        review: {
             title: string;
             description: string;
         };
-        review: {
+        submit: {
             title: string;
             description: string;
-            importLimit: string;
-            selected: string;
-            discard: string;
-            restore: string;
-            discardRow: string;
-            next: string;
-            prev: string;
-            backToTable: string;
-            restoreRow: string;
-            allRows: string;
-            valid: string;
+        };
+    };
+    nav: {
+        back: string;
+        continue: string;
+        cancel: string;
+        close: string;
+        import: string;
+        another: string;
+        blockers: {
+            file: string;
+            columns: string;
+            values: string;
+            review: string;
+            invalid: string;
+        };
+    };
+    file: {
+        dropTitle: string;
+        dropBrowse: string;
+        dropHint: string;
+        dropHintNoLimit: string;
+        paste: string;
+        reading: string;
+        readFailed: string;
+        replace: string;
+        summary: string;
+        sheet: string;
+        sheetOption: string;
+        headerRow: string;
+        rowOption: string;
+        emptyRow: string;
+        detected: string;
+        titleRows: string;
+        ambiguous: string;
+        noMatch: string;
+        useDetected: string;
+        previewTitle: string;
+        previewHeader: string;
+        expected: string;
+        expectedCount: string;
+        optional: string;
+        fromContext: string;
+        template: string;
+    };
+    columns: {
+        field: string;
+        column: string;
+        samples: string;
+        none: string;
+        columnFor: string;
+        emptyColumn: string;
+        statuses: {
+            matched: string;
+            manual: string;
+            default: string;
+            missing: string;
+            unmatched: string;
+        };
+        suggestion: string;
+        useSuggestion: string;
+        reset: string;
+        reads: string;
+        found: string;
+        allFound: string;
+        unused: string;
+    };
+    values: {
+        value: string;
+        rows: string;
+        answer: string;
+        rowCount: string;
+        choose: string;
+        search: string;
+        loading: string;
+        valueFor: string;
+        /** Heading of values checked against options that depend on other columns. */
+        scope: string;
+        condition: string;
+        leaveEmpty: string;
+        skipRows: string;
+        create: string;
+        statuses: {
+            open: string;
+            user: string;
+            policy: string;
+            recognized: string;
+        };
+        recognized: string;
+        nothing: string;
+    };
+    table: {
+        tabs: {
+            all: string;
+            importable: string;
             invalid: string;
             discarded: string;
-            allIssues: string;
+        };
+        levels: {
+            all: string;
             blocking: string;
             warnings: string;
-            ready: string;
-            validRows: string;
-            noBlockingIssues: string;
-            willNotBeImported: string;
-            nothingDiscarded: string;
-            row: string;
-            blockingIssues: string;
-            warningsOnly: string;
-            validRow: string;
-            issueBadgeBlocking: string;
-            issueBadgeWarning: string;
-            noValue: string;
-            overflowTitle: string;
-            overflowDescription: string;
-            discardedStatus: string;
-            blockingStatus: string;
-            warningStatus: string;
-            validStatus: string;
-            issueRowsProgress: string;
-            inspectingRow: string;
-            propertyGroups: string;
-            issueGroups: string;
-            rowData: string;
-            issuesOnThisRow: string;
-            byProperty: string;
-            byIssueType: string;
-            ruleKey: string;
-            groupedByIssueType: string;
-            rowLevelIssue: string;
-            affectsFullRow: string;
-            property: string;
-            valueInFile: string;
-            viewAllRowsWithThisIssue: string;
-            autoTrim: string;
-        };
-    };
-    upload: {
-        dropzoneLabel: string;
-        dropzoneDescription: string;
-        parsingFailed: string;
-        downloadTemplate: string;
-        downloadTemplateDescription: string;
+        };
+        modes: {
+            all: string;
+            create: string;
+            update: string;
+        };
+        search: string;
+        anyIssue: string;
+        byColumn: string;
+        byIssue: string;
+        columnIssueOption: string;
+        issueOption: string;
+        clearFilter: string;
+        selected: string;
+        discard: string;
+        restore: string;
+        clearSelection: string;
+        row: string;
+        selectRow: string;
+        selectAll: string;
+        inspectRow: string;
+        empty: string;
+        emptyCell: string;
+        edited: string;
+        defaulted: string;
+        created: string;
+        stored: string;
+        rowCount: string;
+        modeCreate: string;
+        modeUpdate: string;
+        status: {
+            valid: string;
+            warning: string;
+            blocking: string;
+            discarded: string;
+        };
+        reasons: {
+            manual: string;
+            value: string;
+            limit: string;
+            duplicate: string;
+            existing: string;
+        };
     };
-    validation: {
-        required: string;
-        maxLength: string;
-        minLength: string;
-        number: string;
-        min: string;
-        max: string;
-        between: string;
-        oneOf: string;
-        unrecognizedValue: string;
-        invalidNumberInput: string;
-        invalidBooleanInput: string;
-        missingValue: string;
-        parseFailed: string;
+    inspector: {
+        title: string;
+        close: string;
+        position: string;
+        positionNone: string;
+        previous: string;
+        next: string;
+        issues: string;
+        noIssue: string;
+        values: string;
+        inFile: string;
+        revert: string;
+        discard: string;
+        restore: string;
+        allRows: string;
+        answerIt: string;
+    };
+    stats: {
+        importable: string;
+        invalid: string;
+        discarded: string;
+        create: string;
+        update: string;
+        warnings: string;
+        blocking: string;
+    };
+    review: {
+        issuesColumn: string;
+        export: string;
+    };
+    summary: {
+        file: string;
+        toImport: string;
+        create: string;
+        update: string;
+        invalid: string;
+        discarded: string;
+        edited: string;
+        created: string;
+    };
+    progress: {
+        running: string;
+        count: string;
+        done: string;
+        doneHint: string;
+        rejected: string;
+        rejectedHint: string;
+        retry: string;
+        review: string;
+        error: string;
+        tryAgain: string;
     };
 }
 export interface UiToolsFormMessages {

package/dist/runtime/shared/types/remote-options.d.ts

@@ -52,6 +52,13 @@ export interface RemoteOptionsLoader<TOption> {
     resolveSelected: (request: {
         values: readonly RemoteOptionValue[];
     }) => QueryFnDefinition<readonly TOption[]>;
+    /**
+     * Options whose label is exactly one of `labels`, in one request. Spreadsheet imports use it to
+     * match the values of a file; without it they search each value.
+     */
+    resolveLabels?: (request: {
+        labels: readonly string[];
+    }) => QueryFnDefinition<readonly TOption[]>;
     pagination: RemoteOptionsPagination;
     search?: RemoteOptionsSearch;
     /** Identity of a page query, used by pickers that cache an infinite list as one query. */
@@ -77,6 +84,10 @@ export interface RemoteOptionsQueries<TPageQuery extends RemoteOptionsQueryDefin
     resolveSelected: (request: {
         values: readonly RemoteOptionValue[];
     }) => TSelectedQuery;
+    /** Options whose label is one of `labels`; its response has the shape of `resolveSelected`'s. */
+    resolveLabels?: (request: {
+        labels: readonly string[];
+    }) => TSelectedQuery;
 }
 /** Maps endpoint responses to the option result shared by all three pickers. */
 export interface DefineRemoteOptionsConfig<TPageQuery extends RemoteOptionsQueryDefinition, TSelectedQuery extends RemoteOptionsQueryDefinition, TOption extends RemoteOption> {

package/dist/runtime/shared/utils/define-remote-options.js

@@ -1,6 +1,7 @@
 import { mapRemoteOptionsQuery } from "./remote-options-query.js";
 export function defineRemoteOptions(queries, config) {
   const suffix = ["remote-options", config.key];
+  const resolveLabels = queries.resolveLabels;
   return {
     load: (request) => mapRemoteOptionsQuery(
       queries.load(request),
@@ -9,6 +10,11 @@ export function defineRemoteOptions(queries, config) {
     ),
     pagination: config.pagination,
     queryKeyFor: (request) => [...queries.load(request).queryKey, ...suffix, "page"],
+    resolveLabels: resolveLabels ? (request) => mapRemoteOptionsQuery(
+      resolveLabels(request),
+      config.mapSelected,
+      [...suffix, "labels"]
+    ) : void 0,
     resolveSelected: (request) => mapRemoteOptionsQuery(
       queries.resolveSelected(request),
       config.mapSelected,

package/dist/runtime/shared/utils/file.d.ts

@@ -1,4 +1,4 @@
-export declare function fileIconName(type: string | null | undefined): "i-lucide-file-spreadsheet" | "i-lucide-file-text" | "i-lucide-file-image" | "i-lucide-file-video" | "i-lucide-file-audio" | "i-lucide-file-type" | "i-lucide-file-archive" | "i-lucide-file";
+export declare function fileIconName(type: string | null | undefined): "i-lucide-file-text" | "i-lucide-file-image" | "i-lucide-file-video" | "i-lucide-file-audio" | "i-lucide-file-spreadsheet" | "i-lucide-file-type" | "i-lucide-file-archive" | "i-lucide-file";
 /** Lowercase extension of a file name without the dot, or `null` when it has none. */
 export declare function fileExtension(name: string): string | null;
 export declare function fileExtensionLabel(file: {

package/dist/runtime/spreadsheet/components/{steps/review/spreadsheet-review-overflow-alert.d.vue.ts → internal/spreadsheet-import-cell-editor.d.vue.ts}

@@ -1,12 +1,15 @@
 type __VLS_Props = {
-    reviewRowsLength: number;
-    maxRecords: number;
-    overflowCount: number;
+    /** Current text of the cell. */
+    text: string;
+    /** Labels to pick from, for a select column. */
+    choices?: readonly string[];
 };
 declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    autoTrim: () => any;
+    cancel: () => any;
+    commit: (text: string, move?: 1 | -1 | undefined) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
-    onAutoTrim?: (() => any) | undefined;
+    onCancel?: (() => any) | undefined;
+    onCommit?: ((text: string, move?: 1 | -1 | undefined) => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/runtime/spreadsheet/components/internal/spreadsheet-import-cell-editor.vue

@@ -0,0 +1,73 @@
+<script setup>
+import { nextTick, onMounted, useTemplateRef } from "vue";
+import { useUiToolsLocale } from "#ui-tools/i18n";
+const props = defineProps({
+  text: { type: String, required: true },
+  choices: { type: Array, required: false }
+});
+const emit = defineEmits(["commit", "cancel"]);
+const { t } = useUiToolsLocale();
+const input = useTemplateRef("input");
+const select = useTemplateRef("select");
+let done = false;
+onMounted(async () => {
+  await nextTick();
+  if (input.value) {
+    input.value.focus({ preventScroll: true });
+    input.value.select();
+  } else select.value?.focus({ preventScroll: true });
+});
+function finish(text, move) {
+  if (done) return;
+  done = true;
+  emit("commit", text.trim(), move);
+}
+function onKeydown(event) {
+  const target = event.target;
+  if (!(target instanceof HTMLInputElement || target instanceof HTMLSelectElement)) return;
+  if (event.key === "Escape") {
+    event.preventDefault();
+    done = true;
+    emit("cancel");
+  } else if (event.key === "Enter") {
+    event.preventDefault();
+    finish(target.value);
+  } else if (event.key === "Tab") {
+    event.preventDefault();
+    finish(target.value, event.shiftKey ? -1 : 1);
+  }
+}
+function onCommit(event) {
+  const target = event.target;
+  if (target instanceof HTMLInputElement || target instanceof HTMLSelectElement)
+    finish(target.value);
+}
+</script>
+
+<template>
+  <select
+    v-if="choices"
+    ref="select"
+    class="block h-full w-full min-w-40 bg-transparent px-2.5 text-highlighted outline-none"
+    @change="onCommit"
+    @keydown="onKeydown"
+    @blur="onCommit"
+  >
+    <option v-if="!choices.includes(text)" :value="text" selected>
+      {{ text || t("spreadsheet.table.emptyCell") }}
+    </option>
+    <option v-for="choice in choices" :key="choice" :value="choice" :selected="choice === text">
+      {{ choice }}
+    </option>
+  </select>
+  <input
+    v-else
+    ref="input"
+    :value="text"
+    autocomplete="off"
+    spellcheck="false"
+    class="block h-full w-full min-w-40 bg-transparent px-3 text-highlighted outline-none"
+    @keydown="onKeydown"
+    @blur="onCommit"
+  />
+</template>

package/dist/runtime/spreadsheet/components/{steps/review/spreadsheet-review-overflow-alert.vue.d.ts → internal/spreadsheet-import-cell-editor.vue.d.ts}

@@ -1,12 +1,15 @@
 type __VLS_Props = {
-    reviewRowsLength: number;
-    maxRecords: number;
-    overflowCount: number;
+    /** Current text of the cell. */
+    text: string;
+    /** Labels to pick from, for a select column. */
+    choices?: readonly string[];
 };
 declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    autoTrim: () => any;
+    cancel: () => any;
+    commit: (text: string, move?: 1 | -1 | undefined) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
-    onAutoTrim?: (() => any) | undefined;
+    onCancel?: (() => any) | undefined;
+    onCommit?: ((text: string, move?: 1 | -1 | undefined) => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/runtime/spreadsheet/components/internal/spreadsheet-import-column-row.d.vue.ts

@@ -0,0 +1,17 @@
+import type { SpreadsheetFieldState, SpreadsheetHeaderCell } from '../../types/index.js';
+type __VLS_Props = {
+    field: SpreadsheetFieldState;
+    headers: readonly SpreadsheetHeaderCell[];
+    suggestions: boolean;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    reset: () => any;
+    assign: (header: number) => any;
+    ignore: () => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onReset?: (() => any) | undefined;
+    onAssign?: ((header: number) => any) | undefined;
+    onIgnore?: (() => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/spreadsheet/components/internal/spreadsheet-import-column-row.vue

@@ -0,0 +1,98 @@
+<script setup>
+import UButton from "@nuxt/ui/components/Button.vue";
+import USelect from "@nuxt/ui/components/Select.vue";
+import { computed } from "vue";
+import { useUiToolsLocale } from "#ui-tools/i18n";
+const NONE = -1;
+const props = defineProps({
+  field: { type: Object, required: true },
+  headers: { type: Array, required: true },
+  suggestions: { type: Boolean, required: true }
+});
+const emit = defineEmits(["assign", "ignore", "reset"]);
+const { t } = useUiToolsLocale();
+const items = computed(() => [
+  { label: t("spreadsheet.columns.none"), value: NONE },
+  ...props.headers.filter((header) => header.text).map((header) => ({ label: header.text, value: header.index }))
+]);
+const tone = computed(
+  () => ({
+    default: "bg-info",
+    matched: props.field.assignedBy === "user" ? "bg-primary" : "bg-success",
+    missing: "bg-error",
+    unmatched: "bg-accented"
+  })[props.field.status]
+);
+function select(value) {
+  if (value === NONE) emit("ignore");
+  else emit("assign", value);
+}
+function useSuggestion() {
+  if (props.field.suggestion) emit("assign", props.field.suggestion.header.index);
+}
+</script>
+
+<template>
+  <div
+    :data-spreadsheet-field="field.path"
+    :data-status="field.status"
+    class="grid grid-cols-1 items-center gap-x-4 gap-y-1.5 px-4 py-3 sm:grid-cols-[minmax(0,1fr)_minmax(0,1.05fr)_minmax(0,1fr)]"
+    :class="field.status === 'missing' ? 'bg-error/3' : ''"
+  >
+    <div class="flex min-w-0 items-center gap-2.5">
+      <span class="size-2 shrink-0 rounded-full" :class="tone" />
+      <span class="truncate font-medium text-highlighted">{{ field.label }}</span>
+      <span v-if="field.required" class="shrink-0 text-error" aria-hidden="true">*</span>
+    </div>
+    <USelect
+      :model-value="field.header?.index ?? NONE"
+      :items="items"
+      :color="field.status === 'missing' ? 'error' : 'neutral'"
+      :highlight="field.status === 'missing'"
+      :aria-label="t('spreadsheet.columns.columnFor', { field: field.label })"
+      class="w-full"
+      @update:model-value="select"
+    />
+    <div class="min-w-0 text-[12.5px] leading-snug">
+      <template v-if="field.status === 'missing' && suggestions && field.suggestion">
+        <span class="text-muted">{{
+          t("spreadsheet.columns.suggestion", {
+  header: field.suggestion.header.text,
+  samples: field.suggestion.samples.join(", ")
+})
+        }}</span>
+        <UButton
+          data-spreadsheet-use-suggestion
+          variant="link"
+          size="xs"
+          class="px-1"
+          :label="t('spreadsheet.columns.useSuggestion')"
+          @click="useSuggestion"
+        />
+      </template>
+      <span v-else-if="field.status === 'missing'" class="font-medium text-error">{{
+        t("spreadsheet.columns.statuses.missing")
+      }}</span>
+      <span v-else-if="field.status === 'default'" class="text-info">{{
+        t("spreadsheet.columns.statuses.default")
+      }}</span>
+      <span v-else-if="field.status === 'unmatched'" class="text-dimmed">{{
+        t("spreadsheet.columns.statuses.unmatched")
+      }}</span>
+      <span v-else class="flex min-w-0 items-center gap-1.5">
+        <span class="truncate text-muted">{{
+          field.samples.join(" \xB7 ") || t("spreadsheet.columns.emptyColumn")
+        }}</span>
+        <UButton
+          v-if="field.assignedBy === 'user'"
+          variant="link"
+          color="neutral"
+          size="xs"
+          class="shrink-0 px-0"
+          :label="t('spreadsheet.columns.reset')"
+          @click="emit('reset')"
+        />
+      </span>
+    </div>
+  </div>
+</template>