@stonecrop/atable 0.2.63 → 0.2.64

package/dist/index.js

@@ -1,16 +1,19 @@
+import { createPinia } from 'pinia';
 import ACell from '@/components/ACell.vue';
 import AExpansionRow from '@/components/AExpansionRow.vue';
 import ARow from '@/components/ARow.vue';
 import ATable from '@/components/ATable.vue';
 import ATableHeader from '@/components/ATableHeader.vue';
 import ATableModal from '@/components/ATableModal.vue';
-import TableDataStore from './components';
+export { createTableStore } from '@/stores/table';
 /**
  * Install all ATable components
  * @param app - Vue app instance
  * @public
  */
 function install(app /* options */) {
+    const pinia = createPinia();
+    app.use(pinia);
     app.component('ACell', ACell);
     app.component('AExpansionRow', AExpansionRow);
     app.component('ARow', ARow);
@@ -18,4 +21,4 @@ function install(app /* options */) {
     app.component('ATableHeader', ATableHeader);
     app.component('ATableModal', ATableModal);
 }
-export { install, ACell, AExpansionRow, ARow, ATable, ATableHeader, ATableModal, TableDataStore };
+export { install, ACell, AExpansionRow, ARow, ATable, ATableHeader, ATableModal };

package/dist/src/index.d.ts

@@ -5,7 +5,7 @@ import ARow from '@/components/ARow.vue';
 import ATable from '@/components/ATable.vue';
 import ATableHeader from '@/components/ATableHeader.vue';
 import ATableModal from '@/components/ATableModal.vue';
-import TableDataStore from './components';
+export { createTableStore } from '@/stores/table';
 export type { CellContext, TableColumn, TableConfig, TableDisplay, TableRow, TableModal } from '@/types';
 /**
  * Install all ATable components
@@ -13,5 +13,5 @@ export type { CellContext, TableColumn, TableConfig, TableDisplay, TableRow, Tab
  * @public
  */
 declare function install(app: App): void;
-export { install, ACell, AExpansionRow, ARow, ATable, ATableHeader, ATableModal, TableDataStore };
+export { install, ACell, AExpansionRow, ARow, ATable, ATableHeader, ATableModal };
 //# sourceMappingURL=index.d.ts.map

package/dist/src/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAEzB,OAAO,KAAK,MAAM,wBAAwB,CAAA;AAC1C,OAAO,aAAa,MAAM,gCAAgC,CAAA;AAC1D,OAAO,IAAI,MAAM,uBAAuB,CAAA;AACxC,OAAO,MAAM,MAAM,yBAAyB,CAAA;AAC5C,OAAO,YAAY,MAAM,+BAA+B,CAAA;AACxD,OAAO,WAAW,MAAM,8BAA8B,CAAA;AACtD,OAAO,cAAc,MAAM,cAAc,CAAA;AACzC,YAAY,EAAE,WAAW,EAAE,WAAW,EAAE,WAAW,EAAE,YAAY,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA;AAExG;;;;GAIG;AACH,iBAAS,OAAO,CAAC,GAAG,EAAE,GAAG,QAOxB;AAED,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,IAAI,EAAE,MAAM,EAAE,YAAY,EAAE,WAAW,EAAE,cAAc,EAAE,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAEzB,OAAO,KAAK,MAAM,wBAAwB,CAAA;AAC1C,OAAO,aAAa,MAAM,gCAAgC,CAAA;AAC1D,OAAO,IAAI,MAAM,uBAAuB,CAAA;AACxC,OAAO,MAAM,MAAM,yBAAyB,CAAA;AAC5C,OAAO,YAAY,MAAM,+BAA+B,CAAA;AACxD,OAAO,WAAW,MAAM,8BAA8B,CAAA;AACtD,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAA;AACjD,YAAY,EAAE,WAAW,EAAE,WAAW,EAAE,WAAW,EAAE,YAAY,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA;AAExG;;;;GAIG;AACH,iBAAS,OAAO,CAAC,GAAG,EAAE,GAAG,QAUxB;AAED,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,IAAI,EAAE,MAAM,EAAE,YAAY,EAAE,WAAW,EAAE,CAAA"}

package/dist/src/stores/table.d.ts

@@ -0,0 +1,320 @@
+import { type CSSProperties } from 'vue';
+import type { CellContext, TableColumn, TableConfig, TableDisplay, TableModal, TableRow } from '@/types';
+export declare const createTableStore: (initData: {
+    columns: TableColumn[];
+    rows: TableRow[];
+    id?: string;
+    config?: TableConfig;
+    table?: {
+        [key: string]: any;
+    };
+    display?: TableDisplay[];
+    modal?: TableModal;
+}) => import("pinia").Store<`table-${string}`, Pick<{
+    columns: import("vue").Ref<{
+        name: string;
+        align?: CanvasTextAlign;
+        edit?: boolean;
+        label?: string;
+        type?: string;
+        width?: string;
+        pinned?: boolean;
+        cellComponent?: string;
+        cellComponentProps?: Record<string, any>;
+        modalComponent?: string | ((context?: CellContext) => string);
+        modalComponentExtraProps?: Record<string, any>;
+        format?: string | ((value: any, context?: CellContext) => string);
+        mask?: (value: any) => any;
+    }[], TableColumn[] | {
+        name: string;
+        align?: CanvasTextAlign;
+        edit?: boolean;
+        label?: string;
+        type?: string;
+        width?: string;
+        pinned?: boolean;
+        cellComponent?: string;
+        cellComponentProps?: Record<string, any>;
+        modalComponent?: string | ((context?: CellContext) => string);
+        modalComponentExtraProps?: Record<string, any>;
+        format?: string | ((value: any, context?: CellContext) => string);
+        mask?: (value: any) => any;
+    }[]>;
+    rows: import("vue").Ref<{
+        [x: string]: any;
+        indent?: number;
+        parent?: number;
+    }[], TableRow[] | {
+        [x: string]: any;
+        indent?: number;
+        parent?: number;
+    }[]>;
+    config: import("vue").Ref<{
+        view?: "uncounted" | "list" | "list-expansion" | "tree";
+        fullWidth?: boolean;
+    }, TableConfig | {
+        view?: "uncounted" | "list" | "list-expansion" | "tree";
+        fullWidth?: boolean;
+    }>;
+    table: import("vue").Ref<{}, {}>;
+    display: import("vue").Ref<{
+        childrenOpen?: boolean;
+        expanded?: boolean;
+        indent?: number;
+        isParent?: boolean;
+        isRoot?: boolean;
+        open?: boolean;
+        parent?: number;
+        rowModified?: boolean;
+    }[], TableDisplay[] | {
+        childrenOpen?: boolean;
+        expanded?: boolean;
+        indent?: number;
+        isParent?: boolean;
+        isRoot?: boolean;
+        open?: boolean;
+        parent?: number;
+        rowModified?: boolean;
+    }[]>;
+    modal: import("vue").Ref<{
+        colIndex?: number;
+        event?: string;
+        left?: number;
+        parent?: HTMLElement;
+        rowIndex?: number;
+        top?: number;
+        visible?: boolean;
+        width?: string;
+        component?: string;
+        componentProps?: Record<string, any>;
+    }, TableModal | {
+        colIndex?: number;
+        event?: string;
+        left?: number;
+        parent?: HTMLElement;
+        rowIndex?: number;
+        top?: number;
+        visible?: boolean;
+        width?: string;
+        component?: string;
+        componentProps?: Record<string, any>;
+    }>;
+    hasPinnedColumns: import("vue").ComputedRef<boolean>;
+    numberedRowWidth: import("vue").ComputedRef<string>;
+    zeroColumn: import("vue").ComputedRef<boolean>;
+    closeModal: (event: MouseEvent) => void;
+    getCellData: <T = any>(colIndex: number, rowIndex: number) => T;
+    getCellDisplayValue: (colIndex: number, rowIndex: number) => any;
+    getFormattedValue: (colIndex: number, rowIndex: number, value: any) => any;
+    getHeaderCellStyle: (column: TableColumn) => CSSProperties;
+    getIndent: (colIndex: number, indentLevel?: number) => string;
+    getRowExpandSymbol: (rowIndex: number) => "" | "-" | "+";
+    isRowVisible: (rowIndex: number) => boolean;
+    setCellData: (colIndex: number, rowIndex: number, value: any) => void;
+    toggleRowExpand: (rowIndex: number) => void;
+}, "columns" | "rows" | "config" | "table" | "display" | "modal">, Pick<{
+    columns: import("vue").Ref<{
+        name: string;
+        align?: CanvasTextAlign;
+        edit?: boolean;
+        label?: string;
+        type?: string;
+        width?: string;
+        pinned?: boolean;
+        cellComponent?: string;
+        cellComponentProps?: Record<string, any>;
+        modalComponent?: string | ((context?: CellContext) => string);
+        modalComponentExtraProps?: Record<string, any>;
+        format?: string | ((value: any, context?: CellContext) => string);
+        mask?: (value: any) => any;
+    }[], TableColumn[] | {
+        name: string;
+        align?: CanvasTextAlign;
+        edit?: boolean;
+        label?: string;
+        type?: string;
+        width?: string;
+        pinned?: boolean;
+        cellComponent?: string;
+        cellComponentProps?: Record<string, any>;
+        modalComponent?: string | ((context?: CellContext) => string);
+        modalComponentExtraProps?: Record<string, any>;
+        format?: string | ((value: any, context?: CellContext) => string);
+        mask?: (value: any) => any;
+    }[]>;
+    rows: import("vue").Ref<{
+        [x: string]: any;
+        indent?: number;
+        parent?: number;
+    }[], TableRow[] | {
+        [x: string]: any;
+        indent?: number;
+        parent?: number;
+    }[]>;
+    config: import("vue").Ref<{
+        view?: "uncounted" | "list" | "list-expansion" | "tree";
+        fullWidth?: boolean;
+    }, TableConfig | {
+        view?: "uncounted" | "list" | "list-expansion" | "tree";
+        fullWidth?: boolean;
+    }>;
+    table: import("vue").Ref<{}, {}>;
+    display: import("vue").Ref<{
+        childrenOpen?: boolean;
+        expanded?: boolean;
+        indent?: number;
+        isParent?: boolean;
+        isRoot?: boolean;
+        open?: boolean;
+        parent?: number;
+        rowModified?: boolean;
+    }[], TableDisplay[] | {
+        childrenOpen?: boolean;
+        expanded?: boolean;
+        indent?: number;
+        isParent?: boolean;
+        isRoot?: boolean;
+        open?: boolean;
+        parent?: number;
+        rowModified?: boolean;
+    }[]>;
+    modal: import("vue").Ref<{
+        colIndex?: number;
+        event?: string;
+        left?: number;
+        parent?: HTMLElement;
+        rowIndex?: number;
+        top?: number;
+        visible?: boolean;
+        width?: string;
+        component?: string;
+        componentProps?: Record<string, any>;
+    }, TableModal | {
+        colIndex?: number;
+        event?: string;
+        left?: number;
+        parent?: HTMLElement;
+        rowIndex?: number;
+        top?: number;
+        visible?: boolean;
+        width?: string;
+        component?: string;
+        componentProps?: Record<string, any>;
+    }>;
+    hasPinnedColumns: import("vue").ComputedRef<boolean>;
+    numberedRowWidth: import("vue").ComputedRef<string>;
+    zeroColumn: import("vue").ComputedRef<boolean>;
+    closeModal: (event: MouseEvent) => void;
+    getCellData: <T = any>(colIndex: number, rowIndex: number) => T;
+    getCellDisplayValue: (colIndex: number, rowIndex: number) => any;
+    getFormattedValue: (colIndex: number, rowIndex: number, value: any) => any;
+    getHeaderCellStyle: (column: TableColumn) => CSSProperties;
+    getIndent: (colIndex: number, indentLevel?: number) => string;
+    getRowExpandSymbol: (rowIndex: number) => "" | "-" | "+";
+    isRowVisible: (rowIndex: number) => boolean;
+    setCellData: (colIndex: number, rowIndex: number, value: any) => void;
+    toggleRowExpand: (rowIndex: number) => void;
+}, "hasPinnedColumns" | "numberedRowWidth" | "zeroColumn">, Pick<{
+    columns: import("vue").Ref<{
+        name: string;
+        align?: CanvasTextAlign;
+        edit?: boolean;
+        label?: string;
+        type?: string;
+        width?: string;
+        pinned?: boolean;
+        cellComponent?: string;
+        cellComponentProps?: Record<string, any>;
+        modalComponent?: string | ((context?: CellContext) => string);
+        modalComponentExtraProps?: Record<string, any>;
+        format?: string | ((value: any, context?: CellContext) => string);
+        mask?: (value: any) => any;
+    }[], TableColumn[] | {
+        name: string;
+        align?: CanvasTextAlign;
+        edit?: boolean;
+        label?: string;
+        type?: string;
+        width?: string;
+        pinned?: boolean;
+        cellComponent?: string;
+        cellComponentProps?: Record<string, any>;
+        modalComponent?: string | ((context?: CellContext) => string);
+        modalComponentExtraProps?: Record<string, any>;
+        format?: string | ((value: any, context?: CellContext) => string);
+        mask?: (value: any) => any;
+    }[]>;
+    rows: import("vue").Ref<{
+        [x: string]: any;
+        indent?: number;
+        parent?: number;
+    }[], TableRow[] | {
+        [x: string]: any;
+        indent?: number;
+        parent?: number;
+    }[]>;
+    config: import("vue").Ref<{
+        view?: "uncounted" | "list" | "list-expansion" | "tree";
+        fullWidth?: boolean;
+    }, TableConfig | {
+        view?: "uncounted" | "list" | "list-expansion" | "tree";
+        fullWidth?: boolean;
+    }>;
+    table: import("vue").Ref<{}, {}>;
+    display: import("vue").Ref<{
+        childrenOpen?: boolean;
+        expanded?: boolean;
+        indent?: number;
+        isParent?: boolean;
+        isRoot?: boolean;
+        open?: boolean;
+        parent?: number;
+        rowModified?: boolean;
+    }[], TableDisplay[] | {
+        childrenOpen?: boolean;
+        expanded?: boolean;
+        indent?: number;
+        isParent?: boolean;
+        isRoot?: boolean;
+        open?: boolean;
+        parent?: number;
+        rowModified?: boolean;
+    }[]>;
+    modal: import("vue").Ref<{
+        colIndex?: number;
+        event?: string;
+        left?: number;
+        parent?: HTMLElement;
+        rowIndex?: number;
+        top?: number;
+        visible?: boolean;
+        width?: string;
+        component?: string;
+        componentProps?: Record<string, any>;
+    }, TableModal | {
+        colIndex?: number;
+        event?: string;
+        left?: number;
+        parent?: HTMLElement;
+        rowIndex?: number;
+        top?: number;
+        visible?: boolean;
+        width?: string;
+        component?: string;
+        componentProps?: Record<string, any>;
+    }>;
+    hasPinnedColumns: import("vue").ComputedRef<boolean>;
+    numberedRowWidth: import("vue").ComputedRef<string>;
+    zeroColumn: import("vue").ComputedRef<boolean>;
+    closeModal: (event: MouseEvent) => void;
+    getCellData: <T = any>(colIndex: number, rowIndex: number) => T;
+    getCellDisplayValue: (colIndex: number, rowIndex: number) => any;
+    getFormattedValue: (colIndex: number, rowIndex: number, value: any) => any;
+    getHeaderCellStyle: (column: TableColumn) => CSSProperties;
+    getIndent: (colIndex: number, indentLevel?: number) => string;
+    getRowExpandSymbol: (rowIndex: number) => "" | "-" | "+";
+    isRowVisible: (rowIndex: number) => boolean;
+    setCellData: (colIndex: number, rowIndex: number, value: any) => void;
+    toggleRowExpand: (rowIndex: number) => void;
+}, "closeModal" | "getCellData" | "getCellDisplayValue" | "getFormattedValue" | "getHeaderCellStyle" | "getIndent" | "getRowExpandSymbol" | "isRowVisible" | "setCellData" | "toggleRowExpand">>;
+//# sourceMappingURL=table.d.ts.map

package/dist/src/stores/table.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"table.d.ts","sourceRoot":"","sources":["../../../src/stores/table.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,aAAa,EAAiB,MAAM,KAAK,CAAA;AAEvD,OAAO,KAAK,EAAE,WAAW,EAAE,WAAW,EAAE,WAAW,EAAE,YAAY,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;AAExG,eAAO,MAAM,gBAAgB,aAAc;IAC1C,OAAO,EAAE,WAAW,EAAE,CAAA;IACtB,IAAI,EAAE,QAAQ,EAAE,CAAA;IAChB,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,MAAM,CAAC,EAAE,WAAW,CAAA;IACpB,KAAK,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAE,CAAA;IAC9B,OAAO,CAAC,EAAE,YAAY,EAAE,CAAA;IACxB,KAAK,CAAC,EAAE,UAAU,CAAA;CAClB;;;;;;;;;;;2CAPO,CAAC;;+CAKM,CAAC;;;;;;;;;;;;2CALR,CAAC;;+CAKM,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;wBAqJa,UAAU;kBA7EhB,CAAC,kBAAkB,MAAM,YAAY,MAAM,KAAG,CAAC;oCAmD7B,MAAM,YAAY,MAAM;kCAK1B,MAAM,YAAY,MAAM,SAAS,GAAG;iCA3CrC,WAAW,KAAG,aAAa;0BA0ElC,MAAM,gBAAgB,MAAM;mCAhEnB,MAAM;6BAJZ,MAAM;4BAlBP,MAAM,YAAY,MAAM,SAAS,GAAG;gCAkChC,MAAM;;;;;;;;;;;;2CAhHnC,CAAC;;+CAKM,CAAC;;;;;;;;;;;;2CALR,CAAC;;+CAKM,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;wBAqJa,UAAU;kBA7EhB,CAAC,kBAAkB,MAAM,YAAY,MAAM,KAAG,CAAC;oCAmD7B,MAAM,YAAY,MAAM;kCAK1B,MAAM,YAAY,MAAM,SAAS,GAAG;iCA3CrC,WAAW,KAAG,aAAa;0BA0ElC,MAAM,gBAAgB,MAAM;mCAhEnB,MAAM;6BAJZ,MAAM;4BAlBP,MAAM,YAAY,MAAM,SAAS,GAAG;gCAkChC,MAAM;;;;;;;;;;;;2CAhHnC,CAAC;;+CAKM,CAAC;;;;;;;;;;;;2CALR,CAAC;;+CAKM,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;wBAqJa,UAAU;kBA7EhB,CAAC,kBAAkB,MAAM,YAAY,MAAM,KAAG,CAAC;oCAmD7B,MAAM,YAAY,MAAM;kCAK1B,MAAM,YAAY,MAAM,SAAS,GAAG;iCA3CrC,WAAW,KAAG,aAAa;0BA0ElC,MAAM,gBAAgB,MAAM;mCAhEnB,MAAM;6BAJZ,MAAM;4BAlBP,MAAM,YAAY,MAAM,SAAS,GAAG;gCAkChC,MAAM;gMAyF1C,CAAA"}

package/dist/src/types/index.d.ts

@@ -1,4 +1,3 @@
-import TableDataStore from '@/components';
 export type TableColumn = {
     name: string;
     align?: CanvasTextAlign;
@@ -17,7 +16,9 @@ export type TableColumn = {
 export type CellContext = {
     row: TableRow;
     column: TableColumn;
-    table: TableDataStore['table'];
+    table: {
+        [key: string]: any;
+    };
 };
 export type TableConfig = {
     /**

package/dist/src/types/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/types/index.ts"],"names":[],"mappings":"AAAA,OAAO,cAAc,MAAM,cAAc,CAAA;AAEzC,MAAM,MAAM,WAAW,GAAG;IACzB,IAAI,EAAE,MAAM,CAAA;IAEZ,KAAK,CAAC,EAAE,eAAe,CAAA;IACvB,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,MAAM,CAAC,EAAE,OAAO,CAAA;IAEhB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,kBAAkB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;IACxC,cAAc,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,OAAO,CAAC,EAAE,WAAW,KAAK,MAAM,CAAC,CAAA;IAC7D,wBAAwB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;IAE9C,MAAM,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,KAAK,EAAE,GAAG,EAAE,OAAO,CAAC,EAAE,WAAW,KAAK,MAAM,CAAC,CAAA;IACjE,IAAI,CAAC,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,GAAG,CAAA;CAC1B,CAAA;AAED,MAAM,MAAM,WAAW,GAAG;IACzB,GAAG,EAAE,QAAQ,CAAA;IACb,MAAM,EAAE,WAAW,CAAA;IACnB,KAAK,EAAE,cAAc,CAAC,OAAO,CAAC,CAAA;CAC9B,CAAA;AAED,MAAM,MAAM,WAAW,GAAG;IACzB;;;;;;OAMG;IACH,IAAI,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,gBAAgB,GAAG,MAAM,CAAA;IACvD,SAAS,CAAC,EAAE,OAAO,CAAA;CACnB,CAAA;AAED,MAAM,MAAM,YAAY,GAAG;IAC1B,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,WAAW,CAAC,EAAE,OAAO,CAAA;CACrB,CAAA;AAED,MAAM,MAAM,QAAQ,GAAG;IACtB,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;IAClB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,MAAM,CAAC,EAAE,MAAM,CAAA;CACf,CAAA;AAED,MAAM,MAAM,UAAU,GAAG;IACxB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,MAAM,CAAC,EAAE,WAAW,CAAA;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,KAAK,CAAC,EAAE,MAAM,CAAA;IAEd,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,cAAc,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;CACpC,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/types/index.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,WAAW,GAAG;IACzB,IAAI,EAAE,MAAM,CAAA;IAEZ,KAAK,CAAC,EAAE,eAAe,CAAA;IACvB,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,MAAM,CAAC,EAAE,OAAO,CAAA;IAEhB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,kBAAkB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;IACxC,cAAc,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,OAAO,CAAC,EAAE,WAAW,KAAK,MAAM,CAAC,CAAA;IAC7D,wBAAwB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;IAE9C,MAAM,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,KAAK,EAAE,GAAG,EAAE,OAAO,CAAC,EAAE,WAAW,KAAK,MAAM,CAAC,CAAA;IACjE,IAAI,CAAC,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,GAAG,CAAA;CAC1B,CAAA;AAED,MAAM,MAAM,WAAW,GAAG;IACzB,GAAG,EAAE,QAAQ,CAAA;IACb,MAAM,EAAE,WAAW,CAAA;IACnB,KAAK,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAE,CAAA;CAC7B,CAAA;AAED,MAAM,MAAM,WAAW,GAAG;IACzB;;;;;;OAMG;IACH,IAAI,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,gBAAgB,GAAG,MAAM,CAAA;IACvD,SAAS,CAAC,EAAE,OAAO,CAAA;CACnB,CAAA;AAED,MAAM,MAAM,YAAY,GAAG;IAC1B,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,WAAW,CAAC,EAAE,OAAO,CAAA;CACrB,CAAA;AAED,MAAM,MAAM,QAAQ,GAAG;IACtB,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;IAClB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,MAAM,CAAC,EAAE,MAAM,CAAA;CACf,CAAA;AAED,MAAM,MAAM,UAAU,GAAG;IACxB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,MAAM,CAAC,EAAE,WAAW,CAAA;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,KAAK,CAAC,EAAE,MAAM,CAAA;IAEd,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,cAAc,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;CACpC,CAAA"}

package/dist/stores/table.js

@@ -0,0 +1,174 @@
+import { defineStore } from 'pinia';
+import { computed, ref } from 'vue';
+export const createTableStore = (initData) => {
+    const id = initData.id || crypto.randomUUID();
+    const createStore = defineStore(`table-${id}`, () => {
+        // util functions
+        const createTableObject = () => {
+            const table = {};
+            for (const [colIndex, column] of columns.value.entries()) {
+                for (const [rowIndex, row] of rows.value.entries()) {
+                    table[`${colIndex}:${rowIndex}`] = row[column.name];
+                }
+            }
+            return table;
+        };
+        const createDisplayObject = (display) => {
+            const defaultDisplay = [Object.assign({}, { rowModified: false })];
+            // TODO: (typing) what is the type of `display` here?
+            if (display) {
+                if ('0:0' in display) {
+                    return display;
+                }
+                // else if ('default' in display) {
+                // 	// TODO: (typing) what is the possible input here for 'default'?
+                // 	defaultDisplay = display.default
+                // }
+            }
+            // TODO: (typing) is this type correct for the parent set?
+            const parents = new Set();
+            for (let rowIndex = rows.value.length - 1; rowIndex >= 0; rowIndex--) {
+                const row = rows.value[rowIndex];
+                if (row.parent) {
+                    parents.add(row.parent);
+                }
+                defaultDisplay[rowIndex] = {
+                    childrenOpen: false,
+                    expanded: false,
+                    indent: row.indent || null,
+                    isParent: parents.has(rowIndex),
+                    isRoot: row.parent === null || row.parent === undefined,
+                    rowModified: false,
+                    open: row.parent === null || row.parent === undefined,
+                    parent: row.parent,
+                };
+            }
+            return defaultDisplay;
+        };
+        // state
+        const columns = ref(initData.columns);
+        const rows = ref(initData.rows);
+        const config = ref(initData.config || {});
+        const table = ref(initData.table || createTableObject());
+        const display = ref(createDisplayObject(initData.display));
+        const modal = ref(initData.modal || { visible: false });
+        // getters
+        const hasPinnedColumns = computed(() => columns.value.some(col => col.pinned));
+        const numberedRowWidth = computed(() => {
+            const indent = Math.ceil(rows.value.length / 100 + 1);
+            return `${indent}ch`;
+        });
+        const zeroColumn = computed(() => ['list', 'tree', 'list-expansion'].includes(config.value.view));
+        // actions
+        const getCellData = (colIndex, rowIndex) => table.value[`${colIndex}:${rowIndex}`];
+        const setCellData = (colIndex, rowIndex, value) => {
+            const index = `${colIndex}:${rowIndex}`;
+            const col = columns.value[colIndex];
+            if (table.value[index] !== value) {
+                display.value[rowIndex].rowModified = true;
+            }
+            table.value[index] = value;
+            rows.value[rowIndex][col.name] = value;
+        };
+        const getHeaderCellStyle = (column) => ({
+            minWidth: column.width || '40ch',
+            textAlign: column.align || 'center',
+            width: config.value.fullWidth ? 'auto' : null,
+        });
+        const isRowVisible = (rowIndex) => {
+            return config.value.view !== 'tree' || display.value[rowIndex].isRoot || display.value[rowIndex].open;
+        };
+        const getRowExpandSymbol = (rowIndex) => {
+            if (config.value.view !== 'tree') {
+                return '';
+            }
+            if (display.value[rowIndex].isRoot || display.value[rowIndex].isParent) {
+                return display.value[rowIndex].childrenOpen ? '-' : '+';
+            }
+            return '';
+        };
+        const toggleRowExpand = (rowIndex) => {
+            if (config.value.view === 'tree') {
+                display.value[rowIndex].childrenOpen = !display.value[rowIndex].childrenOpen;
+                for (let index = rows.value.length - 1; index >= 0; index--) {
+                    if (display.value[index].parent === rowIndex) {
+                        display.value[index].open = !display.value[index].open;
+                        if (display.value[index].childrenOpen) {
+                            toggleRowExpand(index);
+                        }
+                    }
+                }
+            }
+            else if (config.value.view === 'list-expansion') {
+                display.value[rowIndex].expanded = !display.value[rowIndex].expanded;
+            }
+        };
+        const getCellDisplayValue = (colIndex, rowIndex) => {
+            const cellData = getCellData(colIndex, rowIndex);
+            return getFormattedValue(colIndex, rowIndex, cellData);
+        };
+        const getFormattedValue = (colIndex, rowIndex, value) => {
+            const column = columns.value[colIndex];
+            const row = rows.value[rowIndex];
+            const format = column.format;
+            if (!format) {
+                return value;
+            }
+            if (typeof format === 'function') {
+                return format(value, { table: table.value, row, column });
+            }
+            else if (typeof format === 'string') {
+                // parse format function from string
+                // eslint-disable-next-line @typescript-eslint/no-implied-eval
+                const formatFn = Function(`"use strict";return (${format})`)();
+                return formatFn(value, { table: table.value, row, column });
+            }
+            return value;
+        };
+        const closeModal = (event) => {
+            if (!(event.target instanceof Node)) {
+                // if the target is not a node, it's probably a custom click event to Document or Window
+                // err on the side of closing the modal in that case
+                if (modal.value.visible)
+                    modal.value.visible = false;
+            }
+            else if (!modal.value.parent?.contains(event.target)) {
+                if (modal.value.visible)
+                    modal.value.visible = false;
+            }
+        };
+        const getIndent = (colIndex, indentLevel) => {
+            if (indentLevel && colIndex === 0 && indentLevel > 0) {
+                return `${indentLevel}ch`;
+            }
+            else {
+                return 'inherit';
+            }
+        };
+        return {
+            // state
+            columns,
+            rows,
+            config,
+            table,
+            display,
+            modal,
+            // getters
+            hasPinnedColumns,
+            numberedRowWidth,
+            zeroColumn,
+            // actions
+            closeModal,
+            getCellData,
+            getCellDisplayValue,
+            getFormattedValue,
+            getHeaderCellStyle,
+            getIndent,
+            getRowExpandSymbol,
+            isRowVisible,
+            setCellData,
+            toggleRowExpand,
+        };
+    });
+    return createStore();
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stonecrop/atable",
-  "version": "0.2.63",
+  "version": "0.2.64",
   "license": "MIT",
   "type": "module",
   "author": {
@@ -36,9 +36,10 @@
   "dependencies": {
     "@vueuse/components": "^10.11.0",
     "@vueuse/core": "^11.1.0",
-    "vue": "^3.5.6",
-    "@stonecrop/themes": "0.2.63",
-    "@stonecrop/utilities": "0.2.63"
+    "pinia": "^2.3.0",
+    "vue": "^3.5.11",
+    "@stonecrop/themes": "0.2.64",
+    "@stonecrop/utilities": "0.2.64"
   },
   "devDependencies": {
     "@microsoft/api-documenter": "^7.25.3",