@appcorp/app-corp-vista 0.1.46 → 0.1.48

package/organisms/vista-table-v1/vista-table-body-v1.d.ts

@@ -0,0 +1,8 @@
+import { FC } from 'react';
+import { VistaTableV1Props } from '../../type/vista-table-type';
+export declare const TOOLTIP_OFFSET = -8;
+export declare const rowClasses = "odd:bg-gray-100 even:bg-gray-200 hover:bg-gray-300 dark:odd:bg-gray-800 dark:even:bg-gray-700 dark:hover:bg-gray-600";
+export declare const dataClasses = "p-2 cursor-pointer";
+export declare const VistaTableBodyV1: FC<Pick<VistaTableV1Props, 'tableBodyRows' | 'tableBodyCols' | 'pageLimit' | 'loading' | 'rowActions'> & {
+    colLength: number;
+}>;

package/organisms/vista-table-v1/vista-table-body-v1.js

@@ -0,0 +1,102 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+var _a;
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.VistaTableBodyV1 = exports.dataClasses = exports.rowClasses = exports.TOOLTIP_OFFSET = void 0;
+var react_1 = __importStar(require("react"));
+var util_functions_1 = require("@react-pakistan/util-functions");
+var react_tooltip_1 = require("react-tooltip");
+var vista_table_cell_v1_1 = require("../../atoms/table-cell-v1/vista-table-cell-v1");
+var vista_dropdown_menu_v1_1 = require("../../molecules/vista-dropdown-menu-v1/vista-dropdown-menu-v1");
+var vista_shimmer_v1_1 = require("../../atoms/vista-shimmer-v1/vista-shimmer-v1");
+var vista_table_type_1 = require("../../type/vista-table-type");
+exports.TOOLTIP_OFFSET = -8;
+exports.rowClasses = 'odd:bg-gray-100 even:bg-gray-200 hover:bg-gray-300 dark:odd:bg-gray-800 dark:even:bg-gray-700 dark:hover:bg-gray-600';
+exports.dataClasses = 'p-2 cursor-pointer';
+var componentMap = (_a = {},
+    _a[vista_table_type_1.VISTA_TABLE_CELL_TYPE.ID] = function (val) { return (react_1.default.createElement("td", { className: exports.dataClasses, "data-tooltip-id": val },
+        react_1.default.createElement(vista_table_cell_v1_1.VistaTableCellV1, { label: (0, util_functions_1.truncateText)(val, 3), id: val, isBold: true }),
+        react_1.default.createElement(react_tooltip_1.Tooltip, { id: val, offset: exports.TOOLTIP_OFFSET, place: "top-start" },
+            react_1.default.createElement(vista_table_cell_v1_1.VistaTableCellV1, { label: val, isBold: true })))); },
+    _a[vista_table_type_1.VISTA_TABLE_CELL_TYPE.BOLD_TEXT] = function (val) { return (react_1.default.createElement("td", { className: exports.dataClasses },
+        react_1.default.createElement(vista_table_cell_v1_1.VistaTableCellV1, { label: val, isBold: true }))); },
+    _a[vista_table_type_1.VISTA_TABLE_CELL_TYPE.TEXT] = function (val) { return (react_1.default.createElement("td", { className: exports.dataClasses },
+        react_1.default.createElement(vista_table_cell_v1_1.VistaTableCellV1, { label: val }))); },
+    _a[vista_table_type_1.VISTA_TABLE_CELL_TYPE.CREATED_UPDATED_AT] = function (val) {
+        var _a = val.split(util_functions_1.VALUE_DELIMITER.DOLLAR), createdAt = _a[0], updatedAt = _a[1];
+        return (react_1.default.createElement("td", { className: exports.dataClasses },
+            react_1.default.createElement(vista_table_cell_v1_1.VistaTableCellV1, { label: (0, util_functions_1.formatDate)(createdAt, util_functions_1.DATE_FORMATS.LOCALE_DATE) }),
+            react_1.default.createElement(vista_table_cell_v1_1.VistaTableCellV1, { label: (0, util_functions_1.formatDate)(updatedAt, util_functions_1.DATE_FORMATS.LOCALE_DATE) })));
+    },
+    _a[vista_table_type_1.VISTA_TABLE_CELL_TYPE.ACTIONS] = function (id, rowActions) { return (react_1.default.createElement("td", { className: exports.dataClasses },
+        react_1.default.createElement("div", { className: "flex flex-row justify-center" },
+            react_1.default.createElement(vista_dropdown_menu_v1_1.VistaDropdownMenuV1, { assetId: id, rowActions: rowActions })))); },
+    _a[vista_table_type_1.VISTA_TABLE_CELL_TYPE.IMAGE] = function () { return (react_1.default.createElement(react_1.default.Fragment, null)); },
+    _a);
+var VistaTableBodyV1 = function (_a) {
+    var colLength = _a.colLength, loading = _a.loading, pageLimit = _a.pageLimit, tableBodyCols = _a.tableBodyCols, tableBodyRows = _a.tableBodyRows, rowActions = _a.rowActions;
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        loading &&
+            new Array(Number(pageLimit)).fill(1).map(function (_, i) {
+                return (react_1.default.createElement("tr", { key: i, className: exports.rowClasses }, new Array(colLength).fill(1).map(function (_, _i) {
+                    return (react_1.default.createElement("td", { key: _i, className: exports.dataClasses },
+                        react_1.default.createElement(vista_shimmer_v1_1.VistaShimmer, null)));
+                })));
+            }),
+        !loading && (tableBodyRows === null || tableBodyRows === void 0 ? void 0 : tableBodyRows.map(function (row) {
+            return (react_1.default.createElement("tr", { key: row.id, className: exports.rowClasses }, tableBodyCols.map(function (_a, ind) {
+                var _b;
+                var key = _a.key, componentType = _a.componentType, expression = _a.expression;
+                var computedValue = '';
+                if (Array.isArray(key)) {
+                    computedValue = row[key[0]][key[1]];
+                }
+                else {
+                    computedValue = row[key];
+                }
+                if (componentType === vista_table_type_1.VISTA_TABLE_CELL_TYPE.CREATED_UPDATED_AT) {
+                    computedValue = "".concat(row['createdAt']).concat(util_functions_1.VALUE_DELIMITER.DOLLAR).concat(row['updatedAt']);
+                }
+                if (componentType === vista_table_type_1.VISTA_TABLE_CELL_TYPE.ACTIONS) {
+                    computedValue = row.id;
+                }
+                if (expression) {
+                    computedValue = expression(row[key]);
+                }
+                return (react_1.default.createElement(react_1.Fragment, { key: "".concat(computedValue, "-").concat(ind) }, (_b = componentMap[componentType]) === null || _b === void 0 ? void 0 : _b.call(componentMap, computedValue, rowActions)));
+            })));
+        }))));
+};
+exports.VistaTableBodyV1 = VistaTableBodyV1;

package/organisms/vista-table-v1/vista-table-head-v1.d.ts

@@ -0,0 +1,5 @@
+import { FC } from "react";
+import { TableHeadItemV1 } from "../../type/vista-table-type";
+export declare const VistaTableHeadV1: FC<{
+    items: TableHeadItemV1[];
+}>;

package/organisms/vista-table-v1/vista-table-head-v1.js

@@ -0,0 +1,17 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.VistaTableHeadV1 = void 0;
+var react_1 = __importDefault(require("react"));
+var vista_table_cell_v1_1 = require("../../atoms/table-cell-v1/vista-table-cell-v1");
+var VistaTableHeadV1 = function (_a) {
+    var items = _a.items;
+    return (react_1.default.createElement("tr", null, items.map(function (_a) {
+        var label = _a.label, width = _a.width;
+        return (react_1.default.createElement("th", { className: "border-b border-gray-300 p-2", key: label, scope: "col", style: { width: width } },
+            react_1.default.createElement(vista_table_cell_v1_1.VistaTableCellV1, { label: label, isBold: true })));
+    })));
+};
+exports.VistaTableHeadV1 = VistaTableHeadV1;

package/organisms/vista-table-v1/vista-table-v1.js

@@ -7,14 +7,18 @@ exports.VistaTableV1 = void 0;
 var react_1 = __importDefault(require("react"));
 var vista_table_header_v1_1 = require("../../molecules/vista-table-header-v1");
 var vista_table_footer_v1_1 = require("../../molecules/vista-table-footer-v1");
+var vista_table_head_v1_1 = require("./vista-table-head-v1");
+var vista_table_body_v1_1 = require("./vista-table-body-v1");
 var VistaTableV1 = function (_a) {
-    var currentPage = _a.currentPage, handleNextOnClick = _a.handleNextOnClick, handleOnSelect = _a.handleOnSelect, handlePreviousOnClick = _a.handlePreviousOnClick, handleSearchInput = _a.handleSearchInput, handleSuffixOnClick = _a.handleSuffixOnClick, headerActions = _a.headerActions, isNextDisabled = _a.isNextDisabled, isPreviousDisabled = _a.isPreviousDisabled, listOptions = _a.listOptions, nodeSelectedKey = _a.nodeSelectedKey, searchDisabled = _a.searchDisabled, _b = _a.searchEnabled, searchEnabled = _b === void 0 ? false : _b, searchId = _a.searchId, searchPlaceholder = _a.searchPlaceholder, searchValue = _a.searchValue, selectKey1 = _a.selectKey1, selectKey2 = _a.selectKey2, selectedItem = _a.selectedItem, tableBody = _a.tableBody, tableDescription = _a.tableDescription, tableHead = _a.tableHead, tableHeading = _a.tableHeading, totalPages = _a.totalPages;
+    var currentPage = _a.currentPage, handleNextOnClick = _a.handleNextOnClick, handleOnSelect = _a.handleOnSelect, handlePreviousOnClick = _a.handlePreviousOnClick, handleSearchInput = _a.handleSearchInput, handleSuffixOnClick = _a.handleSuffixOnClick, headerActions = _a.headerActions, isNextDisabled = _a.isNextDisabled, isPreviousDisabled = _a.isPreviousDisabled, listOptions = _a.listOptions, loading = _a.loading, nodeSelectedKey = _a.nodeSelectedKey, pageLimit = _a.pageLimit, rowActions = _a.rowActions, searchDisabled = _a.searchDisabled, _b = _a.searchEnabled, searchEnabled = _b === void 0 ? false : _b, searchId = _a.searchId, searchPlaceholder = _a.searchPlaceholder, searchValue = _a.searchValue, selectKey1 = _a.selectKey1, selectKey2 = _a.selectKey2, selectedItem = _a.selectedItem, tableBodyCols = _a.tableBodyCols, tableBodyRows = _a.tableBodyRows, tableDescription = _a.tableDescription, tableHeadItems = _a.tableHeadItems, tableHeading = _a.tableHeading, totalPages = _a.totalPages;
     return (react_1.default.createElement("div", null,
         react_1.default.createElement(vista_table_header_v1_1.VistaTableHeaderV1, { handleSearchInput: handleSearchInput, handleSuffixOnClick: handleSuffixOnClick, headerActions: headerActions, searchDisabled: searchDisabled, searchEnabled: searchEnabled, searchId: searchId, searchPlaceholder: searchPlaceholder, searchValue: searchValue, tableDescription: tableDescription, tableHeading: tableHeading }),
         react_1.default.createElement("div", { className: "mt-8 inline-block min-w-full py-2 align-middle" },
             react_1.default.createElement("table", { className: "min-w-full divide-y divide-gray-700" },
-                react_1.default.createElement("thead", null, tableHead),
-                react_1.default.createElement("tbody", { className: "divide-y divide-gray-700 overflow-y-auto" }, tableBody)),
+                react_1.default.createElement("thead", null,
+                    react_1.default.createElement(vista_table_head_v1_1.VistaTableHeadV1, { items: tableHeadItems })),
+                react_1.default.createElement("tbody", { className: "divide-y divide-gray-700 overflow-y-auto" },
+                    react_1.default.createElement(vista_table_body_v1_1.VistaTableBodyV1, { colLength: tableHeadItems.length, loading: loading, pageLimit: pageLimit, rowActions: rowActions, tableBodyCols: tableBodyCols, tableBodyRows: tableBodyRows }))),
             react_1.default.createElement(vista_table_footer_v1_1.VistaTableFooterV1, { currentPage: currentPage, handleNextOnClick: handleNextOnClick, handleOnSelect: handleOnSelect, handlePreviousOnClick: handlePreviousOnClick, isNextDisabled: isNextDisabled, isPreviousDisabled: isPreviousDisabled, listOptions: listOptions, nodeSelectedKey: nodeSelectedKey, selectKey1: selectKey1, selectKey2: selectKey2, selectedItem: selectedItem, totalPages: totalPages }))));
 };
 exports.VistaTableV1 = VistaTableV1;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@appcorp/app-corp-vista",
-  "version": "0.1.46",
+  "version": "0.1.48",
   "scripts": {
     "build": "yarn clean && yarn build:ts && cp package.json lib && cp README.md lib",
     "build:next": "next build",
@@ -74,12 +74,13 @@
     "husky": "^9.1.7",
     "next": "^15",
     "next-intl": "^3.26.3",
-    "next-themes": "^0.4.4",
+    "next-themes": "^0.4.6",
     "postcss": "^8",
     "react": "^19",
     "react-copy-to-clipboard": "^5.1.0",
     "react-dom": "^19",
     "react-slick": "^0.30.3",
+    "react-tooltip": "^5.28.1",
     "slick-carousel": "^1.8.1",
     "storybook": "^8",
     "swr": "^2.3.0",

package/type/vista-table-type.d.ts

@@ -1,4 +1,5 @@
 import { ReactNode } from "react";
+import { RowActionItem } from "./vista-dropdown-menu-type";
 export interface VistaTableHeaderActionItem {
     enabled: boolean;
     handleOnClick: () => void;
@@ -6,6 +7,18 @@ export interface VistaTableHeaderActionItem {
     label: string;
     order: number;
 }
+export interface TableHeadItemV1 {
+    label: string;
+    width: string;
+}
+export declare enum VISTA_TABLE_CELL_TYPE {
+    ACTIONS = "ACTIONS",
+    BOLD_TEXT = "BOLD_TEXT",
+    CREATED_UPDATED_AT = "CREATED_UPDATED_AT",
+    ID = "ID",
+    IMAGE = "IMAGE",
+    TEXT = "TEXT"
+}
 export interface VistaTableV1Props {
     currentPage: number;
     handleNextOnClick: () => void;
@@ -17,7 +30,10 @@ export interface VistaTableV1Props {
     isNextDisabled: boolean;
     isPreviousDisabled: boolean;
     listOptions: Object[];
+    loading: boolean;
     nodeSelectedKey: string;
+    pageLimit: number;
+    rowActions: RowActionItem[];
     searchDisabled: boolean;
     searchEnabled?: boolean;
     searchId: string;
@@ -28,9 +44,10 @@ export interface VistaTableV1Props {
     selectedItem: {
         [key: string]: any;
     };
-    tableBody: ReactNode;
+    tableBodyCols: any[];
+    tableBodyRows: any[];
     tableDescription: string;
-    tableHead: ReactNode;
+    tableHeadItems: TableHeadItemV1[];
     tableHeading: string;
     totalPages: number;
 }

package/type/vista-table-type.js

@@ -1,2 +1,12 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.VISTA_TABLE_CELL_TYPE = void 0;
+var VISTA_TABLE_CELL_TYPE;
+(function (VISTA_TABLE_CELL_TYPE) {
+    VISTA_TABLE_CELL_TYPE["ACTIONS"] = "ACTIONS";
+    VISTA_TABLE_CELL_TYPE["BOLD_TEXT"] = "BOLD_TEXT";
+    VISTA_TABLE_CELL_TYPE["CREATED_UPDATED_AT"] = "CREATED_UPDATED_AT";
+    VISTA_TABLE_CELL_TYPE["ID"] = "ID";
+    VISTA_TABLE_CELL_TYPE["IMAGE"] = "IMAGE";
+    VISTA_TABLE_CELL_TYPE["TEXT"] = "TEXT";
+})(VISTA_TABLE_CELL_TYPE || (exports.VISTA_TABLE_CELL_TYPE = VISTA_TABLE_CELL_TYPE = {}));