@clyrex-digital/clyrex-controls-dev 0.8.1-dev.20260724091901 → 0.8.1-dev.20260725061513

package/dist/{chunk-6F7QBX3H.mjs → chunk-6GS7N4EV.mjs}

@@ -161,9 +161,131 @@ var MoneyInput = (props) => {
 };
 var MoneyInput_default = MoneyInput;
 
-// src/components/controls/edit/PercentageInput.tsx
-import React4 from "react";
+// src/components/controls/edit/Select.tsx
+import { useState, useEffect } from "react";
 import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
+var Select = (props) => {
+  const [list, setList] = useState();
+  const getSafeValue = (val) => {
+    if (val === null || val === void 0) return "";
+    if (typeof val === "boolean") return val ? "1" : "0";
+    return val;
+  };
+  const textChangeHandler = (event) => {
+    let rawValue = event.target.value;
+    if (rawValue === "") rawValue = null;
+    let finalValue = rawValue;
+    if (list && props.dataKeyFieldName) {
+      const key = props.dataKeyFieldName;
+      const selectedItem = list.find(
+        (item) => String(item[key]) === String(rawValue)
+      );
+      if (selectedItem) {
+        const keyValue = selectedItem[key];
+        if (typeof keyValue === "number") {
+          finalValue = Number(rawValue);
+        }
+      }
+    }
+    props.callback?.({
+      name: props.name,
+      value: finalValue,
+      index: props.index,
+      groupKey: props.groupKey
+    });
+  };
+  const inputChangeHandler = (event) => {
+    props.callback?.({
+      name: props.name,
+      value: event.target.value,
+      index: props.index,
+      groupKey: props.groupKey
+    });
+  };
+  useEffect(() => {
+    async function fetchData() {
+      if (props.dataset) {
+        setList(props.dataset);
+        return;
+      }
+      if (props.dataSource && props.serviceClient) {
+        let dataSource = props.dataSource;
+        let response;
+        if (props.dataSourceDependsOn) {
+          if (!props.dependentValue) {
+            setList([]);
+            return;
+          }
+          dataSource = dataSource.replace(
+            `{${props.dataSourceDependsOn}}`,
+            props.dependentValue
+          );
+        }
+        response = await props.serviceClient.get(dataSource);
+        setList(response.result ?? []);
+        return;
+      }
+      setList([]);
+    }
+    fetchData();
+  }, [
+    props.dataset,
+    props.dataSource,
+    props.dependentValue,
+    props.dataSourceDependsOn
+  ]);
+  const value = getSafeValue(props.value);
+  return /* @__PURE__ */ jsxs4("label", { className: "block", children: [
+    props.attributes?.label && /* @__PURE__ */ jsx4("span", { className: "text-sm font-medium inline-block pb-1", children: props.attributes?.label }),
+    " ",
+    props.attributes?.label && props.attributes?.required && /* @__PURE__ */ jsx4("span", { className: "bg-error-weak", children: "*" }),
+    list && list.length === 0 && /* @__PURE__ */ jsx4(
+      "input",
+      {
+        type: "text",
+        name: props.name,
+        id: props.name,
+        value,
+        onChange: inputChangeHandler,
+        required: props.attributes?.required,
+        placeholder: props.attributes?.placeholder,
+        maxLength: props.attributes?.maxLength,
+        pattern: props.attributes?.pattern,
+        disabled: props.attributes?.readOnly,
+        minLength: props.attributes?.minLength,
+        className: `peer input select mt-1 py-1.5 block w-full rounded shadow-sm ${props.inputClasses ?? ""}`
+      }
+    ),
+    list && list.length > 0 && /* @__PURE__ */ jsxs4(
+      "select",
+      {
+        name: props.name,
+        id: props.name,
+        value,
+        onChange: textChangeHandler,
+        required: props.attributes?.required,
+        disabled: props.attributes?.readOnly,
+        className: `peer select py-1.5 block w-full text-black rounded border-gray-300 shadow-sm
+                     focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50
+                     disabled:bg-slate-50 disabled:text-slate-500 disabled:border-slate-200 disabled:shadow-none ${props.inputClasses ?? ""}`,
+        children: [
+          /* @__PURE__ */ jsx4("option", { value: "", children: props.attributes?.placeholder || "Select" }),
+          list.map((item, index) => {
+            const keyField = props.dataKeyFieldName;
+            const textField = props.dataTextFieldName;
+            return /* @__PURE__ */ jsx4("option", { value: item[keyField], children: item[textField] }, index);
+          })
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx4("p", { className: "hidden group-[.validated]:peer-invalid:block mt-1 text-alert text-sm", children: props.attributes?.errorMessage || "" })
+  ] });
+};
+var Select_default = Select;
+
+// src/components/controls/edit/PercentageInput.tsx
+import React5 from "react";
+import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
 var PercentageInput = (props) => {
   const textChangeHandler = (event) => {
     const rawValue = event.target.value;
@@ -192,11 +314,11 @@ var PercentageInput = (props) => {
       e.preventDefault();
     }
   };
-  return /* @__PURE__ */ jsx4(React4.Fragment, { children: /* @__PURE__ */ jsxs4("label", { className: "block mb-1", children: [
-    /* @__PURE__ */ jsx4("span", { className: "text-sm font-medium ", children: props?.attributes?.label ? props?.attributes?.label + " %" : "" }),
+  return /* @__PURE__ */ jsx5(React5.Fragment, { children: /* @__PURE__ */ jsxs5("label", { className: "block mb-1", children: [
+    /* @__PURE__ */ jsx5("span", { className: "text-sm font-medium ", children: props?.attributes?.label ? props?.attributes?.label + " %" : "" }),
     " ",
-    props?.attributes?.label && props?.attributes?.required && /* @__PURE__ */ jsx4("span", { className: "bg-error-weak", children: "*" }),
-    /* @__PURE__ */ jsx4(
+    props?.attributes?.label && props?.attributes?.required && /* @__PURE__ */ jsx5("span", { className: "bg-error-weak", children: "*" }),
+    /* @__PURE__ */ jsx5(
       "input",
       {
         type: "number",
@@ -215,14 +337,14 @@ var PercentageInput = (props) => {
         className: "peer mt-1 py-1.5 block w-full rounded shadow-sm number-input"
       }
     ),
-    /* @__PURE__ */ jsx4("p", { className: "hidden group-[.validated]:peer-invalid:block mt-1 bg-error-weak text-sm", children: props?.attributes?.errorMessage ? props.attributes.errorMessage : "" })
+    /* @__PURE__ */ jsx5("p", { className: "hidden group-[.validated]:peer-invalid:block mt-1 bg-error-weak text-sm", children: props?.attributes?.errorMessage ? props.attributes.errorMessage : "" })
   ] }) });
 };
 var PercentageInput_default = PercentageInput;
 
 // src/components/controls/edit/PhoneInput.tsx
-import React5 from "react";
-import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
+import React6 from "react";
+import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
 var PhoneInput = (props) => {
   const textChangeHandler = (event) => {
     const text = event.target.value;
@@ -241,13 +363,13 @@ var PhoneInput = (props) => {
   if (props.value !== void 0 && props.value !== null) {
     value = props.value;
   }
-  return /* @__PURE__ */ jsx5(React5.Fragment, { children: /* @__PURE__ */ jsxs5("label", { className: "block mb-1", children: [
-    /* @__PURE__ */ jsx5("span", { className: "text-sm font-medium ", children: props?.attributes?.label }),
+  return /* @__PURE__ */ jsx6(React6.Fragment, { children: /* @__PURE__ */ jsxs6("label", { className: "block mb-1", children: [
+    /* @__PURE__ */ jsx6("span", { className: "text-sm font-medium ", children: props?.attributes?.label }),
     " ",
-    props?.attributes?.label && props?.attributes?.required && /* @__PURE__ */ jsx5("span", { className: "bg-error-weak", children: "*" }),
-    /* @__PURE__ */ jsxs5("div", { className: "flex items-center rounded border ", children: [
-      /* @__PURE__ */ jsx5("span", { className: "px-3", children: props.prefix }),
-      /* @__PURE__ */ jsx5(
+    props?.attributes?.label && props?.attributes?.required && /* @__PURE__ */ jsx6("span", { className: "bg-error-weak", children: "*" }),
+    /* @__PURE__ */ jsxs6("div", { className: "flex items-center rounded border ", children: [
+      /* @__PURE__ */ jsx6("span", { className: "px-3", children: props.prefix }),
+      /* @__PURE__ */ jsx6(
         "input",
         {
           type: "text",
@@ -265,14 +387,14 @@ var PhoneInput = (props) => {
         }
       )
     ] }),
-    /* @__PURE__ */ jsx5("p", { className: "hidden group-[.validated]:peer-invalid:block mt-1 bg-error-weak text-sm", children: props?.attributes?.errorMessage ? props.attributes.errorMessage : "" })
+    /* @__PURE__ */ jsx6("p", { className: "hidden group-[.validated]:peer-invalid:block mt-1 bg-error-weak text-sm", children: props?.attributes?.errorMessage ? props.attributes.errorMessage : "" })
   ] }) });
 };
 var PhoneInput_default = PhoneInput;
 
 // src/components/controls/edit/NumberInput.tsx
-import React6 from "react";
-import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
+import React7 from "react";
+import { jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
 var NumberInput = (props) => {
   const textChangeHandler = (event) => {
     const text = event.target.value;
@@ -295,11 +417,11 @@ var NumberInput = (props) => {
   if (props.value !== void 0 && props.value !== null) {
     value = props.value;
   }
-  return /* @__PURE__ */ jsx6(React6.Fragment, { children: /* @__PURE__ */ jsxs6("label", { className: "block", children: [
-    props?.attributes?.label && /* @__PURE__ */ jsx6("span", { className: "text-sm inline-block pb-1 font-medium ", children: props?.attributes?.label }),
+  return /* @__PURE__ */ jsx7(React7.Fragment, { children: /* @__PURE__ */ jsxs7("label", { className: "block", children: [
+    props?.attributes?.label && /* @__PURE__ */ jsx7("span", { className: "text-sm inline-block pb-1 font-medium ", children: props?.attributes?.label }),
     " ",
-    props?.attributes?.label && props?.attributes?.required && /* @__PURE__ */ jsx6("span", { className: "bg-error-weak", children: "*" }),
-    /* @__PURE__ */ jsx6(
+    props?.attributes?.label && props?.attributes?.required && /* @__PURE__ */ jsx7("span", { className: "bg-error-weak", children: "*" }),
+    /* @__PURE__ */ jsx7(
       "input",
       {
         type: "number",
@@ -318,14 +440,14 @@ var NumberInput = (props) => {
         className: "peer py-1.5 block w-full rounded shadow-sm number-input input\n                     disabled:bg-slate-50 disabled:text-slate-500 disabled:border-slate-200 disabled:shadow-none\n                     "
       }
     ),
-    /* @__PURE__ */ jsx6("p", { className: "hidden group-[.validated]:peer-invalid:block mt-1 bg-error-weak text-sm", children: props?.attributes?.errorMessage ? props.attributes.errorMessage : "" })
+    /* @__PURE__ */ jsx7("p", { className: "hidden group-[.validated]:peer-invalid:block mt-1 bg-error-weak text-sm", children: props?.attributes?.errorMessage ? props.attributes.errorMessage : "" })
   ] }) });
 };
 var NumberInput_default = NumberInput;
 
 // src/components/controls/edit/CheckboxInput.tsx
-import React7 from "react";
-import { Fragment, jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
+import React8 from "react";
+import { Fragment, jsx as jsx8, jsxs as jsxs8 } from "react/jsx-runtime";
 var CheckboxInput = (props) => {
   const textChangeHandler = (event) => {
     let text = event.target.checked;
@@ -342,9 +464,9 @@ var CheckboxInput = (props) => {
   if (props.value != void 0 && props.value != null && props.value != "" && (props.value == "true" || props.value.toString() == "true")) {
     value = true;
   }
-  return /* @__PURE__ */ jsx7(React7.Fragment, { children: /* @__PURE__ */ jsxs7("div", { className: "mb-1", children: [
-    props?.attributes?.label && /* @__PURE__ */ jsxs7(Fragment, { children: [
-      /* @__PURE__ */ jsx7(
+  return /* @__PURE__ */ jsx8(React8.Fragment, { children: /* @__PURE__ */ jsxs8("div", { className: "mb-1", children: [
+    props?.attributes?.label && /* @__PURE__ */ jsxs8(Fragment, { children: [
+      /* @__PURE__ */ jsx8(
         "label",
         {
           htmlFor: props.name,
@@ -352,9 +474,9 @@ var CheckboxInput = (props) => {
           children: props.attributes.label
         }
       ),
-      props?.attributes?.label && props?.attributes?.required && /* @__PURE__ */ jsx7("span", { className: "bg-error-weak", children: "*" })
+      props?.attributes?.label && props?.attributes?.required && /* @__PURE__ */ jsx8("span", { className: "bg-error-weak", children: "*" })
     ] }),
-    /* @__PURE__ */ jsx7(
+    /* @__PURE__ */ jsx8(
       "input",
       {
         type: "checkbox",
@@ -371,14 +493,14 @@ var CheckboxInput = (props) => {
         className: "peer mt-1 py-1.5 block rounded shadow-sm\n                     disabled:bg-slate-50 disabled:text-slate-500 disabled:border-slate-200 disabled:shadow-none\n           "
       }
     ),
-    /* @__PURE__ */ jsx7("p", { className: "hidden group-[.validated]:peer-invalid:block mt-1 bg-error-weak text-sm", children: props?.attributes?.errorMessage || "" })
+    /* @__PURE__ */ jsx8("p", { className: "hidden group-[.validated]:peer-invalid:block mt-1 bg-error-weak text-sm", children: props?.attributes?.errorMessage || "" })
   ] }) });
 };
 var CheckboxInput_default = CheckboxInput;
 
 // src/components/controls/edit/OtpInput.tsx
-import React8 from "react";
-import { jsx as jsx8, jsxs as jsxs8 } from "react/jsx-runtime";
+import React9 from "react";
+import { jsx as jsx9, jsxs as jsxs9 } from "react/jsx-runtime";
 var OtpInput = (props) => {
   const textChangeHandler = (event) => {
     const text = event.target.value;
@@ -400,11 +522,11 @@ var OtpInput = (props) => {
   if (props.value !== void 0 && props.value !== null) {
     value = props.value;
   }
-  return /* @__PURE__ */ jsx8(React8.Fragment, { children: /* @__PURE__ */ jsxs8("label", { htmlFor: props.name, className: "block mb-1 w-full", children: [
-    /* @__PURE__ */ jsx8("span", { className: "text-sm font-medium ", children: props?.attributes?.label }),
+  return /* @__PURE__ */ jsx9(React9.Fragment, { children: /* @__PURE__ */ jsxs9("label", { htmlFor: props.name, className: "block mb-1 w-full", children: [
+    /* @__PURE__ */ jsx9("span", { className: "text-sm font-medium ", children: props?.attributes?.label }),
     " ",
-    props?.attributes?.label && props?.attributes?.required && /* @__PURE__ */ jsx8("span", { className: "bg-error-weak", children: "*" }),
-    /* @__PURE__ */ jsx8(
+    props?.attributes?.label && props?.attributes?.required && /* @__PURE__ */ jsx9("span", { className: "bg-error-weak", children: "*" }),
+    /* @__PURE__ */ jsx9(
       "input",
       {
         type: "text",
@@ -424,14 +546,14 @@ var OtpInput = (props) => {
         className: "peer mt-1 py-1.5 block w-full rounded shadow-sm tracking-[1.25em] text-center"
       }
     ),
-    /* @__PURE__ */ jsx8("p", { className: "hidden group-[.validated]:peer-invalid:block mt-1 bg-error-weak text-sm", children: props?.attributes?.errorMessage ? props.attributes.errorMessage : "" })
+    /* @__PURE__ */ jsx9("p", { className: "hidden group-[.validated]:peer-invalid:block mt-1 bg-error-weak text-sm", children: props?.attributes?.errorMessage ? props.attributes.errorMessage : "" })
   ] }) });
 };
 var OtpInput_default = OtpInput;
 
 // src/components/controls/edit/DateTimeInput.tsx
-import React9 from "react";
-import { jsx as jsx9, jsxs as jsxs9 } from "react/jsx-runtime";
+import React10 from "react";
+import { jsx as jsx10, jsxs as jsxs10 } from "react/jsx-runtime";
 var DateTimeInput = (props) => {
   const textChangeHandler = (event) => {
     const localDate = new Date(event.target.value);
@@ -463,12 +585,12 @@ var DateTimeInput = (props) => {
       e.preventDefault();
     }
   };
-  return /* @__PURE__ */ jsx9(React9.Fragment, { children: /* @__PURE__ */ jsxs9("label", { className: "block mb-1", children: [
-    /* @__PURE__ */ jsx9("span", { className: "text-sm font-medium ", children: props?.attributes?.label }),
+  return /* @__PURE__ */ jsx10(React10.Fragment, { children: /* @__PURE__ */ jsxs10("label", { className: "block mb-1", children: [
+    /* @__PURE__ */ jsx10("span", { className: "text-sm font-medium ", children: props?.attributes?.label }),
     " ",
-    props?.attributes?.label && props?.attributes?.required && /* @__PURE__ */ jsx9("span", { className: "bg-error-weak", children: "*" }),
-    /* @__PURE__ */ jsxs9("div", { className: "flex items-center gap-2", children: [
-      /* @__PURE__ */ jsx9(
+    props?.attributes?.label && props?.attributes?.required && /* @__PURE__ */ jsx10("span", { className: "bg-error-weak", children: "*" }),
+    /* @__PURE__ */ jsxs10("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsx10(
         "input",
         {
           type: "datetime-local",
@@ -486,19 +608,19 @@ var DateTimeInput = (props) => {
           className: "peer mt-1 py-1.5 block w-full rounded shadow-sm\n                     disabled:bg-slate-50 disabled:text-slate-500 disabled:border-slate-200 disabled:shadow-none\n                     "
         }
       ),
-      /* @__PURE__ */ jsx9("span", { children: timeZoneAbbr })
+      /* @__PURE__ */ jsx10("span", { children: timeZoneAbbr })
     ] }),
-    /* @__PURE__ */ jsx9("p", { className: "hidden group-[.validated]:peer-invalid:block mt-1 bg-error-weak text-sm", children: props?.attributes?.errorMessage ? props.attributes.errorMessage : "" })
+    /* @__PURE__ */ jsx10("p", { className: "hidden group-[.validated]:peer-invalid:block mt-1 bg-error-weak text-sm", children: props?.attributes?.errorMessage ? props.attributes.errorMessage : "" })
   ] }) });
 };
 var DateTimeInput_default = DateTimeInput;
 
 // src/components/controls/edit/ColorInput.tsx
-import React10, { useEffect } from "react";
-import { jsx as jsx10, jsxs as jsxs10 } from "react/jsx-runtime";
+import React11, { useEffect as useEffect2 } from "react";
+import { jsx as jsx11, jsxs as jsxs11 } from "react/jsx-runtime";
 var ColorInput = (props) => {
-  const [color, setColor] = React10.useState("#3b82f6");
-  useEffect(() => {
+  const [color, setColor] = React11.useState("#3b82f6");
+  useEffect2(() => {
     if (props.value !== void 0 && props.value !== null) {
       if (typeof props.value === "string") {
         setColor(props.value);
@@ -517,11 +639,11 @@ var ColorInput = (props) => {
       });
     }
   };
-  return /* @__PURE__ */ jsxs10("label", { className: "block mb-1", children: [
-    /* @__PURE__ */ jsx10("span", { className: "text-sm font-medium", children: props?.attributes?.label }),
+  return /* @__PURE__ */ jsxs11("label", { className: "block mb-1", children: [
+    /* @__PURE__ */ jsx11("span", { className: "text-sm font-medium", children: props?.attributes?.label }),
     " ",
-    props?.attributes?.label && props?.attributes?.required && /* @__PURE__ */ jsx10("span", { className: "bg-error-weak", children: "*" }),
-    /* @__PURE__ */ jsx10(
+    props?.attributes?.label && props?.attributes?.required && /* @__PURE__ */ jsx11("span", { className: "bg-error-weak", children: "*" }),
+    /* @__PURE__ */ jsx11(
       "input",
       {
         type: "color",
@@ -534,21 +656,21 @@ var ColorInput = (props) => {
         className: `w-[78px] h-12 block cursor-pointer`
       }
     ),
-    props?.attributes?.errorMessage && /* @__PURE__ */ jsx10("p", { className: "mt-1 bg-error-weak text-sm", children: props.attributes.errorMessage })
+    props?.attributes?.errorMessage && /* @__PURE__ */ jsx11("p", { className: "mt-1 bg-error-weak text-sm", children: props.attributes.errorMessage })
   ] });
 };
 var ColorInput_default = ColorInput;
 
 // src/components/controls/edit/SelectWithSearchInput.tsx
-import { useEffect as useEffect2, useRef, useState } from "react";
-import { jsx as jsx11, jsxs as jsxs11 } from "react/jsx-runtime";
+import { useEffect as useEffect3, useRef, useState as useState2 } from "react";
+import { jsx as jsx12, jsxs as jsxs12 } from "react/jsx-runtime";
 var SelectWithSearchInput = (props) => {
-  const [isOpen, setIsOpen] = useState(false);
-  const [searchTerm, setSearchTerm] = useState("");
-  const [highlightedIndex, setHighlightedIndex] = useState(-1);
-  const [selectedItem, setSelectedItem] = useState(null);
-  const [list, setList] = useState([]);
-  useEffect2(() => {
+  const [isOpen, setIsOpen] = useState2(false);
+  const [searchTerm, setSearchTerm] = useState2("");
+  const [highlightedIndex, setHighlightedIndex] = useState2(-1);
+  const [selectedItem, setSelectedItem] = useState2(null);
+  const [list, setList] = useState2([]);
+  useEffect3(() => {
     async function fetchData() {
       if (props.dataset) {
         setList(props.dataset);
@@ -603,7 +725,7 @@ var SelectWithSearchInput = (props) => {
     }
   };
   const dropdownRef = useRef(null);
-  useEffect2(() => {
+  useEffect3(() => {
     if (highlightedIndex >= 0 && dropdownRef.current) {
       const highlightedItem = dropdownRef.current.children[highlightedIndex];
       highlightedItem?.scrollIntoView({
@@ -612,15 +734,15 @@ var SelectWithSearchInput = (props) => {
       });
     }
   }, [highlightedIndex]);
-  return /* @__PURE__ */ jsxs11("div", { className: "relative", children: [
-    /* @__PURE__ */ jsxs11("label", { children: [
+  return /* @__PURE__ */ jsxs12("div", { className: "relative", children: [
+    /* @__PURE__ */ jsxs12("label", { children: [
       props.attributes?.label,
       " ",
       " ",
-      props?.attributes?.required && /* @__PURE__ */ jsx11("span", { className: "bg-error-weak", children: "*" })
+      props?.attributes?.required && /* @__PURE__ */ jsx12("span", { className: "bg-error-weak", children: "*" })
     ] }),
-    /* @__PURE__ */ jsxs11("div", { className: "relative", children: [
-      /* @__PURE__ */ jsx11(
+    /* @__PURE__ */ jsxs12("div", { className: "relative", children: [
+      /* @__PURE__ */ jsx12(
         "input",
         {
           type: "text",
@@ -636,13 +758,13 @@ var SelectWithSearchInput = (props) => {
           className: "peer py-1.5 select block w-full text-black rounded border-gray-300 shadow-sm\n          focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50\n          disabled:bg-slate-50 disabled:text-slate-500 disabled:border-slate-200 disabled:shadow-none\n          "
         }
       ),
-      /* @__PURE__ */ jsx11(
+      /* @__PURE__ */ jsx12(
         "button",
         {
           type: "button",
           onClick: () => setIsOpen(!isOpen),
           className: "absolute right-2 top-3 h-5 w-5 text-gray-500 focus:outline-none",
-          children: /* @__PURE__ */ jsx11(
+          children: /* @__PURE__ */ jsx12(
             "svg",
             {
               xmlns: "http://www.w3.org/2000/svg",
@@ -651,7 +773,7 @@ var SelectWithSearchInput = (props) => {
               strokeWidth: 1.5,
               stroke: "currentColor",
               className: "w-full h-full",
-              children: /* @__PURE__ */ jsx11(
+              children: /* @__PURE__ */ jsx12(
                 "path",
                 {
                   strokeLinecap: "round",
@@ -664,12 +786,12 @@ var SelectWithSearchInput = (props) => {
         }
       )
     ] }),
-    isOpen && /* @__PURE__ */ jsx11(
+    isOpen && /* @__PURE__ */ jsx12(
       "div",
       {
         ref: dropdownRef,
         className: "absolute z-10 mt-2 w-full bg-white border border-gray-200 rounded-md shadow-lg max-h-48 overflow-y-auto",
-        children: filteredItems.length > 0 ? filteredItems.map((item, index) => /* @__PURE__ */ jsx11(
+        children: filteredItems.length > 0 ? filteredItems.map((item, index) => /* @__PURE__ */ jsx12(
           "button",
           {
             onClick: (e) => handleSelect(e, item),
@@ -677,10 +799,10 @@ var SelectWithSearchInput = (props) => {
             role: "option",
             tabIndex: -1,
             onMouseEnter: () => setHighlightedIndex(index),
-            children: /* @__PURE__ */ jsx11("span", { children: item[props.dataTextFieldName] })
+            children: /* @__PURE__ */ jsx12("span", { children: item[props.dataTextFieldName] })
           },
           item[props.dataKeyFieldName]
-        )) : /* @__PURE__ */ jsx11("div", { className: "px-4 py-2 text-gray-500", children: "No results found" })
+        )) : /* @__PURE__ */ jsx12("div", { className: "px-4 py-2 text-gray-500", children: "No results found" })
       }
     )
   ] });
@@ -688,13 +810,13 @@ var SelectWithSearchInput = (props) => {
 var SelectWithSearchInput_default = SelectWithSearchInput;
 
 // src/components/controls/edit/BooleanSelect.tsx
-import React12, {
-  useState as useState2,
-  useEffect as useEffect3
+import React13, {
+  useState as useState3,
+  useEffect as useEffect4
 } from "react";
-import { jsx as jsx12, jsxs as jsxs12 } from "react/jsx-runtime";
+import { jsx as jsx13, jsxs as jsxs13 } from "react/jsx-runtime";
 var BooleanSelect = (props) => {
-  const [list, setList] = useState2();
+  const [list, setList] = useState3();
   const textChangeHandler = (event) => {
     const text = event.target.value;
     const boolValue = text?.toLowerCase() === "true" || text === "1";
@@ -707,7 +829,7 @@ var BooleanSelect = (props) => {
       });
     }
   };
-  useEffect3(() => {
+  useEffect4(() => {
     async function fetchData() {
       console.log("in select");
       if (props.dataset) {
@@ -741,11 +863,11 @@ var BooleanSelect = (props) => {
   if (props.value !== void 0 && props.value !== null) {
     value = props.value;
   }
-  return /* @__PURE__ */ jsx12(React12.Fragment, { children: /* @__PURE__ */ jsxs12("label", { className: "block", children: [
-    /* @__PURE__ */ jsx12("span", { className: "text-sm font-medium ", children: props?.attributes?.label }),
+  return /* @__PURE__ */ jsx13(React13.Fragment, { children: /* @__PURE__ */ jsxs13("label", { className: "block", children: [
+    /* @__PURE__ */ jsx13("span", { className: "text-sm font-medium ", children: props?.attributes?.label }),
     " ",
-    props?.attributes?.label && props?.attributes?.required && /* @__PURE__ */ jsx12("span", { className: "bg-error-weak", children: "*" }),
-    /* @__PURE__ */ jsxs12(
+    props?.attributes?.label && props?.attributes?.required && /* @__PURE__ */ jsx13("span", { className: "bg-error-weak", children: "*" }),
+    /* @__PURE__ */ jsxs13(
       "select",
       {
         name: props.name,
@@ -757,9 +879,9 @@ var BooleanSelect = (props) => {
         disabled: props?.attributes?.readOnly,
         className: "peer mt-1 py-1.5 block w-full text-black rounded shadow-sm\n                     disabled:bg-slate-50 disabled:text-slate-500 disabled:border-slate-200 disabled:shadow-none\n                     ",
         children: [
-          /* @__PURE__ */ jsx12("option", { className: "", value: "", children: props.attributes?.placeholder || "Select" }),
+          /* @__PURE__ */ jsx13("option", { className: "", value: "", children: props.attributes?.placeholder || "Select" }),
           list && list.map((item, i) => {
-            return /* @__PURE__ */ jsx12(
+            return /* @__PURE__ */ jsx13(
               "option",
               {
                 className: "fac-select-option",
@@ -772,14 +894,14 @@ var BooleanSelect = (props) => {
         ]
       }
     ),
-    /* @__PURE__ */ jsx12("p", { className: "hidden group-[.validated]:peer-invalid:block mt-1 bg-error-weak text-sm", children: props?.attributes?.errorMessage ? props.attributes.errorMessage : "" })
+    /* @__PURE__ */ jsx13("p", { className: "hidden group-[.validated]:peer-invalid:block mt-1 bg-error-weak text-sm", children: props?.attributes?.errorMessage ? props.attributes.errorMessage : "" })
   ] }) });
 };
 var BooleanSelect_default = BooleanSelect;
 
 // src/components/controls/edit/EmailInput.tsx
-import React13 from "react";
-import { jsx as jsx13, jsxs as jsxs13 } from "react/jsx-runtime";
+import React14 from "react";
+import { jsx as jsx14, jsxs as jsxs14 } from "react/jsx-runtime";
 var EmailInput = (props) => {
   const textChangeHandler = (event) => {
     const text = event.target.value;
@@ -804,11 +926,11 @@ var EmailInput = (props) => {
   if (props.value !== void 0 && props.value !== null) {
     value = props.value;
   }
-  return /* @__PURE__ */ jsx13(React13.Fragment, { children: /* @__PURE__ */ jsxs13("label", { className: "block mb-1", children: [
-    /* @__PURE__ */ jsx13("span", { className: "text-sm font-medium text-slate-700", children: props?.attributes?.label }),
+  return /* @__PURE__ */ jsx14(React14.Fragment, { children: /* @__PURE__ */ jsxs14("label", { className: "block mb-1", children: [
+    /* @__PURE__ */ jsx14("span", { className: "text-sm font-medium text-slate-700", children: props?.attributes?.label }),
     " ",
-    props?.attributes?.label && props?.attributes?.required && /* @__PURE__ */ jsx13("span", { className: "bg-error-weak", children: "*" }),
-    /* @__PURE__ */ jsx13(
+    props?.attributes?.label && props?.attributes?.required && /* @__PURE__ */ jsx14("span", { className: "bg-error-weak", children: "*" }),
+    /* @__PURE__ */ jsx14(
       "input",
       {
         type: "email",
@@ -824,14 +946,14 @@ var EmailInput = (props) => {
         className: "peer mt-1 py-1.5 block w-full rounded shadow-sm\n                     transition-all duration-500 ease-in-out"
       }
     ),
-    /* @__PURE__ */ jsx13("p", { className: "hidden group-[.validated]:peer-invalid:block mt-1 mb-0 bg-error-weak text-sm", children: props?.attributes?.errorMessage ? props.attributes.errorMessage : "" })
+    /* @__PURE__ */ jsx14("p", { className: "hidden group-[.validated]:peer-invalid:block mt-1 mb-0 bg-error-weak text-sm", children: props?.attributes?.errorMessage ? props.attributes.errorMessage : "" })
   ] }) });
 };
 var EmailInput_default = EmailInput;
 
 // src/components/controls/edit/TimeInput.tsx
-import React14 from "react";
-import { jsx as jsx14, jsxs as jsxs14 } from "react/jsx-runtime";
+import React15 from "react";
+import { jsx as jsx15, jsxs as jsxs15 } from "react/jsx-runtime";
 var TimeInput = (props) => {
   const timeChangeHandler = (event) => {
     const timeValue = event.target.value;
@@ -844,11 +966,11 @@ var TimeInput = (props) => {
       });
     }
   };
-  return /* @__PURE__ */ jsx14(React14.Fragment, { children: /* @__PURE__ */ jsxs14("label", { className: "block mb-1", children: [
-    /* @__PURE__ */ jsx14("span", { className: "text-sm font-medium", children: props?.attributes?.label }),
+  return /* @__PURE__ */ jsx15(React15.Fragment, { children: /* @__PURE__ */ jsxs15("label", { className: "block mb-1", children: [
+    /* @__PURE__ */ jsx15("span", { className: "text-sm font-medium", children: props?.attributes?.label }),
     " ",
-    props?.attributes?.label && props?.attributes?.required && /* @__PURE__ */ jsx14("span", { className: "bg-error-weak", children: "*" }),
-    /* @__PURE__ */ jsx14("div", { className: "flex items-center gap-2", children: /* @__PURE__ */ jsx14(
+    props?.attributes?.label && props?.attributes?.required && /* @__PURE__ */ jsx15("span", { className: "bg-error-weak", children: "*" }),
+    /* @__PURE__ */ jsx15("div", { className: "flex items-center gap-2", children: /* @__PURE__ */ jsx15(
       "input",
       {
         type: "time",
@@ -861,7 +983,7 @@ var TimeInput = (props) => {
         className: "peer mt-1 py-1.5 block w-full rounded shadow-sm\n                     disabled:bg-slate-50 disabled:text-slate-500 disabled:border-slate-200 disabled:shadow-none"
       }
     ) }),
-    /* @__PURE__ */ jsx14("p", { className: "hidden group-[.validated]:peer-invalid:block mt-1 bg-error-weak text-sm", children: props?.attributes?.errorMessage ?? "" })
+    /* @__PURE__ */ jsx15("p", { className: "hidden group-[.validated]:peer-invalid:block mt-1 bg-error-weak text-sm", children: props?.attributes?.errorMessage ?? "" })
   ] }) });
 };
 var TimeInput_default = TimeInput;
@@ -946,7 +1068,7 @@ var DateTimeUtility = class {
 var DateTimeUtility_default = DateTimeUtility;
 
 // src/components/controls/edit/DateInput.tsx
-import { jsx as jsx15, jsxs as jsxs15 } from "react/jsx-runtime";
+import { jsx as jsx16, jsxs as jsxs16 } from "react/jsx-runtime";
 var DateInput = (props) => {
   const value = useMemo(() => {
     if (props.value === void 0 || props.value === null || props.value === "") {
@@ -980,11 +1102,11 @@ var DateInput = (props) => {
       groupKey: props.groupKey
     });
   };
-  return /* @__PURE__ */ jsxs15("label", { className: "block mb-1", children: [
-    props.attributes?.label && /* @__PURE__ */ jsx15("span", { className: "text-sm font-medium", children: props.attributes.label }),
+  return /* @__PURE__ */ jsxs16("label", { className: "block mb-1", children: [
+    props.attributes?.label && /* @__PURE__ */ jsx16("span", { className: "text-sm font-medium", children: props.attributes.label }),
     " ",
-    props.attributes?.label && props.attributes.required && /* @__PURE__ */ jsx15("span", { className: "bg-error-weak", children: "*" }),
-    /* @__PURE__ */ jsx15(
+    props.attributes?.label && props.attributes.required && /* @__PURE__ */ jsx16("span", { className: "bg-error-weak", children: "*" }),
+    /* @__PURE__ */ jsx16(
       "input",
       {
         type: "date",
@@ -998,17 +1120,17 @@ var DateInput = (props) => {
         className: `peer input mt-1 py-1.5 block w-full rounded shadow-sm ${props.inputClasses ?? ""}`
       }
     ),
-    /* @__PURE__ */ jsx15("p", { className: "hidden group-[.validated]:peer-invalid:block mt-1 bg-error-weak text-sm", children: props.attributes?.errorMessage ?? "" })
+    /* @__PURE__ */ jsx16("p", { className: "hidden group-[.validated]:peer-invalid:block mt-1 bg-error-weak text-sm", children: props.attributes?.errorMessage ?? "" })
   ] });
 };
 var DateInput_default = DateInput;
 
 // src/components/controls/edit/RadioInput.tsx
-import { useEffect as useEffect4, useState as useState3 } from "react";
-import { jsx as jsx16, jsxs as jsxs16 } from "react/jsx-runtime";
+import { useEffect as useEffect5, useState as useState4 } from "react";
+import { jsx as jsx17, jsxs as jsxs17 } from "react/jsx-runtime";
 var RadioInput = (props) => {
-  const [list, setList] = useState3([]);
-  useEffect4(() => {
+  const [list, setList] = useState4([]);
+  useEffect5(() => {
     async function loadData() {
       if (props.dataset) {
         setList(props.dataset);
@@ -1050,22 +1172,22 @@ var RadioInput = (props) => {
       });
     }
   };
-  return /* @__PURE__ */ jsxs16("div", { className: "block", children: [
-    /* @__PURE__ */ jsx16("span", { className: "text-sm font-medium", children: props.attributes?.label }),
-    /* @__PURE__ */ jsx16("div", { className: "flex flex-col gap-3", children: list.map((item, index) => {
+  return /* @__PURE__ */ jsxs17("div", { className: "block", children: [
+    /* @__PURE__ */ jsx17("span", { className: "text-sm font-medium", children: props.attributes?.label }),
+    /* @__PURE__ */ jsx17("div", { className: "flex flex-col gap-3", children: list.map((item, index) => {
       const itemValue = item[props.dataKeyFieldName];
       const isSelected = String(itemValue) === String(props.value ?? "");
       const isRecommended = props.dataRecommendedValue !== void 0 && String(itemValue) === String(props.dataRecommendedValue);
       const resultClassName = isSelected ? isRecommended ? "bg-success" : props.dataRecommendedValue ? "bg-alert" : "border-transparent" : "border-transparent";
       const iconName = isSelected && props.dataRecommendedValue ? isRecommended ? "checkCircle" : "xCircle" : void 0;
       const inputId = `${props.name}-${props.index ?? 0}-id-${index}`;
-      return /* @__PURE__ */ jsxs16(
+      return /* @__PURE__ */ jsxs17(
         "div",
         {
           className: `font-normal flex items-center justify-between gap-4 cursor-pointer border rounded p-2 ${resultClassName}`,
           children: [
-            /* @__PURE__ */ jsxs16("div", { className: "flex gap-4 items-start", children: [
-              /* @__PURE__ */ jsx16(
+            /* @__PURE__ */ jsxs17("div", { className: "flex gap-4 items-start", children: [
+              /* @__PURE__ */ jsx17(
                 "input",
                 {
                   type: "radio",
@@ -1079,25 +1201,25 @@ var RadioInput = (props) => {
                   required: props.attributes?.required
                 }
               ),
-              /* @__PURE__ */ jsx16("label", { className: "text-body-950 pr-2", htmlFor: inputId, children: item[props.dataTextFieldName] })
+              /* @__PURE__ */ jsx17("label", { className: "text-body-950 pr-2", htmlFor: inputId, children: item[props.dataTextFieldName] })
             ] }),
-            iconName && /* @__PURE__ */ jsx16(Icon_default, { className: "w-5 h-5 text-success", name: iconName })
+            iconName && /* @__PURE__ */ jsx17(Icon_default, { className: "w-5 h-5 text-success", name: iconName })
           ]
         },
         String(itemValue)
       );
     }) }),
-    /* @__PURE__ */ jsx16("p", { className: "hidden group-[.validated]:peer-invalid:block mt-1 bg-error-weak text-sm", children: props.attributes?.errorMessage ?? "" })
+    /* @__PURE__ */ jsx17("p", { className: "hidden group-[.validated]:peer-invalid:block mt-1 bg-error-weak text-sm", children: props.attributes?.errorMessage ?? "" })
   ] });
 };
 var RadioInput_default = RadioInput;
 
 // src/components/controls/edit/Switcher.tsx
-import { useEffect as useEffect5, useState as useState4 } from "react";
-import { jsx as jsx17, jsxs as jsxs17 } from "react/jsx-runtime";
+import { useEffect as useEffect6, useState as useState5 } from "react";
+import { jsx as jsx18, jsxs as jsxs18 } from "react/jsx-runtime";
 var Switcher = (props) => {
-  const [list, setList] = useState4([]);
-  useEffect5(() => {
+  const [list, setList] = useState5([]);
+  useEffect6(() => {
     async function loadData() {
       if (props.dataset) {
         setList(props.dataset);
@@ -1138,9 +1260,9 @@ var Switcher = (props) => {
     });
   };
   const value = props.value === void 0 || props.value === null ? "" : String(props.value);
-  return /* @__PURE__ */ jsxs17("label", { className: "block mb-1", children: [
-    /* @__PURE__ */ jsx17("span", { className: "text-sm font-medium", children: props.attributes?.label }),
-    list.length === 0 ? /* @__PURE__ */ jsx17(
+  return /* @__PURE__ */ jsxs18("label", { className: "block mb-1", children: [
+    /* @__PURE__ */ jsx18("span", { className: "text-sm font-medium", children: props.attributes?.label }),
+    list.length === 0 ? /* @__PURE__ */ jsx18(
       "input",
       {
         type: "text",
@@ -1153,7 +1275,7 @@ var Switcher = (props) => {
         disabled: props.attributes?.readOnly,
         className: `peer input mt-1 py-1.5 block w-full rounded shadow-sm ${props.inputClasses ?? ""}`
       }
-    ) : /* @__PURE__ */ jsxs17(
+    ) : /* @__PURE__ */ jsxs18(
       "select",
       {
         name: props.name,
@@ -1164,8 +1286,8 @@ var Switcher = (props) => {
         disabled: props.attributes?.readOnly,
         className: `peer select my-1 py-1 block w-full rounded shadow-sm ${props.inputClasses ?? ""}`,
         children: [
-          /* @__PURE__ */ jsx17("option", { value: "", children: props.attributes?.placeholder || "Select" }),
-          list.map((item) => /* @__PURE__ */ jsx17(
+          /* @__PURE__ */ jsx18("option", { value: "", children: props.attributes?.placeholder || "Select" }),
+          list.map((item) => /* @__PURE__ */ jsx18(
             "option",
             {
               value: item[props.dataKeyFieldName],
@@ -1176,7 +1298,7 @@ var Switcher = (props) => {
         ]
       }
     ),
-    /* @__PURE__ */ jsx17("p", { className: "hidden group-[.validated]:peer-invalid:block mt-1 bg-error-weak text-sm", children: props.attributes?.errorMessage ?? "" })
+    /* @__PURE__ */ jsx18("p", { className: "hidden group-[.validated]:peer-invalid:block mt-1 bg-error-weak text-sm", children: props.attributes?.errorMessage ?? "" })
   ] });
 };
 var Switcher_default = Switcher;
@@ -1207,6 +1329,7 @@ export {
   MultilineTextInput_default,
   LineTextInput_default,
   MoneyInput_default,
+  Select_default,
   PercentageInput_default,
   PhoneInput_default,
   NumberInput_default,