strapi-plugin-timeline 0.0.0

package/dist/admin/index-DWXpMwlf.mjs

@@ -0,0 +1,1005 @@
+import React, { useRef, useEffect, useState, useMemo } from "react";
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
+import { Modal, Flex, Loader, Box, RawTable, RawThead, RawTr, RawTh, Badge, Typography, RawTbody, RawTd, JSONInput, Button, Card, CardBody, Link, Avatar, CardContent, CardTitle, CardSubtitle, Tag, IconButton, DatePicker, Dialog } from "@strapi/design-system";
+import { Mail, ArrowsCounterClockwise, Eye, ArrowClockwise } from "@strapi/icons";
+import { useFetchClient, useAuth, useNotification } from "@strapi/strapi/admin";
+import { NavLink } from "react-router-dom";
+import { BlocksRenderer } from "@strapi/blocks-react-renderer";
+import ReactMarkdown from "react-markdown";
+import remarkGfm from "remark-gfm";
+const __variableDynamicImportRuntimeHelper = (glob, path, segs) => {
+  const v = glob[path];
+  if (v) {
+    return typeof v === "function" ? v() : Promise.resolve(v);
+  }
+  return new Promise((_, reject) => {
+    (typeof queueMicrotask === "function" ? queueMicrotask : setTimeout)(
+      reject.bind(
+        null,
+        new Error(
+          "Unknown variable dynamic import: " + path + (path.split("/").length !== segs ? ". Note that variables only represent file names one level deep." : "")
+        )
+      )
+    );
+  });
+};
+const PLUGIN_ID = "timeline";
+const Initializer = ({ setPlugin }) => {
+  const ref = useRef(setPlugin);
+  useEffect(() => {
+    ref.current(PLUGIN_ID);
+  }, []);
+  return null;
+};
+const PluginIcon = ({ width = 20, height = 20 }) => /* @__PURE__ */ jsx(
+  "svg",
+  {
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 519 519",
+    width,
+    height,
+    fill: "currentColor",
+    "aria-hidden": "true",
+    focusable: "false",
+    children: /* @__PURE__ */ jsxs("g", { transform: "translate(0,519) scale(0.1,-0.1)", stroke: "none", children: [
+      /* @__PURE__ */ jsx("path", { d: "M1130 4724 c-45 -20 -96 -69 -123 -119 -18 -34 -22 -61 -25 -177 l-4 -137 1649 -3 1648 -3 56 -26 c72 -34 134 -96 168 -168 l26 -56 3 -330 3 -330 37 -25 c67 -45 246 -234 305 -319 l57 -85 0 805 0 804 -24 51 c-27 57 -84 110 -136 124 -22 6 -691 10 -1820 10 -1571 -1 -1789 -3 -1820 -16z" }),
+      /* @__PURE__ */ jsx("path", { d: "M427 4063 c-52 -15 -122 -84 -144 -143 -17 -42 -18 -127 -18 -1285 0 -1132 1 -1243 17 -1276 25 -56 88 -120 143 -145 l50 -24 512 0 512 0 -30 67 c-39 88 -82 234 -105 358 -26 138 -27 499 -2 630 128 679 617 1232 1283 1453 413 138 844 145 1229 21 154 -49 215 -75 317 -135 42 -24 78 -44 80 -44 9 0 -8 387 -18 411 -20 45 -63 87 -106 103 -37 14 -244 16 -1861 18 -1382 2 -1828 0 -1859 -9z" }),
+      /* @__PURE__ */ jsx("path", { d: "M3165 3559 c-458 -44 -887 -254 -1163 -571 -379 -434 -506 -1031 -337 -1584 205 -671 818 -1123 1575 -1160 382 -19 802 103 1109 323 326 233 561 594 640 984 77 374 32 749 -129 1070 -209 419 -578 728 -1038 868 -117 36 -229 57 -377 71 -123 11 -150 11 -280 -1z m409 -365 c382 -73 705 -308 904 -659 166 -293 203 -683 96 -1010 -108 -331 -330 -583 -659 -748 -209 -105 -462 -153 -709 -136 -245 18 -465 92 -670 227 -90 59 -240 204 -312 299 -234 310 -307 755 -188 1135 126 400 461 734 856 852 219 65 469 80 682 40z" }),
+      /* @__PURE__ */ jsx("path", { d: "M3285 3013 c-11 -3 -35 -16 -53 -30 -64 -48 -62 -27 -62 -631 l0 -549 23 -34 c12 -19 42 -44 67 -57 44 -22 46 -22 525 -22 479 0 481 0 525 23 113 57 122 213 17 291 -28 20 -40 21 -432 24 l-404 3 -3 442 -3 442 -24 34 c-38 53 -111 80 -176 64z" }),
+      /* @__PURE__ */ jsx("path", { d: "M940 817 c0 -174 13 -220 83 -292 37 -37 69 -59 110 -74 56 -20 73 -21 530 -21 422 1 470 2 452 16 -11 8 -51 38 -90 66 -96 70 -268 247 -340 351 l-60 86 -342 0 -343 1 0 -133z" })
+    ] })
+  }
+);
+const ACTION_COLORS$1 = {
+  create: { bg: "success100", text: "success700" },
+  update: { bg: "warning100", text: "warning700" },
+  publish: { bg: "primary100", text: "primary700" },
+  delete: { bg: "danger100", text: "danger700" },
+  clean: { bg: "danger100", text: "danger700" },
+  restore: { bg: "primary100", text: "primary700" }
+};
+const DATE_KEYS = /* @__PURE__ */ new Set(["createdAt", "updatedAt", "publishedAt"]);
+const USER_KEYS = /* @__PURE__ */ new Set(["createdBy", "updatedBy"]);
+const looksLikeHtml = (str) => /<[a-z][\s\S]*?>/i.test(str);
+const looksLikeBlocks = (value) => Array.isArray(value) && value.length > 0 && typeof value[0] === "object" && value[0] !== null && "type" in value[0] && "children" in value[0];
+const formatDate = (dateStr) => new Date(dateStr).toLocaleString();
+const prettifyKey$1 = (key) => key.replace(/([A-Z])/g, " $1").replace(/[_-]/g, " ").replace(/\b\w/g, (c) => c.toUpperCase()).trim();
+const getInitials = (firstname, lastname, fallback) => {
+  if (firstname || lastname) {
+    return `${(firstname || "")[0] || ""}${(lastname || "")[0] || ""}`.toUpperCase();
+  }
+  return fallback[0].toUpperCase();
+};
+const getUserLink = (userId, currentUserId) => {
+  if (currentUserId && String(userId) === String(currentUserId)) return "/me";
+  return `/settings/users/${userId}`;
+};
+const TimelineDetailModal = ({
+  entry,
+  open,
+  onClose,
+  contentTypes
+}) => {
+  const { get } = useFetchClient();
+  const { user: currentUser } = useAuth("TimelineDetailModal", (auth) => ({ user: auth.user }));
+  const [config, setConfig] = useState(null);
+  const [configLoading, setConfigLoading] = useState(false);
+  const [resolvedRelations, setResolvedRelations] = useState({});
+  useEffect(() => {
+    if (!entry || !open) {
+      setConfig(null);
+      setResolvedRelations({});
+      return;
+    }
+    let cancelled = false;
+    const fetchConfigAndRelations = async () => {
+      setConfigLoading(true);
+      setResolvedRelations({});
+      let configData = null;
+      try {
+        const response = await get(
+          `/content-manager/content-types/${entry.contentType}/configuration`
+        );
+        configData = response.data?.data?.contentType || null;
+      } catch {
+        configData = null;
+      }
+      if (cancelled) return;
+      setConfig(configData);
+      const contentObj2 = entry.content && typeof entry.content === "object" && !Array.isArray(entry.content) ? entry.content : null;
+      const schema2 = entry.contentTypeSchema || {};
+      if (configData && contentObj2) {
+        const resolved = {};
+        for (const key of Object.keys(contentObj2)) {
+          const fieldSchema = schema2[key];
+          if (fieldSchema?.type !== "relation") continue;
+          const mainField = configData.metadatas?.[key]?.edit?.mainField;
+          if (!mainField || mainField === "id" || mainField === "documentId") continue;
+          const target = fieldSchema.target;
+          if (!target || target.startsWith("plugin::users-permissions.")) continue;
+          const targetCt = contentTypes.find((c) => c.uid === target);
+          if (!targetCt) continue;
+          const value = contentObj2[key];
+          const ids = Array.isArray(value) ? value.map(String) : value ? [String(value)] : [];
+          resolved[key] = {};
+          for (const id of ids.slice(0, 20)) {
+            if (cancelled) return;
+            try {
+              const path = targetCt.kind === "singleType" ? `/content-manager/single-types/${target}` : `/content-manager/collection-types/${target}/${id}`;
+              const resp = await get(path);
+              const data = resp.data?.data || resp.data;
+              resolved[key][id] = data?.[mainField] ? String(data[mainField]) : id;
+            } catch {
+              resolved[key][id] = id;
+            }
+          }
+        }
+        if (!cancelled) setResolvedRelations(resolved);
+      }
+      if (!cancelled) setConfigLoading(false);
+    };
+    fetchConfigAndRelations();
+    return () => {
+      cancelled = true;
+    };
+  }, [entry?.contentType, entry?.id, open]);
+  if (!entry) return null;
+  const getDisplayName = (uid) => {
+    const ct = contentTypes.find((c) => c.uid === uid);
+    return ct?.displayName || uid.split(".").pop() || uid;
+  };
+  const getContentTypeKind = (uid) => {
+    const ct = contentTypes.find((c) => c.uid === uid);
+    return ct?.kind || "collectionType";
+  };
+  const getContentManagerLink = (uid, docId) => {
+    const kind = getContentTypeKind(uid);
+    if (kind === "singleType") {
+      return `/content-manager/single-types/${uid}`;
+    }
+    return `/content-manager/collection-types/${uid}/${docId}`;
+  };
+  const getFieldLabel = (key) => {
+    if (key === "documentId") {
+      return "Content";
+    }
+    if (config?.metadatas?.[key]?.edit?.label) {
+      return config.metadatas[key].edit.label;
+    }
+    return prettifyKey$1(key);
+  };
+  const colors = ACTION_COLORS$1[entry.action] || ACTION_COLORS$1.update;
+  const contentObj = entry.content && typeof entry.content === "object" && !Array.isArray(entry.content) ? entry.content : null;
+  const contentKeys = contentObj ? Object.keys(contentObj) : [];
+  const schema = entry.contentTypeSchema || {};
+  const getRelationLink = (target, docId) => {
+    const ct = contentTypes.find((c) => c.uid === target);
+    if (!ct) return null;
+    if (ct.kind === "singleType") {
+      return `/content-manager/single-types/${target}`;
+    }
+    return `/content-manager/collection-types/${target}/${docId}`;
+  };
+  const getEffectiveType = (fieldSchema) => {
+    if (!fieldSchema) return "unknown";
+    if (fieldSchema.type === "customField" && fieldSchema.customFieldType) {
+      return fieldSchema.customFieldType;
+    }
+    return fieldSchema.type;
+  };
+  const renderRichContent = (value) => {
+    if (looksLikeHtml(value)) {
+      return /* @__PURE__ */ jsx(
+        Box,
+        {
+          padding: 3,
+          background: "neutral100",
+          hasRadius: true,
+          style: { maxHeight: "300px", overflow: "auto" },
+          children: /* @__PURE__ */ jsx(
+            "div",
+            {
+              style: { fontSize: "14px", lineHeight: "1.6" },
+              dangerouslySetInnerHTML: { __html: value }
+            }
+          )
+        }
+      );
+    }
+    return /* @__PURE__ */ jsx(
+      Box,
+      {
+        padding: 3,
+        background: "neutral100",
+        hasRadius: true,
+        style: { maxHeight: "300px", overflow: "auto", fontSize: "14px", lineHeight: "1.6" },
+        children: /* @__PURE__ */ jsx(ReactMarkdown, { remarkPlugins: [remarkGfm], children: value })
+      }
+    );
+  };
+  const getResolvedLabel = (key, id) => resolvedRelations[key]?.[id] || id;
+  const renderAdminUser = (value) => {
+    if (!value || typeof value !== "object") return null;
+    const name = [value.firstname, value.lastname].filter(Boolean).join(" ") || "Unknown";
+    const initials = getInitials(value.firstname, value.lastname, name);
+    const link = value.id ? getUserLink(value.id, currentUser?.id) : null;
+    return /* @__PURE__ */ jsx(Box, { width: "100%", children: /* @__PURE__ */ jsx(Card, { style: { width: "100%" }, children: /* @__PURE__ */ jsxs(CardBody, { style: { alignItems: "center" }, children: [
+      link ? /* @__PURE__ */ jsx(Link, { tag: NavLink, to: link, style: { textDecoration: "none" }, children: /* @__PURE__ */ jsx(
+        Avatar.Item,
+        {
+          src: void 0,
+          alt: value.id ?? name,
+          fallback: initials
+        }
+      ) }) : /* @__PURE__ */ jsx(
+        Avatar.Item,
+        {
+          src: void 0,
+          alt: value.id ?? name,
+          fallback: initials
+        }
+      ),
+      /* @__PURE__ */ jsxs(CardContent, { paddingLeft: 2, children: [
+        /* @__PURE__ */ jsx(CardTitle, { children: link ? /* @__PURE__ */ jsx(Link, { tag: NavLink, to: link, style: { textDecoration: "none" }, children: /* @__PURE__ */ jsx(Typography, { variant: "omega", textColor: "primary600", children: name }) }) : /* @__PURE__ */ jsx(Typography, { variant: "omega", children: name }) }),
+        value.email && /* @__PURE__ */ jsx(CardSubtitle, { children: /* @__PURE__ */ jsx(Link, { href: `mailto:${value.email}`, style: { textDecoration: "none" }, children: /* @__PURE__ */ jsxs(Flex, { alignItems: "center", gap: 2, children: [
+          /* @__PURE__ */ jsx(Mail, { color: "neutral600" }),
+          /* @__PURE__ */ jsx(Typography, { variant: "omega", textColor: "neutral600", children: value.email })
+        ] }) }) })
+      ] })
+    ] }) }) });
+  };
+  const renderContentValue = (key, value) => {
+    if (value === null || value === void 0) return /* @__PURE__ */ jsx(Typography, { variant: "omega", children: "—" });
+    const fieldSchema = schema[key];
+    const effectiveType = getEffectiveType(fieldSchema);
+    if (key === "documentId" && typeof value === "string") {
+      return /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: 1, alignItems: "flex-start", children: [
+        /* @__PURE__ */ jsx(Typography, { fontWeight: "bold", variant: "omega", children: getDisplayName(entry.contentType) }),
+        /* @__PURE__ */ jsx(
+          Link,
+          {
+            tag: NavLink,
+            to: getContentManagerLink(entry.contentType, value),
+            style: { textDecoration: "none" },
+            children: /* @__PURE__ */ jsxs(Typography, { variant: "omega", textColor: "primary600", children: [
+              value,
+              entry.locale && /* @__PURE__ */ jsx(Badge, { backgroundColor: "primary100", textColor: "primary500", marginLeft: 2, children: entry.locale ? entry.locale.toUpperCase() : "—" })
+            ] })
+          }
+        )
+      ] });
+    }
+    if (DATE_KEYS.has(key) && typeof value === "string") {
+      return /* @__PURE__ */ jsx(Typography, { variant: "omega", children: formatDate(value) });
+    }
+    if ((effectiveType === "datetime" || effectiveType === "date" || effectiveType === "time") && typeof value === "string") {
+      if (effectiveType === "time") {
+        return /* @__PURE__ */ jsx(Typography, { variant: "omega", children: value });
+      }
+      return /* @__PURE__ */ jsx(Typography, { variant: "omega", children: formatDate(value) });
+    }
+    if (USER_KEYS.has(key) && typeof value === "object" && value !== null) {
+      return renderAdminUser(value);
+    }
+    if (USER_KEYS.has(key) && (typeof value === "string" || typeof value === "number")) {
+      return /* @__PURE__ */ jsxs(Typography, { variant: "omega", children: [
+        "User #",
+        String(value)
+      ] });
+    }
+    if (key === "locale" && typeof value === "string") {
+      return /* @__PURE__ */ jsx(Typography, { variant: "omega", children: value.toUpperCase() });
+    }
+    if (key === "localizations" && Array.isArray(value)) {
+      if (value.length === 0) return /* @__PURE__ */ jsx(Typography, { variant: "omega", children: "—" });
+      const kind = getContentTypeKind(entry.contentType);
+      const entryLocale = contentObj?.locale;
+      const seen = /* @__PURE__ */ new Set();
+      const filtered = value.filter((item) => {
+        const loc = typeof item === "object" ? item.locale : null;
+        if (loc && loc === entryLocale) return false;
+        const key2 = loc || (typeof item === "object" ? item.documentId : String(item));
+        if (seen.has(key2)) return false;
+        seen.add(key2);
+        return true;
+      });
+      if (filtered.length === 0) return /* @__PURE__ */ jsx(Typography, { variant: "omega", children: "—" });
+      return /* @__PURE__ */ jsx(Flex, { gap: 1, wrap: "wrap", children: filtered.map((item, i) => {
+        const itemLocale = typeof item === "object" ? item.locale : null;
+        const docId = typeof item === "object" ? item.documentId : String(item);
+        const label = itemLocale ? itemLocale.toUpperCase() : docId;
+        let link;
+        if (kind === "singleType") {
+          link = `/content-manager/single-types/${entry.contentType}`;
+        } else {
+          link = `/content-manager/collection-types/${entry.contentType}/${docId}`;
+        }
+        if (itemLocale) link += `?plugins[i18n][locale]=${itemLocale}`;
+        return /* @__PURE__ */ jsx(Link, { tag: NavLink, to: link, style: { textDecoration: "none" }, children: /* @__PURE__ */ jsx(Badge, { backgroundColor: "primary100", textColor: "primary500", marginLeft: 2, children: label }) }, i);
+      }) });
+    }
+    if (fieldSchema?.type === "relation") {
+      const target = fieldSchema.target || "";
+      const isUsersPermissions = target.startsWith("plugin::users-permissions.");
+      if (Array.isArray(value)) {
+        if (value.length === 0) return /* @__PURE__ */ jsx(Typography, { variant: "omega", children: "—" });
+        return /* @__PURE__ */ jsx(Flex, { gap: 1, wrap: "wrap", children: value.map((id, i) => {
+          const label = getResolvedLabel(key, String(id));
+          const link = !isUsersPermissions ? getRelationLink(target, String(id)) : null;
+          return link ? /* @__PURE__ */ jsx(Link, { tag: NavLink, to: link, style: { textDecoration: "none" }, children: /* @__PURE__ */ jsx(Tag, { icon: /* @__PURE__ */ jsx(Link, {}), children: label }) }, i) : /* @__PURE__ */ jsx(Tag, { icon: /* @__PURE__ */ jsx(Link, {}), children: label }, i);
+        }) });
+      }
+      if (typeof value === "string" || typeof value === "number") {
+        const label = getResolvedLabel(key, String(value));
+        const link = !isUsersPermissions ? getRelationLink(target, String(value)) : null;
+        return link ? /* @__PURE__ */ jsx(Link, { tag: NavLink, to: link, style: { textDecoration: "none" }, children: /* @__PURE__ */ jsx(Tag, { icon: /* @__PURE__ */ jsx(Link, {}), children: label }) }) : /* @__PURE__ */ jsx(Tag, { icon: /* @__PURE__ */ jsx(Link, {}), children: label });
+      }
+    }
+    if (effectiveType === "blocks" && looksLikeBlocks(value)) {
+      return /* @__PURE__ */ jsx(
+        Box,
+        {
+          padding: 3,
+          background: "neutral100",
+          hasRadius: true,
+          style: { maxHeight: "300px", overflow: "auto", fontSize: "14px", lineHeight: "1.6" },
+          children: /* @__PURE__ */ jsx(BlocksRenderer, { content: value })
+        }
+      );
+    }
+    if (effectiveType === "richtext" && typeof value === "string") {
+      return renderRichContent(value);
+    }
+    if ((effectiveType === "text" || effectiveType === "string") && typeof value === "string" && fieldSchema?.type === "customField" && looksLikeHtml(value)) {
+      return /* @__PURE__ */ jsx(
+        Box,
+        {
+          padding: 3,
+          background: "neutral100",
+          hasRadius: true,
+          style: { maxHeight: "300px", overflow: "auto" },
+          children: /* @__PURE__ */ jsx(
+            "div",
+            {
+              style: { fontSize: "14px", lineHeight: "1.6" },
+              dangerouslySetInnerHTML: { __html: value }
+            }
+          )
+        }
+      );
+    }
+    if (typeof value === "object") {
+      return /* @__PURE__ */ jsx(JSONInput, { value: JSON.stringify(value, null, 2), disabled: true });
+    }
+    return /* @__PURE__ */ jsx(Typography, { variant: "omega", children: String(value) });
+  };
+  const summaryUserValue = {
+    id: entry.userId,
+    firstname: entry.userName?.split(" ")[0] || null,
+    lastname: entry.userName?.split(" ").slice(1).join(" ") || null,
+    email: null
+  };
+  if (contentObj) {
+    for (const k of ["createdBy", "updatedBy"]) {
+      const u = contentObj[k];
+      if (u && typeof u === "object" && u.id && String(u.id) === String(entry.userId) && u.email) {
+        summaryUserValue.email = u.email;
+        if (u.firstname) summaryUserValue.firstname = u.firstname;
+        if (u.lastname) summaryUserValue.lastname = u.lastname;
+        break;
+      }
+    }
+  }
+  return /* @__PURE__ */ jsx(Modal.Root, { open, onOpenChange: (isOpen) => !isOpen && onClose(), children: /* @__PURE__ */ jsxs(Modal.Content, { children: [
+    /* @__PURE__ */ jsx(Modal.Header, { children: /* @__PURE__ */ jsx(Modal.Title, { children: "Timeline Entry Detail" }) }),
+    /* @__PURE__ */ jsxs(Modal.Body, { children: [
+      /* @__PURE__ */ jsx(Flex, { justifyContent: "space-between", alignItems: "center", children: configLoading && /* @__PURE__ */ jsx(Loader, { small: true, children: "Loading field information" }) }),
+      /* @__PURE__ */ jsx(Box, { children: contentKeys.length > 0 ? /* @__PURE__ */ jsxs(RawTable, { colCount: 2, rowCount: contentKeys.length + 1, width: "100%", children: [
+        /* @__PURE__ */ jsx(RawThead, { children: /* @__PURE__ */ jsx(RawTr, { children: /* @__PURE__ */ jsx(RawTh, { colSpan: 2, children: /* @__PURE__ */ jsx(Box, { width: "100%", children: /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: 2, alignItems: "flex-start", children: [
+          /* @__PURE__ */ jsx(Box, { width: "100%", children: /* @__PURE__ */ jsxs(Flex, { gap: 2, alignItems: "center", children: [
+            /* @__PURE__ */ jsx(Badge, { backgroundColor: colors.bg, textColor: colors.text, children: entry.action }),
+            /* @__PURE__ */ jsx(Typography, { variant: "omega", children: formatDate(entry.createdAt) })
+          ] }) }),
+          /* @__PURE__ */ jsx(Box, { marginBottom: 6, width: "100%", children: renderAdminUser(summaryUserValue) })
+        ] }) }) }) }) }),
+        /* @__PURE__ */ jsx(RawTbody, { children: contentKeys.filter((key) => key !== "id" && key !== "locale").map((key) => /* @__PURE__ */ jsxs(
+          RawTr,
+          {
+            style: { borderBottom: "1px solid #dcdce4", borderLeft: "none", borderRight: "none" },
+            children: [
+              /* @__PURE__ */ jsx(RawTd, { paddingTop: 4, paddingBottom: 4, style: { verticalAlign: "middle" }, children: /* @__PURE__ */ jsx(Typography, { fontWeight: "bold", variant: "omega", children: getFieldLabel(key) }) }),
+              /* @__PURE__ */ jsx(RawTd, { padding: 4, children: renderContentValue(key, contentObj[key]) })
+            ]
+          },
+          key
+        )) })
+      ] }) : /* @__PURE__ */ jsx(JSONInput, { value: JSON.stringify(entry.content, null, 2), disabled: true }) })
+    ] }),
+    /* @__PURE__ */ jsx(Modal.Footer, { children: /* @__PURE__ */ jsx(Modal.Close, { children: /* @__PURE__ */ jsx(Button, { variant: "tertiary", children: "Close" }) }) })
+  ] }) });
+};
+const SYSTEM_FIELDS = /* @__PURE__ */ new Set([
+  "id",
+  "documentId",
+  "createdAt",
+  "updatedAt",
+  "publishedAt",
+  "createdBy",
+  "updatedBy",
+  "created_by_id",
+  "updated_by_id",
+  "created_at",
+  "updated_at",
+  "published_at",
+  "locale",
+  "localizations",
+  "status"
+]);
+const prettifyKey = (key) => key.replace(/([A-Z])/g, " $1").replace(/[_-]/g, " ").replace(/\b\w/g, (c) => c.toUpperCase()).trim();
+const normalize = (value) => {
+  if (value === null || value === void 0) return null;
+  if (typeof value === "string" || typeof value === "number" || typeof value === "boolean") {
+    return value;
+  }
+  if (Array.isArray(value)) {
+    if (value.length > 0 && typeof value[0] === "object" && value[0] !== null && ("documentId" in value[0] || "id" in value[0])) {
+      return value.map((item) => item.documentId ?? item.id ?? item).sort();
+    }
+    return value.map(normalize);
+  }
+  if (typeof value === "object") {
+    if ("documentId" in value || "id" in value && "__type" in value) {
+      return value.documentId ?? value.id ?? value;
+    }
+    if ("url" in value && "id" in value) {
+      return value.id;
+    }
+    const out = {};
+    for (const [k, v] of Object.entries(value)) {
+      if (!SYSTEM_FIELDS.has(k)) out[k] = normalize(v);
+    }
+    return out;
+  }
+  return value;
+};
+const renderCompactValue = (value) => {
+  if (value === null || value === void 0) {
+    return /* @__PURE__ */ jsx(Typography, { variant: "omega", textColor: "neutral400", children: "—" });
+  }
+  if (typeof value === "boolean") {
+    return /* @__PURE__ */ jsx(Typography, { variant: "omega", children: value ? "Yes" : "No" });
+  }
+  if (typeof value === "number") {
+    return /* @__PURE__ */ jsx(Typography, { variant: "omega", children: String(value) });
+  }
+  if (typeof value === "string") {
+    if (value === "") return /* @__PURE__ */ jsx(Typography, { variant: "omega", textColor: "neutral400", children: "(empty)" });
+    if (value.length > 120) {
+      return /* @__PURE__ */ jsxs(Typography, { variant: "omega", children: [
+        value.slice(0, 120),
+        "…"
+      ] });
+    }
+    return /* @__PURE__ */ jsx(Typography, { variant: "omega", children: value });
+  }
+  if (Array.isArray(value)) {
+    if (value.length === 0) return /* @__PURE__ */ jsx(Typography, { variant: "omega", textColor: "neutral400", children: "(empty)" });
+    const items = value.slice(0, 5).map((item, i) => {
+      if (typeof item === "object" && item !== null) {
+        const label = item.name || item.title || item.label || item.documentId || item.id || JSON.stringify(item);
+        return /* @__PURE__ */ jsx(Badge, { backgroundColor: "neutral100", textColor: "neutral700", children: String(label) }, i);
+      }
+      return /* @__PURE__ */ jsx(Badge, { backgroundColor: "neutral100", textColor: "neutral700", children: String(item) }, i);
+    });
+    return /* @__PURE__ */ jsxs(Flex, { gap: 1, wrap: "wrap", alignItems: "center", children: [
+      items,
+      value.length > 5 && /* @__PURE__ */ jsxs(Typography, { variant: "omega", textColor: "neutral500", children: [
+        "+",
+        value.length - 5,
+        " more"
+      ] })
+    ] });
+  }
+  if (typeof value === "object") {
+    if (value.name || value.title) {
+      return /* @__PURE__ */ jsx(Typography, { variant: "omega", children: String(value.name || value.title) });
+    }
+    if (value.url) return /* @__PURE__ */ jsx(Typography, { variant: "omega", children: String(value.url) });
+    const str = JSON.stringify(value);
+    if (str.length > 120) return /* @__PURE__ */ jsxs(Typography, { variant: "omega", children: [
+      str.slice(0, 120),
+      "…"
+    ] });
+    return /* @__PURE__ */ jsx(Typography, { variant: "omega", children: str });
+  }
+  return /* @__PURE__ */ jsx(Typography, { variant: "omega", children: String(value) });
+};
+const RestoreDiffTable = ({
+  currentData,
+  snapshotData,
+  loading
+}) => {
+  if (loading) {
+    return /* @__PURE__ */ jsx(Flex, { justifyContent: "center", padding: 4, children: /* @__PURE__ */ jsx(Loader, { small: true, children: "Loading current data…" }) });
+  }
+  if (!currentData) {
+    return /* @__PURE__ */ jsx(Typography, { variant: "omega", textColor: "neutral500", children: "Could not load current document for comparison." });
+  }
+  const allKeys = /* @__PURE__ */ new Set([
+    ...Object.keys(currentData),
+    ...Object.keys(snapshotData)
+  ]);
+  const changedFields = [];
+  for (const key of allKeys) {
+    if (SYSTEM_FIELDS.has(key)) continue;
+    const a = normalize(currentData[key]);
+    const b = normalize(snapshotData[key]);
+    if (JSON.stringify(a) !== JSON.stringify(b)) {
+      changedFields.push(key);
+    }
+  }
+  if (changedFields.length === 0) {
+    return /* @__PURE__ */ jsx(Box, { padding: 3, background: "success100", hasRadius: true, children: /* @__PURE__ */ jsx(Typography, { variant: "omega", textColor: "success700", children: "No differences — content is already up to date." }) });
+  }
+  return /* @__PURE__ */ jsxs(Box, { width: "100%", children: [
+    /* @__PURE__ */ jsx(Box, { marginBottom: 4, children: /* @__PURE__ */ jsxs(Typography, { variant: "omega", children: [
+      changedFields.length,
+      " field",
+      changedFields.length !== 1 ? "s" : "",
+      " will change"
+    ] }) }),
+    /* @__PURE__ */ jsx(Box, { style: { maxHeight: "360px", overflow: "auto" }, children: /* @__PURE__ */ jsx(RawTable, { colCount: 2, rowCount: changedFields.length * 2 + 1, width: "100%", style: { width: "100%" }, children: /* @__PURE__ */ jsx(RawTbody, { children: changedFields.map((key) => /* @__PURE__ */ jsxs(React.Fragment, { children: [
+      /* @__PURE__ */ jsxs(RawTr, { style: { borderTop: "1px solid #dcdce4" }, children: [
+        /* @__PURE__ */ jsx(
+          RawTd,
+          {
+            rowSpan: 2,
+            paddingTop: 4,
+            paddingBottom: 4,
+            paddingRight: 4,
+            style: { verticalAlign: "middle" },
+            children: /* @__PURE__ */ jsx(Typography, { fontWeight: "bold", variant: "omega", children: prettifyKey(key) })
+          }
+        ),
+        /* @__PURE__ */ jsx(RawTd, { padding: 4, style: { background: "#fcecea" }, children: /* @__PURE__ */ jsxs(Flex, { gap: 2, direction: "column", alignItems: "flex-start", wrap: "wrap", children: [
+          /* @__PURE__ */ jsx(Typography, { textColor: "danger700", fontWeight: "bold", children: "Current" }),
+          renderCompactValue(currentData[key])
+        ] }) })
+      ] }),
+      /* @__PURE__ */ jsx(RawTr, { style: { borderBottom: "1px solid #dcdce4" }, children: /* @__PURE__ */ jsx(RawTd, { paddingTop: 4, paddingBottom: 4, paddingLeft: 4, style: { background: "#eafbe7" }, children: /* @__PURE__ */ jsxs(Flex, { gap: 2, direction: "column", alignItems: "flex-start", wrap: "wrap", children: [
+        /* @__PURE__ */ jsx(Typography, { textColor: "success700", fontWeight: "bold", children: "Restore to" }),
+        renderCompactValue(snapshotData[key])
+      ] }) }) })
+    ] }, key)) }) }) })
+  ] });
+};
+const ACTION_COLORS = {
+  create: { bg: "success100", text: "success700" },
+  update: { bg: "warning100", text: "warning700" },
+  publish: { bg: "primary100", text: "primary700" },
+  delete: { bg: "danger100", text: "danger700" },
+  clean: { bg: "danger100", text: "danger700" },
+  restore: { bg: "primary100", text: "primary700" }
+};
+const toDateKey = (dateStr) => {
+  const d = new Date(dateStr);
+  return `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, "0")}-${String(d.getDate()).padStart(2, "0")}`;
+};
+const formatTime = (dateStr) => new Date(dateStr).toLocaleTimeString([], { hour: "2-digit", minute: "2-digit", second: "2-digit" });
+const TimelinePanel = ({
+  documentId,
+  document,
+  model
+}) => {
+  const { get, post } = useFetchClient();
+  const { toggleNotification } = useNotification();
+  const { user: currentUser } = useAuth("TimelinePanel", (auth) => ({ user: auth.user }));
+  const [entries, setEntries] = useState([]);
+  const [loading, setLoading] = useState(true);
+  const [selectedDateKey, setSelectedDateKey] = useState(null);
+  const [restoreTarget, setRestoreTarget] = useState(null);
+  const [isRestoring, setIsRestoring] = useState(false);
+  const [adminUsers, setAdminUsers] = useState({});
+  const [canReadUsers, setCanReadUsers] = useState(false);
+  const [viewEntry, setViewEntry] = useState(null);
+  const [contentTypes, setContentTypes] = useState([]);
+  const effectiveDocumentId = documentId || document?.documentId;
+  useEffect(() => {
+    const checkPermissions = async () => {
+      try {
+        const res = await get("/admin/permissions/check", {
+          params: { permissions: [{ action: "admin::users.read" }] }
+        });
+        setCanReadUsers(res?.data?.data?.[0]?.hasPermission ?? false);
+      } catch {
+        setCanReadUsers(false);
+      }
+    };
+    checkPermissions();
+  }, [get]);
+  useEffect(() => {
+    const loadContentTypes = async () => {
+      try {
+        const res = await get(`/${PLUGIN_ID}/content-types`);
+        setContentTypes(res.data.data || []);
+      } catch {
+      }
+    };
+    loadContentTypes();
+  }, [get]);
+  useEffect(() => {
+    if (!effectiveDocumentId || !model) {
+      setLoading(false);
+      return;
+    }
+    loadHistory();
+  }, [effectiveDocumentId, model]);
+  const loadHistory = async () => {
+    setLoading(true);
+    try {
+      const res = await get(
+        `/${PLUGIN_ID}/entries/${encodeURIComponent(model)}/${encodeURIComponent(effectiveDocumentId)}`
+      );
+      const all = res.data.data || [];
+      setEntries(all.slice(0, 20));
+      if (all.length > 0 && !selectedDateKey) {
+        setSelectedDateKey(toDateKey(all[0].createdAt));
+      }
+      const userIds = [...new Set(all.slice(0, 20).map((e) => e.userId).filter(Boolean))];
+      if (userIds.length > 0) {
+        fetchAdminUsers(userIds);
+      }
+    } catch (err) {
+      console.error("[Timeline Panel] Failed to load history:", err);
+    } finally {
+      setLoading(false);
+    }
+  };
+  const fetchAdminUsers = async (userIds) => {
+    const fetched = {};
+    await Promise.all(
+      userIds.map(async (uid) => {
+        try {
+          const res = await get(`/admin/users/${uid}`);
+          const u = res.data?.data || res.data;
+          if (u && u.id) {
+            fetched[u.id] = u;
+          }
+        } catch {
+        }
+      })
+    );
+    setAdminUsers((prev) => ({ ...prev, ...fetched }));
+  };
+  const getInitials2 = (user) => {
+    const f = (user.firstname || "")[0] || "";
+    const l = (user.lastname || "")[0] || "";
+    return (f + l).toUpperCase() || "?";
+  };
+  const getUserLink2 = (userId) => {
+    if (currentUser && userId === currentUser.id) return "/me";
+    if (canReadUsers) return `/settings/users/${userId}`;
+    return null;
+  };
+  const selectedDateValue = useMemo(() => {
+    if (!selectedDateKey) return void 0;
+    const [y, m, d] = selectedDateKey.split("-").map(Number);
+    return new Date(y, m - 1, d, 12, 0, 0);
+  }, [selectedDateKey]);
+  const filteredEntries = useMemo(() => {
+    if (!selectedDateKey) return entries;
+    return entries.filter((e) => toDateKey(e.createdAt) === selectedDateKey);
+  }, [entries, selectedDateKey]);
+  const handleRestore = async (target) => {
+    if (!effectiveDocumentId || !model) return;
+    setIsRestoring(true);
+    try {
+      const snapshot = target.content;
+      if (!snapshot || typeof snapshot !== "object") {
+        toggleNotification({ type: "danger", message: "Invalid snapshot data." });
+        return;
+      }
+      const currentDoc = document;
+      if (!currentDoc) {
+        toggleNotification({ type: "danger", message: "Current document not available." });
+        return;
+      }
+      const SYSTEM_FIELDS2 = /* @__PURE__ */ new Set([
+        "id",
+        "documentId",
+        "createdAt",
+        "updatedAt",
+        "publishedAt",
+        "createdBy",
+        "updatedBy",
+        "created_by_id",
+        "updated_by_id",
+        "created_at",
+        "updated_at",
+        "published_at",
+        "locale",
+        "localizations"
+      ]);
+      const restoreData = {};
+      for (const [key, value] of Object.entries(currentDoc)) {
+        if (SYSTEM_FIELDS2.has(key)) continue;
+        if (key in snapshot) {
+          restoreData[key] = snapshot[key];
+        } else {
+          restoreData[key] = getEmptyValue(value);
+        }
+      }
+      await post(`/${PLUGIN_ID}/entries/snapshot-before-restore`, {
+        contentType: model,
+        entryDocumentId: effectiveDocumentId,
+        locale: target.locale || null,
+        restoreData
+      });
+      toggleNotification({
+        type: "success",
+        message: "Entry restored from timeline snapshot. Refreshing…"
+      });
+      setTimeout(() => window.location.reload(), 800);
+    } catch (err) {
+      toggleNotification({
+        type: "danger",
+        message: err?.response?.data?.error?.message || err?.message || "Failed to restore entry."
+      });
+    } finally {
+      setIsRestoring(false);
+      setRestoreTarget(null);
+    }
+  };
+  if (!effectiveDocumentId) {
+    return {
+      title: "Timeline",
+      content: /* @__PURE__ */ jsx(Box, { padding: 2, children: /* @__PURE__ */ jsx(Typography, { variant: "pi", textColor: "neutral600", children: "Save the entry to start tracking history." }) })
+    };
+  }
+  if (loading) {
+    return {
+      title: "Timeline",
+      content: /* @__PURE__ */ jsxs(Flex, { justifyContent: "center", alignItems: "center", gap: 2, children: [
+        /* @__PURE__ */ jsx(Loader, { small: true }),
+        /* @__PURE__ */ jsx(Typography, { variant: "pi", textColor: "neutral600", children: "Loading history…" })
+      ] })
+    };
+  }
+  return {
+    title: `Timeline (${entries.length})`,
+    content: /* @__PURE__ */ jsxs(Box, { width: "100%", maxWidth: "100%", children: [
+      /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: 3, children: [
+        /* @__PURE__ */ jsx(Box, { width: "100%", children: /* @__PURE__ */ jsxs(Flex, { justifyContent: "space-between", gap: 2, children: [
+          /* @__PURE__ */ jsx(
+            IconButton,
+            {
+              onClick: loadHistory,
+              variant: "tertiary",
+              disabled: loading,
+              label: "Refresh timeline",
+              children: /* @__PURE__ */ jsx(ArrowsCounterClockwise, {})
+            }
+          ),
+          /* @__PURE__ */ jsx(Box, { width: "100%", textAlign: "center", children: entries.length > 0 ? /* @__PURE__ */ jsx(
+            Button,
+            {
+              width: "100%",
+              variant: "secondary",
+              size: "S",
+              startIcon: /* @__PURE__ */ jsx(Eye, {}),
+              onClick: () => {
+                const params = new URLSearchParams();
+                params.set("contentType", model);
+                params.set("entryDocumentId", effectiveDocumentId);
+                const currentLocale = document?.locale || new URLSearchParams(window.location.search).get("plugins[i18n][locale]");
+                if (currentLocale) params.set("locale", currentLocale);
+                window.location.href = `/admin/plugins/${PLUGIN_ID}?${params.toString()}`;
+              },
+              children: "View all"
+            }
+          ) : /* @__PURE__ */ jsx(Typography, { variant: "pi", textColor: "neutral600", children: "No history yet." }) })
+        ] }) }),
+        entries.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(Box, { width: "100%", maxWidth: "100%", minWidth: "100%", style: { overflow: "auto" }, children: /* @__PURE__ */ jsx(
+            DatePicker,
+            {
+              value: selectedDateValue,
+              onChange: (date) => {
+                if (!date) {
+                  setSelectedDateKey(null);
+                  return;
+                }
+                const key = `${date.getFullYear()}-${String(date.getMonth() + 1).padStart(2, "0")}-${String(date.getDate()).padStart(2, "0")}`;
+                setSelectedDateKey(key);
+              },
+              onClear: () => setSelectedDateKey(null)
+            }
+          ) }),
+          filteredEntries.length === 0 ? /* @__PURE__ */ jsx(Typography, { variant: "pi", textColor: "neutral500", children: "No actions on this date." }) : filteredEntries.map((entry) => {
+            const colors = ACTION_COLORS[entry.action] || ACTION_COLORS.update;
+            return /* @__PURE__ */ jsx(Box, { padding: 2, background: "neutral100", hasRadius: true, style: { overflow: "hidden", width: "100%", maxWidth: "100%" }, children: /* @__PURE__ */ jsxs(Flex, { direction: "column", alignItems: "stretch", gap: 1, style: { minWidth: 0 }, children: [
+              /* @__PURE__ */ jsxs(Flex, { gap: 2, alignItems: "center", wrap: "wrap", children: [
+                /* @__PURE__ */ jsx(Badge, { backgroundColor: colors.bg, textColor: colors.text, size: "S", children: entry.action }),
+                /* @__PURE__ */ jsx(Typography, { variant: "pi", textColor: "neutral500", children: formatTime(entry.createdAt) })
+              ] }),
+              entry.userId && (() => {
+                const admin = adminUsers[entry.userId];
+                const displayName = admin ? `${admin.firstname || ""} ${admin.lastname || ""}`.trim() || entry.userName || `User #${entry.userId}` : entry.userName || `User #${entry.userId}`;
+                const label = `${displayName}`;
+                const link = getUserLink2(entry.userId);
+                admin ? getInitials2(admin) : (entry.userName || "?").charAt(0).toUpperCase();
+                return /* @__PURE__ */ jsx(Flex, { gap: 2, alignItems: "center", style: { minWidth: 0, overflow: "hidden" }, children: link ? /* @__PURE__ */ jsx(NavLink, { to: link, style: { textDecoration: "none", minWidth: 0, overflow: "hidden" }, children: /* @__PURE__ */ jsxs(
+                  Typography,
+                  {
+                    variant: "pi",
+                    textColor: "primary600",
+                    ellipsis: true,
+                    children: [
+                      label,
+                      entry.userId && /* @__PURE__ */ jsxs(Badge, { backgroundColor: "primary100", textColor: "primary500", marginLeft: 2, children: [
+                        "ID ",
+                        entry.userId
+                      ] })
+                    ]
+                  }
+                ) }) : /* @__PURE__ */ jsx(
+                  Typography,
+                  {
+                    variant: "pi",
+                    textColor: "neutral600",
+                    ellipsis: true,
+                    style: { minWidth: 0 },
+                    children: label
+                  }
+                ) });
+              })(),
+              /* @__PURE__ */ jsx(Box, { width: "100%", children: /* @__PURE__ */ jsxs(Flex, { gap: 2, justifyContent: "center", alignItems: "center", children: [
+                /* @__PURE__ */ jsx(
+                  IconButton,
+                  {
+                    label: "View details",
+                    size: "S",
+                    onClick: () => setViewEntry(entry),
+                    children: /* @__PURE__ */ jsx(Eye, {})
+                  }
+                ),
+                entry.action !== "delete" && /* @__PURE__ */ jsxs(Dialog.Root, { children: [
+                  /* @__PURE__ */ jsx(Dialog.Trigger, { children: /* @__PURE__ */ jsx(
+                    Button,
+                    {
+                      variant: "danger-light",
+                      size: "S",
+                      startIcon: /* @__PURE__ */ jsx(ArrowClockwise, {}),
+                      onClick: () => setRestoreTarget(entry),
+                      width: "100%",
+                      children: "Restore"
+                    }
+                  ) }),
+                  /* @__PURE__ */ jsxs(Dialog.Content, { children: [
+                    /* @__PURE__ */ jsx(Dialog.Header, { children: "Restore from Timeline" }),
+                    /* @__PURE__ */ jsx(Dialog.Body, { children: /* @__PURE__ */ jsx(
+                      RestoreDiffTable,
+                      {
+                        currentData: document || null,
+                        snapshotData: entry.content && typeof entry.content === "object" ? entry.content : {}
+                      }
+                    ) }),
+                    /* @__PURE__ */ jsxs(Dialog.Footer, { children: [
+                      /* @__PURE__ */ jsx(Dialog.Cancel, { children: /* @__PURE__ */ jsx(Button, { variant: "tertiary", children: "Cancel" }) }),
+                      /* @__PURE__ */ jsx(Dialog.Action, { children: /* @__PURE__ */ jsx(
+                        Button,
+                        {
+                          variant: "danger-light",
+                          onClick: () => handleRestore(entry),
+                          loading: isRestoring,
+                          children: "Restore"
+                        }
+                      ) })
+                    ] })
+                  ] })
+                ] })
+              ] }) })
+            ] }) }, entry.id);
+          })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsx(
+        TimelineDetailModal,
+        {
+          entry: viewEntry,
+          open: !!viewEntry,
+          onClose: () => setViewEntry(null),
+          contentTypes
+        }
+      )
+    ] })
+  };
+};
+function getEmptyValue(currentValue) {
+  if (currentValue === null || currentValue === void 0) return null;
+  if (Array.isArray(currentValue)) return [];
+  if (typeof currentValue === "string") return "";
+  if (typeof currentValue === "number") return null;
+  if (typeof currentValue === "boolean") return false;
+  if (typeof currentValue === "object") return null;
+  return null;
+}
+const index = {
+  register(app) {
+    app.addMenuLink({
+      to: `plugins/${PLUGIN_ID}`,
+      icon: PluginIcon,
+      intlLabel: {
+        id: `${PLUGIN_ID}.plugin.name`,
+        defaultMessage: "Timeline"
+      },
+      Component: async () => {
+        const { App } = await import("./App-BYK_GACN.mjs");
+        return App;
+      }
+    });
+    app.createSettingSection(
+      {
+        id: PLUGIN_ID,
+        intlLabel: {
+          id: `${PLUGIN_ID}.plugin.name`,
+          defaultMessage: "Timeline"
+        }
+      },
+      [
+        {
+          intlLabel: {
+            id: `${PLUGIN_ID}.settings.content-types`,
+            defaultMessage: "Content Types"
+          },
+          id: "content-types",
+          to: `${PLUGIN_ID}/content-types`,
+          Component: async () => {
+            const { SettingsPage } = await import("./SettingsPage-C87KaVB_.mjs");
+            return { default: SettingsPage };
+          }
+        },
+        {
+          intlLabel: {
+            id: `${PLUGIN_ID}.settings.schedule`,
+            defaultMessage: "Schedule"
+          },
+          id: "schedule",
+          to: `${PLUGIN_ID}/schedule`,
+          Component: async () => {
+            const { SchedulePage } = await import("./SchedulePage-Bl0OZTNc.mjs");
+            return { default: SchedulePage };
+          }
+        }
+      ]
+    );
+    app.registerPlugin({
+      id: PLUGIN_ID,
+      initializer: Initializer,
+      isReady: false,
+      name: PLUGIN_ID
+    });
+  },
+  bootstrap(app) {
+    const contentManagerApis = app.getPlugin("content-manager").apis;
+    contentManagerApis.addEditViewSidePanel([TimelinePanel]);
+  },
+  async registerTrads({ locales }) {
+    return Promise.all(
+      locales.map(async (locale) => {
+        try {
+          const { default: data } = await __variableDynamicImportRuntimeHelper(/* @__PURE__ */ Object.assign({ "./translations/en.json": () => import("./en-Byx4XI2L.mjs") }), `./translations/${locale}.json`, 3);
+          return { data, locale };
+        } catch {
+          return { data: {}, locale };
+        }
+      })
+    );
+  }
+};
+export {
+  PLUGIN_ID as P,
+  RestoreDiffTable as R,
+  TimelineDetailModal as T,
+  index as i
+};