page-annotation 0.1.0-alpha.0

package/dist/render.d.ts

@@ -0,0 +1,5 @@
+import type { AnnotationDocument, AnnotationItem } from "./types";
+export declare function resizeCanvas(canvas: HTMLCanvasElement): number;
+export declare function renderAnnotations(context: CanvasRenderingContext2D, annotations: AnnotationItem[] | AnnotationDocument, scale?: number): void;
+export declare function renderAnnotation(context: CanvasRenderingContext2D, annotation: AnnotationItem): void;
+//# sourceMappingURL=render.d.ts.map

package/dist/render.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"render.d.ts","sourceRoot":"","sources":["../src/render.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,kBAAkB,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAElE,wBAAgB,YAAY,CAAC,MAAM,EAAE,iBAAiB,GAAG,MAAM,CAS9D;AAED,wBAAgB,iBAAiB,CAC/B,OAAO,EAAE,wBAAwB,EACjC,WAAW,EAAE,cAAc,EAAE,GAAG,kBAAkB,EAClD,KAAK,SAAI,GACR,IAAI,CAQN;AAED,wBAAgB,gBAAgB,CAAC,OAAO,EAAE,wBAAwB,EAAE,UAAU,EAAE,cAAc,GAAG,IAAI,CAqBpG"}

package/dist/store.d.ts

@@ -0,0 +1,23 @@
+import type { AnnotationDocument, AnnotationItem } from "./types";
+type StoreListener = () => void;
+export declare class AnnotationStore {
+    private items;
+    private undoStack;
+    private redoStack;
+    private listeners;
+    subscribe(listener: StoreListener): () => void;
+    all(): AnnotationItem[];
+    add(annotation: AnnotationItem): void;
+    replaceAll(items: AnnotationItem[]): void;
+    removeById(id: string): boolean;
+    clear(): void;
+    undo(): void;
+    redo(): void;
+    canUndo(): boolean;
+    canRedo(): boolean;
+    toDocument(viewportWidth: number, viewportHeight: number): AnnotationDocument;
+    private captureUndoState;
+    private notify;
+}
+export {};
+//# sourceMappingURL=store.d.ts.map

package/dist/store.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"store.d.ts","sourceRoot":"","sources":["../src/store.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,kBAAkB,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAElE,KAAK,aAAa,GAAG,MAAM,IAAI,CAAC;AAEhC,qBAAa,eAAe;IAC1B,OAAO,CAAC,KAAK,CAAwB;IACrC,OAAO,CAAC,SAAS,CAA0B;IAC3C,OAAO,CAAC,SAAS,CAA0B;IAC3C,OAAO,CAAC,SAAS,CAA4B;IAE7C,SAAS,CAAC,QAAQ,EAAE,aAAa,GAAG,MAAM,IAAI;IAK9C,GAAG,IAAI,cAAc,EAAE;IAIvB,GAAG,CAAC,UAAU,EAAE,cAAc,GAAG,IAAI;IAOrC,UAAU,CAAC,KAAK,EAAE,cAAc,EAAE,GAAG,IAAI;IAOzC,UAAU,CAAC,EAAE,EAAE,MAAM,GAAG,OAAO;IAY/B,KAAK,IAAI,IAAI;IAWb,IAAI,IAAI,IAAI;IAWZ,IAAI,IAAI,IAAI;IAWZ,OAAO,IAAI,OAAO;IAIlB,OAAO,IAAI,OAAO;IAIlB,UAAU,CAAC,aAAa,EAAE,MAAM,EAAE,cAAc,EAAE,MAAM,GAAG,kBAAkB;IAS7E,OAAO,CAAC,gBAAgB;IAOxB,OAAO,CAAC,MAAM;CAGf"}

package/dist/types.d.ts

@@ -0,0 +1,137 @@
+export type AnnotationTool = "pen" | "eraser" | "text" | "rectangle" | "arrow";
+export type AnnotationPoint = {
+    x: number;
+    y: number;
+};
+export type PathAnnotation = {
+    id: string;
+    type: "path";
+    points: AnnotationPoint[];
+    color: string;
+    width: number;
+};
+export type RectangleAnnotation = {
+    id: string;
+    type: "rectangle";
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+    color: string;
+    strokeWidth: number;
+};
+export type ArrowAnnotation = {
+    id: string;
+    type: "arrow";
+    start: AnnotationPoint;
+    end: AnnotationPoint;
+    color: string;
+    strokeWidth: number;
+};
+export type TextAnnotation = {
+    id: string;
+    type: "text";
+    x: number;
+    y: number;
+    text: string;
+    color: string;
+    fontSize: number;
+};
+export type AnnotationItem = PathAnnotation | RectangleAnnotation | ArrowAnnotation | TextAnnotation;
+export type AnnotationDocument = {
+    version: 1;
+    viewportWidth: number;
+    viewportHeight: number;
+    items: AnnotationItem[];
+};
+export type AnnotationExport = {
+    png: Blob;
+    annotations: AnnotationDocument;
+    page: {
+        url: string;
+        title: string;
+        scrollX: number;
+        scrollY: number;
+        viewportWidth: number;
+        viewportHeight: number;
+        devicePixelRatio: number;
+    };
+    createdAt: string;
+};
+export type CaptureOptions = {
+    mode?: "dom";
+    backgroundColor?: string | null;
+    scale?: number;
+    ignoreSelectors?: string[];
+    sanitizeUnsupportedColors?: boolean;
+};
+export type PageAnnotatorLabels = {
+    launcher: string;
+    pen: string;
+    eraser: string;
+    text: string;
+    rectangle: string;
+    arrow: string;
+    undo: string;
+    redo: string;
+    clear: string;
+    moveToolbar: string;
+    copy: string;
+    download: string;
+    submit: string;
+    close: string;
+    addText: string;
+    cancelText: string;
+    color: string;
+    strokeWidth: string;
+    textPlaceholder: string;
+};
+export type PageAnnotatorOptions = {
+    target?: HTMLElement | string;
+    tools?: AnnotationTool[];
+    /**
+     * Controls how annotation mode is opened.
+     *
+     * - Omit or pass `false` to render no package-owned launcher and call `annotator.open()`
+     *   from your own button, menu item, keyboard shortcut, or command palette.
+     * - Pass `true` to render the default floating launcher.
+     * - Pass an HTMLElement to bind annotation mode to an existing trigger.
+     * - Pass launcher options to render a configured floating launcher.
+     */
+    launcher?: boolean | HTMLElement | PageAnnotatorLauncherOptions;
+    capture?: CaptureOptions;
+    labels?: Partial<PageAnnotatorLabels>;
+    initialColor?: string;
+    initialStrokeWidth?: number;
+    onExport?: (result: AnnotationExport) => void | Promise<void>;
+    onError?: (error: unknown) => void;
+};
+export type PageAnnotatorLauncherOptions = {
+    container?: HTMLElement;
+    className?: string;
+    label?: string;
+    position?: PageAnnotatorLauncherPosition;
+    offset?: number | PageAnnotatorLauncherOffset;
+};
+export type PageAnnotatorLauncherPosition = "bottom-right" | "bottom-left" | "top-right" | "top-left";
+export type PageAnnotatorLauncherOffset = {
+    x?: number;
+    y?: number;
+};
+export type PageAnnotator = {
+    open: () => void;
+    close: () => void;
+    destroy: () => void;
+    clear: () => void;
+    setTool: (tool: AnnotationTool) => void;
+    export: () => Promise<AnnotationExport>;
+    copyToClipboard: () => Promise<AnnotationExport>;
+};
+export type CapturedPage = {
+    canvas: HTMLCanvasElement;
+};
+export type CaptureProvider = (request: {
+    target: HTMLElement;
+    options: CaptureOptions;
+}) => Promise<CapturedPage>;
+//# sourceMappingURL=types.d.ts.map

package/dist/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -0,0 +1,57 @@
+{
+  "name": "page-annotation",
+  "version": "0.1.0-alpha.0",
+  "description": "Framework-neutral browser page annotation tools for screenshot-backed feedback.",
+  "type": "module",
+  "license": "MIT",
+  "author": "Taimoor Qureshi",
+  "repository": {
+    "type": "git",
+    "url": "git+ssh://git@github.com/taimoorq/page-annotation.git"
+  },
+  "bugs": {
+    "url": "https://github.com/taimoorq/page-annotation/issues"
+  },
+  "homepage": "https://github.com/taimoorq/page-annotation#readme",
+  "publishConfig": {
+    "access": "public",
+    "provenance": true
+  },
+  "sideEffects": [
+    "./dist/page-annotation.css",
+    "./src/styles.css"
+  ],
+  "main": "./dist/page-annotation.iife.js",
+  "module": "./dist/page-annotation.es.js",
+  "types": "./dist/index.d.ts",
+  "style": "./dist/page-annotation.css",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/page-annotation.es.js",
+      "default": "./dist/page-annotation.iife.js"
+    },
+    "./styles.css": "./dist/page-annotation.css"
+  },
+  "files": [
+    "dist",
+    "README.md",
+    "LICENSE"
+  ],
+  "scripts": {
+    "build": "npm run typecheck && vite build && tsc -p tsconfig.types.json",
+    "dev": "vite --host 127.0.0.1",
+    "preview": "vite preview --host 127.0.0.1",
+    "test": "vitest run",
+    "typecheck": "tsc -p tsconfig.json --noEmit"
+  },
+  "dependencies": {
+    "html2canvas": "^1.4.1"
+  },
+  "devDependencies": {
+    "jsdom": "^26.1.0",
+    "typescript": "^5.8.3",
+    "vite": "^7.0.0",
+    "vitest": "^3.2.0"
+  }
+}