@acoustte-digital-services/digitalstore-controls 0.16.0 → 0.18.0

package/dist/index.js

@@ -1,7 +1,9 @@
 "use strict";
 var __create = Object.create;
 var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
 var __getOwnPropNames = Object.getOwnPropertyNames;
 var __getOwnPropSymbols = Object.getOwnPropertySymbols;
 var __getProtoOf = Object.getPrototypeOf;
@@ -19,6 +21,7 @@ var __spreadValues = (a, b) => {
     }
   return a;
 };
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 var __export = (target, all) => {
   for (var name in all)
     __defProp(target, name, { get: all[name], enumerable: true });
@@ -44,6 +47,8 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/index.ts
 var index_exports = {};
 __export(index_exports, {
+  InputControl: () => InputControl_default,
+  InputControlType: () => InputControlType_default,
   ViewControl: () => ViewControl_default,
   ViewControlTypes: () => ViewControlTypes_default
 });
@@ -251,8 +256,1566 @@ var ViewControl = (props) => {
   return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react11.default.Fragment, { children: SelectedControlComponent ? /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(SelectedControlComponent, __spreadValues({}, props)) : "Control not found" });
 };
 var ViewControl_default = ViewControl;
+
+// src/controls/edit/InputControl.tsx
+var import_react31 = __toESM(require("react"));
+
+// src/controls/edit/MultilineTextInput.tsx
+var import_react12 = __toESM(require("react"));
+var import_jsx_runtime12 = require("react/jsx-runtime");
+var MultilineTextInput = (props) => {
+  var _a, _b, _c, _d, _e, _f, _g, _h, _i;
+  const textChangeHandler = (event) => {
+    const text = event.target.value;
+    if (props.callback !== void 0) {
+      props.callback(
+        {
+          name: props.name,
+          value: text,
+          index: props.index,
+          groupKey: props.groupKey
+        }
+      );
+    }
+  };
+  let value = "";
+  if (props.value !== void 0 && props.value !== null) {
+    value = props.value;
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_react12.default.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("label", { className: "block mb-1", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "text-sm font-medium ", children: (_a = props == null ? void 0 : props.attributes) == null ? void 0 : _a.label }),
+    " ",
+    ((_b = props == null ? void 0 : props.attributes) == null ? void 0 : _b.label) && ((_c = props == null ? void 0 : props.attributes) == null ? void 0 : _c.required) && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "text-alert", children: "*" }),
+    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+      "textarea",
+      {
+        name: props.name,
+        id: props.name,
+        value,
+        onChange: textChangeHandler,
+        onBlur: props == null ? void 0 : props.onBlur,
+        rows: 4,
+        required: (_d = props == null ? void 0 : props.attributes) == null ? void 0 : _d.required,
+        placeholder: (_e = props == null ? void 0 : props.attributes) == null ? void 0 : _e.placeholder,
+        maxLength: (_f = props == null ? void 0 : props.attributes) == null ? void 0 : _f.maxLength,
+        disabled: (_g = props == null ? void 0 : props.attributes) == null ? void 0 : _g.readOnly,
+        minLength: (_h = props == null ? void 0 : props.attributes) == null ? void 0 : _h.minLength,
+        className: "peer mt-1 py-1.5 block w-full rounded border-gray-300 shadow-sm\r\n                     focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50"
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("p", { className: "hidden group-[.validated]:peer-invalid:block  mt-1  text-alert text-sm", children: ((_i = props == null ? void 0 : props.attributes) == null ? void 0 : _i.errorMessage) ? props.attributes.errorMessage : "" })
+  ] }) });
+};
+var MultilineTextInput_default = MultilineTextInput;
+
+// src/controls/edit/LineTextInput.tsx
+var import_react13 = __toESM(require("react"));
+var import_jsx_runtime13 = require("react/jsx-runtime");
+var LineTextInput = (props) => {
+  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k;
+  const textChangeHandler = (event) => {
+    const text = event.target.value;
+    if (props.callback !== void 0) {
+      props.callback(
+        {
+          name: props.name,
+          value: text,
+          index: props.index,
+          groupKey: props.groupKey
+        }
+      );
+    }
+  };
+  let value = "";
+  if (props.value !== void 0 && props.value !== null) {
+    value = props.value;
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_react13.default.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("label", { className: "block", children: [
+    ((_a = props == null ? void 0 : props.attributes) == null ? void 0 : _a.label) && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "text-sm inline-block pb-1 font-medium ", children: (_b = props == null ? void 0 : props.attributes) == null ? void 0 : _b.label }),
+    " ",
+    ((_c = props == null ? void 0 : props.attributes) == null ? void 0 : _c.label) && ((_d = props == null ? void 0 : props.attributes) == null ? void 0 : _d.required) && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "text-alert", children: "*" }),
+    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+      "input",
+      {
+        type: "text",
+        name: props.name,
+        id: props.name,
+        value,
+        onChange: textChangeHandler,
+        onBlur: props == null ? void 0 : props.onBlur,
+        required: (_e = props == null ? void 0 : props.attributes) == null ? void 0 : _e.required,
+        placeholder: (_f = props == null ? void 0 : props.attributes) == null ? void 0 : _f.placeholder,
+        maxLength: (_g = props == null ? void 0 : props.attributes) == null ? void 0 : _g.maxLength,
+        pattern: (_h = props == null ? void 0 : props.attributes) == null ? void 0 : _h.pattern,
+        disabled: (_i = props == null ? void 0 : props.attributes) == null ? void 0 : _i.readOnly,
+        minLength: (_j = props == null ? void 0 : props.attributes) == null ? void 0 : _j.minLength,
+        className: `peer py-1.5 block w-full 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 == null ? void 0 : props.inputClasses) ? props.inputClasses : ``}
+                     `
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("p", { className: "hidden group-[.validated]:peer-invalid:block  mt-1  text-alert text-sm", children: ((_k = props == null ? void 0 : props.attributes) == null ? void 0 : _k.errorMessage) ? props.attributes.errorMessage : "" })
+  ] }) });
+};
+var LineTextInput_default = LineTextInput;
+
+// src/controls/edit/MoneyInput.tsx
+var import_react14 = __toESM(require("react"));
+var import_jsx_runtime14 = require("react/jsx-runtime");
+var MoneyInput = (props) => {
+  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
+  const textChangeHandler = (event) => {
+    const rawValue = event.target.value;
+    const numericValue = parseFloat(rawValue);
+    if (rawValue === "" || !isNaN(numericValue) && numericValue >= 0) {
+      if (props.callback !== void 0) {
+        props.callback({
+          name: props.name,
+          value: rawValue,
+          index: props.index,
+          groupKey: props.groupKey
+        });
+      }
+    }
+  };
+  const handleWheel = (event) => {
+    event.preventDefault();
+    event.target.blur();
+  };
+  let value;
+  if (props.value !== void 0 && props.value !== null) {
+    value = props.value;
+  }
+  const preventNegative = (e) => {
+    if (e.key === "-") {
+      e.preventDefault();
+    }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react14.default.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("label", { className: "block mb-1", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: "text-sm font-medium ", children: (_a = props == null ? void 0 : props.attributes) == null ? void 0 : _a.label }),
+    " ",
+    ((_b = props == null ? void 0 : props.attributes) == null ? void 0 : _b.label) && ((_c = props == null ? void 0 : props.attributes) == null ? void 0 : _c.required) && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: "text-alert", children: "*" }),
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+      "input",
+      {
+        type: "number",
+        name: props.name,
+        id: props.name,
+        value,
+        min: 0,
+        onChange: textChangeHandler,
+        onWheel: handleWheel,
+        onKeyDown: preventNegative,
+        required: (_d = props == null ? void 0 : props.attributes) == null ? void 0 : _d.required,
+        placeholder: (_e = props == null ? void 0 : props.attributes) == null ? void 0 : _e.placeholder,
+        maxLength: (_f = props == null ? void 0 : props.attributes) == null ? void 0 : _f.maxLength,
+        pattern: (_g = props == null ? void 0 : props.attributes) == null ? void 0 : _g.pattern,
+        disabled: (_h = props == null ? void 0 : props.attributes) == null ? void 0 : _h.readOnly,
+        minLength: (_i = props == null ? void 0 : props.attributes) == null ? void 0 : _i.minLength,
+        className: "peer mt-1 py-1.5 block w-full rounded border-gray-300 shadow-sm\r\n                     focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50 number-input"
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("p", { className: "hidden group-[.validated]:peer-invalid:block  mt-1  text-alert text-sm", children: ((_j = props == null ? void 0 : props.attributes) == null ? void 0 : _j.errorMessage) ? props.attributes.errorMessage : "" })
+  ] }) });
+};
+var MoneyInput_default = MoneyInput;
+
+// src/controls/edit/Select.tsx
+var import_react15 = require("react");
+var import_jsx_runtime15 = require("react/jsx-runtime");
+var Select = (props) => {
+  var _a, _b, _c, _d, _e, _f, _g, _h;
+  const [list, setList] = (0, import_react15.useState)([]);
+  const getSafeValue = (val) => {
+    if (val === null || val === void 0) return "";
+    if (typeof val === "boolean") return val ? "1" : "0";
+    return val;
+  };
+  const textChangeHandler = (event) => {
+    var _a2;
+    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);
+        }
+      }
+    }
+    (_a2 = props.callback) == null ? void 0 : _a2.call(props, {
+      name: props.name,
+      value: finalValue,
+      index: props.index,
+      groupKey: props.groupKey
+    });
+  };
+  (0, import_react15.useEffect)(() => {
+    async function fetchData() {
+      var _a2;
+      if (props.dataset) {
+        setList(props.dataset);
+        return;
+      }
+      if (props.dataSource && props.serviceClient) {
+        let dataSource = props.dataSource;
+        let response;
+        if (props.dataSourceDependsOn && props.dependentValue) {
+          dataSource = dataSource.replace(
+            `{${props.dataSourceDependsOn}}`,
+            props.dependentValue
+          );
+        }
+        response = await props.serviceClient.get(dataSource);
+        setList((_a2 = response.result) != null ? _a2 : []);
+      }
+    }
+    fetchData();
+  }, [
+    props.dataset,
+    props.dataSource,
+    props.dependentValue,
+    props.dataSourceDependsOn
+  ]);
+  const value = getSafeValue(props.value);
+  return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("label", { className: "block", children: [
+    ((_a = props.attributes) == null ? void 0 : _a.label) && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "text-sm font-medium inline-block pb-1", children: (_b = props.attributes) == null ? void 0 : _b.label }),
+    ((_c = props.attributes) == null ? void 0 : _c.label) && ((_d = props.attributes) == null ? void 0 : _d.required) && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "text-alert", children: "*" }),
+    /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
+      "select",
+      {
+        name: props.name,
+        id: props.name,
+        value,
+        onChange: textChangeHandler,
+        required: (_e = props.attributes) == null ? void 0 : _e.required,
+        disabled: (_f = props.attributes) == null ? void 0 : _f.readOnly,
+        className: "peer py-1.5 block w-full text-black rounded border-gray-300 shadow-sm\r\n                   focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50\r\n                   disabled:bg-slate-50 disabled:text-slate-500 disabled:border-slate-200 disabled:shadow-none",
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("option", { value: "", children: ((_g = props.attributes) == null ? void 0 : _g.placeholder) || "Select" }),
+          list.map((item, index) => {
+            const keyField = props.dataKeyFieldName;
+            const textField = props.dataTextFieldName;
+            return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("option", { value: item[keyField], children: item[textField] }, index);
+          })
+        ]
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("p", { className: "hidden group-[.validated]:peer-invalid:block mt-1 text-alert text-sm", children: ((_h = props.attributes) == null ? void 0 : _h.errorMessage) || "" })
+  ] });
+};
+var Select_default = Select;
+
+// src/controls/edit/PercentageInput.tsx
+var import_react16 = __toESM(require("react"));
+var import_jsx_runtime16 = require("react/jsx-runtime");
+var PercentageInput = (props) => {
+  var _a, _b, _c, _d, _e, _f, _g, _h, _i;
+  const textChangeHandler = (event) => {
+    const rawValue = event.target.value;
+    const numericValue = parseFloat(rawValue);
+    if (rawValue === "" || !isNaN(numericValue) && numericValue >= 0) {
+      if (props.callback !== void 0) {
+        props.callback({
+          name: props.name,
+          value: rawValue,
+          index: props.index,
+          groupKey: props.groupKey
+        });
+      }
+    }
+  };
+  const handleWheel = (event) => {
+    event.preventDefault();
+    event.target.blur();
+  };
+  let value;
+  if (props.value !== void 0 && props.value !== null) {
+    value = props.value;
+  }
+  const preventNegative = (e) => {
+    if (e.key === "-") {
+      e.preventDefault();
+    }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_react16.default.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("label", { className: "block mb-1", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("span", { className: "text-sm font-medium ", children: ((_a = props == null ? void 0 : props.attributes) == null ? void 0 : _a.label) ? ((_b = props == null ? void 0 : props.attributes) == null ? void 0 : _b.label) + " %" : "" }),
+    " ",
+    ((_c = props == null ? void 0 : props.attributes) == null ? void 0 : _c.label) && ((_d = props == null ? void 0 : props.attributes) == null ? void 0 : _d.required) && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("span", { className: "text-alert", children: "*" }),
+    /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+      "input",
+      {
+        type: "number",
+        name: props.name,
+        id: props.name,
+        value,
+        min: 0,
+        onChange: textChangeHandler,
+        onKeyDown: preventNegative,
+        onWheel: handleWheel,
+        required: (_e = props == null ? void 0 : props.attributes) == null ? void 0 : _e.required,
+        placeholder: (_f = props == null ? void 0 : props.attributes) == null ? void 0 : _f.placeholder,
+        pattern: (_g = props == null ? void 0 : props.attributes) == null ? void 0 : _g.pattern,
+        disabled: (_h = props == null ? void 0 : props.attributes) == null ? void 0 : _h.readOnly,
+        max: "100",
+        className: "peer mt-1 py-1.5 block w-full rounded border-gray-300 shadow-sm\r\n                     focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50 number-input"
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("p", { className: "hidden group-[.validated]:peer-invalid:block  mt-1  text-alert text-sm", children: ((_i = props == null ? void 0 : props.attributes) == null ? void 0 : _i.errorMessage) ? props.attributes.errorMessage : "" })
+  ] }) });
+};
+var PercentageInput_default = PercentageInput;
+
+// src/controls/edit/PhoneInput.tsx
+var import_react17 = __toESM(require("react"));
+var import_jsx_runtime17 = require("react/jsx-runtime");
+var PhoneInput = (props) => {
+  var _a, _b, _c, _d, _e, _f, _g, _h;
+  const textChangeHandler = (event) => {
+    const text = event.target.value;
+    if (props.callback !== void 0) {
+      props.callback(
+        {
+          name: props.name,
+          value: text,
+          index: props.index,
+          groupKey: props.groupKey
+        }
+      );
+    }
+  };
+  let value = "";
+  if (props.value !== void 0 && props.value !== null) {
+    value = props.value;
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_react17.default.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("label", { className: "block mb-1", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "text-sm font-medium ", children: (_a = props == null ? void 0 : props.attributes) == null ? void 0 : _a.label }),
+    /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "flex items-center bg-gray-100 rounded border border-gray-300 \r\n         focus-within:border-indigo-300 focus-within:ring focus-within:ring-indigo-200 focus-within:ring-opacity-50", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "px-3 text-gray-700", children: props.prefix }),
+      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+        "input",
+        {
+          type: "text",
+          name: props.name,
+          id: props.name,
+          value,
+          onChange: textChangeHandler,
+          required: (_b = props == null ? void 0 : props.attributes) == null ? void 0 : _b.required,
+          placeholder: (_c = props == null ? void 0 : props.attributes) == null ? void 0 : _c.placeholder,
+          maxLength: (_d = props == null ? void 0 : props.attributes) == null ? void 0 : _d.maxLength,
+          pattern: (_e = props == null ? void 0 : props.attributes) == null ? void 0 : _e.pattern,
+          disabled: (_f = props == null ? void 0 : props.attributes) == null ? void 0 : _f.readOnly,
+          minLength: (_g = props == null ? void 0 : props.attributes) == null ? void 0 : _g.minLength,
+          className: "py-1.5 block w-full outline-none focus:ring-0 border-0 mr-0.5"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("p", { className: "hidden group-[.validated]:peer-invalid:block  mt-1  text-alert text-sm", children: ((_h = props == null ? void 0 : props.attributes) == null ? void 0 : _h.errorMessage) ? props.attributes.errorMessage : "" })
+  ] }) });
+};
+var PhoneInput_default = PhoneInput;
+
+// src/controls/edit/NumberInput.tsx
+var import_react18 = __toESM(require("react"));
+var import_jsx_runtime18 = require("react/jsx-runtime");
+var NumberInput = (props) => {
+  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k;
+  const textChangeHandler = (event) => {
+    const text = event.target.value;
+    if (props.callback !== void 0) {
+      props.callback(
+        {
+          name: props.name,
+          value: text,
+          index: props.index,
+          groupKey: props.groupKey
+        }
+      );
+    }
+  };
+  const handleWheel = (event) => {
+    event.preventDefault();
+    event.target.blur();
+  };
+  let value;
+  if (props.value !== void 0 && props.value !== null) {
+    value = props.value;
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_react18.default.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("label", { className: "block", children: [
+    ((_a = props == null ? void 0 : props.attributes) == null ? void 0 : _a.label) && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: "text-sm inline-block pb-1 font-medium ", children: (_b = props == null ? void 0 : props.attributes) == null ? void 0 : _b.label }),
+    " ",
+    ((_c = props == null ? void 0 : props.attributes) == null ? void 0 : _c.label) && ((_d = props == null ? void 0 : props.attributes) == null ? void 0 : _d.required) && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: "text-alert", children: "*" }),
+    /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+      "input",
+      {
+        type: "number",
+        name: props.name,
+        id: props.name,
+        value,
+        onChange: textChangeHandler,
+        onWheel: handleWheel,
+        required: (_e = props == null ? void 0 : props.attributes) == null ? void 0 : _e.required,
+        placeholder: (_f = props == null ? void 0 : props.attributes) == null ? void 0 : _f.placeholder,
+        onBlur: props == null ? void 0 : props.onBlur,
+        pattern: (_g = props == null ? void 0 : props.attributes) == null ? void 0 : _g.pattern,
+        disabled: (_h = props == null ? void 0 : props.attributes) == null ? void 0 : _h.readOnly,
+        max: (_i = props == null ? void 0 : props.attributes) == null ? void 0 : _i.maxValue,
+        min: (_j = props == null ? void 0 : props.attributes) == null ? void 0 : _j.minValue,
+        className: "peer py-1.5 block w-full rounded border-gray-300 shadow-sm\r\n                     focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50 number-input\r\n                     disabled:bg-slate-50 disabled:text-slate-500 disabled:border-slate-200 disabled:shadow-none\r\n                     "
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("p", { className: "hidden group-[.validated]:peer-invalid:block  mt-1  text-alert text-sm", children: ((_k = props == null ? void 0 : props.attributes) == null ? void 0 : _k.errorMessage) ? props.attributes.errorMessage : "" })
+  ] }) });
+};
+var NumberInput_default = NumberInput;
+
+// src/controls/edit/CheckboxInput.tsx
+var import_react19 = __toESM(require("react"));
+var import_jsx_runtime19 = require("react/jsx-runtime");
+var CheckboxInput = (props) => {
+  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
+  const textChangeHandler = (event) => {
+    let text = event.target.checked;
+    console.log(text);
+    if (props.callback !== void 0) {
+      props.callback(
+        {
+          name: props.name,
+          value: text,
+          index: props.index,
+          groupKey: props.groupKey
+        }
+      );
+    }
+  };
+  const trueValue = true;
+  let value = false;
+  if (props.value != void 0 && props.value != null && props.value != "" && (props.value == "true" || props.value.toString() == "true")) {
+    value = true;
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react19.default.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("label", { className: "block mb-1", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "text-sm font-medium", children: (_a = props == null ? void 0 : props.attributes) == null ? void 0 : _a.label }),
+    " ",
+    ((_b = props == null ? void 0 : props.attributes) == null ? void 0 : _b.label) && ((_c = props == null ? void 0 : props.attributes) == null ? void 0 : _c.required) && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "text-alert", children: "*" }),
+    /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+      "input",
+      {
+        type: "checkbox",
+        name: props.name,
+        id: props.name,
+        checked: value,
+        onChange: textChangeHandler,
+        required: (_d = props == null ? void 0 : props.attributes) == null ? void 0 : _d.required,
+        placeholder: (_e = props == null ? void 0 : props.attributes) == null ? void 0 : _e.placeholder,
+        maxLength: (_f = props == null ? void 0 : props.attributes) == null ? void 0 : _f.maxLength,
+        pattern: (_g = props == null ? void 0 : props.attributes) == null ? void 0 : _g.pattern,
+        disabled: (_h = props == null ? void 0 : props.attributes) == null ? void 0 : _h.readOnly,
+        minLength: (_i = props == null ? void 0 : props.attributes) == null ? void 0 : _i.minLength,
+        className: "peer mt-1 py-1.5 block rounded border-gray-300 shadow-sm\r\n                     focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50\r\n                     disabled:bg-slate-50 disabled:text-slate-500 disabled:border-slate-200 disabled:shadow-none\r\n                     "
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("p", { className: "hidden group-[.validated]:peer-invalid:block  mt-1  text-alert text-sm", children: ((_j = props == null ? void 0 : props.attributes) == null ? void 0 : _j.errorMessage) ? props.attributes.errorMessage : "" })
+  ] }) });
+};
+var CheckboxInput_default = CheckboxInput;
+
+// src/controls/edit/OtpInput.tsx
+var import_react20 = __toESM(require("react"));
+var import_jsx_runtime20 = require("react/jsx-runtime");
+var OtpInput = (props) => {
+  var _a, _b, _c, _d, _e, _f, _g, _h;
+  const textChangeHandler = (event) => {
+    const text = event.target.value;
+    if (props.callback !== void 0) {
+      props.callback(
+        {
+          name: props.name,
+          value: text,
+          index: props.index,
+          groupKey: props.groupKey
+        }
+      );
+    }
+  };
+  const handleWheel = (event) => {
+    event.preventDefault();
+  };
+  let value;
+  if (props.value !== void 0 && props.value !== null) {
+    value = props.value;
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react20.default.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("label", { htmlFor: props.name, className: "block mb-1 w-full", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "text-sm font-medium ", children: (_a = props == null ? void 0 : props.attributes) == null ? void 0 : _a.label }),
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+      "input",
+      {
+        type: "text",
+        name: props.name,
+        id: props.name,
+        value,
+        onChange: textChangeHandler,
+        autoComplete: "off",
+        required: (_b = props == null ? void 0 : props.attributes) == null ? void 0 : _b.required,
+        placeholder: (_c = props == null ? void 0 : props.attributes) == null ? void 0 : _c.placeholder,
+        maxLength: 4,
+        pattern: (_d = props == null ? void 0 : props.attributes) == null ? void 0 : _d.pattern,
+        disabled: (_e = props == null ? void 0 : props.attributes) == null ? void 0 : _e.readOnly,
+        minLength: (_f = props == null ? void 0 : props.attributes) == null ? void 0 : _f.minLength,
+        autoFocus: (_g = props == null ? void 0 : props.attributes) == null ? void 0 : _g.autoFocus,
+        onWheel: handleWheel,
+        className: "peer mt-1 py-1.5 block w-full rounded border-gray-300 shadow-sm tracking-[1.25em] text-center\r\n                     focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50"
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("p", { className: "hidden group-[.validated]:peer-invalid:block  mt-1  text-alert text-sm", children: ((_h = props == null ? void 0 : props.attributes) == null ? void 0 : _h.errorMessage) ? props.attributes.errorMessage : "" })
+  ] }) });
+};
+var OtpInput_default = OtpInput;
+
+// src/controls/edit/DateTimeInput.tsx
+var import_react21 = __toESM(require("react"));
+
+// src/controls/utilities/DateTimeUtility.tsx
+var DateTimeUtility = class {
+  constructor() {
+  }
+  static formatDate(date) {
+    if (!date) {
+      throw new Error("Invalid date");
+    }
+    const pad = (num) => num.toString().padStart(2, "0");
+    const year = date.getFullYear();
+    const month = pad(date.getMonth() + 1);
+    const day = pad(date.getDate());
+    const hours = pad(date.getHours());
+    const minutes = pad(date.getMinutes());
+    const seconds = pad(date.getSeconds());
+    return `${year}-${month}-${day}T${hours}:${minutes}:${seconds}`;
+  }
+  static getMonthShortNameCustom(month) {
+    const monthNames = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
+    if (month < 1 || month > 12) {
+      throw new Error("Invalid month. Please provide a value between 1 and 12.");
+    }
+    return monthNames[month - 1];
+  }
+  static getCurrentWeekRange() {
+    const today = /* @__PURE__ */ new Date();
+    const day = today.getDay();
+    const diffToMonday = (day === 0 ? -6 : 1) - day;
+    const monday = new Date(today);
+    monday.setDate(today.getDate() + diffToMonday);
+    monday.setHours(0, 0, 0, 0);
+    const sunday = new Date(monday);
+    sunday.setDate(monday.getDate() + 6);
+    sunday.setHours(23, 59, 59, 999);
+    return { start: monday, end: sunday };
+  }
+  static getCurrentMonthRange() {
+    const now = /* @__PURE__ */ new Date();
+    const start = new Date(now.getFullYear(), now.getMonth(), 1);
+    const end = new Date(now.getFullYear(), now.getMonth() + 1, 0);
+    return { start, end };
+  }
+  static formatShortDate(date) {
+    const day = date.getDate();
+    const month = this.getMonthShortNameCustom(date.getMonth() + 1);
+    return `${day} ${month}`;
+  }
+  static formatIndianCurrencyShort(value) {
+    if (value >= 1e7) {
+      return `${(value / 1e7).toFixed(2)} Cr`;
+    } else if (value >= 1e5) {
+      return `${(value / 1e5).toFixed(2)} L`;
+    } else if (value >= 1e3) {
+      return `${(value / 1e3).toFixed(2)} K`;
+    } else {
+      return `${value}`;
+    }
+  }
+};
+var DateTimeUtility_default = DateTimeUtility;
+
+// src/controls/edit/DateTimeInput.tsx
+var import_jsx_runtime21 = require("react/jsx-runtime");
+var DateTimeInput = (props) => {
+  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k;
+  const textChangeHandler = (event) => {
+    const localDate = new Date(event.target.value);
+    if (props.callback !== void 0) {
+      const utcDate = new Date(localDate.getTime() + localDate.getTimezoneOffset() * 6e4);
+      let formattedDate = DateTimeUtility_default.formatDate(utcDate);
+      props.callback(
+        {
+          name: props.name,
+          value: formattedDate,
+          index: props.index,
+          groupKey: props.groupKey
+        }
+      );
+    }
+  };
+  let value;
+  let localvalue;
+  let timeZoneAbbr;
+  const now = /* @__PURE__ */ new Date();
+  const utcOffset = now.getTimezoneOffset();
+  if (props.value !== void 0 && props.value !== null) {
+    value = props.value;
+    const now2 = /* @__PURE__ */ new Date();
+    const offsetMinutes = now2.getTimezoneOffset();
+    const offsetMilliseconds = offsetMinutes * 60 * 1e3;
+    const valDate = value.toString().includes("Z") ? new Date(value) : /* @__PURE__ */ new Date(value + "Z");
+    let localDate = new Date(valDate.getTime() - offsetMilliseconds);
+    timeZoneAbbr = now2.toLocaleTimeString("en", { timeZoneName: "short" }).split(" ")[2];
+    localvalue = (_a = localDate == null ? void 0 : localDate.toISOString()) == null ? void 0 : _a.slice(0, 16);
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react21.default.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("label", { className: "block mb-1", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "text-sm font-medium ", children: (_b = props == null ? void 0 : props.attributes) == null ? void 0 : _b.label }),
+    " ",
+    ((_c = props == null ? void 0 : props.attributes) == null ? void 0 : _c.label) && ((_d = props == null ? void 0 : props.attributes) == null ? void 0 : _d.required) && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "text-alert", children: "*" }),
+    /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+        "input",
+        {
+          type: "datetime-local",
+          name: props.name,
+          id: props.name,
+          value: localvalue,
+          onChange: textChangeHandler,
+          required: (_e = props == null ? void 0 : props.attributes) == null ? void 0 : _e.required,
+          placeholder: (_f = props == null ? void 0 : props.attributes) == null ? void 0 : _f.placeholder,
+          maxLength: (_g = props == null ? void 0 : props.attributes) == null ? void 0 : _g.maxLength,
+          pattern: (_h = props == null ? void 0 : props.attributes) == null ? void 0 : _h.pattern,
+          disabled: (_i = props == null ? void 0 : props.attributes) == null ? void 0 : _i.readOnly,
+          minLength: (_j = props == null ? void 0 : props.attributes) == null ? void 0 : _j.minLength,
+          className: "peer mt-1 py-1.5 block w-full rounded border-gray-300 shadow-sm\r\n                     focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50\r\n                     disabled:bg-slate-50 disabled:text-slate-500 disabled:border-slate-200 disabled:shadow-none\r\n                     "
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { children: timeZoneAbbr })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { className: "hidden group-[.validated]:peer-invalid:block  mt-1  text-alert text-sm", children: ((_k = props == null ? void 0 : props.attributes) == null ? void 0 : _k.errorMessage) ? props.attributes.errorMessage : "" })
+  ] }) });
+};
+var DateTimeInput_default = DateTimeInput;
+
+// src/controls/edit/ColorInput.tsx
+var import_react22 = __toESM(require("react"));
+var import_jsx_runtime22 = require("react/jsx-runtime");
+var ColorInput = (props) => {
+  var _a, _b, _c, _d, _e;
+  const [color, setColor] = import_react22.default.useState("#3b82f6");
+  (0, import_react22.useEffect)(() => {
+    if (props.value !== void 0 && props.value !== null) {
+      if (typeof props.value === "string") {
+        setColor(props.value);
+      }
+    }
+  }, [props.value]);
+  const handleColorChange = (event) => {
+    const newColor = event.target.value;
+    setColor(newColor);
+    if (props.callback) {
+      props.callback(
+        {
+          name: props.name,
+          value: newColor,
+          index: props.index,
+          groupKey: props.groupKey
+        }
+      );
+    }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("label", { className: "block mb-1", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "text-sm font-medium", children: (_a = props == null ? void 0 : props.attributes) == null ? void 0 : _a.label }),
+    " ",
+    ((_b = props == null ? void 0 : props.attributes) == null ? void 0 : _b.label) && ((_c = props == null ? void 0 : props.attributes) == null ? void 0 : _c.required) && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "text-alert", children: "*" }),
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+      "input",
+      {
+        type: "color",
+        name: props.name,
+        id: props.name,
+        value: color,
+        onChange: handleColorChange,
+        required: (_d = props == null ? void 0 : props.attributes) == null ? void 0 : _d.required,
+        className: `w-[88px] h-12 block cursor-pointer focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50`
+      }
+    ),
+    ((_e = props == null ? void 0 : props.attributes) == null ? void 0 : _e.errorMessage) && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("p", { className: "mt-1 text-alert text-sm", children: props.attributes.errorMessage })
+  ] });
+};
+var ColorInput_default = ColorInput;
+
+// src/controls/edit/SelectWithSearchInput.tsx
+var import_react23 = require("react");
+var import_jsx_runtime23 = require("react/jsx-runtime");
+var SelectWithSearchInput = (props) => {
+  var _a, _b;
+  const [isOpen, setIsOpen] = (0, import_react23.useState)(false);
+  const [searchTerm, setSearchTerm] = (0, import_react23.useState)("");
+  const [highlightedIndex, setHighlightedIndex] = (0, import_react23.useState)(-1);
+  const [selectedItem, setSelectedItem] = (0, import_react23.useState)(null);
+  const [list, setList] = (0, import_react23.useState)([]);
+  (0, import_react23.useEffect)(() => {
+    async function fetchData() {
+      if (props.dataset) {
+        setList(props.dataset);
+      } else if (props.dataSource && props.serviceClient) {
+        let dataSource = props.dataSource;
+        if (props.dataSourceDependsOn && props.dependentValue) {
+          dataSource = dataSource.replace(
+            `{${props.dataSourceDependsOn}}`,
+            props.dependentValue
+          );
+        }
+        const response = await props.serviceClient.get(dataSource);
+        if (response == null ? void 0 : response.result) setList(response.result);
+      }
+    }
+    fetchData();
+  }, [
+    props.dataSource,
+    props.dependentValue,
+    props.dataset,
+    props.dataSourceDependsOn
+  ]);
+  const filteredItems = list == null ? void 0 : list.filter(
+    (item) => {
+      var _a2;
+      return (_a2 = item[props == null ? void 0 : props.dataTextFieldName]) == null ? void 0 : _a2.toLowerCase().includes(searchTerm.toLowerCase());
+    }
+  );
+  const handleSelect = (event, item) => {
+    event.preventDefault();
+    setSearchTerm(item[props.dataTextFieldName]);
+    setSelectedItem(item);
+    setIsOpen(false);
+    setHighlightedIndex(-1);
+    if (props.callback) {
+      props.callback({
+        name: props.name,
+        value: item[props.dataKeyFieldName],
+        index: props.index,
+        groupKey: props.groupKey
+      });
+    }
+  };
+  const handleKeyDown = (e) => {
+    if (e.key === "ArrowDown") {
+      setHighlightedIndex(
+        (prev) => prev < filteredItems.length - 1 ? prev + 1 : 0
+      );
+    } else if (e.key === "ArrowUp") {
+      setHighlightedIndex(
+        (prev) => prev > 0 ? prev - 1 : filteredItems.length - 1
+      );
+    } else if (e.key === "Enter" && highlightedIndex >= 0) {
+      handleSelect(e, filteredItems[highlightedIndex]);
+    }
+  };
+  const dropdownRef = (0, import_react23.useRef)(null);
+  (0, import_react23.useEffect)(() => {
+    if (highlightedIndex >= 0 && dropdownRef.current) {
+      const highlightedItem = dropdownRef.current.children[highlightedIndex];
+      highlightedItem == null ? void 0 : highlightedItem.scrollIntoView({
+        behavior: "smooth",
+        block: "nearest"
+      });
+    }
+  }, [highlightedIndex]);
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "relative", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("label", { children: (_a = props.attributes) == null ? void 0 : _a.label }),
+    " ",
+    ((_b = props == null ? void 0 : props.attributes) == null ? void 0 : _b.required) && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "text-alert", children: "*" }),
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "relative", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+        "input",
+        {
+          type: "text",
+          value: searchTerm,
+          onChange: (e) => {
+            setSearchTerm(e.target.value);
+            setIsOpen(true);
+            setHighlightedIndex(-1);
+          },
+          onFocus: () => setIsOpen(true),
+          onKeyDown: handleKeyDown,
+          placeholder: "Select or search for a name",
+          className: "peer py-1.5 block w-full text-black rounded border-gray-300 shadow-sm\r\n          focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50\r\n          disabled:bg-slate-50 disabled:text-slate-500 disabled:border-slate-200 disabled:shadow-none\r\n          "
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+        "button",
+        {
+          type: "button",
+          onClick: () => setIsOpen(!isOpen),
+          className: "absolute right-2 top-3 h-5 w-5 text-gray-500 focus:outline-none",
+          children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+            "svg",
+            {
+              xmlns: "http://www.w3.org/2000/svg",
+              fill: "none",
+              viewBox: "0 0 24 24",
+              strokeWidth: 1.5,
+              stroke: "currentColor",
+              className: "w-full h-full",
+              children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+                "path",
+                {
+                  strokeLinecap: "round",
+                  strokeLinejoin: "round",
+                  d: "M19.5 8.25l-7.5 7.5-7.5-7.5"
+                }
+              )
+            }
+          )
+        }
+      )
+    ] }),
+    isOpen && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+      "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__ */ (0, import_jsx_runtime23.jsx)(
+          "button",
+          {
+            onClick: (e) => handleSelect(e, item),
+            className: `w-full px-4 py-2 flex items-center space-x-2 text-left ${index === highlightedIndex ? "bg-gray-200" : "hover:bg-gray-100"}`,
+            role: "option",
+            tabIndex: -1,
+            onMouseEnter: () => setHighlightedIndex(index),
+            children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { children: item[props.dataTextFieldName] })
+          },
+          item[props.dataKeyFieldName]
+        )) : /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "px-4 py-2 text-gray-500", children: "No results found" })
+      }
+    )
+  ] });
+};
+var SelectWithSearchInput_default = SelectWithSearchInput;
+
+// src/controls/components/Button.tsx
+var import_react26 = __toESM(require("react"));
+
+// src/controls/components/ToastService.tsx
+var ToastService = class _ToastService {
+  static initialize(showToast, closeToast) {
+    _ToastService.showToast = showToast;
+    _ToastService.closeToast = closeToast;
+  }
+  static showError(message) {
+    if (_ToastService.showToast) {
+      _ToastService.showToast(message, "error");
+    }
+  }
+  static showInfo(message) {
+    if (_ToastService.showToast) {
+      _ToastService.showToast(message, "info");
+    }
+  }
+  static close() {
+    if (_ToastService.closeToast) {
+      _ToastService.closeToast();
+    }
+  }
+};
+var ToastService_default = ToastService;
+
+// src/controls/components/StyleTypes.tsx
+var buttonClasses = /* @__PURE__ */ new Map([
+  ["Primary" /* Primary */, "relative inline-flex items-center justify-center bg-primary rounded  px-4 py-3 lg:py-2 font-medium shadow-sm hover:shadow-lg hover:bg-primary-strong focus:outline-none active:scale-95 disabled:opacity-50 disabled:cursor-not-allowed transition duration-150 ease-in-out text-body"],
+  ["Secondary" /* Secondary */, "relative inline-flex items-center justify-center bg-gradient-to-b from-secondary to-secondary-strong rounded px-4 py-3 lg:py-2 font-medium shadow-sm hover:shadow-lg focus:outline-none active:scale-95 disabled:opacity-50 disabled:cursor-not-allowed transition duration-150 ease-in-out text-body hover:bg-secondary-strong"],
+  ["Neutral" /* Neutral */, "relative inline-flex items-center justify-center bg-neutral-strong rounded px-4 py-3 lg:py-2 font-medium shadow-sm hover:shadow-lg focus:outline-none active:scale-95 disabled:opacity-50 disabled:cursor-not-allowed transition duration-150 ease-in-out text-body hover:bg-neutral-stronger"],
+  ["PrimaryHollow" /* PrimaryHollow */, "inline-flex font-medium items-center justify-center px-4 py-3 lg:py-2 transparent border-primary border text-primary rounded hover:shadow-md focus:outline-none transition duration-150 ease-in-out  active:scale-95"],
+  ["SecondaryHollow" /* SecondaryHollow */, "inline-flex font-medium items-center justify-center px-4 py-3 lg:py-2 transparent border-secondary border text-secondary rounded hover:shadow-md focus:outline-none transition duration-150 ease-in-out  active:scale-95"],
+  ["NeutralHollow" /* NeutralHollow */, "inline-flex font-medium items-center justify-center px-4 py-3 lg:py-2 transparent border-neutral border text-neutral rounded hover:shadow-md focus:outline-none transition duration-150 ease-in-out  active:scale-95"],
+  ["Ripple" /* Ripple */, "px-3 py-1.5 inline-flex items-center text-sm font-medium rounded border-[1.5px] border-primary ripple btn-bg-primary btn-primary-text"],
+  ["Danger" /* Danger */, "inline-flex text-sm font-medium items-center justify-center px-4 py-2 border border-alert bg-alert text-white rounded hover:bg-alert-600 hover:border-alert-600 focus:outline-none active:ring-1 active:ring-alert"],
+  ["Link" /* Link */, ""],
+  ["Light" /* Light */, "inline-flex items-center justify-center rounded bg-white border px-4 py-2 leading-6 text-primary shadow-sm hover:shadow focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary disabled:opacity-50 disabled:cursor-not-allowed"]
+]);
+var progressClasses = /* @__PURE__ */ new Map([
+  ["Primary" /* Primary */, ""],
+  ["PrimaryHollow" /* PrimaryHollow */, ""],
+  ["Secondary" /* Secondary */, ""],
+  ["SecondaryHollow" /* SecondaryHollow */, ""],
+  ["Neutral" /* Neutral */, ""],
+  ["NeutralHollow" /* NeutralHollow */, ""],
+  ["Ripple" /* Ripple */, ""],
+  ["Danger" /* Danger */, ""],
+  ["Link" /* Link */, ""]
+]);
+
+// src/controls/components/Confirm.tsx
+var import_react25 = require("react");
+
+// src/controls/components/ClientButton.tsx
+var import_react24 = __toESM(require("react"));
+var import_jsx_runtime24 = require("react/jsx-runtime");
+var ClientButton = (props) => {
+  const execute = async (event) => {
+    event.preventDefault();
+    if (props.onClick !== void 0) {
+      props.onClick();
+    } else {
+      ToastService_default.showError("No action defined.");
+    }
+  };
+  let buttonClass = props.ButtonType ? buttonClasses.get(props.ButtonType) : buttonClasses.get("Primary" /* Primary */);
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react24.default.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+    "button",
+    {
+      type: "button",
+      onClick: execute,
+      "data-role": props.dataRole,
+      disabled: props.disabled,
+      tabIndex: props.tabIndex,
+      className: buttonClass + " " + props.className,
+      children: props.children
+    }
+  ) });
+};
+var ClientButton_default = ClientButton;
+
+// src/controls/components/Confirm.tsx
+var import_jsx_runtime25 = require("react/jsx-runtime");
+var Confirm = ({ message, onConfirm, onCancel }) => {
+  const [showModal, setShowModal] = (0, import_react25.useState)(true);
+  const handleConfirmAction = () => {
+    setShowModal(false);
+    if (onConfirm) {
+      onConfirm();
+    }
+  };
+  const handleCancelAction = () => {
+    setShowModal(false);
+    if (onCancel) {
+      onCancel();
+    }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_jsx_runtime25.Fragment, { children: showModal && /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "fixed inset-0 flex items-center justify-center z-20", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: "absolute inset-0 bg-black opacity-70" }),
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "bg-white rounded-md p-6 shadow border z-50", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("p", { className: "text-xl font-semibold mb-4", children: "Confirmation" }),
+      /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("p", { className: "mb-4", children: message }),
+      /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "flex justify-end gap-8", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+          ClientButton_default,
+          {
+            onClick: handleCancelAction,
+            ButtonType: "PrimaryHollow" /* PrimaryHollow */,
+            children: "Cancel"
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+          ClientButton_default,
+          {
+            onClick: handleConfirmAction,
+            children: "Confirm"
+          }
+        )
+      ] })
+    ] })
+  ] }) });
+};
+var Confirm_default = Confirm;
+{
+}
+
+// src/controls/components/Button.tsx
+var import_jsx_runtime26 = require("react/jsx-runtime");
+var Button = (props) => {
+  const [inProgress, setInProgress] = (0, import_react26.useState)(false);
+  const [isActionPerformed, setIsActionPerformed] = (0, import_react26.useState)(false);
+  const [responseMessage, setResponseMessage] = (0, import_react26.useState)(null);
+  const [showModal, setShowModal] = (0, import_react26.useState)(null);
+  const execute = async (event) => {
+    event.preventDefault();
+    if (props.confirm) {
+      const confirmed = await showConfirmation(
+        "Are you sure you want to delete this item?"
+      );
+      setShowModal(null);
+      if (!confirmed) {
+        return;
+      }
+    }
+    if (props.oneTimeAction && isActionPerformed) {
+      return;
+    }
+    setInProgress(true);
+    let isValid = true;
+    if (props.onValidate !== void 0) {
+      isValid = await props.onValidate();
+      if (!isValid) {
+        setInProgress(false);
+        ToastService_default.showError(
+          "There are error in the form. Please fix them before proceeding."
+        );
+        return;
+      }
+    }
+    if (props.onClick !== void 0) {
+      let response = await props.onClick(props.index);
+      console.log(response);
+      if (response.isSuccessful) {
+        setIsActionPerformed(true);
+        setResponseMessage(response.message);
+        if (props.showToast) {
+          ToastService_default.showInfo(response.message || "");
+        }
+      } else {
+        ToastService_default.showError(response.message || "");
+      }
+    } else {
+      ToastService_default.showError("No action defined.");
+    }
+    setInProgress(false);
+  };
+  const showConfirmation = (message) => {
+    return new Promise((resolve) => {
+      const onConfirm = () => resolve(true);
+      const onCancel = () => resolve(false);
+      setShowModal(
+        /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+          Confirm_default,
+          {
+            message: props.confirmationMessage,
+            onConfirm,
+            onCancel
+          }
+        )
+      );
+    });
+  };
+  let buttonClass = props.ButtonType ? buttonClasses.get(props.ButtonType) : buttonClasses.get("Primary" /* Primary */);
+  let progressClass = props.ButtonType ? progressClasses.get(props.ButtonType) : progressClasses.get("Primary" /* Primary */);
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_react26.default.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
+      "button",
+      {
+        type: "submit",
+        onClick: execute,
+        id: props.id,
+        disabled: props.disabled,
+        className: buttonClass + " relative " + (props.className || "") + (props.isActive ? " scale-95 shadow-inner" : ""),
+        children: [
+          isActionPerformed && props.oneTimeAction && responseMessage ? responseMessage : props.children,
+          inProgress && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react26.default.Fragment, { children: props.hideProgressIndicator === true ? /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: "absolute bottom-0 left-0 h-0.5 bg-gray-400 rounded animate-progress" }) : /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
+            "svg",
+            {
+              className: "animate-spin ml-2 mr-3 h-5 w-5 " + progressClass,
+              xmlns: "http://www.w3.org/2000/svg",
+              fill: "none",
+              viewBox: "0 0 24 24",
+              children: [
+                /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+                  "circle",
+                  {
+                    className: "opacity-25",
+                    cx: "12",
+                    cy: "12",
+                    r: "10",
+                    stroke: "currentColor",
+                    strokeWidth: "4"
+                  }
+                ),
+                /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+                  "path",
+                  {
+                    className: "opacity-75",
+                    fill: "currentColor",
+                    d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
+                  }
+                )
+              ]
+            }
+          ) })
+        ]
+      }
+    ),
+    showModal
+  ] });
+};
+var Button_default = Button;
+
+// src/controls/edit/SelectWithSearchPanel.tsx
+var import_react27 = __toESM(require("react"));
+var import_jsx_runtime27 = require("react/jsx-runtime");
+var SelectWithSearchPanel = (props) => {
+  var _a, _b, _c, _d, _e, _f, _g;
+  const [isOpen, setIsOpen] = (0, import_react27.useState)(false);
+  const [searchTerm, setSearchTerm] = (0, import_react27.useState)("");
+  const [highlightedIndex, setHighlightedIndex] = (0, import_react27.useState)(0);
+  const [list, setList] = (0, import_react27.useState)([]);
+  const listRef = (0, import_react27.useRef)(null);
+  const [isError, setIsError] = (0, import_react27.useState)(false);
+  const containerRef = (0, import_react27.useRef)(null);
+  const [isCreateOpen, setIsCreateOpen] = (0, import_react27.useState)(false);
+  const [formData, setFormData] = (0, import_react27.useState)({});
+  const getNestedValue = (obj, path) => {
+    return path.split(".").reduce((acc, key) => acc == null ? void 0 : acc[key], obj);
+  };
+  (0, import_react27.useEffect)(() => {
+    const handleClickOutside = (event) => {
+      if (containerRef.current && !containerRef.current.contains(event.target)) {
+        setIsOpen(false);
+      }
+    };
+    document.addEventListener("mousedown", handleClickOutside);
+    return () => {
+      document.removeEventListener("mousedown", handleClickOutside);
+    };
+  }, []);
+  (0, import_react27.useEffect)(() => {
+    async function fetchData() {
+      if (props.dataset) {
+        setList(props.dataset);
+      } else if (props.dataSource && props.serviceClient) {
+        let dataSource = props.dataSource;
+        if (props.dataSourceDependsOn && props.dependentValue) {
+          dataSource = dataSource.replace(`{${props.dataSourceDependsOn}}`, props.dependentValue);
+        }
+        const response = await props.serviceClient.get(dataSource);
+        if (response == null ? void 0 : response.result) setList(response.result);
+      }
+    }
+    fetchData();
+  }, [props.dataSource, props.dependentValue, props.dataset, props.dataSourceDependsOn]);
+  const filteredItems = list == null ? void 0 : list.filter((item) => {
+    const value = getNestedValue(item, props.dataTextFieldName);
+    return value == null ? void 0 : value.toLowerCase().includes(searchTerm == null ? void 0 : searchTerm.toLowerCase());
+  });
+  const playBeep = () => {
+    const audioCtx = new (window.AudioContext || window.webkitAudioContext)();
+    const oscillator = audioCtx.createOscillator();
+    const gainNode = audioCtx.createGain();
+    oscillator.type = "square";
+    oscillator.frequency.setValueAtTime(300, audioCtx.currentTime);
+    gainNode.gain.setValueAtTime(0.02, audioCtx.currentTime);
+    oscillator.connect(gainNode);
+    gainNode.connect(audioCtx.destination);
+    oscillator.start();
+    setTimeout(() => {
+      oscillator.stop();
+      audioCtx.close();
+    }, 250);
+  };
+  (0, import_react27.useEffect)(() => {
+    const filteredItems2 = list == null ? void 0 : list.filter(
+      (item) => {
+        var _a2;
+        return (_a2 = item[props == null ? void 0 : props.dataTextFieldName]) == null ? void 0 : _a2.toLowerCase().includes(searchTerm == null ? void 0 : searchTerm.toLowerCase());
+      }
+    );
+    if (searchTerm.length > 0 && filteredItems2.length === 0) {
+      playBeep();
+      setIsError(true);
+    } else {
+      setIsError(false);
+    }
+  }, [searchTerm]);
+  const handleSelect = (event, item) => {
+    event.preventDefault();
+    setSearchTerm(getNestedValue(item, props.dataTextFieldName));
+    if (props.callback) {
+      const val = {};
+      props.callback({
+        name: props.name,
+        value: item[props.dataKeyFieldName],
+        index: props.index,
+        groupKey: props.groupKey
+      });
+    }
+    setHighlightedIndex(0);
+    setIsOpen(false);
+  };
+  const handleKeyDown = (e) => {
+    if (e.key === "Escape") {
+      setIsOpen(false);
+      setHighlightedIndex(-1);
+    } else if (e.key === "ArrowDown") {
+      e.preventDefault();
+      setHighlightedIndex((prev) => {
+        const nextIndex = prev < filteredItems.length - 1 ? prev + 1 : prev;
+        scrollIntoView(nextIndex);
+        return nextIndex;
+      });
+    } else if (e.key === "ArrowUp") {
+      e.preventDefault();
+      setHighlightedIndex((prev) => {
+        const prevIndex = prev > 0 ? prev - 1 : prev;
+        scrollIntoView(prevIndex);
+        return prevIndex;
+      });
+    } else if (e.key === "Enter" && highlightedIndex >= 0) {
+      handleSelect(e, filteredItems[highlightedIndex]);
+    }
+  };
+  const scrollIntoView = (index) => {
+    if (listRef.current) {
+      const item = listRef.current.children[index];
+      if (item) {
+        item.scrollIntoView();
+      }
+    }
+  };
+  const textChangeHandler = (event) => {
+    const newSearchTerm = event.target.value;
+    setSearchTerm(newSearchTerm);
+    setIsOpen(true);
+    setHighlightedIndex(0);
+  };
+  const handleInputChange = (event, field) => {
+    setFormData((prev) => __spreadProps(__spreadValues({}, prev), { [field]: event.target.value }));
+  };
+  const handleSaveModal = (0, import_react27.useCallback)(async (index) => {
+    console.log("Form Data:", formData);
+    return {
+      isSuccessful: true,
+      result: formData
+    };
+  }, [formData]);
+  return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: "relative", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("label", { className: "text-sm mb-1 font-medium", children: (_a = props.attributes) == null ? void 0 : _a.label }),
+    /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+      "input",
+      {
+        type: "text",
+        value: searchTerm,
+        onChange: textChangeHandler,
+        onFocus: () => setIsOpen(true),
+        onKeyDown: handleKeyDown,
+        placeholder: (_b = props.attributes) == null ? void 0 : _b.placeholder,
+        className: `peer mt-1 py-1.5 block w-full text-black rounded border-gray-300 shadow-sm
+          ${isError ? "focus:border-red-300 focus:ring focus:ring-red-200 focus:ring-opacity-50" : "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`
+      }
+    ) }),
+    /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { ref: containerRef, children: isOpen && /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_react27.default.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: "fixed z-50 right-0 bg-white top-[62px] w-1/4 border-l border-gray-200", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "flex flex-col p-2 bg-accent-950 text-white", children: /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("h5", { className: "text-md text-white font-medium", children: [
+          "Select a ",
+          ((_c = props.attributes) == null ? void 0 : _c.label) || ((_d = props.attributes) == null ? void 0 : _d.heading)
+        ] }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "flex justify-end px-4 border-b py-2 border-gray-200 h-10", children: props.createFields && props.createFields.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+          "button",
+          {
+            type: "button",
+            className: "text-primary hover:text-primary-800",
+            onMouseDown: (e) => {
+              e.preventDefault();
+              setIsCreateOpen(true);
+            },
+            children: "Create"
+          }
+        ) })
+      ] }),
+      isCreateOpen && /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: "fixed right-0 w-1/4 h-full top-[62px] bg-white shadow-lg border-l border-gray-200 z-50", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "flex flex-col p-2 bg-accent-950", children: /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("h5", { className: "text-md font-medium text-white", children: [
+          "Create New ",
+          (_e = props.attributes) == null ? void 0 : _e.label
+        ] }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "flex justify-end px-4 border-b py-2 border-gray-200", children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+          "button",
+          {
+            type: "button",
+            onClick: () => setIsCreateOpen(false),
+            className: "text-red-600 hover:text-red-800",
+            children: "Close"
+          }
+        ) }),
+        /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: "p-4", children: [
+          (_f = props.createFields) == null ? void 0 : _f.map((field) => /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: "mb-4", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("label", { className: "text-sm mb-1 font-medium block", children: field.label }),
+            /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+              "input",
+              {
+                type: field.type,
+                value: formData[field.name] || "",
+                onChange: (e) => handleInputChange(e, field.name),
+                placeholder: field.placeholder,
+                required: field.required,
+                disabled: field.disabled,
+                pattern: field.pattern,
+                minLength: field.minLength,
+                maxLength: field.maxLength,
+                className: "peer mt-1 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"
+              }
+            )
+          ] }, field.name)),
+          /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
+            Button_default,
+            {
+              onClick: async () => {
+                await handleSaveModal();
+                return { isSuccessful: true };
+              },
+              className: "w-full",
+              children: [
+                "Save ",
+                (_g = props.attributes) == null ? void 0 : _g.label
+              ]
+            }
+          )
+        ] })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+        "div",
+        {
+          ref: listRef,
+          className: "fixed z-10 right-0 mt-[130px] top-0 w-1/4 bg-white border-l border-gray-200 shadow-lg overflow-y-auto",
+          style: { height: "calc(100vh - 130px)" },
+          children: filteredItems.length > 0 ? filteredItems.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+            "button",
+            {
+              onClick: (e) => {
+                handleSelect(e, item);
+              },
+              className: `w-full px-4 py-2 flex items-center space-x-2 text-left border-b border-gray-200 ${index === highlightedIndex ? "bg-gray-200" : "hover:bg-gray-100"}`,
+              role: "option",
+              tabIndex: -1,
+              onMouseEnter: () => setHighlightedIndex(index),
+              children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("span", { children: getNestedValue(item, props.dataTextFieldName) })
+            }
+          ) }, item[props.dataKeyFieldName])) : /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "px-4 py-2 text-gray-500", children: "No results found" })
+        }
+      )
+    ] }) })
+  ] });
+};
+var SelectWithSearchPanel_default = SelectWithSearchPanel;
+
+// src/controls/edit/BooleanSelect.tsx
+var import_react28 = __toESM(require("react"));
+var import_jsx_runtime28 = require("react/jsx-runtime");
+var BooleanSelect = (props) => {
+  var _a, _b, _c, _d, _e, _f, _g, _h;
+  const [list, setList] = (0, import_react28.useState)();
+  const textChangeHandler = (event) => {
+    const text = event.target.value;
+    const boolValue = (text == null ? void 0 : text.toLowerCase()) === "true" || text === "1";
+    if (props.callback !== void 0) {
+      props.callback(
+        {
+          name: props.name,
+          value: boolValue,
+          index: props.index,
+          groupKey: props.groupKey
+        }
+      );
+    }
+  };
+  (0, import_react28.useEffect)(() => {
+    async function fetchData() {
+      console.log("in select");
+      if (props.dataset) {
+        setList(props.dataset);
+      } else if (props.dataSource && props.dataSource != "" && props.serviceClient) {
+        let dataSource = props.dataSource;
+        let response;
+        if (props.dataSourceDependsOn) {
+          if (props.dependentValue) {
+            dataSource = dataSource.replace(`{${props.dataSourceDependsOn}}`, props.dependentValue);
+            response = await props.serviceClient.get(dataSource);
+            setList(response.result);
+          }
+        } else {
+          response = await props.serviceClient.get(dataSource);
+          setList(response.result);
+        }
+      }
+    }
+    fetchData();
+  }, [props.dataSource, props.dependentValue, props.dataset, props.dataSourceDependsOn]);
+  let value;
+  if (props.value !== void 0 && props.value !== null) {
+    value = props.value;
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_react28.default.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("label", { className: "block", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "text-sm font-medium ", children: (_a = props == null ? void 0 : props.attributes) == null ? void 0 : _a.label }),
+    " ",
+    ((_b = props == null ? void 0 : props.attributes) == null ? void 0 : _b.label) && ((_c = props == null ? void 0 : props.attributes) == null ? void 0 : _c.required) && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "text-alert", children: "*" }),
+    /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
+      "select",
+      {
+        name: props.name,
+        id: props.name,
+        value,
+        onChange: textChangeHandler,
+        required: (_d = props == null ? void 0 : props.attributes) == null ? void 0 : _d.required,
+        placeholder: (_e = props == null ? void 0 : props.attributes) == null ? void 0 : _e.placeholder,
+        disabled: (_f = props == null ? void 0 : props.attributes) == null ? void 0 : _f.readOnly,
+        className: "peer mt-1 py-1.5 block w-full text-black rounded border-gray-300 shadow-sm\r\n                     focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50\r\n                     disabled:bg-slate-50 disabled:text-slate-500 disabled:border-slate-200 disabled:shadow-none\r\n                     ",
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("option", { className: "", value: "", children: ((_g = props.attributes) == null ? void 0 : _g.placeholder) || "Select" }),
+          list && list.map((item, i) => {
+            return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+              "option",
+              {
+                className: "fac-select-option",
+                value: item[props.dataKeyFieldName],
+                children: item[props.dataTextFieldName]
+              },
+              item[props.dataKeyFieldName]
+            );
+          })
+        ]
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("p", { className: "hidden group-[.validated]:peer-invalid:block  mt-1  text-alert text-sm", children: ((_h = props == null ? void 0 : props.attributes) == null ? void 0 : _h.errorMessage) ? props.attributes.errorMessage : "" })
+  ] }) });
+};
+var BooleanSelect_default = BooleanSelect;
+
+// src/controls/edit/EmailInput.tsx
+var import_react29 = __toESM(require("react"));
+var import_jsx_runtime29 = require("react/jsx-runtime");
+var EmailInput = (props) => {
+  var _a, _b, _c, _d, _e, _f, _g, _h, _i;
+  const textChangeHandler = (event) => {
+    const text = event.target.value;
+    if (text) {
+      const atIndex = text.indexOf("@");
+      const dotIndex = text.indexOf(".", atIndex);
+      if (dotIndex < atIndex || text.length - dotIndex <= 2) {
+        event.target.setCustomValidity("invaild-value");
+      } else {
+        event.target.setCustomValidity("");
+      }
+    }
+    if (props.callback !== void 0) {
+      props.callback({
+        name: props.name,
+        value: text,
+        index: props.index
+      });
+    }
+  };
+  let value = "";
+  if (props.value !== void 0 && props.value !== null) {
+    value = props.value;
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_react29.default.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("label", { className: "block mb-1", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("span", { className: "text-sm font-medium text-slate-700", children: (_a = props == null ? void 0 : props.attributes) == null ? void 0 : _a.label }),
+    " ",
+    ((_b = props == null ? void 0 : props.attributes) == null ? void 0 : _b.label) && ((_c = props == null ? void 0 : props.attributes) == null ? void 0 : _c.required) && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("span", { className: "text-alert", children: "*" }),
+    /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+      "input",
+      {
+        type: "email",
+        name: props.name,
+        id: props.name,
+        value,
+        onChange: textChangeHandler,
+        required: (_d = props == null ? void 0 : props.attributes) == null ? void 0 : _d.required,
+        placeholder: (_e = props == null ? void 0 : props.attributes) == null ? void 0 : _e.placeholder,
+        maxLength: (_f = props == null ? void 0 : props.attributes) == null ? void 0 : _f.maxLength,
+        disabled: (_g = props == null ? void 0 : props.attributes) == null ? void 0 : _g.readOnly,
+        minLength: (_h = props == null ? void 0 : props.attributes) == null ? void 0 : _h.minLength,
+        className: "peer mt-1 py-1.5 block w-full rounded border-gray-300 shadow-sm\r\n                     focus-within:border-neutral-300 focus-within:ring focus-within:ring-neutral-300 focus-within:ring-opacity-50 transition-all duration-500 ease-in-out"
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("p", { className: "hidden group-[.validated]:peer-invalid:block  mt-1 mb-0  text-alert text-sm", children: ((_i = props == null ? void 0 : props.attributes) == null ? void 0 : _i.errorMessage) ? props.attributes.errorMessage : "" })
+  ] }) });
+};
+var EmailInput_default = EmailInput;
+
+// src/controls/edit/TimeInput.tsx
+var import_react30 = __toESM(require("react"));
+var import_jsx_runtime30 = require("react/jsx-runtime");
+var TimeInput = (props) => {
+  var _a, _b, _c, _d, _e, _f, _g, _h;
+  const timeChangeHandler = (event) => {
+    const timeValue = event.target.value;
+    if (props.callback) {
+      props.callback({
+        name: props.name,
+        value: timeValue,
+        index: props.index,
+        groupKey: props.groupKey
+      });
+    }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react30.default.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("label", { className: "block mb-1", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("span", { className: "text-sm font-medium", children: (_a = props == null ? void 0 : props.attributes) == null ? void 0 : _a.label }),
+    ((_b = props == null ? void 0 : props.attributes) == null ? void 0 : _b.label) && ((_c = props == null ? void 0 : props.attributes) == null ? void 0 : _c.required) && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("span", { className: "text-alert", children: "*" }),
+    /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("div", { className: "flex items-center gap-2", children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+      "input",
+      {
+        type: "time",
+        name: props.name,
+        id: props.name,
+        value: typeof props.value === "boolean" ? "" : (_d = props.value) != null ? _d : "",
+        onChange: timeChangeHandler,
+        required: (_e = props == null ? void 0 : props.attributes) == null ? void 0 : _e.required,
+        disabled: (_f = props == null ? void 0 : props.attributes) == null ? void 0 : _f.readOnly,
+        className: "peer mt-1 py-1.5 block w-full rounded border-gray-300 shadow-sm\r\n                     focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50\r\n                     disabled:bg-slate-50 disabled:text-slate-500 disabled:border-slate-200 disabled:shadow-none"
+      }
+    ) }),
+    /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("p", { className: "hidden group-[.validated]:peer-invalid:block mt-1 text-alert text-sm", children: (_h = (_g = props == null ? void 0 : props.attributes) == null ? void 0 : _g.errorMessage) != null ? _h : "" })
+  ] }) });
+};
+var TimeInput_default = TimeInput;
+
+// src/controls/edit/InputControlType.tsx
+var InputControlType = {
+  lineTextInput: "text",
+  multilineTextInput: "multilinetext",
+  emailInput: "email",
+  moneyInput: "money",
+  select: "select",
+  percentageInput: "percentage",
+  phoneInput: "phone",
+  numberInput: "number",
+  checkboxInput: "boolean",
+  otpInput: "otp",
+  datetimeInput: "datetime",
+  timeInput: "time",
+  colorInput: "colorInput",
+  selectWithSearchInput: "selectWithSearchInput",
+  selectWithSearchPanel: "selectWithSearchPanel",
+  booleanSelect: "booleanSelect"
+};
+var InputControlType_default = InputControlType;
+
+// src/controls/edit/InputControl.tsx
+var import_jsx_runtime31 = require("react/jsx-runtime");
+var InputControl = (props) => {
+  const ControlComponents = {
+    [InputControlType_default.lineTextInput]: LineTextInput_default,
+    [InputControlType_default.emailInput]: EmailInput_default,
+    [InputControlType_default.multilineTextInput]: MultilineTextInput_default,
+    [InputControlType_default.moneyInput]: MoneyInput_default,
+    [InputControlType_default.select]: Select_default,
+    [InputControlType_default.percentageInput]: PercentageInput_default,
+    [InputControlType_default.phoneInput]: PhoneInput_default,
+    [InputControlType_default.numberInput]: NumberInput_default,
+    [InputControlType_default.checkboxInput]: CheckboxInput_default,
+    [InputControlType_default.otpInput]: OtpInput_default,
+    [InputControlType_default.datetimeInput]: DateTimeInput_default,
+    [InputControlType_default.colorInput]: ColorInput_default,
+    [InputControlType_default.selectWithSearchInput]: SelectWithSearchInput_default,
+    [InputControlType_default.selectWithSearchPanel]: SelectWithSearchPanel_default,
+    [InputControlType_default.booleanSelect]: BooleanSelect_default,
+    [InputControlType_default.timeInput]: TimeInput_default
+  };
+  const SelectedControlComponent = ControlComponents[props.controlType];
+  return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react31.default.Fragment, { children: SelectedControlComponent ? /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(SelectedControlComponent, __spreadValues({}, props)) : "Control not found" });
+};
+var InputControl_default = InputControl;
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
+  InputControl,
+  InputControlType,
   ViewControl,
   ViewControlTypes
 });