elseware-ui 2.34.0 → 2.35.0

package/dist/index.js

@@ -508,6 +508,107 @@ function getSafeRedirect(options = {}) {
     return fallback;
   }
 }
+function getErrorMessage(error) {
+  if (!error) {
+    return "Unknown configuration error";
+  }
+  if (error instanceof Error) {
+    return error.message || "Unknown configuration error";
+  }
+  if (typeof error === "string") {
+    return error;
+  }
+  try {
+    return JSON.stringify(error, null, 2);
+  } catch {
+    return "Unknown configuration error";
+  }
+}
+function getErrorStack(error) {
+  if (error instanceof Error) {
+    return error.stack;
+  }
+  return null;
+}
+function EnvErrorScreen({
+  error,
+  title = "Invalid Environment Configuration",
+  description = "The app could not start because one or more environment values are missing or invalid.",
+  footer,
+  showStack = false
+}) {
+  const message = getErrorMessage(error);
+  const stack = getErrorStack(error);
+  const lines = message.split("\n").filter(Boolean);
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "min-h-screen flex items-center justify-center bg-black text-white p-8", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "max-w-4xl w-full rounded-xl border border-red-500 bg-red-950/30 p-6 shadow-2xl shadow-red-950/40", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-5", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "text-2xl font-bold text-red-400 mb-2", children: title }),
+      description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-red-100/80", children: description })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rounded-lg border border-red-500/30 bg-black/40 p-4", children: /* @__PURE__ */ jsxRuntime.jsx("pre", { className: "overflow-auto text-sm whitespace-pre-wrap text-red-100", children: lines.length > 0 ? lines.join("\n") : "Unknown configuration error" }) }),
+    showStack && stack && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-4 rounded-lg border border-red-500/20 bg-black/30 p-4", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-2 text-xs font-semibold uppercase tracking-wide text-red-300", children: "Stack trace" }),
+      /* @__PURE__ */ jsxRuntime.jsx("pre", { className: "overflow-auto text-xs whitespace-pre-wrap text-red-100/70", children: stack })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-5 text-sm text-red-100/70", children: footer ?? /* @__PURE__ */ jsxRuntime.jsxs("p", { children: [
+      "Fix your ",
+      /* @__PURE__ */ jsxRuntime.jsx("code", { className: "text-red-200", children: ".env" }),
+      " values and restart the development server."
+    ] }) })
+  ] }) });
+}
+var EnvErrorScreen_default = EnvErrorScreen;
+function ConfigBootstrap({
+  config,
+  loadApp,
+  ErrorComponent = EnvErrorScreen_default,
+  LoadingComponent,
+  loadingFallback = null,
+  showStack = false
+}) {
+  const [RootApp, setRootApp] = React3.useState(null);
+  const [loadError, setLoadError] = React3.useState(null);
+  React3.useEffect(() => {
+    if (!config.isValid) {
+      return;
+    }
+    let mounted = true;
+    loadApp().then((module) => {
+      if (mounted) {
+        setRootApp(() => module.default);
+      }
+    }).catch((error) => {
+      if (mounted) {
+        setLoadError(error);
+      }
+    });
+    return () => {
+      mounted = false;
+    };
+  }, [config, loadApp]);
+  if (!config.isValid) {
+    return /* @__PURE__ */ jsxRuntime.jsx(ErrorComponent, { error: config.error, showStack });
+  }
+  if (loadError) {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      ErrorComponent,
+      {
+        error: loadError,
+        title: "Application Startup Error",
+        description: "The app configuration was valid, but the application failed while loading.",
+        showStack
+      }
+    );
+  }
+  if (!RootApp) {
+    if (LoadingComponent) {
+      return /* @__PURE__ */ jsxRuntime.jsx(LoadingComponent, {});
+    }
+    return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: loadingFallback });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(RootApp, {});
+}
+var ConfigBootstrap_default = ConfigBootstrap;
 var EUIContext = React3.createContext(null);
 var EUIProvider = ({
   config,
@@ -710,6 +811,77 @@ var checkboxVariants = {
   light: "checked:bg-eui-light-400 checked:border-eui-light-400 dark:checked:bg-gray-200 dark:checked:border-gray-200",
   dark: "checked:bg-eui-dark-500 checked:border-eui-dark-500 dark:checked:bg-eui-dark-300 dark:checked:border-eui-dark-300"
 };
+var spinnerSizes = {
+  xs: "w-4 h-4",
+  sm: "w-5 h-5",
+  md: "w-8 h-8",
+  lg: "w-12 h-12",
+  xl: "w-16 h-16"
+};
+var spinnerDotSizes = {
+  xs: "w-1 h-1",
+  sm: "w-1.5 h-1.5",
+  md: "w-2 h-2",
+  lg: "w-3 h-3",
+  xl: "w-4 h-4"
+};
+var spinnerBarSizes = {
+  xs: "w-0.5 h-3",
+  sm: "w-1 h-4",
+  md: "w-1.5 h-6",
+  lg: "w-2 h-8",
+  xl: "w-2.5 h-10"
+};
+var spinnerTextSizes = {
+  xs: "text-xs",
+  sm: "text-xs",
+  md: "text-sm",
+  lg: "text-base",
+  xl: "text-lg"
+};
+var spinnerStrokeSizes = {
+  xs: "border-2",
+  sm: "border-2",
+  md: "border-4",
+  lg: "border-4",
+  xl: "border-[5px]"
+};
+var spinnerVariants = {
+  default: "text-gray-500 dark:text-gray-300",
+  primary: "text-eui-primary-500 dark:text-eui-primary-400",
+  secondary: "text-eui-secondary-500 dark:text-eui-secondary-400",
+  success: "text-eui-success-500 dark:text-eui-success-400",
+  danger: "text-eui-danger-500 dark:text-eui-danger-400",
+  warning: "text-eui-warning-500 dark:text-eui-warning-400",
+  info: "text-eui-info-500 dark:text-eui-info-400",
+  light: "text-eui-light-500 dark:text-eui-light-300",
+  dark: "text-eui-dark-500 dark:text-eui-dark-300"
+};
+var spinnerTrackVariants = {
+  default: "border-gray-200 dark:border-gray-700",
+  primary: "border-eui-primary-500/20",
+  secondary: "border-eui-secondary-500/20",
+  success: "border-eui-success-500/20",
+  danger: "border-eui-danger-500/20",
+  warning: "border-eui-warning-500/20",
+  info: "border-eui-info-500/20",
+  light: "border-eui-light-500/20",
+  dark: "border-eui-dark-500/20"
+};
+var gridDotSizes = {
+  xs: "h-1 w-1",
+  sm: "h-1.5 w-1.5",
+  md: "h-2 w-2",
+  lg: "h-2.5 w-2.5",
+  xl: "h-3 w-3"
+};
+var waveItemSizes = {
+  xs: "h-3 w-0.5",
+  sm: "h-4 w-1",
+  md: "h-6 w-1.5",
+  lg: "h-8 w-2",
+  xl: "h-10 w-2.5"
+};
 var Avatar = ({
   alt,
   icon,
@@ -5039,6 +5211,227 @@ function ProgressBarRating({
   ] });
 }
 var ProgressBarRating_default = ProgressBarRating;
+var Backdrop = ({ children, styles }) => {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      className: classNames16__default.default({
+        "bg-black/75 top-0 bottom-0 left-0 right-0 z-50 fixed inset-0 flex items-center justify-center overflow-hidden": true,
+        [`${styles}`]: styles
+      }),
+      children
+    }
+  );
+};
+var Backdrop_default = Backdrop;
+var DEFAULT_SPINNER_TYPE = "border";
+var DEFAULT_SPINNER_SIZE = "md";
+var DEFAULT_SPINNER_VARIANT = "primary";
+var DEFAULT_SPINNER_ARIA_LABEL = "Loading";
+var SPINNER_DOT_COUNT = 3;
+var SPINNER_BAR_COUNT = 5;
+var SPINNER_GRID_COUNT = 9;
+var SPINNER_WAVE_COUNT = 5;
+function Spinner({
+  type = DEFAULT_SPINNER_TYPE,
+  variant = DEFAULT_SPINNER_VARIANT,
+  size = DEFAULT_SPINNER_SIZE,
+  label,
+  showLabel = true,
+  centered = false,
+  fullscreen = false,
+  overlay = false,
+  backdrop = true,
+  direction = "vertical",
+  className,
+  spinnerClassName,
+  labelClassName,
+  ariaLabel = DEFAULT_SPINNER_ARIA_LABEL,
+  ...rest
+}) {
+  const hasVisibleLabel = Boolean(label) && showLabel;
+  const spinnerColorClass = spinnerVariants[variant];
+  const baseSpinnerClasses = cn(
+    "eui-spinner",
+    "inline-flex shrink-0 items-center justify-center",
+    spinnerSizes[size],
+    spinnerColorClass,
+    spinnerClassName
+  );
+  const labelClasses = cn(
+    "eui-spinner-label",
+    "font-medium",
+    spinnerTextSizes[size],
+    spinnerColorClass,
+    labelClassName
+  );
+  const contentLayoutClasses = cn(
+    "eui-spinner-wrapper",
+    "inline-flex items-center justify-center",
+    direction === "vertical" ? "flex-col gap-3" : "flex-row gap-3",
+    spinnerColorClass
+  );
+  const wrapperClasses = cn(
+    contentLayoutClasses,
+    centered && !fullscreen && !overlay && "w-full py-6",
+    fullscreen && !backdrop && "fixed inset-0 z-50",
+    overlay && "absolute inset-0 z-40",
+    overlay && (backdrop ? "bg-white/70 backdrop-blur-sm dark:bg-black/60" : "bg-transparent"),
+    className
+  );
+  const renderSpinner = () => {
+    switch (type) {
+      case "ring":
+        return /* @__PURE__ */ jsxRuntime.jsx(
+          "span",
+          {
+            className: cn(
+              baseSpinnerClasses,
+              "eui-spinner-ring rounded-full",
+              spinnerStrokeSizes[size]
+            )
+          }
+        );
+      case "dots":
+        return /* @__PURE__ */ jsxRuntime.jsx(
+          "span",
+          {
+            className: cn(
+              baseSpinnerClasses,
+              "gap-1",
+              size === "xl" && "gap-2"
+            ),
+            children: Array.from({ length: SPINNER_DOT_COUNT }).map((_, index) => /* @__PURE__ */ jsxRuntime.jsx(
+              "span",
+              {
+                className: cn(
+                  "eui-spinner-dot rounded-full bg-current",
+                  spinnerDotSizes[size]
+                )
+              },
+              index
+            ))
+          }
+        );
+      case "bars":
+        return /* @__PURE__ */ jsxRuntime.jsx(
+          "span",
+          {
+            className: cn(
+              baseSpinnerClasses,
+              "gap-1",
+              size === "xl" && "gap-1.5"
+            ),
+            children: Array.from({ length: SPINNER_BAR_COUNT }).map((_, index) => /* @__PURE__ */ jsxRuntime.jsx(
+              "span",
+              {
+                className: cn(
+                  "eui-spinner-bar rounded-full bg-current",
+                  spinnerBarSizes[size]
+                )
+              },
+              index
+            ))
+          }
+        );
+      case "pulse":
+        return /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn(baseSpinnerClasses, "eui-spinner-pulse") });
+      case "orbit":
+        return /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn(baseSpinnerClasses, "eui-spinner-orbit") });
+      case "dualRing":
+        return /* @__PURE__ */ jsxRuntime.jsx(
+          "span",
+          {
+            className: cn(
+              baseSpinnerClasses,
+              "eui-spinner-dual-ring rounded-full"
+            )
+          }
+        );
+      case "ripple":
+        return /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn(baseSpinnerClasses, "eui-spinner-ripple") });
+      case "grid":
+        return /* @__PURE__ */ jsxRuntime.jsx(
+          "span",
+          {
+            className: cn(
+              baseSpinnerClasses,
+              "grid grid-cols-3",
+              size === "xs" || size === "sm" ? "gap-0.5" : "gap-1"
+            ),
+            children: Array.from({ length: SPINNER_GRID_COUNT }).map((_, index) => /* @__PURE__ */ jsxRuntime.jsx(
+              "span",
+              {
+                className: cn("eui-spinner-grid-dot", gridDotSizes[size])
+              },
+              index
+            ))
+          }
+        );
+      case "wave":
+        return /* @__PURE__ */ jsxRuntime.jsx(
+          "span",
+          {
+            className: cn(
+              baseSpinnerClasses,
+              "gap-1",
+              size === "xl" && "gap-1.5"
+            ),
+            children: Array.from({ length: SPINNER_WAVE_COUNT }).map((_, index) => /* @__PURE__ */ jsxRuntime.jsx(
+              "span",
+              {
+                className: cn("eui-spinner-wave-item", waveItemSizes[size])
+              },
+              index
+            ))
+          }
+        );
+      case "border":
+      default:
+        return /* @__PURE__ */ jsxRuntime.jsx(
+          "span",
+          {
+            className: cn(
+              baseSpinnerClasses,
+              "eui-spinner-border rounded-full",
+              spinnerStrokeSizes[size],
+              spinnerTrackVariants[variant]
+            )
+          }
+        );
+    }
+  };
+  const spinnerContent = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    renderSpinner(),
+    hasVisibleLabel && /* @__PURE__ */ jsxRuntime.jsx("span", { className: labelClasses, children: label }),
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: ariaLabel })
+  ] });
+  if (fullscreen && backdrop) {
+    return /* @__PURE__ */ jsxRuntime.jsx(Backdrop_default, { styles: cn("text-white", className), children: /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        ...rest,
+        role: "status",
+        "aria-live": "polite",
+        "aria-label": ariaLabel,
+        className: contentLayoutClasses,
+        children: spinnerContent
+      }
+    ) });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      ...rest,
+      role: "status",
+      "aria-live": "polite",
+      "aria-label": ariaLabel,
+      className: wrapperClasses,
+      children: spinnerContent
+    }
+  );
+}
+var Spinner_default = Spinner;
 function Table({
   title,
   columns,
@@ -5351,19 +5744,6 @@ var Form = ({
     }
   );
 };
-var Backdrop = ({ children, styles }) => {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "div",
-    {
-      className: classNames16__default.default({
-        "bg-black/75 top-0 bottom-0 left-0 right-0 z-50 fixed inset-0 flex items-center justify-center overflow-hidden": true,
-        [`${styles}`]: styles
-      }),
-      children
-    }
-  );
-};
-var Backdrop_default = Backdrop;
 var Skeleton = ({ children, className, ...rest }) => {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
@@ -5620,7 +6000,7 @@ var ShapeSwitch = () => {
     {
       value: currentShape,
       onChange: handleChange,
-      className: "\r\n          px-3 py-2 rounded-md border border-gray-300\r\n          bg-white dark:bg-gray-800\r\n          text-sm shadow-sm\r\n          focus:outline-none\r\n        ",
+      className: "\n          px-3 py-2 rounded-md border border-gray-300\n          bg-white dark:bg-gray-800\n          text-sm shadow-sm\n          focus:outline-none\n        ",
       children: Object.keys(Shape).map((shape) => /* @__PURE__ */ jsxRuntime.jsx("option", { value: shape, children: shape }, shape))
     }
   ) });
@@ -18614,7 +18994,7 @@ function MarkdownTOC({ title = "Table of Contents" }) {
     /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx(
       "h2",
       {
-        className: "\r\n            text-sm\r\n            font-semibold\r\n            uppercase\r\n            tracking-wide\r\n            text-gray-900\r\n            dark:text-gray-100\r\n          ",
+        className: "\n            text-sm\n            font-semibold\n            uppercase\n            tracking-wide\n            text-gray-900\n            dark:text-gray-100\n          ",
         children: title
       }
     ) }),
@@ -19944,7 +20324,7 @@ var GlowWrapper = ({
         /* @__PURE__ */ jsxRuntime.jsx(
           "span",
           {
-            className: "\r\n          pointer-events-none absolute inset-0 opacity-0 \r\n          group-hover:opacity-100 transition-opacity duration-300\r\n        ",
+            className: "\n          pointer-events-none absolute inset-0 opacity-0 \n          group-hover:opacity-100 transition-opacity duration-300\n        ",
             style: { background: "var(--glow-bg)" }
           }
         ),
@@ -21646,6 +22026,7 @@ exports.CloudinaryProvider = CloudinaryProvider;
 exports.CloudinaryVideo = CloudinaryVideo_default;
 exports.Code = Code;
 exports.CommentThread = CommentThread_default;
+exports.ConfigBootstrap = ConfigBootstrap_default;
 exports.Configurator = Configurator;
 exports.ConfiguratorError = ConfiguratorError;
 exports.Content = Content;
@@ -21661,6 +22042,7 @@ exports.Drawer = Drawer;
 exports.DrawerToggler = DrawerToggler_default;
 exports.EUIDevLayout = EUIDevLayout_default;
 exports.EUIProvider = EUIProvider;
+exports.EnvErrorScreen = EnvErrorScreen_default;
 exports.Flag = Flag;
 exports.Flex = Flex;
 exports.FlexCol = FlexCol_default;
@@ -21769,6 +22151,7 @@ exports.SidebarLayout = SidebarLayout_default;
 exports.SidemenuLayout = SidemenuLayout_default;
 exports.Skeleton = Skeleton;
 exports.Slider = Slider_default;
+exports.Spinner = Spinner_default;
 exports.StarRating = StarRating_default;
 exports.StarRatingDistribution = StarRatingDistribution_default;
 exports.StarRatingInput = StarRatingInput_default;