@qore-project/urshipper-custom-table-component - npm Package Compare versions

Comparing version 1.1.4 to 1.1.5

.rollup.cache/Users/albarms/Workspace/Feedloop/solution-project-component/urshipper-custom-table/src/urshipper-custom-table.js

@@ -6,3 +6,3 @@ import { __rest } from "tslib";
 import { useTable, useRowSelect, useSortBy, useGlobalFilter } from 'react-table';
-import { Text, TableContainer, Table, Thead, Tr, Th, Tbody, Td, Box, Flex, chakra, Button, IconButton, Popover, PopoverBody, PopoverContent, PopoverTrigger, Portal, Stack, Menu, MenuButton, MenuItem, MenuList, Input, HStack, useDisclosure, useToast, Icon, } from '@chakra-ui/react';
+import { Text, TableContainer, Table, Thead, Tr, Th, Tbody, Td, Box, Flex, chakra, Button, IconButton, Popover, PopoverBody, PopoverContent, PopoverTrigger, Portal, Stack, Menu, MenuButton, MenuItem, MenuList, Input, HStack, useDisclosure, Icon, } from '@chakra-ui/react';
 import { BiChevronDown, BiDotsHorizontal, BiEditAlt, BiPlus, } from 'react-icons/bi';
@@ -37,4 +37,2 @@ import { FaFileInvoice, FaPrint } from 'react-icons/fa';
     const { isOpen, onOpen, onClose } = useDisclosure();
-    const client = props.hooks.useClient();
-    const toast = useToast();
     const { getTableProps, getTableBodyProps, headerGroups, rows, prepareRow, selectedFlatRows, state: { selectedRowIds }, setGlobalFilter, } = useTable({
@@ -92,9 +90,13 @@ columns,
     };
-    return (_jsxs(_Fragment, { children: [_jsx(ActionModal, { isOpen: isOpen, onClose: onClose, rowData: selectedRow }), _jsx(Flex, Object.assign({ w: "100%" }, { children: _jsxs(HStack, Object.assign({ alignItems: 'center', w: "xs" }, { children: [_jsx(IconButton, { onClick: handleClickActionTwo, colorScheme: "blue", "aria-label": "Search database", icon: _jsx(BiPlus, {}) }), _jsx(Input, { type: "text", onChange: handleFilterInputChange, placeholder: "Search here.." })] })) })), _jsx(TableContainer, Object.assign({ p: "5" }, { children: _jsxs(Table, Object.assign({}, getTableProps(), { children: [_jsx(Thead, { children: headerGroups.map((headerGroup, index) => (_jsxs(Tr, Object.assign({}, headerGroup.getHeaderGroupProps(), { children: [index == 0 && _jsx(Th, { children: "action" }), headerGroup.headers.map((column) => (_jsxs(Th, Object.assign({ textTransform: 'capitalize' }, column.getHeaderProps(column.getSortByToggleProps()), { children: [column.render('Header'), _jsx(chakra.span, Object.assign({ pl: "4" }, { children: column.isSorted ? (column.isSortedDesc ? (_jsx(Icon, { as: iconsList['ArrowUp'], "aria-label": "sorted descending" })) : (_jsx(Icon, { as: iconsList['ArrowDown'], "aria-label": "sorted ascending" }))) : null }))] }))))] })))) }), _jsx(Tbody, Object.assign({}, getTableBodyProps(), { children: rows.slice(0, 10).map((row, i) => {
+    const handleClickActionSix = (item) => {
+        setSelectedItem(item);
+        actionFive.handleClick();
+    };
+    return (_jsxs(_Fragment, { children: [_jsx(ActionModal, { isOpen: isOpen, onClose: onClose, rowData: selectedRow }), _jsx(Flex, Object.assign({ w: "100%" }, { children: _jsxs(HStack, Object.assign({ alignItems: 'center', w: "xs" }, { children: [_jsx(IconButton, { onClick: handleClickActionOne, colorScheme: "blue", "aria-label": "Search database", icon: _jsx(BiPlus, {}) }), _jsx(Input, { type: "text", onChange: handleFilterInputChange, placeholder: "Search here.." })] })) })), _jsx(TableContainer, Object.assign({ p: "5" }, { children: _jsxs(Table, Object.assign({}, getTableProps(), { children: [_jsx(Thead, { children: headerGroups.map((headerGroup, index) => (_jsxs(Tr, Object.assign({}, headerGroup.getHeaderGroupProps(), { children: [index == 0 && _jsx(Th, { children: "action" }), headerGroup.headers.map((column) => (_jsxs(Th, Object.assign({ textTransform: 'capitalize' }, column.getHeaderProps(column.getSortByToggleProps()), { children: [column.render('Header'), _jsx(chakra.span, Object.assign({ pl: "4" }, { children: column.isSorted ? (column.isSortedDesc ? (_jsx(Icon, { as: iconsList['ArrowUp'], "aria-label": "sorted descending" })) : (_jsx(Icon, { as: iconsList['ArrowDown'], "aria-label": "sorted ascending" }))) : null }))] }))))] })))) }), _jsx(Tbody, Object.assign({}, getTableBodyProps(), { children: rows.slice(0, 10).map((row, i) => {
                                 prepareRow(row);
-                                return (_jsxs(Tr, Object.assign({}, row.getRowProps(), { children: [_jsx(Td, Object.assign({ p: "12px", maxW: "30px", textAlign: "center", className: "user-action-wrapper" }, { children: _jsxs(Popover, Object.assign({ placement: "top" }, { children: [_jsx(PopoverTrigger, { children: _jsx(IconButton, { minW: "24px", h: "24px", border: "1px", borderColor: "#E9E9E9", variant: "ghost", "aria-label": "open menu", _focus: { outline: 'none' }, icon: _jsx(BiDotsHorizontal, { width: "10px" }) }) }), _jsx(Portal, { children: _jsx(PopoverContent, Object.assign({ maxW: "170px", _focus: { outline: 'none' } }, { children: _jsx(PopoverBody, Object.assign({ p: "0" }, { children: _jsxs(Stack, Object.assign({ direction: "column", spacing: 0 }, { children: [_jsx(Button, Object.assign({ onClick: () => handleClickActionOne(row.values), leftIcon: _jsx(BiEditAlt, { color: "rgba(162, 162, 162, 1)", fontSize: "16px" }), _hover: {
+                                return (_jsxs(Tr, Object.assign({}, row.getRowProps(), { children: [_jsx(Td, Object.assign({ p: "12px", maxW: "30px", textAlign: "center", className: "user-action-wrapper" }, { children: _jsxs(Popover, Object.assign({ placement: "top" }, { children: [_jsx(PopoverTrigger, { children: _jsx(IconButton, { minW: "24px", h: "24px", border: "1px", borderColor: "#E9E9E9", variant: "ghost", "aria-label": "open menu", _focus: { outline: 'none' }, icon: _jsx(BiDotsHorizontal, { width: "10px" }) }) }), _jsx(Portal, { children: _jsx(PopoverContent, Object.assign({ maxW: "170px", _focus: { outline: 'none' } }, { children: _jsx(PopoverBody, Object.assign({ p: "0" }, { children: _jsxs(Stack, Object.assign({ direction: "column", spacing: 0 }, { children: [_jsx(Button, Object.assign({ onClick: () => handleClickActionTwo(row.values), leftIcon: _jsx(BiEditAlt, { color: "rgba(162, 162, 162, 1)", fontSize: "16px" }), _hover: {
                                                                                 backgroundColor: 'rgba(249, 247, 242, 1)',
-                                                                            }, color: "rgba(69, 69, 69, 1)", fontSize: "14px", fontWeight: "400", p: "16px", w: "100%", justifyContent: "flex-start", variant: "ghost" }, { children: "Edit" })), _jsx(Button, Object.assign({ onClick: () => handleClickActionTwo(row.values), leftIcon: _jsx(FaPrint, { color: "rgba(162, 162, 162, 1)", fontSize: "16px" }), _hover: {
+                                                                            }, color: "rgba(69, 69, 69, 1)", fontSize: "14px", fontWeight: "400", p: "16px", w: "100%", justifyContent: "flex-start", variant: "ghost" }, { children: "Edit" })), _jsx(Button, Object.assign({ onClick: () => handleClickActionThree(row.values), leftIcon: _jsx(FaPrint, { color: "rgba(162, 162, 162, 1)", fontSize: "16px" }), _hover: {
                                                                                 backgroundColor: 'rgba(249, 247, 242, 1)',
-                                                                            }, color: "rgba(69, 69, 69, 1)", fontSize: "14px", fontWeight: "400", p: "16px", w: "100%", justifyContent: "flex-start", variant: "ghost" }, { children: "Print Label" })), type == 'admin' && (_jsx(Button, Object.assign({ onClick: () => handleClickActionThree(row.values), leftIcon: _jsx(FaFileInvoice, { color: "rgba(162, 162, 162, 1)", fontSize: "16px" }), _hover: {
+                                                                            }, color: "rgba(69, 69, 69, 1)", fontSize: "14px", fontWeight: "400", p: "16px", w: "100%", justifyContent: "flex-start", variant: "ghost" }, { children: "Print Label" })), type == 'admin' && (_jsx(Button, Object.assign({ onClick: () => handleClickActionFour(row.values), leftIcon: _jsx(FaFileInvoice, { color: "rgba(162, 162, 162, 1)", fontSize: "16px" }), _hover: {
                                                                                 backgroundColor: 'rgba(249, 247, 242, 1)',
@@ -104,3 +106,3 @@ }, color: "rgba(69, 69, 69, 1)", fontSize: "14px", fontWeight: "400", p: "16px", w: "100%", justifyContent: "flex-start", variant: "ghost" }, { children: "Create Inovice" })))] })) })) })) })] })) })), row.cells.map((cell) => {
                                         })] })));
-                            }) }))] })) })), (selectedRow === null || selectedRow === void 0 ? void 0 : selectedRow.length) >= 1 && (_jsx(Box, Object.assign({ mt: "5" }, { children: _jsxs(Menu, { children: [_jsx(MenuButton, Object.assign({ as: Button, size: "sm", rightIcon: _jsx(BiChevronDown, {}) }, { children: "Actions" })), _jsxs(MenuList, { children: [_jsx(MenuItem, Object.assign({ onClick: () => handleClickActionFour(selectedItem), icon: _jsx(FaPrint, { color: "rgba(162, 162, 162, 1)", fontSize: "16px" }) }, { children: "Print Label" })), type == 'admin' && (_jsx(MenuItem, Object.assign({ onClick: () => handleClickActionFive(selectedItem), icon: _jsx(FaFileInvoice, { color: "rgba(162, 162, 162, 1)", fontSize: "16px" }) }, { children: "Create Inovice" })))] })] }) })))] }));
+                            }) }))] })) })), (selectedRow === null || selectedRow === void 0 ? void 0 : selectedRow.length) >= 1 && (_jsx(Box, Object.assign({ mt: "5" }, { children: _jsxs(Menu, { children: [_jsx(MenuButton, Object.assign({ as: Button, size: "sm", rightIcon: _jsx(BiChevronDown, {}) }, { children: "Actions" })), _jsxs(MenuList, { children: [_jsx(MenuItem, Object.assign({ onClick: () => handleClickActionFive(selectedRow), icon: _jsx(FaPrint, { color: "rgba(162, 162, 162, 1)", fontSize: "16px" }) }, { children: "Print Label" })), type == 'admin' && (_jsx(MenuItem, Object.assign({ onClick: () => handleClickActionSix(selectedRow), icon: _jsx(FaFileInvoice, { color: "rgba(162, 162, 162, 1)", fontSize: "16px" }) }, { children: "Create Inovice" })))] })] }) })))] }));
 }
@@ -129,2 +131,3 @@ function filterGreaterThan(rows, id, filterValue) {
         action_5: [{ type: 'none' }],
+        action_6: [{ type: 'none' }],
     },
@@ -147,3 +150,3 @@ propDefinition: {
             group: 'Action',
-            label: 'Row Action 1',
+            label: 'Insert Button Action',
             type: 'action',
@@ -166,3 +169,3 @@ options: [{ type: 'none' }],
             group: 'Action',
-            label: 'Bulk Action 1',
+            label: 'Row Action 4',
             type: 'action',
@@ -173,2 +176,8 @@ options: [{ type: 'none' }],
             group: 'Action',
+            label: 'Bulk Action 1',
+            type: 'action',
+            options: [{ type: 'none' }],
+        },
+        action_6: {
+            group: 'Action',
             label: 'Bulk Action 2',
@@ -175,0 +184,0 @@ type: 'action',

package.json

 {
   "name": "@qore-project/urshipper-custom-table-component",
-  "version": "1.1.4",
+  "version": "1.1.5",
   "module": "lib/urshipper-custom-table.js",
@@ -5,0 +5,0 @@ "type": "module",

No alert changes

Improved metrics

Total package byte prevSize

464429

increased by0.3%

Lines of code

6092

increased by0.49%

No dependency changes