@antigenic-oss/paint 0.1.0

package/src/types/messages.ts

@@ -0,0 +1,392 @@
+import type { TreeNode } from './tree'
+import type { CSSVariableDefinition } from './cssVariables'
+import type { DetectedComponent } from './component'
+import type { SourceInfo } from './claude'
+
+// Inspector → Editor messages
+
+export interface InspectorReadyMessage {
+  type: 'INSPECTOR_READY'
+}
+
+export interface ElementSelectedMessage {
+  type: 'ELEMENT_SELECTED'
+  payload: {
+    selectorPath: string
+    tagName: string
+    className: string | null
+    id: string | null
+    attributes: Record<string, string>
+    innerText: string | null
+    computedStyles: Record<string, string>
+    cssVariableUsages?: Record<string, string>
+    sourceInfo?: SourceInfo | null
+    boundingRect: {
+      x: number
+      y: number
+      width: number
+      height: number
+      top: number
+      right: number
+      bottom: number
+      left: number
+    }
+  }
+}
+
+export interface ElementHoveredMessage {
+  type: 'ELEMENT_HOVERED'
+  payload: {
+    selectorPath: string | null
+  }
+}
+
+export interface DOMUpdatedMessage {
+  type: 'DOM_UPDATED'
+  payload: {
+    tree: TreeNode
+    removedSelectors: string[]
+  }
+}
+
+export interface DOMTreeMessage {
+  type: 'DOM_TREE'
+  payload: {
+    tree: TreeNode
+  }
+}
+
+export interface PageLinksMessage {
+  type: 'PAGE_LINKS'
+  payload: {
+    links: Array<{ href: string; text: string }>
+  }
+}
+
+export interface HeartbeatResponseMessage {
+  type: 'HEARTBEAT_RESPONSE'
+}
+
+export interface CSSVariablesMessage {
+  type: 'CSS_VARIABLES'
+  payload: {
+    definitions: Record<string, CSSVariableDefinition>
+    isExplicit: boolean
+    scopes?: string[] // selectors where variables are defined: ':root', '.dark', etc.
+  }
+}
+
+export interface ComponentsDetectedMessage {
+  type: 'COMPONENTS_DETECTED'
+  payload: {
+    components: DetectedComponent[]
+  }
+}
+
+export interface VariantAppliedMessage {
+  type: 'VARIANT_APPLIED'
+  payload: {
+    selectorPath: string
+    computedStyles: Record<string, string>
+    cssVariableUsages: Record<string, string>
+    boundingRect: { top: number; left: number; width: number; height: number }
+  }
+}
+
+export interface PageNavigateMessage {
+  type: 'PAGE_NAVIGATE'
+  payload: {
+    path: string
+  }
+}
+
+export interface TextChangedMessage {
+  type: 'TEXT_CHANGED'
+  payload: {
+    selectorPath: string
+    originalText: string
+    newText: string
+  }
+}
+
+export interface ElementDeletedMessage {
+  type: 'ELEMENT_DELETED'
+  payload: {
+    selectorPath: string
+    originalDisplay: string
+    tagName: string
+    className: string | null
+    elementId: string | null
+    innerText: string | null
+    attributes: Record<string, string>
+    computedStyles: Record<string, string>
+  }
+}
+
+export type ConsoleLevel = 'log' | 'info' | 'warn' | 'error'
+
+export interface ConsoleMessageMessage {
+  type: 'CONSOLE_MESSAGE'
+  payload: {
+    level: ConsoleLevel
+    args: string[]
+    timestamp: number
+    source?: string
+    line?: number
+    column?: number
+  }
+}
+
+// Editor → Inspector messages
+
+export interface SelectElementMessage {
+  type: 'SELECT_ELEMENT'
+  payload: {
+    selectorPath: string
+  }
+}
+
+export interface PreviewChangeMessage {
+  type: 'PREVIEW_CHANGE'
+  payload: {
+    selectorPath: string
+    property: string
+    value: string
+  }
+}
+
+export interface RevertChangeMessage {
+  type: 'REVERT_CHANGE'
+  payload: {
+    selectorPath: string
+    property: string
+  }
+}
+
+export interface RevertAllMessage {
+  type: 'REVERT_ALL'
+}
+
+export interface SetBreakpointMessage {
+  type: 'SET_BREAKPOINT'
+  payload: {
+    width: number
+  }
+}
+
+export interface RequestDOMTreeMessage {
+  type: 'REQUEST_DOM_TREE'
+}
+
+export interface RequestPageLinksMessage {
+  type: 'REQUEST_PAGE_LINKS'
+}
+
+export interface HeartbeatMessage {
+  type: 'HEARTBEAT'
+}
+
+export interface RequestCSSVariablesMessage {
+  type: 'REQUEST_CSS_VARIABLES'
+}
+
+export interface SetSelectionModeMessage {
+  type: 'SET_SELECTION_MODE'
+  payload: {
+    enabled: boolean
+  }
+}
+
+export interface RequestComponentsMessage {
+  type: 'REQUEST_COMPONENTS'
+  payload: {
+    rootSelectorPath?: string
+  }
+}
+
+export interface ApplyVariantMessage {
+  type: 'APPLY_VARIANT'
+  payload: {
+    selectorPath: string
+    type: 'class' | 'pseudo'
+    addClassName?: string
+    removeClassNames?: string[]
+    pseudoStyles?: Record<string, string>
+    revertPseudo?: boolean
+  }
+}
+
+export interface RevertVariantMessage {
+  type: 'REVERT_VARIANT'
+  payload: {
+    selectorPath: string
+    removeClassName?: string
+    restoreClassName?: string
+    revertPseudo?: boolean
+    pseudoProperties?: string[]
+  }
+}
+
+export interface SetTextContentMessage {
+  type: 'SET_TEXT_CONTENT'
+  payload: {
+    selectorPath: string
+    text: string
+  }
+}
+
+export interface RevertTextContentMessage {
+  type: 'REVERT_TEXT_CONTENT'
+  payload: {
+    selectorPath: string
+    originalText: string
+  }
+}
+
+export interface RevertDeleteMessage {
+  type: 'REVERT_DELETE'
+  payload: {
+    selectorPath: string
+    originalDisplay: string
+  }
+}
+
+export interface InsertElementMessage {
+  type: 'INSERT_ELEMENT'
+  payload: {
+    tagName: string
+    parentSelectorPath: string
+    placeholderText?: string
+    defaultStyles?: Record<string, string>
+  }
+}
+
+export interface RemoveInsertedElementMessage {
+  type: 'REMOVE_INSERTED_ELEMENT'
+  payload: {
+    selectorPath: string
+  }
+}
+
+export interface DeleteElementMessage {
+  type: 'DELETE_ELEMENT'
+  payload: {
+    selectorPath: string
+  }
+}
+
+export interface MoveElementMessage {
+  type: 'MOVE_ELEMENT'
+  payload: {
+    selectorPath: string
+    newParentSelectorPath: string
+    newIndex: number
+  }
+}
+
+export interface RevertMoveElementMessage {
+  type: 'REVERT_MOVE_ELEMENT'
+  payload: {
+    selectorPath: string
+    oldParentSelectorPath: string
+    oldIndex: number
+  }
+}
+
+export interface HideSelectionOverlayMessage {
+  type: 'HIDE_SELECTION_OVERLAY'
+}
+
+export interface ShowSelectionOverlayMessage {
+  type: 'SHOW_SELECTION_OVERLAY'
+}
+
+export interface HideHoverMessage {
+  type: 'HIDE_HOVER'
+}
+
+export interface NavigateToMessage {
+  type: 'NAVIGATE_TO'
+  payload: {
+    path: string
+  }
+}
+
+export interface RecursiveEmbedDetectedMessage {
+  type: 'RECURSIVE_EMBED_DETECTED'
+}
+
+export interface ElementInsertedMessage {
+  type: 'ELEMENT_INSERTED'
+  payload: {
+    selectorPath: string
+    parentSelectorPath: string
+    tagName: string
+    insertionIndex: number
+    placeholderText: string
+    defaultStyles?: Record<string, string>
+  }
+}
+
+export interface ElementMovedMessage {
+  type: 'ELEMENT_MOVED'
+  payload: {
+    selectorPath: string
+    newSelectorPath: string
+    oldParentSelectorPath: string
+    newParentSelectorPath: string
+    oldIndex: number
+    newIndex: number
+  }
+}
+
+// Union types
+export type InspectorToEditorMessage =
+  | InspectorReadyMessage
+  | ElementSelectedMessage
+  | ElementHoveredMessage
+  | DOMUpdatedMessage
+  | DOMTreeMessage
+  | PageLinksMessage
+  | HeartbeatResponseMessage
+  | CSSVariablesMessage
+  | ComponentsDetectedMessage
+  | VariantAppliedMessage
+  | PageNavigateMessage
+  | TextChangedMessage
+  | ElementDeletedMessage
+  | ConsoleMessageMessage
+  | RecursiveEmbedDetectedMessage
+  | ElementInsertedMessage
+  | ElementMovedMessage
+
+export type EditorToInspectorMessage =
+  | SelectElementMessage
+  | PreviewChangeMessage
+  | RevertChangeMessage
+  | RevertAllMessage
+  | SetBreakpointMessage
+  | RequestDOMTreeMessage
+  | RequestPageLinksMessage
+  | HeartbeatMessage
+  | RequestCSSVariablesMessage
+  | SetSelectionModeMessage
+  | RequestComponentsMessage
+  | ApplyVariantMessage
+  | RevertVariantMessage
+  | SetTextContentMessage
+  | RevertTextContentMessage
+  | RevertDeleteMessage
+  | HideSelectionOverlayMessage
+  | ShowSelectionOverlayMessage
+  | HideHoverMessage
+  | NavigateToMessage
+  | DeleteElementMessage
+  | InsertElementMessage
+  | RemoveInsertedElementMessage
+  | MoveElementMessage
+  | RevertMoveElementMessage
+
+export type PostMessageType =
+  | InspectorToEditorMessage['type']
+  | EditorToInspectorMessage['type']

package/src/types/shadow.ts

@@ -0,0 +1,8 @@
+export interface ShadowData {
+  x: number
+  y: number
+  blur: number
+  spread: number
+  color: string
+  inset: boolean
+}

package/src/types/tree.ts

@@ -0,0 +1,9 @@
+export interface TreeNode {
+  id: string
+  tagName: string
+  className: string | null
+  elementId: string | null
+  children: TreeNode[]
+  imgSrc: string | null
+  isExpanded?: boolean
+}

package/tsconfig.json

@@ -0,0 +1,42 @@
+{
+  "compilerOptions": {
+    "target": "ES2017",
+    "lib": [
+      "dom",
+      "dom.iterable",
+      "esnext"
+    ],
+    "allowJs": true,
+    "skipLibCheck": true,
+    "strict": true,
+    "noEmit": true,
+    "esModuleInterop": true,
+    "module": "esnext",
+    "moduleResolution": "bundler",
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "jsx": "react-jsx",
+    "incremental": true,
+    "plugins": [
+      {
+        "name": "next"
+      }
+    ],
+    "paths": {
+      "@/*": [
+        "./src/*"
+      ]
+    }
+  },
+  "include": [
+    "next-env.d.ts",
+    "**/*.ts",
+    "**/*.tsx",
+    ".next/types/**/*.ts",
+    ".next/dev/types/**/*.ts"
+  ],
+  "exclude": [
+    "node_modules",
+    "src/server"
+  ]
+}

package/tsconfig.server.json

@@ -0,0 +1,12 @@
+{
+  "compilerOptions": {
+    "target": "ES2022",
+    "module": "esnext",
+    "moduleResolution": "bundler",
+    "strict": true,
+    "noEmit": true,
+    "skipLibCheck": true,
+    "types": ["bun-types"]
+  },
+  "include": ["src/server/**/*.ts"]
+}