@getpinax/widget 0.0.0-stage → 1.0.0-beta.1

package/dist/ui/widget.d.ts

@@ -0,0 +1,161 @@
+import type { Annotation, FieldAnswer, PinaxUser, ReportType, WidgetConfig } from '../types';
+export type Shot = {
+    /** The flattened image that will be sent. */
+    dataUrl: string;
+    annotations: Annotation[];
+    /** Opaque editor state so "Mark up" can continue where it left off. */
+    edit?: unknown;
+    /** AI-12: how many private details were blurred automatically. */
+    autoBlurred?: number;
+};
+export type SubmitInput = {
+    type: ReportType;
+    message: string;
+    rating?: number;
+    email?: string;
+    shot?: Shot;
+    /** AI-10: the follow-up question and the visitor's answer. */
+    followUp?: {
+        question: string;
+        answer: string;
+    };
+    /** W-10: answers to the site's custom fields. */
+    fields?: FieldAnswer[];
+    /** P-04: the hidden honeypot field (people leave it empty). */
+    hp?: string;
+    /** P-04: milliseconds from opening the panel to sending. */
+    elapsedMs?: number;
+};
+/** AI-10: only short notes on problems and ideas get a follow-up question. */
+export declare const FOLLOW_UP_MAX_NOTE = 140;
+export type SubmitResult = {
+    status: 'sent';
+} | {
+    status: 'queued';
+} | {
+    status: 'error';
+    message: string;
+};
+export type UIHandlers = {
+    takeScreenshot(): Promise<Shot>;
+    markUp(shot: Shot): Promise<Shot | null>;
+    submit(input: SubmitInput): Promise<SubmitResult>;
+    user(): PinaxUser | undefined;
+    /** Called each time the panel opens (Segment). Must not throw. */
+    opened?(): void;
+    /**
+     * AI-10: one follow-up question for a short note, or null to send as is.
+     * Must resolve (to null) on errors and within a few seconds.
+     */
+    followUp?(input: {
+        type: ReportType;
+        message: string;
+    }): Promise<string | null>;
+};
+/** A screen of the panel, or 'button' for the closed widget. */
+export type WidgetView = 'button' | 'choose' | 'problem' | 'idea' | 'general' | 'done';
+/**
+ * The floating button and the feedback panel (W-01, W-02, W-07 to W-11,
+ * W-15). Everything renders inside the shadow root.
+ */
+export declare class WidgetUI {
+    private root;
+    private config;
+    private handlers;
+    private wrap;
+    private launcher;
+    private panel;
+    private live;
+    private kinds;
+    private kind;
+    private shot;
+    private message;
+    private email;
+    private rating;
+    /** W-10: answers by field id. */
+    private answers;
+    /** W-17: the client's colour on Send buttons (Agency). */
+    private sendColour;
+    private sending;
+    /** P-04: when the panel opened, and the honeypot field's value. */
+    private openedAt;
+    private hp;
+    private closeTimer;
+    private uid;
+    /** S-04 hidden path, set from outside as the visitor navigates. */
+    private pathHidden;
+    /** Where focus goes back to on close when there's no button to return to. */
+    private returnFocus;
+    constructor(root: ShadowRoot, config: WidgetConfig, handlers: UIHandlers, 
+    /** Extra classes on the wrapper and extra CSS (the dashboard preview). */
+    extra?: {
+        className?: string;
+        css?: string;
+    });
+    isOpen(): boolean;
+    /** True while the floating button is on screen (S-04, S-05). */
+    hasButton(): boolean;
+    /**
+     * S-04: hide or show the floating button for the current page. An open
+     * panel stays open, and `open()` keeps working either way.
+     */
+    setPathHidden(hidden: boolean): void;
+    private updateButton;
+    /** `focus: false` opens without moving focus (the dashboard preview). */
+    open(focus?: boolean): void;
+    close(restoreFocus?: boolean): void;
+    /** The screen on show, for the dashboard preview. */
+    currentView(): WidgetView;
+    /**
+     * Dashboard preview: jump straight to a screen without moving focus. A
+     * type that's switched off shows the chooser instead.
+     */
+    showView(view: WidgetView): void;
+    /** S-06: the owner's wording, or ours when they left it empty. */
+    private word;
+    private kindTitle;
+    /** Hides the panel while the full-screen editor is up. */
+    private setSuspended;
+    destroy(): void;
+    private view;
+    private queued;
+    /** AI-10: the question asked about `message`, and the answer so far. */
+    private asked;
+    private answer;
+    private reset;
+    private holdOpen;
+    private focusFirst;
+    private announce;
+    private pick;
+    private capture;
+    private markUp;
+    private renderKeepingFocus;
+    private header;
+    private powered;
+    /** W-17: the client's logo at the top of the panel (Agency). */
+    private logo;
+    private render;
+    private renderChoose;
+    private renderShot;
+    private renderStars;
+    private renderForm;
+    /**
+     * P-04: a field people never see or reach (off-screen, out of the tab
+     * order and hidden from screen readers). Form-filling bots fill it in.
+     */
+    private honeypot;
+    private send;
+    /** The follow-up question for this note, or null (no question, error, timeout). */
+    private askFollowUp;
+    private submitNow;
+    /** AI-10: one question about the note, with "Send" and "Skip and send". */
+    private renderQuestion;
+    /** W-17: the client's colour on Send, else the colour of the kind. */
+    private colourSend;
+    /** W-10: the owner's fields for this kind of feedback. */
+    private fieldsFor;
+    private fieldAnswers;
+    /** W-10: dropdowns, short text and checkboxes, labelled and keyboard friendly. */
+    private renderFields;
+    private renderDone;
+}

package/package.json

@@ -1,6 +1,75 @@
 {
   "name": "@getpinax/widget",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
-}
+  "version": "1.0.0-beta.1",
+  "type": "module",
+  "description": "Pinax website feedback widget: a feedback button with screenshots, markup and page context",
+  "license": "MIT",
+  "author": "Pinax <hello@getpinax.com>",
+  "homepage": "https://getpinax.com",
+  "bugs": {
+    "email": "hello@getpinax.com"
+  },
+  "keywords": [
+    "feedback",
+    "bug-report",
+    "widget",
+    "screenshot",
+    "pinax"
+  ],
+  "sideEffects": false,
+  "publishConfig": {
+    "access": "public"
+  },
+  "main": "./dist/pinax.mjs",
+  "module": "./dist/pinax.mjs",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/pinax.mjs"
+    },
+    "./preview": {
+      "types": "./dist/preview.d.ts",
+      "import": "./dist/preview.mjs"
+    },
+    "./package.json": "./package.json"
+  },
+  "files": [
+    "dist",
+    "!dist/**/*.map",
+    "README.md",
+    "LICENSE"
+  ],
+  "scripts": {
+    "dev": "vite",
+    "build": "tsc --noEmit && vite build && vite build --mode editor && vite build --mode recorder && vite build --mode embed && tsc -p tsconfig.build.json && node scripts/check-size.mjs",
+    "test": "vitest run",
+    "typecheck": "tsc --noEmit",
+    "check": "biome check ./src ./cdn",
+    "check:fix": "biome check --write ./src ./cdn",
+    "size": "node scripts/check-size.mjs",
+    "playground": "yarn build && node scripts/serve-playground.mjs",
+    "prepublishOnly": "VITE_PINAX_API=https://api.getpinax.com VITE_PINAX_CDN=https://cdn.getpinax.com yarn build && yarn test",
+    "cdn:deploy": "./cdn/deploy.sh"
+  },
+  "devDependencies": {
+    "@biomejs/biome": "^2.6.5",
+    "@types/node": "^22",
+    "axe-core": "^4.10.0",
+    "jsdom": "^30.1.3",
+    "typescript": "^7.0.2",
+    "vite": "^8.3.5",
+    "vitest": "^5.1.0"
+  },
+  "dependencies": {
+    "@rrweb/record": "2.1.7",
+    "modern-screenshot": "^4.7.0"
+  },
+  "resolutions": {
+    "rrweb": "2.1.7",
+    "rrweb-snapshot": "2.1.7",
+    "rrdom": "2.1.7",
+    "@rrweb/types": "2.1.7",
+    "@rrweb/utils": "2.1.7"
+  }
+}