@12-apps/ui 6.1.0 → 6.3.0

package/src/components/form/CepField/CepField.tsx

@@ -1,5 +1,6 @@
 'use client';
 
+import type { CepFieldCopy } from "../../../copy";
 import React, { useCallback, useEffect, useRef, useState } from 'react';
 
 import { cepDigits, formatCep, isValidCep } from '@12-apps/forms-core';
@@ -8,13 +9,6 @@ import { FormControl, FormLabel, FormMessage } from '../Form';
 import { Input } from '../Input';
 import type { CepAddress, CepFieldProps, CepLookupStatus } from './CepField.types';
 
-/** What the user is told for each non-idle outcome. */
-const STATUS_TEXT: Record<Exclude<CepLookupStatus, 'idle'>, string> = {
-  loading: 'Buscando endereço…',
-  found: 'Endereço preenchido pelo CEP.',
-  notfound: 'CEP não encontrado — preencha o endereço manualmente.',
-};
-
 /** Everything {@link useCepLookup} needs, so the hook signature stays flat. */
 interface LookupOptions {
   digits: string;
@@ -103,17 +97,19 @@ function CepStatus({
   status,
   testId,
   suppressed,
+  copy,
 }: {
   status: CepLookupStatus;
   testId: string;
   suppressed: boolean;
+  copy: CepFieldCopy;
 }): React.ReactElement {
   const visible = !suppressed && status !== 'idle';
   return (
     <span id={`${testId}-status`} role="status" aria-live="polite">
       {visible && (
         <FormMessage error={status === 'notfound'} dataTestId={`${testId}-${status}`}>
-          {STATUS_TEXT[status as Exclude<CepLookupStatus, 'idle'>]}
+          {copy[status as Exclude<CepLookupStatus, 'idle'>]}
         </FormMessage>
       )}
     </span>
@@ -157,6 +153,7 @@ export function CepField({
   debounceMs = 500,
   name = 'postalCode',
   dataTestId,
+  copy,
 }: CepFieldProps): React.ReactElement {
   const testId = dataTestId ?? `cep-field-${name}`;
 
@@ -203,7 +200,7 @@ export function CepField({
           {error}
         </FormMessage>
       )}
-      <CepStatus status={status} testId={testId} suppressed={Boolean(error)} />
+      <CepStatus status={status} testId={testId} suppressed={Boolean(error)} copy={copy} />
     </FormControl>
   );
 }

package/src/components/form/CepField/CepField.types.ts

@@ -1,3 +1,4 @@
+import type { CepFieldCopy } from "../../../copy";
 /**
  * Types for {@link CepField} — the reusable CEP auto-completer.
  */
@@ -29,6 +30,8 @@ export interface CepAddress {
 export type CepLookupStatus = 'idle' | 'loading' | 'found' | 'notfound';
 
 export interface CepFieldProps {
+  /** The lookup status wording. REQUIRED — no default copy. */
+  copy: CepFieldCopy;
   /** Current field value. Masked (`01310-100`) or bare — the field re-masks. */
   value: string;
   /**

package/src/components/form/total-form/Fields/CategoryField.tsx

@@ -1,5 +1,6 @@
 'use client';
 
+import type { CategorySelectCopy } from "../../../../copy";
 import React from 'react';
 
 import { CategorySelect } from '../../CategorySelect';
@@ -8,6 +9,8 @@ import { useFormContext } from '../FormContext';
 
 /** Props for the `total-form` {@link CategoryField}. */
 export interface CategoryFieldProps {
+  /** The picker\'s words. REQUIRED — this package ships no default copy. */
+  copy: CategorySelectCopy;
   /** Field name; also the key into the form's values/errors. */
   name: string;
   /** The categories to choose from, flat, each carrying its `parentId`. */
@@ -36,12 +39,14 @@ export function CategoryField({
   label,
   placeholder,
   allowParentSelection = true,
+  copy,
 }: CategoryFieldProps): React.ReactElement {
   const { values, errors, setFieldValue } = useFormContext();
   const error = errors[name];
 
   return (
     <CategorySelect
+      copy={copy}
       mode="single"
       fullWidth
       label={label}

package/src/components/form/total-form/Fields/CepField.tsx

@@ -1,5 +1,6 @@
 'use client';
 
+import type { CepFieldCopy } from "../../../../copy";
 import React, { useCallback, useMemo, useRef } from 'react';
 
 import { CepField as BaseCepField, type CepAddress } from '../../CepField';
@@ -16,6 +17,8 @@ export type CepFills = Partial<Record<CepPart, string>>;
 
 /** Props for the `total-form` {@link CepField}. */
 export interface CepFieldProps {
+  /** The lookup status wording. REQUIRED — no default copy. */
+  copy: CepFieldCopy;
   /** Field name; also the key into the form's values/errors. */
   name: string;
   /** Optional visible label. Defaults to `CEP`. */
@@ -103,6 +106,7 @@ export function CepField({
   lookup,
   fills,
   debounceMs,
+  copy,
 }: CepFieldProps): React.ReactElement {
   const { values, errors, setFieldValue } = useFormContext();
   const { write, clearOwned } = useOwnedAutofill();
@@ -128,6 +132,7 @@ export function CepField({
 
   return (
     <BaseCepField
+      copy={copy}
       name={name}
       label={label}
       value={values[name] ?? ''}

package/src/components/layout/ContentToolbar/ContentToolbar.types.ts

@@ -258,6 +258,11 @@ export interface SavedViewsMenuProps<V extends SavedViewLike = SavedViewLike> {
   onToggleShare: (view: V) => void;
   onManageAll: () => void;
   /** Override any of the default (pt-BR) strings. */
-  labels?: Partial<SavedViewsLabels>;
+  /**
+   * Every word this menu renders. REQUIRED since FUT-760: it used to be
+   * `Partial<…>` over a pt-BR default, so a host that passed nothing shipped
+   * one product's Portuguese. `PT_BR_SAVED_VIEWS_LABELS` is that exact set.
+   */
+  labels: SavedViewsLabels;
   testIdPrefix?: string;
 }

package/src/components/layout/ContentToolbar/SavedViewsMenu.tsx

@@ -13,26 +13,6 @@ import type {
   SavedViewsMenuProps,
 } from './ContentToolbar.types';
 
-/** Default (pt-BR) strings; override any via the `labels` prop. */
-const DEFAULT_LABELS: SavedViewsLabels = {
-  trigger: 'Visões',
-  mainView: 'Visão principal',
-  pinned: 'Fixadas',
-  recent: 'Recentes',
-  empty: 'Nenhuma visão salva ainda.',
-  saveCurrent: '+ Salvar visão atual',
-  manageAll: 'Gerenciar visões',
-  apply: 'Aplicar',
-  setDefault: 'Definir como padrão',
-  pin: 'Fixar na barra lateral',
-  unpin: 'Desafixar',
-  share: 'Compartilhar com a equipe',
-  unshare: 'Tornar privada',
-  edit: 'Editar',
-  remove: 'Excluir',
-  defaultTag: 'Padrão',
-};
-
 /** How many non-pinned views show under "Recentes". */
 const RECENT_LIMIT = 5;
 
@@ -280,7 +260,7 @@ export function SavedViewsMenu<V extends SavedViewLike = SavedViewLike>({
     action();
     close();
   };
-  const labels = { ...DEFAULT_LABELS, ...labelOverrides };
+  const labels = labelOverrides;
   const pinned = views.filter((view) => view.pinned);
   const recent = views.filter((view) => !view.pinned).slice(0, RECENT_LIMIT);
 

package/src/components/layout/TableFilter/TableFilter.tsx

@@ -328,7 +328,7 @@ const TableFilterRangeField = ({
   step,
   minPlaceholder = 'min',
   maxPlaceholder = 'max',
-  invalidLabel = 'O máximo deve ser maior ou igual ao mínimo.',
+  invalidLabel,
   testId,
 }: TableFilterRangeFieldProps): React.JSX.Element => {
   const invalid = isRangeInverted(value);

package/src/copy.ts

@@ -0,0 +1,103 @@
+/**
+ * The words the standalone components render, as REQUIRED host config
+ * (FUT-760).
+ *
+ * `@12-apps/ui` is the package EVERY host renders, so copy compiled in here
+ * reached every adopter of every other package too — the same leak as anywhere
+ * else, at the widest possible blast radius. Several of these components made
+ * it worse by taking the words as OPTIONAL props with pt-BR defaults, which
+ * reads as configurable right up until nobody configures it.
+ *
+ * The DataViews family has its own object (`DataViewsCopy`) threaded through a
+ * context, because nineteen files are one mounted surface. These six are
+ * mounted independently, so each takes what it renders.
+ */
+
+export interface SectionOnboardingCopy {
+  /** The button that begins the guided section. */
+  start: string;
+  /** The reveal toggle in the configured state, and its collapsed twin. */
+  edit: string;
+  collapse: string;
+}
+
+export interface ConfirmActionCopy {
+  /** The dismiss button every confirmation shares. */
+  cancel: string;
+  /** Shown when the action fails and the caller supplied no reason. */
+  defaultError: string;
+  /**
+   * The fallback body when the caller names no entity.
+   *
+   * A caller that DOES name one gets the host's own sentence — this package
+   * never guesses a noun for someone else's rows.
+   */
+  irreversible: string;
+}
+
+export interface CategorySelectCopy {
+  /**
+   * What categories are FOR, in the host's own terms.
+   *
+   * This used to read "Categorias organizam o cardápio e os filtros da loja" —
+   * a restaurant's menu, hard-coded into a generic picker. A host selling
+   * insurance policies got told about its cardápio.
+   */
+  purpose: string;
+  clearSelection: string;
+  /** The empty state, when the host has no categories at all. */
+  emptyTitle: string;
+  createCategory: string;
+  /**
+   * The search found nothing.
+   *
+   * Two of the four interpolate the term typed, so they are functions rather
+   * than strings with a placeholder to substitute: where the term sits in the
+   * sentence is the translator's call, not ours.
+   */
+  noResults: {
+    title: (query: string) => string;
+    hint: string;
+    clearSearch: string;
+    create: (query: string) => string;
+  };
+  /**
+   * The panel's two footers.
+   *
+   * `selectedCount` is a function because Portuguese agrees the participle with
+   * the count and English does not — the shape has to let a translator decide
+   * the whole sentence, not fill a slot in ours.
+   */
+  /** The search box above the list, and the chips beneath it. */
+  search: {
+    /** Two placeholders: a single-select picker offers no subcategories. */
+    placeholderSingle: string;
+    placeholderMulti: string;
+    clear: string;
+    removeChip(label: string): string;
+    /** The tray above the list, counting what is already picked. */
+    pinnedLabel(count: number): string;
+  };
+  footer: {
+    selectedCount(count: number): string;
+    clear: string;
+    /** The primary button, which reads `close` while the draft is unchanged. */
+    apply: string;
+    close: string;
+    /** The single-select footer: what to do, and the way out. */
+    singleHint: string;
+    cancel: string;
+  };
+}
+
+export interface CepFieldCopy {
+  loading: string;
+  found: string;
+  /** Keyed to match `CepLookupStatus` exactly, so the lookup can index it. */
+  notfound: string;
+}
+
+export interface TableFilterCopy {
+  /** A numeric range whose maximum is below its minimum. */
+  invalidRange: string;
+}

package/src/pt-BR.ts

@@ -0,0 +1,247 @@
+import type { DataViewsCopy } from "./components/data-display/DataViews/data-views-copy";
+import type { SavedViewsLabels } from "./components/layout/ContentToolbar/ContentToolbar.types";
+import type {
+  CategorySelectCopy,
+  CepFieldCopy,
+  ConfirmActionCopy,
+  SectionOnboardingCopy,
+  TableFilterCopy,
+} from "./copy";
+
+/**
+ * The pt-BR packs — NAMED constants a host passes by hand, never defaults.
+ *
+ * The filename is what exempts this file from the copy-portability gate:
+ * Portuguese may ship, it may not be silent. Every sentence is VERBATIM what
+ * the components used to render, so a host adopting these sees no change on
+ * screen — what changes is that the words are chosen in a diff.
+ */
+export const PT_BR_SECTION_ONBOARDING_COPY: SectionOnboardingCopy = {
+  edit: "Editar",
+  collapse: "Ocultar",
+  start: "Começar",
+};
+
+export const PT_BR_CONFIRM_ACTION_COPY: ConfirmActionCopy = {
+  cancel: "Cancelar",
+  defaultError: "Não foi possível concluir a ação. Tente novamente.",
+  irreversible: "Esta ação não pode ser desfeita.",
+};
+
+export const PT_BR_CATEGORY_SELECT_COPY: CategorySelectCopy = {
+  purpose: "Categorias organizam o cardápio e os filtros da loja.",
+  clearSelection: "Limpar seleção",
+  emptyTitle: "Nenhuma categoria ainda",
+  createCategory: "Criar categoria",
+  noResults: {
+    title: (query) => `Nada encontrado para “${query}”`,
+    hint: "Tente outro termo ou verifique a grafia.",
+    clearSearch: "Limpar busca",
+    create: (query) => `Criar “${query}”`,
+  },
+  search: {
+    placeholderSingle: "Buscar categoria…",
+    placeholderMulti: "Buscar categoria ou subcategoria",
+    clear: "Limpar busca",
+    removeChip: (label) => `Remover ${label}`,
+    pinnedLabel: (count) => `Selecionadas · ${count}`,
+  },
+  footer: {
+    selectedCount: (count) => `${count} selecionada${count === 1 ? "" : "s"}`,
+    clear: "Limpar",
+    apply: "Aplicar",
+    close: "Fechar",
+    singleHint: "Escolha uma categoria",
+    cancel: "Cancelar",
+  },
+};
+
+export const PT_BR_CEP_FIELD_COPY: CepFieldCopy = {
+  loading: "Buscando endereço…",
+  found: "Endereço preenchido pelo CEP.",
+  notfound: "CEP não encontrado — preencha o endereço manualmente.",
+};
+
+/**
+ * The saved-views dropdown's labels.
+ *
+ * Typed as the package's OWN `SavedViewsLabels` rather than a parallel shape:
+ * that interface already named every string, including the seven with no
+ * diacritics the copy gate could not see (`Aplicar`, `Fixar na barra lateral`,
+ * `Editar`…). The prop was `Partial<SavedViewsLabels>` with a pt-BR default —
+ * configurable in the type, inherited in practice.
+ */
+export const PT_BR_SAVED_VIEWS_LABELS: SavedViewsLabels = {
+  trigger: "Visões",
+  mainView: "Visão principal",
+  pinned: "Fixadas",
+  recent: "Recentes",
+  empty: "Nenhuma visão salva ainda.",
+  saveCurrent: "+ Salvar visão atual",
+  manageAll: "Gerenciar visões",
+  apply: "Aplicar",
+  setDefault: "Definir como padrão",
+  pin: "Fixar na barra lateral",
+  unpin: "Desafixar",
+  share: "Compartilhar com a equipe",
+  unshare: "Tornar privada",
+  edit: "Editar",
+  remove: "Excluir",
+  defaultTag: "Padrão",
+};
+
+export const PT_BR_TABLE_FILTER_COPY: TableFilterCopy = {
+  invalidRange: "O máximo deve ser maior ou igual ao mínimo.",
+};
+
+export const PT_BR_DATA_VIEWS_COPY: DataViewsCopy = {
+  savedViewsMenu: PT_BR_SAVED_VIEWS_LABELS,
+  confirmAction: PT_BR_CONFIRM_ACTION_COPY,
+  categorySelect: PT_BR_CATEGORY_SELECT_COPY,
+  board: {
+    countOnPage: (label, count) => `${label}: ${count} nesta página`,
+    onThisPage: (count) => `${count} nesta página`,
+    pageSum: (sum) => `Soma desta página: ${sum}`,
+    pageScopeNote:
+      "As contagens e somas abaixo referem-se apenas aos itens desta página.",
+  },
+  deleteView: {
+    title: "Excluir visão",
+    sharedWarning: "Esta visão está compartilhada — a equipe perderá o acesso a ela.",
+    rowsUnaffected: (entityLabel) =>
+      `${entityLabel} não são afetados; apenas o recorte salvo é removido.`,
+    confirm: "Excluir visão",
+  },
+  manageViews: {
+    title: "Gerenciar visões",
+    empty: "Nenhuma visão salva.",
+    defaultTag: "Padrão",
+    otherUserTag: "De outro usuário",
+    deleteTitle: "Excluir a visão salva?",
+    deleteBody: "Os filtros e colunas guardados nela são perdidos. Não é possível restaurar.",
+    deleteConfirm: "Excluir",
+  },
+  saveView: {
+    sharedDescription: "Qualquer pessoa da loja poderá abrir e usar esta visão.",
+    setDefaultTitle: "Definir como padrão",
+    setDefaultDescription: "Esta tela abre nesta visão em vez da Visão principal.",
+    previewHeading: "O que esta visão guarda",
+    previewUnchanged: "Nada foi alterado — esta visão ficará igual à Visão principal.",
+    sortRowLabel: "Ordenação",
+    saveFailed: "Não foi possível salvar a visão.",
+    titleEditing: "Editar visão",
+    titleCreating: "Salvar visão",
+    descriptionLabel: "Descrição — opcional",
+    descriptionPlaceholder: "Para que serve esta visão",
+    submitEditing: "Salvar alterações",
+    submitCreating: "Salvar visão",
+    nameLabel: "Nome",
+    cancel: "Cancelar",
+    pinnedTitle: "Fixar na barra lateral",
+    pinnedDescription: "Aparece como atalho no menu, abaixo desta tela.",
+    sharedTitle: "Compartilhar com a equipe",
+    namePlaceholder: "Ex.: Recusados no PIX desta semana",
+    previewFilters: "Filtros",
+    previewHiddenColumns: "Colunas ocultas",
+  },
+  columns: {
+    visibleCount: (visible, total) => `${visible} de ${total} visíveis`,
+    reset: "Padrão",
+    showAll: "Mostrar todas",
+  },
+  display: {
+    sortTab: "Ordenar",
+    columnsTab: "Colunas",
+    panelTab: "Exibição",
+    direction: "Direção",
+    layoutHints: {
+      table: "Colunas comparáveis, boa para varrer números.",
+      list: "Uma linha por item, com os dados principais.",
+      cards: "Blocos maiores, bom para poucos itens.",
+      board: "Colunas por etapa, para acompanhar o que está onde.",
+    },
+    densityHeadings: {
+      table: "Altura das linhas",
+      list: "Altura das linhas",
+      cards: "Cards por linha",
+      board: "Largura das colunas",
+    },
+    densityLabels: {
+      table: { compact: "Baixa", cozy: "Média", comfortable: "Alta" },
+      list: { compact: "Baixa", cozy: "Média", comfortable: "Alta" },
+      cards: { compact: "Muitos", cozy: "Médio", comfortable: "Poucos" },
+      board: { compact: "Estreita", cozy: "Média", comfortable: "Larga" },
+    },
+    boardUnavailable: "Esta tela não declara etapas, então não oferece quadro.",
+    densityUnavailableNarrow:
+      "Um card por linha nesta largura — a densidade volta em telas maiores.",
+    trigger: "Exibir",
+  },
+  export: {
+    formats: {
+      json: { label: "JSON (.json)", hint: "Para integrações" },
+    },
+    visibleColumns: (columnCount) => `${columnCount} colunas visíveis, na ordem atual`,
+    trigger: "Exportar",
+  },
+  grid: {
+    rowActions: "Ações",
+    bulkActions: (selectedCount) => `Ações (${selectedCount}) ▾`,
+  },
+  filters: {
+    moreFilters: (count) => `Mais filtros: ${count} sem espaço na barra`,
+    moreFiltersApplied: (count, appliedCount) =>
+      `Mais filtros: ${count} sem espaço na barra, ${appliedCount} aplicado(s)`,
+    overflowNote: "sem espaço na barra",
+    rangeEnd: "Até",
+    rangeInvalid: "O início precisa ser menor que o fim.",
+    rangePresets: {
+      hoje: "Hoje",
+      ontem: "Ontem",
+      semana: "Esta semana",
+      mes: "Este mês",
+      ano: "Este ano",
+    },
+    scopesLabel: "Situação",
+    panelTitle: "Filtros",
+    clear: "Limpar",
+    clearAll: "Limpar filtros",
+    clearRange: (label) => `Limpar ${label}`,
+    allOption: "Todas",
+    optionSearchPlaceholder: "Buscar…",
+    optionsEmpty: "Nenhum resultado",
+  },
+  selection: {
+    selectAllOnPage: "Selecionar todos nesta página",
+    clearSelection: "Limpar seleção",
+    selectAll: "Selecionar tudo",
+    onThisPage: (count) => `${count} nesta página`,
+    selectRow: "Selecionar",
+  },
+  nav: {
+    mainView: "Visão principal",
+    defaultTag: "Padrão",
+    viewOptions: (viewName) => `Opções de ${viewName}`,
+    emptyHint: "Nenhuma visão salva. Ajuste filtros, colunas ou ordenação e salve abaixo.",
+    setDefault: "Definir como padrão",
+    deleteView: "Excluir visão",
+    unsavedChanges: "Alterações não salvas",
+    label: "Visão",
+    update: "Atualizar visão",
+    save: "Salvar visão",
+    updateFailed: "Não foi possível atualizar a visão",
+    saveFailed: "Não foi possível salvar a alteração da visão.",
+    editView: "Renomear e editar",
+    pinToSidebar: "Fixar na barra lateral",
+    shareWithTeam: "Compartilhar com a equipe",
+  },
+  search: {
+    placeholder: "Buscar…",
+    allColumnsLabel: "Buscar em todas as colunas",
+    keywordPlaceholder: "Pressione Enter para filtrar",
+    open: "Buscar",
+    close: "Fechar busca",
+    clear: "Limpar busca",
+  },
+};
+

package/src/utils/export-rows.ts

@@ -0,0 +1,95 @@
+/**
+ * Serialise rows and hand the browser a download.
+ *
+ * The companion of the grid's Export control, which emits a REQUEST and leaves
+ * the producing to the host — this is the producing half, for the common case
+ * where the host already has the rows and only needs a file out of them.
+ *
+ * Dependency-free on purpose: "Excel" is emitted as CSV, which Excel opens
+ * natively. A spreadsheet library would add ~700KB to a bundle for column
+ * widths nobody asked for, and the one thing a real `.xlsx` buys — types that
+ * survive the round trip — is not something a CSV export of an admin list is
+ * being asked for.
+ */
+
+type ExportFormat = 'csv' | 'json';
+
+/** One column of the exported file: its header, and how to read a row. */
+export interface ExportColumn<T> {
+  /** Column header, used as the CSV column and the JSON key. */
+  header: string;
+  /** Extract the cell value for a row. */
+  value: (row: T) => string | number | boolean | null | undefined;
+}
+
+function escapeCsvCell(value: string): string {
+  // Quote when the cell contains a comma, a quote or a newline; double any
+  // embedded quote. Without this a name with a comma silently shifts every
+  // column after it by one, which reads as corrupt data rather than as a bug.
+  if (/[",\n\r]/.test(value)) {
+    return `"${value.replace(/"/g, '""')}"`;
+  }
+  return value;
+}
+
+function toCsv<T>(rows: readonly T[], columns: readonly ExportColumn<T>[]): string {
+  const head = columns.map((column) => escapeCsvCell(column.header)).join(',');
+  const body = rows
+    .map((row) =>
+      columns
+        .map((column) => {
+          const cell = column.value(row);
+          return escapeCsvCell(cell == null ? '' : String(cell));
+        })
+        .join(','),
+    )
+    .join('\n');
+  return `${head}\n${body}`;
+}
+
+function toJson<T>(rows: readonly T[], columns: readonly ExportColumn<T>[]): string {
+  const records = rows.map((row) => {
+    const record: Record<string, string | number | boolean | null> = {};
+    for (const column of columns) {
+      const cell = column.value(row);
+      record[column.header] = cell == null ? null : (cell as string | number | boolean);
+    }
+    return record;
+  });
+  return JSON.stringify(records, null, 2);
+}
+
+function triggerDownload(content: string, filename: string, mimeType: string): void {
+  // A no-op without a document, so a module that imports this can still be
+  // loaded by a test runner or a server render without guarding the import.
+  if (typeof window === 'undefined') return;
+  const blob = new Blob([content], { type: mimeType });
+  const url = URL.createObjectURL(blob);
+  const anchor = document.createElement('a');
+  anchor.href = url;
+  anchor.download = filename;
+  document.body.appendChild(anchor);
+  anchor.click();
+  anchor.remove();
+  URL.revokeObjectURL(url);
+}
+
+/**
+ * Serialise `rows` using `columns` and download them as `<baseName>.<ext>`.
+ *
+ * @param format - `csv` (also what the Excel option produces) or `json`.
+ * @param baseName - File name without extension; the consumer's word for the
+ *   collection, so it is never derived from a type name here.
+ */
+export function exportRows<T>(
+  format: ExportFormat,
+  rows: readonly T[],
+  columns: readonly ExportColumn<T>[],
+  baseName: string,
+): void {
+  if (format === 'json') {
+    triggerDownload(toJson(rows, columns), `${baseName}.json`, 'application/json');
+    return;
+  }
+  triggerDownload(toCsv(rows, columns), `${baseName}.csv`, 'text/csv;charset=utf-8');
+}

package/src/utils/index.ts

@@ -1,3 +1,4 @@
 export * from './cn';
+export * from './export-rows';
 export * from './viewport';
 export * from './withDefaults';