@omnitron-dev/prism 0.1.1

package/dist/blocks/index.js

@@ -0,0 +1,1712 @@
+import { Field, SearchInput } from '../chunk-LAEY5USO.js';
+import { useBoolean } from '../chunk-HO2GKTWJ.js';
+import '../chunk-77KIJLPP.js';
+import { createContext, useContext, useCallback, useMemo, useState, useEffect, useRef } from 'react';
+import Box2 from '@mui/material/Box';
+import Paper from '@mui/material/Paper';
+import Typography2 from '@mui/material/Typography';
+import IconButton2 from '@mui/material/IconButton';
+import Collapse from '@mui/material/Collapse';
+import Divider from '@mui/material/Divider';
+import Skeleton from '@mui/material/Skeleton';
+import Button2 from '@mui/material/Button';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import { useForm, FormProvider } from 'react-hook-form';
+import { zodResolver } from '@hookform/resolvers/zod';
+import { z } from 'zod';
+import Link from '@mui/material/Link';
+import Alert from '@mui/material/Alert';
+import CircularProgress from '@mui/material/CircularProgress';
+import InputAdornment from '@mui/material/InputAdornment';
+import Menu from '@mui/material/Menu';
+import MenuItem from '@mui/material/MenuItem';
+import ListItemIcon from '@mui/material/ListItemIcon';
+import ListItemText from '@mui/material/ListItemText';
+import Tooltip from '@mui/material/Tooltip';
+import LinearProgress from '@mui/material/LinearProgress';
+import { DataGrid, GridToolbarContainer, GridToolbarColumnsButton, GridToolbarDensitySelector, GridToolbarExport } from '@mui/x-data-grid';
+
+var collapseNoop = () => {
+};
+var DashboardBlockContext = createContext(null);
+function useDashboardBlockContext() {
+  const context = useContext(DashboardBlockContext);
+  if (!context) {
+    throw new Error("useDashboardBlockContext must be used within DashboardBlock");
+  }
+  return context;
+}
+var sizeConfig = {
+  small: {
+    headerPx: 2,
+    headerPy: 1.5,
+    contentPx: 2,
+    contentPy: 1.5,
+    titleVariant: "subtitle1",
+    subtitleVariant: "caption"
+  },
+  medium: {
+    headerPx: 2.5,
+    headerPy: 2,
+    contentPx: 2.5,
+    contentPy: 2,
+    titleVariant: "h6",
+    subtitleVariant: "body2"
+  },
+  large: {
+    headerPx: 3,
+    headerPy: 2.5,
+    contentPx: 3,
+    contentPy: 2.5,
+    titleVariant: "h5",
+    subtitleVariant: "body1"
+  }
+};
+function DashboardBlockHeader({ title, subtitle, icon, actions, sx }) {
+  const { collapsed, toggleCollapse, variant, size } = useDashboardBlockContext();
+  const config = sizeConfig[size];
+  return /* @__PURE__ */ jsxs(
+    Box2,
+    {
+      "data-testid": "prism-dashboard-block-header",
+      sx: [
+        {
+          display: "flex",
+          alignItems: "flex-start",
+          justifyContent: "space-between",
+          gap: 2,
+          px: config.headerPx,
+          py: config.headerPy
+        },
+        ...Array.isArray(sx) ? sx : [sx]
+      ],
+      children: [
+        /* @__PURE__ */ jsxs(Box2, { sx: { display: "flex", alignItems: "flex-start", gap: 1.5, flex: 1, minWidth: 0 }, children: [
+          icon && /* @__PURE__ */ jsx(
+            Box2,
+            {
+              sx: {
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "center",
+                mt: 0.25,
+                color: "primary.main"
+              },
+              children: icon
+            }
+          ),
+          /* @__PURE__ */ jsxs(Box2, { sx: { flex: 1, minWidth: 0 }, children: [
+            /* @__PURE__ */ jsx(Typography2, { variant: config.titleVariant, component: "h3", sx: { fontWeight: 600, lineHeight: 1.4 }, noWrap: true, children: title }),
+            subtitle && /* @__PURE__ */ jsx(Typography2, { variant: config.subtitleVariant, color: "text.secondary", sx: { mt: 0.25 }, children: subtitle })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs(Box2, { sx: { display: "flex", alignItems: "center", gap: 0.5, flexShrink: 0 }, children: [
+          actions,
+          collapsed !== void 0 && /* @__PURE__ */ jsx(
+            IconButton2,
+            {
+              size: "small",
+              onClick: toggleCollapse,
+              "aria-expanded": !collapsed,
+              "aria-label": collapsed ? "Expand block" : "Collapse block",
+              "data-testid": "prism-dashboard-block-collapse",
+              children: /* @__PURE__ */ jsx(ChevronIcon, { direction: collapsed ? "down" : "up" })
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
+function DashboardBlockContent({ children, disablePadding = false, sx }) {
+  const { collapsed, loading, error, size } = useDashboardBlockContext();
+  const config = sizeConfig[size];
+  return /* @__PURE__ */ jsx(Collapse, { in: !collapsed, timeout: "auto", children: /* @__PURE__ */ jsx(
+    Box2,
+    {
+      "data-testid": "prism-dashboard-block-content",
+      sx: [
+        {
+          ...!disablePadding && {
+            px: config.contentPx,
+            py: config.contentPy
+          }
+        },
+        ...Array.isArray(sx) ? sx : [sx]
+      ],
+      children
+    }
+  ) });
+}
+function DashboardBlockFooter({ children, divider = true, sx }) {
+  const { collapsed, size } = useDashboardBlockContext();
+  const config = sizeConfig[size];
+  if (collapsed) return null;
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    divider && /* @__PURE__ */ jsx(Divider, {}),
+    /* @__PURE__ */ jsx(
+      Box2,
+      {
+        "data-testid": "prism-dashboard-block-footer",
+        sx: [
+          {
+            px: config.contentPx,
+            py: 1.5
+          },
+          ...Array.isArray(sx) ? sx : [sx]
+        ],
+        children
+      }
+    )
+  ] });
+}
+function LoadingState({ rows = 3, size }) {
+  const config = sizeConfig[size];
+  return /* @__PURE__ */ jsx(Box2, { sx: { px: config.contentPx, py: config.contentPy }, children: Array.from({ length: rows }).map((_, i) => /* @__PURE__ */ jsx(Skeleton, { variant: "text", animation: "wave", sx: { height: 20, mb: 1 } }, i)) });
+}
+function ErrorState({ message = "Failed to load data", onRetry, size }) {
+  const config = sizeConfig[size];
+  return /* @__PURE__ */ jsxs(
+    Box2,
+    {
+      sx: {
+        px: config.contentPx,
+        py: config.contentPy,
+        textAlign: "center"
+      },
+      children: [
+        /* @__PURE__ */ jsx(Typography2, { color: "error", variant: "body2", sx: { mb: onRetry ? 1.5 : 0 }, children: message }),
+        onRetry && /* @__PURE__ */ jsx(Button2, { size: "small", onClick: onRetry, children: "Retry" })
+      ]
+    }
+  );
+}
+function DashboardBlock({
+  title,
+  subtitle,
+  icon,
+  actions,
+  children,
+  footer,
+  variant = "default",
+  size = "medium",
+  loading = false,
+  loadingConfig,
+  error = false,
+  errorConfig,
+  collapsible = false,
+  defaultCollapsed = false,
+  collapsed: controlledCollapsed,
+  onCollapseChange,
+  disablePadding = false,
+  footerDivider = true,
+  sx,
+  slotProps
+}) {
+  const uncontrolledCollapse = useBoolean(defaultCollapsed);
+  const isControlled = controlledCollapsed !== void 0;
+  const collapsed = isControlled ? controlledCollapsed : uncontrolledCollapse.value;
+  const handleToggleCollapse = useCallback(() => {
+    if (isControlled) {
+      onCollapseChange?.(!controlledCollapsed);
+    } else {
+      uncontrolledCollapse.onToggle();
+    }
+  }, [isControlled, controlledCollapsed, onCollapseChange, uncontrolledCollapse]);
+  const handleSetCollapsed = useCallback(
+    (value) => {
+      if (isControlled) {
+        onCollapseChange?.(value);
+      } else {
+        uncontrolledCollapse.setValue(value);
+      }
+    },
+    [isControlled, onCollapseChange, uncontrolledCollapse]
+  );
+  const contextValue = useMemo(
+    () => ({
+      collapsed: collapsible ? collapsed : false,
+      toggleCollapse: collapsible ? handleToggleCollapse : collapseNoop,
+      setCollapsed: collapsible ? handleSetCollapsed : collapseNoop,
+      loading,
+      error,
+      variant,
+      size
+    }),
+    [collapsed, collapsible, handleToggleCollapse, handleSetCollapsed, loading, error, variant, size]
+  );
+  const paperVariant = variant === "outlined" ? "outlined" : "elevation";
+  const paperElevation = variant === "default" ? 1 : 0;
+  return /* @__PURE__ */ jsx(DashboardBlockContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxs(
+    Paper,
+    {
+      "data-testid": "prism-dashboard-block",
+      variant: paperVariant,
+      elevation: paperElevation,
+      sx: [
+        {
+          overflow: "hidden",
+          ...variant === "filled" && {
+            bgcolor: "action.hover"
+          }
+        },
+        ...Array.isArray(sx) ? sx : [sx]
+      ],
+      children: [
+        title && /* @__PURE__ */ jsx(
+          DashboardBlockHeader,
+          {
+            title,
+            subtitle,
+            icon,
+            actions,
+            ...slotProps?.header
+          }
+        ),
+        title && /* @__PURE__ */ jsx(Divider, {}),
+        /* @__PURE__ */ jsx(Box2, { "aria-live": "polite", "aria-busy": loading, children: loading ? loadingConfig?.loadingComponent ?? /* @__PURE__ */ jsx(LoadingState, { rows: loadingConfig?.skeletonRows ?? 3, size }) : error ? errorConfig?.errorComponent ?? /* @__PURE__ */ jsx(ErrorState, { message: errorConfig?.message, onRetry: errorConfig?.onRetry, size }) : children ? /* @__PURE__ */ jsx(DashboardBlockContent, { disablePadding, ...slotProps?.content, children }) : null }),
+        footer && !loading && !error && /* @__PURE__ */ jsx(DashboardBlockFooter, { divider: footerDivider, ...slotProps?.footer, children: footer })
+      ]
+    }
+  ) });
+}
+function ChevronIcon({ direction }) {
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      width: "20",
+      height: "20",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: 2,
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      "aria-hidden": "true",
+      style: {
+        transform: direction === "up" ? "rotate(180deg)" : void 0,
+        transition: "transform 0.2s ease"
+      },
+      children: /* @__PURE__ */ jsx("polyline", { points: "6 9 12 15 18 9" })
+    }
+  );
+}
+function useDashboardBlock(options = {}) {
+  const { defaultCollapsed = false, defaultLoading = false, onRetry } = options;
+  const [state, setState] = useState({
+    collapsed: defaultCollapsed,
+    loading: defaultLoading,
+    error: false,
+    errorMessage: void 0
+  });
+  const toggleCollapse = useCallback(() => {
+    setState((prev) => ({ ...prev, collapsed: !prev.collapsed }));
+  }, []);
+  const setCollapsed = useCallback((collapsed) => {
+    setState((prev) => ({ ...prev, collapsed }));
+  }, []);
+  const expand = useCallback(() => {
+    setState((prev) => ({ ...prev, collapsed: false }));
+  }, []);
+  const collapse = useCallback(() => {
+    setState((prev) => ({ ...prev, collapsed: true }));
+  }, []);
+  const setLoading = useCallback((loading) => {
+    setState((prev) => ({ ...prev, loading }));
+  }, []);
+  const setError = useCallback((error, errorMessage) => {
+    setState((prev) => ({ ...prev, error, errorMessage, loading: false }));
+  }, []);
+  const clearError = useCallback(() => {
+    setState((prev) => ({ ...prev, error: false, errorMessage: void 0 }));
+  }, []);
+  const reset = useCallback(() => {
+    setState({
+      collapsed: defaultCollapsed,
+      loading: defaultLoading,
+      error: false,
+      errorMessage: void 0
+    });
+  }, [defaultCollapsed, defaultLoading]);
+  const actions = useMemo(
+    () => ({
+      toggleCollapse,
+      setCollapsed,
+      expand,
+      collapse,
+      setLoading,
+      setError,
+      clearError,
+      reset
+    }),
+    [toggleCollapse, setCollapsed, expand, collapse, setLoading, setError, clearError, reset]
+  );
+  const blockProps = useMemo(
+    () => ({
+      collapsed: state.collapsed,
+      onCollapseChange: setCollapsed,
+      loading: state.loading,
+      error: state.error,
+      errorConfig: state.error ? {
+        message: state.errorMessage,
+        onRetry
+      } : void 0
+    }),
+    [state.collapsed, state.loading, state.error, state.errorMessage, setCollapsed, onRetry]
+  );
+  return {
+    state,
+    actions,
+    blockProps
+  };
+}
+function EyeIcon() {
+  return /* @__PURE__ */ jsxs("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
+    /* @__PURE__ */ jsx("path", { d: "M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z" }),
+    /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "3" })
+  ] });
+}
+function EyeOffIcon() {
+  return /* @__PURE__ */ jsxs("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
+    /* @__PURE__ */ jsx("path", { d: "M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24" }),
+    /* @__PURE__ */ jsx("line", { x1: "1", y1: "1", x2: "23", y2: "23" })
+  ] });
+}
+var UNSAFE_ERROR_PATTERNS = [
+  /at\s+\w+\s*\(/i,
+  // stack trace frames
+  /\b(ECONNREFUSED|ETIMEDOUT|ENOTFOUND)\b/,
+  // Node.js system errors
+  /\b(SELECT|INSERT|UPDATE|DELETE)\b.*\bFROM\b/i,
+  // SQL fragments
+  /\/[a-z_-]+\/[a-z_-]+\//i,
+  // Unix file paths
+  /[A-Z]:\\[^\s]+/,
+  // Windows file paths
+  /password|secret|token|key/i
+  // sensitive keywords in error context
+];
+var DEFAULT_AUTH_ERROR = "An error occurred. Please try again.";
+function sanitizeErrorMessage(err, fallback = DEFAULT_AUTH_ERROR) {
+  if (!(err instanceof Error)) return fallback;
+  const message = err.message;
+  for (const pattern of UNSAFE_ERROR_PATTERNS) {
+    if (pattern.test(message)) return fallback;
+  }
+  if (message.length > 200) return fallback;
+  return message;
+}
+var defaultLoginSchema = z.object({
+  email: z.string().email("Please enter a valid email"),
+  password: z.string().min(1, "Password is required"),
+  rememberMe: z.boolean().optional()
+});
+var createRegisterSchema = (minPasswordLength = 8, requireTerms = true) => z.object({
+  email: z.string().email("Please enter a valid email"),
+  password: z.string().min(minPasswordLength, `Password must be at least ${minPasswordLength} characters`),
+  confirmPassword: z.string(),
+  firstName: z.string().optional(),
+  lastName: z.string().optional(),
+  acceptTerms: requireTerms ? z.boolean().refine((val) => val === true, { message: "You must accept the terms" }) : z.boolean().optional()
+}).refine((data) => data.password === data.confirmPassword, {
+  message: "Passwords do not match",
+  path: ["confirmPassword"]
+});
+var defaultForgotPasswordSchema = z.object({
+  email: z.string().email("Please enter a valid email")
+});
+var createResetPasswordSchema = (minPasswordLength = 8) => z.object({
+  password: z.string().min(minPasswordLength, `Password must be at least ${minPasswordLength} characters`),
+  confirmPassword: z.string()
+}).refine((data) => data.password === data.confirmPassword, {
+  message: "Passwords do not match",
+  path: ["confirmPassword"]
+});
+var createVerifyCodeSchema = (codeLength = 6) => z.object({
+  code: z.string().length(codeLength, `Code must be ${codeLength} digits`)
+});
+function LoginForm({
+  onSubmit,
+  loading = false,
+  disabled = false,
+  showRememberMe = true,
+  showForgotPassword = true,
+  onForgotPassword,
+  showSocialLogin = false,
+  socialProviders = [],
+  schema,
+  labels = {},
+  sx,
+  slotProps
+}) {
+  const [showPassword, setShowPassword] = useState(false);
+  const [error, setError] = useState(null);
+  const methods = useForm({
+    resolver: zodResolver(schema ?? defaultLoginSchema),
+    defaultValues: {
+      email: "",
+      password: "",
+      rememberMe: false
+    }
+  });
+  const handleSubmit = methods.handleSubmit(async (data) => {
+    setError(null);
+    try {
+      await onSubmit(data);
+    } catch (err) {
+      setError(sanitizeErrorMessage(err));
+    }
+  });
+  return /* @__PURE__ */ jsx(FormProvider, { ...methods, children: /* @__PURE__ */ jsxs(
+    Box2,
+    {
+      component: "form",
+      onSubmit: handleSubmit,
+      sx: [{ display: "flex", flexDirection: "column", gap: 2.5 }, ...Array.isArray(sx) ? sx : [sx]],
+      ...slotProps?.wrapper,
+      children: [
+        error && /* @__PURE__ */ jsx(Alert, { severity: "error", onClose: () => setError(null), children: error }),
+        /* @__PURE__ */ jsx(
+          Field.Text,
+          {
+            name: "email",
+            label: labels.email ?? "Email",
+            type: "email",
+            autoComplete: "email",
+            disabled: disabled || loading,
+            ...slotProps?.textField
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Field.Text,
+          {
+            name: "password",
+            label: labels.password ?? "Password",
+            type: showPassword ? "text" : "password",
+            autoComplete: "current-password",
+            disabled: disabled || loading,
+            slotProps: {
+              input: {
+                endAdornment: /* @__PURE__ */ jsx(InputAdornment, { position: "end", children: /* @__PURE__ */ jsx(
+                  IconButton2,
+                  {
+                    onClick: () => setShowPassword(!showPassword),
+                    edge: "end",
+                    "aria-label": showPassword ? "Hide password" : "Show password",
+                    children: showPassword ? /* @__PURE__ */ jsx(EyeOffIcon, {}) : /* @__PURE__ */ jsx(EyeIcon, {})
+                  }
+                ) })
+              }
+            },
+            ...slotProps?.textField
+          }
+        ),
+        (showRememberMe || showForgotPassword) && /* @__PURE__ */ jsxs(Box2, { sx: { display: "flex", alignItems: "center", justifyContent: "space-between" }, children: [
+          showRememberMe && /* @__PURE__ */ jsx(
+            Field.Checkbox,
+            {
+              name: "rememberMe",
+              label: labels.rememberMe ?? "Remember me",
+              disabled: disabled || loading
+            }
+          ),
+          showForgotPassword && /* @__PURE__ */ jsx(
+            Link,
+            {
+              component: "button",
+              type: "button",
+              variant: "body2",
+              onClick: onForgotPassword,
+              sx: { textDecoration: "none" },
+              children: labels.forgotPassword ?? "Forgot password?"
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx(
+          Button2,
+          {
+            type: "submit",
+            variant: "contained",
+            size: "large",
+            fullWidth: true,
+            disabled: disabled || loading,
+            ...slotProps?.submitButton,
+            children: loading ? /* @__PURE__ */ jsx(CircularProgress, { size: 24, color: "inherit" }) : labels.submit ?? "Sign In"
+          }
+        ),
+        showSocialLogin && socialProviders.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(Divider, { children: /* @__PURE__ */ jsx(Typography2, { variant: "body2", color: "text.secondary", children: labels.socialDivider ?? "or continue with" }) }),
+          /* @__PURE__ */ jsx(Box2, { sx: { display: "flex", gap: 1.5, justifyContent: "center" }, children: socialProviders.map((provider) => /* @__PURE__ */ jsx(
+            IconButton2,
+            {
+              onClick: provider.onClick,
+              disabled: disabled || loading,
+              sx: {
+                border: 1,
+                borderColor: "divider",
+                borderRadius: 1,
+                p: 1
+              },
+              "aria-label": `Sign in with ${provider.name}`,
+              children: provider.icon
+            },
+            provider.id
+          )) })
+        ] })
+      ]
+    }
+  ) });
+}
+function RegisterForm({
+  onSubmit,
+  loading = false,
+  disabled = false,
+  showNameFields = false,
+  requireTerms = true,
+  onTermsClick,
+  onPrivacyClick,
+  minPasswordLength = 8,
+  schema,
+  labels = {},
+  sx,
+  slotProps
+}) {
+  const [showPassword, setShowPassword] = useState(false);
+  const [showConfirmPassword, setShowConfirmPassword] = useState(false);
+  const [error, setError] = useState(null);
+  const methods = useForm({
+    resolver: zodResolver(
+      schema ?? createRegisterSchema(minPasswordLength, requireTerms)
+    ),
+    defaultValues: {
+      email: "",
+      password: "",
+      confirmPassword: "",
+      firstName: "",
+      lastName: "",
+      acceptTerms: false
+    }
+  });
+  const handleSubmit = methods.handleSubmit(async (data) => {
+    setError(null);
+    try {
+      await onSubmit(data);
+    } catch (err) {
+      setError(sanitizeErrorMessage(err));
+    }
+  });
+  return /* @__PURE__ */ jsx(FormProvider, { ...methods, children: /* @__PURE__ */ jsxs(
+    Box2,
+    {
+      component: "form",
+      onSubmit: handleSubmit,
+      sx: [{ display: "flex", flexDirection: "column", gap: 2.5 }, ...Array.isArray(sx) ? sx : [sx]],
+      ...slotProps?.wrapper,
+      children: [
+        error && /* @__PURE__ */ jsx(Alert, { severity: "error", onClose: () => setError(null), children: error }),
+        showNameFields && /* @__PURE__ */ jsxs(Box2, { sx: { display: "flex", gap: 2 }, children: [
+          /* @__PURE__ */ jsx(
+            Field.Text,
+            {
+              name: "firstName",
+              label: labels.firstName ?? "First Name",
+              autoComplete: "given-name",
+              disabled: disabled || loading,
+              ...slotProps?.textField
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Field.Text,
+            {
+              name: "lastName",
+              label: labels.lastName ?? "Last Name",
+              autoComplete: "family-name",
+              disabled: disabled || loading,
+              ...slotProps?.textField
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx(
+          Field.Text,
+          {
+            name: "email",
+            label: labels.email ?? "Email",
+            type: "email",
+            autoComplete: "email",
+            disabled: disabled || loading,
+            ...slotProps?.textField
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Field.Text,
+          {
+            name: "password",
+            label: labels.password ?? "Password",
+            type: showPassword ? "text" : "password",
+            autoComplete: "new-password",
+            disabled: disabled || loading,
+            helperText: `At least ${minPasswordLength} characters`,
+            slotProps: {
+              input: {
+                endAdornment: /* @__PURE__ */ jsx(InputAdornment, { position: "end", children: /* @__PURE__ */ jsx(
+                  IconButton2,
+                  {
+                    onClick: () => setShowPassword(!showPassword),
+                    edge: "end",
+                    "aria-label": showPassword ? "Hide password" : "Show password",
+                    children: showPassword ? /* @__PURE__ */ jsx(EyeOffIcon, {}) : /* @__PURE__ */ jsx(EyeIcon, {})
+                  }
+                ) })
+              }
+            },
+            ...slotProps?.textField
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Field.Text,
+          {
+            name: "confirmPassword",
+            label: labels.confirmPassword ?? "Confirm Password",
+            type: showConfirmPassword ? "text" : "password",
+            autoComplete: "new-password",
+            disabled: disabled || loading,
+            slotProps: {
+              input: {
+                endAdornment: /* @__PURE__ */ jsx(InputAdornment, { position: "end", children: /* @__PURE__ */ jsx(
+                  IconButton2,
+                  {
+                    onClick: () => setShowConfirmPassword(!showConfirmPassword),
+                    edge: "end",
+                    "aria-label": showConfirmPassword ? "Hide password" : "Show password",
+                    children: showConfirmPassword ? /* @__PURE__ */ jsx(EyeOffIcon, {}) : /* @__PURE__ */ jsx(EyeIcon, {})
+                  }
+                ) })
+              }
+            },
+            ...slotProps?.textField
+          }
+        ),
+        requireTerms && /* @__PURE__ */ jsx(
+          Field.Checkbox,
+          {
+            name: "acceptTerms",
+            disabled: disabled || loading,
+            label: /* @__PURE__ */ jsxs(Typography2, { variant: "body2", component: "span", children: [
+              labels.acceptTerms ?? "I agree to the ",
+              /* @__PURE__ */ jsx(Link, { component: "button", type: "button", onClick: onTermsClick, children: labels.termsLink ?? "Terms of Service" }),
+              " and ",
+              /* @__PURE__ */ jsx(Link, { component: "button", type: "button", onClick: onPrivacyClick, children: labels.privacyLink ?? "Privacy Policy" })
+            ] })
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Button2,
+          {
+            type: "submit",
+            variant: "contained",
+            size: "large",
+            fullWidth: true,
+            disabled: disabled || loading,
+            ...slotProps?.submitButton,
+            children: loading ? /* @__PURE__ */ jsx(CircularProgress, { size: 24, color: "inherit" }) : labels.submit ?? "Create Account"
+          }
+        )
+      ]
+    }
+  ) });
+}
+function ForgotPasswordForm({
+  onSubmit,
+  loading = false,
+  disabled = false,
+  onBackToLogin,
+  schema,
+  labels = {},
+  sx,
+  slotProps
+}) {
+  const [error, setError] = useState(null);
+  const [success, setSuccess] = useState(false);
+  const methods = useForm({
+    resolver: zodResolver(schema ?? defaultForgotPasswordSchema),
+    defaultValues: {
+      email: ""
+    }
+  });
+  const handleSubmit = methods.handleSubmit(async (data) => {
+    setError(null);
+    try {
+      await onSubmit(data);
+      setSuccess(true);
+    } catch (err) {
+      setError(sanitizeErrorMessage(err));
+    }
+  });
+  if (success) {
+    return /* @__PURE__ */ jsxs(Box2, { sx: { textAlign: "center" }, children: [
+      /* @__PURE__ */ jsx(Typography2, { variant: "h6", gutterBottom: true, children: "Check your email" }),
+      /* @__PURE__ */ jsx(Typography2, { variant: "body2", color: "text.secondary", sx: { mb: 3 }, children: "We sent a password reset link to your email address." }),
+      onBackToLogin && /* @__PURE__ */ jsx(Button2, { variant: "text", onClick: onBackToLogin, children: labels.backToLogin ?? "Back to login" })
+    ] });
+  }
+  return /* @__PURE__ */ jsx(FormProvider, { ...methods, children: /* @__PURE__ */ jsxs(
+    Box2,
+    {
+      component: "form",
+      onSubmit: handleSubmit,
+      sx: [{ display: "flex", flexDirection: "column", gap: 2.5 }, ...Array.isArray(sx) ? sx : [sx]],
+      ...slotProps?.wrapper,
+      children: [
+        /* @__PURE__ */ jsxs(Box2, { sx: { textAlign: "center", mb: 1 }, children: [
+          /* @__PURE__ */ jsx(Typography2, { variant: "h6", gutterBottom: true, children: labels.title ?? "Forgot password?" }),
+          /* @__PURE__ */ jsx(Typography2, { variant: "body2", color: "text.secondary", children: labels.description ?? "Enter your email and we'll send you a reset link." })
+        ] }),
+        error && /* @__PURE__ */ jsx(Alert, { severity: "error", onClose: () => setError(null), children: error }),
+        /* @__PURE__ */ jsx(
+          Field.Text,
+          {
+            name: "email",
+            label: labels.email ?? "Email",
+            type: "email",
+            autoComplete: "email",
+            disabled: disabled || loading,
+            ...slotProps?.textField
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Button2,
+          {
+            type: "submit",
+            variant: "contained",
+            size: "large",
+            fullWidth: true,
+            disabled: disabled || loading,
+            ...slotProps?.submitButton,
+            children: loading ? /* @__PURE__ */ jsx(CircularProgress, { size: 24, color: "inherit" }) : labels.submit ?? "Send Reset Link"
+          }
+        ),
+        onBackToLogin && /* @__PURE__ */ jsx(Button2, { variant: "text", onClick: onBackToLogin, disabled: loading, children: labels.backToLogin ?? "Back to login" })
+      ]
+    }
+  ) });
+}
+function ResetPasswordForm({
+  onSubmit,
+  loading = false,
+  disabled = false,
+  minPasswordLength = 8,
+  schema,
+  labels = {},
+  sx,
+  slotProps
+}) {
+  const [showPassword, setShowPassword] = useState(false);
+  const [showConfirmPassword, setShowConfirmPassword] = useState(false);
+  const [error, setError] = useState(null);
+  const methods = useForm({
+    resolver: zodResolver(
+      schema ?? createResetPasswordSchema(minPasswordLength)
+    ),
+    defaultValues: {
+      password: "",
+      confirmPassword: ""
+    }
+  });
+  const handleSubmit = methods.handleSubmit(async (data) => {
+    setError(null);
+    try {
+      await onSubmit(data);
+    } catch (err) {
+      setError(sanitizeErrorMessage(err));
+    }
+  });
+  return /* @__PURE__ */ jsx(FormProvider, { ...methods, children: /* @__PURE__ */ jsxs(
+    Box2,
+    {
+      component: "form",
+      onSubmit: handleSubmit,
+      sx: [{ display: "flex", flexDirection: "column", gap: 2.5 }, ...Array.isArray(sx) ? sx : [sx]],
+      ...slotProps?.wrapper,
+      children: [
+        /* @__PURE__ */ jsxs(Box2, { sx: { textAlign: "center", mb: 1 }, children: [
+          /* @__PURE__ */ jsx(Typography2, { variant: "h6", gutterBottom: true, children: labels.title ?? "Set new password" }),
+          /* @__PURE__ */ jsx(Typography2, { variant: "body2", color: "text.secondary", children: labels.description ?? "Create a new password for your account." })
+        ] }),
+        error && /* @__PURE__ */ jsx(Alert, { severity: "error", onClose: () => setError(null), children: error }),
+        /* @__PURE__ */ jsx(
+          Field.Text,
+          {
+            name: "password",
+            label: labels.password ?? "New Password",
+            type: showPassword ? "text" : "password",
+            autoComplete: "new-password",
+            disabled: disabled || loading,
+            helperText: `At least ${minPasswordLength} characters`,
+            slotProps: {
+              input: {
+                endAdornment: /* @__PURE__ */ jsx(InputAdornment, { position: "end", children: /* @__PURE__ */ jsx(
+                  IconButton2,
+                  {
+                    onClick: () => setShowPassword(!showPassword),
+                    edge: "end",
+                    "aria-label": showPassword ? "Hide password" : "Show password",
+                    children: showPassword ? /* @__PURE__ */ jsx(EyeOffIcon, {}) : /* @__PURE__ */ jsx(EyeIcon, {})
+                  }
+                ) })
+              }
+            },
+            ...slotProps?.textField
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Field.Text,
+          {
+            name: "confirmPassword",
+            label: labels.confirmPassword ?? "Confirm Password",
+            type: showConfirmPassword ? "text" : "password",
+            autoComplete: "new-password",
+            disabled: disabled || loading,
+            slotProps: {
+              input: {
+                endAdornment: /* @__PURE__ */ jsx(InputAdornment, { position: "end", children: /* @__PURE__ */ jsx(
+                  IconButton2,
+                  {
+                    onClick: () => setShowConfirmPassword(!showConfirmPassword),
+                    edge: "end",
+                    "aria-label": showConfirmPassword ? "Hide password" : "Show password",
+                    children: showConfirmPassword ? /* @__PURE__ */ jsx(EyeOffIcon, {}) : /* @__PURE__ */ jsx(EyeIcon, {})
+                  }
+                ) })
+              }
+            },
+            ...slotProps?.textField
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Button2,
+          {
+            type: "submit",
+            variant: "contained",
+            size: "large",
+            fullWidth: true,
+            disabled: disabled || loading,
+            ...slotProps?.submitButton,
+            children: loading ? /* @__PURE__ */ jsx(CircularProgress, { size: 24, color: "inherit" }) : labels.submit ?? "Reset Password"
+          }
+        )
+      ]
+    }
+  ) });
+}
+function VerifyCodeForm({
+  onSubmit,
+  loading = false,
+  disabled = false,
+  codeLength = 6,
+  onResendCode,
+  resendCooldown = 60,
+  schema,
+  labels = {},
+  sx,
+  slotProps
+}) {
+  const [error, setError] = useState(null);
+  const [cooldown, setCooldown] = useState(0);
+  const methods = useForm({
+    resolver: zodResolver(schema ?? createVerifyCodeSchema(codeLength)),
+    defaultValues: {
+      code: ""
+    }
+  });
+  useEffect(() => {
+    if (cooldown > 0) {
+      const timer = setTimeout(() => setCooldown(cooldown - 1), 1e3);
+      return () => clearTimeout(timer);
+    }
+    return void 0;
+  }, [cooldown]);
+  const handleResendCode = useCallback(async () => {
+    if (cooldown > 0 || !onResendCode) return;
+    try {
+      await onResendCode();
+      setCooldown(resendCooldown);
+    } catch (err) {
+      setError(sanitizeErrorMessage(err, "Failed to resend code"));
+    }
+  }, [cooldown, onResendCode, resendCooldown]);
+  const handleSubmit = methods.handleSubmit(async (data) => {
+    setError(null);
+    try {
+      await onSubmit(data);
+    } catch (err) {
+      setError(sanitizeErrorMessage(err));
+    }
+  });
+  return /* @__PURE__ */ jsx(FormProvider, { ...methods, children: /* @__PURE__ */ jsxs(
+    Box2,
+    {
+      component: "form",
+      onSubmit: handleSubmit,
+      sx: [
+        { display: "flex", flexDirection: "column", gap: 2.5, alignItems: "center" },
+        ...Array.isArray(sx) ? sx : [sx]
+      ],
+      ...slotProps?.wrapper,
+      children: [
+        /* @__PURE__ */ jsxs(Box2, { sx: { textAlign: "center", mb: 1 }, children: [
+          /* @__PURE__ */ jsx(Typography2, { variant: "h6", gutterBottom: true, children: labels.title ?? "Enter verification code" }),
+          /* @__PURE__ */ jsx(Typography2, { variant: "body2", color: "text.secondary", children: labels.description ?? "We sent a verification code to your email." })
+        ] }),
+        error && /* @__PURE__ */ jsx(Alert, { severity: "error", onClose: () => setError(null), sx: { width: "100%" }, children: error }),
+        /* @__PURE__ */ jsx(Field.Code, { name: "code", length: codeLength, autoFocus: true, disabled: disabled || loading }),
+        /* @__PURE__ */ jsx(
+          Button2,
+          {
+            type: "submit",
+            variant: "contained",
+            size: "large",
+            fullWidth: true,
+            disabled: disabled || loading,
+            ...slotProps?.submitButton,
+            children: loading ? /* @__PURE__ */ jsx(CircularProgress, { size: 24, color: "inherit" }) : labels.submit ?? "Verify"
+          }
+        ),
+        onResendCode && /* @__PURE__ */ jsx(Box2, { sx: { textAlign: "center" }, children: cooldown > 0 ? /* @__PURE__ */ jsxs(Typography2, { variant: "body2", color: "text.secondary", children: [
+          labels.resendIn ?? "Resend code in",
+          " ",
+          cooldown,
+          "s"
+        ] }) : /* @__PURE__ */ jsx(Link, { component: "button", type: "button", variant: "body2", onClick: handleResendCode, disabled: loading, children: labels.resendCode ?? "Didn't receive the code? Resend" }) })
+      ]
+    }
+  ) });
+}
+var AuthBlock = {
+  Login: LoginForm,
+  Register: RegisterForm,
+  ForgotPassword: ForgotPasswordForm,
+  ResetPassword: ResetPasswordForm,
+  VerifyCode: VerifyCodeForm
+};
+function AuthGuard({
+  children,
+  useAuth,
+  loadingComponent = null,
+  onUnauthenticated,
+  unauthenticatedComponent = null
+}) {
+  const { isAuthenticated, isLoading } = useAuth();
+  const [checked, setChecked] = useState(false);
+  useEffect(() => {
+    if (!isLoading) {
+      if (!isAuthenticated) {
+        onUnauthenticated?.();
+      }
+      setChecked(true);
+    }
+  }, [isAuthenticated, isLoading, onUnauthenticated]);
+  if (isLoading || !checked) {
+    return loadingComponent;
+  }
+  if (!isAuthenticated) {
+    return unauthenticatedComponent;
+  }
+  return children;
+}
+function GuestGuard({
+  children,
+  useAuth,
+  loadingComponent = null,
+  onAuthenticated,
+  authenticatedComponent = null
+}) {
+  const { isAuthenticated, isLoading } = useAuth();
+  const [checked, setChecked] = useState(false);
+  useEffect(() => {
+    if (!isLoading) {
+      if (isAuthenticated) {
+        onAuthenticated?.();
+      }
+      setChecked(true);
+    }
+  }, [isAuthenticated, isLoading, onAuthenticated]);
+  if (isLoading || !checked) {
+    return loadingComponent;
+  }
+  if (isAuthenticated) {
+    return authenticatedComponent;
+  }
+  return children;
+}
+function RoleBasedGuard({
+  children,
+  useAuth,
+  roles = [],
+  permissions = [],
+  requireEmailVerified = false,
+  roleMatchStrategy = "any",
+  loadingComponent = null,
+  onAccessDenied,
+  accessDeniedComponent = null
+}) {
+  const { isAuthenticated, isLoading, user } = useAuth();
+  const [checked, setChecked] = useState(false);
+  const [accessGranted, setAccessGranted] = useState(false);
+  useEffect(() => {
+    if (!isLoading) {
+      if (!isAuthenticated || !user) {
+        onAccessDenied?.("not_authenticated");
+        setAccessGranted(false);
+        setChecked(true);
+        return;
+      }
+      if (requireEmailVerified && !user.emailVerified) {
+        onAccessDenied?.("email_not_verified");
+        setAccessGranted(false);
+        setChecked(true);
+        return;
+      }
+      if (roles.length > 0) {
+        const userRoles = user.roles ?? [];
+        const hasRequiredRole = roleMatchStrategy === "all" ? roles.every((role) => userRoles.includes(role)) : roles.some((role) => userRoles.includes(role));
+        if (!hasRequiredRole) {
+          onAccessDenied?.("missing_role");
+          setAccessGranted(false);
+          setChecked(true);
+          return;
+        }
+      }
+      if (permissions.length > 0) {
+        const userPermissions = user.permissions ?? [];
+        const hasAllPermissions = permissions.every((perm) => userPermissions.includes(perm));
+        if (!hasAllPermissions) {
+          onAccessDenied?.("missing_permission");
+          setAccessGranted(false);
+          setChecked(true);
+          return;
+        }
+      }
+      setAccessGranted(true);
+      setChecked(true);
+    }
+  }, [isAuthenticated, isLoading, user, roles, permissions, requireEmailVerified, roleMatchStrategy, onAccessDenied]);
+  if (isLoading || !checked) {
+    return loadingComponent;
+  }
+  if (!accessGranted) {
+    return accessDeniedComponent;
+  }
+  return children;
+}
+function hasRole(user, role, strategy = "any") {
+  if (!user?.roles?.length) return false;
+  const roles = Array.isArray(role) ? role : [role];
+  return strategy === "all" ? roles.every((r) => user.roles.includes(r)) : roles.some((r) => user.roles.includes(r));
+}
+function hasPermission(user, permission, strategy = "all") {
+  if (!user?.permissions?.length) return false;
+  const permissions = Array.isArray(permission) ? permission : [permission];
+  return strategy === "all" ? permissions.every((p) => user.permissions.includes(p)) : permissions.some((p) => user.permissions.includes(p));
+}
+function createConditionalRender(user) {
+  return {
+    canRender: (options) => {
+      const { roles = [], permissions = [], roleMatchStrategy = "any" } = options;
+      if (roles.length > 0 && !hasRole(user, roles, roleMatchStrategy)) {
+        return false;
+      }
+      if (permissions.length > 0 && !hasPermission(user, permissions, "all")) {
+        return false;
+      }
+      return true;
+    }
+  };
+}
+var DataGridBlockContext = createContext(null);
+function useDataGridBlockContext() {
+  const context = useContext(DataGridBlockContext);
+  if (!context) {
+    throw new Error("useDataGridBlockContext must be used within DataGridBlock");
+  }
+  return context;
+}
+function MoreVertIcon() {
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      width: "20",
+      height: "20",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: 2,
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      "aria-hidden": "true",
+      children: [
+        /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "1" }),
+        /* @__PURE__ */ jsx("circle", { cx: "12", cy: "5", r: "1" }),
+        /* @__PURE__ */ jsx("circle", { cx: "12", cy: "19", r: "1" })
+      ]
+    }
+  );
+}
+function EmptyIcon() {
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      width: "64",
+      height: "64",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: 1.5,
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      "aria-hidden": "true",
+      style: { opacity: 0.4 },
+      children: [
+        /* @__PURE__ */ jsx("path", { d: "M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z" }),
+        /* @__PURE__ */ jsx("polyline", { points: "13 2 13 9 20 9" }),
+        /* @__PURE__ */ jsx("line", { x1: "10", y1: "12", x2: "10", y2: "18" }),
+        /* @__PURE__ */ jsx("line", { x1: "14", y1: "12", x2: "14", y2: "18" }),
+        /* @__PURE__ */ jsx("line", { x1: "10", y1: "15", x2: "14", y2: "15" })
+      ]
+    }
+  );
+}
+function CustomToolbar({
+  quickFilter,
+  exportConfig,
+  showColumnSelector = true,
+  showDensitySelector = true,
+  startContent,
+  endContent,
+  actions,
+  onQuickFilterChange
+}) {
+  const [searchValue, setSearchValue] = useState("");
+  const debounceRef = useRef(null);
+  useEffect(
+    () => () => {
+      if (debounceRef.current) clearTimeout(debounceRef.current);
+    },
+    []
+  );
+  const handleSearchChange = useCallback(
+    (value) => {
+      setSearchValue(value);
+      if (debounceRef.current) {
+        clearTimeout(debounceRef.current);
+      }
+      debounceRef.current = setTimeout(() => {
+        onQuickFilterChange?.(value);
+      }, quickFilter?.debounceMs ?? 300);
+    },
+    [onQuickFilterChange, quickFilter?.debounceMs]
+  );
+  return /* @__PURE__ */ jsxs(
+    GridToolbarContainer,
+    {
+      sx: {
+        gap: 1.5,
+        p: 2,
+        borderBottom: 1,
+        borderColor: "divider"
+      },
+      children: [
+        startContent,
+        quickFilter?.enabled !== false && /* @__PURE__ */ jsx(
+          SearchInput,
+          {
+            value: searchValue,
+            onChange: handleSearchChange,
+            placeholder: quickFilter?.placeholder ?? "Search...",
+            fullWidth: false,
+            minWidth: 200
+          }
+        ),
+        /* @__PURE__ */ jsx(Box2, { sx: { flex: 1 } }),
+        showColumnSelector && /* @__PURE__ */ jsx(GridToolbarColumnsButton, {}),
+        showDensitySelector && /* @__PURE__ */ jsx(GridToolbarDensitySelector, {}),
+        (exportConfig?.csv !== false || exportConfig?.print !== false) && /* @__PURE__ */ jsx(
+          GridToolbarExport,
+          {
+            printOptions: exportConfig?.print === false ? { disableToolbarButton: true } : void 0,
+            csvOptions: exportConfig?.csv === false ? { disableToolbarButton: true } : void 0
+          }
+        ),
+        actions,
+        endContent
+      ]
+    }
+  );
+}
+function RowActionsCell({ row, actions }) {
+  const [anchorEl, setAnchorEl] = useState(null);
+  const open = Boolean(anchorEl);
+  const handleClick = useCallback((event) => {
+    event.stopPropagation();
+    setAnchorEl(event.currentTarget);
+  }, []);
+  const handleClose = useCallback(() => {
+    setAnchorEl(null);
+  }, []);
+  const handleAction = useCallback(
+    (action, event) => {
+      setAnchorEl(null);
+      action.onClick(row, event);
+    },
+    [row]
+  );
+  const visibleActions = actions.filter((action) => {
+    if (typeof action.hidden === "function") {
+      return !action.hidden(row);
+    }
+    return !action.hidden;
+  });
+  if (visibleActions.length === 0) {
+    return null;
+  }
+  if (visibleActions.length <= 2) {
+    return /* @__PURE__ */ jsx(Box2, { sx: { display: "flex", gap: 0.5 }, children: visibleActions.map((action) => {
+      const isDisabled = typeof action.disabled === "function" ? action.disabled(row) : action.disabled;
+      return /* @__PURE__ */ jsx(Tooltip, { title: action.label, children: /* @__PURE__ */ jsx("span", { children: /* @__PURE__ */ jsx(
+        IconButton2,
+        {
+          size: "small",
+          color: action.color ?? "default",
+          disabled: isDisabled,
+          onClick: (e) => handleAction(action, e),
+          "aria-label": action.label,
+          children: action.icon ?? action.label.charAt(0)
+        }
+      ) }) }, action.key);
+    }) });
+  }
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      IconButton2,
+      {
+        size: "small",
+        onClick: handleClick,
+        "aria-label": "Row actions",
+        "aria-controls": open ? "row-actions-menu" : void 0,
+        "aria-haspopup": "true",
+        "aria-expanded": open ? "true" : void 0,
+        children: /* @__PURE__ */ jsx(MoreVertIcon, {})
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      Menu,
+      {
+        id: "row-actions-menu",
+        anchorEl,
+        open,
+        onClose: handleClose,
+        onClick: (e) => e.stopPropagation(),
+        anchorOrigin: { vertical: "bottom", horizontal: "right" },
+        transformOrigin: { vertical: "top", horizontal: "right" },
+        children: visibleActions.map((action, index) => {
+          const isDisabled = typeof action.disabled === "function" ? action.disabled(row) : action.disabled;
+          return [
+            /* @__PURE__ */ jsxs(MenuItem, { disabled: isDisabled, onClick: (e) => handleAction(action, e), children: [
+              action.icon && /* @__PURE__ */ jsx(ListItemIcon, { children: action.icon }),
+              /* @__PURE__ */ jsx(ListItemText, { primary: action.label, sx: { color: action.color ? `${action.color}.main` : void 0 } })
+            ] }, action.key),
+            action.divider && index < visibleActions.length - 1 && /* @__PURE__ */ jsx(Divider, {}, `${action.key}-divider`)
+          ];
+        })
+      }
+    )
+  ] });
+}
+function EmptyState({
+  icon,
+  title = "No data",
+  description = "No records to display.",
+  action,
+  component
+}) {
+  if (component) {
+    return /* @__PURE__ */ jsx(Fragment, { children: component });
+  }
+  return /* @__PURE__ */ jsxs(
+    Box2,
+    {
+      sx: {
+        display: "flex",
+        flexDirection: "column",
+        alignItems: "center",
+        justifyContent: "center",
+        py: 8,
+        px: 3,
+        textAlign: "center"
+      },
+      children: [
+        /* @__PURE__ */ jsx(Box2, { sx: { mb: 2, color: "text.disabled" }, children: icon ?? /* @__PURE__ */ jsx(EmptyIcon, {}) }),
+        /* @__PURE__ */ jsx(Typography2, { variant: "h6", gutterBottom: true, children: title }),
+        /* @__PURE__ */ jsx(Typography2, { variant: "body2", color: "text.secondary", sx: { mb: action ? 2 : 0 }, children: description }),
+        action && /* @__PURE__ */ jsx(Button2, { variant: "contained", size: "small", onClick: action.onClick, children: action.label })
+      ]
+    }
+  );
+}
+function ErrorState2({ message = "Failed to load data", onRetry }) {
+  return /* @__PURE__ */ jsxs(
+    Box2,
+    {
+      sx: {
+        display: "flex",
+        flexDirection: "column",
+        alignItems: "center",
+        justifyContent: "center",
+        py: 8,
+        px: 3,
+        textAlign: "center"
+      },
+      children: [
+        /* @__PURE__ */ jsx(Typography2, { color: "error", variant: "body1", gutterBottom: true, children: message }),
+        onRetry && /* @__PURE__ */ jsx(Button2, { variant: "outlined", size: "small", onClick: onRetry, sx: { mt: 1 }, children: "Retry" })
+      ]
+    }
+  );
+}
+function DataGridBlock({
+  columns,
+  rows,
+  loading = false,
+  error = false,
+  errorMessage,
+  onRetry,
+  rowActions,
+  rowActionsWidth = 80,
+  toolbar,
+  pagination,
+  selection,
+  empty,
+  density: defaultDensity = "standard",
+  autoHeight = false,
+  height = 500,
+  hideFooter = false,
+  rowHeight,
+  getRowId,
+  onRowClick,
+  onRowDoubleClick,
+  onSelectionChange,
+  onPaginationChange,
+  onSortChange,
+  onFilterChange,
+  paginationModel: controlledPaginationModel,
+  sortModel: controlledSortModel,
+  filterModel: controlledFilterModel,
+  selectionModel: controlledSelectionModel,
+  columnVisibilityModel,
+  onColumnVisibilityChange,
+  slots,
+  slotProps,
+  disableColumnMenu = false,
+  disableColumnFilter = false,
+  disableColumnSelector = false,
+  disableRowSelectionOnClick = true,
+  disableVirtualization = false,
+  sx
+}) {
+  const [density, setDensity] = useState(defaultDensity);
+  const [internalPaginationModel, setInternalPaginationModel] = useState({
+    page: 0,
+    pageSize: pagination?.defaultPageSize ?? 25
+  });
+  const [internalSortModel, setInternalSortModel] = useState([]);
+  const [internalFilterModel, setInternalFilterModel] = useState({ items: [] });
+  const [internalSelectionModel, setInternalSelectionModel] = useState({
+    type: "include",
+    ids: /* @__PURE__ */ new Set()
+  });
+  const [quickFilterValue, setQuickFilterValue] = useState("");
+  const paginationModel = controlledPaginationModel ?? internalPaginationModel;
+  const sortModel = controlledSortModel ?? internalSortModel;
+  const filterModel = controlledFilterModel ?? internalFilterModel;
+  const selectionModelValue = controlledSelectionModel ?? internalSelectionModel;
+  const finalColumns = useMemo(() => {
+    if (!rowActions || rowActions.length === 0) {
+      return columns;
+    }
+    const actionsColumn = {
+      field: "__actions__",
+      headerName: "",
+      width: rowActionsWidth,
+      sortable: false,
+      filterable: false,
+      disableColumnMenu: true,
+      disableReorder: true,
+      renderCell: (params) => /* @__PURE__ */ jsx(RowActionsCell, { row: params.row, actions: rowActions })
+    };
+    return [...columns, actionsColumn];
+  }, [columns, rowActions, rowActionsWidth]);
+  const handlePaginationChange = useCallback(
+    (model, details) => {
+      if (!controlledPaginationModel) {
+        setInternalPaginationModel(model);
+      }
+      onPaginationChange?.(model);
+    },
+    [controlledPaginationModel, onPaginationChange]
+  );
+  const handleSortChange = useCallback(
+    (model, details) => {
+      if (!controlledSortModel) {
+        setInternalSortModel(model);
+      }
+      onSortChange?.(model);
+    },
+    [controlledSortModel, onSortChange]
+  );
+  const handleFilterChange = useCallback(
+    (model, details) => {
+      if (!controlledFilterModel) {
+        setInternalFilterModel(model);
+      }
+      onFilterChange?.(model);
+    },
+    [controlledFilterModel, onFilterChange]
+  );
+  const handleSelectionChange = useCallback(
+    (model, details) => {
+      if (!controlledSelectionModel) {
+        setInternalSelectionModel(model);
+      }
+      onSelectionChange?.(model);
+    },
+    [controlledSelectionModel, onSelectionChange]
+  );
+  const contextValue = useMemo(
+    () => ({
+      loading,
+      error,
+      density,
+      setDensity,
+      rowCount: rows.length,
+      selectedCount: selectionModelValue.ids.size,
+      refresh: onRetry
+    }),
+    [loading, error, density, rows.length, selectionModelValue, onRetry]
+  );
+  const rowCount = pagination?.mode === "server" ? pagination.rowCount ?? 0 : rows.length;
+  const toolbarSlot = useMemo(() => {
+    if (toolbar?.show === false) {
+      return void 0;
+    }
+    return () => /* @__PURE__ */ jsx(
+      CustomToolbar,
+      {
+        quickFilter: toolbar?.quickFilter,
+        exportConfig: toolbar?.export,
+        showColumnSelector: toolbar?.columnVisibility?.enabled !== false,
+        showDensitySelector: toolbar?.densitySelector !== false,
+        startContent: toolbar?.startContent,
+        endContent: toolbar?.endContent,
+        actions: toolbar?.actions,
+        onQuickFilterChange: setQuickFilterValue
+      }
+    );
+  }, [toolbar]);
+  const noRowsOverlay = useMemo(() => {
+    if (error) {
+      return () => /* @__PURE__ */ jsx(ErrorState2, { message: errorMessage, onRetry });
+    }
+    return () => /* @__PURE__ */ jsx(
+      EmptyState,
+      {
+        icon: empty?.icon,
+        title: empty?.title,
+        description: empty?.description,
+        action: empty?.action,
+        component: empty?.component
+      }
+    );
+  }, [error, errorMessage, onRetry, empty]);
+  return /* @__PURE__ */ jsx(DataGridBlockContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(
+    Paper,
+    {
+      "data-testid": "prism-data-grid-block",
+      variant: "outlined",
+      sx: [
+        {
+          width: "100%",
+          overflow: "hidden"
+        },
+        ...Array.isArray(sx) ? sx : [sx]
+      ],
+      children: /* @__PURE__ */ jsx(Box2, { sx: { width: "100%", height: autoHeight ? "auto" : height }, children: /* @__PURE__ */ jsx(
+        DataGrid,
+        {
+          rows,
+          columns: finalColumns,
+          loading,
+          density,
+          autoHeight,
+          rowHeight,
+          getRowId,
+          onRowClick,
+          onRowDoubleClick,
+          paginationMode: pagination?.mode ?? "client",
+          paginationModel,
+          onPaginationModelChange: handlePaginationChange,
+          pageSizeOptions: pagination?.pageSizeOptions ?? [10, 25, 50, 100],
+          rowCount,
+          sortingMode: pagination?.mode === "server" ? "server" : "client",
+          sortModel,
+          onSortModelChange: handleSortChange,
+          filterMode: pagination?.mode === "server" ? "server" : "client",
+          filterModel,
+          onFilterModelChange: handleFilterChange,
+          checkboxSelection: selection?.checkboxSelection ?? false,
+          rowSelectionModel: selectionModelValue,
+          onRowSelectionModelChange: handleSelectionChange,
+          disableRowSelectionOnClick: selection?.disableSelectionOnClick ?? disableRowSelectionOnClick,
+          disableMultipleRowSelection: selection?.mode === "single",
+          keepNonExistentRowsSelected: selection?.keepNonExistentRowsSelected,
+          columnVisibilityModel,
+          onColumnVisibilityModelChange: onColumnVisibilityChange,
+          disableColumnMenu,
+          disableColumnFilter,
+          disableColumnSelector,
+          disableVirtualization,
+          hideFooter: hideFooter || pagination?.hide,
+          slots: {
+            toolbar: toolbarSlot,
+            noRowsOverlay,
+            loadingOverlay: () => /* @__PURE__ */ jsx(LinearProgress, { sx: { position: "absolute", top: 0, left: 0, right: 0 } }),
+            ...slots
+          },
+          slotProps,
+          sx: {
+            border: 0,
+            "& .MuiDataGrid-columnHeaders": {
+              bgcolor: "action.hover"
+            },
+            "& .MuiDataGrid-cell:focus": {
+              outline: "none"
+            },
+            "& .MuiDataGrid-row:hover": {
+              bgcolor: "action.hover"
+            }
+          }
+        }
+      ) })
+    }
+  ) });
+}
+function useDataGridBlock(options) {
+  const {
+    fetcher,
+    initialPageSize = 25,
+    initialSortModel = [],
+    initialFilterModel = { items: [] },
+    autoFetch = true,
+    keepPreviousData = true
+  } = options;
+  const [rows, setRows] = useState([]);
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState(null);
+  const [total, setTotal] = useState(0);
+  const [paginationModel, setPaginationModel] = useState({
+    page: 0,
+    pageSize: initialPageSize
+  });
+  const [sortModel, setSortModel] = useState(initialSortModel);
+  const [filterModel, setFilterModel] = useState(initialFilterModel);
+  const isMountedRef = useRef(true);
+  const abortControllerRef = useRef(null);
+  const fetchData = useCallback(
+    async (params) => {
+      if (abortControllerRef.current) {
+        abortControllerRef.current.abort();
+      }
+      abortControllerRef.current = new AbortController();
+      setLoading(true);
+      setError(null);
+      try {
+        const result = await fetcher(params);
+        if (isMountedRef.current) {
+          setRows(result.rows);
+          setTotal(result.total);
+        }
+      } catch (err) {
+        if (isMountedRef.current && err instanceof Error && err.name !== "AbortError") {
+          setError(err);
+          if (!keepPreviousData) {
+            setRows([]);
+          }
+        }
+      } finally {
+        if (isMountedRef.current) {
+          setLoading(false);
+        }
+      }
+    },
+    [fetcher, keepPreviousData]
+  );
+  const refresh = useCallback(() => {
+    fetchData({
+      page: paginationModel.page,
+      pageSize: paginationModel.pageSize,
+      sortModel,
+      filterModel
+    });
+  }, [fetchData, paginationModel, sortModel, filterModel]);
+  const reset = useCallback(() => {
+    setPaginationModel({ page: 0, pageSize: initialPageSize });
+    setSortModel(initialSortModel);
+    setFilterModel(initialFilterModel);
+  }, [initialPageSize, initialSortModel, initialFilterModel]);
+  useEffect(() => {
+    if (autoFetch) {
+      fetchData({
+        page: paginationModel.page,
+        pageSize: paginationModel.pageSize,
+        sortModel,
+        filterModel
+      });
+    }
+  }, [fetchData, paginationModel, sortModel, filterModel, autoFetch]);
+  useEffect(
+    () => () => {
+      isMountedRef.current = false;
+      if (abortControllerRef.current) {
+        abortControllerRef.current.abort();
+      }
+    },
+    []
+  );
+  const handlePaginationChange = useCallback((model, _details) => {
+    setPaginationModel(model);
+  }, []);
+  const handleSortChange = useCallback((model, _details) => {
+    setSortModel(model);
+    setPaginationModel((prev) => ({ ...prev, page: 0 }));
+  }, []);
+  const handleFilterChange = useCallback((model, _details) => {
+    setFilterModel(model);
+    setPaginationModel((prev) => ({ ...prev, page: 0 }));
+  }, []);
+  return {
+    rows,
+    loading,
+    error,
+    total,
+    paginationModel,
+    sortModel,
+    filterModel,
+    onPaginationChange: handlePaginationChange,
+    onSortChange: handleSortChange,
+    onFilterChange: handleFilterChange,
+    refresh,
+    reset
+  };
+}
+
+export { AuthBlock, AuthGuard, DashboardBlock, DashboardBlockContent, DashboardBlockFooter, DashboardBlockHeader, DataGridBlock, ForgotPasswordForm, GuestGuard, LoginForm, RegisterForm, ResetPasswordForm, RoleBasedGuard, VerifyCodeForm, createConditionalRender, hasPermission, hasRole, useDashboardBlock, useDashboardBlockContext, useDataGridBlock, useDataGridBlockContext };
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map