@thinhnd028/strapi-plugin-presence 0.0.1

package/README.md

@@ -0,0 +1,53 @@
+# Strapi 5 Real-Time Presence Plugin
+
+A premium real-time presence plugin for Strapi 5 that allows content creators to see who else is currently viewing or editing the same entry in the Content Manager.
+
+## Features
+
+- **Real-Time Tracking**: Instant updates when users join or leave a content entry.
+- **Premium UI**: Modern glassmorphism design that integrates seamlessly with Strapi 5's admin panel.
+- **Unique User Identity**:
+  - Automatically identifies users via Strapi 5's cookie-based authentication.
+  - Generates unique initials and persistent colors for each user.
+  - Interactive tooltips showing full usernames.
+- **Deduplication**: Handles multiple open tabs from the same user by showing only one avatar.
+- **Optimized Performance**: Uses Socket.io for low-latency communication with fallback support.
+
+## Technical Details
+
+- **Frontend**: React-based component injected into the `right-links` zone of the Content Manager.
+- **Backend**: Socket.io server integrated into the Strapi lifecycle.
+- **Authentication**: Compatible with Strapi 5's new security model (JWT stored in cookies).
+
+## Installation & Setup
+
+1.  **Build the Plugin**:
+    ```bash
+    cd src/plugins/presence
+    npm install
+    npm run build
+    ```
+
+2.  **Enable the Plugin**: Ensure the plugin is enabled in your `config/plugins.ts`:
+    ```typescript
+    export default ({ env }) => ({
+      presence: {
+        enabled: true,
+        resolve: './src/plugins/presence'
+      },
+    });
+    ```
+
+3.  **Rebuild Strapi Admin**:
+    ```bash
+    npm run build
+    npm run dev # or npm run staging
+    ```
+
+## Development
+
+The main presence component is located at `admin/src/components/PresenceAvatars.tsx`. It uses standard HTML/CSS for styling to ensure maximum stability and zero conflicts with fluctuating `@strapi/design-system` versions.
+
+## License
+
+MIT

package/dist/admin/index.js

@@ -0,0 +1,252 @@
+"use strict";
+const jsxRuntime = require("react/jsx-runtime");
+const react = require("react");
+const reactRouterDom = require("react-router-dom");
+const socket_ioClient = require("socket.io-client");
+const avatarColors = [
+  "#4945ff",
+  // Strapi Purple
+  "#32d08d",
+  // Green
+  "#ff5d5d",
+  // Red
+  "#ffb54d",
+  // Orange
+  "#a155ff",
+  // Violet
+  "#211fad",
+  // Dark Blue
+  "#007bff"
+  // Sky Blue
+];
+const PresenceAvatars = () => {
+  const params = reactRouterDom.useParams();
+  const entryId = params.id || params.documentId || params.slug;
+  const [allUsers, setAllUsers] = react.useState([]);
+  const [currentUser, setCurrentUser] = react.useState(null);
+  const [isConnected, setIsConnected] = react.useState(false);
+  react.useEffect(() => {
+    const getCookie = (name) => {
+      const value = `; ${document.cookie}`;
+      const parts = value.split(`; ${name}=`);
+      if (parts.length === 2) return parts.pop()?.split(";").shift();
+      return null;
+    };
+    const fetchMe = async () => {
+      try {
+        const token = getCookie("jwtToken") || localStorage.getItem("jwtToken");
+        const response = await fetch(`${window.location.origin}/admin/users/me`, {
+          headers: token ? { "Authorization": `Bearer ${token}` } : {}
+        });
+        if (response.ok) {
+          const resData = await response.json();
+          setCurrentUser({
+            id: resData.data.id || Math.random(),
+            username: resData.data.firstname || resData.data.username || "Admin",
+            initials: (resData.data.firstname?.[0] || "A").toUpperCase()
+          });
+        } else {
+          setCurrentUser({
+            id: "anon-" + Math.random().toString(36).substring(2, 7),
+            username: "Someone",
+            initials: "?"
+          });
+        }
+      } catch (err) {
+      }
+    };
+    fetchMe();
+  }, []);
+  const socket = react.useMemo(() => {
+    try {
+      return socket_ioClient.io(window.location.origin, { transports: ["websocket", "polling"] });
+    } catch {
+      return null;
+    }
+  }, []);
+  react.useEffect(() => {
+    if (!socket || !entryId || !currentUser) return;
+    const onConnect = () => {
+      setIsConnected(true);
+      socket.emit("join-entry", { entryId, user: currentUser });
+    };
+    const onUpdate = (users) => {
+      const uniqueUsers = Array.from(new Map((users || []).map((u) => [u.id, u])).values());
+      setAllUsers(uniqueUsers);
+    };
+    const onDisconnect = () => setIsConnected(false);
+    socket.on("connect", onConnect);
+    socket.on("presence-update", onUpdate);
+    socket.on("disconnect", onDisconnect);
+    if (socket.connected) onConnect();
+    return () => {
+      socket.off("connect", onConnect);
+      socket.off("presence-update", onUpdate);
+      socket.off("disconnect", onDisconnect);
+      socket.disconnect();
+    };
+  }, [entryId, currentUser, socket]);
+  if (!entryId) return null;
+  const getColor = (id) => {
+    const strId = String(id);
+    let hash = 0;
+    for (let i = 0; i < strId.length; i++) {
+      hash = strId.charCodeAt(i) + ((hash << 5) - hash);
+    }
+    return avatarColors[Math.abs(hash) % avatarColors.length];
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "presence-root-container", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("style", { children: `
+                .presence-root-container {
+                    padding: 8px 0 0 0;
+                    margin-bottom: 0px;
+                    width: 100%;
+                    display: flex;
+                    flex-direction: column;
+                    align-items: flex-start;
+                    justify-content: flex-start;
+                    text-align: left;
+                    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
+                }
+                .presence-header {
+                    display: flex;
+                    align-items: center;
+                    justify-content: flex-start;
+                    gap: 6px;
+                    margin-bottom: 10px;
+                    width: 100%;
+                }
+                .presence-title {
+                    font-size: 11px;
+                    font-weight: 800;
+                    color: #4945ff;
+                    letter-spacing: 0.05em;
+                    text-transform: uppercase;
+                    margin: 0;
+                }
+                .presence-status-dot {
+                    width: 7px;
+                    height: 7px;
+                    border-radius: 50%;
+                    background: #32d08d;
+                    box-shadow: 0 0 8px rgba(50, 208, 141, 0.4);
+                }
+                .presence-status-dot.active::after {
+                    content: '';
+                    position: absolute;
+                    width: 7px;
+                    height: 7px;
+                    background: inherit;
+                    border-radius: 50%;
+                    animation: presence-pulse 2s infinite;
+                }
+                @keyframes presence-pulse {
+                    0% { transform: scale(1); opacity: 0.8; }
+                    100% { transform: scale(3); opacity: 0; }
+                }
+                .presence-avatar-list {
+                    display: flex;
+                    flex-wrap: wrap;
+                    gap: 6px;
+                    justify-content: flex-start;
+                    align-items: center;
+                    width: 100%;
+                }
+                .presence-avatar-item {
+                    position: relative;
+                    width: 30px;
+                    height: 30px;
+                    border-radius: 50%;
+                    display: flex;
+                    align-items: center;
+                    justify-content: center;
+                    color: white;
+                    font-size: 11px;
+                    font-weight: 700;
+                    cursor: pointer;
+                    transition: transform 0.2s ease;
+                    box-shadow: 0 2px 6px rgba(0,0,0,0.1);
+                }
+                .presence-avatar-item:hover {
+                    transform: translateY(-2px);
+                    z-index: 5;
+                }
+                .presence-tooltip {
+                    position: absolute;
+                    bottom: 100%;
+                    left: 50%;
+                    transform: translateX(-50%) translateY(0);
+                    background: #212134;
+                    color: white;
+                    padding: 5px 10px;
+                    border-radius: 4px;
+                    font-size: 10px;
+                    white-space: nowrap;
+                    opacity: 0;
+                    visibility: hidden;
+                    transition: all 0.2s ease;
+                    pointer-events: none;
+                }
+                .presence-avatar-item:hover .presence-tooltip {
+                    opacity: 1;
+                    visibility: visible;
+                    transform: translateX(-50%) translateY(-8px);
+                }
+                .presence-me-badge {
+                    position: absolute;
+                    bottom: -1px;
+                    right: -1px;
+                    width: 9px;
+                    height: 9px;
+                    background: white;
+                    border-radius: 50%;
+                    display: flex;
+                    align-items: center;
+                    justify-content: center;
+                    border: 1.5px solid #4945ff;
+                }
+                .presence-me-inner {
+                    width: 3px;
+                    height: 3px;
+                    background: #4945ff;
+                    border-radius: 50%;
+                }
+            ` }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "presence-header", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "presence-title", children: "Live Editing" }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: `presence-status-dot ${isConnected ? "active" : ""}`, style: { background: isConnected ? "#32d08d" : "#f5c0b8" } })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "presence-avatar-list", children: !isConnected ? /* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontSize: "11px", color: "#8e8ea9" }, children: "Connecting..." }) : allUsers.length > 0 ? allUsers.map((u, idx) => {
+      const isMe = currentUser && u.id === currentUser.id;
+      return /* @__PURE__ */ jsxRuntime.jsxs(
+        "div",
+        {
+          className: "presence-avatar-item",
+          style: { background: isMe ? "#4945ff" : getColor(u.id) },
+          children: [
+            u.initials,
+            isMe && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "presence-me-badge", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "presence-me-inner" }) }),
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "presence-tooltip", children: [
+              u.username,
+              " ",
+              isMe ? "(You)" : ""
+            ] })
+          ]
+        },
+        `${u.id}-${idx}`
+      );
+    }) : /* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontSize: "11px", color: "#8e8ea9" }, children: "Ready" }) })
+  ] });
+};
+console.log("[Presence] Admin Plugin Index Loading...");
+const index = {
+  register(app) {
+  },
+  bootstrap(app) {
+    app.getPlugin("content-manager").injectComponent("editView", "right-links", {
+      name: "presence-avatars-right",
+      Component: PresenceAvatars
+    });
+  }
+};
+module.exports = index;

package/dist/admin/index.mjs

@@ -0,0 +1,253 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useState, useEffect, useMemo } from "react";
+import { useParams } from "react-router-dom";
+import { io } from "socket.io-client";
+const avatarColors = [
+  "#4945ff",
+  // Strapi Purple
+  "#32d08d",
+  // Green
+  "#ff5d5d",
+  // Red
+  "#ffb54d",
+  // Orange
+  "#a155ff",
+  // Violet
+  "#211fad",
+  // Dark Blue
+  "#007bff"
+  // Sky Blue
+];
+const PresenceAvatars = () => {
+  const params = useParams();
+  const entryId = params.id || params.documentId || params.slug;
+  const [allUsers, setAllUsers] = useState([]);
+  const [currentUser, setCurrentUser] = useState(null);
+  const [isConnected, setIsConnected] = useState(false);
+  useEffect(() => {
+    const getCookie = (name) => {
+      const value = `; ${document.cookie}`;
+      const parts = value.split(`; ${name}=`);
+      if (parts.length === 2) return parts.pop()?.split(";").shift();
+      return null;
+    };
+    const fetchMe = async () => {
+      try {
+        const token = getCookie("jwtToken") || localStorage.getItem("jwtToken");
+        const response = await fetch(`${window.location.origin}/admin/users/me`, {
+          headers: token ? { "Authorization": `Bearer ${token}` } : {}
+        });
+        if (response.ok) {
+          const resData = await response.json();
+          setCurrentUser({
+            id: resData.data.id || Math.random(),
+            username: resData.data.firstname || resData.data.username || "Admin",
+            initials: (resData.data.firstname?.[0] || "A").toUpperCase()
+          });
+        } else {
+          setCurrentUser({
+            id: "anon-" + Math.random().toString(36).substring(2, 7),
+            username: "Someone",
+            initials: "?"
+          });
+        }
+      } catch (err) {
+      }
+    };
+    fetchMe();
+  }, []);
+  const socket = useMemo(() => {
+    try {
+      return io(window.location.origin, { transports: ["websocket", "polling"] });
+    } catch {
+      return null;
+    }
+  }, []);
+  useEffect(() => {
+    if (!socket || !entryId || !currentUser) return;
+    const onConnect = () => {
+      setIsConnected(true);
+      socket.emit("join-entry", { entryId, user: currentUser });
+    };
+    const onUpdate = (users) => {
+      const uniqueUsers = Array.from(new Map((users || []).map((u) => [u.id, u])).values());
+      setAllUsers(uniqueUsers);
+    };
+    const onDisconnect = () => setIsConnected(false);
+    socket.on("connect", onConnect);
+    socket.on("presence-update", onUpdate);
+    socket.on("disconnect", onDisconnect);
+    if (socket.connected) onConnect();
+    return () => {
+      socket.off("connect", onConnect);
+      socket.off("presence-update", onUpdate);
+      socket.off("disconnect", onDisconnect);
+      socket.disconnect();
+    };
+  }, [entryId, currentUser, socket]);
+  if (!entryId) return null;
+  const getColor = (id) => {
+    const strId = String(id);
+    let hash = 0;
+    for (let i = 0; i < strId.length; i++) {
+      hash = strId.charCodeAt(i) + ((hash << 5) - hash);
+    }
+    return avatarColors[Math.abs(hash) % avatarColors.length];
+  };
+  return /* @__PURE__ */ jsxs("div", { className: "presence-root-container", children: [
+    /* @__PURE__ */ jsx("style", { children: `
+                .presence-root-container {
+                    padding: 8px 0 0 0;
+                    margin-bottom: 0px;
+                    width: 100%;
+                    display: flex;
+                    flex-direction: column;
+                    align-items: flex-start;
+                    justify-content: flex-start;
+                    text-align: left;
+                    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
+                }
+                .presence-header {
+                    display: flex;
+                    align-items: center;
+                    justify-content: flex-start;
+                    gap: 6px;
+                    margin-bottom: 10px;
+                    width: 100%;
+                }
+                .presence-title {
+                    font-size: 11px;
+                    font-weight: 800;
+                    color: #4945ff;
+                    letter-spacing: 0.05em;
+                    text-transform: uppercase;
+                    margin: 0;
+                }
+                .presence-status-dot {
+                    width: 7px;
+                    height: 7px;
+                    border-radius: 50%;
+                    background: #32d08d;
+                    box-shadow: 0 0 8px rgba(50, 208, 141, 0.4);
+                }
+                .presence-status-dot.active::after {
+                    content: '';
+                    position: absolute;
+                    width: 7px;
+                    height: 7px;
+                    background: inherit;
+                    border-radius: 50%;
+                    animation: presence-pulse 2s infinite;
+                }
+                @keyframes presence-pulse {
+                    0% { transform: scale(1); opacity: 0.8; }
+                    100% { transform: scale(3); opacity: 0; }
+                }
+                .presence-avatar-list {
+                    display: flex;
+                    flex-wrap: wrap;
+                    gap: 6px;
+                    justify-content: flex-start;
+                    align-items: center;
+                    width: 100%;
+                }
+                .presence-avatar-item {
+                    position: relative;
+                    width: 30px;
+                    height: 30px;
+                    border-radius: 50%;
+                    display: flex;
+                    align-items: center;
+                    justify-content: center;
+                    color: white;
+                    font-size: 11px;
+                    font-weight: 700;
+                    cursor: pointer;
+                    transition: transform 0.2s ease;
+                    box-shadow: 0 2px 6px rgba(0,0,0,0.1);
+                }
+                .presence-avatar-item:hover {
+                    transform: translateY(-2px);
+                    z-index: 5;
+                }
+                .presence-tooltip {
+                    position: absolute;
+                    bottom: 100%;
+                    left: 50%;
+                    transform: translateX(-50%) translateY(0);
+                    background: #212134;
+                    color: white;
+                    padding: 5px 10px;
+                    border-radius: 4px;
+                    font-size: 10px;
+                    white-space: nowrap;
+                    opacity: 0;
+                    visibility: hidden;
+                    transition: all 0.2s ease;
+                    pointer-events: none;
+                }
+                .presence-avatar-item:hover .presence-tooltip {
+                    opacity: 1;
+                    visibility: visible;
+                    transform: translateX(-50%) translateY(-8px);
+                }
+                .presence-me-badge {
+                    position: absolute;
+                    bottom: -1px;
+                    right: -1px;
+                    width: 9px;
+                    height: 9px;
+                    background: white;
+                    border-radius: 50%;
+                    display: flex;
+                    align-items: center;
+                    justify-content: center;
+                    border: 1.5px solid #4945ff;
+                }
+                .presence-me-inner {
+                    width: 3px;
+                    height: 3px;
+                    background: #4945ff;
+                    border-radius: 50%;
+                }
+            ` }),
+    /* @__PURE__ */ jsxs("div", { className: "presence-header", children: [
+      /* @__PURE__ */ jsx("span", { className: "presence-title", children: "Live Editing" }),
+      /* @__PURE__ */ jsx("div", { className: `presence-status-dot ${isConnected ? "active" : ""}`, style: { background: isConnected ? "#32d08d" : "#f5c0b8" } })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "presence-avatar-list", children: !isConnected ? /* @__PURE__ */ jsx("span", { style: { fontSize: "11px", color: "#8e8ea9" }, children: "Connecting..." }) : allUsers.length > 0 ? allUsers.map((u, idx) => {
+      const isMe = currentUser && u.id === currentUser.id;
+      return /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: "presence-avatar-item",
+          style: { background: isMe ? "#4945ff" : getColor(u.id) },
+          children: [
+            u.initials,
+            isMe && /* @__PURE__ */ jsx("div", { className: "presence-me-badge", children: /* @__PURE__ */ jsx("div", { className: "presence-me-inner" }) }),
+            /* @__PURE__ */ jsxs("div", { className: "presence-tooltip", children: [
+              u.username,
+              " ",
+              isMe ? "(You)" : ""
+            ] })
+          ]
+        },
+        `${u.id}-${idx}`
+      );
+    }) : /* @__PURE__ */ jsx("span", { style: { fontSize: "11px", color: "#8e8ea9" }, children: "Ready" }) })
+  ] });
+};
+console.log("[Presence] Admin Plugin Index Loading...");
+const index = {
+  register(app) {
+  },
+  bootstrap(app) {
+    app.getPlugin("content-manager").injectComponent("editView", "right-links", {
+      name: "presence-avatars-right",
+      Component: PresenceAvatars
+    });
+  }
+};
+export {
+  index as default
+};

package/dist/server/index.js

@@ -0,0 +1,44 @@
+"use strict";
+const index = {
+  register() {
+  },
+  async bootstrap({ strapi }) {
+    let Server;
+    try {
+      Server = require("socket.io").Server;
+    } catch (err) {
+      console.error('Socket.io not found. Please run "npm install socket.io" in the backend directory.');
+      return;
+    }
+    const io = new Server(strapi.server.httpServer, {
+      cors: {
+        origin: "*",
+        // In production, restrict this to your admin URL
+        methods: ["GET", "POST"]
+      }
+    });
+    const activeUsers = /* @__PURE__ */ new Map();
+    io.on("connection", (socket) => {
+      socket.on("join-entry", ({ entryId, user }) => {
+        activeUsers.set(socket.id, { entryId, ...user });
+        socket.join(`entry-${entryId}`);
+        const usersInRoom = Array.from(activeUsers.values()).filter((u) => u.entryId === entryId);
+        io.to(`entry-${entryId}`).emit("presence-update", usersInRoom);
+        console.log(`[Presence] User ${user.username} joined entry ${entryId}`);
+      });
+      socket.on("disconnect", () => {
+        const user = activeUsers.get(socket.id);
+        if (user) {
+          const { entryId } = user;
+          activeUsers.delete(socket.id);
+          const usersInRoom = Array.from(activeUsers.values()).filter((u) => u.entryId === entryId);
+          io.to(`entry-${entryId}`).emit("presence-update", usersInRoom);
+          console.log(`[Presence] User ${user.username} left`);
+        }
+      });
+    });
+    strapi.io = io;
+    console.log("[Presence] Socket.io server initialized");
+  }
+};
+module.exports = index;

package/dist/server/index.mjs

@@ -0,0 +1,45 @@
+const index = {
+  register() {
+  },
+  async bootstrap({ strapi }) {
+    let Server;
+    try {
+      Server = require("socket.io").Server;
+    } catch (err) {
+      console.error('Socket.io not found. Please run "npm install socket.io" in the backend directory.');
+      return;
+    }
+    const io = new Server(strapi.server.httpServer, {
+      cors: {
+        origin: "*",
+        // In production, restrict this to your admin URL
+        methods: ["GET", "POST"]
+      }
+    });
+    const activeUsers = /* @__PURE__ */ new Map();
+    io.on("connection", (socket) => {
+      socket.on("join-entry", ({ entryId, user }) => {
+        activeUsers.set(socket.id, { entryId, ...user });
+        socket.join(`entry-${entryId}`);
+        const usersInRoom = Array.from(activeUsers.values()).filter((u) => u.entryId === entryId);
+        io.to(`entry-${entryId}`).emit("presence-update", usersInRoom);
+        console.log(`[Presence] User ${user.username} joined entry ${entryId}`);
+      });
+      socket.on("disconnect", () => {
+        const user = activeUsers.get(socket.id);
+        if (user) {
+          const { entryId } = user;
+          activeUsers.delete(socket.id);
+          const usersInRoom = Array.from(activeUsers.values()).filter((u) => u.entryId === entryId);
+          io.to(`entry-${entryId}`).emit("presence-update", usersInRoom);
+          console.log(`[Presence] User ${user.username} left`);
+        }
+      });
+    });
+    strapi.io = io;
+    console.log("[Presence] Socket.io server initialized");
+  }
+};
+export {
+  index as default
+};

package/package.json

@@ -0,0 +1,67 @@
+{
+  "name": "@thinhnd028/strapi-plugin-presence",
+  "version": "0.0.1",
+  "description": "Real-time presence for Strapi 5 Admin Panel",
+  "author": "Tai Nguyen",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/thinhnd028/strapi-plugin-presence.git"
+  },
+  "publishConfig": {
+    "registry": "https://registry.npmjs.org/",
+    "access": "public"
+  },
+  "files": [
+    "dist/",
+    "package.json",
+    "README.md",
+    "strapi-admin.ts",
+    "strapi-server.ts"
+  ],
+  "strapi": {
+    "kind": "plugin",
+    "name": "presence",
+    "displayName": "Presence",
+    "description": "Real-time presence for Strapi 5 Admin Panel"
+  },
+  "dependencies": {
+    "socket.io": "^4.7.2",
+    "socket.io-client": "^4.7.2"
+  },
+  "devDependencies": {
+    "@strapi/sdk-plugin": "^5.2.0",
+    "@types/react": "^18.0.0",
+    "@types/react-dom": "^18.0.0",
+    "typescript": "^5.0.0"
+  },
+  "peerDependencies": {
+    "@strapi/strapi": "^5.0.0",
+    "react": "^17.0.0 || ^18.0.0",
+    "react-dom": "^17.0.0 || ^18.0.0",
+    "react-router-dom": "^6.0.0"
+  },
+  "scripts": {
+    "build": "strapi-plugin build",
+    "watch": "strapi-plugin watch",
+    "verify": "strapi-plugin verify"
+  },
+  "type": "commonjs",
+  "exports": {
+    "./package.json": "./package.json",
+    "./strapi-admin": {
+      "types": "./dist/admin/src/index.d.ts",
+      "source": "./admin/src/index.ts",
+      "import": "./dist/admin/index.mjs",
+      "require": "./dist/admin/index.js",
+      "default": "./dist/admin/index.js"
+    },
+    "./strapi-server": {
+      "types": "./dist/server/src/index.d.ts",
+      "source": "./server/index.ts",
+      "import": "./dist/server/index.mjs",
+      "require": "./dist/server/index.js",
+      "default": "./dist/server/index.js"
+    }
+  }
+}

package/strapi-admin.ts

@@ -0,0 +1 @@
+export { default } from './admin/src';

package/strapi-server.ts

@@ -0,0 +1 @@
+export { default } from './server';