@apexcura/ui-components 0.0.11-Beta216 → 0.0.11-Beta217

package/dist/index.d.mts

@@ -23,6 +23,7 @@ type ElementType = {
     maxLength?: number;
     fieldNames?: any[];
     fields?: any[];
+    schema?: any[];
     options?: any[];
     onChange?: (value: string | number | boolean | object | any[]) => void;
     dropDownOptions?: any[];
@@ -52,6 +53,7 @@ type ElementType = {
     iconsClassName?: string;
     labelClassName?: string;
     containerClassName?: string;
+    modalContent?: any;
 };
 
 interface ElementExecuterProps$3 extends ElementType {

package/dist/index.d.ts

@@ -23,6 +23,7 @@ type ElementType = {
     maxLength?: number;
     fieldNames?: any[];
     fields?: any[];
+    schema?: any[];
     options?: any[];
     onChange?: (value: string | number | boolean | object | any[]) => void;
     dropDownOptions?: any[];
@@ -52,6 +53,7 @@ type ElementType = {
     iconsClassName?: string;
     labelClassName?: string;
     containerClassName?: string;
+    modalContent?: any;
 };
 
 interface ElementExecuterProps$3 extends ElementType {

package/dist/index.js

@@ -608,23 +608,39 @@ var Navbar = (props) => {
 };
 
 // src/Components/TableElement.tsx
-var import_react20 = __toESM(require("react"));
+var import_react21 = __toESM(require("react"));
 var import_antd14 = require("antd");
 
 // src/Components/Model.tsx
-var import_react19 = __toESM(require("react"));
+var import_react20 = __toESM(require("react"));
 var import_antd13 = require("antd");
+
+// src/Components/ModelBody.tsx
+var import_react19 = __toESM(require("react"));
+var ModelBody = (props) => {
+  return /* @__PURE__ */ import_react19.default.createElement("div", null, props.modalContent && props.modalContent.fields.map((eachField) => {
+    if (eachField.element === "div") {
+      /* @__PURE__ */ import_react19.default.createElement("div", { className: eachField.className }, eachField.label);
+    } else if (eachField.element === "input-radio") {
+      /* @__PURE__ */ import_react19.default.createElement("div", { className: eachField.className }, /* @__PURE__ */ import_react19.default.createElement(RadioElement, { ...eachField }));
+    } else if (eachField.element === "button") {
+      /* @__PURE__ */ import_react19.default.createElement("div", { className: eachField.className }, /* @__PURE__ */ import_react19.default.createElement(ButtonElement, { ...eachField }));
+    }
+  }));
+};
+
+// src/Components/Model.tsx
 var ModelElement = (props) => {
   const { onCancel, model, selectedRecord } = props;
   console.log("selectedRecord in model", selectedRecord);
   console.log("model", model);
-  return /* @__PURE__ */ import_react19.default.createElement(
+  return /* @__PURE__ */ import_react20.default.createElement(
     import_antd13.Modal,
     {
       open: model,
       onCancel,
       footer: null,
-      title: /* @__PURE__ */ import_react19.default.createElement(
+      title: /* @__PURE__ */ import_react20.default.createElement(
         "div",
         {
           style: {
@@ -632,21 +648,22 @@ var ModelElement = (props) => {
             display: "flex",
             flexWrap: "wrap",
             padding: "10px",
-            width: "full"
+            width: "full",
+            margin: "-10px"
           }
         },
-        Object.entries(selectedRecord).map(([key, value]) => /* @__PURE__ */ import_react19.default.createElement("p", { style: { fontWeight: "200", padding: "10px" }, key }, /* @__PURE__ */ import_react19.default.createElement("span", { style: { color: "gray" } }, key), String(value)))
+        Object.entries(selectedRecord).map(([key, value]) => /* @__PURE__ */ import_react20.default.createElement("p", { style: { fontWeight: "200", padding: "10px" }, key }, /* @__PURE__ */ import_react20.default.createElement("span", { style: { color: "gray", paddingLeft: "10px" } }, key), String(value)))
       )
     },
-    /* @__PURE__ */ import_react19.default.createElement("p", null, "Model opened")
+    /* @__PURE__ */ import_react20.default.createElement(ModelBody, { ...props })
   );
 };
 
 // src/Components/TableElement.tsx
 var TableElement = (props) => {
   const { thead, tbody } = props;
-  const [selectedRecord, setSelectedRecord] = (0, import_react20.useState)({});
-  const [model, setModel] = (0, import_react20.useState)(false);
+  const [selectedRecord, setSelectedRecord] = (0, import_react21.useState)({});
+  const [model, setModel] = (0, import_react21.useState)(false);
   console.log("selectedRecord", selectedRecord);
   let columns = [];
   if (thead) {
@@ -676,7 +693,7 @@ var TableElement = (props) => {
     ...row,
     [columns[0].key]: index + 1
   }));
-  return /* @__PURE__ */ import_react20.default.createElement(import_react20.default.Fragment, null, /* @__PURE__ */ import_react20.default.createElement(
+  return /* @__PURE__ */ import_react21.default.createElement(import_react21.default.Fragment, null, /* @__PURE__ */ import_react21.default.createElement(
     import_antd14.Table,
     {
       dataSource,
@@ -692,16 +709,16 @@ var TableElement = (props) => {
         };
       }
     }
-  ), model && /* @__PURE__ */ import_react20.default.createElement(ModelElement, { selectedStyle: false, style: false, className: void 0, selectedRecord, model, onCancel: () => setModel(false) }));
+  ), model && /* @__PURE__ */ import_react21.default.createElement(ModelElement, { selectedStyle: false, style: false, className: void 0, selectedRecord, model, onCancel: () => setModel(false) }));
 };
 
 // src/Components/DatePicker.tsx
-var import_react21 = __toESM(require("react"));
+var import_react22 = __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_react21.useState)(null);
+  const [date, setDate] = (0, import_react22.useState)(null);
   const handleChange = (date2, dateString) => {
     console.log("date---------", date2);
     console.log("datestring", dateString);
@@ -736,7 +753,7 @@ var DatePickerElement = (props) => {
       props.onChange(newDate.format("lll"));
     }
   };
-  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(
+  return /* @__PURE__ */ import_react22.default.createElement("div", null, /* @__PURE__ */ import_react22.default.createElement("button", { onClick: onHandleDecrement }, /* @__PURE__ */ import_react22.default.createElement(import_icons4.LeftOutlined, null)), /* @__PURE__ */ import_react22.default.createElement(
     import_antd15.DatePicker,
     {
       placeholder: props.placeholder,
@@ -744,7 +761,7 @@ var DatePickerElement = (props) => {
       variant: "borderless",
       onChange: handleChange
     }
-  ), /* @__PURE__ */ import_react21.default.createElement("button", { onClick: onHandleIncrement }, /* @__PURE__ */ import_react21.default.createElement(import_icons4.RightOutlined, null)));
+  ), /* @__PURE__ */ import_react22.default.createElement("button", { onClick: onHandleIncrement }, /* @__PURE__ */ import_react22.default.createElement(import_icons4.RightOutlined, null)));
 };
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {

package/dist/index.mjs

@@ -557,23 +557,39 @@ var Navbar = (props) => {
 };
 
 // src/Components/TableElement.tsx
-import React19, { useState as useState5 } from "react";
+import React20, { useState as useState5 } from "react";
 import { Table as Table2 } from "antd";
 
 // src/Components/Model.tsx
-import React18 from "react";
+import React19 from "react";
 import { Modal } from "antd";
+
+// src/Components/ModelBody.tsx
+import React18 from "react";
+var ModelBody = (props) => {
+  return /* @__PURE__ */ React18.createElement("div", null, props.modalContent && props.modalContent.fields.map((eachField) => {
+    if (eachField.element === "div") {
+      /* @__PURE__ */ React18.createElement("div", { className: eachField.className }, eachField.label);
+    } else if (eachField.element === "input-radio") {
+      /* @__PURE__ */ React18.createElement("div", { className: eachField.className }, /* @__PURE__ */ React18.createElement(RadioElement, { ...eachField }));
+    } else if (eachField.element === "button") {
+      /* @__PURE__ */ React18.createElement("div", { className: eachField.className }, /* @__PURE__ */ React18.createElement(ButtonElement, { ...eachField }));
+    }
+  }));
+};
+
+// src/Components/Model.tsx
 var ModelElement = (props) => {
   const { onCancel, model, selectedRecord } = props;
   console.log("selectedRecord in model", selectedRecord);
   console.log("model", model);
-  return /* @__PURE__ */ React18.createElement(
+  return /* @__PURE__ */ React19.createElement(
     Modal,
     {
       open: model,
       onCancel,
       footer: null,
-      title: /* @__PURE__ */ React18.createElement(
+      title: /* @__PURE__ */ React19.createElement(
         "div",
         {
           style: {
@@ -581,13 +597,14 @@ var ModelElement = (props) => {
             display: "flex",
             flexWrap: "wrap",
             padding: "10px",
-            width: "full"
+            width: "full",
+            margin: "-10px"
           }
         },
-        Object.entries(selectedRecord).map(([key, value]) => /* @__PURE__ */ React18.createElement("p", { style: { fontWeight: "200", padding: "10px" }, key }, /* @__PURE__ */ React18.createElement("span", { style: { color: "gray" } }, key), String(value)))
+        Object.entries(selectedRecord).map(([key, value]) => /* @__PURE__ */ React19.createElement("p", { style: { fontWeight: "200", padding: "10px" }, key }, /* @__PURE__ */ React19.createElement("span", { style: { color: "gray", paddingLeft: "10px" } }, key), String(value)))
       )
     },
-    /* @__PURE__ */ React18.createElement("p", null, "Model opened")
+    /* @__PURE__ */ React19.createElement(ModelBody, { ...props })
   );
 };
 
@@ -625,7 +642,7 @@ var TableElement = (props) => {
     ...row,
     [columns[0].key]: index + 1
   }));
-  return /* @__PURE__ */ React19.createElement(React19.Fragment, null, /* @__PURE__ */ React19.createElement(
+  return /* @__PURE__ */ React20.createElement(React20.Fragment, null, /* @__PURE__ */ React20.createElement(
     Table2,
     {
       dataSource,
@@ -641,11 +658,11 @@ var TableElement = (props) => {
         };
       }
     }
-  ), model && /* @__PURE__ */ React19.createElement(ModelElement, { selectedStyle: false, style: false, className: void 0, selectedRecord, model, onCancel: () => setModel(false) }));
+  ), model && /* @__PURE__ */ React20.createElement(ModelElement, { selectedStyle: false, style: false, className: void 0, selectedRecord, model, onCancel: () => setModel(false) }));
 };
 
 // src/Components/DatePicker.tsx
-import React20, { useState as useState6 } from "react";
+import React21, { useState as useState6 } from "react";
 import { DatePicker } from "antd";
 import { LeftOutlined, RightOutlined } from "@ant-design/icons";
 import moment from "moment";
@@ -685,7 +702,7 @@ var DatePickerElement = (props) => {
       props.onChange(newDate.format("lll"));
     }
   };
-  return /* @__PURE__ */ React20.createElement("div", null, /* @__PURE__ */ React20.createElement("button", { onClick: onHandleDecrement }, /* @__PURE__ */ React20.createElement(LeftOutlined, null)), /* @__PURE__ */ React20.createElement(
+  return /* @__PURE__ */ React21.createElement("div", null, /* @__PURE__ */ React21.createElement("button", { onClick: onHandleDecrement }, /* @__PURE__ */ React21.createElement(LeftOutlined, null)), /* @__PURE__ */ React21.createElement(
     DatePicker,
     {
       placeholder: props.placeholder,
@@ -693,7 +710,7 @@ var DatePickerElement = (props) => {
       variant: "borderless",
       onChange: handleChange
     }
-  ), /* @__PURE__ */ React20.createElement("button", { onClick: onHandleIncrement }, /* @__PURE__ */ React20.createElement(RightOutlined, null)));
+  ), /* @__PURE__ */ React21.createElement("button", { onClick: onHandleIncrement }, /* @__PURE__ */ React21.createElement(RightOutlined, null)));
 };
 export {
   AddMoreTable,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@apexcura/ui-components",
-  "version": "0.0.11-Beta216",
+  "version": "0.0.11-Beta217",
   "description": "Apex cura React components library",
   "keywords": [
     "apex cura",
@@ -48,7 +48,6 @@
     "node": ">=18.0.0"
   },
   "dependencies": {
-    "@apexcura/core": "^0.0.13-Beta152",
     "@tinymce/tinymce-react": "^5.0.1",
     "autoprefixer": "^10.4.19",
     "date-fns": "^3.6.0",