pixelize-design-library 1.1.13 → 1.1.14

package/dist/App.js

@@ -93,7 +93,7 @@ function App() {
                 react_1.default.createElement(react_2.Box, null,
                     react_1.default.createElement(SideBar_1.default, { menus: menu, activeMenu: activeMenu, handleMenuClick: handleMenuClick, toggle: toggle, changeToggle: function () { return changeToggle(!toggle); }, logo: "https://bit.ly/dan-abramov", companyName: "PIXELIZE" })),
                 react_1.default.createElement(react_2.Box, { flex: "1", maxWidth: width, overflow: "hidden" },
-                    react_1.default.createElement(NavigationBar_1.default, { userAvathar: "https://bit.ly/dan-abramo", userName: "PIXELIZE", navMenu: navmenus, handleNavOnClick: handleNavOnClick, handleLogout: handleLogout, logoutText: "Logout", key: "navbar" }),
+                    react_1.default.createElement(NavigationBar_1.default, { userAvathar: "https://bit.ly/dan-abramo", userName: "PIXELIZE", navMenu: navmenus, handleNavOnClick: handleNavOnClick, handleLogout: handleLogout, logoutText: "Logout", key: "navbar", moreIcon: react_1.default.createElement(fi_1.FiCalendar, null) }),
                     react_1.default.createElement("br", null),
                     react_1.default.createElement(Breadcrumbs_1.default, { separator: react_1.default.createElement(icons_1.ChevronRightIcon, { color: "gray.500" }), items: breadcrumbItems, handleClick: handleClick }),
                     react_1.default.createElement(react_2.Box, { p: "50px", height: height - 160, overflowY: "scroll", width: width - 75 },

package/dist/Components/KaTable/KaTable.d.ts

@@ -8,6 +8,6 @@ import * as TableUtils from "ka-table/utils";
 import * as TableFun from "ka-table";
 import "ka-table/style.css";
 import "./ka-table.css";
-declare const KaTable: ({ columns, data, rowKey, Edit, sorting, format, paging, filter, childComponents, columnReorder, columnResizing, editableCells, validation, loading, checkSelect, onRowClick, onSelectionChange, onSortChange, onMenuItemClick, menuItems, }: KaTableProps) => React.JSX.Element;
+declare const KaTable: ({ columns, data, rowKey, Edit, format, filter, childComponents, columnReorder, columnResizing, editableCells, validation, loading, checkSelect, onRowClick, onSelectionChange, onSortChange, onMenuItemClick, menuItems, }: KaTableProps) => React.JSX.Element;
 export default KaTable;
 export { TableEnums, TableActionCreator, TableProps, TableModel, TableUtils, TableFun, };

package/dist/Components/KaTable/KaTable.js

@@ -65,12 +65,17 @@ require("ka-table/style.css");
 require("./ka-table.css");
 var CustomHeader_1 = __importDefault(require("./CustomHeader"));
 var KaTable = function (_a) {
-    var columns = _a.columns, data = _a.data, _b = _a.rowKey, rowKey = _b === void 0 ? "id" : _b, Edit = _a.Edit, sorting = _a.sorting, format = _a.format, paging = _a.paging, filter = _a.filter, childComponents = _a.childComponents, columnReorder = _a.columnReorder, columnResizing = _a.columnResizing, editableCells = _a.editableCells, validation = _a.validation, loading = _a.loading, checkSelect = _a.checkSelect, onRowClick = _a.onRowClick, onSelectionChange = _a.onSelectionChange, onSortChange = _a.onSortChange, onMenuItemClick = _a.onMenuItemClick, menuItems = _a.menuItems;
+    var columns = _a.columns, data = _a.data, _b = _a.rowKey, rowKey = _b === void 0 ? "id" : _b, Edit = _a.Edit, 
+    // sorting,
+    format = _a.format, 
+    // paging,
+    filter = _a.filter, childComponents = _a.childComponents, columnReorder = _a.columnReorder, columnResizing = _a.columnResizing, editableCells = _a.editableCells, validation = _a.validation, loading = _a.loading, checkSelect = _a.checkSelect, onRowClick = _a.onRowClick, onSelectionChange = _a.onSelectionChange, onSortChange = _a.onSortChange, onMenuItemClick = _a.onMenuItemClick, menuItems = _a.menuItems;
     var selectionCellColumn = {
         key: "select-cell",
-        width: 50,
+        width: 65,
         columnFreeze: true,
         customHeader: false,
+        className: "select-cell",
     };
     if (checkSelect &&
         !columns.some(function (column) { return column.key === "select-cell"; })) {
@@ -84,10 +89,10 @@ var KaTable = function (_a) {
         return 0;
     };
     var SelectionHeader = function () {
-        var _a;
+        var _a, _b;
         var table = TableFun.useTableInstance();
         var areAllRowsSelected = TableUtils.kaPropsUtils.areAllFilteredRowsSelected(table.props);
-        var selectedRows = ((_a = table.props.data) !== null && _a !== void 0 ? _a : []).filter(function (row) { var _a; return ((_a = table.props.selectedRows) !== null && _a !== void 0 ? _a : []).includes(row[rowKey]); });
+        var selectedRows = ((_b = (_a = table === null || table === void 0 ? void 0 : table.props) === null || _a === void 0 ? void 0 : _a.data) !== null && _b !== void 0 ? _b : []).filter(function (row) { var _a; return ((_a = table.props.selectedRows) !== null && _a !== void 0 ? _a : []).includes(row[rowKey]); });
         var areSomeRowsSelected = selectedRows.length > 0 && !areAllRowsSelected;
         var selectAllRef = (0, react_1.useRef)(null);
         var prevSelectedRowsRef = (0, react_1.useRef)([]);
@@ -173,7 +178,7 @@ var KaTable = function (_a) {
                 if (props.column.columnFreeze) {
                     var stickyLeft = getPreviousColumnWidth(props.column.key);
                     return {
-                        style: __assign(__assign({}, props.column.style), { position: "sticky", left: stickyLeft, zIndex: 3, backgroundColor: "#d9d9db" }),
+                        style: __assign(__assign({}, props.column.style), { position: "sticky", left: stickyLeft, zIndex: 3, backgroundColor: "#d9d9db", textAlign: "center" }),
                     };
                 }
             },
@@ -218,7 +223,11 @@ var KaTable = function (_a) {
                 }
             },
         } });
-    return (react_1.default.createElement(ka_table_1.Table, { columns: columns, data: data, rowKeyField: rowKey, editingMode: Edit, sortingMode: sorting, format: format, paging: paging, filteringMode: filter, childComponents: mergedChildComponents, columnReordering: columnReorder, columnResizing: columnResizing, editableCells: editableCells, validation: validation, loading: loading, virtualScrolling: {
+    return (react_1.default.createElement(ka_table_1.Table, { columns: columns, data: data, rowKeyField: rowKey, editingMode: Edit, 
+        // sortingMode={sorting}
+        format: format, 
+        // paging={paging}
+        filteringMode: filter, childComponents: mergedChildComponents, columnReordering: columnReorder, columnResizing: columnResizing, editableCells: editableCells, validation: validation, loading: loading, virtualScrolling: {
             enabled: true,
         } }));
 };

package/dist/Components/KaTable/KaTableProps.d.ts

@@ -3,10 +3,8 @@ export type KaTableProps = {
     data: any;
     rowKey?: any;
     Edit?: any;
-    sorting?: any;
     format?: (props: any) => void;
     validation?: (props: any) => void;
-    paging?: any;
     filter?: any;
     childComponents?: any;
     columnReorder?: any;

package/dist/Components/KaTable/ka-table.css

@@ -1,18 +1,10 @@
-/* .ka-thead {
-  border-left: 5px solid red;
-}
-.ka-tbody,
-.ka-paging {
-  border-left: 5px solid red;
-  border-bottom: none;
-} */
 .ka {
   border-radius: 10px 0 0 10px;
   border-width: 0px 0px 0px 5px;
   border-color: #2caa3d;
 }
 
-.ka-thead-row,
+/* .ka-thead-row,
 .ka-row {
   border: 1px solid #d0d4e4;
 }
@@ -20,15 +12,15 @@
 .ka-thead-cell,
 .ka-cell {
   border-right: 1px solid #d0d4e4;
-}
+} */
 
 .ka-thead-cell {
   text-align: center;
-  padding: 7px 14px;
+  padding: 7px 10px;
 }
-
 .ka-cell {
-  padding: 7px 17px;
+  text-align: center;
+  padding: 7px 0px;
 }
 
 .ka-thead-background {
@@ -40,4 +32,9 @@
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
-}
+}
+.ka-row {
+  box-sizing: unset;
+  border-bottom: none;
+  border-top: none;
+}

package/dist/Components/NavigationBar/NavigationBar.d.ts

@@ -1,3 +1,3 @@
 import React from "react";
 import { NavbarProps } from "./NavigationBarProps";
-export default function NavBar({ userAvathar, userName, navMenu, handleNavOnClick, handleLogout, logoutText, }: NavbarProps): React.JSX.Element;
+export default function NavBar({ userAvathar, userName, navMenu, moreIcon, handleNavOnClick, handleLogout, logoutText, }: NavbarProps): React.JSX.Element;

package/dist/Components/NavigationBar/NavigationBar.js

@@ -8,7 +8,7 @@ var react_2 = require("@chakra-ui/react");
 var useCustomTheme_1 = require("../../Theme/useCustomTheme");
 var io_1 = require("react-icons/io");
 function NavBar(_a) {
-    var userAvathar = _a.userAvathar, userName = _a.userName, navMenu = _a.navMenu, handleNavOnClick = _a.handleNavOnClick, handleLogout = _a.handleLogout, logoutText = _a.logoutText;
+    var userAvathar = _a.userAvathar, userName = _a.userName, navMenu = _a.navMenu, moreIcon = _a.moreIcon, handleNavOnClick = _a.handleNavOnClick, handleLogout = _a.handleLogout, logoutText = _a.logoutText;
     var theme = (0, useCustomTheme_1.useCustomTheme)();
     return (react_1.default.createElement(react_2.Box, { bg: theme.colors.backgroundColor.light, px: 4, boxShadow: theme.shadows.sm },
         react_1.default.createElement(react_2.Flex, { h: 16, alignItems: "center", justifyContent: "space-between" },
@@ -16,6 +16,7 @@ function NavBar(_a) {
             react_1.default.createElement(react_2.Flex, { alignItems: "center" },
                 react_1.default.createElement(react_2.Stack, { direction: "row", spacing: 7 },
                     react_1.default.createElement(react_2.Menu, null,
+                        react_1.default.createElement(react_2.Box, { mt: "0.4rem", cursor: "pointer" }, moreIcon),
                         react_1.default.createElement(react_2.Box, { mt: "0.4rem", cursor: "pointer", position: "relative" },
                             react_1.default.createElement(io_1.IoMdNotificationsOutline, { fontSize: 20 }),
                             react_1.default.createElement(react_2.Box, { position: "absolute", top: "0", right: "0", width: "8px", height: "8px", bg: theme.colors.primary[600], borderRadius: "full" })),

package/dist/Components/NavigationBar/NavigationBarProps.d.ts

@@ -2,6 +2,7 @@ export type NavbarProps = {
     userAvathar: string;
     userName: string;
     navMenu: MenuProps[];
+    moreIcon?: any;
     handleNavOnClick: (url: string) => void;
     handleLogout: () => void;
     logoutText: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pixelize-design-library",
-  "version": "1.1.13",
+  "version": "1.1.14",
   "private": false,
   "main": "dist/index.js",
   "module": "dist/index.js",