@apexcura/ui-components 0.0.11-Beta190 → 0.0.11-Beta192

package/dist/index.js

@@ -608,10 +608,18 @@ var Navbar = (props) => {
 };
 
 // src/Components/TableElement.tsx
+var import_react20 = __toESM(require("react"));
+var import_antd14 = require("antd");
+
+// src/Components/Model.tsx
 var import_react19 = __toESM(require("react"));
 var import_antd13 = require("antd");
+var ModelElement = (props) => /* @__PURE__ */ import_react19.default.createElement(import_antd13.Modal, null, /* @__PURE__ */ import_react19.default.createElement("p", null, "Model opened"));
+
+// src/Components/TableElement.tsx
 var TableElement = (props) => {
   const { thead, tbody } = props;
+  const [selectedRecord, setSelectedRecord] = (0, import_react20.useState)({});
   let columns = [];
   if (thead) {
     columns = [
@@ -624,6 +632,7 @@ var TableElement = (props) => {
         title: col.label,
         dataIndex: col.name,
         key: col.key
+        // sorter: (a,b) => a[col]
       }))
     ];
   }
@@ -631,8 +640,8 @@ var TableElement = (props) => {
     ...row,
     [columns[0].key]: index + 1
   }));
-  return /* @__PURE__ */ import_react19.default.createElement(
-    import_antd13.Table,
+  return /* @__PURE__ */ import_react20.default.createElement(import_react20.default.Fragment, null, /* @__PURE__ */ import_react20.default.createElement(
+    import_antd14.Table,
     {
       dataSource,
       columns,
@@ -641,21 +650,21 @@ var TableElement = (props) => {
       onRow: (record, rowIndex) => {
         return {
           onClick: () => {
-            console.log(record);
+            setSelectedRecord(record);
           }
         };
       }
     }
-  );
+  ), selectedRecord && /* @__PURE__ */ import_react20.default.createElement(ModelElement, { selectedStyle: false, style: false, className: void 0, ...selectedRecord, onClose: () => setSelectedRecord({}) }));
 };
 
 // src/Components/DatePicker.tsx
-var import_react20 = __toESM(require("react"));
-var import_antd14 = require("antd");
+var import_react21 = __toESM(require("react"));
+var import_antd15 = require("antd");
 var import_icons4 = require("@ant-design/icons");
 var import_moment = __toESM(require("moment"));
 var DatePickerElement = (props) => {
-  const [date, setDate] = (0, import_react20.useState)(null);
+  const [date, setDate] = (0, import_react21.useState)(null);
   const handleChange = (date2, dateString) => {
     console.log("date---------", date2);
     console.log("datestring", dateString);
@@ -690,15 +699,15 @@ var DatePickerElement = (props) => {
       props.onChange(newDate.format("lll"));
     }
   };
-  return /* @__PURE__ */ import_react20.default.createElement("div", null, /* @__PURE__ */ import_react20.default.createElement("button", { onClick: onHandleDecrement }, /* @__PURE__ */ import_react20.default.createElement(import_icons4.LeftOutlined, null)), /* @__PURE__ */ import_react20.default.createElement(
-    import_antd14.DatePicker,
+  return /* @__PURE__ */ import_react21.default.createElement("div", null, /* @__PURE__ */ import_react21.default.createElement("button", { onClick: onHandleDecrement }, /* @__PURE__ */ import_react21.default.createElement(import_icons4.LeftOutlined, null)), /* @__PURE__ */ import_react21.default.createElement(
+    import_antd15.DatePicker,
     {
       placeholder: props.placeholder,
       value: date,
       variant: "borderless",
       onChange: handleChange
     }
-  ), /* @__PURE__ */ import_react20.default.createElement("button", { onClick: onHandleIncrement }, /* @__PURE__ */ import_react20.default.createElement(import_icons4.RightOutlined, null)));
+  ), /* @__PURE__ */ import_react21.default.createElement("button", { onClick: onHandleIncrement }, /* @__PURE__ */ import_react21.default.createElement(import_icons4.RightOutlined, null)));
 };
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {

package/dist/index.mjs

@@ -557,10 +557,18 @@ var Navbar = (props) => {
 };
 
 // src/Components/TableElement.tsx
-import React18 from "react";
+import React19, { useState as useState5 } from "react";
 import { Table as Table2 } from "antd";
+
+// src/Components/Model.tsx
+import React18 from "react";
+import { Modal } from "antd";
+var ModelElement = (props) => /* @__PURE__ */ React18.createElement(Modal, null, /* @__PURE__ */ React18.createElement("p", null, "Model opened"));
+
+// src/Components/TableElement.tsx
 var TableElement = (props) => {
   const { thead, tbody } = props;
+  const [selectedRecord, setSelectedRecord] = useState5({});
   let columns = [];
   if (thead) {
     columns = [
@@ -573,6 +581,7 @@ var TableElement = (props) => {
         title: col.label,
         dataIndex: col.name,
         key: col.key
+        // sorter: (a,b) => a[col]
       }))
     ];
   }
@@ -580,7 +589,7 @@ var TableElement = (props) => {
     ...row,
     [columns[0].key]: index + 1
   }));
-  return /* @__PURE__ */ React18.createElement(
+  return /* @__PURE__ */ React19.createElement(React19.Fragment, null, /* @__PURE__ */ React19.createElement(
     Table2,
     {
       dataSource,
@@ -590,21 +599,21 @@ var TableElement = (props) => {
       onRow: (record, rowIndex) => {
         return {
           onClick: () => {
-            console.log(record);
+            setSelectedRecord(record);
           }
         };
       }
     }
-  );
+  ), selectedRecord && /* @__PURE__ */ React19.createElement(ModelElement, { selectedStyle: false, style: false, className: void 0, ...selectedRecord, onClose: () => setSelectedRecord({}) }));
 };
 
 // src/Components/DatePicker.tsx
-import React19, { useState as useState5 } from "react";
+import React20, { useState as useState6 } from "react";
 import { DatePicker } from "antd";
 import { LeftOutlined, RightOutlined } from "@ant-design/icons";
 import moment from "moment";
 var DatePickerElement = (props) => {
-  const [date, setDate] = useState5(null);
+  const [date, setDate] = useState6(null);
   const handleChange = (date2, dateString) => {
     console.log("date---------", date2);
     console.log("datestring", dateString);
@@ -639,7 +648,7 @@ var DatePickerElement = (props) => {
       props.onChange(newDate.format("lll"));
     }
   };
-  return /* @__PURE__ */ React19.createElement("div", null, /* @__PURE__ */ React19.createElement("button", { onClick: onHandleDecrement }, /* @__PURE__ */ React19.createElement(LeftOutlined, null)), /* @__PURE__ */ React19.createElement(
+  return /* @__PURE__ */ React20.createElement("div", null, /* @__PURE__ */ React20.createElement("button", { onClick: onHandleDecrement }, /* @__PURE__ */ React20.createElement(LeftOutlined, null)), /* @__PURE__ */ React20.createElement(
     DatePicker,
     {
       placeholder: props.placeholder,
@@ -647,7 +656,7 @@ var DatePickerElement = (props) => {
       variant: "borderless",
       onChange: handleChange
     }
-  ), /* @__PURE__ */ React19.createElement("button", { onClick: onHandleIncrement }, /* @__PURE__ */ React19.createElement(RightOutlined, null)));
+  ), /* @__PURE__ */ React20.createElement("button", { onClick: onHandleIncrement }, /* @__PURE__ */ React20.createElement(RightOutlined, null)));
 };
 export {
   AddMoreTable,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@apexcura/ui-components",
-  "version": "0.0.11-Beta190",
+  "version": "0.0.11-Beta192",
   "description": "Apex cura React components library",
   "keywords": [
     "apex cura",