@digitalwalletcorp/vue-core 1.3.1 → 1.4.1

package/README.md

@@ -172,6 +172,42 @@ export default defineNuxtConfig({
 });
 ```
 
+**🧭 Application-wide Options (`vueCoreOptionsKey`)**
+
+Settings that are the same on every page, such as the texts of `DataTable`, can be provided once for the whole application instead of being passed to each component.
+Provide `vueCoreOptionsKey` in a component above the components or with `app.provide`.
+A prop wins over the provided value, and without either, the default of the library is used.
+
+```ts
+// Vue: main.ts
+import { vueCoreOptionsKey } from '@digitalwalletcorp/vue-core';
+
+app.provide(vueCoreOptionsKey, {
+  dataTable: {
+    labels: { totalCount: 'Total', totalUnit: 'records', noData: 'No data' },
+    sortMode: 'page'
+  }
+});
+```
+
+```ts
+// Nuxt: plugins/vue-core.ts
+import { vueCoreOptionsKey } from '@digitalwalletcorp/vue-core';
+
+export default defineNuxtPlugin((nuxtApp) => {
+  nuxtApp.vueApp.provide(vueCoreOptionsKey, {
+    dataTable: {
+      labels: { totalCount: 'Total', totalUnit: 'records', noData: 'No data' },
+      sortMode: 'page'
+    }
+  });
+});
+```
+
+| Property    | Type               | Description |
+| ----------- | ------------------ | ----------- |
+| `dataTable` | `DataTableOptions` | Sets default props for [`DataTable`](https://github.com/digitalwalletcorp/vue-core/blob/main/docs/components/data-table.md) components across the application. For example, you can configure default labels or sort behavior. |
+
 #### 🛠️ Helper Functions
 
 Dialogs, snackbars and floating windows are shown from code, so you can call them from a click handler or a store action without placing a component in the template.

package/lib/accordion-section.d.cts

@@ -1,4 +1,4 @@
-import { LabelPreset } from './types/label-preset.cjs';
+import { LabelPreset } from './label-icon.cjs';
 export interface Props {
     /** trueの場合、開閉ボタンを無効にする */
     disabled?: boolean;

package/lib/accordion-section.d.ts

@@ -1,4 +1,4 @@
-import { LabelPreset } from './types/label-preset';
+import { LabelPreset } from './label-icon';
 export interface Props {
     /** trueの場合、開閉ボタンを無効にする */
     disabled?: boolean;

package/lib/components-BCJWnExf.cjs

@@ -0,0 +1 @@
+"use strict";const n=require("./warning-popper.vue_vue_type_style_index_0_lang-TYmLM_h9.cjs"),_=Object.freeze(Object.defineProperty({__proto__:null,AccordionFieldset:n._sfc_main$4,AccordionSection:n._sfc_main$5,CopyButton:n._sfc_main$1,DarkModeSelector:n._sfc_main$6,DataTable:n._sfc_main$7,HelpButton:n._sfc_main$8,HelpPopper:n._sfc_main$9,HourglassLoading:n._sfc_main$10,IntersectionLazyComponent:n._sfc_main$11,LabelButton:n._sfc_main$12,LabelIcon:n._sfc_main$13,ModalDialog:n._sfc_main$2,OverlayBox:n._sfc_main$14,PageSection:n._sfc_main$15,PageTitle:n._sfc_main$16,ScreenLoading:n._sfc_main$3,TabContent:n._sfc_main$17,TabGroup:n._sfc_main$18,WarningPopper:n._sfc_main$19},Symbol.toStringTag,{value:"Module"}));exports.components=_;

package/lib/{components-BuTJ1wX8.js → components-CDIhw5uP.js}

@@ -1,4 +1,4 @@
-import { f as a, h as s, a as n, i as _, j as o, k as e, l as c, m as i, o as t, p as m, q as f, b as r, d as l, s as $, t as p, e as d, u as b, v as g, w as u } from "./warning-popper.vue_vue_type_style_index_0_lang-BKV_FX6k.js";
+import { e as a, f as s, a as n, g as _, h as o, i as e, j as c, k as i, l as t, o as f, p as m, b as r, q as l, r as $, s as p, d, t as g, v as b, w as u } from "./warning-popper.vue_vue_type_style_index_0_lang-BJxLA6aU.js";
 const y = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
   AccordionFieldset: a,
@@ -10,15 +10,15 @@ const y = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   HelpPopper: c,
   HourglassLoading: i,
   IntersectionLazyComponent: t,
-  LabelButton: m,
-  LabelIcon: f,
+  LabelButton: f,
+  LabelIcon: m,
   ModalDialog: r,
   OverlayBox: l,
   PageSection: $,
   PageTitle: p,
   ScreenLoading: d,
-  TabContent: b,
-  TabGroup: g,
+  TabContent: g,
+  TabGroup: b,
   WarningPopper: u
 }, Symbol.toStringTag, { value: "Module" }));
 export {

package/lib/data-table.d.cts

@@ -1,14 +1,107 @@
-import { DataTableEmits, DataTableHeader, DataTableProps, DataTableSlots, DataTableSortContext } from './types/data-table.cjs';
+import { ClassValue, StyleValue } from 'vue';
+import { DataTableControlsPlacement, DataTableHeader, DataTableLabels, DataTableSortContext, DataTableSortMode } from './helpers/data-table.cjs';
+/**
+ * DataTable の props
+ */
+export interface Props<T = unknown> {
+    /** 表示している行のデータ。スロットで描画する行と同じ順に並んでいること */
+    dataList: T[];
+    /** ヘッダ。id は一意であること */
+    headers: DataTableHeader<T>[];
+    /** 読み込み中。true の間は行を描画せず読み込み中の表示を出す */
+    loading?: boolean;
+    /** 総件数。未指定なら dataList の件数 */
+    totalCount?: number;
+    /** 現在ページ(1起点) */
+    current?: number;
+    /** 1ページあたりの表示件数 */
+    limit?: number;
+    /** 1ページあたりの表示件数の上限 */
+    maxLimit?: number;
+    /** ページネーションに並べるページ番号の最大数 */
+    maxPagination?: number;
+    /** 行をクリックで選択できるか */
+    selectable?: boolean;
+    /** コントロールを出す位置 */
+    controls?: DataTableControlsPlacement;
+    /** ページネーションを出す位置。controls が無い側には出ない */
+    pagination?: DataTableControlsPlacement;
+    /** ページダウンロードボタンを表示するか */
+    showDownloadPage?: boolean;
+    /** 全件ダウンロードボタンを表示するか */
+    showDownloadAll?: boolean;
+    /** 総件数を表示するか */
+    showTotal?: boolean;
+    /** 1ページあたりの表示件数の入力を表示するか */
+    showLimit?: boolean;
+    /** ページネーションにページ番号の選択を表示するか */
+    showPageSelect?: boolean;
+    /** dataList が空のときにデータが無い旨の行を表示するか */
+    showNoData?: boolean;
+    /** ヘッダの境界のドラッグで列幅を変えられるか */
+    resizable?: boolean;
+    /** ヘッダのクリックでソートできるか */
+    sortable?: boolean;
+    /** ソートの方式。未指定なら remote */
+    sortMode?: DataTableSortMode;
+    /** テーブルをスクロールする領域に付ける class */
+    contentClass?: ClassValue;
+    /** テーブルをスクロールする領域に付ける style */
+    contentStyle?: StyleValue;
+    /** table に付ける class */
+    tableClass?: ClassValue;
+    /** table に付ける style */
+    tableStyle?: StyleValue;
+    /** 表示する文言。未指定の項目は英語 */
+    labels?: DataTableLabels;
+    /** 総件数の整形。未指定なら en-US の桁区切り。SSR とクライアントで同じ文字列を返すこと */
+    formatTotalCount?: (count: number) => string;
+}
+/**
+ * DataTable が発行するイベント
+ */
+export interface Emits<T = unknown> {
+    /** 選択が変わった。クリックでの選択・解除、カーソルキーでの移動、読み込み完了時の解除で発行する。解除は undefined と -1 */
+    (e: 'emit:selectRow', value: T | undefined, index: number): void;
+    /** ソートの条件が変わった。sortMode に関わらず発行する */
+    (e: 'emit:changeSort', context: DataTableSortContext): void;
+    (e: 'emit:updateHeader', headers: DataTableHeader<T>[]): void;
+    (e: 'emit:dblclickRow', value: T, index: number): void;
+    (e: 'emit:changeLimit', limit: number): void;
+    (e: 'emit:changePage', page: number): void;
+    (e: 'emit:downloadPage'): void;
+    (e: 'emit:downloadAll'): void;
+}
+/**
+ * DataTable のスロット
+ */
+export interface Slots<T = unknown> {
+    /** 行。tr を rows と同じ順に並べ、tr の click で clickRow(row, index) を呼ぶ */
+    default?(props: {
+        /** 表示する行。sortMode が page のときはソートした順、それ以外は dataList そのもの */
+        rows: T[];
+        /** 行を選択する。選択している行なら選択を解除する */
+        clickRow: (row: T, index: number) => void;
+        /** 行を選択してダブルクリックを通知する */
+        dblclickRow: (row: T, index: number) => void;
+        /** 行のインデックスから、ページをまたいだ1起点の行番号を返す */
+        rowNumber: (index: number) => number;
+        /** 選択している行のインデックス。選択していなければ -1 */
+        selectedIndex: number;
+    }): unknown;
+    /** 読み込み中の表示。未指定なら既定のスピナー */
+    loading?(): unknown;
+}
 declare const __VLS_export: <T>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
-    props: __VLS_PrettifyLocal<DataTableProps<T> & {
+    props: __VLS_PrettifyLocal<Props<T> & {
+        "onEmit:changePage"?: ((page: number) => any) | undefined;
+        "onEmit:changeLimit"?: ((limit: number) => any) | undefined;
+        "onEmit:downloadPage"?: (() => any) | undefined;
+        "onEmit:downloadAll"?: (() => any) | undefined;
         "onEmit:selectRow"?: ((value: T | undefined, index: number) => any) | undefined;
         "onEmit:changeSort"?: ((context: DataTableSortContext) => any) | undefined;
         "onEmit:updateHeader"?: ((headers: DataTableHeader<T>[]) => any) | undefined;
         "onEmit:dblclickRow"?: ((value: T, index: number) => any) | undefined;
-        "onEmit:changeLimit"?: ((limit: number) => any) | undefined;
-        "onEmit:changePage"?: ((page: number) => any) | undefined;
-        "onEmit:downloadPage"?: (() => any) | undefined;
-        "onEmit:downloadAll"?: (() => any) | undefined;
     }> & import('vue').PublicProps & (typeof globalThis extends {
         __VLS_PROPS_FALLBACK: infer P;
     } ? P : {});
@@ -17,8 +110,8 @@ declare const __VLS_export: <T>(__VLS_props: NonNullable<Awaited<typeof __VLS_se
         getSortContext: () => DataTableSortContext;
     }>) => void;
     attrs: any;
-    slots: DataTableSlots<T>;
-    emit: DataTableEmits<T>;
+    slots: Slots<T>;
+    emit: Emits<T>;
 }>) => import('vue').VNode & {
     __ctx?: Awaited<typeof __VLS_setup>;
 };

package/lib/data-table.d.ts

@@ -1,14 +1,107 @@
-import { DataTableEmits, DataTableHeader, DataTableProps, DataTableSlots, DataTableSortContext } from './types/data-table';
+import { ClassValue, StyleValue } from 'vue';
+import { DataTableControlsPlacement, DataTableHeader, DataTableLabels, DataTableSortContext, DataTableSortMode } from './helpers/data-table';
+/**
+ * DataTable の props
+ */
+export interface Props<T = unknown> {
+    /** 表示している行のデータ。スロットで描画する行と同じ順に並んでいること */
+    dataList: T[];
+    /** ヘッダ。id は一意であること */
+    headers: DataTableHeader<T>[];
+    /** 読み込み中。true の間は行を描画せず読み込み中の表示を出す */
+    loading?: boolean;
+    /** 総件数。未指定なら dataList の件数 */
+    totalCount?: number;
+    /** 現在ページ(1起点) */
+    current?: number;
+    /** 1ページあたりの表示件数 */
+    limit?: number;
+    /** 1ページあたりの表示件数の上限 */
+    maxLimit?: number;
+    /** ページネーションに並べるページ番号の最大数 */
+    maxPagination?: number;
+    /** 行をクリックで選択できるか */
+    selectable?: boolean;
+    /** コントロールを出す位置 */
+    controls?: DataTableControlsPlacement;
+    /** ページネーションを出す位置。controls が無い側には出ない */
+    pagination?: DataTableControlsPlacement;
+    /** ページダウンロードボタンを表示するか */
+    showDownloadPage?: boolean;
+    /** 全件ダウンロードボタンを表示するか */
+    showDownloadAll?: boolean;
+    /** 総件数を表示するか */
+    showTotal?: boolean;
+    /** 1ページあたりの表示件数の入力を表示するか */
+    showLimit?: boolean;
+    /** ページネーションにページ番号の選択を表示するか */
+    showPageSelect?: boolean;
+    /** dataList が空のときにデータが無い旨の行を表示するか */
+    showNoData?: boolean;
+    /** ヘッダの境界のドラッグで列幅を変えられるか */
+    resizable?: boolean;
+    /** ヘッダのクリックでソートできるか */
+    sortable?: boolean;
+    /** ソートの方式。未指定なら remote */
+    sortMode?: DataTableSortMode;
+    /** テーブルをスクロールする領域に付ける class */
+    contentClass?: ClassValue;
+    /** テーブルをスクロールする領域に付ける style */
+    contentStyle?: StyleValue;
+    /** table に付ける class */
+    tableClass?: ClassValue;
+    /** table に付ける style */
+    tableStyle?: StyleValue;
+    /** 表示する文言。未指定の項目は英語 */
+    labels?: DataTableLabels;
+    /** 総件数の整形。未指定なら en-US の桁区切り。SSR とクライアントで同じ文字列を返すこと */
+    formatTotalCount?: (count: number) => string;
+}
+/**
+ * DataTable が発行するイベント
+ */
+export interface Emits<T = unknown> {
+    /** 選択が変わった。クリックでの選択・解除、カーソルキーでの移動、読み込み完了時の解除で発行する。解除は undefined と -1 */
+    (e: 'emit:selectRow', value: T | undefined, index: number): void;
+    /** ソートの条件が変わった。sortMode に関わらず発行する */
+    (e: 'emit:changeSort', context: DataTableSortContext): void;
+    (e: 'emit:updateHeader', headers: DataTableHeader<T>[]): void;
+    (e: 'emit:dblclickRow', value: T, index: number): void;
+    (e: 'emit:changeLimit', limit: number): void;
+    (e: 'emit:changePage', page: number): void;
+    (e: 'emit:downloadPage'): void;
+    (e: 'emit:downloadAll'): void;
+}
+/**
+ * DataTable のスロット
+ */
+export interface Slots<T = unknown> {
+    /** 行。tr を rows と同じ順に並べ、tr の click で clickRow(row, index) を呼ぶ */
+    default?(props: {
+        /** 表示する行。sortMode が page のときはソートした順、それ以外は dataList そのもの */
+        rows: T[];
+        /** 行を選択する。選択している行なら選択を解除する */
+        clickRow: (row: T, index: number) => void;
+        /** 行を選択してダブルクリックを通知する */
+        dblclickRow: (row: T, index: number) => void;
+        /** 行のインデックスから、ページをまたいだ1起点の行番号を返す */
+        rowNumber: (index: number) => number;
+        /** 選択している行のインデックス。選択していなければ -1 */
+        selectedIndex: number;
+    }): unknown;
+    /** 読み込み中の表示。未指定なら既定のスピナー */
+    loading?(): unknown;
+}
 declare const __VLS_export: <T>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
-    props: __VLS_PrettifyLocal<DataTableProps<T> & {
+    props: __VLS_PrettifyLocal<Props<T> & {
+        "onEmit:changePage"?: ((page: number) => any) | undefined;
+        "onEmit:changeLimit"?: ((limit: number) => any) | undefined;
+        "onEmit:downloadPage"?: (() => any) | undefined;
+        "onEmit:downloadAll"?: (() => any) | undefined;
         "onEmit:selectRow"?: ((value: T | undefined, index: number) => any) | undefined;
         "onEmit:changeSort"?: ((context: DataTableSortContext) => any) | undefined;
         "onEmit:updateHeader"?: ((headers: DataTableHeader<T>[]) => any) | undefined;
         "onEmit:dblclickRow"?: ((value: T, index: number) => any) | undefined;
-        "onEmit:changeLimit"?: ((limit: number) => any) | undefined;
-        "onEmit:changePage"?: ((page: number) => any) | undefined;
-        "onEmit:downloadPage"?: (() => any) | undefined;
-        "onEmit:downloadAll"?: (() => any) | undefined;
     }> & import('vue').PublicProps & (typeof globalThis extends {
         __VLS_PROPS_FALLBACK: infer P;
     } ? P : {});
@@ -17,8 +110,8 @@ declare const __VLS_export: <T>(__VLS_props: NonNullable<Awaited<typeof __VLS_se
         getSortContext: () => DataTableSortContext;
     }>) => void;
     attrs: any;
-    slots: DataTableSlots<T>;
-    emit: DataTableEmits<T>;
+    slots: Slots<T>;
+    emit: Emits<T>;
 }>) => import('vue').VNode & {
     __ctx?: Awaited<typeof __VLS_setup>;
 };

package/lib/{types → helpers}/data-table.d.cts

@@ -1,4 +1,3 @@
-import { ClassValue, StyleValue } from 'vue';
 /** 列の値の型。ソートの比較方法を決める */
 export type DataTableValueType = 'boolean' | 'string' | 'number' | 'object';
 /** ソートの方式。page は表示中の行を並べ替えて表示し、remote はソート条件を通知するだけで利用側が再取得する */
@@ -82,98 +81,6 @@ export interface DataTableLabels {
 }
 /** 関数を評価した後の文言 */
 export type DataTableResolvedLabels = Record<keyof DataTableLabels, string>;
-/**
- * DataTable の props
- */
-export interface DataTableProps<T = unknown> {
-    /** 表示している行のデータ。スロットで描画する行と同じ順に並んでいること */
-    dataList: T[];
-    /** ヘッダ。id は一意であること */
-    headers: DataTableHeader<T>[];
-    /** 読み込み中。true の間は行を描画せず読み込み中の表示を出す */
-    loading?: boolean;
-    /** 総件数。未指定なら dataList の件数 */
-    totalCount?: number;
-    /** 現在ページ(1起点) */
-    current?: number;
-    /** 1ページあたりの表示件数 */
-    limit?: number;
-    /** 1ページあたりの表示件数の上限 */
-    maxLimit?: number;
-    /** ページネーションに並べるページ番号の最大数 */
-    maxPagination?: number;
-    /** 行をクリックで選択できるか */
-    selectable?: boolean;
-    /** コントロールを出す位置 */
-    controls?: DataTableControlsPlacement;
-    /** ページネーションを出す位置。controls が無い側には出ない */
-    pagination?: DataTableControlsPlacement;
-    /** ページダウンロードボタンを表示するか */
-    showDownloadPage?: boolean;
-    /** 全件ダウンロードボタンを表示するか */
-    showDownloadAll?: boolean;
-    /** 総件数を表示するか */
-    showTotal?: boolean;
-    /** 1ページあたりの表示件数の入力を表示するか */
-    showLimit?: boolean;
-    /** ページネーションにページ番号の選択を表示するか */
-    showPageSelect?: boolean;
-    /** dataList が空のときにデータが無い旨の行を表示するか */
-    showNoData?: boolean;
-    /** ヘッダの境界のドラッグで列幅を変えられるか */
-    resizable?: boolean;
-    /** ヘッダのクリックでソートできるか */
-    sortable?: boolean;
-    /** ソートの方式。未指定なら remote */
-    sortMode?: DataTableSortMode;
-    /** テーブルをスクロールする領域に付ける class */
-    contentClass?: ClassValue;
-    /** テーブルをスクロールする領域に付ける style */
-    contentStyle?: StyleValue;
-    /** table に付ける class */
-    tableClass?: ClassValue;
-    /** table に付ける style */
-    tableStyle?: StyleValue;
-    /** 表示する文言。未指定の項目は英語 */
-    labels?: DataTableLabels;
-    /** 総件数の整形。未指定なら en-US の桁区切り。SSR とクライアントで同じ文字列を返すこと */
-    formatTotalCount?: (count: number) => string;
-}
-/**
- * DataTable が発行するイベント
- */
-export interface DataTableEmits<T = unknown> {
-    /** 選択が変わった。クリックでの選択・解除、カーソルキーでの移動、読み込み完了時の解除で発行する。解除は undefined と -1 */
-    (e: 'emit:selectRow', value: T | undefined, index: number): void;
-    /** ソートの条件が変わった。sortMode に関わらず発行する */
-    (e: 'emit:changeSort', context: DataTableSortContext): void;
-    (e: 'emit:updateHeader', headers: DataTableHeader<T>[]): void;
-    (e: 'emit:dblclickRow', value: T, index: number): void;
-    (e: 'emit:changeLimit', limit: number): void;
-    (e: 'emit:changePage', page: number): void;
-    (e: 'emit:downloadPage'): void;
-    (e: 'emit:downloadAll'): void;
-}
-/**
- * DataTable のスロット
- */
-export interface DataTableSlots<T = unknown> {
-    /** 行。tr を rows と同じ順に並べ、tr の click で clickRow(row, index) を呼ぶ */
-    default?(props: {
-        /** 表示する行。sortMode が page のときはソートした順、それ以外は dataList そのもの */
-        rows: T[];
-        /** 行を選択する。選択している行なら選択を解除する */
-        clickRow: (row: T, index: number) => void;
-        /** 行を選択してダブルクリックを通知する */
-        dblclickRow: (row: T, index: number) => void;
-        /** 行のインデックスから、ページをまたいだ1起点の行番号を返す */
-        rowNumber: (index: number) => number;
-        /** 選択している行のインデックス。選択していなければ -1 */
-        selectedIndex: number;
-    }): unknown;
-    /** 読み込み中の表示。未指定なら既定のスピナー */
-    loading?(): unknown;
-}
 /**
  * ソートの状態
  */
@@ -183,3 +90,50 @@ export interface DataTableSortContext {
     /** 降順なら true */
     descending: boolean;
 }
+/**
+ * ドット区切りのパスで入れ子の値を取り出す。途中が null なら undefined
+ *
+ * @param {unknown} obj
+ * @param {string} path 'a.b.c' の形。'a[0].b' は 'a.0.b' と同じ
+ * @returns {unknown}
+ */
+export declare const getValueByPath: (obj: unknown, path: string) => unknown;
+/**
+ * 文字列または文字列を返す関数から文字列を得る
+ *
+ * @param {string | (() => string)} label
+ * @returns {string}
+ */
+export declare const resolveLabel: (label: string | (() => string) | undefined) => string;
+/**
+ * 型に応じて2つの値を比較する。null / undefined は最小として扱う
+ *
+ * @param {unknown} a
+ * @param {unknown} b
+ * @param {DataTableValueType} type
+ * @returns {number} a が前なら負の数、後ろなら正の数、等しければ 0
+ */
+export declare const compareValues: (a: unknown, b: unknown, type: DataTableValueType) => number;
+/**
+ * 行の同一性の判定に使う文字列にする。bigint は文字列にし、循環参照は空文字にする
+ *
+ * @param {unknown} value
+ * @returns {string}
+ */
+export declare const stringifyValue: (value: unknown) => string;
+/**
+ * ヘッダの csv の定義から CSV の列名を作る
+ *
+ * @param {DataTableHeader<T>[]} headers
+ * @returns {string[]} 列名
+ */
+export declare const headersToCsvColumns: <T>(headers: DataTableHeader<T>[]) => string[];
+/**
+ * ヘッダの csv の定義に従って行から CSV の列の値を取り出す
+ *
+ * @param {DataTableHeader<T>[]} headers
+ * @param {T} row
+ * @param {number} [rowNumber] key が '$index' の列に出力する行番号
+ * @returns {unknown[]} 列の値。文字列化はしない
+ */
+export declare const rowToCsvColumns: <T>(headers: DataTableHeader<T>[], row: T, rowNumber?: number) => unknown[];

package/lib/{types → helpers}/data-table.d.ts

@@ -1,4 +1,3 @@
-import { ClassValue, StyleValue } from 'vue';
 /** 列の値の型。ソートの比較方法を決める */
 export type DataTableValueType = 'boolean' | 'string' | 'number' | 'object';
 /** ソートの方式。page は表示中の行を並べ替えて表示し、remote はソート条件を通知するだけで利用側が再取得する */
@@ -82,98 +81,6 @@ export interface DataTableLabels {
 }
 /** 関数を評価した後の文言 */
 export type DataTableResolvedLabels = Record<keyof DataTableLabels, string>;
-/**
- * DataTable の props
- */
-export interface DataTableProps<T = unknown> {
-    /** 表示している行のデータ。スロットで描画する行と同じ順に並んでいること */
-    dataList: T[];
-    /** ヘッダ。id は一意であること */
-    headers: DataTableHeader<T>[];
-    /** 読み込み中。true の間は行を描画せず読み込み中の表示を出す */
-    loading?: boolean;
-    /** 総件数。未指定なら dataList の件数 */
-    totalCount?: number;
-    /** 現在ページ(1起点) */
-    current?: number;
-    /** 1ページあたりの表示件数 */
-    limit?: number;
-    /** 1ページあたりの表示件数の上限 */
-    maxLimit?: number;
-    /** ページネーションに並べるページ番号の最大数 */
-    maxPagination?: number;
-    /** 行をクリックで選択できるか */
-    selectable?: boolean;
-    /** コントロールを出す位置 */
-    controls?: DataTableControlsPlacement;
-    /** ページネーションを出す位置。controls が無い側には出ない */
-    pagination?: DataTableControlsPlacement;
-    /** ページダウンロードボタンを表示するか */
-    showDownloadPage?: boolean;
-    /** 全件ダウンロードボタンを表示するか */
-    showDownloadAll?: boolean;
-    /** 総件数を表示するか */
-    showTotal?: boolean;
-    /** 1ページあたりの表示件数の入力を表示するか */
-    showLimit?: boolean;
-    /** ページネーションにページ番号の選択を表示するか */
-    showPageSelect?: boolean;
-    /** dataList が空のときにデータが無い旨の行を表示するか */
-    showNoData?: boolean;
-    /** ヘッダの境界のドラッグで列幅を変えられるか */
-    resizable?: boolean;
-    /** ヘッダのクリックでソートできるか */
-    sortable?: boolean;
-    /** ソートの方式。未指定なら remote */
-    sortMode?: DataTableSortMode;
-    /** テーブルをスクロールする領域に付ける class */
-    contentClass?: ClassValue;
-    /** テーブルをスクロールする領域に付ける style */
-    contentStyle?: StyleValue;
-    /** table に付ける class */
-    tableClass?: ClassValue;
-    /** table に付ける style */
-    tableStyle?: StyleValue;
-    /** 表示する文言。未指定の項目は英語 */
-    labels?: DataTableLabels;
-    /** 総件数の整形。未指定なら en-US の桁区切り。SSR とクライアントで同じ文字列を返すこと */
-    formatTotalCount?: (count: number) => string;
-}
-/**
- * DataTable が発行するイベント
- */
-export interface DataTableEmits<T = unknown> {
-    /** 選択が変わった。クリックでの選択・解除、カーソルキーでの移動、読み込み完了時の解除で発行する。解除は undefined と -1 */
-    (e: 'emit:selectRow', value: T | undefined, index: number): void;
-    /** ソートの条件が変わった。sortMode に関わらず発行する */
-    (e: 'emit:changeSort', context: DataTableSortContext): void;
-    (e: 'emit:updateHeader', headers: DataTableHeader<T>[]): void;
-    (e: 'emit:dblclickRow', value: T, index: number): void;
-    (e: 'emit:changeLimit', limit: number): void;
-    (e: 'emit:changePage', page: number): void;
-    (e: 'emit:downloadPage'): void;
-    (e: 'emit:downloadAll'): void;
-}
-/**
- * DataTable のスロット
- */
-export interface DataTableSlots<T = unknown> {
-    /** 行。tr を rows と同じ順に並べ、tr の click で clickRow(row, index) を呼ぶ */
-    default?(props: {
-        /** 表示する行。sortMode が page のときはソートした順、それ以外は dataList そのもの */
-        rows: T[];
-        /** 行を選択する。選択している行なら選択を解除する */
-        clickRow: (row: T, index: number) => void;
-        /** 行を選択してダブルクリックを通知する */
-        dblclickRow: (row: T, index: number) => void;
-        /** 行のインデックスから、ページをまたいだ1起点の行番号を返す */
-        rowNumber: (index: number) => number;
-        /** 選択している行のインデックス。選択していなければ -1 */
-        selectedIndex: number;
-    }): unknown;
-    /** 読み込み中の表示。未指定なら既定のスピナー */
-    loading?(): unknown;
-}
 /**
  * ソートの状態
  */
@@ -183,3 +90,50 @@ export interface DataTableSortContext {
     /** 降順なら true */
     descending: boolean;
 }
+/**
+ * ドット区切りのパスで入れ子の値を取り出す。途中が null なら undefined
+ *
+ * @param {unknown} obj
+ * @param {string} path 'a.b.c' の形。'a[0].b' は 'a.0.b' と同じ
+ * @returns {unknown}
+ */
+export declare const getValueByPath: (obj: unknown, path: string) => unknown;
+/**
+ * 文字列または文字列を返す関数から文字列を得る
+ *
+ * @param {string | (() => string)} label
+ * @returns {string}
+ */
+export declare const resolveLabel: (label: string | (() => string) | undefined) => string;
+/**
+ * 型に応じて2つの値を比較する。null / undefined は最小として扱う
+ *
+ * @param {unknown} a
+ * @param {unknown} b
+ * @param {DataTableValueType} type
+ * @returns {number} a が前なら負の数、後ろなら正の数、等しければ 0
+ */
+export declare const compareValues: (a: unknown, b: unknown, type: DataTableValueType) => number;
+/**
+ * 行の同一性の判定に使う文字列にする。bigint は文字列にし、循環参照は空文字にする
+ *
+ * @param {unknown} value
+ * @returns {string}
+ */
+export declare const stringifyValue: (value: unknown) => string;
+/**
+ * ヘッダの csv の定義から CSV の列名を作る
+ *
+ * @param {DataTableHeader<T>[]} headers
+ * @returns {string[]} 列名
+ */
+export declare const headersToCsvColumns: <T>(headers: DataTableHeader<T>[]) => string[];
+/**
+ * ヘッダの csv の定義に従って行から CSV の列の値を取り出す
+ *
+ * @param {DataTableHeader<T>[]} headers
+ * @param {T} row
+ * @param {number} [rowNumber] key が '$index' の列に出力する行番号
+ * @returns {unknown[]} 列の値。文字列化はしない
+ */
+export declare const rowToCsvColumns: <T>(headers: DataTableHeader<T>[], row: T, rowNumber?: number) => unknown[];

package/lib/helpers/{show-floating-component.d.cts → floating-component.d.cts}

@@ -1,5 +1,5 @@
 import { AppContext, ClassValue, Component, StyleValue } from 'vue';
-import { MovableWindowContentProps, MovableWindowDragMode, MovableWindowHandle } from '../types/movable-window.cjs';
+import { MovableWindowContentProps, MovableWindowDragMode, MovableWindowHandle } from '../internal/window-control.cjs';
 /** showFloatingComponent が中身のコンポーネントに props として渡す関数 */
 export type FloatingComponentContentProps = MovableWindowContentProps;
 /** showFloatingComponent / showFloatingMessage が返す、表示中のウィンドウを操作するためのハンドル */

package/lib/helpers/{show-floating-component.d.ts → floating-component.d.ts}

@@ -1,5 +1,5 @@
 import { AppContext, ClassValue, Component, StyleValue } from 'vue';
-import { MovableWindowContentProps, MovableWindowDragMode, MovableWindowHandle } from '../types/movable-window';
+import { MovableWindowContentProps, MovableWindowDragMode, MovableWindowHandle } from '../internal/window-control';
 /** showFloatingComponent が中身のコンポーネントに props として渡す関数 */
 export type FloatingComponentContentProps = MovableWindowContentProps;
 /** showFloatingComponent / showFloatingMessage が返す、表示中のウィンドウを操作するためのハンドル */