@simmalugnt-se/payload-editor-assistant 0.1.0

package/dist/styles/assistant.css

@@ -0,0 +1,362 @@
+.ea-root {
+  --ea-aside-width: 400px;
+  position: fixed;
+  inset: 0;
+  display: flex;
+  height: 100%;
+  max-height: 100dvh;
+  overflow: hidden;
+}
+
+.ea-root--collapsed {
+  --ea-aside-width: 48px;
+}
+
+html:has(.ea-root),
+html:has(.ea-root) body {
+  height: 100%;
+  max-height: 100dvh;
+  overflow: hidden;
+}
+
+.ea-main {
+  flex: 1;
+  min-width: 0;
+  min-height: 0;
+  height: 100%;
+  overflow: auto;
+}
+
+.ea-main .template-default {
+  min-height: 100%;
+}
+
+.ea-aside {
+  box-sizing: border-box;
+  display: flex;
+  flex-direction: column;
+  flex: 0 0 var(--ea-aside-width);
+  width: var(--ea-aside-width);
+  height: 100%;
+  max-height: 100%;
+  overflow: hidden;
+  border-inline-start: 1px solid var(--theme-elevation-150);
+  background: var(--theme-bg, var(--theme-elevation-0));
+  color: var(--theme-text);
+  font-size: 13px;
+  line-height: 1.45;
+}
+
+.ea-aside__rail {
+  writing-mode: vertical-rl;
+  transform: rotate(180deg);
+  width: 100%;
+  height: 100%;
+  border: 0;
+  background: var(--theme-elevation-50);
+  color: var(--theme-elevation-800);
+  cursor: pointer;
+  letter-spacing: 0.14em;
+  text-transform: uppercase;
+  font: inherit;
+  font-size: 12px;
+}
+
+.ea-aside__rail:hover {
+  color: var(--theme-text);
+  background: var(--theme-elevation-100);
+}
+
+.ea-btn {
+  appearance: none;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  margin: 0;
+  border: 1px solid var(--theme-elevation-150);
+  background: var(--theme-elevation-50);
+  color: var(--theme-text);
+  border-radius: var(--style-radius-s, 3px);
+  padding: 5px 10px;
+  font: inherit;
+  font-size: 12px;
+  font-weight: 500;
+  line-height: 1.2;
+  cursor: pointer;
+}
+
+.ea-btn:hover {
+  background: var(--theme-elevation-100);
+}
+
+.ea-btn:disabled {
+  opacity: 0.45;
+  cursor: not-allowed;
+}
+
+.ea-btn--ghost {
+  border-color: transparent;
+  background: transparent;
+  color: var(--theme-elevation-800);
+}
+
+.ea-btn--ghost:hover {
+  background: var(--theme-elevation-100);
+  color: var(--theme-text);
+}
+
+.ea-btn--primary {
+  border-color: var(--theme-success-500);
+  background: var(--theme-success-500);
+  color: var(--theme-success-50, #fff);
+}
+
+.ea-btn--primary:hover {
+  background: var(--theme-success-600, var(--theme-success-500));
+}
+
+.ea-btn--danger {
+  border-color: var(--theme-error-500);
+  background: var(--theme-error-500);
+  color: #fff;
+}
+
+.ea-btn--danger:hover {
+  background: var(--theme-error-600, var(--theme-error-500));
+}
+
+.ea-btn--stop {
+  border-color: var(--theme-elevation-150);
+  background: transparent;
+  color: var(--theme-error-500);
+}
+
+.ea-btn--stop:hover {
+  background: var(--theme-error-50, var(--theme-elevation-100));
+}
+
+.ea-btn--chip {
+  border-radius: 999px;
+  background: transparent;
+  color: var(--theme-elevation-800);
+  padding: 3px 9px;
+}
+
+.ea-btn--chip:hover {
+  color: var(--theme-text);
+  border-color: var(--theme-elevation-400, var(--theme-elevation-150));
+}
+
+.ea-aside__head {
+  display: flex;
+  align-items: center;
+  gap: 4px;
+  flex-shrink: 0;
+  padding: 8px 10px 8px 14px;
+  border-bottom: 1px solid var(--theme-elevation-150);
+}
+
+.ea-aside__head h2 {
+  flex: 1;
+  margin: 0;
+  font-size: 11px;
+  font-weight: 600;
+  letter-spacing: 0.08em;
+  text-transform: uppercase;
+  color: var(--theme-elevation-800);
+}
+
+.ea-aside__body {
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+  min-height: 0;
+  overflow: hidden;
+}
+
+.ea-context {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  flex-shrink: 0;
+  padding: 8px 14px;
+  border-bottom: 1px solid var(--theme-elevation-150);
+  color: var(--theme-elevation-800);
+  font-size: 11px;
+}
+
+.ea-context span + span::before {
+  content: "·";
+  margin: 0 6px;
+  color: var(--theme-elevation-400, var(--theme-elevation-150));
+}
+
+.ea-context__warn {
+  color: var(--theme-warning-600, var(--theme-warning-500));
+}
+
+.ea-context__ok {
+  color: var(--theme-success-600, var(--theme-success-500));
+}
+
+.ea-messages {
+  flex: 1;
+  min-height: 0;
+  overflow: auto;
+  overscroll-behavior: contain;
+  padding: 14px;
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+}
+
+.ea-msg {
+  max-width: 92%;
+  padding: 9px 11px;
+  border-radius: 8px;
+  border: 1px solid var(--theme-elevation-150);
+  background: var(--theme-elevation-50);
+}
+
+.ea-msg--user {
+  align-self: flex-end;
+  background: var(--theme-elevation-100);
+}
+
+.ea-msg--assistant {
+  align-self: flex-start;
+}
+
+.ea-msg--system {
+  align-self: stretch;
+  max-width: none;
+  background: transparent;
+  border: 0;
+  color: var(--theme-elevation-800);
+  font-size: 12px;
+  padding: 2px 0;
+}
+
+.ea-approval {
+  flex-shrink: 0;
+  padding: 12px 14px;
+  border-top: 1px solid var(--theme-warning-300, var(--theme-elevation-150));
+  background: var(--theme-warning-50, var(--theme-elevation-50));
+}
+
+.ea-approval h3 {
+  margin: 0 0 8px;
+  font-size: 13px;
+}
+
+.ea-msg--working {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  color: var(--theme-elevation-800);
+}
+
+.ea-approval__diff {
+  max-height: 40vh;
+  overflow-y: auto;
+  margin: 0 0 10px;
+  padding-left: 1.1em;
+  font-size: 13px;
+}
+
+.ea-approval__sub {
+  list-style: none;
+  margin-left: 0.4em;
+  padding-left: 0.6em;
+  border-left: 2px solid var(--theme-elevation-150);
+  color: var(--theme-elevation-800);
+}
+
+.ea-approval pre {
+  margin: 0 0 10px;
+  white-space: pre-wrap;
+  font-size: 12px;
+  font-family: var(--font-mono, ui-monospace, monospace);
+}
+
+.ea-actions {
+  display: flex;
+  gap: 8px;
+  flex-wrap: wrap;
+  margin-top: 8px;
+}
+
+.ea-status {
+  flex-shrink: 0;
+  padding: 8px 14px;
+  color: var(--theme-error-500);
+  font-size: 12px;
+}
+
+.ea-composer {
+  flex-shrink: 0;
+  padding: 10px 14px 12px;
+  border-top: 1px solid var(--theme-elevation-150);
+  background: var(--theme-elevation-50);
+}
+
+.ea-shortcuts {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 6px;
+  margin-bottom: 8px;
+}
+
+.ea-composer__box {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+  border: 1px solid var(--theme-elevation-150);
+  border-radius: var(--style-radius-m, 4px);
+  background: var(--theme-input-bg, var(--theme-elevation-0));
+  padding: 8px 10px;
+}
+
+.ea-composer__box:focus-within {
+  border-color: var(--theme-elevation-400, var(--theme-elevation-150));
+}
+
+.ea-composer textarea {
+  width: 100%;
+  box-sizing: border-box;
+  resize: none;
+  border: 0;
+  background: transparent;
+  color: var(--theme-text);
+  padding: 0;
+  font: inherit;
+  min-height: 40px;
+  outline: none;
+}
+
+.ea-composer textarea:focus,
+.ea-composer textarea:focus-visible {
+  outline: none;
+  box-shadow: none;
+}
+
+.ea-composer textarea:disabled {
+  opacity: 0.7;
+}
+
+.ea-composer__bar {
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  gap: 8px;
+}
+
+.ea-composer__status {
+  margin-right: auto;
+  color: var(--theme-elevation-800);
+  font-size: 12px;
+}
+
+.ea-trigger {
+  margin-inline: 8px;
+}

package/dist/types.d.ts

@@ -0,0 +1,61 @@
+import type { EntityCapability } from "./capabilities.ts";
+import type { AdminViewKind } from "./view.ts";
+export type HostLanguageModel = object;
+export type ModelResolver = (args: {
+    userId?: string | number;
+}) => HostLanguageModel | Promise<HostLanguageModel>;
+export type FieldAllowlist = true | {
+    include: string[];
+} | {
+    exclude: string[];
+};
+export type EntityAllowlist = {
+    capabilities: EntityCapability[];
+    fields?: FieldAllowlist;
+};
+export type AssistantShortcut = {
+    id: string;
+    label: string;
+    prompt: string;
+    /** Admin views where the shortcut is shown. Omit to show it everywhere. */
+    when?: AdminViewKind[];
+    /** Collection or global slugs where the shortcut is shown. Views without an entity (dashboard) are not filtered. */
+    entities?: string[];
+};
+export type HostToolRisk = "auto" | "approval" | "forbidden";
+export type HostToolDefinition = {
+    id: string;
+    capabilityId: string;
+    risk?: HostToolRisk;
+    mcp?: boolean;
+};
+export type ProposalValidationResult = {
+    ok: true;
+} | {
+    ok: false;
+    errors: string[];
+};
+export type EditorAssistantPluginOptions = {
+    disabled?: boolean;
+    model?: HostLanguageModel | ModelResolver;
+    collections?: Record<string, EntityAllowlist>;
+    globals?: Record<string, EntityAllowlist>;
+    denyFields?: string[];
+    instructions?: string;
+    shortcuts?: AssistantShortcut[];
+    tools?: HostToolDefinition[];
+    validateProposal?: (input: unknown) => ProposalValidationResult | Promise<ProposalValidationResult>;
+    redact?: (input: {
+        slug: string;
+        data: Record<string, unknown>;
+    }) => Record<string, unknown>;
+    enabled?: (ctx: {
+        userId?: string | number;
+    }) => boolean | Promise<boolean>;
+    trustedOrigins?: string[];
+    audit?: {
+        collection?: string;
+        retentionDays?: number;
+    };
+};
+export declare function defineEditorAssistantConfig<T extends EditorAssistantPluginOptions>(options: T): T;

package/dist/types.js

@@ -0,0 +1,3 @@
+export function defineEditorAssistantConfig(options) {
+    return options;
+}

package/dist/view.d.ts

@@ -0,0 +1,22 @@
+export type AdminView = {
+    kind: "dashboard";
+} | {
+    kind: "list";
+    collection: string;
+} | {
+    kind: "document";
+    collection: string;
+    documentId?: string;
+} | {
+    kind: "global";
+    global: string;
+} | {
+    kind: "other";
+};
+export type AdminViewKind = AdminView["kind"];
+export declare function parseAdminView(pathname: string, adminRoute?: string): AdminView;
+/** Keep only views that point at something the host allowlisted. */
+export declare function sanitizeAdminView(value: unknown, allowed: {
+    collections: Record<string, unknown>;
+    globals: Record<string, unknown>;
+}): AdminView;

package/dist/view.js

@@ -0,0 +1,72 @@
+const RESERVED_DOCUMENT_SEGMENTS = new Set(["create"]);
+export function parseAdminView(pathname, adminRoute = "/admin") {
+    const base = trimSlashes(adminRoute);
+    const path = trimSlashes(pathname.split(/[?#]/)[0] ?? "");
+    const rest = base ? stripPrefix(path, base) : path;
+    if (rest === undefined) {
+        return { kind: "other" };
+    }
+    const segments = rest.split("/").filter(Boolean).map(safeDecode);
+    if (segments.length === 0) {
+        return { kind: "dashboard" };
+    }
+    const [section, slug, id] = segments;
+    if (section === "collections" && slug) {
+        if (!id) {
+            return { kind: "list", collection: slug };
+        }
+        return RESERVED_DOCUMENT_SEGMENTS.has(id)
+            ? { kind: "document", collection: slug }
+            : { kind: "document", collection: slug, documentId: id };
+    }
+    if (section === "globals" && slug) {
+        return { kind: "global", global: slug };
+    }
+    return { kind: "other" };
+}
+/** Keep only views that point at something the host allowlisted. */
+export function sanitizeAdminView(value, allowed) {
+    if (!value || typeof value !== "object") {
+        return { kind: "other" };
+    }
+    const view = value;
+    const has = (record, key) => typeof key === "string" && Object.hasOwn(record, key);
+    switch (view.kind) {
+        case "dashboard":
+            return { kind: "dashboard" };
+        case "list":
+            return has(allowed.collections, view.collection)
+                ? { kind: "list", collection: view.collection }
+                : { kind: "other" };
+        case "document":
+            if (!has(allowed.collections, view.collection)) {
+                return { kind: "other" };
+            }
+            return typeof view.documentId === "string"
+                ? { kind: "document", collection: view.collection, documentId: view.documentId }
+                : { kind: "document", collection: view.collection };
+        case "global":
+            return has(allowed.globals, view.global)
+                ? { kind: "global", global: view.global }
+                : { kind: "other" };
+        default:
+            return { kind: "other" };
+    }
+}
+function trimSlashes(value) {
+    return value.replace(/^\/+|\/+$/g, "");
+}
+function stripPrefix(path, base) {
+    if (path === base) {
+        return "";
+    }
+    return path.startsWith(`${base}/`) ? path.slice(base.length + 1) : undefined;
+}
+function safeDecode(segment) {
+    try {
+        return decodeURIComponent(segment);
+    }
+    catch {
+        return segment;
+    }
+}

package/package.json

@@ -0,0 +1,73 @@
+{
+  "name": "@simmalugnt-se/payload-editor-assistant",
+  "version": "0.1.0",
+  "description": "Context-aware editor assistant plugin for Payload Admin",
+  "keywords": [
+    "payload",
+    "payload-plugin"
+  ],
+  "license": "MIT",
+  "author": "Simmalugnt AB",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/simmalugnt-se/payload-plugins.git",
+    "directory": "packages/payload-editor-assistant"
+  },
+  "type": "module",
+  "engines": {
+    "node": ">=22"
+  },
+  "files": [
+    "dist"
+  ],
+  "sideEffects": [
+    "*.css"
+  ],
+  "exports": {
+    ".": {
+      "import": "./dist/index.js",
+      "types": "./dist/index.d.ts",
+      "default": "./dist/index.js"
+    },
+    "./client": {
+      "import": "./dist/exports/client.js",
+      "types": "./dist/exports/client.d.ts",
+      "default": "./dist/exports/client.js"
+    }
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "peerDependencies": {
+    "@payloadcms/ui": ">=3.87.1 <4",
+    "ai": "^7.0.0",
+    "next": ">=16.2.6 <17",
+    "payload": ">=3.87.1 <4",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0"
+  },
+  "peerDependenciesMeta": {
+    "next": {
+      "optional": true
+    }
+  },
+  "devDependencies": {
+    "@payloadcms/ui": "3.87.1",
+    "@types/node": "^22",
+    "@types/react": "^19.2.18",
+    "@types/react-dom": "^19.2.4",
+    "next": "16.3.0",
+    "payload": "3.87.1",
+    "react": "19.2.8",
+    "react-dom": "19.2.8",
+    "tsx": "^4.21.0",
+    "typescript": "5.9.3"
+  },
+  "scripts": {
+    "build": "rm -rf dist && tsc -p tsconfig.build.json && cp -R src/styles dist/styles",
+    "test": "tsx --test tests/*.test.ts",
+    "typecheck": "tsc --noEmit"
+  },
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts"
+}