@jielga/react-popup-window 0.1.0 → 0.2.0

package/dist/types.d.ts

@@ -18,6 +18,14 @@ export interface UsePopupWindowOptions {
      * window. Defaults to `_blank` (a fresh window every time).
      */
     name?: string;
+    /**
+     * URL the popup loads instead of `about:blank`: an empty page served on the
+     * same origin, such as `/popup.html`. The popup's address bar shows that
+     * URL. `isOpen` turns `true` at once; `Popup` renders once the page has
+     * loaded. If the page redirects to another origin, the popup closes and is
+     * reported through `onBlocked`. Defaults to `about:blank`.
+     */
+    url?: string;
     /** Extra `window.open` features. Defaults to `{ popup: true, width: 640, height: 480 }` merged with what you pass. */
     features?: PopupWindowFeatures;
     /**
@@ -28,14 +36,25 @@ export interface UsePopupWindowOptions {
     /**
      * Copy the opener document's stylesheets into the popup and keep them in
      * sync (new/changed `<style>`/`<link>` tags, `class`/`style` attributes on
-     * `<html>`/`<body>`, adopted stylesheets). Defaults to `true`.
+     * `<html>`/`<body>`, adopted stylesheets). `Popup` renders once the copied
+     * `<link>` stylesheets have loaded, or after 3 seconds, so the first frame
+     * shown is styled. Defaults to `true`.
      */
     copyStyles?: boolean;
-    /** Called after the popup window has been opened and prepared. */
+    /**
+     * Called when `Popup` starts rendering into the popup: once the window has
+     * opened, the `url` page has loaded, and copied `<link>` stylesheets have
+     * loaded.
+     */
     onOpen?: (popupWindow: Window) => void;
     /** Called when the popup closes — via `close()`, the user, or the opener unloading. */
     onClose?: () => void;
-    /** Called when `window.open` returns `null` (popup blocked by the browser). */
+    /**
+     * Called when the popup cannot be used: `window.open` returned `null`
+     * (blocked by the browser), or the popup's document is not scriptable
+     * because a sandboxed embedder gave it an opaque origin or `url` led to
+     * another origin.
+     */
     onBlocked?: () => void;
 }
 export interface PopupProps {
@@ -56,7 +75,10 @@ export interface PopupWindowApi {
     focus: () => void;
     /** Whether the popup window is currently open. */
     isOpen: boolean;
-    /** Whether the last `open()` attempt was blocked by the browser. */
+    /**
+     * Whether the last `open()` attempt was blocked — by the browser, or by a
+     * sandboxed embedder whose popups are not scriptable.
+     */
     isBlocked: boolean;
     /**
      * The popup `Window` while open, otherwise `null`. Escape hatch for

package/dist/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAE1C;;;GAGG;AACH,MAAM,WAAW,mBAAmB;IAClC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,CAAC,OAAO,EAAE,MAAM,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,SAAS,CAAA;CACzD;AAED,MAAM,WAAW,qBAAqB;IACpC,0EAA0E;IAC1E,KAAK,CAAC,EAAE,MAAM,CAAA;IACd;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,sHAAsH;IACtH,QAAQ,CAAC,EAAE,mBAAmB,CAAA;IAC9B;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,kEAAkE;IAClE,MAAM,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAA;IACtC,uFAAuF;IACvF,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,+EAA+E;IAC/E,SAAS,CAAC,EAAE,MAAM,IAAI,CAAA;CACvB;AAED,MAAM,WAAW,UAAU;IACzB,QAAQ,CAAC,EAAE,SAAS,CAAA;CACrB;AAED,MAAM,WAAW,cAAc;IAC7B;;;;OAIG;IACH,IAAI,EAAE,MAAM,MAAM,GAAG,IAAI,CAAA;IACzB,kDAAkD;IAClD,KAAK,EAAE,MAAM,IAAI,CAAA;IACjB,qCAAqC;IACrC,MAAM,EAAE,MAAM,IAAI,CAAA;IAClB,yDAAyD;IACzD,KAAK,EAAE,MAAM,IAAI,CAAA;IACjB,kDAAkD;IAClD,MAAM,EAAE,OAAO,CAAA;IACf,oEAAoE;IACpE,SAAS,EAAE,OAAO,CAAA;IAClB;;;;OAIG;IACH,WAAW,EAAE,MAAM,GAAG,IAAI,CAAA;IAC1B;;;OAGG;IACH,KAAK,EAAE,EAAE,CAAC,UAAU,CAAC,CAAA;CACtB"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAE1C;;;GAGG;AACH,MAAM,WAAW,mBAAmB;IAClC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,CAAC,OAAO,EAAE,MAAM,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,SAAS,CAAA;CACzD;AAED,MAAM,WAAW,qBAAqB;IACpC,0EAA0E;IAC1E,KAAK,CAAC,EAAE,MAAM,CAAA;IACd;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAA;IACb;;;;;;OAMG;IACH,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,sHAAsH;IACtH,QAAQ,CAAC,EAAE,mBAAmB,CAAA;IAC9B;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB;;;;;;OAMG;IACH,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB;;;;OAIG;IACH,MAAM,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAA;IACtC,uFAAuF;IACvF,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB;;;;;OAKG;IACH,SAAS,CAAC,EAAE,MAAM,IAAI,CAAA;CACvB;AAED,MAAM,WAAW,UAAU;IACzB,QAAQ,CAAC,EAAE,SAAS,CAAA;CACrB;AAED,MAAM,WAAW,cAAc;IAC7B;;;;OAIG;IACH,IAAI,EAAE,MAAM,MAAM,GAAG,IAAI,CAAA;IACzB,kDAAkD;IAClD,KAAK,EAAE,MAAM,IAAI,CAAA;IACjB,qCAAqC;IACrC,MAAM,EAAE,MAAM,IAAI,CAAA;IAClB,yDAAyD;IACzD,KAAK,EAAE,MAAM,IAAI,CAAA;IACjB,kDAAkD;IAClD,MAAM,EAAE,OAAO,CAAA;IACf;;;OAGG;IACH,SAAS,EAAE,OAAO,CAAA;IAClB;;;;OAIG;IACH,WAAW,EAAE,MAAM,GAAG,IAAI,CAAA;IAC1B;;;OAGG;IACH,KAAK,EAAE,EAAE,CAAC,UAAU,CAAC,CAAA;CACtB"}

package/dist/usePopupWindow.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"usePopupWindow.d.ts","sourceRoot":"","sources":["../src/usePopupWindow.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAEV,cAAc,EAEd,qBAAqB,EACtB,MAAM,SAAS,CAAA;AA8DhB;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,cAAc,CAAC,OAAO,GAAE,qBAA0B,GAAG,cAAc,CAmHlF"}
+{"version":3,"file":"usePopupWindow.d.ts","sourceRoot":"","sources":["../src/usePopupWindow.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAEV,cAAc,EAEd,qBAAqB,EACtB,MAAM,SAAS,CAAA;AAgFhB;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,cAAc,CAAC,OAAO,GAAE,qBAA0B,GAAG,cAAc,CA+KlF"}

package/dist/whenStylesheetsLoad.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Calls `callback` once every stylesheet in `links` that applies has loaded
+ * or failed, or after `timeoutMs`, whichever comes first.
+ *
+ * When none of them is still loading, `callback` runs synchronously, before
+ * this function returns. Links that do not apply are not waited for: an
+ * alternate stylesheet, or a `media` query that does not match, such as
+ * `print`. Browsers fetch those at the lowest priority.
+ *
+ * Returns a function that stops waiting without calling `callback`.
+ */
+export declare function whenStylesheetsLoad(links: readonly HTMLLinkElement[], timeoutMs: number, callback: () => void): () => void;
+//# sourceMappingURL=whenStylesheetsLoad.d.ts.map

package/dist/whenStylesheetsLoad.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"whenStylesheetsLoad.d.ts","sourceRoot":"","sources":["../src/whenStylesheetsLoad.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AACH,wBAAgB,mBAAmB,CACjC,KAAK,EAAE,SAAS,eAAe,EAAE,EACjC,SAAS,EAAE,MAAM,EACjB,QAAQ,EAAE,MAAM,IAAI,GACnB,MAAM,IAAI,CA+BZ"}

package/package.json

@@ -1,100 +1,101 @@
-{
-  "name": "@jielga/react-popup-window",
-  "version": "0.1.0",
-  "description": "React hook to open part of your UI in a separate browser popup window — live portal rendering, style syncing and cross-window messaging.",
-  "type": "module",
-  "license": "MIT",
-  "author": "jielga",
-  "repository": {
-    "type": "git",
-    "url": "git+https://github.com/jielga/react-popup-window.git"
-  },
-  "homepage": "https://jielga.github.io/react-popup-window/",
-  "bugs": {
-    "url": "https://github.com/jielga/react-popup-window/issues"
-  },
-  "keywords": [
-    "react",
-    "hook",
-    "popup",
-    "window",
-    "portal",
-    "window.open",
-    "multi-window",
-    "detached",
-    "panel",
-    "tanstack-intent"
-  ],
-  "sideEffects": false,
-  "files": [
-    "dist",
-    "skills",
-    "!skills/_artifacts"
-  ],
-  "intent": {
-    "docs": "README.md",
-    "repo": "Jielga/react-popup-window"
-  },
-  "main": "./dist/index.cjs",
-  "module": "./dist/index.js",
-  "types": "./dist/index.d.ts",
-  "exports": {
-    ".": {
-      "types": "./dist/index.d.ts",
-      "import": "./dist/index.js",
-      "require": "./dist/index.cjs"
-    }
-  },
-  "scripts": {
-    "dev": "vite --config docs/vite.config.ts",
-    "build": "vite build && tsc -p tsconfig.build.json",
-    "docs:build": "vite build --config docs/vite.config.ts",
-    "docs:preview": "vite preview --config docs/vite.config.ts",
-    "test": "vitest run",
-    "test:watch": "vitest",
-    "e2e": "playwright test",
-    "typecheck": "tsc -p tsconfig.json --noEmit",
-    "skills:validate": "intent validate",
-    "changeset": "changeset",
-    "version-packages": "changeset version && node scripts/sync-skill-version.mjs",
-    "release": "changeset publish",
-    "prepublishOnly": "npm run build"
-  },
-  "peerDependencies": {
-    "react": ">=19.2.0",
-    "react-dom": ">=19.2.0"
-  },
-  "publishConfig": {
-    "access": "public",
-    "provenance": true
-  },
-  "devDependencies": {
-    "@changesets/changelog-github": "^1.0.0",
-    "@changesets/cli": "^3.0.1",
-    "@jielga/tmdatagrid": "^0.5.0",
-    "@mantine/core": "^9.5.1",
-    "@mantine/hooks": "^9.5.1",
-    "@playwright/test": "^1.62.1",
-    "@tabler/icons-react": "^3.46.0",
-    "@tanstack/intent": "^0.3.6",
-    "@tanstack/react-query": "^5.101.4",
-    "@tanstack/react-store": "^0.11.1",
-    "@tanstack/react-table": "9.0.0-beta.21",
-    "@tanstack/react-virtual": "^3.14.9",
-    "@tanstack/store": "^0.11.1",
-    "@tanstack/table-core": "9.0.0-beta.21",
-    "@testing-library/dom": "^10.4.1",
-    "@testing-library/react": "^16.3.2",
-    "@types/node": "^26.1.2",
-    "@types/react": "^19.2.18",
-    "@types/react-dom": "^19.2.4",
-    "@vitejs/plugin-react": "^6.0.5",
-    "jsdom": "^30.0.1",
-    "react": "^19.2.8",
-    "react-dom": "^19.2.8",
-    "react-resizable-panels": "^4.12.2",
-    "typescript": "^7.0.2",
-    "vite": "^8.2.1",
-    "vitest": "^4.1.10"
-  }
-}
+{
+  "name": "@jielga/react-popup-window",
+  "version": "0.2.0",
+  "description": "React hook to open part of your UI in a separate browser popup window — live portal rendering, style syncing and cross-window messaging.",
+  "type": "module",
+  "license": "MIT",
+  "author": "jielga",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/Jielga/react-popup-window.git"
+  },
+  "homepage": "https://jielga.github.io/react-popup-window/",
+  "bugs": {
+    "url": "https://github.com/Jielga/react-popup-window/issues"
+  },
+  "keywords": [
+    "react",
+    "hook",
+    "popup",
+    "window",
+    "portal",
+    "window.open",
+    "multi-window",
+    "detached",
+    "panel",
+    "tanstack-intent"
+  ],
+  "sideEffects": false,
+  "files": [
+    "dist",
+    "skills",
+    "!skills/_artifacts"
+  ],
+  "intent": {
+    "docs": "README.md",
+    "repo": "Jielga/react-popup-window"
+  },
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "require": "./dist/index.cjs"
+    }
+  },
+  "scripts": {
+    "dev": "vite --config docs/vite.config.ts",
+    "build": "vite build && tsc -p tsconfig.build.json",
+    "docs:build": "vite build --config docs/vite.config.ts",
+    "docs:preview": "vite preview --config docs/vite.config.ts",
+    "test": "vitest run",
+    "test:watch": "vitest",
+    "e2e": "playwright test",
+    "typecheck": "tsc -p tsconfig.json --noEmit",
+    "skills:validate": "node node_modules/@tanstack/intent/dist/cli.mjs validate",
+    "changeset": "changeset",
+    "version-packages": "changeset version && npm install --package-lock-only --no-audit --no-fund && node scripts/sync-skill-version.mjs",
+    "release": "changeset publish",
+    "prepublishOnly": "npm run build"
+  },
+  "peerDependencies": {
+    "react": ">=19.2.0",
+    "react-dom": ">=19.2.0"
+  },
+  "publishConfig": {
+    "access": "public",
+    "provenance": true
+  },
+  "devDependencies": {
+    "@changesets/changelog-github": "^1.0.0",
+    "@changesets/cli": "^3.0.1",
+    "@jielga/tmdatagrid": "^2.0.0-beta.15",
+    "@mantine/core": "^9.5.1",
+    "@mantine/hooks": "^9.5.1",
+    "@playwright/test": "^1.62.1",
+    "@tabler/icons-react": "^3.46.0",
+    "@tanstack/intent": "^0.3.6",
+    "@tanstack/react-form": "^1.33.5",
+    "@tanstack/react-query": "^5.101.4",
+    "@tanstack/react-store": "^0.11.1",
+    "@tanstack/react-table": "^9.2.4",
+    "@tanstack/react-virtual": "^3.14.9",
+    "@tanstack/store": "^0.11.1",
+    "@tanstack/table-core": "^9.2.4",
+    "@testing-library/dom": "^10.4.1",
+    "@testing-library/react": "^16.3.2",
+    "@types/node": "^26.1.2",
+    "@types/react": "^19.2.18",
+    "@types/react-dom": "^19.2.4",
+    "@vitejs/plugin-react": "^6.0.5",
+    "jsdom": "^30.0.1",
+    "react": "^19.2.8",
+    "react-dom": "^19.2.8",
+    "react-resizable-panels": "^4.12.2",
+    "typescript": "^7.0.2",
+    "vite": "^8.2.1",
+    "vitest": "^4.1.10"
+  }
+}