pixelize-design-library 2.1.57 → 2.1.58

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/dist/Components/Table/Components/TableActions.js +124 -9
  2. package/dist/Pages/table.js +59 -26
  3. package/package.json +1 -1
package/dist/Components/Table/Components/TableActions.js CHANGED
@@ -1,28 +1,143 @@
1
1
  "use strict";
2
- var __importDefault = (this && this.__importDefault) || function (mod) {
3
- return (mod && mod.__esModule) ? mod : { "default": mod };
2
+ // import React from "react";
3
+ // import {
4
+ // Button,
5
+ // IconButton,
6
+ // Popover,
7
+ // PopoverBody,
8
+ // PopoverContent,
9
+ // PopoverTrigger,
10
+ // Portal,
11
+ // VStack,
12
+ // } from "@chakra-ui/react";
13
+ // import { EllipsisVertical, ExternalLink, Pencil, Trash2 } from "lucide-react";
14
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
15
+ if (k2 === undefined) k2 = k;
16
+ var desc = Object.getOwnPropertyDescriptor(m, k);
17
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
18
+ desc = { enumerable: true, get: function() { return m[k]; } };
19
+ }
20
+ Object.defineProperty(o, k2, desc);
21
+ }) : (function(o, m, k, k2) {
22
+ if (k2 === undefined) k2 = k;
23
+ o[k2] = m[k];
24
+ }));
25
+ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
26
+ Object.defineProperty(o, "default", { enumerable: true, value: v });
27
+ }) : function(o, v) {
28
+ o["default"] = v;
29
+ });
30
+ var __importStar = (this && this.__importStar) || function (mod) {
31
+ if (mod && mod.__esModule) return mod;
32
+ var result = {};
33
+ if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
34
+ __setModuleDefault(result, mod);
35
+ return result;
4
36
  };
5
37
  Object.defineProperty(exports, "__esModule", { value: true });
6
- var react_1 = __importDefault(require("react"));
38
+ // const TableActions = ({ row }: any) => {
39
+ // return (
40
+ // <Popover placement="bottom-start" closeOnBlur>
41
+ // <PopoverTrigger>
42
+ // <IconButton
43
+ // aria-label="Link"
44
+ // color={"black"}
45
+ // icon={<EllipsisVertical size={17}/>}
46
+ // size="sm"
47
+ // p={0}
48
+ // variant="ghost"
49
+ // _hover={{ transform: "scale(1.2)" }}
50
+ // />
51
+ // </PopoverTrigger>
52
+ // <Portal>
53
+ // <PopoverContent w="auto" minW="150px" boxShadow="lg" p={0} zIndex={999}>
54
+ // <PopoverBody>
55
+ // <VStack align="stretch" spacing={1}>
56
+ // {row.onLink && (
57
+ // <Button
58
+ // size="sm"
59
+ // variant="ghost"
60
+ // justifyContent="flex-start"
61
+ // gap={2}
62
+ // onClick={() => row?.onLink(row)}
63
+ // >
64
+ // <ExternalLink size={17}/> View
65
+ // </Button>
66
+ // )}
67
+ // {row.onEdit && (
68
+ // <Button
69
+ // size="sm"
70
+ // variant="ghost"
71
+ // justifyContent="flex-start"
72
+ // gap={2}
73
+ // onClick={() => row?.onEdit?.(row)}
74
+ // >
75
+ // <Pencil size={17}/> Edit
76
+ // </Button>
77
+ // )}
78
+ // {row.onDelete && (
79
+ // <Button
80
+ // size="sm"
81
+ // variant="ghost"
82
+ // justifyContent="flex-start"
83
+ // colorScheme="red"
84
+ // gap={2}
85
+ // onClick={() => row?.onDelete?.(row)}
86
+ // >
87
+ // <Trash2 size={17} />
88
+ // Delete
89
+ // </Button>
90
+ // )}
91
+ // </VStack>
92
+ // </PopoverBody>
93
+ // </PopoverContent>
94
+ // </Portal>
95
+ // </Popover>
96
+ // );
97
+ // };
98
+ // export default TableActions;
99
+ var react_1 = __importStar(require("react"));
7
100
  var react_2 = require("@chakra-ui/react");
8
101
  var lucide_react_1 = require("lucide-react");
9
102
  var TableActions = function (_a) {
10
103
  var row = _a.row;
11
- return (react_1.default.createElement(react_2.Popover, { placement: "bottom-start", closeOnBlur: true },
104
+ var _b = (0, react_1.useState)(false), isOpen = _b[0], setIsOpen = _b[1];
105
+ // Listen for "close-all-popovers"
106
+ (0, react_1.useEffect)(function () {
107
+ var handler = function () { return setIsOpen(false); };
108
+ window.addEventListener("close-all-popovers", handler);
109
+ return function () { return window.removeEventListener("close-all-popovers", handler); };
110
+ }, []);
111
+ var handleOpen = function () {
112
+ // Close all others first
113
+ window.dispatchEvent(new Event("close-all-popovers"));
114
+ setIsOpen(true);
115
+ };
116
+ var handleClose = function () { return setIsOpen(false); };
117
+ return (react_1.default.createElement(react_2.Popover, { placement: "bottom-start", isOpen: isOpen, onOpen: handleOpen, onClose: handleClose, closeOnBlur: true },
12
118
  react_1.default.createElement(react_2.PopoverTrigger, null,
13
- react_1.default.createElement(react_2.IconButton, { "aria-label": "Link", color: "black", icon: react_1.default.createElement(lucide_react_1.EllipsisVertical, { size: 17 }), size: "sm", p: 0, variant: "ghost", _hover: { transform: "scale(1.2)" } })),
119
+ react_1.default.createElement(react_2.IconButton, { "aria-label": "Link", color: "black", icon: react_1.default.createElement(lucide_react_1.EllipsisVertical, { size: 17 }), size: "sm", p: 0, variant: "ghost", _hover: { transform: "scale(1.2)" }, onClick: function () { return (isOpen ? handleClose() : handleOpen()); } })),
14
120
  react_1.default.createElement(react_2.Portal, null,
15
121
  react_1.default.createElement(react_2.PopoverContent, { w: "auto", minW: "150px", boxShadow: "lg", p: 0, zIndex: 999 },
16
122
  react_1.default.createElement(react_2.PopoverBody, null,
17
123
  react_1.default.createElement(react_2.VStack, { align: "stretch", spacing: 1 },
18
- row.onLink && (react_1.default.createElement(react_2.Button, { size: "sm", variant: "ghost", justifyContent: "flex-start", gap: 2, onClick: function () { return row === null || row === void 0 ? void 0 : row.onLink(row); } },
124
+ row.onLink && (react_1.default.createElement(react_2.Button, { size: "sm", variant: "ghost", justifyContent: "flex-start", gap: 2, onClick: function () {
125
+ row.onLink(row);
126
+ handleClose();
127
+ } },
19
128
  react_1.default.createElement(lucide_react_1.ExternalLink, { size: 17 }),
20
129
  " View")),
21
- row.onEdit && (react_1.default.createElement(react_2.Button, { size: "sm", variant: "ghost", justifyContent: "flex-start", gap: 2, onClick: function () { var _a; return (_a = row === null || row === void 0 ? void 0 : row.onEdit) === null || _a === void 0 ? void 0 : _a.call(row, row); } },
130
+ row.onEdit && (react_1.default.createElement(react_2.Button, { size: "sm", variant: "ghost", justifyContent: "flex-start", gap: 2, onClick: function () {
131
+ row.onEdit(row);
132
+ handleClose();
133
+ } },
22
134
  react_1.default.createElement(lucide_react_1.Pencil, { size: 17 }),
23
135
  " Edit")),
24
- row.onDelete && (react_1.default.createElement(react_2.Button, { size: "sm", variant: "ghost", justifyContent: "flex-start", colorScheme: "red", gap: 2, onClick: function () { var _a; return (_a = row === null || row === void 0 ? void 0 : row.onDelete) === null || _a === void 0 ? void 0 : _a.call(row, row); } },
136
+ row.onDelete && (react_1.default.createElement(react_2.Button, { size: "sm", variant: "ghost", justifyContent: "flex-start", colorScheme: "red", gap: 2, onClick: function () {
137
+ row.onDelete(row);
138
+ handleClose();
139
+ } },
25
140
  react_1.default.createElement(lucide_react_1.Trash2, { size: 17 }),
26
- "Delete"))))))));
141
+ " Delete"))))))));
27
142
  };
28
143
  exports.default = TableActions;
package/dist/Pages/table.js CHANGED
@@ -9,16 +9,22 @@ var Table_1 = __importDefault(require("../Components/Table/Table"));
9
9
  var tableData = [
10
10
  {
11
11
  id: 1,
12
- name: "John Doe",
12
+ name: "John Doe1",
13
13
  age: 30,
14
14
  gender: "Male",
15
15
  onLink: function (url) {
16
16
  console.log("URL", url);
17
17
  },
18
+ onEdit: function (url) {
19
+ console.log("Edit", url);
20
+ },
21
+ onDelete: function (url) {
22
+ console.log("Delete", url);
23
+ },
18
24
  },
19
25
  {
20
26
  id: 2,
21
- name: "Jane Doe",
27
+ name: "Jane Doe2",
22
28
  age: 25,
23
29
  gender: "Female",
24
30
  content: function () {
@@ -28,85 +34,112 @@ var tableData = [
28
34
  },
29
35
  {
30
36
  id: 3,
31
- name: "Bob Smith",
37
+ name: "Bob Smith1",
32
38
  age: 40,
33
39
  gender: "Male",
40
+ onLink: function (url) {
41
+ console.log("URL", url);
42
+ },
43
+ onEdit: function (url) {
44
+ console.log("Edit", url);
45
+ },
46
+ onDelete: function (url) {
47
+ console.log("Delete", url);
48
+ },
34
49
  },
35
50
  {
36
- id: 3,
37
- name: "Bob Smith",
51
+ id: 4,
52
+ name: "Bob Smith2",
38
53
  age: 40,
39
54
  gender: "Male",
40
55
  },
41
56
  {
42
- id: 3,
43
- name: "Bob Smitha",
57
+ id: 5,
58
+ name: "Bob Smitha3",
44
59
  age: 40,
45
60
  gender: "Male",
46
61
  },
47
62
  {
48
- id: 3,
49
- name: "Bobe Smith",
63
+ id: 6,
64
+ name: "Bobe Smith4",
50
65
  age: 40,
51
66
  gender: "Male",
52
67
  },
53
68
  {
54
- id: 3,
55
- name: "Bob Smith",
69
+ id: 7,
70
+ name: "Bob Smith5",
56
71
  age: 40,
57
72
  gender: "Male",
58
73
  },
59
74
  {
60
- id: 3,
61
- name: "Bob Smith",
75
+ id: 8,
76
+ name: "Bob Smith6",
62
77
  age: 40,
63
78
  gender: "Male",
64
79
  },
65
80
  {
66
- id: 3,
81
+ id: 9,
67
82
  name: "crushmika",
68
83
  age: 33,
69
84
  gender: "Female",
70
85
  },
71
86
  {
72
- id: 33,
73
- name: "Shree",
87
+ id: 10,
88
+ name: "Shree1",
74
89
  age: 30,
75
90
  gender: "Female",
91
+ onLink: function (url) {
92
+ console.log("URL", url);
93
+ },
94
+ onEdit: function (url) {
95
+ console.log("Edit", url);
96
+ },
97
+ onDelete: function (url) {
98
+ console.log("Delete", url);
99
+ },
76
100
  },
77
101
  {
78
- id: 33,
79
- name: "Shree",
102
+ id: 11,
103
+ name: "Shree2",
80
104
  age: 25,
81
105
  gender: "Female",
82
106
  },
83
107
  {
84
- id: 3,
85
- name: "Bob Smith",
108
+ id: 12,
109
+ name: "Bob Smith7",
86
110
  age: 40,
87
111
  gender: "Male",
112
+ onLink: function (url) {
113
+ console.log("URL", url);
114
+ },
115
+ onEdit: function (url) {
116
+ console.log("Edit", url);
117
+ },
118
+ onDelete: function (url) {
119
+ console.log("Delete", url);
120
+ },
88
121
  },
89
122
  {
90
- id: 3,
123
+ id: 13,
91
124
  name: "Waquima gaabi",
92
125
  age: 40,
93
126
  gender: "female",
94
127
  },
95
128
  {
96
- id: 3,
97
- name: "Bob Smith",
129
+ id: 14,
130
+ name: "Bob Smith8",
98
131
  age: 40,
99
132
  gender: "Male",
100
133
  },
101
134
  {
102
- id: 3,
135
+ id: 15,
103
136
  name: "Johny",
104
137
  age: 40,
105
138
  gender: "Male",
106
139
  },
107
140
  {
108
- id: 3,
109
- name: "Bob Smith",
141
+ id: 16,
142
+ name: "Bob Smith9",
110
143
  age: 40,
111
144
  gender: "Male",
112
145
  },
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pixelize-design-library",
3
- "version": "2.1.57",
3
+ "version": "2.1.58",
4
4
  "private": false,
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.js",