@embedpdf/plugin-fullscreen 1.5.0 → 2.0.0-next.0

package/dist/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("@embedpdf/core"),t="fullscreen",s={id:t,name:"Fullscreen Plugin",version:"1.0.0",provides:["fullscreen"],requires:[],optional:[],defaultConfig:{enabled:!0}},l="SET_FULLSCREEN";function n(e){return{type:l,payload:e}}const r=class extends e.BasePlugin{constructor(t,s){super(t,s),this.onStateChange$=e.createBehaviorEmitter(),this.fullscreenRequest$=e.createEmitter()}async initialize(e){}buildCapability(){return{isFullscreen:()=>this.state.isFullscreen,enableFullscreen:()=>this.enableFullscreen(),exitFullscreen:()=>this.exitFullscreen(),toggleFullscreen:()=>this.toggleFullscreen(),onRequest:this.fullscreenRequest$.on,onStateChange:this.onStateChange$.on}}toggleFullscreen(){this.state.isFullscreen?this.exitFullscreen():this.enableFullscreen()}enableFullscreen(){this.fullscreenRequest$.emit("enter")}exitFullscreen(){this.fullscreenRequest$.emit("exit")}onStoreUpdated(e,t){this.onStateChange$.emit(t)}setFullscreenState(e){this.dispatch(n(e))}async destroy(){this.fullscreenRequest$.clear(),super.destroy()}};r.id="fullscreen";let i=r;const u={isFullscreen:!1},c={manifest:s,create:e=>new i(t,e),reducer:(e,t)=>t.type===l?{...e,isFullscreen:t.payload}:e,initialState:u};exports.FULLSCREEN_PLUGIN_ID=t,exports.FullscreenPlugin=i,exports.FullscreenPluginPackage=c,exports.SET_FULLSCREEN=l,exports.initialState=u,exports.manifest=s,exports.setFullscreen=n;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("@embedpdf/core"),t="fullscreen",s={id:t,name:"Fullscreen Plugin",version:"1.0.0",provides:["fullscreen"],requires:[],optional:[],defaultConfig:{enabled:!0}},l="SET_FULLSCREEN";function n(e){return{type:l,payload:e}}const r=class extends e.BasePlugin{constructor(t,s,l){super(t,s),this.onStateChange$=e.createBehaviorEmitter(),this.fullscreenRequest$=e.createEmitter(),this.config=l}async initialize(e){}buildCapability(){return{isFullscreen:()=>this.state.isFullscreen,enableFullscreen:e=>this.enableFullscreen(e),exitFullscreen:()=>this.exitFullscreen(),toggleFullscreen:e=>this.toggleFullscreen(e),onRequest:this.fullscreenRequest$.on,onStateChange:this.onStateChange$.on}}getTargetSelector(){return this.currentTargetElement??this.config.targetElement}toggleFullscreen(e){this.state.isFullscreen?this.exitFullscreen():this.enableFullscreen(e)}enableFullscreen(e){this.currentTargetElement=e??this.config.targetElement,this.fullscreenRequest$.emit({action:"enter",targetElement:this.currentTargetElement})}exitFullscreen(){this.fullscreenRequest$.emit({action:"exit"}),this.currentTargetElement=void 0}onStoreUpdated(e,t){this.onStateChange$.emit(t)}setFullscreenState(e){this.dispatch(n(e))}async destroy(){this.fullscreenRequest$.clear(),super.destroy()}};r.id="fullscreen";let i=r;const c={isFullscreen:!1},u={manifest:s,create:(e,s)=>new i(t,e,s),reducer:(e,t)=>t.type===l?{...e,isFullscreen:t.payload}:e,initialState:c};exports.FULLSCREEN_PLUGIN_ID=t,exports.FullscreenPlugin=i,exports.FullscreenPluginPackage=u,exports.SET_FULLSCREEN=l,exports.initialState=c,exports.manifest=s,exports.setFullscreen=n;
 //# sourceMappingURL=index.cjs.map

package/dist/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../src/lib/manifest.ts","../src/lib/actions.ts","../src/lib/fullscreen-plugin.ts","../src/lib/reducer.ts","../src/lib/index.ts"],"sourcesContent":["import { PluginManifest } from '@embedpdf/core';\nimport { FullscreenPluginConfig } from './types';\n\nexport const FULLSCREEN_PLUGIN_ID = 'fullscreen';\n\nexport const manifest: PluginManifest<FullscreenPluginConfig> = {\n  id: FULLSCREEN_PLUGIN_ID,\n  name: 'Fullscreen Plugin',\n  version: '1.0.0',\n  provides: ['fullscreen'],\n  requires: [],\n  optional: [],\n  defaultConfig: {\n    enabled: true,\n  },\n};\n","import { Action } from '@embedpdf/core';\n\nexport const SET_FULLSCREEN = 'SET_FULLSCREEN';\n\nexport interface SetFullscreenAction extends Action {\n  type: typeof SET_FULLSCREEN;\n  payload: boolean;\n}\n\nexport type FullscreenAction = SetFullscreenAction;\n\nexport function setFullscreen(payload: boolean): SetFullscreenAction {\n  return { type: SET_FULLSCREEN, payload };\n}\n","import { BasePlugin, createBehaviorEmitter, createEmitter, PluginRegistry } from '@embedpdf/core';\nimport { FullscreenCapability, FullscreenPluginConfig, FullscreenState } from './types';\nimport { FullscreenAction, setFullscreen } from './actions';\n\nexport class FullscreenPlugin extends BasePlugin<\n  FullscreenPluginConfig,\n  FullscreenCapability,\n  FullscreenState,\n  FullscreenAction\n> {\n  static readonly id = 'fullscreen' as const;\n\n  private readonly onStateChange$ = createBehaviorEmitter<FullscreenState>();\n  private readonly fullscreenRequest$ = createEmitter<'enter' | 'exit'>();\n\n  constructor(id: string, registry: PluginRegistry) {\n    super(id, registry);\n  }\n\n  async initialize(_: FullscreenPluginConfig): Promise<void> {}\n\n  protected buildCapability(): FullscreenCapability {\n    return {\n      isFullscreen: () => this.state.isFullscreen,\n      enableFullscreen: () => this.enableFullscreen(),\n      exitFullscreen: () => this.exitFullscreen(),\n      toggleFullscreen: () => this.toggleFullscreen(),\n      onRequest: this.fullscreenRequest$.on,\n      onStateChange: this.onStateChange$.on,\n    };\n  }\n\n  private toggleFullscreen(): void {\n    if (this.state.isFullscreen) {\n      this.exitFullscreen();\n    } else {\n      this.enableFullscreen();\n    }\n  }\n\n  private enableFullscreen(): void {\n    this.fullscreenRequest$.emit('enter');\n  }\n\n  private exitFullscreen(): void {\n    this.fullscreenRequest$.emit('exit');\n  }\n\n  override onStoreUpdated(_: FullscreenState, newState: FullscreenState): void {\n    this.onStateChange$.emit(newState);\n  }\n\n  public setFullscreenState(isFullscreen: boolean): void {\n    this.dispatch(setFullscreen(isFullscreen));\n  }\n\n  async destroy(): Promise<void> {\n    this.fullscreenRequest$.clear();\n    super.destroy();\n  }\n}\n","import { Reducer } from '@embedpdf/core';\nimport { FullscreenState } from './types';\nimport { FullscreenAction, SET_FULLSCREEN } from './actions';\n\nexport const initialState: FullscreenState = {\n  isFullscreen: false,\n};\n\nexport const reducer: Reducer<FullscreenState, FullscreenAction> = (state, action) => {\n  switch (action.type) {\n    case SET_FULLSCREEN:\n      return { ...state, isFullscreen: action.payload };\n    default:\n      return state;\n  }\n};\n","import { PluginPackage } from '@embedpdf/core';\nimport { manifest, FULLSCREEN_PLUGIN_ID } from './manifest';\nimport { FullscreenPluginConfig, FullscreenState } from './types';\nimport { FullscreenPlugin } from './fullscreen-plugin';\nimport { initialState } from './reducer';\nimport { reducer } from './reducer';\nimport { FullscreenAction } from './actions';\n\nexport const FullscreenPluginPackage: PluginPackage<\n  FullscreenPlugin,\n  FullscreenPluginConfig,\n  FullscreenState,\n  FullscreenAction\n> = {\n  manifest,\n  create: (registry) => new FullscreenPlugin(FULLSCREEN_PLUGIN_ID, registry),\n  reducer,\n  initialState,\n};\n\nexport * from './fullscreen-plugin';\nexport * from './types';\nexport * from './manifest';\nexport * from './actions';\nexport { initialState };\n"],"names":["FULLSCREEN_PLUGIN_ID","manifest","id","name","version","provides","requires","optional","defaultConfig","enabled","SET_FULLSCREEN","setFullscreen","payload","type","_FullscreenPlugin","BasePlugin","constructor","registry","super","this","onStateChange$","createBehaviorEmitter","fullscreenRequest$","createEmitter","initialize","_","buildCapability","isFullscreen","state","enableFullscreen","exitFullscreen","toggleFullscreen","onRequest","on","onStateChange","emit","onStoreUpdated","newState","setFullscreenState","dispatch","destroy","clear","FullscreenPlugin","initialState","FullscreenPluginPackage","create","reducer","action"],"mappings":"kHAGaA,EAAuB,aAEvBC,EAAmD,CAC9DC,GAAIF,EACJG,KAAM,oBACNC,QAAS,QACTC,SAAU,CAAC,cACXC,SAAU,GACVC,SAAU,GACVC,cAAe,CACbC,SAAS,ICXAC,EAAiB,iBASvB,SAASC,EAAcC,GACrB,MAAA,CAAEC,KAAMH,EAAgBE,UACjC,CCTO,MAAME,EAAN,cAA+BC,EAAAA,WAWpC,WAAAC,CAAYd,EAAYe,GACtBC,MAAMhB,EAAIe,GAJKE,KAAAC,eAAiBC,0BACjBF,KAAAG,mBAAqBC,iBAAgC,CAMtE,gBAAMC,CAAWC,GAA0C,CAEjD,eAAAC,GACD,MAAA,CACLC,aAAc,IAAMR,KAAKS,MAAMD,aAC/BE,iBAAkB,IAAMV,KAAKU,mBAC7BC,eAAgB,IAAMX,KAAKW,iBAC3BC,iBAAkB,IAAMZ,KAAKY,mBAC7BC,UAAWb,KAAKG,mBAAmBW,GACnCC,cAAef,KAAKC,eAAea,GACrC,CAGM,gBAAAF,GACFZ,KAAKS,MAAMD,aACbR,KAAKW,iBAELX,KAAKU,kBACP,CAGM,gBAAAA,GACDV,KAAAG,mBAAmBa,KAAK,QAAO,CAG9B,cAAAL,GACDX,KAAAG,mBAAmBa,KAAK,OAAM,CAG5B,cAAAC,CAAeX,EAAoBY,GACrClB,KAAAC,eAAee,KAAKE,EAAQ,CAG5B,kBAAAC,CAAmBX,GACnBR,KAAAoB,SAAS5B,EAAcgB,GAAa,CAG3C,aAAMa,GACJrB,KAAKG,mBAAmBmB,QACxBvB,MAAMsB,SAAQ,GAhDhB1B,EAAgBZ,GAAK,aANhB,IAAMwC,EAAN5B,ECAA,MAAM6B,EAAgC,CAC3ChB,cAAc,GCGHiB,EAKT,CACF3C,WACA4C,OAAS5B,GAAa,IAAIyB,EAAiB1C,EAAsBiB,GACjE6B,QDRiE,CAAClB,EAAOmB,IACjEA,EAAOlC,OACRH,EACI,IAAKkB,EAAOD,aAAcoB,EAAOnC,SAEjCgB,ECIXe"}
+{"version":3,"file":"index.cjs","sources":["../src/lib/manifest.ts","../src/lib/actions.ts","../src/lib/fullscreen-plugin.ts","../src/lib/reducer.ts","../src/lib/index.ts"],"sourcesContent":["import { PluginManifest } from '@embedpdf/core';\nimport { FullscreenPluginConfig } from './types';\n\nexport const FULLSCREEN_PLUGIN_ID = 'fullscreen';\n\nexport const manifest: PluginManifest<FullscreenPluginConfig> = {\n  id: FULLSCREEN_PLUGIN_ID,\n  name: 'Fullscreen Plugin',\n  version: '1.0.0',\n  provides: ['fullscreen'],\n  requires: [],\n  optional: [],\n  defaultConfig: {\n    enabled: true,\n  },\n};\n","import { Action } from '@embedpdf/core';\n\nexport const SET_FULLSCREEN = 'SET_FULLSCREEN';\n\nexport interface SetFullscreenAction extends Action {\n  type: typeof SET_FULLSCREEN;\n  payload: boolean;\n}\n\nexport type FullscreenAction = SetFullscreenAction;\n\nexport function setFullscreen(payload: boolean): SetFullscreenAction {\n  return { type: SET_FULLSCREEN, payload };\n}\n","import { BasePlugin, createBehaviorEmitter, createEmitter, PluginRegistry } from '@embedpdf/core';\nimport {\n  FullscreenCapability,\n  FullscreenPluginConfig,\n  FullscreenState,\n  FullscreenRequestEvent,\n} from './types';\nimport { FullscreenAction, setFullscreen } from './actions';\n\nexport class FullscreenPlugin extends BasePlugin<\n  FullscreenPluginConfig,\n  FullscreenCapability,\n  FullscreenState,\n  FullscreenAction\n> {\n  static readonly id = 'fullscreen' as const;\n\n  private readonly onStateChange$ = createBehaviorEmitter<FullscreenState>();\n  private readonly fullscreenRequest$ = createEmitter<FullscreenRequestEvent>();\n  private config: FullscreenPluginConfig;\n  private currentTargetElement?: string;\n\n  constructor(id: string, registry: PluginRegistry, config: FullscreenPluginConfig) {\n    super(id, registry);\n    this.config = config;\n  }\n\n  async initialize(_: FullscreenPluginConfig): Promise<void> {}\n\n  protected buildCapability(): FullscreenCapability {\n    return {\n      isFullscreen: () => this.state.isFullscreen,\n      enableFullscreen: (targetElement?: string) => this.enableFullscreen(targetElement),\n      exitFullscreen: () => this.exitFullscreen(),\n      toggleFullscreen: (targetElement?: string) => this.toggleFullscreen(targetElement),\n      onRequest: this.fullscreenRequest$.on,\n      onStateChange: this.onStateChange$.on,\n    };\n  }\n\n  public getTargetSelector(): string | undefined {\n    // Return the current target (from last request) or fall back to config default\n    return this.currentTargetElement ?? this.config.targetElement;\n  }\n\n  private toggleFullscreen(targetElement?: string): void {\n    if (this.state.isFullscreen) {\n      this.exitFullscreen();\n    } else {\n      this.enableFullscreen(targetElement);\n    }\n  }\n\n  private enableFullscreen(targetElement?: string): void {\n    // Store the target element for this request\n    this.currentTargetElement = targetElement ?? this.config.targetElement;\n\n    this.fullscreenRequest$.emit({\n      action: 'enter',\n      targetElement: this.currentTargetElement,\n    });\n  }\n\n  private exitFullscreen(): void {\n    this.fullscreenRequest$.emit({\n      action: 'exit',\n    });\n\n    // Clear the current target when exiting\n    this.currentTargetElement = undefined;\n  }\n\n  override onStoreUpdated(_: FullscreenState, newState: FullscreenState): void {\n    this.onStateChange$.emit(newState);\n  }\n\n  public setFullscreenState(isFullscreen: boolean): void {\n    this.dispatch(setFullscreen(isFullscreen));\n  }\n\n  async destroy(): Promise<void> {\n    this.fullscreenRequest$.clear();\n    super.destroy();\n  }\n}\n","import { Reducer } from '@embedpdf/core';\nimport { FullscreenState } from './types';\nimport { FullscreenAction, SET_FULLSCREEN } from './actions';\n\nexport const initialState: FullscreenState = {\n  isFullscreen: false,\n};\n\nexport const reducer: Reducer<FullscreenState, FullscreenAction> = (state, action) => {\n  switch (action.type) {\n    case SET_FULLSCREEN:\n      return { ...state, isFullscreen: action.payload };\n    default:\n      return state;\n  }\n};\n","import { PluginPackage } from '@embedpdf/core';\nimport { manifest, FULLSCREEN_PLUGIN_ID } from './manifest';\nimport { FullscreenPluginConfig, FullscreenState } from './types';\nimport { FullscreenPlugin } from './fullscreen-plugin';\nimport { initialState } from './reducer';\nimport { reducer } from './reducer';\nimport { FullscreenAction } from './actions';\n\nexport const FullscreenPluginPackage: PluginPackage<\n  FullscreenPlugin,\n  FullscreenPluginConfig,\n  FullscreenState,\n  FullscreenAction\n> = {\n  manifest,\n  create: (registry, config) => new FullscreenPlugin(FULLSCREEN_PLUGIN_ID, registry, config),\n  reducer,\n  initialState,\n};\n\nexport * from './fullscreen-plugin';\nexport * from './types';\nexport * from './manifest';\nexport * from './actions';\nexport { initialState };\n"],"names":["FULLSCREEN_PLUGIN_ID","manifest","id","name","version","provides","requires","optional","defaultConfig","enabled","SET_FULLSCREEN","setFullscreen","payload","type","_FullscreenPlugin","BasePlugin","constructor","registry","config","super","this","onStateChange$","createBehaviorEmitter","fullscreenRequest$","createEmitter","initialize","_","buildCapability","isFullscreen","state","enableFullscreen","targetElement","exitFullscreen","toggleFullscreen","onRequest","on","onStateChange","getTargetSelector","currentTargetElement","emit","action","onStoreUpdated","newState","setFullscreenState","dispatch","destroy","clear","FullscreenPlugin","initialState","FullscreenPluginPackage","create","reducer"],"mappings":"kHAGaA,EAAuB,aAEvBC,EAAmD,CAC9DC,GAAIF,EACJG,KAAM,oBACNC,QAAS,QACTC,SAAU,CAAC,cACXC,SAAU,GACVC,SAAU,GACVC,cAAe,CACbC,SAAS,ICXAC,EAAiB,iBASvB,SAASC,EAAcC,GAC5B,MAAO,CAAEC,KAAMH,EAAgBE,UACjC,CCJO,MAAME,EAAN,cAA+BC,EAAAA,WAapC,WAAAC,CAAYd,EAAYe,EAA0BC,GAChDC,MAAMjB,EAAIe,GANZG,KAAiBC,eAAiBC,0BAClCF,KAAiBG,mBAAqBC,kBAMpCJ,KAAKF,OAASA,CAChB,CAEA,gBAAMO,CAAWC,GAA2C,CAElD,eAAAC,GACR,MAAO,CACLC,aAAc,IAAMR,KAAKS,MAAMD,aAC/BE,iBAAmBC,GAA2BX,KAAKU,iBAAiBC,GACpEC,eAAgB,IAAMZ,KAAKY,iBAC3BC,iBAAmBF,GAA2BX,KAAKa,iBAAiBF,GACpEG,UAAWd,KAAKG,mBAAmBY,GACnCC,cAAehB,KAAKC,eAAec,GAEvC,CAEO,iBAAAE,GAEL,OAAOjB,KAAKkB,sBAAwBlB,KAAKF,OAAOa,aAClD,CAEQ,gBAAAE,CAAiBF,GACnBX,KAAKS,MAAMD,aACbR,KAAKY,iBAELZ,KAAKU,iBAAiBC,EAE1B,CAEQ,gBAAAD,CAAiBC,GAEvBX,KAAKkB,qBAAuBP,GAAiBX,KAAKF,OAAOa,cAEzDX,KAAKG,mBAAmBgB,KAAK,CAC3BC,OAAQ,QACRT,cAAeX,KAAKkB,sBAExB,CAEQ,cAAAN,GACNZ,KAAKG,mBAAmBgB,KAAK,CAC3BC,OAAQ,SAIVpB,KAAKkB,0BAAuB,CAC9B,CAES,cAAAG,CAAef,EAAoBgB,GAC1CtB,KAAKC,eAAekB,KAAKG,EAC3B,CAEO,kBAAAC,CAAmBf,GACxBR,KAAKwB,SAASjC,EAAciB,GAC9B,CAEA,aAAMiB,GACJzB,KAAKG,mBAAmBuB,QACxB3B,MAAM0B,SACR,GApEA/B,EAAgBZ,GAAK,aANhB,IAAM6C,EAANjC,ECLA,MAAMkC,EAAgC,CAC3CpB,cAAc,GCGHqB,EAKT,CACFhD,WACAiD,OAAQ,CAACjC,EAAUC,IAAW,IAAI6B,EAAiB/C,EAAsBiB,EAAUC,GACnFiC,QDRiE,CAACtB,EAAOW,IACjEA,EAAO3B,OACRH,EACI,IAAKmB,EAAOD,aAAcY,EAAO5B,SAEjCiB,ECIXmB"}

package/dist/index.js

@@ -16,35 +16,46 @@ function setFullscreen(payload) {
   return { type: SET_FULLSCREEN, payload };
 }
 const _FullscreenPlugin = class _FullscreenPlugin extends BasePlugin {
-  constructor(id, registry) {
+  constructor(id, registry, config) {
     super(id, registry);
     this.onStateChange$ = createBehaviorEmitter();
     this.fullscreenRequest$ = createEmitter();
+    this.config = config;
   }
   async initialize(_) {
   }
   buildCapability() {
     return {
       isFullscreen: () => this.state.isFullscreen,
-      enableFullscreen: () => this.enableFullscreen(),
+      enableFullscreen: (targetElement) => this.enableFullscreen(targetElement),
       exitFullscreen: () => this.exitFullscreen(),
-      toggleFullscreen: () => this.toggleFullscreen(),
+      toggleFullscreen: (targetElement) => this.toggleFullscreen(targetElement),
       onRequest: this.fullscreenRequest$.on,
       onStateChange: this.onStateChange$.on
     };
   }
-  toggleFullscreen() {
+  getTargetSelector() {
+    return this.currentTargetElement ?? this.config.targetElement;
+  }
+  toggleFullscreen(targetElement) {
     if (this.state.isFullscreen) {
       this.exitFullscreen();
     } else {
-      this.enableFullscreen();
+      this.enableFullscreen(targetElement);
     }
   }
-  enableFullscreen() {
-    this.fullscreenRequest$.emit("enter");
+  enableFullscreen(targetElement) {
+    this.currentTargetElement = targetElement ?? this.config.targetElement;
+    this.fullscreenRequest$.emit({
+      action: "enter",
+      targetElement: this.currentTargetElement
+    });
   }
   exitFullscreen() {
-    this.fullscreenRequest$.emit("exit");
+    this.fullscreenRequest$.emit({
+      action: "exit"
+    });
+    this.currentTargetElement = void 0;
   }
   onStoreUpdated(_, newState) {
     this.onStateChange$.emit(newState);
@@ -72,7 +83,7 @@ const reducer = (state, action) => {
 };
 const FullscreenPluginPackage = {
   manifest,
-  create: (registry) => new FullscreenPlugin(FULLSCREEN_PLUGIN_ID, registry),
+  create: (registry, config) => new FullscreenPlugin(FULLSCREEN_PLUGIN_ID, registry, config),
   reducer,
   initialState
 };

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../src/lib/manifest.ts","../src/lib/actions.ts","../src/lib/fullscreen-plugin.ts","../src/lib/reducer.ts","../src/lib/index.ts"],"sourcesContent":["import { PluginManifest } from '@embedpdf/core';\nimport { FullscreenPluginConfig } from './types';\n\nexport const FULLSCREEN_PLUGIN_ID = 'fullscreen';\n\nexport const manifest: PluginManifest<FullscreenPluginConfig> = {\n  id: FULLSCREEN_PLUGIN_ID,\n  name: 'Fullscreen Plugin',\n  version: '1.0.0',\n  provides: ['fullscreen'],\n  requires: [],\n  optional: [],\n  defaultConfig: {\n    enabled: true,\n  },\n};\n","import { Action } from '@embedpdf/core';\n\nexport const SET_FULLSCREEN = 'SET_FULLSCREEN';\n\nexport interface SetFullscreenAction extends Action {\n  type: typeof SET_FULLSCREEN;\n  payload: boolean;\n}\n\nexport type FullscreenAction = SetFullscreenAction;\n\nexport function setFullscreen(payload: boolean): SetFullscreenAction {\n  return { type: SET_FULLSCREEN, payload };\n}\n","import { BasePlugin, createBehaviorEmitter, createEmitter, PluginRegistry } from '@embedpdf/core';\nimport { FullscreenCapability, FullscreenPluginConfig, FullscreenState } from './types';\nimport { FullscreenAction, setFullscreen } from './actions';\n\nexport class FullscreenPlugin extends BasePlugin<\n  FullscreenPluginConfig,\n  FullscreenCapability,\n  FullscreenState,\n  FullscreenAction\n> {\n  static readonly id = 'fullscreen' as const;\n\n  private readonly onStateChange$ = createBehaviorEmitter<FullscreenState>();\n  private readonly fullscreenRequest$ = createEmitter<'enter' | 'exit'>();\n\n  constructor(id: string, registry: PluginRegistry) {\n    super(id, registry);\n  }\n\n  async initialize(_: FullscreenPluginConfig): Promise<void> {}\n\n  protected buildCapability(): FullscreenCapability {\n    return {\n      isFullscreen: () => this.state.isFullscreen,\n      enableFullscreen: () => this.enableFullscreen(),\n      exitFullscreen: () => this.exitFullscreen(),\n      toggleFullscreen: () => this.toggleFullscreen(),\n      onRequest: this.fullscreenRequest$.on,\n      onStateChange: this.onStateChange$.on,\n    };\n  }\n\n  private toggleFullscreen(): void {\n    if (this.state.isFullscreen) {\n      this.exitFullscreen();\n    } else {\n      this.enableFullscreen();\n    }\n  }\n\n  private enableFullscreen(): void {\n    this.fullscreenRequest$.emit('enter');\n  }\n\n  private exitFullscreen(): void {\n    this.fullscreenRequest$.emit('exit');\n  }\n\n  override onStoreUpdated(_: FullscreenState, newState: FullscreenState): void {\n    this.onStateChange$.emit(newState);\n  }\n\n  public setFullscreenState(isFullscreen: boolean): void {\n    this.dispatch(setFullscreen(isFullscreen));\n  }\n\n  async destroy(): Promise<void> {\n    this.fullscreenRequest$.clear();\n    super.destroy();\n  }\n}\n","import { Reducer } from '@embedpdf/core';\nimport { FullscreenState } from './types';\nimport { FullscreenAction, SET_FULLSCREEN } from './actions';\n\nexport const initialState: FullscreenState = {\n  isFullscreen: false,\n};\n\nexport const reducer: Reducer<FullscreenState, FullscreenAction> = (state, action) => {\n  switch (action.type) {\n    case SET_FULLSCREEN:\n      return { ...state, isFullscreen: action.payload };\n    default:\n      return state;\n  }\n};\n","import { PluginPackage } from '@embedpdf/core';\nimport { manifest, FULLSCREEN_PLUGIN_ID } from './manifest';\nimport { FullscreenPluginConfig, FullscreenState } from './types';\nimport { FullscreenPlugin } from './fullscreen-plugin';\nimport { initialState } from './reducer';\nimport { reducer } from './reducer';\nimport { FullscreenAction } from './actions';\n\nexport const FullscreenPluginPackage: PluginPackage<\n  FullscreenPlugin,\n  FullscreenPluginConfig,\n  FullscreenState,\n  FullscreenAction\n> = {\n  manifest,\n  create: (registry) => new FullscreenPlugin(FULLSCREEN_PLUGIN_ID, registry),\n  reducer,\n  initialState,\n};\n\nexport * from './fullscreen-plugin';\nexport * from './types';\nexport * from './manifest';\nexport * from './actions';\nexport { initialState };\n"],"names":[],"mappings":";AAGO,MAAM,uBAAuB;AAE7B,MAAM,WAAmD;AAAA,EAC9D,IAAI;AAAA,EACJ,MAAM;AAAA,EACN,SAAS;AAAA,EACT,UAAU,CAAC,YAAY;AAAA,EACvB,UAAU,CAAC;AAAA,EACX,UAAU,CAAC;AAAA,EACX,eAAe;AAAA,IACb,SAAS;AAAA,EAAA;AAEb;ACbO,MAAM,iBAAiB;AASvB,SAAS,cAAc,SAAuC;AAC5D,SAAA,EAAE,MAAM,gBAAgB,QAAQ;AACzC;ACTO,MAAM,oBAAN,MAAM,0BAAyB,WAKpC;AAAA,EAMA,YAAY,IAAY,UAA0B;AAChD,UAAM,IAAI,QAAQ;AAJpB,SAAiB,iBAAiB,sBAAuC;AACzE,SAAiB,qBAAqB,cAAgC;AAAA,EAAA;AAAA,EAMtE,MAAM,WAAW,GAA0C;AAAA,EAAA;AAAA,EAEjD,kBAAwC;AACzC,WAAA;AAAA,MACL,cAAc,MAAM,KAAK,MAAM;AAAA,MAC/B,kBAAkB,MAAM,KAAK,iBAAiB;AAAA,MAC9C,gBAAgB,MAAM,KAAK,eAAe;AAAA,MAC1C,kBAAkB,MAAM,KAAK,iBAAiB;AAAA,MAC9C,WAAW,KAAK,mBAAmB;AAAA,MACnC,eAAe,KAAK,eAAe;AAAA,IACrC;AAAA,EAAA;AAAA,EAGM,mBAAyB;AAC3B,QAAA,KAAK,MAAM,cAAc;AAC3B,WAAK,eAAe;AAAA,IAAA,OACf;AACL,WAAK,iBAAiB;AAAA,IAAA;AAAA,EACxB;AAAA,EAGM,mBAAyB;AAC1B,SAAA,mBAAmB,KAAK,OAAO;AAAA,EAAA;AAAA,EAG9B,iBAAuB;AACxB,SAAA,mBAAmB,KAAK,MAAM;AAAA,EAAA;AAAA,EAG5B,eAAe,GAAoB,UAAiC;AACtE,SAAA,eAAe,KAAK,QAAQ;AAAA,EAAA;AAAA,EAG5B,mBAAmB,cAA6B;AAChD,SAAA,SAAS,cAAc,YAAY,CAAC;AAAA,EAAA;AAAA,EAG3C,MAAM,UAAyB;AAC7B,SAAK,mBAAmB,MAAM;AAC9B,UAAM,QAAQ;AAAA,EAAA;AAElB;AAlDE,kBAAgB,KAAK;AANhB,IAAM,mBAAN;ACAA,MAAM,eAAgC;AAAA,EAC3C,cAAc;AAChB;AAEa,MAAA,UAAsD,CAAC,OAAO,WAAW;AACpF,UAAQ,OAAO,MAAM;AAAA,IACnB,KAAK;AACH,aAAO,EAAE,GAAG,OAAO,cAAc,OAAO,QAAQ;AAAA,IAClD;AACS,aAAA;AAAA,EAAA;AAEb;ACPO,MAAM,0BAKT;AAAA,EACF;AAAA,EACA,QAAQ,CAAC,aAAa,IAAI,iBAAiB,sBAAsB,QAAQ;AAAA,EACzE;AAAA,EACA;AACF;"}
+{"version":3,"file":"index.js","sources":["../src/lib/manifest.ts","../src/lib/actions.ts","../src/lib/fullscreen-plugin.ts","../src/lib/reducer.ts","../src/lib/index.ts"],"sourcesContent":["import { PluginManifest } from '@embedpdf/core';\nimport { FullscreenPluginConfig } from './types';\n\nexport const FULLSCREEN_PLUGIN_ID = 'fullscreen';\n\nexport const manifest: PluginManifest<FullscreenPluginConfig> = {\n  id: FULLSCREEN_PLUGIN_ID,\n  name: 'Fullscreen Plugin',\n  version: '1.0.0',\n  provides: ['fullscreen'],\n  requires: [],\n  optional: [],\n  defaultConfig: {\n    enabled: true,\n  },\n};\n","import { Action } from '@embedpdf/core';\n\nexport const SET_FULLSCREEN = 'SET_FULLSCREEN';\n\nexport interface SetFullscreenAction extends Action {\n  type: typeof SET_FULLSCREEN;\n  payload: boolean;\n}\n\nexport type FullscreenAction = SetFullscreenAction;\n\nexport function setFullscreen(payload: boolean): SetFullscreenAction {\n  return { type: SET_FULLSCREEN, payload };\n}\n","import { BasePlugin, createBehaviorEmitter, createEmitter, PluginRegistry } from '@embedpdf/core';\nimport {\n  FullscreenCapability,\n  FullscreenPluginConfig,\n  FullscreenState,\n  FullscreenRequestEvent,\n} from './types';\nimport { FullscreenAction, setFullscreen } from './actions';\n\nexport class FullscreenPlugin extends BasePlugin<\n  FullscreenPluginConfig,\n  FullscreenCapability,\n  FullscreenState,\n  FullscreenAction\n> {\n  static readonly id = 'fullscreen' as const;\n\n  private readonly onStateChange$ = createBehaviorEmitter<FullscreenState>();\n  private readonly fullscreenRequest$ = createEmitter<FullscreenRequestEvent>();\n  private config: FullscreenPluginConfig;\n  private currentTargetElement?: string;\n\n  constructor(id: string, registry: PluginRegistry, config: FullscreenPluginConfig) {\n    super(id, registry);\n    this.config = config;\n  }\n\n  async initialize(_: FullscreenPluginConfig): Promise<void> {}\n\n  protected buildCapability(): FullscreenCapability {\n    return {\n      isFullscreen: () => this.state.isFullscreen,\n      enableFullscreen: (targetElement?: string) => this.enableFullscreen(targetElement),\n      exitFullscreen: () => this.exitFullscreen(),\n      toggleFullscreen: (targetElement?: string) => this.toggleFullscreen(targetElement),\n      onRequest: this.fullscreenRequest$.on,\n      onStateChange: this.onStateChange$.on,\n    };\n  }\n\n  public getTargetSelector(): string | undefined {\n    // Return the current target (from last request) or fall back to config default\n    return this.currentTargetElement ?? this.config.targetElement;\n  }\n\n  private toggleFullscreen(targetElement?: string): void {\n    if (this.state.isFullscreen) {\n      this.exitFullscreen();\n    } else {\n      this.enableFullscreen(targetElement);\n    }\n  }\n\n  private enableFullscreen(targetElement?: string): void {\n    // Store the target element for this request\n    this.currentTargetElement = targetElement ?? this.config.targetElement;\n\n    this.fullscreenRequest$.emit({\n      action: 'enter',\n      targetElement: this.currentTargetElement,\n    });\n  }\n\n  private exitFullscreen(): void {\n    this.fullscreenRequest$.emit({\n      action: 'exit',\n    });\n\n    // Clear the current target when exiting\n    this.currentTargetElement = undefined;\n  }\n\n  override onStoreUpdated(_: FullscreenState, newState: FullscreenState): void {\n    this.onStateChange$.emit(newState);\n  }\n\n  public setFullscreenState(isFullscreen: boolean): void {\n    this.dispatch(setFullscreen(isFullscreen));\n  }\n\n  async destroy(): Promise<void> {\n    this.fullscreenRequest$.clear();\n    super.destroy();\n  }\n}\n","import { Reducer } from '@embedpdf/core';\nimport { FullscreenState } from './types';\nimport { FullscreenAction, SET_FULLSCREEN } from './actions';\n\nexport const initialState: FullscreenState = {\n  isFullscreen: false,\n};\n\nexport const reducer: Reducer<FullscreenState, FullscreenAction> = (state, action) => {\n  switch (action.type) {\n    case SET_FULLSCREEN:\n      return { ...state, isFullscreen: action.payload };\n    default:\n      return state;\n  }\n};\n","import { PluginPackage } from '@embedpdf/core';\nimport { manifest, FULLSCREEN_PLUGIN_ID } from './manifest';\nimport { FullscreenPluginConfig, FullscreenState } from './types';\nimport { FullscreenPlugin } from './fullscreen-plugin';\nimport { initialState } from './reducer';\nimport { reducer } from './reducer';\nimport { FullscreenAction } from './actions';\n\nexport const FullscreenPluginPackage: PluginPackage<\n  FullscreenPlugin,\n  FullscreenPluginConfig,\n  FullscreenState,\n  FullscreenAction\n> = {\n  manifest,\n  create: (registry, config) => new FullscreenPlugin(FULLSCREEN_PLUGIN_ID, registry, config),\n  reducer,\n  initialState,\n};\n\nexport * from './fullscreen-plugin';\nexport * from './types';\nexport * from './manifest';\nexport * from './actions';\nexport { initialState };\n"],"names":[],"mappings":";AAGO,MAAM,uBAAuB;AAE7B,MAAM,WAAmD;AAAA,EAC9D,IAAI;AAAA,EACJ,MAAM;AAAA,EACN,SAAS;AAAA,EACT,UAAU,CAAC,YAAY;AAAA,EACvB,UAAU,CAAA;AAAA,EACV,UAAU,CAAA;AAAA,EACV,eAAe;AAAA,IACb,SAAS;AAAA,EAAA;AAEb;ACbO,MAAM,iBAAiB;AASvB,SAAS,cAAc,SAAuC;AACnE,SAAO,EAAE,MAAM,gBAAgB,QAAA;AACjC;ACJO,MAAM,oBAAN,MAAM,0BAAyB,WAKpC;AAAA,EAQA,YAAY,IAAY,UAA0B,QAAgC;AAChF,UAAM,IAAI,QAAQ;AANpB,SAAiB,iBAAiB,sBAAA;AAClC,SAAiB,qBAAqB,cAAA;AAMpC,SAAK,SAAS;AAAA,EAChB;AAAA,EAEA,MAAM,WAAW,GAA0C;AAAA,EAAC;AAAA,EAElD,kBAAwC;AAChD,WAAO;AAAA,MACL,cAAc,MAAM,KAAK,MAAM;AAAA,MAC/B,kBAAkB,CAAC,kBAA2B,KAAK,iBAAiB,aAAa;AAAA,MACjF,gBAAgB,MAAM,KAAK,eAAA;AAAA,MAC3B,kBAAkB,CAAC,kBAA2B,KAAK,iBAAiB,aAAa;AAAA,MACjF,WAAW,KAAK,mBAAmB;AAAA,MACnC,eAAe,KAAK,eAAe;AAAA,IAAA;AAAA,EAEvC;AAAA,EAEO,oBAAwC;AAE7C,WAAO,KAAK,wBAAwB,KAAK,OAAO;AAAA,EAClD;AAAA,EAEQ,iBAAiB,eAA8B;AACrD,QAAI,KAAK,MAAM,cAAc;AAC3B,WAAK,eAAA;AAAA,IACP,OAAO;AACL,WAAK,iBAAiB,aAAa;AAAA,IACrC;AAAA,EACF;AAAA,EAEQ,iBAAiB,eAA8B;AAErD,SAAK,uBAAuB,iBAAiB,KAAK,OAAO;AAEzD,SAAK,mBAAmB,KAAK;AAAA,MAC3B,QAAQ;AAAA,MACR,eAAe,KAAK;AAAA,IAAA,CACrB;AAAA,EACH;AAAA,EAEQ,iBAAuB;AAC7B,SAAK,mBAAmB,KAAK;AAAA,MAC3B,QAAQ;AAAA,IAAA,CACT;AAGD,SAAK,uBAAuB;AAAA,EAC9B;AAAA,EAES,eAAe,GAAoB,UAAiC;AAC3E,SAAK,eAAe,KAAK,QAAQ;AAAA,EACnC;AAAA,EAEO,mBAAmB,cAA6B;AACrD,SAAK,SAAS,cAAc,YAAY,CAAC;AAAA,EAC3C;AAAA,EAEA,MAAM,UAAyB;AAC7B,SAAK,mBAAmB,MAAA;AACxB,UAAM,QAAA;AAAA,EACR;AACF;AArEE,kBAAgB,KAAK;AANhB,IAAM,mBAAN;ACLA,MAAM,eAAgC;AAAA,EAC3C,cAAc;AAChB;AAEO,MAAM,UAAsD,CAAC,OAAO,WAAW;AACpF,UAAQ,OAAO,MAAA;AAAA,IACb,KAAK;AACH,aAAO,EAAE,GAAG,OAAO,cAAc,OAAO,QAAA;AAAA,IAC1C;AACE,aAAO;AAAA,EAAA;AAEb;ACPO,MAAM,0BAKT;AAAA,EACF;AAAA,EACA,QAAQ,CAAC,UAAU,WAAW,IAAI,iBAAiB,sBAAsB,UAAU,MAAM;AAAA,EACzF;AAAA,EACA;AACF;"}

package/dist/lib/fullscreen-plugin.d.ts

@@ -5,9 +5,12 @@ export declare class FullscreenPlugin extends BasePlugin<FullscreenPluginConfig,
     static readonly id: "fullscreen";
     private readonly onStateChange$;
     private readonly fullscreenRequest$;
-    constructor(id: string, registry: PluginRegistry);
+    private config;
+    private currentTargetElement?;
+    constructor(id: string, registry: PluginRegistry, config: FullscreenPluginConfig);
     initialize(_: FullscreenPluginConfig): Promise<void>;
     protected buildCapability(): FullscreenCapability;
+    getTargetSelector(): string | undefined;
     private toggleFullscreen;
     private enableFullscreen;
     private exitFullscreen;

package/dist/lib/types.d.ts

@@ -3,12 +3,23 @@ export interface FullscreenState {
     isFullscreen: boolean;
 }
 export interface FullscreenPluginConfig extends BasePluginConfig {
+    /**
+     * Optional CSS selector to target a specific element for fullscreen.
+     * The element will be searched within the FullscreenProvider wrapper.
+     * Can be an ID (e.g., '#app'), a class (e.g., '.container'), or any CSS selector.
+     * If not provided or not found, the FullscreenProvider wrapper element will be used.
+     */
+    targetElement?: string;
 }
 export interface FullscreenCapability {
     isFullscreen: () => boolean;
-    enableFullscreen: () => void;
+    enableFullscreen: (targetElement?: string) => void;
     exitFullscreen: () => void;
-    toggleFullscreen: () => void;
-    onRequest: EventHook<'enter' | 'exit'>;
+    toggleFullscreen: (targetElement?: string) => void;
+    onRequest: EventHook<FullscreenRequestEvent>;
     onStateChange: EventHook<FullscreenState>;
 }
+export interface FullscreenRequestEvent {
+    action: 'enter' | 'exit';
+    targetElement?: string;
+}

package/dist/preact/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("@embedpdf/core"),t=require("@embedpdf/plugin-fullscreen"),r=require("preact/jsx-runtime"),n=require("preact/hooks"),l=require("@embedpdf/core/preact"),u=()=>l.usePlugin(t.FullscreenPlugin.id),s=()=>l.useCapability(t.FullscreenPlugin.id);function c({children:e,...t}){const{provides:l}=s(),{plugin:c}=u(),i=n.useRef(null);return n.useEffect((()=>{if(!l)return;return l.onRequest((async e=>{if("enter"===e){const e=i.current;e&&!document.fullscreenElement&&await e.requestFullscreen()}else document.fullscreenElement&&await document.exitFullscreen()}))}),[l]),n.useEffect((()=>{if(!c)return;const e=()=>c.setFullscreenState(!!document.fullscreenElement);return document.addEventListener("fullscreenchange",e),()=>document.removeEventListener("fullscreenchange",e)}),[c]),r.jsx("div",{...t,style:{position:"relative",width:"100%",height:"100%",...t.style},ref:i,children:e})}const i=e.createPluginPackage(t.FullscreenPluginPackage).addWrapper(c).build();exports.FullscreenPluginPackage=i,exports.FullscreenProvider=c,exports.useFullscreen=()=>{const{provides:e}=s(),[r,l]=n.useState(t.initialState);return n.useEffect((()=>null==e?void 0:e.onStateChange((e=>{l(e)}))),[e]),{provides:e,state:r}},exports.useFullscreenCapability=s,exports.useFullscreenPlugin=u,Object.keys(t).forEach((e=>{"default"===e||Object.prototype.hasOwnProperty.call(exports,e)||Object.defineProperty(exports,e,{enumerable:!0,get:()=>t[e]})}));
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("@embedpdf/core"),t=require("@embedpdf/plugin-fullscreen"),r=require("preact/jsx-runtime"),n=require("preact/hooks"),l=require("@embedpdf/core/preact"),u=()=>l.usePlugin(t.FullscreenPlugin.id),c=()=>l.useCapability(t.FullscreenPlugin.id);async function s(e,t,r){if("enter"===e.action){const n=function(e,t,r){if(!t||"enter"!==e.action)return t;let n=null;return r&&(n=t.querySelector(r),n||console.warn(`Fullscreen: Could not find element with selector "${r}" within the wrapper. Falling back to wrapper element.`)),n||(n=t),n}(e,t,r);n&&!document.fullscreenElement&&await n.requestFullscreen()}else document.fullscreenElement&&await document.exitFullscreen()}function i({children:e,...t}){const{provides:l}=c(),{plugin:i}=u(),{plugin:o}=u(),a=n.useRef(null);return n.useEffect(()=>{if(!l||!i)return;return l.onRequest(async e=>{const t=i.getTargetSelector();await s(e,a.current,t)})},[l,i]),n.useEffect(()=>{if(!o)return;const e=()=>o.setFullscreenState(!!document.fullscreenElement);return document.addEventListener("fullscreenchange",e),()=>document.removeEventListener("fullscreenchange",e)},[o]),r.jsx("div",{...t,style:{position:"relative",width:"100%",height:"100%",...t.style},ref:a,children:e})}const o=e.createPluginPackage(t.FullscreenPluginPackage).addWrapper(i).build();exports.FullscreenPluginPackage=o,exports.FullscreenProvider=i,exports.useFullscreen=()=>{const{provides:e}=c(),[r,l]=n.useState(t.initialState);return n.useEffect(()=>null==e?void 0:e.onStateChange(e=>{l(e)}),[e]),{provides:e,state:r}},exports.useFullscreenCapability=c,exports.useFullscreenPlugin=u,Object.keys(t).forEach(e=>{"default"===e||Object.prototype.hasOwnProperty.call(exports,e)||Object.defineProperty(exports,e,{enumerable:!0,get:()=>t[e]})});
 //# sourceMappingURL=index.cjs.map

package/dist/preact/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../../src/shared/hooks/use-fullscreen.ts","../../src/shared/components/fullscreen.tsx","../../src/shared/index.ts"],"sourcesContent":["import { useCapability, usePlugin } from '@embedpdf/core/@framework';\nimport { FullscreenPlugin, FullscreenState, initialState } from '@embedpdf/plugin-fullscreen';\nimport { useState, useEffect } from '@framework';\n\nexport const useFullscreenPlugin = () => usePlugin<FullscreenPlugin>(FullscreenPlugin.id);\nexport const useFullscreenCapability = () => useCapability<FullscreenPlugin>(FullscreenPlugin.id);\n\nexport const useFullscreen = () => {\n  const { provides } = useFullscreenCapability();\n  const [state, setState] = useState<FullscreenState>(initialState);\n\n  useEffect(() => {\n    return provides?.onStateChange((state) => {\n      setState(state);\n    });\n  }, [provides]);\n\n  return {\n    provides,\n    state,\n  };\n};\n","import { useEffect, useRef, HTMLAttributes, CSSProperties, ReactNode } from '@framework';\n\nimport { useFullscreenPlugin, useFullscreenCapability } from '../hooks';\n\ntype FullscreenProviderProps = Omit<HTMLAttributes<HTMLDivElement>, 'style'> & {\n  children: ReactNode;\n  style?: CSSProperties;\n};\n\nexport function FullscreenProvider({ children, ...props }: FullscreenProviderProps) {\n  const { provides: fullscreenCapability } = useFullscreenCapability();\n  const { plugin } = useFullscreenPlugin();\n  const ref = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    if (!fullscreenCapability) return;\n\n    const unsub = fullscreenCapability.onRequest(async (action) => {\n      if (action === 'enter') {\n        const el = ref.current;\n        if (el && !document.fullscreenElement) await el.requestFullscreen();\n      } else {\n        if (document.fullscreenElement) await document.exitFullscreen();\n      }\n    });\n\n    return unsub;\n  }, [fullscreenCapability]);\n\n  useEffect(() => {\n    if (!plugin) return;\n    const handler = () => plugin.setFullscreenState(!!document.fullscreenElement);\n    document.addEventListener('fullscreenchange', handler);\n    return () => document.removeEventListener('fullscreenchange', handler);\n  }, [plugin]);\n\n  return (\n    <div\n      {...props}\n      style={{ position: 'relative', width: '100%', height: '100%', ...props.style }}\n      ref={ref}\n    >\n      {children}\n    </div>\n  );\n}\n","import { createPluginPackage } from '@embedpdf/core';\nimport { FullscreenPluginPackage as BaseFullscreenPackage } from '@embedpdf/plugin-fullscreen';\nimport { FullscreenProvider } from './components';\n\nexport * from './hooks';\nexport * from './components';\n\nexport * from '@embedpdf/plugin-fullscreen';\n\nexport const FullscreenPluginPackage = createPluginPackage(BaseFullscreenPackage)\n  .addWrapper(FullscreenProvider)\n  .build();\n"],"names":["useFullscreenPlugin","usePlugin","FullscreenPlugin","id","useFullscreenCapability","useCapability","FullscreenProvider","children","props","provides","fullscreenCapability","plugin","ref","useRef","useEffect","onRequest","async","action","el","current","document","fullscreenElement","requestFullscreen","exitFullscreen","handler","setFullscreenState","addEventListener","removeEventListener","jsxRuntime","jsx","style","position","width","height","FullscreenPluginPackage","createPluginPackage","BaseFullscreenPackage","addWrapper","build","state","setState","useState","initialState","onStateChange"],"mappings":"wPAIaA,EAAsB,IAAMC,YAA4BC,EAAAA,iBAAiBC,IACzEC,EAA0B,IAAMC,gBAAgCH,EAAAA,iBAAiBC,ICIvF,SAASG,GAAmBC,SAAEA,KAAaC,IAChD,MAAQC,SAAUC,GAAyBN,KACrCO,OAAEA,GAAWX,IACbY,EAAMC,SAAuB,MAyBjC,OAvBFC,EAAAA,WAAU,KACR,IAAKJ,EAAsB,OAWpB,OATOA,EAAqBK,WAAUC,MAAOC,IAClD,GAAe,UAAXA,EAAoB,CACtB,MAAMC,EAAKN,EAAIO,QACXD,IAAOE,SAASC,yBAAyBH,EAAGI,mBAAkB,MAE9DF,SAASC,yBAAyBD,SAASG,gBAAe,GAI3D,GACN,CAACb,IAEJI,EAAAA,WAAU,KACR,IAAKH,EAAQ,OACb,MAAMa,EAAU,IAAMb,EAAOc,qBAAqBL,SAASC,mBAE3D,OADSD,SAAAM,iBAAiB,mBAAoBF,GACvC,IAAMJ,SAASO,oBAAoB,mBAAoBH,EAAO,GACpE,CAACb,IAGFiB,EAAAC,IAAC,MAAA,IACKrB,EACJsB,MAAO,CAAEC,SAAU,WAAYC,MAAO,OAAQC,OAAQ,UAAWzB,EAAMsB,OACvElB,MAECL,YAGP,CCpCO,MAAM2B,EAA0BC,EAAoBA,oBAAAC,EAAqBF,yBAC7EG,WAAW/B,GACXgC,6FFJ0B,KACrB,MAAA7B,SAAEA,GAAaL,KACdmC,EAAOC,GAAYC,EAAAA,SAA0BC,EAAAA,cAQ7C,OANP5B,EAAAA,WAAU,IACD,MAAAL,OAAA,EAAAA,EAAUkC,eAAeJ,IAC9BC,EAASD,EAAK,KAEf,CAAC9B,IAEG,CACLA,WACA8B,QACF"}
+{"version":3,"file":"index.cjs","sources":["../../src/shared/hooks/use-fullscreen.ts","../../src/shared/utils/fullscreen-utils.ts","../../src/shared/components/fullscreen.tsx","../../src/shared/index.ts"],"sourcesContent":["import { useCapability, usePlugin } from '@embedpdf/core/@framework';\nimport { FullscreenPlugin, FullscreenState, initialState } from '@embedpdf/plugin-fullscreen';\nimport { useState, useEffect } from '@framework';\n\nexport const useFullscreenPlugin = () => usePlugin<FullscreenPlugin>(FullscreenPlugin.id);\nexport const useFullscreenCapability = () => useCapability<FullscreenPlugin>(FullscreenPlugin.id);\n\nexport const useFullscreen = () => {\n  const { provides } = useFullscreenCapability();\n  const [state, setState] = useState<FullscreenState>(initialState);\n\n  useEffect(() => {\n    return provides?.onStateChange((state) => {\n      setState(state);\n    });\n  }, [provides]);\n\n  return {\n    provides,\n    state,\n  };\n};\n","import { FullscreenRequestEvent } from '@embedpdf/plugin-fullscreen';\n\n/**\n * Find the element to fullscreen based on the event and container\n * @param event The fullscreen request event\n * @param containerElement The container element (fallback if no selector or element not found)\n * @param targetSelector Optional target selector from plugin config\n * @returns The element to fullscreen, or null if not found\n */\nexport function findFullscreenElement(\n  event: FullscreenRequestEvent,\n  containerElement: HTMLElement | null,\n  targetSelector?: string,\n): HTMLElement | null {\n  if (!containerElement || event.action !== 'enter') {\n    return containerElement;\n  }\n\n  let elementToFullscreen: HTMLElement | null = null;\n\n  if (targetSelector) {\n    // Try to find the element within the wrapper element\n    elementToFullscreen = containerElement.querySelector(targetSelector);\n    if (!elementToFullscreen) {\n      console.warn(\n        `Fullscreen: Could not find element with selector \"${targetSelector}\" within the wrapper. Falling back to wrapper element.`,\n      );\n    }\n  }\n\n  // Fall back to the wrapper element if no selector or element not found\n  if (!elementToFullscreen) {\n    elementToFullscreen = containerElement;\n  }\n\n  return elementToFullscreen;\n}\n\n/**\n * Handle a fullscreen request event\n * @param event The fullscreen request event\n * @param containerElement The container element\n * @param targetSelector Optional target selector from plugin config\n */\nexport async function handleFullscreenRequest(\n  event: FullscreenRequestEvent,\n  containerElement: HTMLElement | null,\n  targetSelector?: string,\n): Promise<void> {\n  if (event.action === 'enter') {\n    const elementToFullscreen = findFullscreenElement(event, containerElement, targetSelector);\n\n    if (elementToFullscreen && !document.fullscreenElement) {\n      await elementToFullscreen.requestFullscreen();\n    }\n  } else {\n    if (document.fullscreenElement) {\n      await document.exitFullscreen();\n    }\n  }\n}\n","import { useEffect, useRef, HTMLAttributes, CSSProperties, ReactNode } from '@framework';\n\nimport { useFullscreenPlugin, useFullscreenCapability } from '../hooks';\nimport { handleFullscreenRequest } from '../utils/fullscreen-utils';\n\ntype FullscreenProviderProps = Omit<HTMLAttributes<HTMLDivElement>, 'style'> & {\n  children: ReactNode;\n  style?: CSSProperties;\n};\n\nexport function FullscreenProvider({ children, ...props }: FullscreenProviderProps) {\n  const { provides: fullscreenCapability } = useFullscreenCapability();\n  const { plugin: fullscreenPlugin } = useFullscreenPlugin();\n  const { plugin } = useFullscreenPlugin();\n  const ref = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    if (!fullscreenCapability || !fullscreenPlugin) return;\n\n    const unsub = fullscreenCapability.onRequest(async (event) => {\n      const targetSelector = fullscreenPlugin.getTargetSelector();\n      await handleFullscreenRequest(event, ref.current, targetSelector);\n    });\n\n    return unsub;\n  }, [fullscreenCapability, fullscreenPlugin]);\n\n  useEffect(() => {\n    if (!plugin) return;\n    const handler = () => plugin.setFullscreenState(!!document.fullscreenElement);\n    document.addEventListener('fullscreenchange', handler);\n    return () => document.removeEventListener('fullscreenchange', handler);\n  }, [plugin]);\n\n  return (\n    <div\n      {...props}\n      style={{ position: 'relative', width: '100%', height: '100%', ...props.style }}\n      ref={ref}\n    >\n      {children}\n    </div>\n  );\n}\n","import { createPluginPackage } from '@embedpdf/core';\nimport { FullscreenPluginPackage as BaseFullscreenPackage } from '@embedpdf/plugin-fullscreen';\nimport { FullscreenProvider } from './components';\n\nexport * from './hooks';\nexport * from './components';\n\nexport * from '@embedpdf/plugin-fullscreen';\n\nexport const FullscreenPluginPackage = createPluginPackage(BaseFullscreenPackage)\n  .addWrapper(FullscreenProvider)\n  .build();\n"],"names":["useFullscreenPlugin","usePlugin","FullscreenPlugin","id","useFullscreenCapability","useCapability","async","handleFullscreenRequest","event","containerElement","targetSelector","action","elementToFullscreen","querySelector","console","warn","findFullscreenElement","document","fullscreenElement","requestFullscreen","exitFullscreen","FullscreenProvider","children","props","provides","fullscreenCapability","plugin","fullscreenPlugin","ref","useRef","useEffect","onRequest","getTargetSelector","current","handler","setFullscreenState","addEventListener","removeEventListener","jsx","style","position","width","height","FullscreenPluginPackage","createPluginPackage","BaseFullscreenPackage","addWrapper","build","state","setState","useState","initialState","onStateChange"],"mappings":"wPAIaA,EAAsB,IAAMC,YAA4BC,EAAAA,iBAAiBC,IACzEC,EAA0B,IAAMC,gBAAgCH,EAAAA,iBAAiBC,ICuC9FG,eAAsBC,EACpBC,EACAC,EACAC,GAEA,GAAqB,UAAjBF,EAAMG,OAAoB,CAC5B,MAAMC,EAzCH,SACLJ,EACAC,EACAC,GAEA,IAAKD,GAAqC,UAAjBD,EAAMG,OAC7B,OAAOF,EAGT,IAAIG,EAA0C,KAiB9C,OAfIF,IAEFE,EAAsBH,EAAiBI,cAAcH,GAChDE,GACHE,QAAQC,KACN,qDAAqDL,4DAMtDE,IACHA,EAAsBH,GAGjBG,CACT,CAcgCI,CAAsBR,EAAOC,EAAkBC,GAEvEE,IAAwBK,SAASC,yBAC7BN,EAAoBO,mBAE9B,MACMF,SAASC,yBACLD,SAASG,gBAGrB,CClDO,SAASC,GAAmBC,SAAEA,KAAaC,IAChD,MAAQC,SAAUC,GAAyBrB,KACnCsB,OAAQC,GAAqB3B,KAC/B0B,OAAEA,GAAW1B,IACb4B,EAAMC,EAAAA,OAAuB,MAoBnC,OAlBAC,EAAAA,UAAU,KACR,IAAKL,IAAyBE,EAAkB,OAOhD,OALcF,EAAqBM,UAAUzB,MAAOE,IAClD,MAAME,EAAiBiB,EAAiBK,0BAClCzB,EAAwBC,EAAOoB,EAAIK,QAASvB,MAInD,CAACe,EAAsBE,IAE1BG,EAAAA,UAAU,KACR,IAAKJ,EAAQ,OACb,MAAMQ,EAAU,IAAMR,EAAOS,qBAAqBlB,SAASC,mBAE3D,OADAD,SAASmB,iBAAiB,mBAAoBF,GACvC,IAAMjB,SAASoB,oBAAoB,mBAAoBH,IAC7D,CAACR,IAGFY,EAAAA,IAAC,MAAA,IACKf,EACJgB,MAAO,CAAEC,SAAU,WAAYC,MAAO,OAAQC,OAAQ,UAAWnB,EAAMgB,OACvEX,MAECN,YAGP,CClCO,MAAMqB,EAA0BC,EAAAA,oBAAoBC,EAAAA,yBACxDC,WAAWzB,GACX0B,6FHJ0B,KAC3B,MAAMvB,SAAEA,GAAapB,KACd4C,EAAOC,GAAYC,EAAAA,SAA0BC,EAAAA,cAQpD,OANArB,EAAAA,UAAU,IACD,MAAAN,OAAA,EAAAA,EAAU4B,cAAeJ,IAC9BC,EAASD,KAEV,CAACxB,IAEG,CACLA,WACAwB"}

package/dist/preact/index.js

@@ -19,22 +19,49 @@ const useFullscreen = () => {
     state
   };
 };
+function findFullscreenElement(event, containerElement, targetSelector) {
+  if (!containerElement || event.action !== "enter") {
+    return containerElement;
+  }
+  let elementToFullscreen = null;
+  if (targetSelector) {
+    elementToFullscreen = containerElement.querySelector(targetSelector);
+    if (!elementToFullscreen) {
+      console.warn(
+        `Fullscreen: Could not find element with selector "${targetSelector}" within the wrapper. Falling back to wrapper element.`
+      );
+    }
+  }
+  if (!elementToFullscreen) {
+    elementToFullscreen = containerElement;
+  }
+  return elementToFullscreen;
+}
+async function handleFullscreenRequest(event, containerElement, targetSelector) {
+  if (event.action === "enter") {
+    const elementToFullscreen = findFullscreenElement(event, containerElement, targetSelector);
+    if (elementToFullscreen && !document.fullscreenElement) {
+      await elementToFullscreen.requestFullscreen();
+    }
+  } else {
+    if (document.fullscreenElement) {
+      await document.exitFullscreen();
+    }
+  }
+}
 function FullscreenProvider({ children, ...props }) {
   const { provides: fullscreenCapability } = useFullscreenCapability();
+  const { plugin: fullscreenPlugin } = useFullscreenPlugin();
   const { plugin } = useFullscreenPlugin();
   const ref = useRef(null);
   useEffect(() => {
-    if (!fullscreenCapability) return;
-    const unsub = fullscreenCapability.onRequest(async (action) => {
-      if (action === "enter") {
-        const el = ref.current;
-        if (el && !document.fullscreenElement) await el.requestFullscreen();
-      } else {
-        if (document.fullscreenElement) await document.exitFullscreen();
-      }
+    if (!fullscreenCapability || !fullscreenPlugin) return;
+    const unsub = fullscreenCapability.onRequest(async (event) => {
+      const targetSelector = fullscreenPlugin.getTargetSelector();
+      await handleFullscreenRequest(event, ref.current, targetSelector);
     });
     return unsub;
-  }, [fullscreenCapability]);
+  }, [fullscreenCapability, fullscreenPlugin]);
   useEffect(() => {
     if (!plugin) return;
     const handler = () => plugin.setFullscreenState(!!document.fullscreenElement);

package/dist/preact/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/shared/hooks/use-fullscreen.ts","../../src/shared/components/fullscreen.tsx","../../src/shared/index.ts"],"sourcesContent":["import { useCapability, usePlugin } from '@embedpdf/core/@framework';\nimport { FullscreenPlugin, FullscreenState, initialState } from '@embedpdf/plugin-fullscreen';\nimport { useState, useEffect } from '@framework';\n\nexport const useFullscreenPlugin = () => usePlugin<FullscreenPlugin>(FullscreenPlugin.id);\nexport const useFullscreenCapability = () => useCapability<FullscreenPlugin>(FullscreenPlugin.id);\n\nexport const useFullscreen = () => {\n  const { provides } = useFullscreenCapability();\n  const [state, setState] = useState<FullscreenState>(initialState);\n\n  useEffect(() => {\n    return provides?.onStateChange((state) => {\n      setState(state);\n    });\n  }, [provides]);\n\n  return {\n    provides,\n    state,\n  };\n};\n","import { useEffect, useRef, HTMLAttributes, CSSProperties, ReactNode } from '@framework';\n\nimport { useFullscreenPlugin, useFullscreenCapability } from '../hooks';\n\ntype FullscreenProviderProps = Omit<HTMLAttributes<HTMLDivElement>, 'style'> & {\n  children: ReactNode;\n  style?: CSSProperties;\n};\n\nexport function FullscreenProvider({ children, ...props }: FullscreenProviderProps) {\n  const { provides: fullscreenCapability } = useFullscreenCapability();\n  const { plugin } = useFullscreenPlugin();\n  const ref = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    if (!fullscreenCapability) return;\n\n    const unsub = fullscreenCapability.onRequest(async (action) => {\n      if (action === 'enter') {\n        const el = ref.current;\n        if (el && !document.fullscreenElement) await el.requestFullscreen();\n      } else {\n        if (document.fullscreenElement) await document.exitFullscreen();\n      }\n    });\n\n    return unsub;\n  }, [fullscreenCapability]);\n\n  useEffect(() => {\n    if (!plugin) return;\n    const handler = () => plugin.setFullscreenState(!!document.fullscreenElement);\n    document.addEventListener('fullscreenchange', handler);\n    return () => document.removeEventListener('fullscreenchange', handler);\n  }, [plugin]);\n\n  return (\n    <div\n      {...props}\n      style={{ position: 'relative', width: '100%', height: '100%', ...props.style }}\n      ref={ref}\n    >\n      {children}\n    </div>\n  );\n}\n","import { createPluginPackage } from '@embedpdf/core';\nimport { FullscreenPluginPackage as BaseFullscreenPackage } from '@embedpdf/plugin-fullscreen';\nimport { FullscreenProvider } from './components';\n\nexport * from './hooks';\nexport * from './components';\n\nexport * from '@embedpdf/plugin-fullscreen';\n\nexport const FullscreenPluginPackage = createPluginPackage(BaseFullscreenPackage)\n  .addWrapper(FullscreenProvider)\n  .build();\n"],"names":["state","BaseFullscreenPackage"],"mappings":";;;;;;AAIO,MAAM,sBAAsB,MAAM,UAA4B,iBAAiB,EAAE;AACjF,MAAM,0BAA0B,MAAM,cAAgC,iBAAiB,EAAE;AAEzF,MAAM,gBAAgB,MAAM;AAC3B,QAAA,EAAE,SAAS,IAAI,wBAAwB;AAC7C,QAAM,CAAC,OAAO,QAAQ,IAAI,SAA0B,YAAY;AAEhE,YAAU,MAAM;AACP,WAAA,qCAAU,cAAc,CAACA,WAAU;AACxC,eAASA,MAAK;AAAA,IAAA;AAAA,EACf,GACA,CAAC,QAAQ,CAAC;AAEN,SAAA;AAAA,IACL;AAAA,IACA;AAAA,EACF;AACF;ACZO,SAAS,mBAAmB,EAAE,UAAU,GAAG,SAAkC;AAClF,QAAM,EAAE,UAAU,qBAAqB,IAAI,wBAAwB;AAC7D,QAAA,EAAE,OAAO,IAAI,oBAAoB;AACjC,QAAA,MAAM,OAAuB,IAAI;AAEvC,YAAU,MAAM;AACd,QAAI,CAAC,qBAAsB;AAE3B,UAAM,QAAQ,qBAAqB,UAAU,OAAO,WAAW;AAC7D,UAAI,WAAW,SAAS;AACtB,cAAM,KAAK,IAAI;AACf,YAAI,MAAM,CAAC,SAAS,kBAAmB,OAAM,GAAG,kBAAkB;AAAA,MAAA,OAC7D;AACL,YAAI,SAAS,kBAAyB,OAAA,SAAS,eAAe;AAAA,MAAA;AAAA,IAChE,CACD;AAEM,WAAA;AAAA,EAAA,GACN,CAAC,oBAAoB,CAAC;AAEzB,YAAU,MAAM;AACd,QAAI,CAAC,OAAQ;AACb,UAAM,UAAU,MAAM,OAAO,mBAAmB,CAAC,CAAC,SAAS,iBAAiB;AACnE,aAAA,iBAAiB,oBAAoB,OAAO;AACrD,WAAO,MAAM,SAAS,oBAAoB,oBAAoB,OAAO;AAAA,EAAA,GACpE,CAAC,MAAM,CAAC;AAGT,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAG;AAAA,MACJ,OAAO,EAAE,UAAU,YAAY,OAAO,QAAQ,QAAQ,QAAQ,GAAG,MAAM,MAAM;AAAA,MAC7E;AAAA,MAEC;AAAA,IAAA;AAAA,EACH;AAEJ;ACpCO,MAAM,0BAA0B,oBAAoBC,yBAAqB,EAC7E,WAAW,kBAAkB,EAC7B,MAAM;"}
+{"version":3,"file":"index.js","sources":["../../src/shared/hooks/use-fullscreen.ts","../../src/shared/utils/fullscreen-utils.ts","../../src/shared/components/fullscreen.tsx","../../src/shared/index.ts"],"sourcesContent":["import { useCapability, usePlugin } from '@embedpdf/core/@framework';\nimport { FullscreenPlugin, FullscreenState, initialState } from '@embedpdf/plugin-fullscreen';\nimport { useState, useEffect } from '@framework';\n\nexport const useFullscreenPlugin = () => usePlugin<FullscreenPlugin>(FullscreenPlugin.id);\nexport const useFullscreenCapability = () => useCapability<FullscreenPlugin>(FullscreenPlugin.id);\n\nexport const useFullscreen = () => {\n  const { provides } = useFullscreenCapability();\n  const [state, setState] = useState<FullscreenState>(initialState);\n\n  useEffect(() => {\n    return provides?.onStateChange((state) => {\n      setState(state);\n    });\n  }, [provides]);\n\n  return {\n    provides,\n    state,\n  };\n};\n","import { FullscreenRequestEvent } from '@embedpdf/plugin-fullscreen';\n\n/**\n * Find the element to fullscreen based on the event and container\n * @param event The fullscreen request event\n * @param containerElement The container element (fallback if no selector or element not found)\n * @param targetSelector Optional target selector from plugin config\n * @returns The element to fullscreen, or null if not found\n */\nexport function findFullscreenElement(\n  event: FullscreenRequestEvent,\n  containerElement: HTMLElement | null,\n  targetSelector?: string,\n): HTMLElement | null {\n  if (!containerElement || event.action !== 'enter') {\n    return containerElement;\n  }\n\n  let elementToFullscreen: HTMLElement | null = null;\n\n  if (targetSelector) {\n    // Try to find the element within the wrapper element\n    elementToFullscreen = containerElement.querySelector(targetSelector);\n    if (!elementToFullscreen) {\n      console.warn(\n        `Fullscreen: Could not find element with selector \"${targetSelector}\" within the wrapper. Falling back to wrapper element.`,\n      );\n    }\n  }\n\n  // Fall back to the wrapper element if no selector or element not found\n  if (!elementToFullscreen) {\n    elementToFullscreen = containerElement;\n  }\n\n  return elementToFullscreen;\n}\n\n/**\n * Handle a fullscreen request event\n * @param event The fullscreen request event\n * @param containerElement The container element\n * @param targetSelector Optional target selector from plugin config\n */\nexport async function handleFullscreenRequest(\n  event: FullscreenRequestEvent,\n  containerElement: HTMLElement | null,\n  targetSelector?: string,\n): Promise<void> {\n  if (event.action === 'enter') {\n    const elementToFullscreen = findFullscreenElement(event, containerElement, targetSelector);\n\n    if (elementToFullscreen && !document.fullscreenElement) {\n      await elementToFullscreen.requestFullscreen();\n    }\n  } else {\n    if (document.fullscreenElement) {\n      await document.exitFullscreen();\n    }\n  }\n}\n","import { useEffect, useRef, HTMLAttributes, CSSProperties, ReactNode } from '@framework';\n\nimport { useFullscreenPlugin, useFullscreenCapability } from '../hooks';\nimport { handleFullscreenRequest } from '../utils/fullscreen-utils';\n\ntype FullscreenProviderProps = Omit<HTMLAttributes<HTMLDivElement>, 'style'> & {\n  children: ReactNode;\n  style?: CSSProperties;\n};\n\nexport function FullscreenProvider({ children, ...props }: FullscreenProviderProps) {\n  const { provides: fullscreenCapability } = useFullscreenCapability();\n  const { plugin: fullscreenPlugin } = useFullscreenPlugin();\n  const { plugin } = useFullscreenPlugin();\n  const ref = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    if (!fullscreenCapability || !fullscreenPlugin) return;\n\n    const unsub = fullscreenCapability.onRequest(async (event) => {\n      const targetSelector = fullscreenPlugin.getTargetSelector();\n      await handleFullscreenRequest(event, ref.current, targetSelector);\n    });\n\n    return unsub;\n  }, [fullscreenCapability, fullscreenPlugin]);\n\n  useEffect(() => {\n    if (!plugin) return;\n    const handler = () => plugin.setFullscreenState(!!document.fullscreenElement);\n    document.addEventListener('fullscreenchange', handler);\n    return () => document.removeEventListener('fullscreenchange', handler);\n  }, [plugin]);\n\n  return (\n    <div\n      {...props}\n      style={{ position: 'relative', width: '100%', height: '100%', ...props.style }}\n      ref={ref}\n    >\n      {children}\n    </div>\n  );\n}\n","import { createPluginPackage } from '@embedpdf/core';\nimport { FullscreenPluginPackage as BaseFullscreenPackage } from '@embedpdf/plugin-fullscreen';\nimport { FullscreenProvider } from './components';\n\nexport * from './hooks';\nexport * from './components';\n\nexport * from '@embedpdf/plugin-fullscreen';\n\nexport const FullscreenPluginPackage = createPluginPackage(BaseFullscreenPackage)\n  .addWrapper(FullscreenProvider)\n  .build();\n"],"names":["state","BaseFullscreenPackage"],"mappings":";;;;;;AAIO,MAAM,sBAAsB,MAAM,UAA4B,iBAAiB,EAAE;AACjF,MAAM,0BAA0B,MAAM,cAAgC,iBAAiB,EAAE;AAEzF,MAAM,gBAAgB,MAAM;AACjC,QAAM,EAAE,SAAA,IAAa,wBAAA;AACrB,QAAM,CAAC,OAAO,QAAQ,IAAI,SAA0B,YAAY;AAEhE,YAAU,MAAM;AACd,WAAO,qCAAU,cAAc,CAACA,WAAU;AACxC,eAASA,MAAK;AAAA,IAChB;AAAA,EACF,GAAG,CAAC,QAAQ,CAAC;AAEb,SAAO;AAAA,IACL;AAAA,IACA;AAAA,EAAA;AAEJ;ACZO,SAAS,sBACd,OACA,kBACA,gBACoB;AACpB,MAAI,CAAC,oBAAoB,MAAM,WAAW,SAAS;AACjD,WAAO;AAAA,EACT;AAEA,MAAI,sBAA0C;AAE9C,MAAI,gBAAgB;AAElB,0BAAsB,iBAAiB,cAAc,cAAc;AACnE,QAAI,CAAC,qBAAqB;AACxB,cAAQ;AAAA,QACN,qDAAqD,cAAc;AAAA,MAAA;AAAA,IAEvE;AAAA,EACF;AAGA,MAAI,CAAC,qBAAqB;AACxB,0BAAsB;AAAA,EACxB;AAEA,SAAO;AACT;AAQA,eAAsB,wBACpB,OACA,kBACA,gBACe;AACf,MAAI,MAAM,WAAW,SAAS;AAC5B,UAAM,sBAAsB,sBAAsB,OAAO,kBAAkB,cAAc;AAEzF,QAAI,uBAAuB,CAAC,SAAS,mBAAmB;AACtD,YAAM,oBAAoB,kBAAA;AAAA,IAC5B;AAAA,EACF,OAAO;AACL,QAAI,SAAS,mBAAmB;AAC9B,YAAM,SAAS,eAAA;AAAA,IACjB;AAAA,EACF;AACF;AClDO,SAAS,mBAAmB,EAAE,UAAU,GAAG,SAAkC;AAClF,QAAM,EAAE,UAAU,qBAAA,IAAyB,wBAAA;AAC3C,QAAM,EAAE,QAAQ,iBAAA,IAAqB,oBAAA;AACrC,QAAM,EAAE,OAAA,IAAW,oBAAA;AACnB,QAAM,MAAM,OAAuB,IAAI;AAEvC,YAAU,MAAM;AACd,QAAI,CAAC,wBAAwB,CAAC,iBAAkB;AAEhD,UAAM,QAAQ,qBAAqB,UAAU,OAAO,UAAU;AAC5D,YAAM,iBAAiB,iBAAiB,kBAAA;AACxC,YAAM,wBAAwB,OAAO,IAAI,SAAS,cAAc;AAAA,IAClE,CAAC;AAED,WAAO;AAAA,EACT,GAAG,CAAC,sBAAsB,gBAAgB,CAAC;AAE3C,YAAU,MAAM;AACd,QAAI,CAAC,OAAQ;AACb,UAAM,UAAU,MAAM,OAAO,mBAAmB,CAAC,CAAC,SAAS,iBAAiB;AAC5E,aAAS,iBAAiB,oBAAoB,OAAO;AACrD,WAAO,MAAM,SAAS,oBAAoB,oBAAoB,OAAO;AAAA,EACvE,GAAG,CAAC,MAAM,CAAC;AAEX,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAG;AAAA,MACJ,OAAO,EAAE,UAAU,YAAY,OAAO,QAAQ,QAAQ,QAAQ,GAAG,MAAM,MAAA;AAAA,MACvE;AAAA,MAEC;AAAA,IAAA;AAAA,EAAA;AAGP;AClCO,MAAM,0BAA0B,oBAAoBC,yBAAqB,EAC7E,WAAW,kBAAkB,EAC7B,MAAA;"}

package/dist/react/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("@embedpdf/core"),t=require("@embedpdf/plugin-fullscreen"),r=require("react/jsx-runtime"),n=require("react"),l=require("@embedpdf/core/react"),u=()=>l.usePlugin(t.FullscreenPlugin.id),s=()=>l.useCapability(t.FullscreenPlugin.id);function c({children:e,...t}){const{provides:l}=s(),{plugin:c}=u(),i=n.useRef(null);return n.useEffect((()=>{if(!l)return;return l.onRequest((async e=>{if("enter"===e){const e=i.current;e&&!document.fullscreenElement&&await e.requestFullscreen()}else document.fullscreenElement&&await document.exitFullscreen()}))}),[l]),n.useEffect((()=>{if(!c)return;const e=()=>c.setFullscreenState(!!document.fullscreenElement);return document.addEventListener("fullscreenchange",e),()=>document.removeEventListener("fullscreenchange",e)}),[c]),r.jsx("div",{...t,style:{position:"relative",width:"100%",height:"100%",...t.style},ref:i,children:e})}const i=e.createPluginPackage(t.FullscreenPluginPackage).addWrapper(c).build();exports.FullscreenPluginPackage=i,exports.FullscreenProvider=c,exports.useFullscreen=()=>{const{provides:e}=s(),[r,l]=n.useState(t.initialState);return n.useEffect((()=>null==e?void 0:e.onStateChange((e=>{l(e)}))),[e]),{provides:e,state:r}},exports.useFullscreenCapability=s,exports.useFullscreenPlugin=u,Object.keys(t).forEach((e=>{"default"===e||Object.prototype.hasOwnProperty.call(exports,e)||Object.defineProperty(exports,e,{enumerable:!0,get:()=>t[e]})}));
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("@embedpdf/core"),t=require("@embedpdf/plugin-fullscreen"),r=require("react/jsx-runtime"),n=require("react"),l=require("@embedpdf/core/react"),u=()=>l.usePlugin(t.FullscreenPlugin.id),c=()=>l.useCapability(t.FullscreenPlugin.id);async function s(e,t,r){if("enter"===e.action){const n=function(e,t,r){if(!t||"enter"!==e.action)return t;let n=null;return r&&(n=t.querySelector(r),n||console.warn(`Fullscreen: Could not find element with selector "${r}" within the wrapper. Falling back to wrapper element.`)),n||(n=t),n}(e,t,r);n&&!document.fullscreenElement&&await n.requestFullscreen()}else document.fullscreenElement&&await document.exitFullscreen()}function i({children:e,...t}){const{provides:l}=c(),{plugin:i}=u(),{plugin:o}=u(),a=n.useRef(null);return n.useEffect(()=>{if(!l||!i)return;return l.onRequest(async e=>{const t=i.getTargetSelector();await s(e,a.current,t)})},[l,i]),n.useEffect(()=>{if(!o)return;const e=()=>o.setFullscreenState(!!document.fullscreenElement);return document.addEventListener("fullscreenchange",e),()=>document.removeEventListener("fullscreenchange",e)},[o]),r.jsx("div",{...t,style:{position:"relative",width:"100%",height:"100%",...t.style},ref:a,children:e})}const o=e.createPluginPackage(t.FullscreenPluginPackage).addWrapper(i).build();exports.FullscreenPluginPackage=o,exports.FullscreenProvider=i,exports.useFullscreen=()=>{const{provides:e}=c(),[r,l]=n.useState(t.initialState);return n.useEffect(()=>null==e?void 0:e.onStateChange(e=>{l(e)}),[e]),{provides:e,state:r}},exports.useFullscreenCapability=c,exports.useFullscreenPlugin=u,Object.keys(t).forEach(e=>{"default"===e||Object.prototype.hasOwnProperty.call(exports,e)||Object.defineProperty(exports,e,{enumerable:!0,get:()=>t[e]})});
 //# sourceMappingURL=index.cjs.map

package/dist/react/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../../src/shared/hooks/use-fullscreen.ts","../../src/shared/components/fullscreen.tsx","../../src/shared/index.ts"],"sourcesContent":["import { useCapability, usePlugin } from '@embedpdf/core/@framework';\nimport { FullscreenPlugin, FullscreenState, initialState } from '@embedpdf/plugin-fullscreen';\nimport { useState, useEffect } from '@framework';\n\nexport const useFullscreenPlugin = () => usePlugin<FullscreenPlugin>(FullscreenPlugin.id);\nexport const useFullscreenCapability = () => useCapability<FullscreenPlugin>(FullscreenPlugin.id);\n\nexport const useFullscreen = () => {\n  const { provides } = useFullscreenCapability();\n  const [state, setState] = useState<FullscreenState>(initialState);\n\n  useEffect(() => {\n    return provides?.onStateChange((state) => {\n      setState(state);\n    });\n  }, [provides]);\n\n  return {\n    provides,\n    state,\n  };\n};\n","import { useEffect, useRef, HTMLAttributes, CSSProperties, ReactNode } from '@framework';\n\nimport { useFullscreenPlugin, useFullscreenCapability } from '../hooks';\n\ntype FullscreenProviderProps = Omit<HTMLAttributes<HTMLDivElement>, 'style'> & {\n  children: ReactNode;\n  style?: CSSProperties;\n};\n\nexport function FullscreenProvider({ children, ...props }: FullscreenProviderProps) {\n  const { provides: fullscreenCapability } = useFullscreenCapability();\n  const { plugin } = useFullscreenPlugin();\n  const ref = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    if (!fullscreenCapability) return;\n\n    const unsub = fullscreenCapability.onRequest(async (action) => {\n      if (action === 'enter') {\n        const el = ref.current;\n        if (el && !document.fullscreenElement) await el.requestFullscreen();\n      } else {\n        if (document.fullscreenElement) await document.exitFullscreen();\n      }\n    });\n\n    return unsub;\n  }, [fullscreenCapability]);\n\n  useEffect(() => {\n    if (!plugin) return;\n    const handler = () => plugin.setFullscreenState(!!document.fullscreenElement);\n    document.addEventListener('fullscreenchange', handler);\n    return () => document.removeEventListener('fullscreenchange', handler);\n  }, [plugin]);\n\n  return (\n    <div\n      {...props}\n      style={{ position: 'relative', width: '100%', height: '100%', ...props.style }}\n      ref={ref}\n    >\n      {children}\n    </div>\n  );\n}\n","import { createPluginPackage } from '@embedpdf/core';\nimport { FullscreenPluginPackage as BaseFullscreenPackage } from '@embedpdf/plugin-fullscreen';\nimport { FullscreenProvider } from './components';\n\nexport * from './hooks';\nexport * from './components';\n\nexport * from '@embedpdf/plugin-fullscreen';\n\nexport const FullscreenPluginPackage = createPluginPackage(BaseFullscreenPackage)\n  .addWrapper(FullscreenProvider)\n  .build();\n"],"names":["useFullscreenPlugin","usePlugin","FullscreenPlugin","id","useFullscreenCapability","useCapability","FullscreenProvider","children","props","provides","fullscreenCapability","plugin","ref","useRef","useEffect","onRequest","async","action","el","current","document","fullscreenElement","requestFullscreen","exitFullscreen","handler","setFullscreenState","addEventListener","removeEventListener","jsxRuntime","jsx","style","position","width","height","FullscreenPluginPackage","createPluginPackage","BaseFullscreenPackage","addWrapper","build","state","setState","useState","initialState","onStateChange"],"mappings":"+OAIaA,EAAsB,IAAMC,YAA4BC,EAAAA,iBAAiBC,IACzEC,EAA0B,IAAMC,gBAAgCH,EAAAA,iBAAiBC,ICIvF,SAASG,GAAmBC,SAAEA,KAAaC,IAChD,MAAQC,SAAUC,GAAyBN,KACrCO,OAAEA,GAAWX,IACbY,EAAMC,SAAuB,MAyBjC,OAvBFC,EAAAA,WAAU,KACR,IAAKJ,EAAsB,OAWpB,OATOA,EAAqBK,WAAUC,MAAOC,IAClD,GAAe,UAAXA,EAAoB,CACtB,MAAMC,EAAKN,EAAIO,QACXD,IAAOE,SAASC,yBAAyBH,EAAGI,mBAAkB,MAE9DF,SAASC,yBAAyBD,SAASG,gBAAe,GAI3D,GACN,CAACb,IAEJI,EAAAA,WAAU,KACR,IAAKH,EAAQ,OACb,MAAMa,EAAU,IAAMb,EAAOc,qBAAqBL,SAASC,mBAE3D,OADSD,SAAAM,iBAAiB,mBAAoBF,GACvC,IAAMJ,SAASO,oBAAoB,mBAAoBH,EAAO,GACpE,CAACb,IAGFiB,EAAAC,IAAC,MAAA,IACKrB,EACJsB,MAAO,CAAEC,SAAU,WAAYC,MAAO,OAAQC,OAAQ,UAAWzB,EAAMsB,OACvElB,MAECL,YAGP,CCpCO,MAAM2B,EAA0BC,EAAoBA,oBAAAC,EAAqBF,yBAC7EG,WAAW/B,GACXgC,6FFJ0B,KACrB,MAAA7B,SAAEA,GAAaL,KACdmC,EAAOC,GAAYC,EAAAA,SAA0BC,EAAAA,cAQ7C,OANP5B,EAAAA,WAAU,IACD,MAAAL,OAAA,EAAAA,EAAUkC,eAAeJ,IAC9BC,EAASD,EAAK,KAEf,CAAC9B,IAEG,CACLA,WACA8B,QACF"}
+{"version":3,"file":"index.cjs","sources":["../../src/shared/hooks/use-fullscreen.ts","../../src/shared/utils/fullscreen-utils.ts","../../src/shared/components/fullscreen.tsx","../../src/shared/index.ts"],"sourcesContent":["import { useCapability, usePlugin } from '@embedpdf/core/@framework';\nimport { FullscreenPlugin, FullscreenState, initialState } from '@embedpdf/plugin-fullscreen';\nimport { useState, useEffect } from '@framework';\n\nexport const useFullscreenPlugin = () => usePlugin<FullscreenPlugin>(FullscreenPlugin.id);\nexport const useFullscreenCapability = () => useCapability<FullscreenPlugin>(FullscreenPlugin.id);\n\nexport const useFullscreen = () => {\n  const { provides } = useFullscreenCapability();\n  const [state, setState] = useState<FullscreenState>(initialState);\n\n  useEffect(() => {\n    return provides?.onStateChange((state) => {\n      setState(state);\n    });\n  }, [provides]);\n\n  return {\n    provides,\n    state,\n  };\n};\n","import { FullscreenRequestEvent } from '@embedpdf/plugin-fullscreen';\n\n/**\n * Find the element to fullscreen based on the event and container\n * @param event The fullscreen request event\n * @param containerElement The container element (fallback if no selector or element not found)\n * @param targetSelector Optional target selector from plugin config\n * @returns The element to fullscreen, or null if not found\n */\nexport function findFullscreenElement(\n  event: FullscreenRequestEvent,\n  containerElement: HTMLElement | null,\n  targetSelector?: string,\n): HTMLElement | null {\n  if (!containerElement || event.action !== 'enter') {\n    return containerElement;\n  }\n\n  let elementToFullscreen: HTMLElement | null = null;\n\n  if (targetSelector) {\n    // Try to find the element within the wrapper element\n    elementToFullscreen = containerElement.querySelector(targetSelector);\n    if (!elementToFullscreen) {\n      console.warn(\n        `Fullscreen: Could not find element with selector \"${targetSelector}\" within the wrapper. Falling back to wrapper element.`,\n      );\n    }\n  }\n\n  // Fall back to the wrapper element if no selector or element not found\n  if (!elementToFullscreen) {\n    elementToFullscreen = containerElement;\n  }\n\n  return elementToFullscreen;\n}\n\n/**\n * Handle a fullscreen request event\n * @param event The fullscreen request event\n * @param containerElement The container element\n * @param targetSelector Optional target selector from plugin config\n */\nexport async function handleFullscreenRequest(\n  event: FullscreenRequestEvent,\n  containerElement: HTMLElement | null,\n  targetSelector?: string,\n): Promise<void> {\n  if (event.action === 'enter') {\n    const elementToFullscreen = findFullscreenElement(event, containerElement, targetSelector);\n\n    if (elementToFullscreen && !document.fullscreenElement) {\n      await elementToFullscreen.requestFullscreen();\n    }\n  } else {\n    if (document.fullscreenElement) {\n      await document.exitFullscreen();\n    }\n  }\n}\n","import { useEffect, useRef, HTMLAttributes, CSSProperties, ReactNode } from '@framework';\n\nimport { useFullscreenPlugin, useFullscreenCapability } from '../hooks';\nimport { handleFullscreenRequest } from '../utils/fullscreen-utils';\n\ntype FullscreenProviderProps = Omit<HTMLAttributes<HTMLDivElement>, 'style'> & {\n  children: ReactNode;\n  style?: CSSProperties;\n};\n\nexport function FullscreenProvider({ children, ...props }: FullscreenProviderProps) {\n  const { provides: fullscreenCapability } = useFullscreenCapability();\n  const { plugin: fullscreenPlugin } = useFullscreenPlugin();\n  const { plugin } = useFullscreenPlugin();\n  const ref = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    if (!fullscreenCapability || !fullscreenPlugin) return;\n\n    const unsub = fullscreenCapability.onRequest(async (event) => {\n      const targetSelector = fullscreenPlugin.getTargetSelector();\n      await handleFullscreenRequest(event, ref.current, targetSelector);\n    });\n\n    return unsub;\n  }, [fullscreenCapability, fullscreenPlugin]);\n\n  useEffect(() => {\n    if (!plugin) return;\n    const handler = () => plugin.setFullscreenState(!!document.fullscreenElement);\n    document.addEventListener('fullscreenchange', handler);\n    return () => document.removeEventListener('fullscreenchange', handler);\n  }, [plugin]);\n\n  return (\n    <div\n      {...props}\n      style={{ position: 'relative', width: '100%', height: '100%', ...props.style }}\n      ref={ref}\n    >\n      {children}\n    </div>\n  );\n}\n","import { createPluginPackage } from '@embedpdf/core';\nimport { FullscreenPluginPackage as BaseFullscreenPackage } from '@embedpdf/plugin-fullscreen';\nimport { FullscreenProvider } from './components';\n\nexport * from './hooks';\nexport * from './components';\n\nexport * from '@embedpdf/plugin-fullscreen';\n\nexport const FullscreenPluginPackage = createPluginPackage(BaseFullscreenPackage)\n  .addWrapper(FullscreenProvider)\n  .build();\n"],"names":["useFullscreenPlugin","usePlugin","FullscreenPlugin","id","useFullscreenCapability","useCapability","async","handleFullscreenRequest","event","containerElement","targetSelector","action","elementToFullscreen","querySelector","console","warn","findFullscreenElement","document","fullscreenElement","requestFullscreen","exitFullscreen","FullscreenProvider","children","props","provides","fullscreenCapability","plugin","fullscreenPlugin","ref","useRef","useEffect","onRequest","getTargetSelector","current","handler","setFullscreenState","addEventListener","removeEventListener","jsx","style","position","width","height","FullscreenPluginPackage","createPluginPackage","BaseFullscreenPackage","addWrapper","build","state","setState","useState","initialState","onStateChange"],"mappings":"+OAIaA,EAAsB,IAAMC,YAA4BC,EAAAA,iBAAiBC,IACzEC,EAA0B,IAAMC,gBAAgCH,EAAAA,iBAAiBC,ICuC9FG,eAAsBC,EACpBC,EACAC,EACAC,GAEA,GAAqB,UAAjBF,EAAMG,OAAoB,CAC5B,MAAMC,EAzCH,SACLJ,EACAC,EACAC,GAEA,IAAKD,GAAqC,UAAjBD,EAAMG,OAC7B,OAAOF,EAGT,IAAIG,EAA0C,KAiB9C,OAfIF,IAEFE,EAAsBH,EAAiBI,cAAcH,GAChDE,GACHE,QAAQC,KACN,qDAAqDL,4DAMtDE,IACHA,EAAsBH,GAGjBG,CACT,CAcgCI,CAAsBR,EAAOC,EAAkBC,GAEvEE,IAAwBK,SAASC,yBAC7BN,EAAoBO,mBAE9B,MACMF,SAASC,yBACLD,SAASG,gBAGrB,CClDO,SAASC,GAAmBC,SAAEA,KAAaC,IAChD,MAAQC,SAAUC,GAAyBrB,KACnCsB,OAAQC,GAAqB3B,KAC/B0B,OAAEA,GAAW1B,IACb4B,EAAMC,EAAAA,OAAuB,MAoBnC,OAlBAC,EAAAA,UAAU,KACR,IAAKL,IAAyBE,EAAkB,OAOhD,OALcF,EAAqBM,UAAUzB,MAAOE,IAClD,MAAME,EAAiBiB,EAAiBK,0BAClCzB,EAAwBC,EAAOoB,EAAIK,QAASvB,MAInD,CAACe,EAAsBE,IAE1BG,EAAAA,UAAU,KACR,IAAKJ,EAAQ,OACb,MAAMQ,EAAU,IAAMR,EAAOS,qBAAqBlB,SAASC,mBAE3D,OADAD,SAASmB,iBAAiB,mBAAoBF,GACvC,IAAMjB,SAASoB,oBAAoB,mBAAoBH,IAC7D,CAACR,IAGFY,EAAAA,IAAC,MAAA,IACKf,EACJgB,MAAO,CAAEC,SAAU,WAAYC,MAAO,OAAQC,OAAQ,UAAWnB,EAAMgB,OACvEX,MAECN,YAGP,CClCO,MAAMqB,EAA0BC,EAAAA,oBAAoBC,EAAAA,yBACxDC,WAAWzB,GACX0B,6FHJ0B,KAC3B,MAAMvB,SAAEA,GAAapB,KACd4C,EAAOC,GAAYC,EAAAA,SAA0BC,EAAAA,cAQpD,OANArB,EAAAA,UAAU,IACD,MAAAN,OAAA,EAAAA,EAAU4B,cAAeJ,IAC9BC,EAASD,KAEV,CAACxB,IAEG,CACLA,WACAwB"}

package/dist/react/index.js

@@ -19,22 +19,49 @@ const useFullscreen = () => {
     state
   };
 };
+function findFullscreenElement(event, containerElement, targetSelector) {
+  if (!containerElement || event.action !== "enter") {
+    return containerElement;
+  }
+  let elementToFullscreen = null;
+  if (targetSelector) {
+    elementToFullscreen = containerElement.querySelector(targetSelector);
+    if (!elementToFullscreen) {
+      console.warn(
+        `Fullscreen: Could not find element with selector "${targetSelector}" within the wrapper. Falling back to wrapper element.`
+      );
+    }
+  }
+  if (!elementToFullscreen) {
+    elementToFullscreen = containerElement;
+  }
+  return elementToFullscreen;
+}
+async function handleFullscreenRequest(event, containerElement, targetSelector) {
+  if (event.action === "enter") {
+    const elementToFullscreen = findFullscreenElement(event, containerElement, targetSelector);
+    if (elementToFullscreen && !document.fullscreenElement) {
+      await elementToFullscreen.requestFullscreen();
+    }
+  } else {
+    if (document.fullscreenElement) {
+      await document.exitFullscreen();
+    }
+  }
+}
 function FullscreenProvider({ children, ...props }) {
   const { provides: fullscreenCapability } = useFullscreenCapability();
+  const { plugin: fullscreenPlugin } = useFullscreenPlugin();
   const { plugin } = useFullscreenPlugin();
   const ref = useRef(null);
   useEffect(() => {
-    if (!fullscreenCapability) return;
-    const unsub = fullscreenCapability.onRequest(async (action) => {
-      if (action === "enter") {
-        const el = ref.current;
-        if (el && !document.fullscreenElement) await el.requestFullscreen();
-      } else {
-        if (document.fullscreenElement) await document.exitFullscreen();
-      }
+    if (!fullscreenCapability || !fullscreenPlugin) return;
+    const unsub = fullscreenCapability.onRequest(async (event) => {
+      const targetSelector = fullscreenPlugin.getTargetSelector();
+      await handleFullscreenRequest(event, ref.current, targetSelector);
     });
     return unsub;
-  }, [fullscreenCapability]);
+  }, [fullscreenCapability, fullscreenPlugin]);
   useEffect(() => {
     if (!plugin) return;
     const handler = () => plugin.setFullscreenState(!!document.fullscreenElement);

package/dist/react/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/shared/hooks/use-fullscreen.ts","../../src/shared/components/fullscreen.tsx","../../src/shared/index.ts"],"sourcesContent":["import { useCapability, usePlugin } from '@embedpdf/core/@framework';\nimport { FullscreenPlugin, FullscreenState, initialState } from '@embedpdf/plugin-fullscreen';\nimport { useState, useEffect } from '@framework';\n\nexport const useFullscreenPlugin = () => usePlugin<FullscreenPlugin>(FullscreenPlugin.id);\nexport const useFullscreenCapability = () => useCapability<FullscreenPlugin>(FullscreenPlugin.id);\n\nexport const useFullscreen = () => {\n  const { provides } = useFullscreenCapability();\n  const [state, setState] = useState<FullscreenState>(initialState);\n\n  useEffect(() => {\n    return provides?.onStateChange((state) => {\n      setState(state);\n    });\n  }, [provides]);\n\n  return {\n    provides,\n    state,\n  };\n};\n","import { useEffect, useRef, HTMLAttributes, CSSProperties, ReactNode } from '@framework';\n\nimport { useFullscreenPlugin, useFullscreenCapability } from '../hooks';\n\ntype FullscreenProviderProps = Omit<HTMLAttributes<HTMLDivElement>, 'style'> & {\n  children: ReactNode;\n  style?: CSSProperties;\n};\n\nexport function FullscreenProvider({ children, ...props }: FullscreenProviderProps) {\n  const { provides: fullscreenCapability } = useFullscreenCapability();\n  const { plugin } = useFullscreenPlugin();\n  const ref = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    if (!fullscreenCapability) return;\n\n    const unsub = fullscreenCapability.onRequest(async (action) => {\n      if (action === 'enter') {\n        const el = ref.current;\n        if (el && !document.fullscreenElement) await el.requestFullscreen();\n      } else {\n        if (document.fullscreenElement) await document.exitFullscreen();\n      }\n    });\n\n    return unsub;\n  }, [fullscreenCapability]);\n\n  useEffect(() => {\n    if (!plugin) return;\n    const handler = () => plugin.setFullscreenState(!!document.fullscreenElement);\n    document.addEventListener('fullscreenchange', handler);\n    return () => document.removeEventListener('fullscreenchange', handler);\n  }, [plugin]);\n\n  return (\n    <div\n      {...props}\n      style={{ position: 'relative', width: '100%', height: '100%', ...props.style }}\n      ref={ref}\n    >\n      {children}\n    </div>\n  );\n}\n","import { createPluginPackage } from '@embedpdf/core';\nimport { FullscreenPluginPackage as BaseFullscreenPackage } from '@embedpdf/plugin-fullscreen';\nimport { FullscreenProvider } from './components';\n\nexport * from './hooks';\nexport * from './components';\n\nexport * from '@embedpdf/plugin-fullscreen';\n\nexport const FullscreenPluginPackage = createPluginPackage(BaseFullscreenPackage)\n  .addWrapper(FullscreenProvider)\n  .build();\n"],"names":["state","BaseFullscreenPackage"],"mappings":";;;;;;AAIO,MAAM,sBAAsB,MAAM,UAA4B,iBAAiB,EAAE;AACjF,MAAM,0BAA0B,MAAM,cAAgC,iBAAiB,EAAE;AAEzF,MAAM,gBAAgB,MAAM;AAC3B,QAAA,EAAE,SAAS,IAAI,wBAAwB;AAC7C,QAAM,CAAC,OAAO,QAAQ,IAAI,SAA0B,YAAY;AAEhE,YAAU,MAAM;AACP,WAAA,qCAAU,cAAc,CAACA,WAAU;AACxC,eAASA,MAAK;AAAA,IAAA;AAAA,EACf,GACA,CAAC,QAAQ,CAAC;AAEN,SAAA;AAAA,IACL;AAAA,IACA;AAAA,EACF;AACF;ACZO,SAAS,mBAAmB,EAAE,UAAU,GAAG,SAAkC;AAClF,QAAM,EAAE,UAAU,qBAAqB,IAAI,wBAAwB;AAC7D,QAAA,EAAE,OAAO,IAAI,oBAAoB;AACjC,QAAA,MAAM,OAAuB,IAAI;AAEvC,YAAU,MAAM;AACd,QAAI,CAAC,qBAAsB;AAE3B,UAAM,QAAQ,qBAAqB,UAAU,OAAO,WAAW;AAC7D,UAAI,WAAW,SAAS;AACtB,cAAM,KAAK,IAAI;AACf,YAAI,MAAM,CAAC,SAAS,kBAAmB,OAAM,GAAG,kBAAkB;AAAA,MAAA,OAC7D;AACL,YAAI,SAAS,kBAAyB,OAAA,SAAS,eAAe;AAAA,MAAA;AAAA,IAChE,CACD;AAEM,WAAA;AAAA,EAAA,GACN,CAAC,oBAAoB,CAAC;AAEzB,YAAU,MAAM;AACd,QAAI,CAAC,OAAQ;AACb,UAAM,UAAU,MAAM,OAAO,mBAAmB,CAAC,CAAC,SAAS,iBAAiB;AACnE,aAAA,iBAAiB,oBAAoB,OAAO;AACrD,WAAO,MAAM,SAAS,oBAAoB,oBAAoB,OAAO;AAAA,EAAA,GACpE,CAAC,MAAM,CAAC;AAGT,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAG;AAAA,MACJ,OAAO,EAAE,UAAU,YAAY,OAAO,QAAQ,QAAQ,QAAQ,GAAG,MAAM,MAAM;AAAA,MAC7E;AAAA,MAEC;AAAA,IAAA;AAAA,EACH;AAEJ;ACpCO,MAAM,0BAA0B,oBAAoBC,yBAAqB,EAC7E,WAAW,kBAAkB,EAC7B,MAAM;"}
+{"version":3,"file":"index.js","sources":["../../src/shared/hooks/use-fullscreen.ts","../../src/shared/utils/fullscreen-utils.ts","../../src/shared/components/fullscreen.tsx","../../src/shared/index.ts"],"sourcesContent":["import { useCapability, usePlugin } from '@embedpdf/core/@framework';\nimport { FullscreenPlugin, FullscreenState, initialState } from '@embedpdf/plugin-fullscreen';\nimport { useState, useEffect } from '@framework';\n\nexport const useFullscreenPlugin = () => usePlugin<FullscreenPlugin>(FullscreenPlugin.id);\nexport const useFullscreenCapability = () => useCapability<FullscreenPlugin>(FullscreenPlugin.id);\n\nexport const useFullscreen = () => {\n  const { provides } = useFullscreenCapability();\n  const [state, setState] = useState<FullscreenState>(initialState);\n\n  useEffect(() => {\n    return provides?.onStateChange((state) => {\n      setState(state);\n    });\n  }, [provides]);\n\n  return {\n    provides,\n    state,\n  };\n};\n","import { FullscreenRequestEvent } from '@embedpdf/plugin-fullscreen';\n\n/**\n * Find the element to fullscreen based on the event and container\n * @param event The fullscreen request event\n * @param containerElement The container element (fallback if no selector or element not found)\n * @param targetSelector Optional target selector from plugin config\n * @returns The element to fullscreen, or null if not found\n */\nexport function findFullscreenElement(\n  event: FullscreenRequestEvent,\n  containerElement: HTMLElement | null,\n  targetSelector?: string,\n): HTMLElement | null {\n  if (!containerElement || event.action !== 'enter') {\n    return containerElement;\n  }\n\n  let elementToFullscreen: HTMLElement | null = null;\n\n  if (targetSelector) {\n    // Try to find the element within the wrapper element\n    elementToFullscreen = containerElement.querySelector(targetSelector);\n    if (!elementToFullscreen) {\n      console.warn(\n        `Fullscreen: Could not find element with selector \"${targetSelector}\" within the wrapper. Falling back to wrapper element.`,\n      );\n    }\n  }\n\n  // Fall back to the wrapper element if no selector or element not found\n  if (!elementToFullscreen) {\n    elementToFullscreen = containerElement;\n  }\n\n  return elementToFullscreen;\n}\n\n/**\n * Handle a fullscreen request event\n * @param event The fullscreen request event\n * @param containerElement The container element\n * @param targetSelector Optional target selector from plugin config\n */\nexport async function handleFullscreenRequest(\n  event: FullscreenRequestEvent,\n  containerElement: HTMLElement | null,\n  targetSelector?: string,\n): Promise<void> {\n  if (event.action === 'enter') {\n    const elementToFullscreen = findFullscreenElement(event, containerElement, targetSelector);\n\n    if (elementToFullscreen && !document.fullscreenElement) {\n      await elementToFullscreen.requestFullscreen();\n    }\n  } else {\n    if (document.fullscreenElement) {\n      await document.exitFullscreen();\n    }\n  }\n}\n","import { useEffect, useRef, HTMLAttributes, CSSProperties, ReactNode } from '@framework';\n\nimport { useFullscreenPlugin, useFullscreenCapability } from '../hooks';\nimport { handleFullscreenRequest } from '../utils/fullscreen-utils';\n\ntype FullscreenProviderProps = Omit<HTMLAttributes<HTMLDivElement>, 'style'> & {\n  children: ReactNode;\n  style?: CSSProperties;\n};\n\nexport function FullscreenProvider({ children, ...props }: FullscreenProviderProps) {\n  const { provides: fullscreenCapability } = useFullscreenCapability();\n  const { plugin: fullscreenPlugin } = useFullscreenPlugin();\n  const { plugin } = useFullscreenPlugin();\n  const ref = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    if (!fullscreenCapability || !fullscreenPlugin) return;\n\n    const unsub = fullscreenCapability.onRequest(async (event) => {\n      const targetSelector = fullscreenPlugin.getTargetSelector();\n      await handleFullscreenRequest(event, ref.current, targetSelector);\n    });\n\n    return unsub;\n  }, [fullscreenCapability, fullscreenPlugin]);\n\n  useEffect(() => {\n    if (!plugin) return;\n    const handler = () => plugin.setFullscreenState(!!document.fullscreenElement);\n    document.addEventListener('fullscreenchange', handler);\n    return () => document.removeEventListener('fullscreenchange', handler);\n  }, [plugin]);\n\n  return (\n    <div\n      {...props}\n      style={{ position: 'relative', width: '100%', height: '100%', ...props.style }}\n      ref={ref}\n    >\n      {children}\n    </div>\n  );\n}\n","import { createPluginPackage } from '@embedpdf/core';\nimport { FullscreenPluginPackage as BaseFullscreenPackage } from '@embedpdf/plugin-fullscreen';\nimport { FullscreenProvider } from './components';\n\nexport * from './hooks';\nexport * from './components';\n\nexport * from '@embedpdf/plugin-fullscreen';\n\nexport const FullscreenPluginPackage = createPluginPackage(BaseFullscreenPackage)\n  .addWrapper(FullscreenProvider)\n  .build();\n"],"names":["state","BaseFullscreenPackage"],"mappings":";;;;;;AAIO,MAAM,sBAAsB,MAAM,UAA4B,iBAAiB,EAAE;AACjF,MAAM,0BAA0B,MAAM,cAAgC,iBAAiB,EAAE;AAEzF,MAAM,gBAAgB,MAAM;AACjC,QAAM,EAAE,SAAA,IAAa,wBAAA;AACrB,QAAM,CAAC,OAAO,QAAQ,IAAI,SAA0B,YAAY;AAEhE,YAAU,MAAM;AACd,WAAO,qCAAU,cAAc,CAACA,WAAU;AACxC,eAASA,MAAK;AAAA,IAChB;AAAA,EACF,GAAG,CAAC,QAAQ,CAAC;AAEb,SAAO;AAAA,IACL;AAAA,IACA;AAAA,EAAA;AAEJ;ACZO,SAAS,sBACd,OACA,kBACA,gBACoB;AACpB,MAAI,CAAC,oBAAoB,MAAM,WAAW,SAAS;AACjD,WAAO;AAAA,EACT;AAEA,MAAI,sBAA0C;AAE9C,MAAI,gBAAgB;AAElB,0BAAsB,iBAAiB,cAAc,cAAc;AACnE,QAAI,CAAC,qBAAqB;AACxB,cAAQ;AAAA,QACN,qDAAqD,cAAc;AAAA,MAAA;AAAA,IAEvE;AAAA,EACF;AAGA,MAAI,CAAC,qBAAqB;AACxB,0BAAsB;AAAA,EACxB;AAEA,SAAO;AACT;AAQA,eAAsB,wBACpB,OACA,kBACA,gBACe;AACf,MAAI,MAAM,WAAW,SAAS;AAC5B,UAAM,sBAAsB,sBAAsB,OAAO,kBAAkB,cAAc;AAEzF,QAAI,uBAAuB,CAAC,SAAS,mBAAmB;AACtD,YAAM,oBAAoB,kBAAA;AAAA,IAC5B;AAAA,EACF,OAAO;AACL,QAAI,SAAS,mBAAmB;AAC9B,YAAM,SAAS,eAAA;AAAA,IACjB;AAAA,EACF;AACF;AClDO,SAAS,mBAAmB,EAAE,UAAU,GAAG,SAAkC;AAClF,QAAM,EAAE,UAAU,qBAAA,IAAyB,wBAAA;AAC3C,QAAM,EAAE,QAAQ,iBAAA,IAAqB,oBAAA;AACrC,QAAM,EAAE,OAAA,IAAW,oBAAA;AACnB,QAAM,MAAM,OAAuB,IAAI;AAEvC,YAAU,MAAM;AACd,QAAI,CAAC,wBAAwB,CAAC,iBAAkB;AAEhD,UAAM,QAAQ,qBAAqB,UAAU,OAAO,UAAU;AAC5D,YAAM,iBAAiB,iBAAiB,kBAAA;AACxC,YAAM,wBAAwB,OAAO,IAAI,SAAS,cAAc;AAAA,IAClE,CAAC;AAED,WAAO;AAAA,EACT,GAAG,CAAC,sBAAsB,gBAAgB,CAAC;AAE3C,YAAU,MAAM;AACd,QAAI,CAAC,OAAQ;AACb,UAAM,UAAU,MAAM,OAAO,mBAAmB,CAAC,CAAC,SAAS,iBAAiB;AAC5E,aAAS,iBAAiB,oBAAoB,OAAO;AACrD,WAAO,MAAM,SAAS,oBAAoB,oBAAoB,OAAO;AAAA,EACvE,GAAG,CAAC,MAAM,CAAC;AAEX,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAG;AAAA,MACJ,OAAO,EAAE,UAAU,YAAY,OAAO,QAAQ,QAAQ,QAAQ,GAAG,MAAM,MAAA;AAAA,MACvE;AAAA,MAEC;AAAA,IAAA;AAAA,EAAA;AAGP;AClCO,MAAM,0BAA0B,oBAAoBC,yBAAqB,EAC7E,WAAW,kBAAkB,EAC7B,MAAA;"}

package/dist/shared/utils/fullscreen-utils.d.ts

@@ -0,0 +1,16 @@
+import { FullscreenRequestEvent } from '../../index.ts';
+/**
+ * Find the element to fullscreen based on the event and container
+ * @param event The fullscreen request event
+ * @param containerElement The container element (fallback if no selector or element not found)
+ * @param targetSelector Optional target selector from plugin config
+ * @returns The element to fullscreen, or null if not found
+ */
+export declare function findFullscreenElement(event: FullscreenRequestEvent, containerElement: HTMLElement | null, targetSelector?: string): HTMLElement | null;
+/**
+ * Handle a fullscreen request event
+ * @param event The fullscreen request event
+ * @param containerElement The container element
+ * @param targetSelector Optional target selector from plugin config
+ */
+export declare function handleFullscreenRequest(event: FullscreenRequestEvent, containerElement: HTMLElement | null, targetSelector?: string): Promise<void>;

package/dist/shared/utils/index.d.ts

@@ -0,0 +1 @@
+export * from './fullscreen-utils';

package/dist/shared-preact/utils/fullscreen-utils.d.ts

@@ -0,0 +1,16 @@
+import { FullscreenRequestEvent } from '../../lib/index.ts';
+/**
+ * Find the element to fullscreen based on the event and container
+ * @param event The fullscreen request event
+ * @param containerElement The container element (fallback if no selector or element not found)
+ * @param targetSelector Optional target selector from plugin config
+ * @returns The element to fullscreen, or null if not found
+ */
+export declare function findFullscreenElement(event: FullscreenRequestEvent, containerElement: HTMLElement | null, targetSelector?: string): HTMLElement | null;
+/**
+ * Handle a fullscreen request event
+ * @param event The fullscreen request event
+ * @param containerElement The container element
+ * @param targetSelector Optional target selector from plugin config
+ */
+export declare function handleFullscreenRequest(event: FullscreenRequestEvent, containerElement: HTMLElement | null, targetSelector?: string): Promise<void>;

package/dist/shared-preact/utils/index.d.ts

@@ -0,0 +1 @@
+export * from './fullscreen-utils';

package/dist/shared-react/utils/fullscreen-utils.d.ts

@@ -0,0 +1,16 @@
+import { FullscreenRequestEvent } from '../../lib/index.ts';
+/**
+ * Find the element to fullscreen based on the event and container
+ * @param event The fullscreen request event
+ * @param containerElement The container element (fallback if no selector or element not found)
+ * @param targetSelector Optional target selector from plugin config
+ * @returns The element to fullscreen, or null if not found
+ */
+export declare function findFullscreenElement(event: FullscreenRequestEvent, containerElement: HTMLElement | null, targetSelector?: string): HTMLElement | null;
+/**
+ * Handle a fullscreen request event
+ * @param event The fullscreen request event
+ * @param containerElement The container element
+ * @param targetSelector Optional target selector from plugin config
+ */
+export declare function handleFullscreenRequest(event: FullscreenRequestEvent, containerElement: HTMLElement | null, targetSelector?: string): Promise<void>;

package/dist/shared-react/utils/index.d.ts

@@ -0,0 +1 @@
+export * from './fullscreen-utils';

package/dist/shared-vue/utils/fullscreen-utils.d.ts

@@ -0,0 +1,16 @@
+import { FullscreenRequestEvent } from '../../lib/index.ts';
+/**
+ * Find the element to fullscreen based on the event and container
+ * @param event The fullscreen request event
+ * @param containerElement The container element (fallback if no selector or element not found)
+ * @param targetSelector Optional target selector from plugin config
+ * @returns The element to fullscreen, or null if not found
+ */
+export declare function findFullscreenElement(event: FullscreenRequestEvent, containerElement: HTMLElement | null, targetSelector?: string): HTMLElement | null;
+/**
+ * Handle a fullscreen request event
+ * @param event The fullscreen request event
+ * @param containerElement The container element
+ * @param targetSelector Optional target selector from plugin config
+ */
+export declare function handleFullscreenRequest(event: FullscreenRequestEvent, containerElement: HTMLElement | null, targetSelector?: string): Promise<void>;

package/dist/svelte/components/FullscreenProvider.svelte.d.ts

@@ -1,9 +1,10 @@
 import { Snippet } from 'svelte';
-interface Props {
+import { HTMLAttributes } from 'svelte/elements';
+type FullscreenProviderProps = Omit<HTMLAttributes<HTMLDivElement>, 'style'> & {
     children: Snippet;
     class?: string;
     style?: string;
-}
-declare const FullscreenProvider: import('svelte', { with: { "resolution-mode": "import" } }).Component<Props, {}, "">;
+};
+declare const FullscreenProvider: import('svelte', { with: { "resolution-mode": "import" } }).Component<FullscreenProviderProps, {}, "">;
 type FullscreenProvider = ReturnType<typeof FullscreenProvider>;
 export default FullscreenProvider;

package/dist/svelte/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("@embedpdf/core"),t=require("@embedpdf/plugin-fullscreen");require("svelte/internal/disclose-version");const r=require("svelte/internal/client"),n=require("@embedpdf/core/svelte");function l(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e)for(const r in e)if("default"!==r){const n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:()=>e[r]})}return t.default=e,Object.freeze(t)}const s=l(r),u=()=>n.usePlugin(t.FullscreenPlugin.id),i=()=>n.useCapability(t.FullscreenPlugin.id);var c=s.from_html("<div><!></div>");function o(e,t){s.push(t,!0);const r=i(),n=u();let l;s.user_effect((()=>{if(!r.provides)return;return r.provides.onRequest((async e=>{if("enter"===e){const e=l;e&&!document.fullscreenElement&&await e.requestFullscreen()}else document.fullscreenElement&&await document.exitFullscreen()}))})),s.user_effect((()=>{if(!n.plugin)return;const e=()=>{n.plugin.setFullscreenState(!!document.fullscreenElement)};return document.addEventListener("fullscreenchange",e),()=>document.removeEventListener("fullscreenchange",e)}));var o=c(),a=s.child(o);s.snippet(a,(()=>t.children)),s.reset(o),s.bind_this(o,(e=>l=e),(()=>l)),s.template_effect((()=>{s.set_class(o,1,s.clsx(t.class)),s.set_style(o,`position: relative; width: 100%; height: 100%; ${(t.style||"")??""}`)})),s.append(e,o),s.pop()}const a=e.createPluginPackage(t.FullscreenPluginPackage).addWrapper(o).build();exports.FullscreenPluginPackage=a,exports.FullscreenProvider=o,exports.useFullscreen=()=>{const e=i(),r=s.proxy({get provides(){return e.provides},state:t.initialState});return s.user_effect((()=>{if(e.provides)return e.provides.onStateChange((e=>{r.state=e}))})),r},exports.useFullscreenCapability=i,exports.useFullscreenPlugin=u,Object.keys(t).forEach((e=>{"default"===e||Object.prototype.hasOwnProperty.call(exports,e)||Object.defineProperty(exports,e,{enumerable:!0,get:()=>t[e]})}));
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("@embedpdf/core"),t=require("@embedpdf/plugin-fullscreen");require("svelte/internal/disclose-version");const r=require("svelte/internal/client"),n=require("@embedpdf/core/svelte");function l(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e)for(const r in e)if("default"!==r){const n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:()=>e[r]})}return t.default=e,Object.freeze(t)}const s=l(r),c=()=>n.usePlugin(t.FullscreenPlugin.id),i=()=>n.useCapability(t.FullscreenPlugin.id);async function u(e,t,r){if("enter"===e.action){const n=function(e,t,r){if(!t||"enter"!==e.action)return t;let n=null;return r&&(n=t.querySelector(r),n||console.warn(`Fullscreen: Could not find element with selector "${r}" within the wrapper. Falling back to wrapper element.`)),n||(n=t),n}(e,t,r);n&&!document.fullscreenElement&&await n.requestFullscreen()}else document.fullscreenElement&&await document.exitFullscreen()}var o=s.from_html("<div><!></div>");function a(e,t){s.push(t,!0);let r=s.rest_props(t,["$$slots","$$events","$$legacy","children","class","style"]);const n=i(),l=c();let a=s.state(null);s.user_effect(()=>{const e=n.provides,t=l.plugin;if(!e||!t)return;return e.onRequest(async e=>{const r=t.getTargetSelector();await u(e,s.get(a),r)})}),s.user_effect(()=>{const e=l.plugin;if(!e)return;const t=()=>{e.setFullscreenState(!!document.fullscreenElement)};return document.addEventListener("fullscreenchange",t),()=>document.removeEventListener("fullscreenchange",t)});var p=o();s.attribute_effect(p,()=>({...r,style:t.style,class:t.class,[s.STYLE]:{position:"relative",width:"100%",height:"100%"}}));var d=s.child(p);s.snippet(d,()=>t.children),s.reset(p),s.bind_this(p,e=>s.set(a,e),()=>s.get(a)),s.append(e,p),s.pop()}const p=e.createPluginPackage(t.FullscreenPluginPackage).addWrapper(a).build();exports.FullscreenPluginPackage=p,exports.FullscreenProvider=a,exports.useFullscreen=()=>{const e=i(),r=s.proxy({get provides(){return e.provides},state:t.initialState});return s.user_effect(()=>{if(e.provides)return e.provides.onStateChange(e=>{r.state=e})}),r},exports.useFullscreenCapability=i,exports.useFullscreenPlugin=c,Object.keys(t).forEach(e=>{"default"===e||Object.prototype.hasOwnProperty.call(exports,e)||Object.defineProperty(exports,e,{enumerable:!0,get:()=>t[e]})});
 //# sourceMappingURL=index.cjs.map

package/dist/svelte/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../../src/svelte/hooks/use-fullscreen.svelte.ts","../../src/svelte/components/FullscreenProvider.svelte","../../src/svelte/index.ts"],"sourcesContent":["import { useCapability, usePlugin } from '@embedpdf/core/svelte';\nimport { FullscreenPlugin, FullscreenState, initialState } from '@embedpdf/plugin-fullscreen';\n\nexport const useFullscreenPlugin = () => usePlugin<FullscreenPlugin>(FullscreenPlugin.id);\nexport const useFullscreenCapability = () => useCapability<FullscreenPlugin>(FullscreenPlugin.id);\n\nexport const useFullscreen = () => {\n  const capability = useFullscreenCapability();\n\n  const state = $state({\n    get provides() {\n      return capability.provides;\n    },\n    state: initialState as FullscreenState,\n  });\n\n  $effect(() => {\n    if (!capability.provides) return;\n    return capability.provides.onStateChange((newState) => {\n      state.state = newState;\n    });\n  });\n\n  return state;\n};\n","<script lang=\"ts\">\n  import type { Snippet } from 'svelte';\n  import { useFullscreenPlugin, useFullscreenCapability } from '../hooks';\n\n  interface Props {\n    children: Snippet;\n    class?: string;\n    style?: string;\n  }\n\n  const { children, class: className, style }: Props = $props();\n\n  const fullscreenCapability = useFullscreenCapability();\n  const fullscreenPlugin = useFullscreenPlugin();\n\n  let containerElement: HTMLDivElement | undefined;\n\n  // Handle fullscreen requests\n  $effect(() => {\n    if (!fullscreenCapability.provides) return;\n\n    const unsub = fullscreenCapability.provides.onRequest(async (action) => {\n      if (action === 'enter') {\n        const el = containerElement;\n        if (el && !document.fullscreenElement) {\n          await el.requestFullscreen();\n        }\n      } else {\n        if (document.fullscreenElement) {\n          await document.exitFullscreen();\n        }\n      }\n    });\n\n    return unsub;\n  });\n\n  // Listen for fullscreen changes\n  $effect(() => {\n    if (!fullscreenPlugin.plugin) return;\n\n    const handler = () => {\n      fullscreenPlugin.plugin.setFullscreenState(!!document.fullscreenElement);\n    };\n\n    document.addEventListener('fullscreenchange', handler);\n    return () => document.removeEventListener('fullscreenchange', handler);\n  });\n</script>\n\n<div\n  bind:this={containerElement}\n  class={className}\n  style=\"position: relative; width: 100%; height: 100%; {style || ''}\"\n>\n  {@render children()}\n</div>\n","import { createPluginPackage } from '@embedpdf/core';\nimport { FullscreenPluginPackage as BaseFullscreenPackage } from '@embedpdf/plugin-fullscreen';\nimport { FullscreenProvider } from './components';\n\nexport * from './hooks';\nexport * from './components';\n\nexport * from '@embedpdf/plugin-fullscreen';\n\nexport const FullscreenPluginPackage = createPluginPackage(BaseFullscreenPackage)\n  .addWrapper(FullscreenProvider)\n  .build();\n"],"names":["useFullscreenPlugin","usePlugin","FullscreenPlugin","id","useFullscreenCapability","useCapability","fullscreenCapability","fullscreenPlugin","containerElement","$","user_effect","provides","onRequest","async","action","el","document","fullscreenElement","requestFullscreen","exitFullscreen","plugin","handler","setFullscreenState","addEventListener","removeEventListener","bind_this","div","$$value","FullscreenPluginPackage","createPluginPackage","BaseFullscreenPackage","addWrapper","FullscreenProvider","build","capability","state","initialState","onStateChange","newState"],"mappings":"4iBAGaA,EAA4B,IAAAC,YAA4BC,EAAAA,iBAAiBC,IACzEC,EAAgC,IAAAC,gBAAgCH,EAAAA,iBAAiBC,qECQtF,MAAAG,EAAuBF,IACvBG,EAAmBP,IAErB,IAAAQ,EAGJC,EAAAC,aAAc,KACP,IAAAJ,EAAqBK,SAAQ,OAe3B,OAbOL,EAAqBK,SAASC,WAASC,MAAQC,OAC5C,UAAXA,EAAoB,CAChB,MAAAC,EAAKP,EACPO,IAAOC,SAASC,yBACZF,EAAGG,mBAEb,MACMF,SAASC,yBACLD,SAASG,gBAEnB,GAGK,IAITV,EAAAC,aAAc,KACP,IAAAH,EAAiBa,OAAM,OAEtB,MAAAC,EAAgB,KACpBd,EAAiBa,OAAOE,qBAAqBN,SAASC,kBAAiB,EAI5D,OADJD,SAAAO,iBAAiB,mBAAoBF,GACjC,IAAAL,SAASQ,oBAAoB,mBAAoBH,EAAO,oEAK5DZ,EAAAgB,UAAAC,GAAAC,GAAAnB,UAAAA,uIAEqD,KAAE,KAAA,yBALpE,CCvCO,MAAMoB,EAA0BC,EAAoBA,oBAAAC,EAAqBF,yBAC7EG,WAAWC,GACXC,kGFJK,MAAAC,EAAa9B,IAEb+B,WACA,YAAAxB,GACK,OAAAuB,EAAWvB,QACpB,EACAwB,MAAOC,EAAAA,eAUF,OAPP3B,EAAAC,kBACO,GAAAwB,EAAWvB,SACT,OAAAuB,EAAWvB,SAAS0B,eAAeC,IACxCH,EAAMA,MAAQG,CAAA,GACf,IAGIH,CAAA"}
+{"version":3,"file":"index.cjs","sources":["../../src/svelte/hooks/use-fullscreen.svelte.ts","../../src/shared/utils/fullscreen-utils.ts","../../src/svelte/components/FullscreenProvider.svelte","../../src/svelte/index.ts"],"sourcesContent":["import { useCapability, usePlugin } from '@embedpdf/core/svelte';\nimport { FullscreenPlugin, FullscreenState, initialState } from '@embedpdf/plugin-fullscreen';\n\nexport const useFullscreenPlugin = () => usePlugin<FullscreenPlugin>(FullscreenPlugin.id);\nexport const useFullscreenCapability = () => useCapability<FullscreenPlugin>(FullscreenPlugin.id);\n\nexport const useFullscreen = () => {\n  const capability = useFullscreenCapability();\n\n  const state = $state({\n    get provides() {\n      return capability.provides;\n    },\n    state: initialState as FullscreenState,\n  });\n\n  $effect(() => {\n    if (!capability.provides) return;\n    return capability.provides.onStateChange((newState) => {\n      state.state = newState;\n    });\n  });\n\n  return state;\n};\n","import { FullscreenRequestEvent } from '@embedpdf/plugin-fullscreen';\n\n/**\n * Find the element to fullscreen based on the event and container\n * @param event The fullscreen request event\n * @param containerElement The container element (fallback if no selector or element not found)\n * @param targetSelector Optional target selector from plugin config\n * @returns The element to fullscreen, or null if not found\n */\nexport function findFullscreenElement(\n  event: FullscreenRequestEvent,\n  containerElement: HTMLElement | null,\n  targetSelector?: string,\n): HTMLElement | null {\n  if (!containerElement || event.action !== 'enter') {\n    return containerElement;\n  }\n\n  let elementToFullscreen: HTMLElement | null = null;\n\n  if (targetSelector) {\n    // Try to find the element within the wrapper element\n    elementToFullscreen = containerElement.querySelector(targetSelector);\n    if (!elementToFullscreen) {\n      console.warn(\n        `Fullscreen: Could not find element with selector \"${targetSelector}\" within the wrapper. Falling back to wrapper element.`,\n      );\n    }\n  }\n\n  // Fall back to the wrapper element if no selector or element not found\n  if (!elementToFullscreen) {\n    elementToFullscreen = containerElement;\n  }\n\n  return elementToFullscreen;\n}\n\n/**\n * Handle a fullscreen request event\n * @param event The fullscreen request event\n * @param containerElement The container element\n * @param targetSelector Optional target selector from plugin config\n */\nexport async function handleFullscreenRequest(\n  event: FullscreenRequestEvent,\n  containerElement: HTMLElement | null,\n  targetSelector?: string,\n): Promise<void> {\n  if (event.action === 'enter') {\n    const elementToFullscreen = findFullscreenElement(event, containerElement, targetSelector);\n\n    if (elementToFullscreen && !document.fullscreenElement) {\n      await elementToFullscreen.requestFullscreen();\n    }\n  } else {\n    if (document.fullscreenElement) {\n      await document.exitFullscreen();\n    }\n  }\n}\n","<script lang=\"ts\">\n  import type { Snippet } from 'svelte';\n  import type { HTMLAttributes } from 'svelte/elements';\n  import { useFullscreenPlugin, useFullscreenCapability } from '../hooks';\n  import { handleFullscreenRequest } from '../../shared/utils/fullscreen-utils';\n\n  type FullscreenProviderProps = Omit<HTMLAttributes<HTMLDivElement>, 'style'> & {\n    children: Snippet;\n    class?: string;\n    style?: string;\n  };\n\n  let {\n    children,\n    class: propsClass,\n    style: propsStyle,\n    ...restProps\n  }: FullscreenProviderProps = $props();\n\n  const fullscreenCapabilityState = useFullscreenCapability();\n  const fullscreenPluginState = useFullscreenPlugin();\n\n  let containerRef = $state<HTMLDivElement | null>(null);\n\n  // Handle fullscreen requests\n  $effect(() => {\n    const capability = fullscreenCapabilityState.provides;\n    const plugin = fullscreenPluginState.plugin;\n\n    if (!capability || !plugin) return;\n\n    const unsub = capability.onRequest(async (event) => {\n      const targetSelector = plugin.getTargetSelector();\n      await handleFullscreenRequest(event, containerRef, targetSelector);\n    });\n\n    return unsub;\n  });\n\n  // Listen for fullscreen changes\n  $effect(() => {\n    const plugin = fullscreenPluginState.plugin;\n\n    if (!plugin) return;\n\n    const handler = () => {\n      plugin.setFullscreenState(!!document.fullscreenElement);\n    };\n\n    document.addEventListener('fullscreenchange', handler);\n    return () => document.removeEventListener('fullscreenchange', handler);\n  });\n</script>\n\n<div\n  {...restProps}\n  bind:this={containerRef}\n  style:position=\"relative\"\n  style:width=\"100%\"\n  style:height=\"100%\"\n  style={propsStyle}\n  class={propsClass}\n>\n  {@render children()}\n</div>\n","import { createPluginPackage } from '@embedpdf/core';\nimport { FullscreenPluginPackage as BaseFullscreenPackage } from '@embedpdf/plugin-fullscreen';\nimport { FullscreenProvider } from './components';\n\nexport * from './hooks';\nexport * from './components';\n\nexport * from '@embedpdf/plugin-fullscreen';\n\nexport const FullscreenPluginPackage = createPluginPackage(BaseFullscreenPackage)\n  .addWrapper(FullscreenProvider)\n  .build();\n"],"names":["useFullscreenPlugin","usePlugin","FullscreenPlugin","id","useFullscreenCapability","useCapability","async","handleFullscreenRequest","event","containerElement","targetSelector","action","elementToFullscreen","querySelector","console","warn","findFullscreenElement","document","fullscreenElement","requestFullscreen","exitFullscreen","restProps","$","rest_props","$$props","fullscreenCapabilityState","fullscreenPluginState","containerRef","user_effect","capability","provides","plugin","onRequest","getTargetSelector","get","handler","setFullscreenState","addEventListener","removeEventListener","bind_this","div","$$value","set","FullscreenPluginPackage","createPluginPackage","BaseFullscreenPackage","addWrapper","FullscreenProvider","build","state","initialState","onStateChange","newState"],"mappings":"4iBAGaA,EAAA,IAA4BC,YAA4BC,EAAAA,iBAAiBC,IACzEC,EAAA,IAAgCC,gBAAgCH,EAAAA,iBAAiBC,ICwC9FG,eAAsBC,EACpBC,EACAC,EACAC,GAEA,GAAqB,UAAjBF,EAAMG,OAAoB,CAC5B,MAAMC,EAzCH,SACLJ,EACAC,EACAC,GAEA,IAAKD,GAAqC,UAAjBD,EAAMG,OAC7B,OAAOF,EAGT,IAAIG,EAA0C,KAiB9C,OAfIF,IAEFE,EAAsBH,EAAiBI,cAAcH,GAChDE,GACHE,QAAQC,KACN,qDAAqDL,4DAMtDE,IACHA,EAAsBH,GAGjBG,CACT,CAcgCI,CAAsBR,EAAOC,EAAkBC,GAEvEE,IAAwBK,SAASC,yBAC7BN,EAAoBO,mBAE9B,MACMF,SAASC,yBACLD,SAASG,gBAGrB,sEC5COC,EAAQC,EAAAC,WAAAC,EAAA,8DAGP,MAAAC,EAA4BrB,IAC5BsB,EAAwB1B,IAE1B,IAAA2B,UAA6C,MAGjDL,EAAAM,YAAO,WACCC,EAAaJ,EAA0BK,SACvCC,EAASL,EAAsBK,OAEhC,IAAAF,IAAeE,EAAM,cAEZF,EAAWG,UAAS1B,MAAQE,UAClCE,EAAiBqB,EAAOE,0BACxB1B,EAAwBC,EAAKc,EAAAY,IAAEP,GAAcjB,OAOvDY,EAAAM,YAAO,WACCG,EAASL,EAAsBK,WAEhCA,EAAM,OAEL,MAAAI,EAAO,KACXJ,EAAOK,qBAAqBnB,SAASC,oBAI1B,OADbD,SAASoB,iBAAiB,mBAAoBF,GACjC,IAAAlB,SAASqB,oBAAoB,mBAAoBH,6CAK5Dd,oJACOC,EAAAiB,UAAAC,EAAAC,GAAAnB,EAAAoB,IAAAf,eAAAA,yBAJb,CC3CO,MAAMgB,EAA0BC,EAAAA,oBAAoBC,EAAAA,yBACxDC,WAAWC,GACXC,kGHJK,MAAAnB,EAAazB,IAEb6C,WACA,YAAAnB,GACK,OAAAD,EAAWC,QACpB,EACAmB,MAAOC,EAAAA,sBAGT5B,EAAAM,iBACO,GAAAC,EAAWC,SACT,OAAAD,EAAWC,SAASqB,cAAeC,IACxCH,EAAMA,MAAQG,MAIXH"}

package/dist/svelte/index.js

@@ -22,45 +22,80 @@ const useFullscreen = () => {
   });
   return state;
 };
+function findFullscreenElement(event, containerElement, targetSelector) {
+  if (!containerElement || event.action !== "enter") {
+    return containerElement;
+  }
+  let elementToFullscreen = null;
+  if (targetSelector) {
+    elementToFullscreen = containerElement.querySelector(targetSelector);
+    if (!elementToFullscreen) {
+      console.warn(
+        `Fullscreen: Could not find element with selector "${targetSelector}" within the wrapper. Falling back to wrapper element.`
+      );
+    }
+  }
+  if (!elementToFullscreen) {
+    elementToFullscreen = containerElement;
+  }
+  return elementToFullscreen;
+}
+async function handleFullscreenRequest(event, containerElement, targetSelector) {
+  if (event.action === "enter") {
+    const elementToFullscreen = findFullscreenElement(event, containerElement, targetSelector);
+    if (elementToFullscreen && !document.fullscreenElement) {
+      await elementToFullscreen.requestFullscreen();
+    }
+  } else {
+    if (document.fullscreenElement) {
+      await document.exitFullscreen();
+    }
+  }
+}
 var root = $.from_html(`<div><!></div>`);
 function FullscreenProvider($$anchor, $$props) {
   $.push($$props, true);
-  const fullscreenCapability = useFullscreenCapability();
-  const fullscreenPlugin = useFullscreenPlugin();
-  let containerElement;
+  let restProps = $.rest_props($$props, [
+    "$$slots",
+    "$$events",
+    "$$legacy",
+    "children",
+    "class",
+    "style"
+  ]);
+  const fullscreenCapabilityState = useFullscreenCapability();
+  const fullscreenPluginState = useFullscreenPlugin();
+  let containerRef = $.state(null);
   $.user_effect(() => {
-    if (!fullscreenCapability.provides) return;
-    const unsub = fullscreenCapability.provides.onRequest(async (action) => {
-      if (action === "enter") {
-        const el = containerElement;
-        if (el && !document.fullscreenElement) {
-          await el.requestFullscreen();
-        }
-      } else {
-        if (document.fullscreenElement) {
-          await document.exitFullscreen();
-        }
-      }
+    const capability = fullscreenCapabilityState.provides;
+    const plugin = fullscreenPluginState.plugin;
+    if (!capability || !plugin) return;
+    const unsub = capability.onRequest(async (event) => {
+      const targetSelector = plugin.getTargetSelector();
+      await handleFullscreenRequest(event, $.get(containerRef), targetSelector);
     });
     return unsub;
   });
   $.user_effect(() => {
-    if (!fullscreenPlugin.plugin) return;
+    const plugin = fullscreenPluginState.plugin;
+    if (!plugin) return;
     const handler = () => {
-      fullscreenPlugin.plugin.setFullscreenState(!!document.fullscreenElement);
+      plugin.setFullscreenState(!!document.fullscreenElement);
     };
     document.addEventListener("fullscreenchange", handler);
     return () => document.removeEventListener("fullscreenchange", handler);
   });
   var div = root();
+  $.attribute_effect(div, () => ({
+    ...restProps,
+    style: $$props.style,
+    class: $$props.class,
+    [$.STYLE]: { position: "relative", width: "100%", height: "100%" }
+  }));
   var node = $.child(div);
   $.snippet(node, () => $$props.children);
   $.reset(div);
-  $.bind_this(div, ($$value) => containerElement = $$value, () => containerElement);
-  $.template_effect(() => {
-    $.set_class(div, 1, $.clsx($$props.class));
-    $.set_style(div, `position: relative; width: 100%; height: 100%; ${($$props.style || "") ?? ""}`);
-  });
+  $.bind_this(div, ($$value) => $.set(containerRef, $$value), () => $.get(containerRef));
   $.append($$anchor, div);
   $.pop();
 }

package/dist/svelte/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/svelte/hooks/use-fullscreen.svelte.ts","../../src/svelte/components/FullscreenProvider.svelte","../../src/svelte/index.ts"],"sourcesContent":["import { useCapability, usePlugin } from '@embedpdf/core/svelte';\nimport { FullscreenPlugin, FullscreenState, initialState } from '@embedpdf/plugin-fullscreen';\n\nexport const useFullscreenPlugin = () => usePlugin<FullscreenPlugin>(FullscreenPlugin.id);\nexport const useFullscreenCapability = () => useCapability<FullscreenPlugin>(FullscreenPlugin.id);\n\nexport const useFullscreen = () => {\n  const capability = useFullscreenCapability();\n\n  const state = $state({\n    get provides() {\n      return capability.provides;\n    },\n    state: initialState as FullscreenState,\n  });\n\n  $effect(() => {\n    if (!capability.provides) return;\n    return capability.provides.onStateChange((newState) => {\n      state.state = newState;\n    });\n  });\n\n  return state;\n};\n","<script lang=\"ts\">\n  import type { Snippet } from 'svelte';\n  import { useFullscreenPlugin, useFullscreenCapability } from '../hooks';\n\n  interface Props {\n    children: Snippet;\n    class?: string;\n    style?: string;\n  }\n\n  const { children, class: className, style }: Props = $props();\n\n  const fullscreenCapability = useFullscreenCapability();\n  const fullscreenPlugin = useFullscreenPlugin();\n\n  let containerElement: HTMLDivElement | undefined;\n\n  // Handle fullscreen requests\n  $effect(() => {\n    if (!fullscreenCapability.provides) return;\n\n    const unsub = fullscreenCapability.provides.onRequest(async (action) => {\n      if (action === 'enter') {\n        const el = containerElement;\n        if (el && !document.fullscreenElement) {\n          await el.requestFullscreen();\n        }\n      } else {\n        if (document.fullscreenElement) {\n          await document.exitFullscreen();\n        }\n      }\n    });\n\n    return unsub;\n  });\n\n  // Listen for fullscreen changes\n  $effect(() => {\n    if (!fullscreenPlugin.plugin) return;\n\n    const handler = () => {\n      fullscreenPlugin.plugin.setFullscreenState(!!document.fullscreenElement);\n    };\n\n    document.addEventListener('fullscreenchange', handler);\n    return () => document.removeEventListener('fullscreenchange', handler);\n  });\n</script>\n\n<div\n  bind:this={containerElement}\n  class={className}\n  style=\"position: relative; width: 100%; height: 100%; {style || ''}\"\n>\n  {@render children()}\n</div>\n","import { createPluginPackage } from '@embedpdf/core';\nimport { FullscreenPluginPackage as BaseFullscreenPackage } from '@embedpdf/plugin-fullscreen';\nimport { FullscreenProvider } from './components';\n\nexport * from './hooks';\nexport * from './components';\n\nexport * from '@embedpdf/plugin-fullscreen';\n\nexport const FullscreenPluginPackage = createPluginPackage(BaseFullscreenPackage)\n  .addWrapper(FullscreenProvider)\n  .build();\n"],"names":["BaseFullscreenPackage"],"mappings":";;;;;;AAGa,MAAA,sBAA4B,MAAA,UAA4B,iBAAiB,EAAE;AAC3E,MAAA,0BAAgC,MAAA,cAAgC,iBAAiB,EAAE;AAEnF,MAAA,sBAAsB;AAC3B,QAAA,aAAa,wBAAwB;QAErC;IACA,IAAA,WAAW;AACN,aAAA,WAAW;AAAA,IACpB;AAAA,IACA,OAAO;AAAA;AAGT,IAAA,kBAAc;AACP,QAAA,CAAA,WAAW,SAAU;AACnB,WAAA,WAAW,SAAS,cAAe,CAAA,aAAa;AACrD,YAAM,QAAQ;AAAA,KACf;AAAA,GACF;SAEM;AACT;;+CCxBA;;AAYQ,QAAA,uBAAuB,wBAAuB;AAC9C,QAAA,mBAAmB,oBAAmB;MAExC;AAGJ,IAAA,YAAc,MAAA;AACP,QAAA,CAAA,qBAAqB,SAAQ;UAE5B,QAAQ,qBAAqB,SAAS,UAAS,OAAQ,WAAW;UAClE,WAAW,SAAS;AAChB,cAAA,KAAK;AACP,YAAA,MAAO,CAAA,SAAS,mBAAmB;AAC/B,gBAAA,GAAG,kBAAiB;AAAA,QAC5B;AAAA,MACF,OAAO;YACD,SAAS,mBAAmB;AACxB,gBAAA,SAAS,eAAc;AAAA,QAC/B;AAAA,MACF;AAAA,KACD;WAEM;AAAA,GACR;AAGD,IAAA,YAAc,MAAA;AACP,QAAA,CAAA,iBAAiB,OAAM;AAEtB,UAAA,UAAgB,MAAA;AACpB,uBAAiB,OAAO,mBAAqB,CAAA,CAAA,SAAS,iBAAiB;AAAA,IACxE;AAED,aAAS,iBAAiB,oBAAoB,OAAO;AACxC,WAAA,MAAA,SAAS,oBAAoB,oBAAoB,OAAO;AAAA,GACtE;;;;;AAIU,IAAA,UAAA,KAAA,CAAA,YAAA,kCAAA,gBAAgB;;;yFAEqC,OAAE,EAAA,EAAA;AAAA;;;AALpE;ACvCO,MAAM,0BAA0B,oBAAoBA,yBAAqB,EAC7E,WAAW,kBAAkB,EAC7B,MAAM;"}
+{"version":3,"file":"index.js","sources":["../../src/svelte/hooks/use-fullscreen.svelte.ts","../../src/shared/utils/fullscreen-utils.ts","../../src/svelte/components/FullscreenProvider.svelte","../../src/svelte/index.ts"],"sourcesContent":["import { useCapability, usePlugin } from '@embedpdf/core/svelte';\nimport { FullscreenPlugin, FullscreenState, initialState } from '@embedpdf/plugin-fullscreen';\n\nexport const useFullscreenPlugin = () => usePlugin<FullscreenPlugin>(FullscreenPlugin.id);\nexport const useFullscreenCapability = () => useCapability<FullscreenPlugin>(FullscreenPlugin.id);\n\nexport const useFullscreen = () => {\n  const capability = useFullscreenCapability();\n\n  const state = $state({\n    get provides() {\n      return capability.provides;\n    },\n    state: initialState as FullscreenState,\n  });\n\n  $effect(() => {\n    if (!capability.provides) return;\n    return capability.provides.onStateChange((newState) => {\n      state.state = newState;\n    });\n  });\n\n  return state;\n};\n","import { FullscreenRequestEvent } from '@embedpdf/plugin-fullscreen';\n\n/**\n * Find the element to fullscreen based on the event and container\n * @param event The fullscreen request event\n * @param containerElement The container element (fallback if no selector or element not found)\n * @param targetSelector Optional target selector from plugin config\n * @returns The element to fullscreen, or null if not found\n */\nexport function findFullscreenElement(\n  event: FullscreenRequestEvent,\n  containerElement: HTMLElement | null,\n  targetSelector?: string,\n): HTMLElement | null {\n  if (!containerElement || event.action !== 'enter') {\n    return containerElement;\n  }\n\n  let elementToFullscreen: HTMLElement | null = null;\n\n  if (targetSelector) {\n    // Try to find the element within the wrapper element\n    elementToFullscreen = containerElement.querySelector(targetSelector);\n    if (!elementToFullscreen) {\n      console.warn(\n        `Fullscreen: Could not find element with selector \"${targetSelector}\" within the wrapper. Falling back to wrapper element.`,\n      );\n    }\n  }\n\n  // Fall back to the wrapper element if no selector or element not found\n  if (!elementToFullscreen) {\n    elementToFullscreen = containerElement;\n  }\n\n  return elementToFullscreen;\n}\n\n/**\n * Handle a fullscreen request event\n * @param event The fullscreen request event\n * @param containerElement The container element\n * @param targetSelector Optional target selector from plugin config\n */\nexport async function handleFullscreenRequest(\n  event: FullscreenRequestEvent,\n  containerElement: HTMLElement | null,\n  targetSelector?: string,\n): Promise<void> {\n  if (event.action === 'enter') {\n    const elementToFullscreen = findFullscreenElement(event, containerElement, targetSelector);\n\n    if (elementToFullscreen && !document.fullscreenElement) {\n      await elementToFullscreen.requestFullscreen();\n    }\n  } else {\n    if (document.fullscreenElement) {\n      await document.exitFullscreen();\n    }\n  }\n}\n","<script lang=\"ts\">\n  import type { Snippet } from 'svelte';\n  import type { HTMLAttributes } from 'svelte/elements';\n  import { useFullscreenPlugin, useFullscreenCapability } from '../hooks';\n  import { handleFullscreenRequest } from '../../shared/utils/fullscreen-utils';\n\n  type FullscreenProviderProps = Omit<HTMLAttributes<HTMLDivElement>, 'style'> & {\n    children: Snippet;\n    class?: string;\n    style?: string;\n  };\n\n  let {\n    children,\n    class: propsClass,\n    style: propsStyle,\n    ...restProps\n  }: FullscreenProviderProps = $props();\n\n  const fullscreenCapabilityState = useFullscreenCapability();\n  const fullscreenPluginState = useFullscreenPlugin();\n\n  let containerRef = $state<HTMLDivElement | null>(null);\n\n  // Handle fullscreen requests\n  $effect(() => {\n    const capability = fullscreenCapabilityState.provides;\n    const plugin = fullscreenPluginState.plugin;\n\n    if (!capability || !plugin) return;\n\n    const unsub = capability.onRequest(async (event) => {\n      const targetSelector = plugin.getTargetSelector();\n      await handleFullscreenRequest(event, containerRef, targetSelector);\n    });\n\n    return unsub;\n  });\n\n  // Listen for fullscreen changes\n  $effect(() => {\n    const plugin = fullscreenPluginState.plugin;\n\n    if (!plugin) return;\n\n    const handler = () => {\n      plugin.setFullscreenState(!!document.fullscreenElement);\n    };\n\n    document.addEventListener('fullscreenchange', handler);\n    return () => document.removeEventListener('fullscreenchange', handler);\n  });\n</script>\n\n<div\n  {...restProps}\n  bind:this={containerRef}\n  style:position=\"relative\"\n  style:width=\"100%\"\n  style:height=\"100%\"\n  style={propsStyle}\n  class={propsClass}\n>\n  {@render children()}\n</div>\n","import { createPluginPackage } from '@embedpdf/core';\nimport { FullscreenPluginPackage as BaseFullscreenPackage } from '@embedpdf/plugin-fullscreen';\nimport { FullscreenProvider } from './components';\n\nexport * from './hooks';\nexport * from './components';\n\nexport * from '@embedpdf/plugin-fullscreen';\n\nexport const FullscreenPluginPackage = createPluginPackage(BaseFullscreenPackage)\n  .addWrapper(FullscreenProvider)\n  .build();\n"],"names":["BaseFullscreenPackage"],"mappings":";;;;;;AAGa,MAAA,sBAAA,MAA4B,UAA4B,iBAAiB,EAAE;AAC3E,MAAA,0BAAA,MAAgC,cAAgC,iBAAiB,EAAE;AAEnF,MAAA,sBAAsB;AAC3B,QAAA,aAAa,wBAAA;QAEb;IACA,IAAA,WAAW;AACN,aAAA,WAAW;AAAA,IACpB;AAAA,IACA,OAAO;AAAA;AAGT,IAAA,kBAAc;AACP,QAAA,CAAA,WAAW,SAAA;AACT,WAAA,WAAW,SAAS,cAAA,CAAe,aAAa;AACrD,YAAM,QAAQ;AAAA,IAChB,CAAC;AAAA,EACH,CAAC;SAEM;AACT;ACfO,SAAS,sBACd,OACA,kBACA,gBACoB;AACpB,MAAI,CAAC,oBAAoB,MAAM,WAAW,SAAS;AACjD,WAAO;AAAA,EACT;AAEA,MAAI,sBAA0C;AAE9C,MAAI,gBAAgB;AAElB,0BAAsB,iBAAiB,cAAc,cAAc;AACnE,QAAI,CAAC,qBAAqB;AACxB,cAAQ;AAAA,QACN,qDAAqD,cAAc;AAAA,MAAA;AAAA,IAEvE;AAAA,EACF;AAGA,MAAI,CAAC,qBAAqB;AACxB,0BAAsB;AAAA,EACxB;AAEA,SAAO;AACT;AAQA,eAAsB,wBACpB,OACA,kBACA,gBACe;AACf,MAAI,MAAM,WAAW,SAAS;AAC5B,UAAM,sBAAsB,sBAAsB,OAAO,kBAAkB,cAAc;AAEzF,QAAI,uBAAuB,CAAC,SAAS,mBAAmB;AACtD,YAAM,oBAAoB,kBAAA;AAAA,IAC5B;AAAA,EACF,OAAO;AACL,QAAI,SAAS,mBAAmB;AAC9B,YAAM,SAAS,eAAA;AAAA,IACjB;AAAA,EACF;AACF;;+CC5DA;;MAgBO,YAAQ,EAAA,WAAA,SAAA;AAAA;;;;;;;AAGP,QAAA,4BAA4B,wBAAuB;AACnD,QAAA,wBAAwB,oBAAmB;AAE7C,MAAA,uBAA6C,IAAI;AAGrD,IAAA,YAAO,MAAO;UACN,aAAa,0BAA0B;UACvC,SAAS,sBAAsB;AAEhC,QAAA,CAAA,eAAe,OAAM;AAEpB,UAAA,QAAQ,WAAW,UAAS,OAAQ,UAAU;YAC5C,iBAAiB,OAAO,kBAAiB;AACzC,YAAA,wBAAwB,OAAK,EAAA,IAAE,YAAY,GAAE,cAAc;AAAA,IACnE,CAAC;WAEM;AAAA,EACT,CAAC;AAGD,IAAA,YAAO,MAAO;UACN,SAAS,sBAAsB;SAEhC,OAAM;AAEL,UAAA,UAAO,MAAS;AACpB,aAAO,mBAAkB,CAAA,CAAG,SAAS,iBAAiB;AAAA,IACxD;AAEA,aAAS,iBAAiB,oBAAoB,OAAO;AACxC,WAAA,MAAA,SAAS,oBAAoB,oBAAoB,OAAO;AAAA,EACvE,CAAC;;;OAIG;AAAA;;;;;;;AACO,IAAA,UAAA,KAAA,CAAA,YAAA,EAAA,IAAA,oCAAA,YAAY,CAAA;;;AAJzB;AC3CO,MAAM,0BAA0B,oBAAoBA,yBAAqB,EAC7E,WAAW,kBAAkB,EAC7B,MAAA;"}

package/dist/vue/components/fullscreen.vue.d.ts

@@ -2,8 +2,9 @@ declare var __VLS_1: {};
 type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_1) => any;
 };
-declare const __VLS_component: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
-declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+declare const __VLS_base: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
 export default _default;
 type __VLS_WithSlots<T, S> = T & {
     new (): {

package/dist/vue/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("@embedpdf/core"),n=require("@embedpdf/plugin-fullscreen"),t=require("vue"),l=require("@embedpdf/core/vue"),r=()=>l.usePlugin(n.FullscreenPlugin.id),u=()=>l.useCapability(n.FullscreenPlugin.id),o=t.defineComponent({__name:"fullscreen",setup(e){const{provides:n}=u(),{plugin:l}=r(),o=t.ref(null);let s=null;return t.onMounted((()=>{const e=n.value;e&&(s=e.onRequest((async e=>{const n=o.value;"enter"===e?n&&!document.fullscreenElement&&await n.requestFullscreen():document.fullscreenElement&&await document.exitFullscreen()})));const r=l.value;if(r){const e=()=>{r.setFullscreenState(!!document.fullscreenElement)};document.addEventListener("fullscreenchange",e),t.onUnmounted((()=>{document.removeEventListener("fullscreenchange",e)}))}})),t.onUnmounted((()=>{s&&s()})),(e,n)=>(t.openBlock(),t.createElementBlock("div",{ref_key:"containerRef",ref:o,style:{position:"relative",width:"100%",height:"100%"}},[t.renderSlot(e.$slots,"default")],512))}}),s=e.createPluginPackage(n.FullscreenPluginPackage).addWrapper(o).build();exports.FullscreenPluginPackage=s,exports.FullscreenProvider=o,exports.useFullscreen=()=>{const{provides:e}=u(),l=t.ref(n.initialState);let r=null;return t.watchEffect((()=>{const n=e.value;r&&(r(),r=null),n&&(r=n.onStateChange((e=>{l.value=e})))})),t.onUnmounted((()=>{r&&r()})),{provides:e,state:l}},exports.useFullscreenCapability=u,exports.useFullscreenPlugin=r,Object.keys(n).forEach((e=>{"default"===e||Object.prototype.hasOwnProperty.call(exports,e)||Object.defineProperty(exports,e,{enumerable:!0,get:()=>n[e]})}));
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("@embedpdf/core"),t=require("@embedpdf/plugin-fullscreen"),n=require("vue"),l=require("@embedpdf/core/vue"),r=()=>l.usePlugin(t.FullscreenPlugin.id),u=()=>l.useCapability(t.FullscreenPlugin.id);async function o(e,t,n){if("enter"===e.action){const l=function(e,t,n){if(!t||"enter"!==e.action)return t;let l=null;return n&&(l=t.querySelector(n),l||console.warn(`Fullscreen: Could not find element with selector "${n}" within the wrapper. Falling back to wrapper element.`)),l||(l=t),l}(e,t,n);l&&!document.fullscreenElement&&await l.requestFullscreen()}else document.fullscreenElement&&await document.exitFullscreen()}const c=n.defineComponent({__name:"fullscreen",setup(e){const{provides:t}=u(),{plugin:l}=r(),c=n.ref(null);let s=null,i=null;return n.onMounted(()=>{const e=t.value,n=l.value;e&&n&&(s=e.onRequest(async e=>{const t=n.getTargetSelector();await o(e,c.value,t)}));const r=l.value;if(r){const e=()=>{r.setFullscreenState(!!document.fullscreenElement)};document.addEventListener("fullscreenchange",e),i=()=>{document.removeEventListener("fullscreenchange",e)}}}),n.onUnmounted(()=>{s&&s(),i&&i()}),(e,t)=>(n.openBlock(),n.createElementBlock("div",{ref_key:"containerRef",ref:c,style:{position:"relative",width:"100%",height:"100%"}},[n.renderSlot(e.$slots,"default")],512))}}),s=e.createPluginPackage(t.FullscreenPluginPackage).addWrapper(c).build();exports.FullscreenPluginPackage=s,exports.FullscreenProvider=c,exports.useFullscreen=()=>{const{provides:e}=u(),l=n.ref(t.initialState);return n.watchEffect(t=>{const n=e.value;if(n){const e=n.onStateChange(e=>{l.value=e});t(()=>{e()})}}),{provides:e,state:l}},exports.useFullscreenCapability=u,exports.useFullscreenPlugin=r,Object.keys(t).forEach(e=>{"default"===e||Object.prototype.hasOwnProperty.call(exports,e)||Object.defineProperty(exports,e,{enumerable:!0,get:()=>t[e]})});
 //# sourceMappingURL=index.cjs.map

package/dist/vue/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../../src/vue/hooks/use-fullscreen.ts","../../src/vue/components/fullscreen.vue","../../src/vue/index.ts"],"sourcesContent":["import { ref, watchEffect, onUnmounted } from 'vue';\nimport { useCapability, usePlugin } from '@embedpdf/core/vue';\nimport { FullscreenPlugin, FullscreenState, initialState } from '@embedpdf/plugin-fullscreen';\n\nexport const useFullscreenPlugin = () => usePlugin<FullscreenPlugin>(FullscreenPlugin.id);\nexport const useFullscreenCapability = () => useCapability<FullscreenPlugin>(FullscreenPlugin.id);\n\nexport const useFullscreen = () => {\n  const { provides: fullscreenProviderRef } = useFullscreenCapability();\n  const state = ref<FullscreenState>(initialState);\n\n  let unsubscribe: (() => void) | null = null;\n\n  watchEffect(() => {\n    const fullscreenProvider = fullscreenProviderRef.value;\n\n    // Clean up previous subscription if it exists\n    if (unsubscribe) {\n      unsubscribe();\n      unsubscribe = null;\n    }\n\n    if (fullscreenProvider) {\n      // Subscribe to state changes\n      unsubscribe = fullscreenProvider.onStateChange((newState) => {\n        state.value = newState;\n      });\n    }\n  });\n\n  // Clean up on unmount\n  onUnmounted(() => {\n    if (unsubscribe) {\n      unsubscribe();\n    }\n  });\n\n  return {\n    provides: fullscreenProviderRef,\n    state,\n  };\n};\n","<script setup lang=\"ts\">\nimport { ref, onMounted, onUnmounted, CSSProperties } from 'vue';\nimport { useFullscreenPlugin, useFullscreenCapability } from '../hooks';\n\nconst { provides: fullscreenCapabilityRef } = useFullscreenCapability();\nconst { plugin: fullscreenPluginRef } = useFullscreenPlugin();\nconst containerRef = ref<HTMLDivElement | null>(null);\n\nlet unsubscribe: (() => void) | null = null;\n\nonMounted(() => {\n  const fullscreenCapability = fullscreenCapabilityRef.value;\n\n  if (fullscreenCapability) {\n    unsubscribe = fullscreenCapability.onRequest(async (action) => {\n      const el = containerRef.value;\n      if (action === 'enter') {\n        if (el && !document.fullscreenElement) {\n          await el.requestFullscreen();\n        }\n      } else {\n        if (document.fullscreenElement) {\n          await document.exitFullscreen();\n        }\n      }\n    });\n  }\n\n  // Handle fullscreen state changes\n  const plugin = fullscreenPluginRef.value;\n  if (plugin) {\n    const handler = () => {\n      plugin.setFullscreenState(!!document.fullscreenElement);\n    };\n    document.addEventListener('fullscreenchange', handler);\n\n    onUnmounted(() => {\n      document.removeEventListener('fullscreenchange', handler);\n    });\n  }\n});\n\nonUnmounted(() => {\n  if (unsubscribe) {\n    unsubscribe();\n  }\n});\n</script>\n\n<template>\n  <div\n    ref=\"containerRef\"\n    :style=\"{\n      position: 'relative',\n      width: '100%',\n      height: '100%',\n    }\"\n  >\n    <slot />\n  </div>\n</template>\n","import { createPluginPackage } from '@embedpdf/core';\nimport { FullscreenPluginPackage as BaseFullscreenPackage } from '@embedpdf/plugin-fullscreen';\nimport { FullscreenProvider } from './components';\n\nexport * from './hooks';\nexport * from './components';\n\nexport * from '@embedpdf/plugin-fullscreen';\n\nexport const FullscreenPluginPackage = createPluginPackage(BaseFullscreenPackage)\n  .addWrapper(FullscreenProvider)\n  .build();\n"],"names":["useFullscreenPlugin","usePlugin","FullscreenPlugin","id","useFullscreenCapability","useCapability","provides","fullscreenCapabilityRef","plugin","fullscreenPluginRef","containerRef","ref","unsubscribe","onMounted","fullscreenCapability","value","onRequest","async","action","el","document","fullscreenElement","requestFullscreen","exitFullscreen","handler","setFullscreenState","addEventListener","onUnmounted","removeEventListener","_createElementBlock","createElementBlock","style","_renderSlot","_ctx","$slots","FullscreenPluginPackage","createPluginPackage","BaseFullscreenPackage","addWrapper","FullscreenProvider","build","fullscreenProviderRef","state","initialState","watchEffect","fullscreenProvider","onStateChange","newState"],"mappings":"4MAIaA,EAAsB,IAAMC,YAA4BC,EAAAA,iBAAiBC,IACzEC,EAA0B,IAAMC,gBAAgCH,EAAAA,iBAAiBC,sDCD9F,MAAQG,SAAUC,GAA4BH,KACtCI,OAAQC,GAAwBT,IAClCU,EAAeC,MAA2B,MAEhD,IAAIC,EAAmC,YAEvCC,EAAAA,WAAU,KACR,MAAMC,EAAuBP,EAAwBQ,MAEjDD,IACYF,EAAAE,EAAqBE,WAAUC,MAAOC,IAClD,MAAMC,EAAKT,EAAaK,MACT,UAAXG,EACEC,IAAOC,SAASC,yBACZF,EAAGG,oBAGPF,SAASC,yBACLD,SAASG,gBACjB,KAMN,MAAMf,EAASC,EAAoBM,MACnC,GAAIP,EAAQ,CACV,MAAMgB,EAAU,KACdhB,EAAOiB,qBAAqBL,SAASC,kBAAiB,EAE/CD,SAAAM,iBAAiB,mBAAoBF,GAE9CG,EAAAA,aAAY,KACDP,SAAAQ,oBAAoB,mBAAoBJ,EAAO,GACzD,KAILG,EAAAA,aAAY,KACNf,GACUA,GAAA,0BAMdiB,EAAAC,mBASM,MAAA,SARA,eAAJnB,IAAID,EACHqB,MAAO,mDAMRC,aAAQC,EAAAC,OAAA,qBCjDCC,EAA0BC,EAAoBA,oBAAAC,EAAqBF,yBAC7EG,WAAWC,GACXC,6FFJ0B,KAC3B,MAAQlC,SAAUmC,GAA0BrC,IACtCsC,EAAQ/B,MAAqBgC,gBAEnC,IAAI/B,EAAmC,KA0BhC,OAxBPgC,EAAAA,aAAY,KACV,MAAMC,EAAqBJ,EAAsB1B,MAG7CH,IACUA,IACEA,EAAA,MAGZiC,IAEYjC,EAAAiC,EAAmBC,eAAeC,IAC9CL,EAAM3B,MAAQgC,CAAA,IACf,IAKLpB,EAAAA,aAAY,KACNf,GACUA,GAAA,IAIT,CACLN,SAAUmC,EACVC,QACF"}
+{"version":3,"file":"index.cjs","sources":["../../src/vue/hooks/use-fullscreen.ts","../../src/shared/utils/fullscreen-utils.ts","../../src/vue/components/fullscreen.vue","../../src/vue/index.ts"],"sourcesContent":["import { ref, watchEffect } from 'vue';\nimport { useCapability, usePlugin } from '@embedpdf/core/vue';\nimport { FullscreenPlugin, FullscreenState, initialState } from '@embedpdf/plugin-fullscreen';\n\nexport const useFullscreenPlugin = () => usePlugin<FullscreenPlugin>(FullscreenPlugin.id);\nexport const useFullscreenCapability = () => useCapability<FullscreenPlugin>(FullscreenPlugin.id);\n\nexport const useFullscreen = () => {\n  const { provides: fullscreenProviderRef } = useFullscreenCapability();\n  const state = ref<FullscreenState>(initialState);\n\n  watchEffect((onCleanup) => {\n    const fullscreenProvider = fullscreenProviderRef.value;\n\n    if (fullscreenProvider) {\n      const unsubscribe = fullscreenProvider.onStateChange((newState) => {\n        state.value = newState;\n      });\n\n      onCleanup(() => {\n        unsubscribe();\n      });\n    }\n  });\n\n  return {\n    provides: fullscreenProviderRef,\n    state,\n  };\n};\n","import { FullscreenRequestEvent } from '@embedpdf/plugin-fullscreen';\n\n/**\n * Find the element to fullscreen based on the event and container\n * @param event The fullscreen request event\n * @param containerElement The container element (fallback if no selector or element not found)\n * @param targetSelector Optional target selector from plugin config\n * @returns The element to fullscreen, or null if not found\n */\nexport function findFullscreenElement(\n  event: FullscreenRequestEvent,\n  containerElement: HTMLElement | null,\n  targetSelector?: string,\n): HTMLElement | null {\n  if (!containerElement || event.action !== 'enter') {\n    return containerElement;\n  }\n\n  let elementToFullscreen: HTMLElement | null = null;\n\n  if (targetSelector) {\n    // Try to find the element within the wrapper element\n    elementToFullscreen = containerElement.querySelector(targetSelector);\n    if (!elementToFullscreen) {\n      console.warn(\n        `Fullscreen: Could not find element with selector \"${targetSelector}\" within the wrapper. Falling back to wrapper element.`,\n      );\n    }\n  }\n\n  // Fall back to the wrapper element if no selector or element not found\n  if (!elementToFullscreen) {\n    elementToFullscreen = containerElement;\n  }\n\n  return elementToFullscreen;\n}\n\n/**\n * Handle a fullscreen request event\n * @param event The fullscreen request event\n * @param containerElement The container element\n * @param targetSelector Optional target selector from plugin config\n */\nexport async function handleFullscreenRequest(\n  event: FullscreenRequestEvent,\n  containerElement: HTMLElement | null,\n  targetSelector?: string,\n): Promise<void> {\n  if (event.action === 'enter') {\n    const elementToFullscreen = findFullscreenElement(event, containerElement, targetSelector);\n\n    if (elementToFullscreen && !document.fullscreenElement) {\n      await elementToFullscreen.requestFullscreen();\n    }\n  } else {\n    if (document.fullscreenElement) {\n      await document.exitFullscreen();\n    }\n  }\n}\n","<script setup lang=\"ts\">\nimport { ref, onMounted, onUnmounted } from 'vue';\nimport { useFullscreenPlugin, useFullscreenCapability } from '../hooks';\nimport { handleFullscreenRequest } from '../../shared/utils/fullscreen-utils';\n\nconst { provides: fullscreenCapabilityRef } = useFullscreenCapability();\nconst { plugin: fullscreenPluginRef } = useFullscreenPlugin();\nconst containerRef = ref<HTMLDivElement | null>(null);\n\nlet unsubscribe: (() => void) | null = null;\nlet fullscreenChangeUnsubscribe: (() => void) | null = null;\n\nonMounted(() => {\n  const fullscreenCapability = fullscreenCapabilityRef.value;\n  const fullscreenPlugin = fullscreenPluginRef.value;\n\n  if (fullscreenCapability && fullscreenPlugin) {\n    unsubscribe = fullscreenCapability.onRequest(async (event) => {\n      const targetSelector = fullscreenPlugin.getTargetSelector();\n      await handleFullscreenRequest(event, containerRef.value, targetSelector);\n    });\n  }\n\n  // Handle fullscreen state changes\n  const plugin = fullscreenPluginRef.value;\n  if (plugin) {\n    const handler = () => {\n      plugin.setFullscreenState(!!document.fullscreenElement);\n    };\n    document.addEventListener('fullscreenchange', handler);\n\n    fullscreenChangeUnsubscribe = () => {\n      document.removeEventListener('fullscreenchange', handler);\n    };\n  }\n});\n\nonUnmounted(() => {\n  if (unsubscribe) {\n    unsubscribe();\n  }\n  if (fullscreenChangeUnsubscribe) {\n    fullscreenChangeUnsubscribe();\n  }\n});\n</script>\n\n<template>\n  <div\n    ref=\"containerRef\"\n    :style=\"{\n      position: 'relative',\n      width: '100%',\n      height: '100%',\n    }\"\n  >\n    <slot />\n  </div>\n</template>\n","import { createPluginPackage } from '@embedpdf/core';\nimport { FullscreenPluginPackage as BaseFullscreenPackage } from '@embedpdf/plugin-fullscreen';\nimport { FullscreenProvider } from './components';\n\nexport * from './hooks';\nexport * from './components';\n\nexport * from '@embedpdf/plugin-fullscreen';\n\nexport const FullscreenPluginPackage = createPluginPackage(BaseFullscreenPackage)\n  .addWrapper(FullscreenProvider)\n  .build();\n"],"names":["useFullscreenPlugin","usePlugin","FullscreenPlugin","id","useFullscreenCapability","useCapability","async","handleFullscreenRequest","event","containerElement","targetSelector","action","elementToFullscreen","querySelector","console","warn","findFullscreenElement","document","fullscreenElement","requestFullscreen","exitFullscreen","provides","fullscreenCapabilityRef","plugin","fullscreenPluginRef","containerRef","ref","unsubscribe","fullscreenChangeUnsubscribe","onMounted","fullscreenCapability","value","fullscreenPlugin","onRequest","getTargetSelector","handler","setFullscreenState","addEventListener","removeEventListener","onUnmounted","_createElementBlock","style","_renderSlot","_ctx","$slots","FullscreenPluginPackage","createPluginPackage","BaseFullscreenPackage","addWrapper","FullscreenProvider","build","fullscreenProviderRef","state","initialState","watchEffect","onCleanup","fullscreenProvider","onStateChange","newState"],"mappings":"4MAIaA,EAAsB,IAAMC,YAA4BC,EAAAA,iBAAiBC,IACzEC,EAA0B,IAAMC,gBAAgCH,EAAAA,iBAAiBC,ICuC9FG,eAAsBC,EACpBC,EACAC,EACAC,GAEA,GAAqB,UAAjBF,EAAMG,OAAoB,CAC5B,MAAMC,EAzCH,SACLJ,EACAC,EACAC,GAEA,IAAKD,GAAqC,UAAjBD,EAAMG,OAC7B,OAAOF,EAGT,IAAIG,EAA0C,KAiB9C,OAfIF,IAEFE,EAAsBH,EAAiBI,cAAcH,GAChDE,GACHE,QAAQC,KACN,qDAAqDL,4DAMtDE,IACHA,EAAsBH,GAGjBG,CACT,CAcgCI,CAAsBR,EAAOC,EAAkBC,GAEvEE,IAAwBK,SAASC,yBAC7BN,EAAoBO,mBAE9B,MACMF,SAASC,yBACLD,SAASG,gBAGrB,yDCvDA,MAAQC,SAAUC,GAA4BlB,KACtCmB,OAAQC,GAAwBxB,IAClCyB,EAAeC,EAAAA,IAA2B,MAEhD,IAAIC,EAAmC,KACnCC,EAAmD,YAEvDC,EAAAA,UAAU,KACR,MAAMC,EAAuBR,EAAwBS,MAC/CC,EAAmBR,EAAoBO,MAEzCD,GAAwBE,IAC1BL,EAAcG,EAAqBG,UAAU3B,MAAOE,IAClD,MAAME,EAAiBsB,EAAiBE,0BAClC3B,EAAwBC,EAAOiB,EAAaM,MAAOrB,MAK7D,MAAMa,EAASC,EAAoBO,MACnC,GAAIR,EAAQ,CACV,MAAMY,EAAU,KACdZ,EAAOa,qBAAqBnB,SAASC,oBAEvCD,SAASoB,iBAAiB,mBAAoBF,GAE9CP,EAA8B,KAC5BX,SAASqB,oBAAoB,mBAAoBH,GAErD,IAGFI,EAAAA,YAAY,KACNZ,GACFA,IAEEC,GACFA,4BAMFY,EAAAA,mBASM,MAAA,SARA,eAAJd,IAAID,EACHgB,MAAO,mDAMRC,aAAQC,EAAAC,OAAA,qBC/CCC,EAA0BC,EAAAA,oBAAoBC,EAAAA,yBACxDC,WAAWC,GACXC,6FHJ0B,KAC3B,MAAQ7B,SAAU8B,GAA0B/C,IACtCgD,EAAQ1B,EAAAA,IAAqB2B,gBAgBnC,OAdAC,EAAAA,YAAaC,IACX,MAAMC,EAAqBL,EAAsBpB,MAEjD,GAAIyB,EAAoB,CACtB,MAAM7B,EAAc6B,EAAmBC,cAAeC,IACpDN,EAAMrB,MAAQ2B,IAGhBH,EAAU,KACR5B,KAEJ,IAGK,CACLN,SAAU8B,EACVC"}

package/dist/vue/index.js

@@ -1,29 +1,22 @@
 import { createPluginPackage } from "@embedpdf/core";
 import { FullscreenPlugin, initialState, FullscreenPluginPackage as FullscreenPluginPackage$1 } from "@embedpdf/plugin-fullscreen";
 export * from "@embedpdf/plugin-fullscreen";
-import { ref, watchEffect, onUnmounted, defineComponent, onMounted, createElementBlock, openBlock, renderSlot } from "vue";
+import { ref, watchEffect, defineComponent, onMounted, onUnmounted, createElementBlock, openBlock, renderSlot } from "vue";
 import { useCapability, usePlugin } from "@embedpdf/core/vue";
 const useFullscreenPlugin = () => usePlugin(FullscreenPlugin.id);
 const useFullscreenCapability = () => useCapability(FullscreenPlugin.id);
 const useFullscreen = () => {
   const { provides: fullscreenProviderRef } = useFullscreenCapability();
   const state = ref(initialState);
-  let unsubscribe = null;
-  watchEffect(() => {
+  watchEffect((onCleanup) => {
     const fullscreenProvider = fullscreenProviderRef.value;
-    if (unsubscribe) {
-      unsubscribe();
-      unsubscribe = null;
-    }
     if (fullscreenProvider) {
-      unsubscribe = fullscreenProvider.onStateChange((newState) => {
+      const unsubscribe = fullscreenProvider.onStateChange((newState) => {
         state.value = newState;
       });
-    }
-  });
-  onUnmounted(() => {
-    if (unsubscribe) {
-      unsubscribe();
+      onCleanup(() => {
+        unsubscribe();
+      });
     }
   });
   return {
@@ -31,6 +24,36 @@ const useFullscreen = () => {
     state
   };
 };
+function findFullscreenElement(event, containerElement, targetSelector) {
+  if (!containerElement || event.action !== "enter") {
+    return containerElement;
+  }
+  let elementToFullscreen = null;
+  if (targetSelector) {
+    elementToFullscreen = containerElement.querySelector(targetSelector);
+    if (!elementToFullscreen) {
+      console.warn(
+        `Fullscreen: Could not find element with selector "${targetSelector}" within the wrapper. Falling back to wrapper element.`
+      );
+    }
+  }
+  if (!elementToFullscreen) {
+    elementToFullscreen = containerElement;
+  }
+  return elementToFullscreen;
+}
+async function handleFullscreenRequest(event, containerElement, targetSelector) {
+  if (event.action === "enter") {
+    const elementToFullscreen = findFullscreenElement(event, containerElement, targetSelector);
+    if (elementToFullscreen && !document.fullscreenElement) {
+      await elementToFullscreen.requestFullscreen();
+    }
+  } else {
+    if (document.fullscreenElement) {
+      await document.exitFullscreen();
+    }
+  }
+}
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "fullscreen",
   setup(__props) {
@@ -38,20 +61,14 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const { plugin: fullscreenPluginRef } = useFullscreenPlugin();
     const containerRef = ref(null);
     let unsubscribe = null;
+    let fullscreenChangeUnsubscribe = null;
     onMounted(() => {
       const fullscreenCapability = fullscreenCapabilityRef.value;
-      if (fullscreenCapability) {
-        unsubscribe = fullscreenCapability.onRequest(async (action) => {
-          const el = containerRef.value;
-          if (action === "enter") {
-            if (el && !document.fullscreenElement) {
-              await el.requestFullscreen();
-            }
-          } else {
-            if (document.fullscreenElement) {
-              await document.exitFullscreen();
-            }
-          }
+      const fullscreenPlugin = fullscreenPluginRef.value;
+      if (fullscreenCapability && fullscreenPlugin) {
+        unsubscribe = fullscreenCapability.onRequest(async (event) => {
+          const targetSelector = fullscreenPlugin.getTargetSelector();
+          await handleFullscreenRequest(event, containerRef.value, targetSelector);
         });
       }
       const plugin = fullscreenPluginRef.value;
@@ -60,15 +77,18 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           plugin.setFullscreenState(!!document.fullscreenElement);
         };
         document.addEventListener("fullscreenchange", handler);
-        onUnmounted(() => {
+        fullscreenChangeUnsubscribe = () => {
           document.removeEventListener("fullscreenchange", handler);
-        });
+        };
       }
     });
     onUnmounted(() => {
       if (unsubscribe) {
         unsubscribe();
       }
+      if (fullscreenChangeUnsubscribe) {
+        fullscreenChangeUnsubscribe();
+      }
     });
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", {

package/dist/vue/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/vue/hooks/use-fullscreen.ts","../../src/vue/components/fullscreen.vue","../../src/vue/index.ts"],"sourcesContent":["import { ref, watchEffect, onUnmounted } from 'vue';\nimport { useCapability, usePlugin } from '@embedpdf/core/vue';\nimport { FullscreenPlugin, FullscreenState, initialState } from '@embedpdf/plugin-fullscreen';\n\nexport const useFullscreenPlugin = () => usePlugin<FullscreenPlugin>(FullscreenPlugin.id);\nexport const useFullscreenCapability = () => useCapability<FullscreenPlugin>(FullscreenPlugin.id);\n\nexport const useFullscreen = () => {\n  const { provides: fullscreenProviderRef } = useFullscreenCapability();\n  const state = ref<FullscreenState>(initialState);\n\n  let unsubscribe: (() => void) | null = null;\n\n  watchEffect(() => {\n    const fullscreenProvider = fullscreenProviderRef.value;\n\n    // Clean up previous subscription if it exists\n    if (unsubscribe) {\n      unsubscribe();\n      unsubscribe = null;\n    }\n\n    if (fullscreenProvider) {\n      // Subscribe to state changes\n      unsubscribe = fullscreenProvider.onStateChange((newState) => {\n        state.value = newState;\n      });\n    }\n  });\n\n  // Clean up on unmount\n  onUnmounted(() => {\n    if (unsubscribe) {\n      unsubscribe();\n    }\n  });\n\n  return {\n    provides: fullscreenProviderRef,\n    state,\n  };\n};\n","<script setup lang=\"ts\">\nimport { ref, onMounted, onUnmounted, CSSProperties } from 'vue';\nimport { useFullscreenPlugin, useFullscreenCapability } from '../hooks';\n\nconst { provides: fullscreenCapabilityRef } = useFullscreenCapability();\nconst { plugin: fullscreenPluginRef } = useFullscreenPlugin();\nconst containerRef = ref<HTMLDivElement | null>(null);\n\nlet unsubscribe: (() => void) | null = null;\n\nonMounted(() => {\n  const fullscreenCapability = fullscreenCapabilityRef.value;\n\n  if (fullscreenCapability) {\n    unsubscribe = fullscreenCapability.onRequest(async (action) => {\n      const el = containerRef.value;\n      if (action === 'enter') {\n        if (el && !document.fullscreenElement) {\n          await el.requestFullscreen();\n        }\n      } else {\n        if (document.fullscreenElement) {\n          await document.exitFullscreen();\n        }\n      }\n    });\n  }\n\n  // Handle fullscreen state changes\n  const plugin = fullscreenPluginRef.value;\n  if (plugin) {\n    const handler = () => {\n      plugin.setFullscreenState(!!document.fullscreenElement);\n    };\n    document.addEventListener('fullscreenchange', handler);\n\n    onUnmounted(() => {\n      document.removeEventListener('fullscreenchange', handler);\n    });\n  }\n});\n\nonUnmounted(() => {\n  if (unsubscribe) {\n    unsubscribe();\n  }\n});\n</script>\n\n<template>\n  <div\n    ref=\"containerRef\"\n    :style=\"{\n      position: 'relative',\n      width: '100%',\n      height: '100%',\n    }\"\n  >\n    <slot />\n  </div>\n</template>\n","import { createPluginPackage } from '@embedpdf/core';\nimport { FullscreenPluginPackage as BaseFullscreenPackage } from '@embedpdf/plugin-fullscreen';\nimport { FullscreenProvider } from './components';\n\nexport * from './hooks';\nexport * from './components';\n\nexport * from '@embedpdf/plugin-fullscreen';\n\nexport const FullscreenPluginPackage = createPluginPackage(BaseFullscreenPackage)\n  .addWrapper(FullscreenProvider)\n  .build();\n"],"names":["_createElementBlock","_renderSlot","BaseFullscreenPackage","FullscreenProvider"],"mappings":";;;;;AAIO,MAAM,sBAAsB,MAAM,UAA4B,iBAAiB,EAAE;AACjF,MAAM,0BAA0B,MAAM,cAAgC,iBAAiB,EAAE;AAEzF,MAAM,gBAAgB,MAAM;AACjC,QAAM,EAAE,UAAU,sBAAsB,IAAI,wBAAwB;AAC9D,QAAA,QAAQ,IAAqB,YAAY;AAE/C,MAAI,cAAmC;AAEvC,cAAY,MAAM;AAChB,UAAM,qBAAqB,sBAAsB;AAGjD,QAAI,aAAa;AACH,kBAAA;AACE,oBAAA;AAAA,IAAA;AAGhB,QAAI,oBAAoB;AAER,oBAAA,mBAAmB,cAAc,CAAC,aAAa;AAC3D,cAAM,QAAQ;AAAA,MAAA,CACf;AAAA,IAAA;AAAA,EACH,CACD;AAGD,cAAY,MAAM;AAChB,QAAI,aAAa;AACH,kBAAA;AAAA,IAAA;AAAA,EACd,CACD;AAEM,SAAA;AAAA,IACL,UAAU;AAAA,IACV;AAAA,EACF;AACF;;;;ACrCA,UAAM,EAAE,UAAU,wBAAwB,IAAI,wBAAwB;AACtE,UAAM,EAAE,QAAQ,oBAAoB,IAAI,oBAAoB;AACtD,UAAA,eAAe,IAA2B,IAAI;AAEpD,QAAI,cAAmC;AAEvC,cAAU,MAAM;AACd,YAAM,uBAAuB,wBAAwB;AAErD,UAAI,sBAAsB;AACV,sBAAA,qBAAqB,UAAU,OAAO,WAAW;AAC7D,gBAAM,KAAK,aAAa;AACxB,cAAI,WAAW,SAAS;AAClB,gBAAA,MAAM,CAAC,SAAS,mBAAmB;AACrC,oBAAM,GAAG,kBAAkB;AAAA,YAAA;AAAA,UAC7B,OACK;AACL,gBAAI,SAAS,mBAAmB;AAC9B,oBAAM,SAAS,eAAe;AAAA,YAAA;AAAA,UAChC;AAAA,QACF,CACD;AAAA,MAAA;AAIH,YAAM,SAAS,oBAAoB;AACnC,UAAI,QAAQ;AACV,cAAM,UAAU,MAAM;AACpB,iBAAO,mBAAmB,CAAC,CAAC,SAAS,iBAAiB;AAAA,QACxD;AACS,iBAAA,iBAAiB,oBAAoB,OAAO;AAErD,oBAAY,MAAM;AACP,mBAAA,oBAAoB,oBAAoB,OAAO;AAAA,QAAA,CACzD;AAAA,MAAA;AAAA,IACH,CACD;AAED,gBAAY,MAAM;AAChB,UAAI,aAAa;AACH,oBAAA;AAAA,MAAA;AAAA,IACd,CACD;;0BAICA,mBASM,OAAA;AAAA,iBARA;AAAA,QAAJ,KAAI;AAAA,QACH,OAAO;AAAA;;;;MAIP;QAEDC,WAAQ,KAAA,QAAA,SAAA;AAAA;;;;ACjDL,MAAM,0BAA0B,oBAAoBC,yBAAqB,EAC7E,WAAWC,SAAkB,EAC7B,MAAM;"}
+{"version":3,"file":"index.js","sources":["../../src/vue/hooks/use-fullscreen.ts","../../src/shared/utils/fullscreen-utils.ts","../../src/vue/components/fullscreen.vue","../../src/vue/index.ts"],"sourcesContent":["import { ref, watchEffect } from 'vue';\nimport { useCapability, usePlugin } from '@embedpdf/core/vue';\nimport { FullscreenPlugin, FullscreenState, initialState } from '@embedpdf/plugin-fullscreen';\n\nexport const useFullscreenPlugin = () => usePlugin<FullscreenPlugin>(FullscreenPlugin.id);\nexport const useFullscreenCapability = () => useCapability<FullscreenPlugin>(FullscreenPlugin.id);\n\nexport const useFullscreen = () => {\n  const { provides: fullscreenProviderRef } = useFullscreenCapability();\n  const state = ref<FullscreenState>(initialState);\n\n  watchEffect((onCleanup) => {\n    const fullscreenProvider = fullscreenProviderRef.value;\n\n    if (fullscreenProvider) {\n      const unsubscribe = fullscreenProvider.onStateChange((newState) => {\n        state.value = newState;\n      });\n\n      onCleanup(() => {\n        unsubscribe();\n      });\n    }\n  });\n\n  return {\n    provides: fullscreenProviderRef,\n    state,\n  };\n};\n","import { FullscreenRequestEvent } from '@embedpdf/plugin-fullscreen';\n\n/**\n * Find the element to fullscreen based on the event and container\n * @param event The fullscreen request event\n * @param containerElement The container element (fallback if no selector or element not found)\n * @param targetSelector Optional target selector from plugin config\n * @returns The element to fullscreen, or null if not found\n */\nexport function findFullscreenElement(\n  event: FullscreenRequestEvent,\n  containerElement: HTMLElement | null,\n  targetSelector?: string,\n): HTMLElement | null {\n  if (!containerElement || event.action !== 'enter') {\n    return containerElement;\n  }\n\n  let elementToFullscreen: HTMLElement | null = null;\n\n  if (targetSelector) {\n    // Try to find the element within the wrapper element\n    elementToFullscreen = containerElement.querySelector(targetSelector);\n    if (!elementToFullscreen) {\n      console.warn(\n        `Fullscreen: Could not find element with selector \"${targetSelector}\" within the wrapper. Falling back to wrapper element.`,\n      );\n    }\n  }\n\n  // Fall back to the wrapper element if no selector or element not found\n  if (!elementToFullscreen) {\n    elementToFullscreen = containerElement;\n  }\n\n  return elementToFullscreen;\n}\n\n/**\n * Handle a fullscreen request event\n * @param event The fullscreen request event\n * @param containerElement The container element\n * @param targetSelector Optional target selector from plugin config\n */\nexport async function handleFullscreenRequest(\n  event: FullscreenRequestEvent,\n  containerElement: HTMLElement | null,\n  targetSelector?: string,\n): Promise<void> {\n  if (event.action === 'enter') {\n    const elementToFullscreen = findFullscreenElement(event, containerElement, targetSelector);\n\n    if (elementToFullscreen && !document.fullscreenElement) {\n      await elementToFullscreen.requestFullscreen();\n    }\n  } else {\n    if (document.fullscreenElement) {\n      await document.exitFullscreen();\n    }\n  }\n}\n","<script setup lang=\"ts\">\nimport { ref, onMounted, onUnmounted } from 'vue';\nimport { useFullscreenPlugin, useFullscreenCapability } from '../hooks';\nimport { handleFullscreenRequest } from '../../shared/utils/fullscreen-utils';\n\nconst { provides: fullscreenCapabilityRef } = useFullscreenCapability();\nconst { plugin: fullscreenPluginRef } = useFullscreenPlugin();\nconst containerRef = ref<HTMLDivElement | null>(null);\n\nlet unsubscribe: (() => void) | null = null;\nlet fullscreenChangeUnsubscribe: (() => void) | null = null;\n\nonMounted(() => {\n  const fullscreenCapability = fullscreenCapabilityRef.value;\n  const fullscreenPlugin = fullscreenPluginRef.value;\n\n  if (fullscreenCapability && fullscreenPlugin) {\n    unsubscribe = fullscreenCapability.onRequest(async (event) => {\n      const targetSelector = fullscreenPlugin.getTargetSelector();\n      await handleFullscreenRequest(event, containerRef.value, targetSelector);\n    });\n  }\n\n  // Handle fullscreen state changes\n  const plugin = fullscreenPluginRef.value;\n  if (plugin) {\n    const handler = () => {\n      plugin.setFullscreenState(!!document.fullscreenElement);\n    };\n    document.addEventListener('fullscreenchange', handler);\n\n    fullscreenChangeUnsubscribe = () => {\n      document.removeEventListener('fullscreenchange', handler);\n    };\n  }\n});\n\nonUnmounted(() => {\n  if (unsubscribe) {\n    unsubscribe();\n  }\n  if (fullscreenChangeUnsubscribe) {\n    fullscreenChangeUnsubscribe();\n  }\n});\n</script>\n\n<template>\n  <div\n    ref=\"containerRef\"\n    :style=\"{\n      position: 'relative',\n      width: '100%',\n      height: '100%',\n    }\"\n  >\n    <slot />\n  </div>\n</template>\n","import { createPluginPackage } from '@embedpdf/core';\nimport { FullscreenPluginPackage as BaseFullscreenPackage } from '@embedpdf/plugin-fullscreen';\nimport { FullscreenProvider } from './components';\n\nexport * from './hooks';\nexport * from './components';\n\nexport * from '@embedpdf/plugin-fullscreen';\n\nexport const FullscreenPluginPackage = createPluginPackage(BaseFullscreenPackage)\n  .addWrapper(FullscreenProvider)\n  .build();\n"],"names":["_createElementBlock","_renderSlot","BaseFullscreenPackage","FullscreenProvider"],"mappings":";;;;;AAIO,MAAM,sBAAsB,MAAM,UAA4B,iBAAiB,EAAE;AACjF,MAAM,0BAA0B,MAAM,cAAgC,iBAAiB,EAAE;AAEzF,MAAM,gBAAgB,MAAM;AACjC,QAAM,EAAE,UAAU,sBAAA,IAA0B,wBAAA;AAC5C,QAAM,QAAQ,IAAqB,YAAY;AAE/C,cAAY,CAAC,cAAc;AACzB,UAAM,qBAAqB,sBAAsB;AAEjD,QAAI,oBAAoB;AACtB,YAAM,cAAc,mBAAmB,cAAc,CAAC,aAAa;AACjE,cAAM,QAAQ;AAAA,MAChB,CAAC;AAED,gBAAU,MAAM;AACd,oBAAA;AAAA,MACF,CAAC;AAAA,IACH;AAAA,EACF,CAAC;AAED,SAAO;AAAA,IACL,UAAU;AAAA,IACV;AAAA,EAAA;AAEJ;ACpBO,SAAS,sBACd,OACA,kBACA,gBACoB;AACpB,MAAI,CAAC,oBAAoB,MAAM,WAAW,SAAS;AACjD,WAAO;AAAA,EACT;AAEA,MAAI,sBAA0C;AAE9C,MAAI,gBAAgB;AAElB,0BAAsB,iBAAiB,cAAc,cAAc;AACnE,QAAI,CAAC,qBAAqB;AACxB,cAAQ;AAAA,QACN,qDAAqD,cAAc;AAAA,MAAA;AAAA,IAEvE;AAAA,EACF;AAGA,MAAI,CAAC,qBAAqB;AACxB,0BAAsB;AAAA,EACxB;AAEA,SAAO;AACT;AAQA,eAAsB,wBACpB,OACA,kBACA,gBACe;AACf,MAAI,MAAM,WAAW,SAAS;AAC5B,UAAM,sBAAsB,sBAAsB,OAAO,kBAAkB,cAAc;AAEzF,QAAI,uBAAuB,CAAC,SAAS,mBAAmB;AACtD,YAAM,oBAAoB,kBAAA;AAAA,IAC5B;AAAA,EACF,OAAO;AACL,QAAI,SAAS,mBAAmB;AAC9B,YAAM,SAAS,eAAA;AAAA,IACjB;AAAA,EACF;AACF;;;;ACvDA,UAAM,EAAE,UAAU,wBAAA,IAA4B,wBAAA;AAC9C,UAAM,EAAE,QAAQ,oBAAA,IAAwB,oBAAA;AACxC,UAAM,eAAe,IAA2B,IAAI;AAEpD,QAAI,cAAmC;AACvC,QAAI,8BAAmD;AAEvD,cAAU,MAAM;AACd,YAAM,uBAAuB,wBAAwB;AACrD,YAAM,mBAAmB,oBAAoB;AAE7C,UAAI,wBAAwB,kBAAkB;AAC5C,sBAAc,qBAAqB,UAAU,OAAO,UAAU;AAC5D,gBAAM,iBAAiB,iBAAiB,kBAAA;AACxC,gBAAM,wBAAwB,OAAO,aAAa,OAAO,cAAc;AAAA,QACzE,CAAC;AAAA,MACH;AAGA,YAAM,SAAS,oBAAoB;AACnC,UAAI,QAAQ;AACV,cAAM,UAAU,MAAM;AACpB,iBAAO,mBAAmB,CAAC,CAAC,SAAS,iBAAiB;AAAA,QACxD;AACA,iBAAS,iBAAiB,oBAAoB,OAAO;AAErD,sCAA8B,MAAM;AAClC,mBAAS,oBAAoB,oBAAoB,OAAO;AAAA,QAC1D;AAAA,MACF;AAAA,IACF,CAAC;AAED,gBAAY,MAAM;AAChB,UAAI,aAAa;AACf,oBAAA;AAAA,MACF;AACA,UAAI,6BAA6B;AAC/B,oCAAA;AAAA,MACF;AAAA,IACF,CAAC;;0BAICA,mBASM,OAAA;AAAA,iBARA;AAAA,QAAJ,KAAI;AAAA,QACH,OAAO;AAAA;;;;MAIP;QAEDC,WAAQ,KAAA,QAAA,SAAA;AAAA,MAAA;;;;AC/CL,MAAM,0BAA0B,oBAAoBC,yBAAqB,EAC7E,WAAWC,SAAkB,EAC7B,MAAA;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@embedpdf/plugin-fullscreen",
-  "version": "1.5.0",
+  "version": "2.0.0-next.0",
   "type": "module",
   "license": "MIT",
   "main": "./dist/index.cjs",
@@ -34,13 +34,13 @@
     }
   },
   "dependencies": {
-    "@embedpdf/models": "1.5.0"
+    "@embedpdf/models": "2.0.0-next.0"
   },
   "devDependencies": {
     "@types/react": "^18.2.0",
     "typescript": "^5.0.0",
-    "@embedpdf/core": "1.5.0",
-    "@embedpdf/build": "1.1.0"
+    "@embedpdf/build": "1.1.0",
+    "@embedpdf/core": "2.0.0-next.0"
   },
   "peerDependencies": {
     "react": ">=16.8.0",
@@ -48,7 +48,7 @@
     "preact": "^10.26.4",
     "vue": ">=3.2.0",
     "svelte": ">=5 <6",
-    "@embedpdf/core": "1.5.0"
+    "@embedpdf/core": "2.0.0-next.0"
   },
   "files": [
     "dist",