phx-react 1.3.804 → 1.3.805

package/dist/cjs/components/TableVertical/EmptySearchResult.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+interface Props {
+    className?: string;
+}
+export default function EmptySearchResult({ className }: Props): React.JSX.Element;
+export {};

package/dist/cjs/components/TableVertical/EmptySearchResult.js

@@ -0,0 +1,17 @@
+"use strict";
+exports.__esModule = true;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importDefault(require("react"));
+function EmptySearchResult(_a) {
+    var className = _a.className;
+    return (react_1["default"].createElement("div", { className: "-mx-4 -my-2 sm:-mx-6 lg:-mx-8 ".concat(className) },
+        react_1["default"].createElement("div", { className: 'flex h-60 min-w-full items-center justify-center py-2 align-middle md:px-6 md:pr-0 lg:px-8' },
+            react_1["default"].createElement("div", { className: 'bg-white px-4 py-5 sm:p-6' },
+                react_1["default"].createElement("div", { className: 'text-center' },
+                    react_1["default"].createElement("svg", { className: 'mx-auto h-14 w-14 text-gray-400', fill: 'none', stroke: 'currentColor', viewBox: '0 0 24 24', xmlns: 'http://www.w3.org/2000/svg' },
+                        react_1["default"].createElement("path", { d: 'M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z', strokeLinecap: 'round', strokeLinejoin: 'round', strokeWidth: '2' })),
+                    react_1["default"].createElement("h3", { className: 'text-md mt-2 font-medium text-gray-900' }, "Kh\u00F4ng c\u00F3 d\u1EEF li\u1EC7u"),
+                    react_1["default"].createElement("p", { className: 'text-md mt-1 text-gray-500' }, "H\u00E3y th\u1EED thay \u0111\u1ED5i c\u00FA ph\u00E1p t\u00ECm ki\u1EBFm"))))));
+}
+exports["default"] = EmptySearchResult;
+//# sourceMappingURL=EmptySearchResult.js.map

package/dist/cjs/components/TableVertical/EmptySearchResult.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EmptySearchResult.js","sourceRoot":"","sources":["../../../../src/components/TableVertical/EmptySearchResult.tsx"],"names":[],"mappings":";;;AAAA,wDAAyB;AAMzB,SAAwB,iBAAiB,CAAC,EAAoB;QAAlB,SAAS,eAAA;IACnD,OAAO,CACL,0CAAK,SAAS,EAAE,wCAAiC,SAAS,CAAE;QAC1D,0CAAK,SAAS,EAAC,4FAA4F;YACzG,0CAAK,SAAS,EAAC,2BAA2B;gBACxC,0CAAK,SAAS,EAAC,aAAa;oBAC1B,0CACE,SAAS,EAAC,iCAAiC,EAC3C,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,cAAc,EACrB,OAAO,EAAC,WAAW,EACnB,KAAK,EAAC,4BAA4B;wBAElC,2CACE,CAAC,EAAC,6CAA6C,EAC/C,aAAa,EAAC,OAAO,EACrB,cAAc,EAAC,OAAO,EACtB,WAAW,EAAC,GAAG,GACf,CACE;oBACN,yCAAI,SAAS,EAAC,wCAAwC,2CAAsB;oBAC5E,wCAAG,SAAS,EAAC,4BAA4B,gFAAsC,CAC3E,CACF,CACF,CACF,CACP,CAAA;AACH,CAAC;AA3BD,uCA2BC"}

package/dist/cjs/components/TableVertical/RowTable.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+/**
+ *
+ * @param bodyIndex
+ * @param item
+ * @param thBody eg: ["id", "admissions_code", "student_name", "created_at"]
+ * @param thBodyFilter
+ * @param selectedPeople
+ * @param brSetSelectedPeople
+ * @constructor
+ */
+export declare const RowTable: ({ bodyIndex, border, itemBody, lefts, stickyColumnNumber, thBody, thBodyComponent, thBodyFilter, }: any) => React.JSX.Element;

package/dist/cjs/components/TableVertical/RowTable.js

@@ -0,0 +1,89 @@
+"use strict";
+exports.__esModule = true;
+exports.RowTable = void 0;
+var tslib_1 = require("tslib");
+/* eslint-disable prettier/prettier */
+var react_1 = tslib_1.__importDefault(require("react"));
+function classNames() {
+    var classes = [];
+    for (var _i = 0; _i < arguments.length; _i++) {
+        classes[_i] = arguments[_i];
+    }
+    return classes.filter(Boolean).join(' ');
+}
+/**
+ *
+ * @param bodyIndex
+ * @param item
+ * @param thBody eg: ["id", "admissions_code", "student_name", "created_at"]
+ * @param thBodyFilter
+ * @param selectedPeople
+ * @param brSetSelectedPeople
+ * @constructor
+ */
+var RowTable = function (_a) {
+    /**
+     * Kiểm tra có phải đang lấy dữ liệu bên trong 1 object khác hay không
+     * @param value
+     */
+    var bodyIndex = _a.bodyIndex, border = _a.border, itemBody = _a.itemBody, // Là bản ghi record từng hàng
+    lefts = _a.lefts, stickyColumnNumber = _a.stickyColumnNumber, thBody = _a.thBody, thBodyComponent = _a.thBodyComponent, thBodyFilter = _a.thBodyFilter;
+    var nestedSplit = function (value) { return value === null || value === void 0 ? void 0 : value.split('.'); };
+    var dataNestedSplit = nestedSplit(thBody[bodyIndex]);
+    /**
+     * Lấy value bên trong 1 object khác, hoặc lấy giá trị theo index mặc định
+     * ví dụ: customer.name hoặc customer.address.name
+     */
+    var renderValue = function () {
+        var _a, _b, _c, _d, _e, _f;
+        var splitSize = dataNestedSplit === null || dataNestedSplit === void 0 ? void 0 : dataNestedSplit.length;
+        var value = '';
+        switch (splitSize) {
+            case 1:
+                value = itemBody[thBody[bodyIndex]]; // itemBody[0], itemBody[1], itemBody[2], lấy value theo index của object javascript
+                break;
+            case 2:
+                value = (_a = itemBody[dataNestedSplit[0]]) === null || _a === void 0 ? void 0 : _a[dataNestedSplit[1]];
+                break;
+            case 3:
+                value = (_c = (_b = itemBody[dataNestedSplit[0]]) === null || _b === void 0 ? void 0 : _b[dataNestedSplit[1]]) === null || _c === void 0 ? void 0 : _c[dataNestedSplit[2]];
+                break;
+            case 4:
+                value = (_f = (_e = (_d = itemBody[dataNestedSplit[0]]) === null || _d === void 0 ? void 0 : _d[dataNestedSplit[1]]) === null || _e === void 0 ? void 0 : _e[dataNestedSplit[2]]) === null || _f === void 0 ? void 0 : _f[dataNestedSplit[3]];
+                break;
+            default:
+                break;
+        }
+        return {
+            value: thBodyFilter ? thBodyFilter(value) : value,
+            thBodyKey: thBody[bodyIndex]
+        };
+    };
+    var _b = renderValue(), thBodyKey = _b.thBodyKey, value = _b.value;
+    // Body component là 1 function hoặc là 1 value, nó sẽ là 1 function để callback ra ngoài để customize lại lớp render
+    // thBodyComponent = value
+    // thBodyComponent[thBodyKey]  = function(param1, param2)
+    var isFunctionRender = thBodyComponent ? thBodyComponent[thBodyKey] : undefined;
+    /**
+     * Kiểu render theo function đươợc truyền từ prod vào
+     * @param funcCallback
+     * @param value
+     * @param itemBody
+     */
+    var isRenderColumnInRow = function (funcCallback, _a, bodyIndex) {
+        var itemBody = _a.itemBody, value = _a.value;
+        if (!Array.isArray(value)) {
+            return (react_1["default"].createElement("td", { className: classNames('min-w-12 whitespace-nowrap border-t px-3 py-2 text-xs text-gray-900', border && 'border-l', stickyColumnNumber &&
+                    bodyIndex - 1 < stickyColumnNumber &&
+                    'sticky top-0 bg-white drop-shadow-[4px_0_4px_rgba(0,0,0,0.1)]'), style: stickyColumnNumber && bodyIndex - 1 < stickyColumnNumber ? { left: lefts[bodyIndex - 1] } : {} }, funcCallback(value, itemBody)));
+        }
+        return funcCallback(value, itemBody); // Trường hợp trả về nhiều <td>
+    };
+    return (react_1["default"].createElement(react_1["default"].Fragment, null,
+        bodyIndex === 1 ? (react_1["default"].createElement("td", { className: classNames('w-12 whitespace-nowrap border-t px-2 text-xs font-semibold text-gray-900', border && 'border-l', stickyColumnNumber && 'sticky left-0 top-0 z-20 border-gray-300 bg-white'), style: stickyColumnNumber ? { left: lefts[0] } : {} }, isFunctionRender ? isFunctionRender(value, itemBody) : value)) : (react_1["default"].createElement(react_1["default"].Fragment, null)),
+        bodyIndex > 1 ? (isFunctionRender ? (isRenderColumnInRow(isFunctionRender, { value: value, itemBody: itemBody }, bodyIndex)) : (react_1["default"].createElement("td", { className: classNames('whitespace-nowrap border-t px-2 text-xs text-gray-900', border && 'border-l', stickyColumnNumber &&
+                bodyIndex - 1 < stickyColumnNumber &&
+                'sticky top-0 bg-white drop-shadow-[4px_0_4px_rgba(0,0,0,0.1)]'), style: stickyColumnNumber && bodyIndex - 1 < stickyColumnNumber ? { left: lefts[bodyIndex - 1] } : {} }, value))) : (react_1["default"].createElement(react_1["default"].Fragment, null))));
+};
+exports.RowTable = RowTable;
+//# sourceMappingURL=RowTable.js.map

package/dist/cjs/components/TableVertical/RowTable.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RowTable.js","sourceRoot":"","sources":["../../../../src/components/TableVertical/RowTable.tsx"],"names":[],"mappings":"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"}

package/dist/cjs/components/TableVertical/TableVertical.d.ts

@@ -0,0 +1,32 @@
+import React from 'react';
+export declare const AUTH_TOKEN = "authToken";
+interface HeaderVertical {
+    name: string;
+    parent_name?: string;
+    parent_row?: number;
+}
+export interface MainTableProps {
+    list: {
+        keyResult: string;
+        query: string;
+    } | any;
+    thHeader: Array<any>;
+    thBody: Array<any>;
+    thBodyComponent?: any;
+    thHeaderComponent?: any;
+    typeLoading?: {
+        type: 'page-with-table' | 'page-table-with-report' | 'table' | 'page-table-report-filter' | 'page-table-filter';
+        filterQty?: number;
+        reportQty?: number;
+    };
+    setHeaderLoading?: any;
+    filterLoading?: boolean;
+    isQueryDataCenter?: boolean;
+    thHeaderVertical?: Array<HeaderVertical>;
+    isCellRendering?: boolean;
+    cellNumberInRow?: number;
+    border?: boolean;
+    stickyColumnNumber?: number;
+}
+export declare function PHXTableVertical({ border, cellNumberInRow, filterLoading, isCellRendering, isQueryDataCenter, list, setHeaderLoading, stickyColumnNumber, thBody, thBodyComponent, thHeader, thHeaderComponent, thHeaderVertical, typeLoading, }: Readonly<MainTableProps>): React.JSX.Element;
+export {};

package/dist/cjs/components/TableVertical/TableVertical.js

@@ -0,0 +1,142 @@
+"use strict";
+'use client';
+exports.__esModule = true;
+exports.PHXTableVertical = exports.AUTH_TOKEN = void 0;
+var tslib_1 = require("tslib");
+var js_cookie_1 = tslib_1.__importDefault(require("js-cookie"));
+var react_1 = tslib_1.__importStar(require("react"));
+var RowTable_1 = require("./RowTable");
+var useStickyLeft_1 = require("./useStickyLeft");
+var clientQueryDataCenterV3_1 = tslib_1.__importDefault(require("../Func/clientQueryDataCenterV3"));
+var clientQueryV3_1 = tslib_1.__importDefault(require("../Func/clientQueryV3"));
+var types_1 = require("../types");
+var Skeleton_1 = require("../Skeleton");
+var EmptySearchResult_1 = tslib_1.__importDefault(require("./EmptySearchResult"));
+var EmptyRecord_1 = require("../EmptyRecord");
+exports.AUTH_TOKEN = 'authToken';
+function PHXTableVertical(_a) {
+    var _this = this;
+    var _b = _a.border, border = _b === void 0 ? false : _b, _c = _a.cellNumberInRow, cellNumberInRow = _c === void 0 ? 0 : _c, _d = _a.filterLoading, filterLoading = _d === void 0 ? false : _d, _e = _a.isCellRendering, isCellRendering = _e === void 0 ? false : _e, isQueryDataCenter = _a.isQueryDataCenter, list = _a.list, setHeaderLoading = _a.setHeaderLoading, _f = _a.stickyColumnNumber, stickyColumnNumber = _f === void 0 ? 0 : _f, thBody = _a.thBody, thBodyComponent = _a.thBodyComponent, thHeader = _a.thHeader, thHeaderComponent = _a.thHeaderComponent, thHeaderVertical = _a.thHeaderVertical, _g = _a.typeLoading, typeLoading = _g === void 0 ? { type: 'table' } : _g;
+    var _h = (0, react_1.useState)(true), isMainLoading = _h[0], setIsMainLoading = _h[1];
+    var _j = (0, react_1.useState)([]), dataTableQuery = _j[0], setDataTableQuery = _j[1];
+    var _k = (0, useStickyLeft_1.useStickyLefts)(stickyColumnNumber, dataTableQuery), lefts = _k.lefts, refs = _k.refs;
+    var headerEmptyLength = thHeader.filter(function (item) { return !item; }).length;
+    var getToken = function () {
+        if (typeof window !== 'undefined') {
+            var authTokenInfo_1 = js_cookie_1["default"].get(exports.AUTH_TOKEN) && JSON.parse(js_cookie_1["default"].get(exports.AUTH_TOKEN));
+            return 'Bearer' + ' ' + authTokenInfo_1.token;
+        }
+        else {
+            return;
+        }
+    };
+    var authTokenInfo = getToken();
+    var getData = function (result) { return result.data; };
+    var bindDataToTable = function (dataTable) {
+        // @ts-ignore
+        var data = tslib_1.__spreadArray([], dataTable, true);
+        setDataTableQuery(data);
+    };
+    var chunkArray = function (arr, chunkSize) {
+        var chunks = [];
+        for (var i = 0; i < arr.length; i += chunkSize) {
+            chunks.push(arr.slice(i, i + chunkSize));
+        }
+        return chunks;
+    };
+    var queryData = function () { return tslib_1.__awaiter(_this, void 0, void 0, function () {
+        var data, _a, _b, dataTable, chunkedData, e_1;
+        return tslib_1.__generator(this, function (_c) {
+            switch (_c.label) {
+                case 0:
+                    _c.trys.push([0, 5, , 6]);
+                    if (!authTokenInfo)
+                        return [2 /*return*/];
+                    _a = getData;
+                    if (!isQueryDataCenter) return [3 /*break*/, 2];
+                    return [4 /*yield*/, (0, clientQueryDataCenterV3_1["default"])({
+                            query: list.query
+                        })];
+                case 1:
+                    _b = _c.sent();
+                    return [3 /*break*/, 4];
+                case 2: return [4 /*yield*/, (0, clientQueryV3_1["default"])({
+                        query: list.query
+                    })];
+                case 3:
+                    _b = _c.sent();
+                    _c.label = 4;
+                case 4:
+                    data = _a.apply(void 0, [_b]);
+                    if (!data)
+                        return [2 /*return*/];
+                    setIsMainLoading(true);
+                    dataTable = list.keyResult;
+                    if (isCellRendering && cellNumberInRow) {
+                        chunkedData = chunkArray(data[dataTable], cellNumberInRow);
+                        bindDataToTable(chunkedData);
+                    }
+                    else {
+                        bindDataToTable(data[dataTable]);
+                    }
+                    setIsMainLoading(false);
+                    if (setHeaderLoading)
+                        setHeaderLoading();
+                    return [3 /*break*/, 6];
+                case 5:
+                    e_1 = _c.sent();
+                    console.log(e_1);
+                    return [3 /*break*/, 6];
+                case 6: return [2 /*return*/];
+            }
+        });
+    }); };
+    (0, react_1.useEffect)(function () {
+        queryData();
+    }, []);
+    (0, react_1.useEffect)(function () {
+        if (filterLoading) {
+            queryData();
+            setIsMainLoading(true);
+        }
+    }, [list]);
+    return (react_1["default"].createElement(react_1["default"].Fragment, null, isMainLoading ? (react_1["default"].createElement(Skeleton_1.PHXSkeleton, { filterQty: typeLoading === null || typeLoading === void 0 ? void 0 : typeLoading.filterQty, reportQty: typeLoading === null || typeLoading === void 0 ? void 0 : typeLoading.reportQty, type: typeLoading.type })) : (react_1["default"].createElement(react_1["default"].Fragment, null,
+        react_1["default"].createElement("div", { className: 'rounded-lg bg-white shadow ring-1 ring-black ring-opacity-5' },
+            react_1["default"].createElement("div", { className: 'flex flex-col' }, dataTableQuery.length > 0 ? (react_1["default"].createElement("div", null, !isMainLoading ? (react_1["default"].createElement("div", { className: 'overflow-x-auto rounded-lg' },
+                react_1["default"].createElement("div", { className: (0, types_1.classNames)('min-w-full align-middle shadow ring-black ring-opacity-5') },
+                    react_1["default"].createElement("div", { className: (0, types_1.classNames)('relative overflow-auto ') },
+                        react_1["default"].createElement("table", { className: (0, types_1.classNames)(
+                            // @ts-ignore
+                            thHeader.length < 5
+                                ? 'min-w-full table-fixed border-separate border-spacing-0 divide-y divide-gray-300'
+                                : 'min-w-full') },
+                            thHeaderComponent ? (thHeaderComponent) : (react_1["default"].createElement("thead", null,
+                                react_1["default"].createElement("tr", null, thHeader.map(function (item, index) {
+                                    return index === 0 ? (react_1["default"].createElement("th", { key: index, 
+                                        // @ts-ignore
+                                        ref: function (el) { return (refs.current[0] = el); }, className: (0, types_1.classNames)('rounded-tl-lg bg-gray-50 px-3 py-2 text-left align-top text-xs font-medium text-gray-500', item ? 'min-w-[160px]' : 'min-w-12', stickyColumnNumber && 'sticky left-0 top-0 z-20'), scope: 'col', style: stickyColumnNumber ? { left: lefts[0] } : {} }, item)) : (react_1["default"].createElement("th", { key: index, 
+                                        // @ts-ignore
+                                        ref: function (el) { return (refs.current[index] = el); }, className: (0, types_1.classNames)('min-w-[135px] bg-gray-50 px-3 py-2 text-left align-top text-xs font-medium text-gray-500', index === thHeader.length - 1 && 'rounded-tr-lg', stickyColumnNumber &&
+                                            index < stickyColumnNumber &&
+                                            'sticky top-0 drop-shadow-[4px_0_4px_rgba(0,0,0,0.1)]', border && item && 'border-l'), scope: 'col', style: stickyColumnNumber && index < stickyColumnNumber ? { left: lefts[index] } : {} }, item));
+                                })))),
+                            react_1["default"].createElement("tbody", { className: 'divide-y divide-gray-200' },
+                                react_1["default"].createElement(react_1["default"].Fragment, null, !thHeaderVertical ? (react_1["default"].createElement(react_1["default"].Fragment, null, dataTableQuery.map(function (item) { return (react_1["default"].createElement("tr", { key: item.id }, thBody.map(function (_, bodyIndex) { return (react_1["default"].createElement(react_1["default"].Fragment, null,
+                                    react_1["default"].createElement(RowTable_1.RowTable, { key: bodyIndex, bodyIndex: bodyIndex, border: border, itemBody: item, lefts: lefts, refs: refs, stickyColumnNumber: stickyColumnNumber, thBody: thBody, thBodyComponent: thBodyComponent }))); }))); }))) : (react_1["default"].createElement(react_1["default"].Fragment, null, thHeaderVertical.map(function (item, index) {
+                                    var _a, _b;
+                                    return (react_1["default"].createElement("tr", { key: index, className: 'hover:cursor-default' },
+                                        item.parent_name && (react_1["default"].createElement("td", { className: 'sticky top-0 whitespace-nowrap rounded-bl-lg border-r border-t bg-white px-2 text-xs font-semibold text-gray-900', rowSpan: item.parent_row, style: { left: lefts[0] } }, item.parent_name)),
+                                        react_1["default"].createElement("td", { className: 'sticky top-0 whitespace-nowrap border-r border-t bg-white text-xs text-gray-900 drop-shadow-[4px_0_4px_rgba(0,0,0,0.1)]', style: { left: lefts[1] } },
+                                            react_1["default"].createElement("div", { className: 'flex flex-col justify-center px-2' }, item.name)),
+                                        ((_a = dataTableQuery[index]) === null || _a === void 0 ? void 0 : _a.length) > 0
+                                            ? (_b = dataTableQuery[index]) === null || _b === void 0 ? void 0 : _b.map(function (itemChunk, indexChunk) {
+                                                var isFunctionRender = thBodyComponent
+                                                    ? thBodyComponent[thHeader[indexChunk + headerEmptyLength]]
+                                                    : undefined;
+                                                return (react_1["default"].createElement("td", { key: indexChunk + 1, className: (0, types_1.classNames)('border-r border-t px-3 py-2 text-xs text-gray-900') }, isFunctionRender ? isFunctionRender(itemChunk, itemChunk) : ''));
+                                            })
+                                            : tslib_1.__spreadArray([], Array(cellNumberInRow), true).map(function (_, indexArr) { return (react_1["default"].createElement("td", { key: indexArr + 1, className: (0, types_1.classNames)('px-3 py-2 text-sm text-gray-500', border && 'border-r border-t ') }, "Ch\u01B0a c\u00F3 d\u1EEF li\u1EC7u")); })));
+                                })))))))))) : (react_1["default"].createElement(EmptySearchResult_1["default"], null)))) : (react_1["default"].createElement(EmptyRecord_1.PHXEmptyRecord, null))))))));
+}
+exports.PHXTableVertical = PHXTableVertical;
+//# sourceMappingURL=TableVertical.js.map

package/dist/cjs/components/TableVertical/TableVertical.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableVertical.js","sourceRoot":"","sources":["../../../../src/components/TableVertical/TableVertical.tsx"],"names":[],"mappings":"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"}

package/dist/cjs/components/TableVertical/index.d.ts

@@ -0,0 +1 @@
+export * from './TableVertical';

package/dist/cjs/components/TableVertical/index.js

@@ -0,0 +1,5 @@
+"use strict";
+exports.__esModule = true;
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./TableVertical"), exports);
+//# sourceMappingURL=index.js.map

package/dist/cjs/components/TableVertical/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/TableVertical/index.ts"],"names":[],"mappings":";;;AAAA,0DAA+B"}

package/dist/cjs/components/TableVertical/useStickyLeft.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+export declare const useStickyLefts: (count: number, dataTable: any) => {
+    refs: import("react").MutableRefObject<(HTMLTableCellElement | null)[]>;
+    lefts: number[];
+};

package/dist/cjs/components/TableVertical/useStickyLeft.js

@@ -0,0 +1,40 @@
+"use strict";
+exports.__esModule = true;
+exports.useStickyLefts = void 0;
+var react_1 = require("react");
+var useStickyLefts = function (count, dataTable) {
+    var refs = (0, react_1.useRef)([]);
+    var _a = (0, react_1.useState)([]), lefts = _a[0], setLefts = _a[1];
+    (0, react_1.useEffect)(function () {
+        var calculateLefts = function () {
+            var _a;
+            var newLefts = [];
+            var acc = 0;
+            for (var i = 0; i < count; i++) {
+                var width = ((_a = refs.current[i]) === null || _a === void 0 ? void 0 : _a.offsetWidth) || 0;
+                newLefts[i] = acc;
+                acc += width;
+            }
+            setLefts(newLefts);
+        };
+        // Initial calculate
+        calculateLefts();
+        // ResizeObserver để lắng nghe thay đổi kích thước từng ref
+        var observers = [];
+        refs.current.slice(0, count).forEach(function (cell) {
+            if (!cell)
+                return;
+            var observer = new ResizeObserver(function () {
+                calculateLefts();
+            });
+            observer.observe(cell);
+            observers.push(observer);
+        });
+        return function () {
+            observers.forEach(function (observer) { return observer.disconnect(); });
+        };
+    }, [count, dataTable]);
+    return { refs: refs, lefts: lefts };
+};
+exports.useStickyLefts = useStickyLefts;
+//# sourceMappingURL=useStickyLeft.js.map

package/dist/cjs/components/TableVertical/useStickyLeft.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useStickyLeft.js","sourceRoot":"","sources":["../../../../src/components/TableVertical/useStickyLeft.tsx"],"names":[],"mappings":";;;AAAA,+BAAmD;AAE5C,IAAM,cAAc,GAAG,UAAC,KAAa,EAAE,SAAc;IAC1D,IAAM,IAAI,GAAG,IAAA,cAAM,EAAqC,EAAE,CAAC,CAAA;IACrD,IAAA,KAAoB,IAAA,gBAAQ,EAAgB,EAAE,CAAC,EAA9C,KAAK,QAAA,EAAE,QAAQ,QAA+B,CAAA;IAErD,IAAA,iBAAS,EAAC;QACR,IAAM,cAAc,GAAG;;YACrB,IAAM,QAAQ,GAAkB,EAAE,CAAA;YAClC,IAAI,GAAG,GAAG,CAAC,CAAA;YACX,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,KAAK,EAAE,CAAC,EAAE,EAAE;gBAC9B,IAAM,KAAK,GAAG,CAAA,MAAA,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,0CAAE,WAAW,KAAI,CAAC,CAAA;gBAC/C,QAAQ,CAAC,CAAC,CAAC,GAAG,GAAG,CAAA;gBACjB,GAAG,IAAI,KAAK,CAAA;aACb;YACD,QAAQ,CAAC,QAAQ,CAAC,CAAA;QACpB,CAAC,CAAA;QAED,oBAAoB;QACpB,cAAc,EAAE,CAAA;QAEhB,2DAA2D;QAC3D,IAAM,SAAS,GAA0B,EAAE,CAAA;QAE3C,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,CAAC,CAAC,OAAO,CAAC,UAAC,IAAI;YACxC,IAAI,CAAC,IAAI;gBAAE,OAAM;YACjB,IAAM,QAAQ,GAAG,IAAI,cAAc,CAAC;gBAClC,cAAc,EAAE,CAAA;YAClB,CAAC,CAAC,CAAA;YACF,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,CAAA;YACtB,SAAS,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAA;QAC1B,CAAC,CAAC,CAAA;QAEF,OAAO;YACL,SAAS,CAAC,OAAO,CAAC,UAAC,QAAQ,IAAK,OAAA,QAAQ,CAAC,UAAU,EAAE,EAArB,CAAqB,CAAC,CAAA;QACxD,CAAC,CAAA;IACH,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,CAAC,CAAC,CAAA;IAEtB,OAAO,EAAE,IAAI,MAAA,EAAE,KAAK,OAAA,EAAE,CAAA;AACxB,CAAC,CAAA;AArCY,QAAA,cAAc,kBAqC1B"}

package/dist/cjs/index.d.ts

@@ -66,4 +66,5 @@ import { PHXLoadingProvider, useLoading } from './components/LoadingProvider';
 import PHXLoadingIndicator from './components/LoadingIndicator/loading-indicator';
 import PHXLink from './components/Link/link';
 import { PHXSwitchView } from './components/SwitchView';
-export { PHXButton, PHXCard, PHXSpinner, PHXFormWrap, PHXHeaderBar, PHXTableV3, PHXInput, PHXSelect, PHXSelectBox, PHXRadio, PHXCheckbox, PHXCheckboxGroup, PHXContainer, PHXFormStep, PHXNotifications, PHXStep, PHXSkeleton, PHXFuncGetLoggedInfo, PHXClientQuery, PHXClientMutation, PHXClientQueryV3, PHXClientMutationV3, PHXClientMutationDataCenterV3, PHXClientQueryDataCenterV3, PHXTextarea, PHXModal, PHXTabs, PHXChoiceList, PHXDescriptionLists, PHXBadge, PHXLoginV3, PHXLoginSsoV3, PHXBanner, PHXButtonGroup, PHXCombobox, PHXFormLayout, PHXHorizontalStack, PHXUploadFile, PHXSearchResultListV3, PHXDatePicker, PHXEmptyRecord, PHXTimePicker, PHXDropdown, PHXUploadAvatar, PHXDateRangePicker, PHXUseDebounce, PHXResourceList, PHXFetchAPI, PBFMainWrap, PieChart, BarChart, DonutChart, PHXTooltip, PHXGetActiveYearAndNextYearV3, PHXGetCurrentYearWithTermHocVuV3, PHXGetCurrentYearWithTermV3, PHXLogUserActivityV3, PHXFormTuitionV3, PHXMainWrapV3, PHXPagePermissionV3, PHXGetEnvPublicV3, PHXFuncGetActionPermissionV3, PHXUseQueryDataV3, PHXCalendar, PHXLoadingProvider, useLoading, PHXLoadingIndicator, PHXLink, PHXSwitchView, };
+import { PHXTableVertical } from './components/TableVertical';
+export { PHXButton, PHXCard, PHXSpinner, PHXFormWrap, PHXHeaderBar, PHXTableV3, PHXInput, PHXSelect, PHXSelectBox, PHXRadio, PHXCheckbox, PHXCheckboxGroup, PHXContainer, PHXFormStep, PHXNotifications, PHXStep, PHXSkeleton, PHXFuncGetLoggedInfo, PHXClientQuery, PHXClientMutation, PHXClientQueryV3, PHXClientMutationV3, PHXClientMutationDataCenterV3, PHXClientQueryDataCenterV3, PHXTextarea, PHXModal, PHXTabs, PHXChoiceList, PHXDescriptionLists, PHXBadge, PHXLoginV3, PHXLoginSsoV3, PHXBanner, PHXButtonGroup, PHXCombobox, PHXFormLayout, PHXHorizontalStack, PHXUploadFile, PHXSearchResultListV3, PHXDatePicker, PHXEmptyRecord, PHXTimePicker, PHXDropdown, PHXUploadAvatar, PHXDateRangePicker, PHXUseDebounce, PHXResourceList, PHXFetchAPI, PBFMainWrap, PieChart, BarChart, DonutChart, PHXTooltip, PHXGetActiveYearAndNextYearV3, PHXGetCurrentYearWithTermHocVuV3, PHXGetCurrentYearWithTermV3, PHXLogUserActivityV3, PHXFormTuitionV3, PHXMainWrapV3, PHXPagePermissionV3, PHXGetEnvPublicV3, PHXFuncGetActionPermissionV3, PHXUseQueryDataV3, PHXCalendar, PHXLoadingProvider, useLoading, PHXLoadingIndicator, PHXLink, PHXSwitchView, PHXTableVertical, };

package/dist/cjs/index.js

@@ -1,7 +1,7 @@
 "use strict";
 exports.__esModule = true;
 exports.PieChart = exports.PBFMainWrap = exports.PHXFetchAPI = exports.PHXResourceList = exports.PHXUseDebounce = exports.PHXDateRangePicker = exports.PHXUploadAvatar = exports.PHXDropdown = exports.PHXTimePicker = exports.PHXEmptyRecord = exports.PHXDatePicker = exports.PHXSearchResultListV3 = exports.PHXUploadFile = exports.PHXHorizontalStack = exports.PHXFormLayout = exports.PHXCombobox = exports.PHXButtonGroup = exports.PHXBanner = exports.PHXLoginSsoV3 = exports.PHXLoginV3 = exports.PHXBadge = exports.PHXDescriptionLists = exports.PHXChoiceList = exports.PHXTabs = exports.PHXModal = exports.PHXTextarea = exports.PHXClientQueryDataCenterV3 = exports.PHXClientMutationDataCenterV3 = exports.PHXClientMutationV3 = exports.PHXClientQueryV3 = exports.PHXClientMutation = exports.PHXClientQuery = exports.PHXFuncGetLoggedInfo = exports.PHXSkeleton = exports.PHXStep = exports.PHXNotifications = exports.PHXFormStep = exports.PHXContainer = exports.PHXCheckboxGroup = exports.PHXCheckbox = exports.PHXRadio = exports.PHXSelectBox = exports.PHXSelect = exports.PHXInput = exports.PHXTableV3 = exports.PHXHeaderBar = exports.PHXFormWrap = exports.PHXSpinner = exports.PHXCard = exports.PHXButton = void 0;
-exports.PHXSwitchView = exports.PHXLink = exports.PHXLoadingIndicator = exports.useLoading = exports.PHXLoadingProvider = exports.PHXCalendar = exports.PHXUseQueryDataV3 = exports.PHXFuncGetActionPermissionV3 = exports.PHXGetEnvPublicV3 = exports.PHXPagePermissionV3 = exports.PHXMainWrapV3 = exports.PHXFormTuitionV3 = exports.PHXLogUserActivityV3 = exports.PHXGetCurrentYearWithTermV3 = exports.PHXGetCurrentYearWithTermHocVuV3 = exports.PHXGetActiveYearAndNextYearV3 = exports.PHXTooltip = exports.DonutChart = exports.BarChart = void 0;
+exports.PHXTableVertical = exports.PHXSwitchView = exports.PHXLink = exports.PHXLoadingIndicator = exports.useLoading = exports.PHXLoadingProvider = exports.PHXCalendar = exports.PHXUseQueryDataV3 = exports.PHXFuncGetActionPermissionV3 = exports.PHXGetEnvPublicV3 = exports.PHXPagePermissionV3 = exports.PHXMainWrapV3 = exports.PHXFormTuitionV3 = exports.PHXLogUserActivityV3 = exports.PHXGetCurrentYearWithTermV3 = exports.PHXGetCurrentYearWithTermHocVuV3 = exports.PHXGetActiveYearAndNextYearV3 = exports.PHXTooltip = exports.DonutChart = exports.BarChart = void 0;
 var tslib_1 = require("tslib");
 var getActionPermission_1 = require("./components/Func/getActionPermission");
 exports.PHXFuncGetActionPermissionV3 = getActionPermission_1.PHXFuncGetActionPermissionV3;
@@ -140,4 +140,6 @@ var link_1 = tslib_1.__importDefault(require("./components/Link/link"));
 exports.PHXLink = link_1["default"];
 var SwitchView_1 = require("./components/SwitchView");
 exports.PHXSwitchView = SwitchView_1.PHXSwitchView;
+var TableVertical_1 = require("./components/TableVertical");
+exports.PHXTableVertical = TableVertical_1.PHXTableVertical;
 //# sourceMappingURL=index.js.map

package/dist/cjs/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"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"}

package/dist/esm/components/TableVertical/EmptySearchResult.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+interface Props {
+    className?: string;
+}
+export default function EmptySearchResult({ className }: Props): React.JSX.Element;
+export {};

package/dist/esm/components/TableVertical/EmptySearchResult.js

@@ -0,0 +1,13 @@
+import React from 'react';
+export default function EmptySearchResult(_a) {
+    var className = _a.className;
+    return (React.createElement("div", { className: "-mx-4 -my-2 sm:-mx-6 lg:-mx-8 ".concat(className) },
+        React.createElement("div", { className: 'flex h-60 min-w-full items-center justify-center py-2 align-middle md:px-6 md:pr-0 lg:px-8' },
+            React.createElement("div", { className: 'bg-white px-4 py-5 sm:p-6' },
+                React.createElement("div", { className: 'text-center' },
+                    React.createElement("svg", { className: 'mx-auto h-14 w-14 text-gray-400', fill: 'none', stroke: 'currentColor', viewBox: '0 0 24 24', xmlns: 'http://www.w3.org/2000/svg' },
+                        React.createElement("path", { d: 'M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z', strokeLinecap: 'round', strokeLinejoin: 'round', strokeWidth: '2' })),
+                    React.createElement("h3", { className: 'text-md mt-2 font-medium text-gray-900' }, "Kh\u00F4ng c\u00F3 d\u1EEF li\u1EC7u"),
+                    React.createElement("p", { className: 'text-md mt-1 text-gray-500' }, "H\u00E3y th\u1EED thay \u0111\u1ED5i c\u00FA ph\u00E1p t\u00ECm ki\u1EBFm"))))));
+}
+//# sourceMappingURL=EmptySearchResult.js.map

package/dist/esm/components/TableVertical/EmptySearchResult.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EmptySearchResult.js","sourceRoot":"","sources":["../../../../src/components/TableVertical/EmptySearchResult.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAMzB,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,EAAoB;QAAlB,SAAS,eAAA;IACnD,OAAO,CACL,6BAAK,SAAS,EAAE,wCAAiC,SAAS,CAAE;QAC1D,6BAAK,SAAS,EAAC,4FAA4F;YACzG,6BAAK,SAAS,EAAC,2BAA2B;gBACxC,6BAAK,SAAS,EAAC,aAAa;oBAC1B,6BACE,SAAS,EAAC,iCAAiC,EAC3C,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,cAAc,EACrB,OAAO,EAAC,WAAW,EACnB,KAAK,EAAC,4BAA4B;wBAElC,8BACE,CAAC,EAAC,6CAA6C,EAC/C,aAAa,EAAC,OAAO,EACrB,cAAc,EAAC,OAAO,EACtB,WAAW,EAAC,GAAG,GACf,CACE;oBACN,4BAAI,SAAS,EAAC,wCAAwC,2CAAsB;oBAC5E,2BAAG,SAAS,EAAC,4BAA4B,gFAAsC,CAC3E,CACF,CACF,CACF,CACP,CAAA;AACH,CAAC"}

package/dist/esm/components/TableVertical/RowTable.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+/**
+ *
+ * @param bodyIndex
+ * @param item
+ * @param thBody eg: ["id", "admissions_code", "student_name", "created_at"]
+ * @param thBodyFilter
+ * @param selectedPeople
+ * @param brSetSelectedPeople
+ * @constructor
+ */
+export declare const RowTable: ({ bodyIndex, border, itemBody, lefts, stickyColumnNumber, thBody, thBodyComponent, thBodyFilter, }: any) => React.JSX.Element;

package/dist/esm/components/TableVertical/RowTable.js

@@ -0,0 +1,84 @@
+/* eslint-disable prettier/prettier */
+import React from 'react';
+function classNames() {
+    var classes = [];
+    for (var _i = 0; _i < arguments.length; _i++) {
+        classes[_i] = arguments[_i];
+    }
+    return classes.filter(Boolean).join(' ');
+}
+/**
+ *
+ * @param bodyIndex
+ * @param item
+ * @param thBody eg: ["id", "admissions_code", "student_name", "created_at"]
+ * @param thBodyFilter
+ * @param selectedPeople
+ * @param brSetSelectedPeople
+ * @constructor
+ */
+export var RowTable = function (_a) {
+    /**
+     * Kiểm tra có phải đang lấy dữ liệu bên trong 1 object khác hay không
+     * @param value
+     */
+    var bodyIndex = _a.bodyIndex, border = _a.border, itemBody = _a.itemBody, // Là bản ghi record từng hàng
+    lefts = _a.lefts, stickyColumnNumber = _a.stickyColumnNumber, thBody = _a.thBody, thBodyComponent = _a.thBodyComponent, thBodyFilter = _a.thBodyFilter;
+    var nestedSplit = function (value) { return value === null || value === void 0 ? void 0 : value.split('.'); };
+    var dataNestedSplit = nestedSplit(thBody[bodyIndex]);
+    /**
+     * Lấy value bên trong 1 object khác, hoặc lấy giá trị theo index mặc định
+     * ví dụ: customer.name hoặc customer.address.name
+     */
+    var renderValue = function () {
+        var _a, _b, _c, _d, _e, _f;
+        var splitSize = dataNestedSplit === null || dataNestedSplit === void 0 ? void 0 : dataNestedSplit.length;
+        var value = '';
+        switch (splitSize) {
+            case 1:
+                value = itemBody[thBody[bodyIndex]]; // itemBody[0], itemBody[1], itemBody[2], lấy value theo index của object javascript
+                break;
+            case 2:
+                value = (_a = itemBody[dataNestedSplit[0]]) === null || _a === void 0 ? void 0 : _a[dataNestedSplit[1]];
+                break;
+            case 3:
+                value = (_c = (_b = itemBody[dataNestedSplit[0]]) === null || _b === void 0 ? void 0 : _b[dataNestedSplit[1]]) === null || _c === void 0 ? void 0 : _c[dataNestedSplit[2]];
+                break;
+            case 4:
+                value = (_f = (_e = (_d = itemBody[dataNestedSplit[0]]) === null || _d === void 0 ? void 0 : _d[dataNestedSplit[1]]) === null || _e === void 0 ? void 0 : _e[dataNestedSplit[2]]) === null || _f === void 0 ? void 0 : _f[dataNestedSplit[3]];
+                break;
+            default:
+                break;
+        }
+        return {
+            value: thBodyFilter ? thBodyFilter(value) : value,
+            thBodyKey: thBody[bodyIndex]
+        };
+    };
+    var _b = renderValue(), thBodyKey = _b.thBodyKey, value = _b.value;
+    // Body component là 1 function hoặc là 1 value, nó sẽ là 1 function để callback ra ngoài để customize lại lớp render
+    // thBodyComponent = value
+    // thBodyComponent[thBodyKey]  = function(param1, param2)
+    var isFunctionRender = thBodyComponent ? thBodyComponent[thBodyKey] : undefined;
+    /**
+     * Kiểu render theo function đươợc truyền từ prod vào
+     * @param funcCallback
+     * @param value
+     * @param itemBody
+     */
+    var isRenderColumnInRow = function (funcCallback, _a, bodyIndex) {
+        var itemBody = _a.itemBody, value = _a.value;
+        if (!Array.isArray(value)) {
+            return (React.createElement("td", { className: classNames('min-w-12 whitespace-nowrap border-t px-3 py-2 text-xs text-gray-900', border && 'border-l', stickyColumnNumber &&
+                    bodyIndex - 1 < stickyColumnNumber &&
+                    'sticky top-0 bg-white drop-shadow-[4px_0_4px_rgba(0,0,0,0.1)]'), style: stickyColumnNumber && bodyIndex - 1 < stickyColumnNumber ? { left: lefts[bodyIndex - 1] } : {} }, funcCallback(value, itemBody)));
+        }
+        return funcCallback(value, itemBody); // Trường hợp trả về nhiều <td>
+    };
+    return (React.createElement(React.Fragment, null,
+        bodyIndex === 1 ? (React.createElement("td", { className: classNames('w-12 whitespace-nowrap border-t px-2 text-xs font-semibold text-gray-900', border && 'border-l', stickyColumnNumber && 'sticky left-0 top-0 z-20 border-gray-300 bg-white'), style: stickyColumnNumber ? { left: lefts[0] } : {} }, isFunctionRender ? isFunctionRender(value, itemBody) : value)) : (React.createElement(React.Fragment, null)),
+        bodyIndex > 1 ? (isFunctionRender ? (isRenderColumnInRow(isFunctionRender, { value: value, itemBody: itemBody }, bodyIndex)) : (React.createElement("td", { className: classNames('whitespace-nowrap border-t px-2 text-xs text-gray-900', border && 'border-l', stickyColumnNumber &&
+                bodyIndex - 1 < stickyColumnNumber &&
+                'sticky top-0 bg-white drop-shadow-[4px_0_4px_rgba(0,0,0,0.1)]'), style: stickyColumnNumber && bodyIndex - 1 < stickyColumnNumber ? { left: lefts[bodyIndex - 1] } : {} }, value))) : (React.createElement(React.Fragment, null))));
+};
+//# sourceMappingURL=RowTable.js.map

package/dist/esm/components/TableVertical/RowTable.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RowTable.js","sourceRoot":"","sources":["../../../../src/components/TableVertical/RowTable.tsx"],"names":[],"mappings":"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"}

package/dist/esm/components/TableVertical/TableVertical.d.ts

@@ -0,0 +1,32 @@
+import React from 'react';
+export declare const AUTH_TOKEN = "authToken";
+interface HeaderVertical {
+    name: string;
+    parent_name?: string;
+    parent_row?: number;
+}
+export interface MainTableProps {
+    list: {
+        keyResult: string;
+        query: string;
+    } | any;
+    thHeader: Array<any>;
+    thBody: Array<any>;
+    thBodyComponent?: any;
+    thHeaderComponent?: any;
+    typeLoading?: {
+        type: 'page-with-table' | 'page-table-with-report' | 'table' | 'page-table-report-filter' | 'page-table-filter';
+        filterQty?: number;
+        reportQty?: number;
+    };
+    setHeaderLoading?: any;
+    filterLoading?: boolean;
+    isQueryDataCenter?: boolean;
+    thHeaderVertical?: Array<HeaderVertical>;
+    isCellRendering?: boolean;
+    cellNumberInRow?: number;
+    border?: boolean;
+    stickyColumnNumber?: number;
+}
+export declare function PHXTableVertical({ border, cellNumberInRow, filterLoading, isCellRendering, isQueryDataCenter, list, setHeaderLoading, stickyColumnNumber, thBody, thBodyComponent, thHeader, thHeaderComponent, thHeaderVertical, typeLoading, }: Readonly<MainTableProps>): React.JSX.Element;
+export {};

package/dist/esm/components/TableVertical/TableVertical.js

@@ -0,0 +1,138 @@
+'use client';
+import { __awaiter, __generator, __spreadArray } from "tslib";
+import Cookies from 'js-cookie';
+import React, { useEffect, useState } from 'react';
+import { RowTable } from './RowTable';
+import { useStickyLefts } from './useStickyLeft';
+import PHXClientQueryDataCenterV3 from '../Func/clientQueryDataCenterV3';
+import PHXClientQueryV3 from '../Func/clientQueryV3';
+import { classNames } from '../types';
+import { PHXSkeleton } from '../Skeleton';
+import EmptySearchResult from './EmptySearchResult';
+import { PHXEmptyRecord } from '../EmptyRecord';
+export var AUTH_TOKEN = 'authToken';
+export function PHXTableVertical(_a) {
+    var _this = this;
+    var _b = _a.border, border = _b === void 0 ? false : _b, _c = _a.cellNumberInRow, cellNumberInRow = _c === void 0 ? 0 : _c, _d = _a.filterLoading, filterLoading = _d === void 0 ? false : _d, _e = _a.isCellRendering, isCellRendering = _e === void 0 ? false : _e, isQueryDataCenter = _a.isQueryDataCenter, list = _a.list, setHeaderLoading = _a.setHeaderLoading, _f = _a.stickyColumnNumber, stickyColumnNumber = _f === void 0 ? 0 : _f, thBody = _a.thBody, thBodyComponent = _a.thBodyComponent, thHeader = _a.thHeader, thHeaderComponent = _a.thHeaderComponent, thHeaderVertical = _a.thHeaderVertical, _g = _a.typeLoading, typeLoading = _g === void 0 ? { type: 'table' } : _g;
+    var _h = useState(true), isMainLoading = _h[0], setIsMainLoading = _h[1];
+    var _j = useState([]), dataTableQuery = _j[0], setDataTableQuery = _j[1];
+    var _k = useStickyLefts(stickyColumnNumber, dataTableQuery), lefts = _k.lefts, refs = _k.refs;
+    var headerEmptyLength = thHeader.filter(function (item) { return !item; }).length;
+    var getToken = function () {
+        if (typeof window !== 'undefined') {
+            var authTokenInfo_1 = Cookies.get(AUTH_TOKEN) && JSON.parse(Cookies.get(AUTH_TOKEN));
+            return 'Bearer' + ' ' + authTokenInfo_1.token;
+        }
+        else {
+            return;
+        }
+    };
+    var authTokenInfo = getToken();
+    var getData = function (result) { return result.data; };
+    var bindDataToTable = function (dataTable) {
+        // @ts-ignore
+        var data = __spreadArray([], dataTable, true);
+        setDataTableQuery(data);
+    };
+    var chunkArray = function (arr, chunkSize) {
+        var chunks = [];
+        for (var i = 0; i < arr.length; i += chunkSize) {
+            chunks.push(arr.slice(i, i + chunkSize));
+        }
+        return chunks;
+    };
+    var queryData = function () { return __awaiter(_this, void 0, void 0, function () {
+        var data, _a, _b, dataTable, chunkedData, e_1;
+        return __generator(this, function (_c) {
+            switch (_c.label) {
+                case 0:
+                    _c.trys.push([0, 5, , 6]);
+                    if (!authTokenInfo)
+                        return [2 /*return*/];
+                    _a = getData;
+                    if (!isQueryDataCenter) return [3 /*break*/, 2];
+                    return [4 /*yield*/, PHXClientQueryDataCenterV3({
+                            query: list.query
+                        })];
+                case 1:
+                    _b = _c.sent();
+                    return [3 /*break*/, 4];
+                case 2: return [4 /*yield*/, PHXClientQueryV3({
+                        query: list.query
+                    })];
+                case 3:
+                    _b = _c.sent();
+                    _c.label = 4;
+                case 4:
+                    data = _a.apply(void 0, [_b]);
+                    if (!data)
+                        return [2 /*return*/];
+                    setIsMainLoading(true);
+                    dataTable = list.keyResult;
+                    if (isCellRendering && cellNumberInRow) {
+                        chunkedData = chunkArray(data[dataTable], cellNumberInRow);
+                        bindDataToTable(chunkedData);
+                    }
+                    else {
+                        bindDataToTable(data[dataTable]);
+                    }
+                    setIsMainLoading(false);
+                    if (setHeaderLoading)
+                        setHeaderLoading();
+                    return [3 /*break*/, 6];
+                case 5:
+                    e_1 = _c.sent();
+                    console.log(e_1);
+                    return [3 /*break*/, 6];
+                case 6: return [2 /*return*/];
+            }
+        });
+    }); };
+    useEffect(function () {
+        queryData();
+    }, []);
+    useEffect(function () {
+        if (filterLoading) {
+            queryData();
+            setIsMainLoading(true);
+        }
+    }, [list]);
+    return (React.createElement(React.Fragment, null, isMainLoading ? (React.createElement(PHXSkeleton, { filterQty: typeLoading === null || typeLoading === void 0 ? void 0 : typeLoading.filterQty, reportQty: typeLoading === null || typeLoading === void 0 ? void 0 : typeLoading.reportQty, type: typeLoading.type })) : (React.createElement(React.Fragment, null,
+        React.createElement("div", { className: 'rounded-lg bg-white shadow ring-1 ring-black ring-opacity-5' },
+            React.createElement("div", { className: 'flex flex-col' }, dataTableQuery.length > 0 ? (React.createElement("div", null, !isMainLoading ? (React.createElement("div", { className: 'overflow-x-auto rounded-lg' },
+                React.createElement("div", { className: classNames('min-w-full align-middle shadow ring-black ring-opacity-5') },
+                    React.createElement("div", { className: classNames('relative overflow-auto ') },
+                        React.createElement("table", { className: classNames(
+                            // @ts-ignore
+                            thHeader.length < 5
+                                ? 'min-w-full table-fixed border-separate border-spacing-0 divide-y divide-gray-300'
+                                : 'min-w-full') },
+                            thHeaderComponent ? (thHeaderComponent) : (React.createElement("thead", null,
+                                React.createElement("tr", null, thHeader.map(function (item, index) {
+                                    return index === 0 ? (React.createElement("th", { key: index, 
+                                        // @ts-ignore
+                                        ref: function (el) { return (refs.current[0] = el); }, className: classNames('rounded-tl-lg bg-gray-50 px-3 py-2 text-left align-top text-xs font-medium text-gray-500', item ? 'min-w-[160px]' : 'min-w-12', stickyColumnNumber && 'sticky left-0 top-0 z-20'), scope: 'col', style: stickyColumnNumber ? { left: lefts[0] } : {} }, item)) : (React.createElement("th", { key: index, 
+                                        // @ts-ignore
+                                        ref: function (el) { return (refs.current[index] = el); }, className: classNames('min-w-[135px] bg-gray-50 px-3 py-2 text-left align-top text-xs font-medium text-gray-500', index === thHeader.length - 1 && 'rounded-tr-lg', stickyColumnNumber &&
+                                            index < stickyColumnNumber &&
+                                            'sticky top-0 drop-shadow-[4px_0_4px_rgba(0,0,0,0.1)]', border && item && 'border-l'), scope: 'col', style: stickyColumnNumber && index < stickyColumnNumber ? { left: lefts[index] } : {} }, item));
+                                })))),
+                            React.createElement("tbody", { className: 'divide-y divide-gray-200' },
+                                React.createElement(React.Fragment, null, !thHeaderVertical ? (React.createElement(React.Fragment, null, dataTableQuery.map(function (item) { return (React.createElement("tr", { key: item.id }, thBody.map(function (_, bodyIndex) { return (React.createElement(React.Fragment, null,
+                                    React.createElement(RowTable, { key: bodyIndex, bodyIndex: bodyIndex, border: border, itemBody: item, lefts: lefts, refs: refs, stickyColumnNumber: stickyColumnNumber, thBody: thBody, thBodyComponent: thBodyComponent }))); }))); }))) : (React.createElement(React.Fragment, null, thHeaderVertical.map(function (item, index) {
+                                    var _a, _b;
+                                    return (React.createElement("tr", { key: index, className: 'hover:cursor-default' },
+                                        item.parent_name && (React.createElement("td", { className: 'sticky top-0 whitespace-nowrap rounded-bl-lg border-r border-t bg-white px-2 text-xs font-semibold text-gray-900', rowSpan: item.parent_row, style: { left: lefts[0] } }, item.parent_name)),
+                                        React.createElement("td", { className: 'sticky top-0 whitespace-nowrap border-r border-t bg-white text-xs text-gray-900 drop-shadow-[4px_0_4px_rgba(0,0,0,0.1)]', style: { left: lefts[1] } },
+                                            React.createElement("div", { className: 'flex flex-col justify-center px-2' }, item.name)),
+                                        ((_a = dataTableQuery[index]) === null || _a === void 0 ? void 0 : _a.length) > 0
+                                            ? (_b = dataTableQuery[index]) === null || _b === void 0 ? void 0 : _b.map(function (itemChunk, indexChunk) {
+                                                var isFunctionRender = thBodyComponent
+                                                    ? thBodyComponent[thHeader[indexChunk + headerEmptyLength]]
+                                                    : undefined;
+                                                return (React.createElement("td", { key: indexChunk + 1, className: classNames('border-r border-t px-3 py-2 text-xs text-gray-900') }, isFunctionRender ? isFunctionRender(itemChunk, itemChunk) : ''));
+                                            })
+                                            : __spreadArray([], Array(cellNumberInRow), true).map(function (_, indexArr) { return (React.createElement("td", { key: indexArr + 1, className: classNames('px-3 py-2 text-sm text-gray-500', border && 'border-r border-t ') }, "Ch\u01B0a c\u00F3 d\u1EEF li\u1EC7u")); })));
+                                })))))))))) : (React.createElement(EmptySearchResult, null)))) : (React.createElement(PHXEmptyRecord, null))))))));
+}
+//# sourceMappingURL=TableVertical.js.map

package/dist/esm/components/TableVertical/TableVertical.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableVertical.js","sourceRoot":"","sources":["../../../../src/components/TableVertical/TableVertical.tsx"],"names":[],"mappings":"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"}

package/dist/esm/components/TableVertical/index.d.ts

@@ -0,0 +1 @@
+export * from './TableVertical';

package/dist/esm/components/TableVertical/index.js

@@ -0,0 +1,2 @@
+export * from './TableVertical';
+//# sourceMappingURL=index.js.map

package/dist/esm/components/TableVertical/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/TableVertical/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAA"}

package/dist/esm/components/TableVertical/useStickyLeft.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+export declare const useStickyLefts: (count: number, dataTable: any) => {
+    refs: import("react").MutableRefObject<(HTMLTableCellElement | null)[]>;
+    lefts: number[];
+};

package/dist/esm/components/TableVertical/useStickyLeft.js

@@ -0,0 +1,36 @@
+import { useEffect, useRef, useState } from 'react';
+export var useStickyLefts = function (count, dataTable) {
+    var refs = useRef([]);
+    var _a = useState([]), lefts = _a[0], setLefts = _a[1];
+    useEffect(function () {
+        var calculateLefts = function () {
+            var _a;
+            var newLefts = [];
+            var acc = 0;
+            for (var i = 0; i < count; i++) {
+                var width = ((_a = refs.current[i]) === null || _a === void 0 ? void 0 : _a.offsetWidth) || 0;
+                newLefts[i] = acc;
+                acc += width;
+            }
+            setLefts(newLefts);
+        };
+        // Initial calculate
+        calculateLefts();
+        // ResizeObserver để lắng nghe thay đổi kích thước từng ref
+        var observers = [];
+        refs.current.slice(0, count).forEach(function (cell) {
+            if (!cell)
+                return;
+            var observer = new ResizeObserver(function () {
+                calculateLefts();
+            });
+            observer.observe(cell);
+            observers.push(observer);
+        });
+        return function () {
+            observers.forEach(function (observer) { return observer.disconnect(); });
+        };
+    }, [count, dataTable]);
+    return { refs: refs, lefts: lefts };
+};
+//# sourceMappingURL=useStickyLeft.js.map

package/dist/esm/components/TableVertical/useStickyLeft.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useStickyLeft.js","sourceRoot":"","sources":["../../../../src/components/TableVertical/useStickyLeft.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAEnD,MAAM,CAAC,IAAM,cAAc,GAAG,UAAC,KAAa,EAAE,SAAc;IAC1D,IAAM,IAAI,GAAG,MAAM,CAAqC,EAAE,CAAC,CAAA;IACrD,IAAA,KAAoB,QAAQ,CAAgB,EAAE,CAAC,EAA9C,KAAK,QAAA,EAAE,QAAQ,QAA+B,CAAA;IAErD,SAAS,CAAC;QACR,IAAM,cAAc,GAAG;;YACrB,IAAM,QAAQ,GAAkB,EAAE,CAAA;YAClC,IAAI,GAAG,GAAG,CAAC,CAAA;YACX,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,KAAK,EAAE,CAAC,EAAE,EAAE;gBAC9B,IAAM,KAAK,GAAG,CAAA,MAAA,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,0CAAE,WAAW,KAAI,CAAC,CAAA;gBAC/C,QAAQ,CAAC,CAAC,CAAC,GAAG,GAAG,CAAA;gBACjB,GAAG,IAAI,KAAK,CAAA;aACb;YACD,QAAQ,CAAC,QAAQ,CAAC,CAAA;QACpB,CAAC,CAAA;QAED,oBAAoB;QACpB,cAAc,EAAE,CAAA;QAEhB,2DAA2D;QAC3D,IAAM,SAAS,GAA0B,EAAE,CAAA;QAE3C,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,CAAC,CAAC,OAAO,CAAC,UAAC,IAAI;YACxC,IAAI,CAAC,IAAI;gBAAE,OAAM;YACjB,IAAM,QAAQ,GAAG,IAAI,cAAc,CAAC;gBAClC,cAAc,EAAE,CAAA;YAClB,CAAC,CAAC,CAAA;YACF,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,CAAA;YACtB,SAAS,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAA;QAC1B,CAAC,CAAC,CAAA;QAEF,OAAO;YACL,SAAS,CAAC,OAAO,CAAC,UAAC,QAAQ,IAAK,OAAA,QAAQ,CAAC,UAAU,EAAE,EAArB,CAAqB,CAAC,CAAA;QACxD,CAAC,CAAA;IACH,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,CAAC,CAAC,CAAA;IAEtB,OAAO,EAAE,IAAI,MAAA,EAAE,KAAK,OAAA,EAAE,CAAA;AACxB,CAAC,CAAA"}

package/dist/esm/index.d.ts

@@ -66,4 +66,5 @@ import { PHXLoadingProvider, useLoading } from './components/LoadingProvider';
 import PHXLoadingIndicator from './components/LoadingIndicator/loading-indicator';
 import PHXLink from './components/Link/link';
 import { PHXSwitchView } from './components/SwitchView';
-export { PHXButton, PHXCard, PHXSpinner, PHXFormWrap, PHXHeaderBar, PHXTableV3, PHXInput, PHXSelect, PHXSelectBox, PHXRadio, PHXCheckbox, PHXCheckboxGroup, PHXContainer, PHXFormStep, PHXNotifications, PHXStep, PHXSkeleton, PHXFuncGetLoggedInfo, PHXClientQuery, PHXClientMutation, PHXClientQueryV3, PHXClientMutationV3, PHXClientMutationDataCenterV3, PHXClientQueryDataCenterV3, PHXTextarea, PHXModal, PHXTabs, PHXChoiceList, PHXDescriptionLists, PHXBadge, PHXLoginV3, PHXLoginSsoV3, PHXBanner, PHXButtonGroup, PHXCombobox, PHXFormLayout, PHXHorizontalStack, PHXUploadFile, PHXSearchResultListV3, PHXDatePicker, PHXEmptyRecord, PHXTimePicker, PHXDropdown, PHXUploadAvatar, PHXDateRangePicker, PHXUseDebounce, PHXResourceList, PHXFetchAPI, PBFMainWrap, PieChart, BarChart, DonutChart, PHXTooltip, PHXGetActiveYearAndNextYearV3, PHXGetCurrentYearWithTermHocVuV3, PHXGetCurrentYearWithTermV3, PHXLogUserActivityV3, PHXFormTuitionV3, PHXMainWrapV3, PHXPagePermissionV3, PHXGetEnvPublicV3, PHXFuncGetActionPermissionV3, PHXUseQueryDataV3, PHXCalendar, PHXLoadingProvider, useLoading, PHXLoadingIndicator, PHXLink, PHXSwitchView, };
+import { PHXTableVertical } from './components/TableVertical';
+export { PHXButton, PHXCard, PHXSpinner, PHXFormWrap, PHXHeaderBar, PHXTableV3, PHXInput, PHXSelect, PHXSelectBox, PHXRadio, PHXCheckbox, PHXCheckboxGroup, PHXContainer, PHXFormStep, PHXNotifications, PHXStep, PHXSkeleton, PHXFuncGetLoggedInfo, PHXClientQuery, PHXClientMutation, PHXClientQueryV3, PHXClientMutationV3, PHXClientMutationDataCenterV3, PHXClientQueryDataCenterV3, PHXTextarea, PHXModal, PHXTabs, PHXChoiceList, PHXDescriptionLists, PHXBadge, PHXLoginV3, PHXLoginSsoV3, PHXBanner, PHXButtonGroup, PHXCombobox, PHXFormLayout, PHXHorizontalStack, PHXUploadFile, PHXSearchResultListV3, PHXDatePicker, PHXEmptyRecord, PHXTimePicker, PHXDropdown, PHXUploadAvatar, PHXDateRangePicker, PHXUseDebounce, PHXResourceList, PHXFetchAPI, PBFMainWrap, PieChart, BarChart, DonutChart, PHXTooltip, PHXGetActiveYearAndNextYearV3, PHXGetCurrentYearWithTermHocVuV3, PHXGetCurrentYearWithTermV3, PHXLogUserActivityV3, PHXFormTuitionV3, PHXMainWrapV3, PHXPagePermissionV3, PHXGetEnvPublicV3, PHXFuncGetActionPermissionV3, PHXUseQueryDataV3, PHXCalendar, PHXLoadingProvider, useLoading, PHXLoadingIndicator, PHXLink, PHXSwitchView, PHXTableVertical, };

package/dist/esm/index.js

@@ -66,5 +66,6 @@ import { PHXLoadingProvider, useLoading } from './components/LoadingProvider';
 import PHXLoadingIndicator from './components/LoadingIndicator/loading-indicator';
 import PHXLink from './components/Link/link';
 import { PHXSwitchView } from './components/SwitchView';
-export { PHXButton, PHXCard, PHXSpinner, PHXFormWrap, PHXHeaderBar, PHXTableV3, PHXInput, PHXSelect, PHXSelectBox, PHXRadio, PHXCheckbox, PHXCheckboxGroup, PHXContainer, PHXFormStep, PHXNotifications, PHXStep, PHXSkeleton, PHXFuncGetLoggedInfo, PHXClientQuery, PHXClientMutation, PHXClientQueryV3, PHXClientMutationV3, PHXClientMutationDataCenterV3, PHXClientQueryDataCenterV3, PHXTextarea, PHXModal, PHXTabs, PHXChoiceList, PHXDescriptionLists, PHXBadge, PHXLoginV3, PHXLoginSsoV3, PHXBanner, PHXButtonGroup, PHXCombobox, PHXFormLayout, PHXHorizontalStack, PHXUploadFile, PHXSearchResultListV3, PHXDatePicker, PHXEmptyRecord, PHXTimePicker, PHXDropdown, PHXUploadAvatar, PHXDateRangePicker, PHXUseDebounce, PHXResourceList, PHXFetchAPI, PBFMainWrap, PieChart, BarChart, DonutChart, PHXTooltip, PHXGetActiveYearAndNextYearV3, PHXGetCurrentYearWithTermHocVuV3, PHXGetCurrentYearWithTermV3, PHXLogUserActivityV3, PHXFormTuitionV3, PHXMainWrapV3, PHXPagePermissionV3, PHXGetEnvPublicV3, PHXFuncGetActionPermissionV3, PHXUseQueryDataV3, PHXCalendar, PHXLoadingProvider, useLoading, PHXLoadingIndicator, PHXLink, PHXSwitchView, };
+import { PHXTableVertical } from './components/TableVertical';
+export { PHXButton, PHXCard, PHXSpinner, PHXFormWrap, PHXHeaderBar, PHXTableV3, PHXInput, PHXSelect, PHXSelectBox, PHXRadio, PHXCheckbox, PHXCheckboxGroup, PHXContainer, PHXFormStep, PHXNotifications, PHXStep, PHXSkeleton, PHXFuncGetLoggedInfo, PHXClientQuery, PHXClientMutation, PHXClientQueryV3, PHXClientMutationV3, PHXClientMutationDataCenterV3, PHXClientQueryDataCenterV3, PHXTextarea, PHXModal, PHXTabs, PHXChoiceList, PHXDescriptionLists, PHXBadge, PHXLoginV3, PHXLoginSsoV3, PHXBanner, PHXButtonGroup, PHXCombobox, PHXFormLayout, PHXHorizontalStack, PHXUploadFile, PHXSearchResultListV3, PHXDatePicker, PHXEmptyRecord, PHXTimePicker, PHXDropdown, PHXUploadAvatar, PHXDateRangePicker, PHXUseDebounce, PHXResourceList, PHXFetchAPI, PBFMainWrap, PieChart, BarChart, DonutChart, PHXTooltip, PHXGetActiveYearAndNextYearV3, PHXGetCurrentYearWithTermHocVuV3, PHXGetCurrentYearWithTermV3, PHXLogUserActivityV3, PHXFormTuitionV3, PHXMainWrapV3, PHXPagePermissionV3, PHXGetEnvPublicV3, PHXFuncGetActionPermissionV3, PHXUseQueryDataV3, PHXCalendar, PHXLoadingProvider, useLoading, PHXLoadingIndicator, PHXLink, PHXSwitchView, PHXTableVertical, };
 //# sourceMappingURL=index.js.map

package/dist/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "phx-react",
-  "version": "1.3.804",
+  "version": "1.3.805",
   "description": "PHX REACT",
   "main": "./dist/cjs/index.js",
   "module": "./dist/esm/index.js",