@gallerist/plugin-fullscreen 0.0.0-stage → 0.3.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Shafayet Ahmmed
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,3 +1,51 @@
-# Temporary Holding Version
+# @gallerist/plugin-fullscreen
 
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.
+Gallerist plugin — native Fullscreen API toggle (toolbar button + 'f' key).
+
+Part of [Gallerist](https://github.com/shafayet9780/gallerist#readme) — a headless, framework-agnostic media viewer for grouped / nested galleries with image-space overlays and virtualized rendering.
+
+## Install
+
+```bash
+npm i @gallerist/plugin-fullscreen
+```
+
+## Usage
+
+```ts
+import { createViewer } from '@gallerist/core'
+import { fullscreen } from '@gallerist/plugin-fullscreen'
+import { mount } from '@gallerist/renderer-dom'
+
+const viewer = createViewer({ groups, plugins: [fullscreen()] })
+mount(viewer)
+
+viewer.on('fullscreenChange', ({ fullscreen }) => console.log('fullscreen:', fullscreen))
+```
+
+A toggle joins the toolbar (pressed while fullscreen), and `f` toggles. The plugin fullscreens this
+viewer's own root, so two viewers on a page don't fullscreen each other, and a fullscreen `<video>`
+elsewhere on the page doesn't count as ours. Older Safari's prefixed API is used where the standard one
+is missing.
+
+| Option | Default | |
+|---|---|---|
+| `target` | the viewer's root | a CSS selector for the element to fullscreen instead |
+| `strings` | English | the button's label (`toggle`), for translation; defaults in `DEFAULT_FULLSCREEN_STRINGS` |
+
+While the viewer is fullscreen the default renderer collapses the thumbnail rail, and restores it on
+exit (a toggle of the rail while fullscreen wins). The viewer emits `fullscreenChange` with
+`{ viewer, fullscreen }` on every change.
+
+Browsers only enter fullscreen from a user gesture (a click or a key press); a refused request is
+ignored. iPhone Safari has no element fullscreen (only `<video>`), so there the button does nothing;
+hide it with CSS (`.gallerist-fullscreen-btn`) if you'd rather not show it.
+
+See [Plugin authoring](https://github.com/shafayet9780/gallerist/blob/main/docs/PLUGIN-AUTHORING.md):
+this plugin is the small example of a toolbar button.
+
+Full docs: the [monorepo README](https://github.com/shafayet9780/gallerist#readme) and [`docs/`](https://github.com/shafayet9780/gallerist/tree/main/docs).
+
+## License
+
+MIT © Shafayet Ahmmed

package/dist/index.cjs

@@ -0,0 +1,79 @@
+'use strict';
+
+var internal = require('@gallerist/core/internal');
+
+// src/index.ts
+var DEFAULT_FULLSCREEN_STRINGS = { toggle: "Toggle fullscreen" };
+function fullscreen(opts = {}) {
+  return (viewer) => {
+    let boundRoot = null;
+    const resolveRoot = (from) => {
+      if (opts.target) return document.querySelector(opts.target);
+      return boundRoot ?? from?.closest(".gallerist") ?? document.querySelector(".gallerist");
+    };
+    const fsElement = () => document.fullscreenElement ?? document.webkitFullscreenElement ?? null;
+    const isOurFullscreen = (el) => {
+      const fe = fsElement();
+      return !!fe && !!el && (fe === el || el.contains(fe));
+    };
+    const requestFs = (el) => (el.requestFullscreen ?? el.webkitRequestFullscreen)?.call(el);
+    const exitFs = () => (document.exitFullscreen ?? document.webkitExitFullscreen)?.call(document);
+    const toggle = async (from) => {
+      const el = resolveRoot(from);
+      if (!el) return;
+      boundRoot = el;
+      try {
+        if (isOurFullscreen(el)) await exitFs();
+        else await requestFs(el);
+      } catch {
+      }
+    };
+    let btnEl = null;
+    const onChange = () => {
+      const fullscreen2 = isOurFullscreen(resolveRoot());
+      btnEl?.setAttribute("aria-pressed", String(fullscreen2));
+      internal.getInternals(viewer).emit("fullscreenChange", { viewer, fullscreen: fullscreen2 });
+    };
+    const button = () => {
+      const btn = document.createElement("button");
+      btn.type = "button";
+      btn.className = "gallerist-fullscreen-btn";
+      btn.setAttribute("aria-label", opts.strings?.toggle ?? DEFAULT_FULLSCREEN_STRINGS.toggle);
+      btn.setAttribute("aria-pressed", "false");
+      btn.innerHTML = internal.ICONS.fullscreen;
+      btnEl = btn;
+      btn.addEventListener("click", () => void toggle(btn));
+      queueMicrotask(() => {
+        boundRoot = btn.closest(".gallerist") ?? boundRoot;
+      });
+      return btn;
+    };
+    return {
+      name: "fullscreen",
+      init() {
+        if (typeof document !== "undefined") {
+          document.addEventListener("fullscreenchange", onChange);
+          document.addEventListener("webkitfullscreenchange", onChange);
+        }
+      },
+      destroy() {
+        btnEl = null;
+        if (typeof document !== "undefined") {
+          document.removeEventListener("fullscreenchange", onChange);
+          document.removeEventListener("webkitfullscreenchange", onChange);
+        }
+      },
+      keymap: {
+        f: () => void toggle()
+      },
+      regions: {
+        toolbar: button
+      }
+    };
+  };
+}
+
+exports.DEFAULT_FULLSCREEN_STRINGS = DEFAULT_FULLSCREEN_STRINGS;
+exports.fullscreen = fullscreen;
+//# sourceMappingURL=index.cjs.map
+//# sourceMappingURL=index.cjs.map

package/dist/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/index.ts"],"names":["fullscreen","getInternals","ICONS"],"mappings":"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","file":"index.cjs","sourcesContent":["// @gallerist/plugin-fullscreen — native Fullscreen API toggle (spec §14).\n// Adds a toolbar button + the `f` key, fullscreens the viewer root, and emits `fullscreenChange`.\n// Plugins may touch the DOM (the headless invariant binds @gallerist/core only).\n\nimport type { Plugin } from '@gallerist/core'\nimport { ICONS, getInternals } from '@gallerist/core/internal'\n\nexport interface FullscreenStrings {\n  /** the toolbar button's label */\n  toggle: string\n}\n\nexport const DEFAULT_FULLSCREEN_STRINGS: FullscreenStrings = { toggle: 'Toggle fullscreen' }\n\nexport interface FullscreenOptions {\n  /** CSS selector for the element to fullscreen; defaults to the bound viewer's root. */\n  target?: string\n  /** UI text overrides, for translation; merged over English. */\n  strings?: Partial<FullscreenStrings>\n}\n\n// WebKit (older Safari / iPadOS) ships the prefixed Fullscreen API. iPhone has no element\n// fullscreen at all (only <video>), which the unprefixed-or-prefixed calls below no-op on.\ntype WebkitDoc = Document & {\n  webkitFullscreenElement?: Element | null\n  webkitExitFullscreen?: () => Promise<void> | void\n}\ntype WebkitEl = HTMLElement & { webkitRequestFullscreen?: () => Promise<void> | void }\n\nexport function fullscreen(opts: FullscreenOptions = {}): Plugin {\n  return (viewer) => {\n    // The plugin is bound to one viewer, but the Fullscreen API and its change event are\n    // document-global. Resolve and remember *this* viewer's root (captured from the mounted\n    // toolbar button) so multi-viewer pages don't fullscreen / exit the wrong element (I-PL4).\n    let boundRoot: HTMLElement | null = null\n    const resolveRoot = (from?: HTMLElement | null): HTMLElement | null => {\n      if (opts.target) return document.querySelector<HTMLElement>(opts.target)\n      return (\n        boundRoot ??\n        from?.closest<HTMLElement>('.gallerist') ??\n        document.querySelector('.gallerist')\n      )\n    }\n\n    const fsElement = (): Element | null =>\n      document.fullscreenElement ?? (document as WebkitDoc).webkitFullscreenElement ?? null\n    // Base enter/exit on whether *our* root is the fullscreen element, not just \"is anything\n    // fullscreen\" — otherwise an unrelated fullscreen <video> would make our button exit it (S-PL5).\n    const isOurFullscreen = (el: HTMLElement | null): boolean => {\n      const fe = fsElement()\n      return !!fe && !!el && (fe === el || el.contains(fe))\n    }\n    const requestFs = (el: HTMLElement) =>\n      (el.requestFullscreen ?? (el as WebkitEl).webkitRequestFullscreen)?.call(el)\n    const exitFs = () =>\n      (document.exitFullscreen ?? (document as WebkitDoc).webkitExitFullscreen)?.call(document)\n\n    const toggle = async (from?: HTMLElement | null) => {\n      const el = resolveRoot(from)\n      if (!el) return\n      boundRoot = el\n      try {\n        if (isOurFullscreen(el)) await exitFs()\n        else await requestFs(el)\n      } catch {\n        // user-gesture / permission failures are non-fatal\n      }\n    }\n\n    let btnEl: HTMLButtonElement | null = null\n    // Look the internals up when emitting, not at construction, so building the plugin against a\n    // wrapped viewer or a test double doesn't throw.\n    const onChange = () => {\n      const fullscreen = isOurFullscreen(resolveRoot())\n      btnEl?.setAttribute('aria-pressed', String(fullscreen)) // a toggle: pressed while fullscreen\n      getInternals(viewer).emit('fullscreenChange', { viewer, fullscreen })\n    }\n\n    const button = () => {\n      const btn = document.createElement('button')\n      btn.type = 'button'\n      btn.className = 'gallerist-fullscreen-btn'\n      btn.setAttribute('aria-label', opts.strings?.toggle ?? DEFAULT_FULLSCREEN_STRINGS.toggle)\n      btn.setAttribute('aria-pressed', 'false')\n      btn.innerHTML = ICONS.fullscreen\n      btnEl = btn\n      btn.addEventListener('click', () => void toggle(btn))\n      // Capture our root once the button is mounted (so onChange/`f` target the right viewer).\n      queueMicrotask(() => {\n        boundRoot = btn.closest<HTMLElement>('.gallerist') ?? boundRoot\n      })\n      return btn\n    }\n\n    return {\n      name: 'fullscreen',\n      init() {\n        if (typeof document !== 'undefined') {\n          document.addEventListener('fullscreenchange', onChange)\n          document.addEventListener('webkitfullscreenchange', onChange)\n        }\n      },\n      destroy() {\n        btnEl = null\n        if (typeof document !== 'undefined') {\n          document.removeEventListener('fullscreenchange', onChange)\n          document.removeEventListener('webkitfullscreenchange', onChange)\n        }\n      },\n      keymap: {\n        f: () => void toggle(),\n      },\n      regions: {\n        toolbar: button,\n      },\n    }\n  }\n}\n"]}

package/dist/index.d.cts

@@ -0,0 +1,16 @@
+import { Plugin } from '@gallerist/core';
+
+interface FullscreenStrings {
+    /** the toolbar button's label */
+    toggle: string;
+}
+declare const DEFAULT_FULLSCREEN_STRINGS: FullscreenStrings;
+interface FullscreenOptions {
+    /** CSS selector for the element to fullscreen; defaults to the bound viewer's root. */
+    target?: string;
+    /** UI text overrides, for translation; merged over English. */
+    strings?: Partial<FullscreenStrings>;
+}
+declare function fullscreen(opts?: FullscreenOptions): Plugin;
+
+export { DEFAULT_FULLSCREEN_STRINGS, type FullscreenOptions, type FullscreenStrings, fullscreen };

package/dist/index.d.ts

@@ -0,0 +1,16 @@
+import { Plugin } from '@gallerist/core';
+
+interface FullscreenStrings {
+    /** the toolbar button's label */
+    toggle: string;
+}
+declare const DEFAULT_FULLSCREEN_STRINGS: FullscreenStrings;
+interface FullscreenOptions {
+    /** CSS selector for the element to fullscreen; defaults to the bound viewer's root. */
+    target?: string;
+    /** UI text overrides, for translation; merged over English. */
+    strings?: Partial<FullscreenStrings>;
+}
+declare function fullscreen(opts?: FullscreenOptions): Plugin;
+
+export { DEFAULT_FULLSCREEN_STRINGS, type FullscreenOptions, type FullscreenStrings, fullscreen };

package/dist/index.js

@@ -0,0 +1,76 @@
+import { getInternals, ICONS } from '@gallerist/core/internal';
+
+// src/index.ts
+var DEFAULT_FULLSCREEN_STRINGS = { toggle: "Toggle fullscreen" };
+function fullscreen(opts = {}) {
+  return (viewer) => {
+    let boundRoot = null;
+    const resolveRoot = (from) => {
+      if (opts.target) return document.querySelector(opts.target);
+      return boundRoot ?? from?.closest(".gallerist") ?? document.querySelector(".gallerist");
+    };
+    const fsElement = () => document.fullscreenElement ?? document.webkitFullscreenElement ?? null;
+    const isOurFullscreen = (el) => {
+      const fe = fsElement();
+      return !!fe && !!el && (fe === el || el.contains(fe));
+    };
+    const requestFs = (el) => (el.requestFullscreen ?? el.webkitRequestFullscreen)?.call(el);
+    const exitFs = () => (document.exitFullscreen ?? document.webkitExitFullscreen)?.call(document);
+    const toggle = async (from) => {
+      const el = resolveRoot(from);
+      if (!el) return;
+      boundRoot = el;
+      try {
+        if (isOurFullscreen(el)) await exitFs();
+        else await requestFs(el);
+      } catch {
+      }
+    };
+    let btnEl = null;
+    const onChange = () => {
+      const fullscreen2 = isOurFullscreen(resolveRoot());
+      btnEl?.setAttribute("aria-pressed", String(fullscreen2));
+      getInternals(viewer).emit("fullscreenChange", { viewer, fullscreen: fullscreen2 });
+    };
+    const button = () => {
+      const btn = document.createElement("button");
+      btn.type = "button";
+      btn.className = "gallerist-fullscreen-btn";
+      btn.setAttribute("aria-label", opts.strings?.toggle ?? DEFAULT_FULLSCREEN_STRINGS.toggle);
+      btn.setAttribute("aria-pressed", "false");
+      btn.innerHTML = ICONS.fullscreen;
+      btnEl = btn;
+      btn.addEventListener("click", () => void toggle(btn));
+      queueMicrotask(() => {
+        boundRoot = btn.closest(".gallerist") ?? boundRoot;
+      });
+      return btn;
+    };
+    return {
+      name: "fullscreen",
+      init() {
+        if (typeof document !== "undefined") {
+          document.addEventListener("fullscreenchange", onChange);
+          document.addEventListener("webkitfullscreenchange", onChange);
+        }
+      },
+      destroy() {
+        btnEl = null;
+        if (typeof document !== "undefined") {
+          document.removeEventListener("fullscreenchange", onChange);
+          document.removeEventListener("webkitfullscreenchange", onChange);
+        }
+      },
+      keymap: {
+        f: () => void toggle()
+      },
+      regions: {
+        toolbar: button
+      }
+    };
+  };
+}
+
+export { DEFAULT_FULLSCREEN_STRINGS, fullscreen };
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/index.ts"],"names":["fullscreen"],"mappings":"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","file":"index.js","sourcesContent":["// @gallerist/plugin-fullscreen — native Fullscreen API toggle (spec §14).\n// Adds a toolbar button + the `f` key, fullscreens the viewer root, and emits `fullscreenChange`.\n// Plugins may touch the DOM (the headless invariant binds @gallerist/core only).\n\nimport type { Plugin } from '@gallerist/core'\nimport { ICONS, getInternals } from '@gallerist/core/internal'\n\nexport interface FullscreenStrings {\n  /** the toolbar button's label */\n  toggle: string\n}\n\nexport const DEFAULT_FULLSCREEN_STRINGS: FullscreenStrings = { toggle: 'Toggle fullscreen' }\n\nexport interface FullscreenOptions {\n  /** CSS selector for the element to fullscreen; defaults to the bound viewer's root. */\n  target?: string\n  /** UI text overrides, for translation; merged over English. */\n  strings?: Partial<FullscreenStrings>\n}\n\n// WebKit (older Safari / iPadOS) ships the prefixed Fullscreen API. iPhone has no element\n// fullscreen at all (only <video>), which the unprefixed-or-prefixed calls below no-op on.\ntype WebkitDoc = Document & {\n  webkitFullscreenElement?: Element | null\n  webkitExitFullscreen?: () => Promise<void> | void\n}\ntype WebkitEl = HTMLElement & { webkitRequestFullscreen?: () => Promise<void> | void }\n\nexport function fullscreen(opts: FullscreenOptions = {}): Plugin {\n  return (viewer) => {\n    // The plugin is bound to one viewer, but the Fullscreen API and its change event are\n    // document-global. Resolve and remember *this* viewer's root (captured from the mounted\n    // toolbar button) so multi-viewer pages don't fullscreen / exit the wrong element (I-PL4).\n    let boundRoot: HTMLElement | null = null\n    const resolveRoot = (from?: HTMLElement | null): HTMLElement | null => {\n      if (opts.target) return document.querySelector<HTMLElement>(opts.target)\n      return (\n        boundRoot ??\n        from?.closest<HTMLElement>('.gallerist') ??\n        document.querySelector('.gallerist')\n      )\n    }\n\n    const fsElement = (): Element | null =>\n      document.fullscreenElement ?? (document as WebkitDoc).webkitFullscreenElement ?? null\n    // Base enter/exit on whether *our* root is the fullscreen element, not just \"is anything\n    // fullscreen\" — otherwise an unrelated fullscreen <video> would make our button exit it (S-PL5).\n    const isOurFullscreen = (el: HTMLElement | null): boolean => {\n      const fe = fsElement()\n      return !!fe && !!el && (fe === el || el.contains(fe))\n    }\n    const requestFs = (el: HTMLElement) =>\n      (el.requestFullscreen ?? (el as WebkitEl).webkitRequestFullscreen)?.call(el)\n    const exitFs = () =>\n      (document.exitFullscreen ?? (document as WebkitDoc).webkitExitFullscreen)?.call(document)\n\n    const toggle = async (from?: HTMLElement | null) => {\n      const el = resolveRoot(from)\n      if (!el) return\n      boundRoot = el\n      try {\n        if (isOurFullscreen(el)) await exitFs()\n        else await requestFs(el)\n      } catch {\n        // user-gesture / permission failures are non-fatal\n      }\n    }\n\n    let btnEl: HTMLButtonElement | null = null\n    // Look the internals up when emitting, not at construction, so building the plugin against a\n    // wrapped viewer or a test double doesn't throw.\n    const onChange = () => {\n      const fullscreen = isOurFullscreen(resolveRoot())\n      btnEl?.setAttribute('aria-pressed', String(fullscreen)) // a toggle: pressed while fullscreen\n      getInternals(viewer).emit('fullscreenChange', { viewer, fullscreen })\n    }\n\n    const button = () => {\n      const btn = document.createElement('button')\n      btn.type = 'button'\n      btn.className = 'gallerist-fullscreen-btn'\n      btn.setAttribute('aria-label', opts.strings?.toggle ?? DEFAULT_FULLSCREEN_STRINGS.toggle)\n      btn.setAttribute('aria-pressed', 'false')\n      btn.innerHTML = ICONS.fullscreen\n      btnEl = btn\n      btn.addEventListener('click', () => void toggle(btn))\n      // Capture our root once the button is mounted (so onChange/`f` target the right viewer).\n      queueMicrotask(() => {\n        boundRoot = btn.closest<HTMLElement>('.gallerist') ?? boundRoot\n      })\n      return btn\n    }\n\n    return {\n      name: 'fullscreen',\n      init() {\n        if (typeof document !== 'undefined') {\n          document.addEventListener('fullscreenchange', onChange)\n          document.addEventListener('webkitfullscreenchange', onChange)\n        }\n      },\n      destroy() {\n        btnEl = null\n        if (typeof document !== 'undefined') {\n          document.removeEventListener('fullscreenchange', onChange)\n          document.removeEventListener('webkitfullscreenchange', onChange)\n        }\n      },\n      keymap: {\n        f: () => void toggle(),\n      },\n      regions: {\n        toolbar: button,\n      },\n    }\n  }\n}\n"]}

package/package.json

@@ -1,6 +1,68 @@
 {
   "name": "@gallerist/plugin-fullscreen",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
+  "version": "0.3.0",
+  "description": "Gallerist plugin — native Fullscreen API toggle (toolbar button + 'f' key).",
+  "license": "MIT",
+  "type": "module",
+  "sideEffects": false,
+  "files": [
+    "dist",
+    "LICENSE",
+    "README.md"
+  ],
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "import": {
+        "types": "./dist/index.d.ts",
+        "default": "./dist/index.js"
+      },
+      "require": {
+        "types": "./dist/index.d.cts",
+        "default": "./dist/index.cjs"
+      }
+    }
+  },
+  "peerDependencies": {
+    "@gallerist/core": ">=0.3.0 <1"
+  },
+  "devDependencies": {
+    "tsup": "^8.3.5",
+    "typescript": "^5.7.2",
+    "@gallerist/core": "0.3.0"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/shafayet9780/gallerist.git",
+    "directory": "packages/plugin-fullscreen"
+  },
+  "homepage": "https://github.com/shafayet9780/gallerist#readme",
+  "bugs": {
+    "url": "https://github.com/shafayet9780/gallerist/issues"
+  },
+  "author": "Shafayet Ahmmed",
+  "keywords": [
+    "lightbox",
+    "gallery",
+    "image-viewer",
+    "media-viewer",
+    "photo-gallery",
+    "carousel",
+    "zoom",
+    "pan",
+    "overlays",
+    "headless",
+    "framework-agnostic",
+    "virtualized",
+    "nested-gallery"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "build": "tsup",
+    "typecheck": "tsc --noEmit"
+  }
 }