@acoustte-digital-services/digitalstore-controls-dev 0.8.1-dev.20260505044510 → 0.8.1-dev.20260505112744

package/dist/DateViewClient-Y4J3UH4R.mjs

@@ -0,0 +1,116 @@
+"use client";
+
+// src/components/controls/view/DateViewClient.tsx
+import { useEffect, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var DateViewClient = (props) => {
+  const [timeZoneAbbr, setTimeZoneAbbr] = useState("");
+  useEffect(() => {
+    const parts = new Intl.DateTimeFormat("en", {
+      timeZoneName: "short"
+    }).formatToParts(/* @__PURE__ */ new Date());
+    const abbr = parts.find((part) => part.type === "timeZoneName")?.value || "";
+    setTimeZoneAbbr(abbr);
+  }, []);
+  const toUtcDate = (dateString) => {
+    const s = dateString.trim();
+    if (!s) {
+      throw new Error("Empty date string");
+    }
+    const iso = s.replace(" ", "T");
+    const hasTimeZone = /Z$/i.test(iso) || /[+-]\d{2}:\d{2}$/.test(iso);
+    const utc = hasTimeZone ? iso : `${iso}Z`;
+    const date = new Date(utc);
+    if (Number.isNaN(date.getTime())) {
+      throw new Error(`Invalid date: ${dateString}`);
+    }
+    return date;
+  };
+  const formatDate = (date) => {
+    return new Intl.DateTimeFormat("en", {
+      day: "2-digit",
+      month: "short",
+      year: "numeric"
+    }).format(date);
+  };
+  const formatTime = (date) => {
+    return date.getSeconds() === 0 ? new Intl.DateTimeFormat("en", {
+      hour: "2-digit",
+      minute: "2-digit"
+    }).format(date) : new Intl.DateTimeFormat("en", {
+      hour: "2-digit",
+      minute: "2-digit",
+      second: "2-digit"
+    }).format(date);
+  };
+  const formatDateTime = (date) => {
+    return date.getSeconds() === 0 ? new Intl.DateTimeFormat("en", {
+      day: "2-digit",
+      month: "short",
+      year: "numeric",
+      hour: "2-digit",
+      minute: "2-digit"
+    }).format(date) : new Intl.DateTimeFormat("en", {
+      day: "2-digit",
+      month: "short",
+      year: "numeric",
+      hour: "2-digit",
+      minute: "2-digit",
+      second: "2-digit"
+    }).format(date);
+  };
+  const getTimePeriod = (date) => {
+    const hours = date.getHours();
+    if (hours >= 5 && hours < 8) return "Early Morning";
+    if (hours >= 8 && hours < 12) return "Morning";
+    if (hours >= 12 && hours < 14) return "Noon";
+    if (hours >= 14 && hours < 17) return "Afternoon";
+    if (hours >= 17 && hours < 20) return "Evening";
+    if (hours >= 20 && hours < 22) return "Late Evening";
+    return "Night";
+  };
+  const getRelativeTime = (dateString) => {
+    const now = /* @__PURE__ */ new Date();
+    const utcDate = toUtcDate(dateString);
+    const diffMs = now.getTime() - utcDate.getTime();
+    const diffSec = Math.floor(diffMs / 1e3);
+    const diffMin = Math.floor(diffSec / 60);
+    const diffHr = Math.floor(diffMin / 60);
+    const diffDay = Math.floor(diffHr / 24);
+    if (diffSec < 60) return "Just now";
+    if (diffMin < 60) return `${diffMin} minute${diffMin > 1 ? "s" : ""} ago`;
+    if (diffHr < 24) return `${diffHr} hour${diffHr > 1 ? "s" : ""} ago`;
+    if (diffDay < 7) return `${diffDay} day${diffDay > 1 ? "s" : ""} ago`;
+    return formatDate(utcDate);
+  };
+  const parseAndFormatDate = (dateString, format) => {
+    if (format === "relative") {
+      return getRelativeTime(dateString);
+    }
+    const utcDate = toUtcDate(dateString);
+    switch (props.controlType) {
+      case "date":
+        return formatDate(utcDate);
+      case "time":
+        return `${formatTime(utcDate)} ${timeZoneAbbr} (${getTimePeriod(
+          utcDate
+        )})`;
+      default:
+        return formatDateTime(utcDate);
+    }
+  };
+  let localDateTime = "";
+  try {
+    localDateTime = parseAndFormatDate(props.value, props.format);
+  } catch (error) {
+    console.error("Error parsing date:", props.value, error);
+  }
+  return /* @__PURE__ */ jsxs("div", { className: "inline-flex flex-wrap gap-1", children: [
+    /* @__PURE__ */ jsx("span", { children: localDateTime }),
+    !props.format && props.controlType !== "date" && timeZoneAbbr && /* @__PURE__ */ jsx("span", { children: timeZoneAbbr })
+  ] });
+};
+var DateViewClient_default = DateViewClient;
+export {
+  DateViewClient_default as default
+};

package/dist/{HlsPlayer-HWWCUCH6.mjs → HlsPlayer-YWNL6PVB.mjs}

@@ -1,7 +1,7 @@
 "use client";
 import {
   HlsPlayer_default
-} from "./chunk-CT5SLXYT.mjs";
+} from "./chunk-EX7D6KBZ.mjs";
 export {
   HlsPlayer_default as default
 };

package/dist/{chunk-CT5SLXYT.mjs → chunk-EX7D6KBZ.mjs}

@@ -203,23 +203,26 @@ var HlsPlayer = React.memo(
     }, [isMobile, resetInactivityTimer]);
     const posterSources = resolvedSources.filter((s) => s.media && s.posterUrl);
     const fallbackPoster = posterUrl ?? resolvedSources.find((s) => !s.media)?.posterUrl ?? resolvedSources[0]?.posterUrl;
-    const overlayButtonStyle = {
+    const playBtnSize = "clamp(44px, 8vmin, 80px)";
+    const iconBtnSize = "clamp(28px, 4.5vmin, 40px)";
+    const iconSvgSize = "clamp(14px, 2.5vmin, 20px)";
+    const playIconSize = "clamp(24px, 4.5vmin, 44px)";
+    const iconButtonStyle = {
       pointerEvents: isControlsVisible ? "auto" : "none",
-      width: 30,
-      height: 30,
+      width: iconBtnSize,
+      height: iconBtnSize,
       borderRadius: "50%",
       border: "1.5px solid rgba(255,255,255,0.18)",
       cursor: "pointer",
       display: "flex",
       alignItems: "center",
       justifyContent: "center",
-      // background: "#F31F49",
-      // background: "linear-gradient(50deg,rgba(243, 31, 73, 1) 0%, rgba(143, 38, 237, 1) 100%)",
-      // background: "rgba(0, 0, 0, 0.45)",
-      // backdropFilter: "blur(10px)",
-      // WebkitBackdropFilter: "blur(10px)",
-      // boxShadow: "0 4px 32px rgba(0,0,0,0.4), inset 0 1px 0 rgba(255,255,255,0.1)",
-      transition: "transform 0.18s ease, background 0.18s ease, border-color 0.18s ease"
+      background: "rgba(0, 0, 0, 0.45)",
+      backdropFilter: "blur(10px)",
+      WebkitBackdropFilter: "blur(10px)",
+      boxShadow: "0 4px 32px rgba(0,0,0,0.4), inset 0 1px 0 rgba(255,255,255,0.1)",
+      transition: "transform 0.18s ease",
+      flexShrink: 0
     };
     if (resolvedSources.length === 0) return null;
     const showMuteButton = !showControls && !isPlayOnHover;
@@ -299,15 +302,60 @@ var HlsPlayer = React.memo(
                     handlePlayPause();
                   },
                   style: {
-                    ...overlayButtonStyle,
-                    width: 64,
-                    height: 64,
-                    background: "linear-gradient(50deg, rgba(243, 31, 73, 1) 0%, rgba(143, 38, 237, 1) 100%)"
+                    pointerEvents: isControlsVisible ? "auto" : "none",
+                    width: playBtnSize,
+                    height: playBtnSize,
+                    borderRadius: "50%",
+                    border: "none",
+                    cursor: "pointer",
+                    display: "flex",
+                    alignItems: "center",
+                    justifyContent: "center",
+                    background: "linear-gradient(50deg, rgba(243, 31, 73, 1) 0%, rgba(143, 38, 237, 1) 100%)",
+                    flexShrink: 0
+                    // No box-shadow, no transition on background — clean gradient, no hover state.
                   },
-                  children: isPlaying ? /* @__PURE__ */ jsxs("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
-                    /* @__PURE__ */ jsx("rect", { x: "3.5", y: "2.5", width: "4.5", height: "15", rx: "1.5", fill: "white" }),
-                    /* @__PURE__ */ jsx("rect", { x: "12", y: "2.5", width: "4.5", height: "15", rx: "1.5", fill: "white" })
-                  ] }) : /* @__PURE__ */ jsx("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", style: { transform: "translateX(2px)" }, children: /* @__PURE__ */ jsx("path", { d: "M5 3.5L17 10L5 16.5V3.5Z", fill: "white" }) })
+                  children: isPlaying ? (
+                    /* Pause — two rounded bars, sized to match play icon proportions */
+                    /* @__PURE__ */ jsxs(
+                      "svg",
+                      {
+                        width: playIconSize,
+                        height: playIconSize,
+                        viewBox: "0 0 20 20",
+                        fill: "none",
+                        xmlns: "http://www.w3.org/2000/svg",
+                        children: [
+                          /* @__PURE__ */ jsx("rect", { x: "3.5", y: "2.5", width: "4.5", height: "15", rx: "1.5", fill: "white" }),
+                          /* @__PURE__ */ jsx("rect", { x: "12", y: "2.5", width: "4.5", height: "15", rx: "1.5", fill: "white" })
+                        ]
+                      }
+                    )
+                  ) : (
+                    /*
+                     * Play — rounded-corner triangle from the provided SVG path.
+                     * Original viewBox is "0,0,240,250" (with a 5.33x scale group inside).
+                     * We flatten the transform: effective drawing area is 240×250 units.
+                     */
+                    /* @__PURE__ */ jsx(
+                      "svg",
+                      {
+                        width: playIconSize,
+                        height: playIconSize,
+                        viewBox: "0 0 240 250",
+                        fill: "none",
+                        xmlns: "http://www.w3.org/2000/svg",
+                        style: { transform: "translateX(4%)" },
+                        children: /* @__PURE__ */ jsx(
+                          "path",
+                          {
+                            d: "M60.78 21.93C48.57 22.41 37.33 32.78 37.33 45.87v164.26c0 17.92 19.96 29.67 35.64 20.99l148.31-82.17c16.12-8.93 16.12-33.04 0-41.97L72.97 24.81c-3.92-2.17-8.11-3.07-12.19-2.88z",
+                            fill: "white"
+                          }
+                        )
+                      }
+                    )
+                  )
                 }
               )
             }
@@ -333,12 +381,12 @@ var HlsPlayer = React.memo(
                       e.stopPropagation();
                       handleMuteToggle();
                     },
-                    style: overlayButtonStyle,
-                    children: isMuted ? /* @__PURE__ */ jsxs("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
+                    style: iconButtonStyle,
+                    children: isMuted ? /* @__PURE__ */ jsxs("svg", { width: iconSvgSize, height: iconSvgSize, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
                       /* @__PURE__ */ jsx("path", { d: "M11 5L6 9H2v6h4l5 4V5Z", fill: "white" }),
                       /* @__PURE__ */ jsx("line", { x1: "23", y1: "9", x2: "17", y2: "15", stroke: "white", strokeWidth: "2", strokeLinecap: "round" }),
                       /* @__PURE__ */ jsx("line", { x1: "17", y1: "9", x2: "23", y2: "15", stroke: "white", strokeWidth: "2", strokeLinecap: "round" })
-                    ] }) : /* @__PURE__ */ jsxs("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
+                    ] }) : /* @__PURE__ */ jsxs("svg", { width: iconSvgSize, height: iconSvgSize, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
                       /* @__PURE__ */ jsx("path", { d: "M11 5L6 9H2v6h4l5 4V5Z", fill: "white" }),
                       /* @__PURE__ */ jsx("path", { d: "M15.54 8.46a5 5 0 0 1 0 7.07", stroke: "white", strokeWidth: "2", strokeLinecap: "round" }),
                       /* @__PURE__ */ jsx("path", { d: "M19.07 4.93a10 10 0 0 1 0 14.14", stroke: "white", strokeWidth: "2", strokeLinecap: "round" })
@@ -354,14 +402,8 @@ var HlsPlayer = React.memo(
                       e.stopPropagation();
                       handleFullscreenToggle();
                     },
-                    style: overlayButtonStyle,
-                    children: isFullscreen ? (
-                      /* Compress / exit icon — two inward-pointing arrows */
-                      /* @__PURE__ */ jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx("path", { d: "M8 3v5H3M21 8h-5V3M3 16h5v5M16 21v-5h5", stroke: "white", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) })
-                    ) : (
-                      /* Expand icon — four outward-pointing arrows */
-                      /* @__PURE__ */ jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx("path", { d: "M3 8V3h5M16 3h5v5M21 16v5h-5M8 21H3v-5", stroke: "white", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) })
-                    )
+                    style: iconButtonStyle,
+                    children: isFullscreen ? /* @__PURE__ */ jsx("svg", { width: iconSvgSize, height: iconSvgSize, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx("path", { d: "M8 3v5H3M21 8h-5V3M3 16h5v5M16 21v-5h5", stroke: "white", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }) : /* @__PURE__ */ jsx("svg", { width: iconSvgSize, height: iconSvgSize, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx("path", { d: "M3 8V3h5M16 3h5v5M21 16v5h-5M8 21H3v-5", stroke: "white", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) })
                   }
                 )
               ]

package/dist/index.js

@@ -30,128 +30,6 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
 ));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 
-// src/components/controls/view/TimeZoneAbbrevations.tsx
-var timeZoneAbbreviations;
-var init_TimeZoneAbbrevations = __esm({
-  "src/components/controls/view/TimeZoneAbbrevations.tsx"() {
-    "use strict";
-    timeZoneAbbreviations = {
-      "Asia/Calcutta": "IST",
-      "Asia/Kolkata": "IST",
-      "America/New_York": "EST",
-      "America/Los_Angeles": "PST",
-      "Europe/London": "GMT",
-      "Europe/Paris": "CET",
-      "Asia/Tokyo": "JST",
-      "America/Chicago": "CST",
-      "America/Denver": "MST",
-      "Asia/Shanghai": "CST",
-      "Asia/Hong_Kong": "HKT",
-      "Australia/Sydney": "AEST",
-      "Australia/Melbourne": "AEST",
-      "Australia/Perth": "AWST",
-      "Pacific/Auckland": "NZST",
-      "Europe/Berlin": "CET",
-      "Europe/Madrid": "CET",
-      "Europe/Rome": "CET",
-      "Europe/Athens": "EET",
-      "Europe/Istanbul": "TRT",
-      "Africa/Cairo": "EET",
-      "Africa/Johannesburg": "SAST",
-      "Asia/Dubai": "GST",
-      "Asia/Singapore": "SGT",
-      "Asia/Seoul": "KST",
-      "America/Toronto": "EST",
-      "America/Vancouver": "PST",
-      "America/Sao_Paulo": "BRT",
-      "America/Mexico_City": "CST",
-      "Asia/Manila": "PHT",
-      "Asia/Jakarta": "WIB",
-      "Asia/Bangkok": "ICT",
-      "Asia/Karachi": "PKT",
-      "Asia/Tehran": "IRST",
-      "Asia/Baghdad": "AST",
-      "Europe/Moscow": "MSK",
-      "Europe/Amsterdam": "CET",
-      "Europe/Brussels": "CET",
-      "Europe/Zurich": "CET",
-      "America/Anchorage": "AKST",
-      "Pacific/Honolulu": "HST",
-      "Antarctica/McMurdo": "NZST",
-      "Atlantic/Reykjavik": "GMT",
-      "Asia/Riyadh": "AST",
-      "America/Argentina/Buenos_Aires": "ART",
-      "America/Bogota": "COT",
-      "Africa/Nairobi": "EAT",
-      "Asia/Kuala_Lumpur": "MYT",
-      "Asia/Ho_Chi_Minh": "ICT",
-      "Europe/Warsaw": "CET",
-      "Europe/Prague": "CET",
-      "America/Phoenix": "MST",
-      "America/Indianapolis": "EST",
-      "Pacific/Fiji": "FJT",
-      "Asia/Colombo": "IST",
-      "Africa/Lagos": "WAT",
-      "America/Caracas": "VET",
-      "America/Halifax": "AST",
-      "Pacific/Tahiti": "TAHT",
-      "America/St_Johns": "NST",
-      "Europe/Bucharest": "EET",
-      "Europe/Helsinki": "EET",
-      "Europe/Kiev": "EET",
-      "Europe/Oslo": "CET",
-      "Europe/Stockholm": "CET",
-      "Europe/Lisbon": "WET",
-      "Asia/Beirut": "EET",
-      "Asia/Damascus": "EET",
-      "Asia/Jerusalem": "IST",
-      "Asia/Amman": "EET",
-      "America/Santiago": "CLT",
-      "America/Lima": "PET",
-      "America/Montevideo": "UYT",
-      "Asia/Tashkent": "UZT",
-      "Asia/Yerevan": "AMT",
-      "Asia/Baku": "AZT",
-      "Europe/Vilnius": "EET",
-      "Europe/Riga": "EET",
-      "Europe/Tallinn": "EET",
-      "Europe/Sofia": "EET",
-      "Africa/Casablanca": "WET",
-      "America/Guatemala": "CST",
-      "America/Panama": "EST",
-      "America/Costa_Rica": "CST",
-      "Pacific/Port_Moresby": "PGT",
-      "Asia/Makassar": "WITA",
-      "Asia/Vladivostok": "VLAT",
-      "Asia/Krasnoyarsk": "KRAT",
-      "Asia/Novosibirsk": "NOVT",
-      "Asia/Yakutsk": "YAKT",
-      "Asia/Sakhalin": "SAKT",
-      "Asia/Ulaanbaatar": "ULAT",
-      "Asia/Choibalsan": "CHOT",
-      "Asia/Omsk": "OMST",
-      "Asia/Kamchatka": "PETT",
-      "Pacific/Pago_Pago": "SST",
-      "Pacific/Guam": "ChST",
-      "Pacific/Saipan": "ChST",
-      "Pacific/Palau": "PWT",
-      "Pacific/Efate": "VUT",
-      "Pacific/Kosrae": "KOST",
-      "Pacific/Nauru": "NRT",
-      "Pacific/Tarawa": "GILT",
-      "Pacific/Enderbury": "PHOT",
-      "Pacific/Fakaofo": "TKT",
-      "Pacific/Chatham": "CHAST",
-      "Pacific/Tongatapu": "TOT",
-      "Pacific/Funafuti": "TVT",
-      "Pacific/Majuro": "MHT",
-      "Pacific/Kwajalein": "MHT",
-      "Pacific/Wake": "WAKT",
-      "Pacific/Wallis": "WFT"
-    };
-  }
-});
-
 // src/components/controls/view/DateViewClient.tsx
 var DateViewClient_exports = {};
 __export(DateViewClient_exports, {
@@ -162,28 +40,73 @@ var init_DateViewClient = __esm({
   "src/components/controls/view/DateViewClient.tsx"() {
     "use strict";
     "use client";
-    import_react2 = __toESM(require("react"));
-    init_TimeZoneAbbrevations();
+    import_react2 = require("react");
     import_jsx_runtime2 = require("react/jsx-runtime");
     DateViewClient = (props) => {
-      const [offsetMilliseconds, setOffsetMilliseconds] = (0, import_react2.useState)(0);
       const [timeZoneAbbr, setTimeZoneAbbr] = (0, import_react2.useState)("");
       (0, import_react2.useEffect)(() => {
-        const now = /* @__PURE__ */ new Date();
-        const offsetMinutes = now.getTimezoneOffset();
-        setOffsetMilliseconds(offsetMinutes * 60 * 1e3);
-        setTimeZoneAbbr(
-          now.toLocaleTimeString("en", { timeZoneName: "short" }).split(" ")[2]
-        );
+        const parts = new Intl.DateTimeFormat("en", {
+          timeZoneName: "short"
+        }).formatToParts(/* @__PURE__ */ new Date());
+        const abbr = parts.find((part) => part.type === "timeZoneName")?.value || "";
+        setTimeZoneAbbr(abbr);
       }, []);
       const toUtcDate = (dateString) => {
         const s = dateString.trim();
+        if (!s) {
+          throw new Error("Empty date string");
+        }
         const iso = s.replace(" ", "T");
-        const utc = iso.endsWith("Z") || iso.includes("+") ? iso : iso + "Z";
-        return new Date(utc);
+        const hasTimeZone = /Z$/i.test(iso) || /[+-]\d{2}:\d{2}$/.test(iso);
+        const utc = hasTimeZone ? iso : `${iso}Z`;
+        const date = new Date(utc);
+        if (Number.isNaN(date.getTime())) {
+          throw new Error(`Invalid date: ${dateString}`);
+        }
+        return date;
       };
-      const toLocalDate = (utcDate) => {
-        return new Date(utcDate.getTime() - offsetMilliseconds);
+      const formatDate = (date) => {
+        return new Intl.DateTimeFormat("en", {
+          day: "2-digit",
+          month: "short",
+          year: "numeric"
+        }).format(date);
+      };
+      const formatTime = (date) => {
+        return date.getSeconds() === 0 ? new Intl.DateTimeFormat("en", {
+          hour: "2-digit",
+          minute: "2-digit"
+        }).format(date) : new Intl.DateTimeFormat("en", {
+          hour: "2-digit",
+          minute: "2-digit",
+          second: "2-digit"
+        }).format(date);
+      };
+      const formatDateTime = (date) => {
+        return date.getSeconds() === 0 ? new Intl.DateTimeFormat("en", {
+          day: "2-digit",
+          month: "short",
+          year: "numeric",
+          hour: "2-digit",
+          minute: "2-digit"
+        }).format(date) : new Intl.DateTimeFormat("en", {
+          day: "2-digit",
+          month: "short",
+          year: "numeric",
+          hour: "2-digit",
+          minute: "2-digit",
+          second: "2-digit"
+        }).format(date);
+      };
+      const getTimePeriod = (date) => {
+        const hours = date.getHours();
+        if (hours >= 5 && hours < 8) return "Early Morning";
+        if (hours >= 8 && hours < 12) return "Morning";
+        if (hours >= 12 && hours < 14) return "Noon";
+        if (hours >= 14 && hours < 17) return "Afternoon";
+        if (hours >= 17 && hours < 20) return "Evening";
+        if (hours >= 20 && hours < 22) return "Late Evening";
+        return "Night";
       };
       const getRelativeTime = (dateString) => {
         const now = /* @__PURE__ */ new Date();
@@ -197,77 +120,34 @@ var init_DateViewClient = __esm({
         if (diffMin < 60) return `${diffMin} minute${diffMin > 1 ? "s" : ""} ago`;
         if (diffHr < 24) return `${diffHr} hour${diffHr > 1 ? "s" : ""} ago`;
         if (diffDay < 7) return `${diffDay} day${diffDay > 1 ? "s" : ""} ago`;
-        return new Intl.DateTimeFormat("en", {
-          day: "2-digit",
-          month: "short",
-          year: "numeric"
-        }).format(toLocalDate(utcDate));
+        return formatDate(utcDate);
       };
       const parseAndFormatDate = (dateString, format) => {
         if (format === "relative") {
           return getRelativeTime(dateString);
         }
         const utcDate = toUtcDate(dateString);
-        const localDate = toLocalDate(utcDate);
         switch (props.controlType) {
           case "date":
-            return new Intl.DateTimeFormat("en", {
-              day: "2-digit",
-              month: "short",
-              year: "numeric"
-            }).format(localDate);
+            return formatDate(utcDate);
           case "time":
-            return `${formatTime(localDate)} ${timeZoneAbbr} (${getTimePeriod(localDate)})`;
+            return `${formatTime(utcDate)} ${timeZoneAbbr} (${getTimePeriod(
+              utcDate
+            )})`;
           default:
-            return utcDate.getSeconds() === 0 ? new Intl.DateTimeFormat("en", {
-              day: "2-digit",
-              month: "short",
-              year: "numeric",
-              hour: "2-digit",
-              minute: "2-digit"
-            }).format(localDate) : new Intl.DateTimeFormat("en", {
-              day: "2-digit",
-              month: "short",
-              year: "numeric",
-              hour: "2-digit",
-              minute: "2-digit",
-              second: "2-digit"
-            }).format(localDate);
+            return formatDateTime(utcDate);
         }
       };
-      const formatTime = (localDate) => {
-        return localDate.getSeconds() === 0 ? new Intl.DateTimeFormat("en", {
-          hour: "2-digit",
-          minute: "2-digit"
-        }).format(localDate) : new Intl.DateTimeFormat("en", {
-          hour: "2-digit",
-          minute: "2-digit",
-          second: "2-digit"
-        }).format(localDate);
-      };
-      const getTimePeriod = (localDate) => {
-        const hours = localDate.getHours();
-        if (hours >= 5 && hours < 8) return "Early Morning";
-        if (hours >= 8 && hours < 12) return "Morning";
-        if (hours >= 12 && hours < 14) return "Noon";
-        if (hours >= 14 && hours < 17) return "Afternoon";
-        if (hours >= 17 && hours < 20) return "Evening";
-        if (hours >= 20 && hours < 22) return "Late Evening";
-        return "Night";
-      };
-      const getTimeZoneAbbreviation = (timeZone) => {
-        return timeZoneAbbreviations[timeZone] || timeZone;
-      };
       let localDateTime = "";
       try {
         localDateTime = parseAndFormatDate(props.value, props.format);
       } catch (error) {
         console.error("Error parsing date:", props.value, error);
       }
-      return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react2.default.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "inline-flex flex-wrap gap-1", children: [
+      return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "inline-flex flex-wrap gap-1", children: [
         /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { children: localDateTime }),
-        !props.format && props.controlType != "date" && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { children: timeZoneAbbr })
-      ] }) });
+        !props.format && props.controlType !== "date" && timeZoneAbbr && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { children: timeZoneAbbr })
+      ] });
     };
     DateViewClient_default = DateViewClient;
   }
@@ -729,23 +609,26 @@ var init_HlsPlayer = __esm({
         }, [isMobile, resetInactivityTimer]);
         const posterSources = resolvedSources.filter((s) => s.media && s.posterUrl);
         const fallbackPoster = posterUrl ?? resolvedSources.find((s) => !s.media)?.posterUrl ?? resolvedSources[0]?.posterUrl;
-        const overlayButtonStyle = {
+        const playBtnSize = "clamp(44px, 8vmin, 80px)";
+        const iconBtnSize = "clamp(28px, 4.5vmin, 40px)";
+        const iconSvgSize = "clamp(14px, 2.5vmin, 20px)";
+        const playIconSize = "clamp(24px, 4.5vmin, 44px)";
+        const iconButtonStyle = {
           pointerEvents: isControlsVisible ? "auto" : "none",
-          width: 30,
-          height: 30,
+          width: iconBtnSize,
+          height: iconBtnSize,
           borderRadius: "50%",
           border: "1.5px solid rgba(255,255,255,0.18)",
           cursor: "pointer",
           display: "flex",
           alignItems: "center",
           justifyContent: "center",
-          // background: "#F31F49",
-          // background: "linear-gradient(50deg,rgba(243, 31, 73, 1) 0%, rgba(143, 38, 237, 1) 100%)",
-          // background: "rgba(0, 0, 0, 0.45)",
-          // backdropFilter: "blur(10px)",
-          // WebkitBackdropFilter: "blur(10px)",
-          // boxShadow: "0 4px 32px rgba(0,0,0,0.4), inset 0 1px 0 rgba(255,255,255,0.1)",
-          transition: "transform 0.18s ease, background 0.18s ease, border-color 0.18s ease"
+          background: "rgba(0, 0, 0, 0.45)",
+          backdropFilter: "blur(10px)",
+          WebkitBackdropFilter: "blur(10px)",
+          boxShadow: "0 4px 32px rgba(0,0,0,0.4), inset 0 1px 0 rgba(255,255,255,0.1)",
+          transition: "transform 0.18s ease",
+          flexShrink: 0
         };
         if (resolvedSources.length === 0) return null;
         const showMuteButton = !showControls && !isPlayOnHover;
@@ -825,15 +708,60 @@ var init_HlsPlayer = __esm({
                         handlePlayPause();
                       },
                       style: {
-                        ...overlayButtonStyle,
-                        width: 64,
-                        height: 64,
-                        background: "linear-gradient(50deg, rgba(243, 31, 73, 1) 0%, rgba(143, 38, 237, 1) 100%)"
+                        pointerEvents: isControlsVisible ? "auto" : "none",
+                        width: playBtnSize,
+                        height: playBtnSize,
+                        borderRadius: "50%",
+                        border: "none",
+                        cursor: "pointer",
+                        display: "flex",
+                        alignItems: "center",
+                        justifyContent: "center",
+                        background: "linear-gradient(50deg, rgba(243, 31, 73, 1) 0%, rgba(143, 38, 237, 1) 100%)",
+                        flexShrink: 0
+                        // No box-shadow, no transition on background — clean gradient, no hover state.
                       },
-                      children: isPlaying ? /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
-                        /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("rect", { x: "3.5", y: "2.5", width: "4.5", height: "15", rx: "1.5", fill: "white" }),
-                        /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("rect", { x: "12", y: "2.5", width: "4.5", height: "15", rx: "1.5", fill: "white" })
-                      ] }) : /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", style: { transform: "translateX(2px)" }, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("path", { d: "M5 3.5L17 10L5 16.5V3.5Z", fill: "white" }) })
+                      children: isPlaying ? (
+                        /* Pause — two rounded bars, sized to match play icon proportions */
+                        /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
+                          "svg",
+                          {
+                            width: playIconSize,
+                            height: playIconSize,
+                            viewBox: "0 0 20 20",
+                            fill: "none",
+                            xmlns: "http://www.w3.org/2000/svg",
+                            children: [
+                              /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("rect", { x: "3.5", y: "2.5", width: "4.5", height: "15", rx: "1.5", fill: "white" }),
+                              /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("rect", { x: "12", y: "2.5", width: "4.5", height: "15", rx: "1.5", fill: "white" })
+                            ]
+                          }
+                        )
+                      ) : (
+                        /*
+                         * Play — rounded-corner triangle from the provided SVG path.
+                         * Original viewBox is "0,0,240,250" (with a 5.33x scale group inside).
+                         * We flatten the transform: effective drawing area is 240×250 units.
+                         */
+                        /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+                          "svg",
+                          {
+                            width: playIconSize,
+                            height: playIconSize,
+                            viewBox: "0 0 240 250",
+                            fill: "none",
+                            xmlns: "http://www.w3.org/2000/svg",
+                            style: { transform: "translateX(4%)" },
+                            children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+                              "path",
+                              {
+                                d: "M60.78 21.93C48.57 22.41 37.33 32.78 37.33 45.87v164.26c0 17.92 19.96 29.67 35.64 20.99l148.31-82.17c16.12-8.93 16.12-33.04 0-41.97L72.97 24.81c-3.92-2.17-8.11-3.07-12.19-2.88z",
+                                fill: "white"
+                              }
+                            )
+                          }
+                        )
+                      )
                     }
                   )
                 }
@@ -859,12 +787,12 @@ var init_HlsPlayer = __esm({
                           e.stopPropagation();
                           handleMuteToggle();
                         },
-                        style: overlayButtonStyle,
-                        children: isMuted ? /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
+                        style: iconButtonStyle,
+                        children: isMuted ? /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("svg", { width: iconSvgSize, height: iconSvgSize, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
                           /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("path", { d: "M11 5L6 9H2v6h4l5 4V5Z", fill: "white" }),
                           /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("line", { x1: "23", y1: "9", x2: "17", y2: "15", stroke: "white", strokeWidth: "2", strokeLinecap: "round" }),
                           /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("line", { x1: "17", y1: "9", x2: "23", y2: "15", stroke: "white", strokeWidth: "2", strokeLinecap: "round" })
-                        ] }) : /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
+                        ] }) : /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("svg", { width: iconSvgSize, height: iconSvgSize, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
                           /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("path", { d: "M11 5L6 9H2v6h4l5 4V5Z", fill: "white" }),
                           /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("path", { d: "M15.54 8.46a5 5 0 0 1 0 7.07", stroke: "white", strokeWidth: "2", strokeLinecap: "round" }),
                           /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("path", { d: "M19.07 4.93a10 10 0 0 1 0 14.14", stroke: "white", strokeWidth: "2", strokeLinecap: "round" })
@@ -880,14 +808,8 @@ var init_HlsPlayer = __esm({
                           e.stopPropagation();
                           handleFullscreenToggle();
                         },
-                        style: overlayButtonStyle,
-                        children: isFullscreen ? (
-                          /* Compress / exit icon — two inward-pointing arrows */
-                          /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("path", { d: "M8 3v5H3M21 8h-5V3M3 16h5v5M16 21v-5h5", stroke: "white", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) })
-                        ) : (
-                          /* Expand icon — four outward-pointing arrows */
-                          /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("path", { d: "M3 8V3h5M16 3h5v5M21 16v5h-5M8 21H3v-5", stroke: "white", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) })
-                        )
+                        style: iconButtonStyle,
+                        children: isFullscreen ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("svg", { width: iconSvgSize, height: iconSvgSize, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("path", { d: "M8 3v5H3M21 8h-5V3M3 16h5v5M16 21v-5h5", stroke: "white", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }) : /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("svg", { width: iconSvgSize, height: iconSvgSize, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("path", { d: "M3 8V3h5M16 3h5v5M21 16v5h-5M8 21H3v-5", stroke: "white", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) })
                       }
                     )
                   ]

package/dist/index.mjs

@@ -1,6 +1,6 @@
 import {
   HlsPlayer_default
-} from "./chunk-CT5SLXYT.mjs";
+} from "./chunk-EX7D6KBZ.mjs";
 import {
   Button_default,
   ClientButton_default,
@@ -44,7 +44,7 @@ var NumberView_default = NumberView;
 
 // src/components/controls/view/DateView.tsx
 import dynamic from "next/dynamic";
-var DateView = dynamic(() => import("./DateViewClient-UCGTXQNC.mjs"), {
+var DateView = dynamic(() => import("./DateViewClient-Y4J3UH4R.mjs"), {
   ssr: false
 });
 var DateView_default = DateView;
@@ -1963,7 +1963,7 @@ var DeviceAssetSelector_default = DeviceAssetSelector;
 
 // src/components/pageRenderingEngine/nodes/ImageNode.tsx
 import { Fragment as Fragment2, jsx as jsx37 } from "react/jsx-runtime";
-var HlsPlayer = dynamic2(() => import("./HlsPlayer-HWWCUCH6.mjs"), {
+var HlsPlayer = dynamic2(() => import("./HlsPlayer-YWNL6PVB.mjs"), {
   ssr: false
 });
 var getNestedValue = (obj, path) => {
@@ -3645,7 +3645,7 @@ var Pagination_default = Pagination;
 // src/components/pageRenderingEngine/nodes/ImageGalleryNode.tsx
 import dynamic6 from "next/dynamic";
 import { Fragment as Fragment8, jsx as jsx56, jsxs as jsxs31 } from "react/jsx-runtime";
-var HlsPlayer2 = dynamic6(() => import("./HlsPlayer-HWWCUCH6.mjs"), { ssr: false });
+var HlsPlayer2 = dynamic6(() => import("./HlsPlayer-YWNL6PVB.mjs"), { ssr: false });
 var deviceToMediaQuery = (device) => {
   switch (device) {
     case "sm":

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@acoustte-digital-services/digitalstore-controls-dev",
-  "version": "0.8.1-dev.20260505044510",
+  "version": "0.8.1-dev.20260505112744",
   "description": "Reusable React components",
   "main": "dist/index.js",
   "module": "dist/index.mjs",

package/dist/DateViewClient-UCGTXQNC.mjs

@@ -1,231 +0,0 @@
-"use client";
-
-// src/components/controls/view/DateViewClient.tsx
-import React, { useState, useEffect } from "react";
-
-// src/components/controls/view/TimeZoneAbbrevations.tsx
-var timeZoneAbbreviations = {
-  "Asia/Calcutta": "IST",
-  "Asia/Kolkata": "IST",
-  "America/New_York": "EST",
-  "America/Los_Angeles": "PST",
-  "Europe/London": "GMT",
-  "Europe/Paris": "CET",
-  "Asia/Tokyo": "JST",
-  "America/Chicago": "CST",
-  "America/Denver": "MST",
-  "Asia/Shanghai": "CST",
-  "Asia/Hong_Kong": "HKT",
-  "Australia/Sydney": "AEST",
-  "Australia/Melbourne": "AEST",
-  "Australia/Perth": "AWST",
-  "Pacific/Auckland": "NZST",
-  "Europe/Berlin": "CET",
-  "Europe/Madrid": "CET",
-  "Europe/Rome": "CET",
-  "Europe/Athens": "EET",
-  "Europe/Istanbul": "TRT",
-  "Africa/Cairo": "EET",
-  "Africa/Johannesburg": "SAST",
-  "Asia/Dubai": "GST",
-  "Asia/Singapore": "SGT",
-  "Asia/Seoul": "KST",
-  "America/Toronto": "EST",
-  "America/Vancouver": "PST",
-  "America/Sao_Paulo": "BRT",
-  "America/Mexico_City": "CST",
-  "Asia/Manila": "PHT",
-  "Asia/Jakarta": "WIB",
-  "Asia/Bangkok": "ICT",
-  "Asia/Karachi": "PKT",
-  "Asia/Tehran": "IRST",
-  "Asia/Baghdad": "AST",
-  "Europe/Moscow": "MSK",
-  "Europe/Amsterdam": "CET",
-  "Europe/Brussels": "CET",
-  "Europe/Zurich": "CET",
-  "America/Anchorage": "AKST",
-  "Pacific/Honolulu": "HST",
-  "Antarctica/McMurdo": "NZST",
-  "Atlantic/Reykjavik": "GMT",
-  "Asia/Riyadh": "AST",
-  "America/Argentina/Buenos_Aires": "ART",
-  "America/Bogota": "COT",
-  "Africa/Nairobi": "EAT",
-  "Asia/Kuala_Lumpur": "MYT",
-  "Asia/Ho_Chi_Minh": "ICT",
-  "Europe/Warsaw": "CET",
-  "Europe/Prague": "CET",
-  "America/Phoenix": "MST",
-  "America/Indianapolis": "EST",
-  "Pacific/Fiji": "FJT",
-  "Asia/Colombo": "IST",
-  "Africa/Lagos": "WAT",
-  "America/Caracas": "VET",
-  "America/Halifax": "AST",
-  "Pacific/Tahiti": "TAHT",
-  "America/St_Johns": "NST",
-  "Europe/Bucharest": "EET",
-  "Europe/Helsinki": "EET",
-  "Europe/Kiev": "EET",
-  "Europe/Oslo": "CET",
-  "Europe/Stockholm": "CET",
-  "Europe/Lisbon": "WET",
-  "Asia/Beirut": "EET",
-  "Asia/Damascus": "EET",
-  "Asia/Jerusalem": "IST",
-  "Asia/Amman": "EET",
-  "America/Santiago": "CLT",
-  "America/Lima": "PET",
-  "America/Montevideo": "UYT",
-  "Asia/Tashkent": "UZT",
-  "Asia/Yerevan": "AMT",
-  "Asia/Baku": "AZT",
-  "Europe/Vilnius": "EET",
-  "Europe/Riga": "EET",
-  "Europe/Tallinn": "EET",
-  "Europe/Sofia": "EET",
-  "Africa/Casablanca": "WET",
-  "America/Guatemala": "CST",
-  "America/Panama": "EST",
-  "America/Costa_Rica": "CST",
-  "Pacific/Port_Moresby": "PGT",
-  "Asia/Makassar": "WITA",
-  "Asia/Vladivostok": "VLAT",
-  "Asia/Krasnoyarsk": "KRAT",
-  "Asia/Novosibirsk": "NOVT",
-  "Asia/Yakutsk": "YAKT",
-  "Asia/Sakhalin": "SAKT",
-  "Asia/Ulaanbaatar": "ULAT",
-  "Asia/Choibalsan": "CHOT",
-  "Asia/Omsk": "OMST",
-  "Asia/Kamchatka": "PETT",
-  "Pacific/Pago_Pago": "SST",
-  "Pacific/Guam": "ChST",
-  "Pacific/Saipan": "ChST",
-  "Pacific/Palau": "PWT",
-  "Pacific/Efate": "VUT",
-  "Pacific/Kosrae": "KOST",
-  "Pacific/Nauru": "NRT",
-  "Pacific/Tarawa": "GILT",
-  "Pacific/Enderbury": "PHOT",
-  "Pacific/Fakaofo": "TKT",
-  "Pacific/Chatham": "CHAST",
-  "Pacific/Tongatapu": "TOT",
-  "Pacific/Funafuti": "TVT",
-  "Pacific/Majuro": "MHT",
-  "Pacific/Kwajalein": "MHT",
-  "Pacific/Wake": "WAKT",
-  "Pacific/Wallis": "WFT"
-};
-
-// src/components/controls/view/DateViewClient.tsx
-import { jsx, jsxs } from "react/jsx-runtime";
-var DateViewClient = (props) => {
-  const [offsetMilliseconds, setOffsetMilliseconds] = useState(0);
-  const [timeZoneAbbr, setTimeZoneAbbr] = useState("");
-  useEffect(() => {
-    const now = /* @__PURE__ */ new Date();
-    const offsetMinutes = now.getTimezoneOffset();
-    setOffsetMilliseconds(offsetMinutes * 60 * 1e3);
-    setTimeZoneAbbr(
-      now.toLocaleTimeString("en", { timeZoneName: "short" }).split(" ")[2]
-    );
-  }, []);
-  const toUtcDate = (dateString) => {
-    const s = dateString.trim();
-    const iso = s.replace(" ", "T");
-    const utc = iso.endsWith("Z") || iso.includes("+") ? iso : iso + "Z";
-    return new Date(utc);
-  };
-  const toLocalDate = (utcDate) => {
-    return new Date(utcDate.getTime() - offsetMilliseconds);
-  };
-  const getRelativeTime = (dateString) => {
-    const now = /* @__PURE__ */ new Date();
-    const utcDate = toUtcDate(dateString);
-    const diffMs = now.getTime() - utcDate.getTime();
-    const diffSec = Math.floor(diffMs / 1e3);
-    const diffMin = Math.floor(diffSec / 60);
-    const diffHr = Math.floor(diffMin / 60);
-    const diffDay = Math.floor(diffHr / 24);
-    if (diffSec < 60) return "Just now";
-    if (diffMin < 60) return `${diffMin} minute${diffMin > 1 ? "s" : ""} ago`;
-    if (diffHr < 24) return `${diffHr} hour${diffHr > 1 ? "s" : ""} ago`;
-    if (diffDay < 7) return `${diffDay} day${diffDay > 1 ? "s" : ""} ago`;
-    return new Intl.DateTimeFormat("en", {
-      day: "2-digit",
-      month: "short",
-      year: "numeric"
-    }).format(toLocalDate(utcDate));
-  };
-  const parseAndFormatDate = (dateString, format) => {
-    if (format === "relative") {
-      return getRelativeTime(dateString);
-    }
-    const utcDate = toUtcDate(dateString);
-    const localDate = toLocalDate(utcDate);
-    switch (props.controlType) {
-      case "date":
-        return new Intl.DateTimeFormat("en", {
-          day: "2-digit",
-          month: "short",
-          year: "numeric"
-        }).format(localDate);
-      case "time":
-        return `${formatTime(localDate)} ${timeZoneAbbr} (${getTimePeriod(localDate)})`;
-      default:
-        return utcDate.getSeconds() === 0 ? new Intl.DateTimeFormat("en", {
-          day: "2-digit",
-          month: "short",
-          year: "numeric",
-          hour: "2-digit",
-          minute: "2-digit"
-        }).format(localDate) : new Intl.DateTimeFormat("en", {
-          day: "2-digit",
-          month: "short",
-          year: "numeric",
-          hour: "2-digit",
-          minute: "2-digit",
-          second: "2-digit"
-        }).format(localDate);
-    }
-  };
-  const formatTime = (localDate) => {
-    return localDate.getSeconds() === 0 ? new Intl.DateTimeFormat("en", {
-      hour: "2-digit",
-      minute: "2-digit"
-    }).format(localDate) : new Intl.DateTimeFormat("en", {
-      hour: "2-digit",
-      minute: "2-digit",
-      second: "2-digit"
-    }).format(localDate);
-  };
-  const getTimePeriod = (localDate) => {
-    const hours = localDate.getHours();
-    if (hours >= 5 && hours < 8) return "Early Morning";
-    if (hours >= 8 && hours < 12) return "Morning";
-    if (hours >= 12 && hours < 14) return "Noon";
-    if (hours >= 14 && hours < 17) return "Afternoon";
-    if (hours >= 17 && hours < 20) return "Evening";
-    if (hours >= 20 && hours < 22) return "Late Evening";
-    return "Night";
-  };
-  const getTimeZoneAbbreviation = (timeZone) => {
-    return timeZoneAbbreviations[timeZone] || timeZone;
-  };
-  let localDateTime = "";
-  try {
-    localDateTime = parseAndFormatDate(props.value, props.format);
-  } catch (error) {
-    console.error("Error parsing date:", props.value, error);
-  }
-  return /* @__PURE__ */ jsx(React.Fragment, { children: /* @__PURE__ */ jsxs("div", { className: "inline-flex flex-wrap gap-1", children: [
-    /* @__PURE__ */ jsx("span", { children: localDateTime }),
-    !props.format && props.controlType != "date" && /* @__PURE__ */ jsx("span", { children: timeZoneAbbr })
-  ] }) });
-};
-var DateViewClient_default = DateViewClient;
-export {
-  DateViewClient_default as default
-};