@agent-native/core 0.109.3 → 0.109.4

package/corpus/core/src/collab/agent-identity.ts

@@ -1,22 +1,5 @@
-/**
- * Canonical agent identity constants for collaborative editing.
- *
- * Centralizes the agent's client ID, name, email, and cursor color
- * so templates don't hardcode these values.
- */
-
-export const AGENT_CLIENT_ID = 2147483647; // Max 32-bit signed int, reserved for agent
-
-export interface AgentIdentity {
-  clientId: number;
-  name: string;
-  email: string;
-  color: string;
-}
-
-export const DEFAULT_AGENT_IDENTITY: AgentIdentity = {
-  clientId: AGENT_CLIENT_ID,
-  name: "AI Assistant",
-  email: "agent@system",
-  color: "#00B5FF", // agent-native blue
-};
+export {
+  AGENT_CLIENT_ID,
+  DEFAULT_AGENT_IDENTITY,
+  type AgentIdentity,
+} from "@agent-native/toolkit/collab-ui";

package/corpus/core/src/collab/client.ts

@@ -45,12 +45,11 @@ import * as Y from "yjs";
 
 import { agentNativePath } from "../client/api-path.js";
 import { subscribeSyncEvents, type SyncEvent } from "../client/use-db-sync.js";
-import { AGENT_CLIENT_ID } from "./agent-identity.js";
-
 export {
   dedupeCollabUsersByEmail,
   emailToColor,
   emailToName,
+  isReconcileLeadClient,
   type CollabUser,
 } from "@agent-native/toolkit/collab-ui";
 
@@ -119,57 +118,6 @@ function collabUsersEqual(a: CollabUser[], b: CollabUser[]): boolean {
   return true;
 }
 
-/**
- * Leader election for applying authoritative external snapshots into a shared
- * collaborative document.
- *
- * When the agent (or a Notion pull, or any full-document rewrite) writes new
- * content to SQL, the open editor reconciles it into the live Y.Doc with
- * `setContent`. If EVERY connected client did that independently, each would
- * diff the same snapshot into the CRDT and the changed region would be inserted
- * N times (concurrent inserts at the same position → duplicated text). So only
- * ONE client — the "lead" — applies the snapshot; every other client receives
- * the result through normal Yjs sync.
- *
- * The lead is the present client with the lowest Yjs `clientID`. The agent's
- * awareness entry uses `AGENT_CLIENT_ID` (max int) so it can never be the lead,
- * and a client editing alone is always the lead. This is deterministic across
- * clients with no coordination round-trip.
- */
-export function isReconcileLeadClient(
-  awareness: Awareness | null | undefined,
-  localClientId: number | null | undefined,
-): boolean {
-  if (localClientId == null) return false;
-  if (!awareness) return true; // standalone / tests — act alone
-
-  let hasPeer = false;
-  let minVisible = localClientId;
-  awareness.getStates().forEach((state, clientId) => {
-    if (clientId === AGENT_CLIENT_ID) return; // agent never leads
-    if (clientId === localClientId) return;
-    const s = state as { user?: unknown; visible?: boolean };
-    if (!s || !s.user) return; // skip empty/stale entries
-    hasPeer = true;
-    // Only VISIBLE peers can act; a peer published `visible: false` (backgrounded)
-    // is skipped. A peer that hasn't published the field is treated as visible.
-    if (s.visible !== false && clientId < minVisible) minVisible = clientId;
-  });
-
-  // Sole client: always the applier — no other client can duplicate the edit,
-  // so single-user agent edits apply even if this tab reports hidden.
-  if (!hasPeer) return true;
-
-  // With peers present, exactly one VISIBLE client applies (the lowest clientId
-  // among visible ones). A backgrounded tab pauses its poll and can't reliably
-  // act, so it yields — otherwise an agent edit would never reach the tab the
-  // user is actually looking at. The caller re-elects on visibility change.
-  const localHidden =
-    typeof document !== "undefined" && document.visibilityState === "hidden";
-  if (localHidden) return false;
-  return localClientId <= minVisible;
-}
-
 export interface RemoteAwarenessSnapshot {
   clientId: number;
   state: unknown;

package/corpus/core/src/styles/rich-markdown-editor.css

@@ -1,510 +1 @@
-.an-rich-md-wrapper {
-  min-height: 100%;
-  position: relative;
-  cursor: text;
-}
-
-.an-rich-md-wrapper--readonly {
-  cursor: default;
-}
-
-.an-rich-md-loading {
-  min-height: 7rem;
-}
-
-.an-rich-md-prose {
-  outline: none;
-  color: hsl(var(--foreground));
-  line-height: 1.65;
-  font-size: 0.95rem;
-  min-height: 1.65em;
-  text-align: start;
-}
-
-.an-rich-md-prose > *:first-child {
-  margin-top: 0;
-}
-
-.an-rich-md-prose h1 {
-  font-size: 1.85em;
-  font-weight: 700;
-  margin: 1em 0 0.3em;
-  line-height: 1.18;
-}
-
-.an-rich-md-prose h2 {
-  font-size: 1.45em;
-  font-weight: 650;
-  margin: 0.9em 0 0.25em;
-  line-height: 1.25;
-}
-
-.an-rich-md-prose h3 {
-  font-size: 1.18em;
-  font-weight: 650;
-  margin: 0.75em 0 0.2em;
-  line-height: 1.32;
-}
-
-.an-rich-md-prose h4 {
-  font-size: 1em;
-  font-weight: 650;
-  margin: 0.65em 0 0.15em;
-  line-height: 1.35;
-}
-
-.an-rich-md-prose p {
-  margin: 0.45em 0;
-  min-height: 1.65em;
-}
-
-.an-rich-md-prose ul:not(.an-rich-md-task-list),
-.an-rich-md-prose ol {
-  padding-inline-start: 1.45em;
-  margin: 0.35em 0;
-}
-
-.an-rich-md-prose ul:not(.an-rich-md-task-list) {
-  list-style-type: disc;
-}
-
-.an-rich-md-prose ol {
-  list-style-type: decimal;
-}
-
-.an-rich-md-prose li {
-  margin: 0.12em 0;
-}
-
-.an-rich-md-prose li p {
-  margin: 0;
-}
-
-.an-rich-md-task-list {
-  list-style: none;
-  margin: 0.35em 0;
-  padding-inline-start: 0;
-}
-
-.an-rich-md-task-list li {
-  display: flex;
-  align-items: flex-start;
-  gap: 0.45em;
-  margin: 0.18em 0;
-}
-
-.an-rich-md-task-list li label {
-  display: inline-flex;
-  align-items: center;
-  height: 1.65em;
-}
-
-.an-rich-md-task-list li input[type="checkbox"] {
-  width: 0.95em;
-  height: 0.95em;
-  accent-color: hsl(var(--primary));
-}
-
-.an-rich-md-task-list li > div {
-  flex: 1;
-}
-
-.an-rich-md-prose blockquote {
-  border-inline-start: 2px solid hsl(var(--border));
-  padding-inline-start: 0.9em;
-  margin: 0.45em 0;
-  color: hsl(var(--muted-foreground));
-}
-
-.an-rich-md-prose code {
-  unicode-bidi: isolate;
-  font-family:
-    ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
-  font-size: 0.88em;
-  background: hsl(var(--muted));
-  padding: 0.12em 0.32em;
-  border-radius: 4px;
-}
-
-.an-rich-md-prose :not(pre) > code {
-  direction: ltr;
-}
-
-.an-rich-md-prose pre {
-  font-family:
-    ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
-  font-size: 0.86em;
-  /* Theme-aware code surface: follows the app's muted/foreground/border tokens
-     so block code respects light and dark mode (the token palette below is
-     tuned to read on a muted surface in both). */
-  background: hsl(var(--muted));
-  color: hsl(var(--foreground));
-  border: 1px solid hsl(var(--border));
-  border-radius: 6px;
-  padding: 0.8em 1em;
-  margin: 0.55em 0;
-  overflow-x: auto;
-  line-height: 1.5;
-}
-
-.an-rich-md-prose pre code {
-  background: none;
-  border: none;
-  padding: 0;
-  font-size: inherit;
-  color: inherit;
-}
-
-/* highlight.js (lowlight) token palette. Scoped to block code so inline `code`
-   keeps its own background. No highlight.js base theme is imported; these rules
-   are the entire theme, tuned (mid-lightness HSL) to read on the muted surface
-   above in both light and dark mode. */
-.an-rich-md-prose pre code .hljs-comment,
-.an-rich-md-prose pre code .hljs-quote {
-  color: hsl(var(--muted-foreground));
-  font-style: italic;
-}
-.an-rich-md-prose pre code .hljs-keyword,
-.an-rich-md-prose pre code .hljs-selector-tag,
-.an-rich-md-prose pre code .hljs-literal,
-.an-rich-md-prose pre code .hljs-doctag {
-  color: hsl(280 60% 58%);
-}
-.an-rich-md-prose pre code .hljs-string,
-.an-rich-md-prose pre code .hljs-regexp,
-.an-rich-md-prose pre code .hljs-addition {
-  color: hsl(140 52% 40%);
-}
-.an-rich-md-prose pre code .hljs-number,
-.an-rich-md-prose pre code .hljs-symbol,
-.an-rich-md-prose pre code .hljs-literal {
-  color: hsl(28 78% 48%);
-}
-.an-rich-md-prose pre code .hljs-meta {
-  color: hsl(var(--muted-foreground));
-}
-.an-rich-md-prose pre code .hljs-title,
-.an-rich-md-prose pre code .hljs-title.function_,
-.an-rich-md-prose pre code .hljs-section {
-  color: hsl(210 72% 52%);
-}
-.an-rich-md-prose pre code .hljs-built_in,
-.an-rich-md-prose pre code .hljs-type,
-.an-rich-md-prose pre code .hljs-title.class_,
-.an-rich-md-prose pre code .hljs-variable.language_ {
-  color: hsl(190 64% 40%);
-}
-.an-rich-md-prose pre code .hljs-attr,
-.an-rich-md-prose pre code .hljs-attribute,
-.an-rich-md-prose pre code .hljs-property,
-.an-rich-md-prose pre code .hljs-params {
-  color: hsl(35 68% 46%);
-}
-.an-rich-md-prose pre code .hljs-name,
-.an-rich-md-prose pre code .hljs-tag,
-.an-rich-md-prose pre code .hljs-selector-id,
-.an-rich-md-prose pre code .hljs-selector-class {
-  color: hsl(350 62% 52%);
-}
-.an-rich-md-prose pre code .hljs-deletion {
-  color: hsl(0 62% 52%);
-}
-.an-rich-md-prose pre code .hljs-emphasis {
-  font-style: italic;
-}
-.an-rich-md-prose pre code .hljs-strong {
-  font-weight: 600;
-}
-
-/* In dark mode, lift the token lightness for contrast on the dark muted surface. */
-.dark .an-rich-md-prose pre code .hljs-keyword,
-.dark .an-rich-md-prose pre code .hljs-selector-tag,
-.dark .an-rich-md-prose pre code .hljs-literal,
-.dark .an-rich-md-prose pre code .hljs-doctag {
-  color: hsl(280 72% 72%);
-}
-.dark .an-rich-md-prose pre code .hljs-string,
-.dark .an-rich-md-prose pre code .hljs-regexp,
-.dark .an-rich-md-prose pre code .hljs-addition {
-  color: hsl(140 48% 62%);
-}
-.dark .an-rich-md-prose pre code .hljs-number,
-.dark .an-rich-md-prose pre code .hljs-symbol,
-.dark .an-rich-md-prose pre code .hljs-literal {
-  color: hsl(30 85% 65%);
-}
-.dark .an-rich-md-prose pre code .hljs-title,
-.dark .an-rich-md-prose pre code .hljs-title.function_,
-.dark .an-rich-md-prose pre code .hljs-section {
-  color: hsl(210 80% 70%);
-}
-.dark .an-rich-md-prose pre code .hljs-built_in,
-.dark .an-rich-md-prose pre code .hljs-type,
-.dark .an-rich-md-prose pre code .hljs-title.class_,
-.dark .an-rich-md-prose pre code .hljs-variable.language_ {
-  color: hsl(190 70% 62%);
-}
-.dark .an-rich-md-prose pre code .hljs-attr,
-.dark .an-rich-md-prose pre code .hljs-attribute,
-.dark .an-rich-md-prose pre code .hljs-property,
-.dark .an-rich-md-prose pre code .hljs-params {
-  color: hsl(40 78% 66%);
-}
-.dark .an-rich-md-prose pre code .hljs-name,
-.dark .an-rich-md-prose pre code .hljs-tag,
-.dark .an-rich-md-prose pre code .hljs-selector-id,
-.dark .an-rich-md-prose pre code .hljs-selector-class {
-  color: hsl(350 72% 68%);
-}
-
-.an-rich-md-prose hr {
-  border: none;
-  border-top: 1px solid hsl(var(--border));
-  margin: 1.1em 0;
-}
-
-.an-rich-md-table {
-  width: 100%;
-  border-collapse: collapse;
-  margin: 0.7em 0;
-  table-layout: fixed;
-}
-
-.an-rich-md-table td,
-.an-rich-md-table th {
-  border: 1px solid hsl(var(--border));
-  padding: 0.45em 0.55em;
-  vertical-align: top;
-}
-
-.an-rich-md-table th {
-  background: hsl(var(--muted) / 0.6);
-  font-weight: 650;
-}
-
-.an-rich-md-table p {
-  margin: 0;
-}
-
-.an-rich-md-prose strong {
-  font-weight: 650;
-}
-
-.an-rich-md-prose em {
-  font-style: italic;
-}
-
-.an-rich-md-prose s {
-  text-decoration: line-through;
-}
-
-.an-rich-md-link {
-  color: hsl(var(--foreground));
-  text-decoration: underline;
-  text-underline-offset: 2px;
-  text-decoration-color: hsl(var(--muted-foreground));
-  cursor: pointer;
-}
-
-.an-rich-md-link:hover {
-  text-decoration-color: hsl(var(--foreground));
-}
-
-.an-rich-md-prose p.is-editor-empty:first-child::before,
-.an-rich-md-prose p.is-empty::before,
-.an-rich-md-prose h1.is-empty::before,
-.an-rich-md-prose h2.is-empty::before,
-.an-rich-md-prose h3.is-empty::before,
-.an-rich-md-prose h4.is-empty::before {
-  content: attr(data-placeholder);
-  float: inline-start;
-  color: hsl(var(--muted-foreground));
-  opacity: 0.55;
-  pointer-events: none;
-  height: 0;
-}
-
-.an-rich-md-prose ::selection {
-  background: hsl(var(--ring) / 0.22);
-}
-
-.an-rich-md-bubble-toolbar {
-  z-index: 9999;
-  display: flex;
-  align-items: center;
-  border-radius: 6px;
-  background: hsl(var(--popover));
-  color: hsl(var(--popover-foreground));
-  padding: 3px;
-  box-shadow:
-    0 4px 16px rgb(0 0 0 / 0.25),
-    0 0 0 1px hsl(var(--border));
-}
-
-.an-rich-md-bubble-items,
-.an-rich-md-link-editor {
-  display: flex;
-  align-items: center;
-  gap: 2px;
-}
-
-.an-rich-md-bubble-button {
-  padding: 3px 6px;
-  border-radius: 4px;
-  font-size: 12px;
-  color: hsl(var(--popover-foreground) / 0.76);
-  background: none;
-  border: none;
-  cursor: pointer;
-  line-height: 1;
-}
-
-.an-rich-md-bubble-button:hover {
-  background: hsl(var(--accent));
-  color: hsl(var(--accent-foreground));
-}
-
-.an-rich-md-bubble-button--active {
-  background: hsl(var(--accent));
-  color: hsl(var(--accent-foreground));
-}
-
-.an-rich-md-bubble-divider {
-  width: 1px;
-  height: 16px;
-  margin: 0 2px;
-  background: hsl(var(--border));
-}
-
-.an-rich-md-link-editor {
-  padding: 4px;
-}
-
-.an-rich-md-link-editor input {
-  width: 10rem;
-  border: none;
-  outline: none;
-  background: transparent;
-  color: hsl(var(--popover-foreground));
-  font-size: 12px;
-  padding: 2px 4px;
-}
-
-.an-rich-md-link-editor button {
-  border: none;
-  background: none;
-  color: hsl(var(--primary));
-  cursor: pointer;
-  font-size: 11px;
-  font-weight: 500;
-  padding: 2px 6px;
-}
-
-.an-rich-md-slash-menu {
-  z-index: 9999;
-  width: min(420px, calc(100vw - 24px));
-  min-width: 230px;
-  max-height: 320px;
-  overflow-y: auto;
-  color: hsl(var(--foreground));
-  background: hsl(var(--popover));
-  border: 1px solid hsl(var(--border));
-  border-radius: 7px;
-  box-shadow:
-    0 4px 20px rgb(0 0 0 / 0.12),
-    0 0 0 1px rgb(0 0 0 / 0.04);
-  padding: 4px 0;
-}
-
-.an-rich-md-slash-heading {
-  padding: 4px 10px;
-  font-size: 10px;
-  font-weight: 650;
-  text-transform: uppercase;
-  letter-spacing: 0.06em;
-  color: hsl(var(--muted-foreground));
-}
-
-.an-rich-md-slash-item {
-  width: 100%;
-  min-width: 0;
-  min-height: 44px;
-  display: flex;
-  align-items: center;
-  gap: 8px;
-  padding: 6px 10px;
-  text-align: start;
-  background: none;
-  border: none;
-  cursor: pointer;
-  color: hsl(var(--foreground));
-  font-size: 13px;
-}
-
-.an-rich-md-slash-item:hover,
-.an-rich-md-slash-item--active {
-  background: hsl(var(--accent));
-}
-
-.an-rich-md-slash-icon {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 28px;
-  height: 28px;
-  border-radius: 4px;
-  border: 1px solid hsl(var(--border));
-  background: hsl(var(--background));
-  font-size: 11px;
-  font-weight: 650;
-  color: hsl(var(--muted-foreground));
-  flex-shrink: 0;
-}
-
-.an-rich-md-slash-copy {
-  display: block;
-  min-width: 0;
-  flex: 1;
-}
-
-.an-rich-md-slash-title {
-  display: block;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  font-weight: 500;
-  font-size: 13px;
-}
-
-.an-rich-md-slash-description {
-  display: block;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  font-size: 11px;
-  color: hsl(var(--muted-foreground));
-}
-
-/* Shared block-level image node (the editor's `.an-rich-md-image` and the
-   read-only markdown renderer's <img>). Constrained to the prose width and
-   responsive; a still-uploading placeholder (empty src) shows a subtle frame. */
-.an-rich-md-prose img,
-.an-rich-md-image {
-  display: block;
-  max-width: 100%;
-  height: auto;
-  margin: 12px 0;
-  border-radius: 8px;
-}
-
-.an-rich-md-image[src=""],
-.an-rich-md-image:not([src]) {
-  min-height: 64px;
-  background: hsl(var(--muted));
-  border: 1px dashed hsl(var(--border));
-}
-
-.ProseMirror-selectednode.an-rich-md-image {
-  outline: 2px solid hsl(var(--ring));
-  outline-offset: 2px;
-}
+@import "@agent-native/toolkit/editor.css";

package/corpus/core/src/testing.ts

@@ -23,4 +23,4 @@ export {
   type DesignConnectBridge,
 } from "./cli/design-connect.js";
 
-export { DragHandle } from "./client/rich-markdown-editor/DragHandle.js";
+export { DragHandle } from "@agent-native/toolkit/editor";

package/corpus/core/src/vite/client.ts

@@ -811,6 +811,9 @@ const TOOLKIT_CLIENT_SUBPATHS = [
   "@agent-native/toolkit",
   "@agent-native/toolkit/app-shell",
   "@agent-native/toolkit/collab-ui",
+  "@agent-native/toolkit/context-ui",
+  "@agent-native/toolkit/design-tweaks",
+  "@agent-native/toolkit/editor",
   "@agent-native/toolkit/hooks",
   "@agent-native/toolkit/onboarding",
   "@agent-native/toolkit/provider",

package/corpus/templates/content/app/components/editor/VisualEditor.tsx

@@ -1,6 +1,4 @@
 import {
-  createSharedEditorExtensions,
-  useCollabReconcile,
   usePresence,
   useRecentEdits,
   RecentEditHighlights,
@@ -8,8 +6,12 @@ import {
   useT,
   type AttributedRecentEdit,
   type RegistryBlockSideMapBlock,
-  type UseCollabReconcileResult,
 } from "@agent-native/core/client";
+import {
+  createSharedEditorExtensions,
+  useCollabReconcile,
+  type UseCollabReconcileResult,
+} from "@agent-native/toolkit/editor";
 import { canonicalizeNfm, docToNfm, nfmToDoc } from "@shared/nfm";
 import {
   serializeRegistryBlockToMdx,

package/corpus/templates/content/app/components/editor/extensions/DragHandle.tsx

@@ -1,15 +1,15 @@
-import { DragHandle as CoreDragHandle } from "@agent-native/core/client";
+import { DragHandle as ToolkitDragHandle } from "@agent-native/toolkit/editor";
 
 /**
  * Content's drag-handle extension.
  *
- * The implementation now lives in the shared core
- * (`packages/core/src/client/rich-markdown-editor/DragHandle.ts`) so other apps
+ * The implementation lives in Toolkit
+ * (`packages/toolkit/src/editor/DragHandle.ts`) so other apps
  * (e.g. the plan editor) can reuse the same `::` grip + block-selection +
  * drag-to-reorder affordance. This module is a thin re-export configured with
  * Content's wrapper selector so the behavior stays byte-identical and existing
  * imports (`./extensions/DragHandle`) keep working unchanged.
  */
-export const DragHandle = CoreDragHandle.configure({
+export const DragHandle = ToolkitDragHandle.configure({
   wrapperSelector: ".visual-editor-wrapper",
 });