@apexcura/ui-components 0.0.14-Beta245 → 0.0.14-Beta247

package/dist/index.css

@@ -338,6 +338,9 @@ video {
 .fixed {
   position: fixed;
 }
+.m-10 {
+  margin: 2.5rem;
+}
 .m-\[10px\] {
   margin: 10px;
 }
@@ -350,12 +353,18 @@ video {
 .grid {
   display: grid;
 }
+.flex-col {
+  flex-direction: column;
+}
 .rounded-\[8px\] {
   border-radius: 8px;
 }
 .border {
   border-width: 1px;
 }
+.border-4 {
+  border-width: 4px;
+}
 .border-\[\#919191\] {
   --tw-border-opacity: 1;
   border-color: rgb(145 145 145 / var(--tw-border-opacity));
@@ -372,12 +381,22 @@ video {
   --tw-bg-opacity: 1;
   background-color: rgb(242 242 242 / var(--tw-bg-opacity));
 }
+.bg-green-500 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(34 197 94 / var(--tw-bg-opacity));
+}
+.p-10 {
+  padding: 2.5rem;
+}
 .p-\[6px\] {
   padding: 6px;
 }
 .text-center {
   text-align: center;
 }
+.font-semibold {
+  font-weight: 600;
+}
 .italic {
   font-style: italic;
 }

package/dist/index.js

@@ -208,7 +208,7 @@ var SelectElement = (props) => {
       }
     }
   };
-  return /* @__PURE__ */ import_react5.default.createElement("div", { className: props.containerClassName }, props.label && /* @__PURE__ */ import_react5.default.createElement("label", { htmlFor: props.name, className: props.labelClassName }, props.label), /* @__PURE__ */ import_react5.default.createElement(
+  return /* @__PURE__ */ import_react5.default.createElement("div", { className: "flex flex-col p-10 m-10" }, props.label && /* @__PURE__ */ import_react5.default.createElement("label", { htmlFor: props.name, className: "font-semibold text-default-400 text-red bg-green-500 border-4" }, props.label), /* @__PURE__ */ import_react5.default.createElement(
     import_antd5.Select,
     {
       options: props.options,
@@ -803,7 +803,7 @@ var ModelBody = (props) => {
 
 // src/Components/Model.tsx
 var ModelElement = (props) => {
-  const { model, onCancel, selectedRecord, columns } = props;
+  const { model, onCancel, selectedRecord, columns, modalContent } = props;
   return /* @__PURE__ */ import_react20.default.createElement(
     import_antd13.Modal,
     {
@@ -823,6 +823,9 @@ var ModelElement = (props) => {
             margin: "-10px"
           }
         },
+        modalContent.map((eachField) => {
+          console.log("eachField", eachField);
+        }),
         columns.map((eachColumn) => {
           if (!["index", "View"].includes(eachColumn.key) && eachColumn?.["is_detail"] !== false) {
             return /* @__PURE__ */ import_react20.default.createElement("p", { style: { fontWeight: "500", padding: "10px" } }, /* @__PURE__ */ import_react20.default.createElement(
@@ -1121,13 +1124,21 @@ var DropDownGroup = (props) => {
       return newValue;
     });
   };
+  const firstFilterOptions = (input, option) => {
+    return (option?.label ?? "").toLowerCase().includes(input.toLowerCase());
+  };
+  const secondFilterOptions = (input, option) => {
+    return (option?.label ?? "").toLowerCase().includes(input.toLowerCase());
+  };
   return /* @__PURE__ */ import_react26.default.createElement("div", { className: props.containerClassName }, props.label && /* @__PURE__ */ import_react26.default.createElement("label", { htmlFor: props.name, className: props.labelClassName }, props.label), /* @__PURE__ */ import_react26.default.createElement("div", { className: props.subContainerClassName }, /* @__PURE__ */ import_react26.default.createElement(
     import_antd18.Select,
     {
       onChange: handleFirstChange,
       variant: props.variant,
       options: props.firstOptions,
-      className: props.className
+      className: props.className,
+      filterOption: firstFilterOptions,
+      showSearch: true
     }
   ), /* @__PURE__ */ import_react26.default.createElement("div", { style: { borderLeft: "1px solid gray", height: "33px" } }), /* @__PURE__ */ import_react26.default.createElement(
     import_antd18.Select,
@@ -1135,7 +1146,9 @@ var DropDownGroup = (props) => {
       onChange: handleSecondChange,
       variant: props.variant,
       options: props.secondOptions,
-      className: props.className
+      className: props.className,
+      filterOption: secondFilterOptions,
+      showSearch: true
     }
   )));
 };

package/dist/index.mjs

@@ -142,7 +142,7 @@ var SelectElement = (props) => {
       }
     }
   };
-  return /* @__PURE__ */ React5.createElement("div", { className: props.containerClassName }, props.label && /* @__PURE__ */ React5.createElement("label", { htmlFor: props.name, className: props.labelClassName }, props.label), /* @__PURE__ */ React5.createElement(
+  return /* @__PURE__ */ React5.createElement("div", { className: "flex flex-col p-10 m-10" }, props.label && /* @__PURE__ */ React5.createElement("label", { htmlFor: props.name, className: "font-semibold text-default-400 text-red bg-green-500 border-4" }, props.label), /* @__PURE__ */ React5.createElement(
     Select,
     {
       options: props.options,
@@ -737,7 +737,7 @@ var ModelBody = (props) => {
 
 // src/Components/Model.tsx
 var ModelElement = (props) => {
-  const { model, onCancel, selectedRecord, columns } = props;
+  const { model, onCancel, selectedRecord, columns, modalContent } = props;
   return /* @__PURE__ */ React20.createElement(
     Modal,
     {
@@ -757,6 +757,9 @@ var ModelElement = (props) => {
             margin: "-10px"
           }
         },
+        modalContent.map((eachField) => {
+          console.log("eachField", eachField);
+        }),
         columns.map((eachColumn) => {
           if (!["index", "View"].includes(eachColumn.key) && eachColumn?.["is_detail"] !== false) {
             return /* @__PURE__ */ React20.createElement("p", { style: { fontWeight: "500", padding: "10px" } }, /* @__PURE__ */ React20.createElement(
@@ -1055,13 +1058,21 @@ var DropDownGroup = (props) => {
       return newValue;
     });
   };
+  const firstFilterOptions = (input, option) => {
+    return (option?.label ?? "").toLowerCase().includes(input.toLowerCase());
+  };
+  const secondFilterOptions = (input, option) => {
+    return (option?.label ?? "").toLowerCase().includes(input.toLowerCase());
+  };
   return /* @__PURE__ */ React26.createElement("div", { className: props.containerClassName }, props.label && /* @__PURE__ */ React26.createElement("label", { htmlFor: props.name, className: props.labelClassName }, props.label), /* @__PURE__ */ React26.createElement("div", { className: props.subContainerClassName }, /* @__PURE__ */ React26.createElement(
     Select4,
     {
       onChange: handleFirstChange,
       variant: props.variant,
       options: props.firstOptions,
-      className: props.className
+      className: props.className,
+      filterOption: firstFilterOptions,
+      showSearch: true
     }
   ), /* @__PURE__ */ React26.createElement("div", { style: { borderLeft: "1px solid gray", height: "33px" } }), /* @__PURE__ */ React26.createElement(
     Select4,
@@ -1069,7 +1080,9 @@ var DropDownGroup = (props) => {
       onChange: handleSecondChange,
       variant: props.variant,
       options: props.secondOptions,
-      className: props.className
+      className: props.className,
+      filterOption: secondFilterOptions,
+      showSearch: true
     }
   )));
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@apexcura/ui-components",
-  "version": "0.0.14-Beta245",
+  "version": "0.0.14-Beta247",
   "description": "Apex cura React components library",
   "keywords": [
     "apex cura",