@acoustte-digital-services/digitalstore-controls-dev 0.8.1-dev.20260715103126 → 0.8.1-dev.20260721123022

package/dist/InputControlClient-P4RA7DQN.mjs

@@ -0,0 +1,677 @@
+"use client";
+
+"use client";
+import {
+  AssetUtility_default,
+  BooleanSelect_default,
+  CheckboxInput_default,
+  ColorInput_default,
+  DateTimeInput_default,
+  EmailInput_default,
+  LineTextInput_default,
+  MoneyInput_default,
+  MultilineTextInput_default,
+  NumberInput_default,
+  OtpInput_default,
+  PercentageInput_default,
+  PhoneInput_default,
+  SelectWithSearchInput_default,
+  TimeInput_default
+} from "./chunk-3R4VVVNK.mjs";
+import {
+  Hyperlink,
+  Icon_default,
+  InputControlType_default
+} from "./chunk-5GHPW7SJ.mjs";
+import {
+  Button_default,
+  ClientButton_default
+} from "./chunk-JKP4XOZB.mjs";
+import "./chunk-IMNQO57B.mjs";
+
+// src/components/controls/edit/InputControlClient.tsx
+import React5 from "react";
+
+// src/components/controls/edit/Select.tsx
+import { useState, useEffect } from "react";
+import { jsx, jsxs } 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
+    });
+  };
+  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 && props.dependentValue) {
+          dataSource = dataSource.replace(
+            `{${props.dataSourceDependsOn}}`,
+            props.dependentValue
+          );
+        }
+        response = await props.serviceClient.get(dataSource);
+        setList(response.result ?? []);
+      }
+    }
+    fetchData();
+  }, [
+    props.dataset,
+    props.dataSource,
+    props.dependentValue,
+    props.dataSourceDependsOn
+  ]);
+  const value = getSafeValue(props.value);
+  return /* @__PURE__ */ jsxs("label", { className: "block", children: [
+    props.attributes?.label && /* @__PURE__ */ jsx("span", { className: "text-sm font-medium inline-block pb-1", children: props.attributes?.label }),
+    " ",
+    props.attributes?.label && props.attributes?.required && /* @__PURE__ */ jsx("span", { className: "bg-error-weak", children: "*" }),
+    /* @__PURE__ */ jsxs(
+      "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\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__ */ jsx("option", { value: "", children: props.attributes?.placeholder || "Select" }),
+          list.map((item, index) => {
+            const keyField = props.dataKeyFieldName;
+            const textField = props.dataTextFieldName;
+            return /* @__PURE__ */ jsx("option", { value: item[keyField], children: item[textField] }, index);
+          })
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx("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/SelectWithSearchPanel.tsx
+import React2, {
+  useEffect as useEffect2,
+  useRef,
+  useState as useState2,
+  useCallback
+} from "react";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+var SelectWithSearchPanel = (props) => {
+  const [isOpen, setIsOpen] = useState2(false);
+  const [searchTerm, setSearchTerm] = useState2("");
+  const [highlightedIndex, setHighlightedIndex] = useState2(0);
+  const [list, setList] = useState2([]);
+  const listRef = useRef(null);
+  const [isError, setIsError] = useState2(false);
+  const containerRef = useRef(null);
+  const [isCreateOpen, setIsCreateOpen] = useState2(false);
+  const [formData, setFormData] = useState2({});
+  const getNestedValue = (obj, path) => {
+    return path.split(".").reduce((acc, key) => acc?.[key], obj);
+  };
+  useEffect2(() => {
+    const handleClickOutside = (event) => {
+      if (containerRef.current && !containerRef.current.contains(event.target)) {
+        setIsOpen(false);
+      }
+    };
+    document.addEventListener("mousedown", handleClickOutside);
+    return () => {
+      document.removeEventListener("mousedown", handleClickOutside);
+    };
+  }, []);
+  useEffect2(() => {
+    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?.result) setList(response.result);
+      }
+    }
+    fetchData();
+  }, [
+    props.dataSource,
+    props.dependentValue,
+    props.dataset,
+    props.dataSourceDependsOn
+  ]);
+  const filteredItems = list?.filter((item) => {
+    const value = getNestedValue(item, props.dataTextFieldName);
+    return value?.toLowerCase().includes(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);
+  };
+  useEffect2(() => {
+    const filteredItems2 = list?.filter(
+      (item) => item[props?.dataTextFieldName]?.toLowerCase().includes(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) => ({ ...prev, [field]: event.target.value }));
+  };
+  const handleSaveModal = useCallback(async () => {
+    console.log("Form Data:", formData);
+    return formData;
+  }, []);
+  return /* @__PURE__ */ jsxs2("div", { className: "relative", children: [
+    /* @__PURE__ */ jsxs2("label", { className: "text-sm mb-1 font-medium", children: [
+      props.attributes?.label,
+      " ",
+      " ",
+      props?.attributes?.required && /* @__PURE__ */ jsx2("span", { className: "bg-error-weak", children: "*" })
+    ] }),
+    /* @__PURE__ */ jsx2("div", { children: /* @__PURE__ */ jsx2(
+      "input",
+      {
+        type: "text",
+        value: searchTerm,
+        onChange: textChangeHandler,
+        onFocus: () => setIsOpen(true),
+        onKeyDown: handleKeyDown,
+        placeholder: props.attributes?.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__ */ jsx2("div", { ref: containerRef, children: isOpen && /* @__PURE__ */ jsxs2(React2.Fragment, { children: [
+      /* @__PURE__ */ jsxs2("div", { className: "fixed z-50 right-0 bg-white top-[62px] w-1/4 border-l border-gray-200", children: [
+        /* @__PURE__ */ jsx2("div", { className: "flex flex-col p-2 bg-accent-950 text-white", children: /* @__PURE__ */ jsxs2("h5", { className: "text-md text-white font-medium", children: [
+          "Select a",
+          " ",
+          props.attributes?.label || props.attributes?.heading
+        ] }) }),
+        /* @__PURE__ */ jsx2("div", { className: "flex justify-end px-4 border-b py-2 border-gray-200 h-10", children: props.createFields && props.createFields.length > 0 && /* @__PURE__ */ jsx2(
+          "button",
+          {
+            type: "button",
+            className: "text-primary hover:text-primary-800",
+            onMouseDown: (e) => {
+              e.preventDefault();
+              setIsCreateOpen(true);
+            },
+            children: "Create"
+          }
+        ) })
+      ] }),
+      isCreateOpen && /* @__PURE__ */ jsxs2("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__ */ jsx2("div", { className: "flex flex-col p-2 bg-accent-950", children: /* @__PURE__ */ jsxs2("h5", { className: "text-md font-medium text-white", children: [
+          "Create New ",
+          props.attributes?.label
+        ] }) }),
+        /* @__PURE__ */ jsx2("div", { className: "flex justify-end px-4 border-b py-2 border-gray-200", children: /* @__PURE__ */ jsx2(
+          "button",
+          {
+            type: "button",
+            onClick: () => setIsCreateOpen(false),
+            className: "text-red-600 hover:text-red-800",
+            children: "Close"
+          }
+        ) }),
+        /* @__PURE__ */ jsxs2("div", { className: "p-4", children: [
+          props.createFields?.map((field) => /* @__PURE__ */ jsxs2("div", { className: "mb-4", children: [
+            /* @__PURE__ */ jsx2("label", { className: "text-sm mb-1 font-medium block", children: field.label }),
+            /* @__PURE__ */ jsx2(
+              "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__ */ jsxs2(Button_default, { onClick: async () => {
+            handleSaveModal();
+            return { isSuccessful: true };
+          }, className: "w-full", children: [
+            "Save ",
+            props.attributes?.label
+          ] })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsx2(
+        "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__ */ jsx2("div", { children: /* @__PURE__ */ jsx2(
+            "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__ */ jsx2("span", { children: getNestedValue(item, props.dataTextFieldName) })
+            }
+          ) }, item[props.dataKeyFieldName])) : /* @__PURE__ */ jsx2("div", { className: "px-4 py-2 text-gray-500", children: "No results found" })
+        }
+      )
+    ] }) })
+  ] });
+};
+var SelectWithSearchPanel_default = SelectWithSearchPanel;
+
+// src/components/controls/edit/AssetUpload.tsx
+import React3, { useEffect as useEffect3 } from "react";
+import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+var AssetUpload = (props) => {
+  const isDisabled = props.attributes?.disable ?? false;
+  let allValues = [];
+  if (props.value !== void 0 && props.value !== null && props.value !== "") {
+    try {
+      allValues = JSON.parse(props.value.toString());
+    } catch (error) {
+    }
+  }
+  const getInitialTab = () => {
+    if (allValues.length > 0) {
+      const asset = allValues[0];
+      if (asset.posterUrl) {
+        return "video";
+      } else if (asset.assetUrl) {
+        return "image";
+      }
+    }
+    return "image";
+  };
+  const [assetType, setAssetType] = React3.useState(getInitialTab);
+  useEffect3(() => {
+    setAssetType(getInitialTab());
+  }, [props.value]);
+  const assetUploadCallback = (newAsset) => {
+    if (isDisabled) return;
+    let updated = [];
+    updated.push({
+      assetUrl: newAsset.assetUrl,
+      title: newAsset.title,
+      posterUrl: newAsset.posterUrl,
+      intrinsicHeight: newAsset.intrinsicHeight,
+      intrinsicWidth: newAsset.intrinsicWidth
+    });
+    props.callback?.({
+      name: props.name,
+      value: JSON.stringify(updated),
+      index: props.index,
+      groupKey: props.groupKey
+    });
+  };
+  const deleteFile = (index) => {
+    if (isDisabled) return;
+    let existingValue = [];
+    if (props.value) {
+      try {
+        existingValue = JSON.parse(props.value.toString());
+      } catch (error) {
+      }
+    }
+    if (existingValue.length > index) {
+      existingValue.splice(index, 1);
+      props.callback?.({
+        name: props.name,
+        value: JSON.stringify(existingValue),
+        index: props.index,
+        groupKey: props.groupKey
+      });
+    }
+  };
+  const textChangeHandler = (index, event) => {
+    if (isDisabled) return;
+    let existingValue = [];
+    if (props.value) {
+      try {
+        existingValue = JSON.parse(props.value.toString());
+      } catch (error) {
+      }
+    }
+    const text = event.target.value;
+    if (existingValue.length > index) {
+      const updatedArray = [...existingValue];
+      updatedArray[index] = { ...updatedArray[index], title: text };
+      props.callback?.({
+        name: props.name,
+        value: JSON.stringify(updatedArray),
+        index: props.index,
+        groupKey: props.groupKey
+      });
+    }
+  };
+  const getAssetType = (asset) => {
+    if (asset.assetUrl?.endsWith(".m3u8") || asset.posterUrl) return "video";
+    return "image";
+  };
+  const shouldShowDetails = () => {
+    if (allValues.length === 0) return false;
+    const asset = allValues[0];
+    if (assetType === "video") {
+      return Boolean(asset.posterUrl && asset.assetUrl && asset.assetUrl.endsWith(".m3u8"));
+    }
+    if (assetType === "image") {
+      return Boolean(asset.assetUrl && !asset.assetUrl.endsWith(".m3u8"));
+    }
+    return false;
+  };
+  return /* @__PURE__ */ jsxs3(React3.Fragment, { children: [
+    /* @__PURE__ */ jsx3("label", { className: "block mb-1", children: /* @__PURE__ */ jsx3("span", { className: "text-sm font-medium", children: props?.attributes?.label }) }),
+    /* @__PURE__ */ jsxs3("div", { className: "flex gap-6 bg-neutral-100 rounded p-2", children: [
+      /* @__PURE__ */ jsx3(
+        ClientButton_default,
+        {
+          className: assetType === "image" ? "px-2 py-1 rounded bg-body-200 scale-95" : "text-neutral-700",
+          ButtonType: "Link" /* Link */,
+          onClick: () => setAssetType("image"),
+          disabled: isDisabled,
+          children: "Image Upload"
+        }
+      ),
+      /* @__PURE__ */ jsx3(
+        ClientButton_default,
+        {
+          className: assetType === "video" ? "bg-body-200 px-2 py-1 rounded-md scale-95" : "text-neutral-700",
+          ButtonType: "Link" /* Link */,
+          onClick: () => setAssetType("video"),
+          disabled: isDisabled,
+          children: "Video Upload"
+        }
+      )
+    ] }),
+    shouldShowDetails() && /* @__PURE__ */ jsxs3("div", { className: "relative mt-4 rounded-md p-4 border-2 border-dotted border-gray-300 bg-gray-50", children: [
+      /* @__PURE__ */ jsx3("span", { className: "absolute -top-2.5 left-3 bg-primary-600 text-white text-xs px-2 py-0.5 rounded-full", children: getAssetType(allValues[0]) === "video" ? "Video" : "Image" }),
+      /* @__PURE__ */ jsx3("div", { className: "flex flex-col gap-3", children: allValues.map((digitalAsset, index) => /* @__PURE__ */ jsxs3("div", { className: "flex justify-between items-start gap-5", children: [
+        /* @__PURE__ */ jsxs3("div", { className: "grid grid-cols-2 gap-x-8 gap-y-3 text-sm w-full", children: [
+          /* @__PURE__ */ jsxs3("div", { children: [
+            /* @__PURE__ */ jsx3("p", { className: "text-gray-500", children: "Title" }),
+            /* @__PURE__ */ jsx3(
+              "input",
+              {
+                type: "text",
+                value: digitalAsset.title,
+                onChange: (event) => textChangeHandler(index, event),
+                placeholder: "title",
+                disabled: isDisabled,
+                className: "w-full mt-1 py-1.5 block rounded border-gray-300 shadow-sm bg-white\r\n                        focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50\r\n                        disabled:bg-gray-100 disabled:text-gray-400 disabled:cursor-not-allowed"
+              }
+            )
+          ] }),
+          digitalAsset.intrinsicWidth && digitalAsset.intrinsicHeight && /* @__PURE__ */ jsxs3("div", { children: [
+            /* @__PURE__ */ jsx3("p", { className: "text-gray-500", children: "Resolution" }),
+            /* @__PURE__ */ jsxs3("p", { className: "font-medium text-gray-900 mt-3", children: [
+              digitalAsset.intrinsicWidth,
+              "\xD7",
+              digitalAsset.intrinsicHeight
+            ] })
+          ] }),
+          (digitalAsset.assetUrl || digitalAsset.posterUrl) && /* @__PURE__ */ jsxs3("div", { children: [
+            /* @__PURE__ */ jsx3("p", { className: "text-gray-500", children: "Image / Poster" }),
+            /* @__PURE__ */ jsxs3("div", { className: "flex-shrink-0 flex flex-col gap-3 mt-1", children: [
+              getAssetType(digitalAsset) === "video" && digitalAsset.posterUrl && /* @__PURE__ */ jsx3(
+                "img",
+                {
+                  src: AssetUtility_default.resolveUrl(props.serviceClient?.baseUrl, digitalAsset.posterUrl),
+                  alt: digitalAsset.title || "Video poster",
+                  className: "w-32 h-auto object-cover rounded border p-1"
+                }
+              ),
+              getAssetType(digitalAsset) === "image" && digitalAsset.assetUrl && /* @__PURE__ */ jsx3(
+                "img",
+                {
+                  src: AssetUtility_default.resolveUrl(props.serviceClient?.baseUrl, digitalAsset.assetUrl),
+                  alt: digitalAsset.title || "Uploaded image",
+                  className: "w-32 h-auto object-cover rounded border p-1"
+                }
+              )
+            ] })
+          ] }),
+          digitalAsset.assetUrl?.endsWith(".m3u8") && /* @__PURE__ */ jsxs3("div", { className: "col-span-2", children: [
+            /* @__PURE__ */ jsx3("p", { className: "text-gray-500", children: "HLS Link" }),
+            /* @__PURE__ */ jsx3(
+              Hyperlink,
+              {
+                href: digitalAsset.assetUrl,
+                className: "text-primary-600 underline mt-1 break-all",
+                title: digitalAsset.assetUrl,
+                children: digitalAsset.assetUrl
+              }
+            )
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx3(
+          "span",
+          {
+            onClick: () => !isDisabled && deleteFile(index),
+            className: isDisabled ? "cursor-not-allowed opacity-50" : "cursor-pointer",
+            children: /* @__PURE__ */ jsx3(Icon_default, { className: "w-4 h-4 text-primary", name: "delete" })
+          }
+        )
+      ] }, index)) })
+    ] })
+  ] });
+};
+var AssetUpload_default = AssetUpload;
+
+// src/components/controls/edit/SwitchInput.tsx
+import React4 from "react";
+import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
+var SwitchInput = (props) => {
+  const textChangeHandler = (event) => {
+    let text = event.target.checked;
+    if (props.callback !== void 0) {
+      props.callback({
+        name: props.name,
+        value: text,
+        index: props.index,
+        groupKey: props.groupKey
+      });
+    }
+  };
+  let value = false;
+  if (props.value != void 0 && props.value != null && props.value != "" && (props.value == "true" || props.value.toString() == "true")) {
+    value = true;
+  }
+  return /* @__PURE__ */ jsx4(React4.Fragment, { children: /* @__PURE__ */ jsxs4("div", { className: "flex items-start justify-between gap-4 py-3", children: [
+    /* @__PURE__ */ jsxs4("div", { className: "min-w-0", children: [
+      props?.attributes?.label && /* @__PURE__ */ jsxs4(
+        "label",
+        {
+          htmlFor: props.name,
+          className: "inline-block text-sm font-semibold text-slate-800",
+          children: [
+            props.attributes.label,
+            props?.attributes?.required && /* @__PURE__ */ jsx4("span", { className: "bg-error-weak", children: "*" })
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsx4("p", { className: "hidden group-[.validated]:peer-invalid:block mt-1 bg-error-weak text-sm", children: props?.attributes?.errorMessage || "" })
+    ] }),
+    /* @__PURE__ */ jsxs4(
+      "label",
+      {
+        htmlFor: props.name,
+        className: "relative inline-flex shrink-0 cursor-pointer items-center peer-disabled:cursor-not-allowed",
+        children: [
+          /* @__PURE__ */ jsx4(
+            "input",
+            {
+              type: "checkbox",
+              name: props.name,
+              id: props.name,
+              checked: value,
+              onChange: textChangeHandler,
+              required: props?.attributes?.required,
+              disabled: props?.attributes?.readOnly,
+              className: "peer sr-only"
+            }
+          ),
+          /* @__PURE__ */ jsx4(
+            "div",
+            {
+              className: "h-6 w-11 rounded-full bg-slate-200 shadow-inner\r\n                       transition-colors duration-200 ease-in-out\r\n                       peer-checked:bg-blue-600\r\n                       peer-focus-visible:ring-2 peer-focus-visible:ring-blue-300 peer-focus-visible:ring-offset-2\r\n                       peer-disabled:bg-slate-100"
+            }
+          ),
+          /* @__PURE__ */ jsx4(
+            "div",
+            {
+              className: "absolute left-0.5 top-0.5 h-5 w-5 rounded-full bg-default shadow\r\n                       transition-transform duration-200 ease-in-out\r\n                       peer-checked:translate-x-5\r\n                       peer-disabled:bg-slate-50"
+            }
+          )
+        ]
+      }
+    )
+  ] }) });
+};
+var SwitchInput_default = SwitchInput;
+
+// src/components/controls/edit/InputControlClient.tsx
+import { jsx as jsx5 } from "react/jsx-runtime";
+var 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,
+  [InputControlType_default.asset]: AssetUpload_default,
+  [InputControlType_default.switchInput]: SwitchInput_default
+};
+var InputControl = React5.memo(React5.forwardRef(
+  (props, ref) => {
+    const SelectedControlComponent = ControlComponents[props.controlType];
+    return /* @__PURE__ */ jsx5(React5.Fragment, { children: SelectedControlComponent ? /* @__PURE__ */ jsx5(SelectedControlComponent, { ...props }) : "Control not found" });
+  }
+));
+InputControl.displayName = "InputControl";
+var InputControlClient_default = InputControl;
+export {
+  InputControlClient_default as default
+};

package/dist/{InputControlClient-QQCQD4EG.mjs → InputControlClient-VUPWEYGB.mjs}

@@ -642,32 +642,32 @@ var SwitchInput_default = SwitchInput;
 
 // src/components/controls/edit/InputControlClient.tsx
 import { jsx as jsx5 } from "react/jsx-runtime";
-var InputControl = React5.forwardRef(
+var 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,
+  [InputControlType_default.asset]: AssetUpload_default,
+  [InputControlType_default.switchInput]: SwitchInput_default
+};
+var InputControl = React5.memo(React5.forwardRef(
   (props, ref) => {
-    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,
-      [InputControlType_default.asset]: AssetUpload_default,
-      [InputControlType_default.switchInput]: SwitchInput_default
-    };
     const SelectedControlComponent = ControlComponents[props.controlType];
     return /* @__PURE__ */ jsx5(React5.Fragment, { children: SelectedControlComponent ? /* @__PURE__ */ jsx5(SelectedControlComponent, { ...props }) : "Control not found" });
   }
-);
+));
 InputControl.displayName = "InputControl";
 var InputControlClient_default = InputControl;
 export {

package/dist/{InputControlClient-QAZKQLFO.mjs → InputControlClient-WW2T4W77.mjs}

@@ -644,32 +644,32 @@ var SwitchInput_default = SwitchInput;
 
 // src/components/controls/edit/InputControlClient.tsx
 import { jsx as jsx5 } from "react/jsx-runtime";
-var InputControl = React5.forwardRef(
+var 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,
+  [InputControlType_default.asset]: AssetUpload_default,
+  [InputControlType_default.switchInput]: SwitchInput_default
+};
+var InputControl = React5.memo(React5.forwardRef(
   (props, ref) => {
-    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,
-      [InputControlType_default.asset]: AssetUpload_default,
-      [InputControlType_default.switchInput]: SwitchInput_default
-    };
     const SelectedControlComponent = ControlComponents[props.controlType];
     return /* @__PURE__ */ jsx5(React5.Fragment, { children: SelectedControlComponent ? /* @__PURE__ */ jsx5(SelectedControlComponent, { ...props }) : "Control not found" });
   }
-);
+));
 InputControl.displayName = "InputControl";
 var InputControlClient_default = InputControl;
 export {

package/dist/index.d.mts

@@ -13,7 +13,7 @@ interface ViewControlProps {
     session?: any;
 }
 
-declare const ViewControl: (props: ViewControlProps) => React__default.JSX.Element;
+declare const ViewControl: React__default.MemoExoticComponent<(props: ViewControlProps) => React__default.JSX.Element>;
 
 declare const ViewControlTypes: {
     lineText: string;

package/dist/index.d.ts

@@ -13,7 +13,7 @@ interface ViewControlProps {
     session?: any;
 }
 
-declare const ViewControl: (props: ViewControlProps) => React__default.JSX.Element;
+declare const ViewControl: React__default.MemoExoticComponent<(props: ViewControlProps) => React__default.JSX.Element>;
 
 declare const ViewControlTypes: {
     lineText: string;

package/dist/index.js

@@ -2803,7 +2803,7 @@ var InputControlClient_exports = {};
 __export(InputControlClient_exports, {
   default: () => InputControlClient_default
 });
-var import_react37, import_jsx_runtime46, InputControl, InputControlClient_default;
+var import_react37, import_jsx_runtime46, ControlComponents2, InputControl, InputControlClient_default;
 var init_InputControlClient = __esm({
   "src/components/controls/edit/InputControlClient.tsx"() {
     "use strict";
@@ -2829,32 +2829,32 @@ var init_InputControlClient = __esm({
     init_AssetUpload();
     init_SwitchInput();
     import_jsx_runtime46 = require("react/jsx-runtime");
-    InputControl = import_react37.default.forwardRef(
+    ControlComponents2 = {
+      [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,
+      [InputControlType_default.asset]: AssetUpload_default,
+      [InputControlType_default.switchInput]: SwitchInput_default
+    };
+    InputControl = import_react37.default.memo(import_react37.default.forwardRef(
       (props, ref) => {
-        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,
-          [InputControlType_default.asset]: AssetUpload_default,
-          [InputControlType_default.switchInput]: SwitchInput_default
-        };
-        const SelectedControlComponent = ControlComponents[props.controlType];
+        const SelectedControlComponent = ControlComponents2[props.controlType];
         return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_react37.default.Fragment, { children: SelectedControlComponent ? /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(SelectedControlComponent, { ...props }) : "Control not found" });
       }
-    );
+    ));
     InputControl.displayName = "InputControl";
     InputControlClient_default = InputControl;
   }
@@ -4499,36 +4499,36 @@ var DateTimeVew_default = DateTimeView;
 
 // src/components/controls/view/ViewControl.tsx
 var import_jsx_runtime18 = require("react/jsx-runtime");
-var ViewControl = (props) => {
-  const ControlComponents = {
-    [ViewControlTypes_default.lineText]: LineTextView_default,
-    [ViewControlTypes_default.emailText]: EmailTextView_default,
-    [ViewControlTypes_default.asset]: Asset_default,
-    [ViewControlTypes_default.multilineTextBullets]: MultilineTextBulletsView_default,
-    [ViewControlTypes_default.boolean]: BooleanView_default,
-    [ViewControlTypes_default.checkboxInput]: BooleanView_default,
-    // [ViewControlTypes.timeUntilStarts]: TimeUntilStarts,
-    [ViewControlTypes_default.money]: MoneyView_default,
-    [ViewControlTypes_default.date]: DateView_default,
-    [ViewControlTypes_default.time]: DateView_default,
-    [ViewControlTypes_default.datetime]: DateTimeVew_default,
-    [ViewControlTypes_default.number]: NumberView_default,
-    [ViewControlTypes_default.multilineText]: MultilineTextView_default,
-    [ViewControlTypes_default.multilinetext]: MultilineTextView_default,
-    [ViewControlTypes_default.moneyText]: MoneyView_default,
-    [ViewControlTypes_default.percentage]: PercentageView_default,
-    [ViewControlTypes_default.status]: StatusView_default,
-    [ViewControlTypes_default.statusBg]: StatusBgView_default,
-    [ViewControlTypes_default.progressIndicator]: ProgressIndicator_default,
-    // [ViewControlTypes.timeUntilStarts]: TimeUntilStarts,
-    // [ViewControlTypes.timeUntilStartsStyled]: TimeUntilStartsStyled,
-    [ViewControlTypes_default.aiGeneratedSummary]: AiGeneratedSummary_default,
-    [ViewControlTypes_default.booleanView]: BooleanView_default,
-    [ViewControlTypes_default.text]: LineTextView_default
-  };
+var ControlComponents = {
+  [ViewControlTypes_default.lineText]: LineTextView_default,
+  [ViewControlTypes_default.emailText]: EmailTextView_default,
+  [ViewControlTypes_default.asset]: Asset_default,
+  [ViewControlTypes_default.multilineTextBullets]: MultilineTextBulletsView_default,
+  [ViewControlTypes_default.boolean]: BooleanView_default,
+  [ViewControlTypes_default.checkboxInput]: BooleanView_default,
+  // [ViewControlTypes.timeUntilStarts]: TimeUntilStarts,
+  [ViewControlTypes_default.money]: MoneyView_default,
+  [ViewControlTypes_default.date]: DateView_default,
+  [ViewControlTypes_default.time]: DateView_default,
+  [ViewControlTypes_default.datetime]: DateTimeVew_default,
+  [ViewControlTypes_default.number]: NumberView_default,
+  [ViewControlTypes_default.multilineText]: MultilineTextView_default,
+  [ViewControlTypes_default.multilinetext]: MultilineTextView_default,
+  [ViewControlTypes_default.moneyText]: MoneyView_default,
+  [ViewControlTypes_default.percentage]: PercentageView_default,
+  [ViewControlTypes_default.status]: StatusView_default,
+  [ViewControlTypes_default.statusBg]: StatusBgView_default,
+  [ViewControlTypes_default.progressIndicator]: ProgressIndicator_default,
+  // [ViewControlTypes.timeUntilStarts]: TimeUntilStarts,
+  // [ViewControlTypes.timeUntilStartsStyled]: TimeUntilStartsStyled,
+  [ViewControlTypes_default.aiGeneratedSummary]: AiGeneratedSummary_default,
+  [ViewControlTypes_default.booleanView]: BooleanView_default,
+  [ViewControlTypes_default.text]: LineTextView_default
+};
+var ViewControl = import_react15.default.memo((props) => {
   const SelectedControlComponent = props.controlType ? ControlComponents[props.controlType] : void 0;
   return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_react15.default.Fragment, { children: SelectedControlComponent ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(SelectedControlComponent, { ...props }) : "Control not found:" + props.controlType });
-};
+});
 var ViewControl_default = ViewControl;
 
 // src/components/controls/edit/InputControl.tsx
@@ -7188,7 +7188,6 @@ var DataList = (props) => {
   let orderBy = "";
   let activePageNumber = 0;
   let pages = 0;
-  console.log(props.addLinkText);
   const [isDataFound, setIsDataFound] = (0, import_react58.useState)(null);
   const [searchTerm, setSearchTerm] = (0, import_react58.useState)(props.query?.searchTerm ?? "");
   (0, import_react58.useEffect)(() => {
@@ -7239,7 +7238,6 @@ var DataList = (props) => {
         name: updatedValues.name,
         value: updatedValues.value
       });
-      console.log("ddddaaa", updatedValues.value);
       let builder2 = new OdataBuilder(props.path);
       builder2 = builder2.setQuery(props.query);
       if (updatedValues.value != "" && updatedValues.value != null) {
@@ -7540,12 +7538,10 @@ var DataList = (props) => {
         }) }) }),
         /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("tbody", { className: "divide-y divide-gray-200 ", children: props.dataset?.result?.map((dataitem, index) => {
           let validityClass = "";
-          console.log("dataitem", dataitem);
           if (props.recordValidityColumnName && getNestedProperty2(dataitem, props.recordValidityColumnName) == false) {
             validityClass = "bg-alert-200";
           }
           return /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("tr", { className: validityClass, children: props?.columns?.map((column, colindex) => {
-            console.log("column", column);
             return /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(import_react58.default.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
               "td",
               {

package/dist/index.mjs

@@ -1,8 +1,6 @@
-"use client";
-
 import {
   OdataBuilder
-} from "./chunk-X3YSXTD2.mjs";
+} from "./chunk-UFKPTMM7.mjs";
 import {
   AssetUtility_default,
   BooleanSelect_default,
@@ -19,22 +17,22 @@ import {
   PhoneInput_default,
   SelectWithSearchInput_default,
   TimeInput_default
-} from "./chunk-7ZFZLN56.mjs";
+} from "./chunk-YG6FKKQJ.mjs";
 import {
   Constants,
   Hyperlink,
   Icon_default,
   InputControlType_default
-} from "./chunk-5GHPW7SJ.mjs";
+} from "./chunk-DBHUCH4B.mjs";
 import {
   ServiceClient_default
-} from "./chunk-WEV5U33G.mjs";
+} from "./chunk-3GWLDT7C.mjs";
 import {
   Button_default,
   ClientButton_default,
   ToastService_default
-} from "./chunk-JKP4XOZB.mjs";
-import "./chunk-IMNQO57B.mjs";
+} from "./chunk-YL6E76X2.mjs";
+import "./chunk-56HSDML5.mjs";
 
 // src/components/controls/view/ViewControl.tsx
 import React13 from "react";
@@ -78,7 +76,7 @@ var NumberView_default = NumberView;
 
 // src/components/controls/view/DateView.tsx
 import dynamic from "next/dynamic";
-var DateView = dynamic(() => import("./DateViewClient-VLTRN47D.mjs"), {
+var DateView = dynamic(() => import("./DateViewClient-ELEHLGWS.mjs"), {
   ssr: false
 });
 var DateView_default = DateView;
@@ -133,7 +131,7 @@ import React3 from "react";
 // src/components/DeviceAssetSelector.tsx
 import dynamic2 from "next/dynamic";
 import { jsx as jsx3 } from "react/jsx-runtime";
-var HlsPlayer = dynamic2(() => import("./HlsPlayer-5AWFZ2P6.mjs"), { ssr: false });
+var HlsPlayer = dynamic2(() => import("./HlsPlayer-57543DTW.mjs"), { ssr: false });
 var FORMAT_CLASSES = {
   center: "justify-center",
   left: "justify-start",
@@ -368,48 +366,48 @@ var AiGeneratedSummary_default = AiGeneratedSummary;
 
 // src/components/controls/view/DateTimeVew.tsx
 import dynamic3 from "next/dynamic";
-var DateTimeView = dynamic3(() => import("./DateTimeViewClient-R3M6ISVK.mjs"), {
+var DateTimeView = dynamic3(() => import("./DateTimeViewClient-22GW4AD7.mjs"), {
   ssr: false
 });
 var DateTimeVew_default = DateTimeView;
 
 // src/components/controls/view/ViewControl.tsx
 import { jsx as jsx14 } from "react/jsx-runtime";
-var ViewControl = (props) => {
-  const ControlComponents = {
-    [ViewControlTypes_default.lineText]: LineTextView_default,
-    [ViewControlTypes_default.emailText]: EmailTextView_default,
-    [ViewControlTypes_default.asset]: Asset_default,
-    [ViewControlTypes_default.multilineTextBullets]: MultilineTextBulletsView_default,
-    [ViewControlTypes_default.boolean]: BooleanView_default,
-    [ViewControlTypes_default.checkboxInput]: BooleanView_default,
-    // [ViewControlTypes.timeUntilStarts]: TimeUntilStarts,
-    [ViewControlTypes_default.money]: MoneyView_default,
-    [ViewControlTypes_default.date]: DateView_default,
-    [ViewControlTypes_default.time]: DateView_default,
-    [ViewControlTypes_default.datetime]: DateTimeVew_default,
-    [ViewControlTypes_default.number]: NumberView_default,
-    [ViewControlTypes_default.multilineText]: MultilineTextView_default,
-    [ViewControlTypes_default.multilinetext]: MultilineTextView_default,
-    [ViewControlTypes_default.moneyText]: MoneyView_default,
-    [ViewControlTypes_default.percentage]: PercentageView_default,
-    [ViewControlTypes_default.status]: StatusView_default,
-    [ViewControlTypes_default.statusBg]: StatusBgView_default,
-    [ViewControlTypes_default.progressIndicator]: ProgressIndicator_default,
-    // [ViewControlTypes.timeUntilStarts]: TimeUntilStarts,
-    // [ViewControlTypes.timeUntilStartsStyled]: TimeUntilStartsStyled,
-    [ViewControlTypes_default.aiGeneratedSummary]: AiGeneratedSummary_default,
-    [ViewControlTypes_default.booleanView]: BooleanView_default,
-    [ViewControlTypes_default.text]: LineTextView_default
-  };
+var ControlComponents = {
+  [ViewControlTypes_default.lineText]: LineTextView_default,
+  [ViewControlTypes_default.emailText]: EmailTextView_default,
+  [ViewControlTypes_default.asset]: Asset_default,
+  [ViewControlTypes_default.multilineTextBullets]: MultilineTextBulletsView_default,
+  [ViewControlTypes_default.boolean]: BooleanView_default,
+  [ViewControlTypes_default.checkboxInput]: BooleanView_default,
+  // [ViewControlTypes.timeUntilStarts]: TimeUntilStarts,
+  [ViewControlTypes_default.money]: MoneyView_default,
+  [ViewControlTypes_default.date]: DateView_default,
+  [ViewControlTypes_default.time]: DateView_default,
+  [ViewControlTypes_default.datetime]: DateTimeVew_default,
+  [ViewControlTypes_default.number]: NumberView_default,
+  [ViewControlTypes_default.multilineText]: MultilineTextView_default,
+  [ViewControlTypes_default.multilinetext]: MultilineTextView_default,
+  [ViewControlTypes_default.moneyText]: MoneyView_default,
+  [ViewControlTypes_default.percentage]: PercentageView_default,
+  [ViewControlTypes_default.status]: StatusView_default,
+  [ViewControlTypes_default.statusBg]: StatusBgView_default,
+  [ViewControlTypes_default.progressIndicator]: ProgressIndicator_default,
+  // [ViewControlTypes.timeUntilStarts]: TimeUntilStarts,
+  // [ViewControlTypes.timeUntilStartsStyled]: TimeUntilStartsStyled,
+  [ViewControlTypes_default.aiGeneratedSummary]: AiGeneratedSummary_default,
+  [ViewControlTypes_default.booleanView]: BooleanView_default,
+  [ViewControlTypes_default.text]: LineTextView_default
+};
+var ViewControl = React13.memo((props) => {
   const SelectedControlComponent = props.controlType ? ControlComponents[props.controlType] : void 0;
   return /* @__PURE__ */ jsx14(React13.Fragment, { children: SelectedControlComponent ? /* @__PURE__ */ jsx14(SelectedControlComponent, { ...props }) : "Control not found:" + props.controlType });
-};
+});
 var ViewControl_default = ViewControl;
 
 // src/components/controls/edit/InputControl.tsx
 import dynamic4 from "next/dynamic";
-var InputControl = dynamic4(() => import("./InputControlClient-QAZKQLFO.mjs"), {
+var InputControl = dynamic4(() => import("./InputControlClient-VUPWEYGB.mjs"), {
   ssr: false
 });
 var InputControl_default = InputControl;
@@ -505,7 +503,7 @@ import React14 from "react";
 // src/components/pageRenderingEngine/nodes/ImageNode.tsx
 import dynamic5 from "next/dynamic";
 import { jsx as jsx17 } from "react/jsx-runtime";
-var HlsPlayer2 = dynamic5(() => import("./HlsPlayer-5AWFZ2P6.mjs"), { ssr: false });
+var HlsPlayer2 = dynamic5(() => import("./HlsPlayer-57543DTW.mjs"), { ssr: false });
 var getNestedValue = (obj, path) => {
   if (!obj || !path) return void 0;
   return path.split(".").reduce((current, key) => {
@@ -613,7 +611,7 @@ var ImageNode_default = ImageNode;
 // src/components/pageRenderingEngine/nodes/LinkNode.tsx
 import dynamic6 from "next/dynamic";
 import { Fragment, jsx as jsx18, jsxs as jsxs6 } from "react/jsx-runtime";
-var LinkNodeButton = dynamic6(() => import("./LinkNodeButton-LX3KKGZY.mjs"), {
+var LinkNodeButton = dynamic6(() => import("./LinkNodeButton-XA7Z5IDR.mjs"), {
   ssr: false
 });
 function getNestedValue2(obj, path) {
@@ -1048,7 +1046,7 @@ var QuoteNode_default = QuoteNode;
 import React20 from "react";
 import dynamic7 from "next/dynamic";
 import { jsx as jsx27, jsxs as jsxs9 } from "react/jsx-runtime";
-var CopyButton = dynamic7(() => import("./CopyButton-UPJPMJUB.mjs"), {
+var CopyButton = dynamic7(() => import("./CopyButton-XONTQQW7.mjs"), {
   ssr: false,
   // optional: fallback UI while loading
   loading: () => /* @__PURE__ */ jsx27("span", { className: "text-gray-400 text-xs", children: "Copy" })
@@ -1191,7 +1189,7 @@ import React22 from "react";
 // src/components/pageRenderingEngine/nodes/EmbedNode.tsx
 import dynamic8 from "next/dynamic";
 import { jsx as jsx30 } from "react/jsx-runtime";
-var IframeClient = dynamic8(() => import("./IframeClient-RGJFZ5P2.mjs"), {
+var IframeClient = dynamic8(() => import("./IframeClient-J22NMEVY.mjs"), {
   ssr: false
 });
 var EmbedNode = (props) => {
@@ -1427,7 +1425,7 @@ var NoDataFound_default = NoDataFound;
 // src/components/pageRenderingEngine/nodes/ImageGalleryNode.tsx
 import dynamic9 from "next/dynamic";
 import { Fragment as Fragment5, jsx as jsx32, jsxs as jsxs11 } from "react/jsx-runtime";
-var HlsPlayer3 = dynamic9(() => import("./HlsPlayer-5AWFZ2P6.mjs"), { ssr: false });
+var HlsPlayer3 = dynamic9(() => import("./HlsPlayer-57543DTW.mjs"), { ssr: false });
 var deviceToMediaQuery = (device) => {
   switch (device) {
     case "lg":
@@ -2242,8 +2240,8 @@ var DocumentNode_default = DocumentNode;
 
 // src/components/pageRenderingEngine/nodes/DivContainer.tsx
 import { jsx as jsx34, jsxs as jsxs13 } from "react/jsx-runtime";
-var Pagination = dynamic10(() => import("./Pagination-T7YN2OMV.mjs"), { ssr: true });
-var Slider = dynamic10(() => import("./Slider-554BKC7N.mjs"), {
+var Pagination = dynamic10(() => import("./Pagination-NCJCOYHF.mjs"), { ssr: true });
+var Slider = dynamic10(() => import("./Slider-PEIVH6A5.mjs"), {
   ssr: false
 });
 function toCamelCase(str) {
@@ -3022,7 +3020,6 @@ var DataList = (props) => {
   let orderBy = "";
   let activePageNumber = 0;
   let pages = 0;
-  console.log(props.addLinkText);
   const [isDataFound, setIsDataFound] = useState2(null);
   const [searchTerm, setSearchTerm] = useState2(props.query?.searchTerm ?? "");
   useEffect3(() => {
@@ -3073,7 +3070,6 @@ var DataList = (props) => {
         name: updatedValues.name,
         value: updatedValues.value
       });
-      console.log("ddddaaa", updatedValues.value);
       let builder2 = new OdataBuilder(props.path);
       builder2 = builder2.setQuery(props.query);
       if (updatedValues.value != "" && updatedValues.value != null) {
@@ -3374,12 +3370,10 @@ var DataList = (props) => {
         }) }) }),
         /* @__PURE__ */ jsx40("tbody", { className: "divide-y divide-gray-200 ", children: props.dataset?.result?.map((dataitem, index) => {
           let validityClass = "";
-          console.log("dataitem", dataitem);
           if (props.recordValidityColumnName && getNestedProperty2(dataitem, props.recordValidityColumnName) == false) {
             validityClass = "bg-alert-200";
           }
           return /* @__PURE__ */ jsx40("tr", { className: validityClass, children: props?.columns?.map((column, colindex) => {
-            console.log("column", column);
             return /* @__PURE__ */ jsx40(React27.Fragment, { children: /* @__PURE__ */ jsx40(
               "td",
               {
@@ -4285,3 +4279,5 @@ export {
   ViewControl_default as ViewControl,
   ViewControlTypes_default as ViewControlTypes
 };
+ontrolTypes
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@acoustte-digital-services/digitalstore-controls-dev",
-  "version": "0.8.1-dev.20260715103126",
+  "version": "0.8.1-dev.20260721123022",
   "description": "Reusable React components",
   "main": "dist/index.js",
   "module": "dist/index.mjs",
@@ -63,7 +63,6 @@
     "load-tsconfig": "^0.2.5",
     "magic-string": "^0.30.21",
     "mlly": "^1.8.0",
-    "moment-timezone": "^0.6.2",
     "ms": "^2.1.3",
     "mz": "^2.7.0",
     "next": "^15.5.20",