5.0.15

CHANGELOG.md

@@ -1,3 +1,17 @@
+# 5.0.15 (2023-04-06)
+
+### Bug Fixes
+
+- **Fancybox** Fix `parentEl` option
+- **Fancybox** Fix click event while highlighting text in input ([471](https://github.com/fancyapps/ui/issues/471))
+- **Fancybox** Fix close button not showing in HTML5 Video ([469](https://github.com/fancyapps/ui/issues/469))
+
+### Features
+
+- **Fancybox** Add `fromSelector()` static method
+- **Fancybox** Improve zoom-in animation performance
+- **Carousel** Improve guesture handling
+
 # 5.0.14 (2023-03-30)
 
 ### Bug Fixes

dist/panzoom/panzoom.pins.esm.js

@@ -1 +1 @@
-const t=(e,...s)=>{const n=s.length;for(let i=0;i<n;i++){const n=s[i]||{};Object.entries(n).forEach((([s,n])=>{const i=Array.isArray(n)?[]:{};var r;e[s]||Object.assign(e,{[s]:i}),"object"==typeof(r=n)&&null!==r&&r.constructor===Object&&"[object Object]"===Object.prototype.toString.call(r)?Object.assign(e[s],t(i,n)):Array.isArray(n)?Object.assign(e,{[s]:[...n]}):Object.assign(e,{[s]:n})}))}return e},e=function(t,e){return t.split(".").reduce(((t,e)=>"object"==typeof t?t[e]:void 0),e)};class s{constructor(t={}){Object.defineProperty(this,"options",{enumerable:!0,configurable:!0,writable:!0,value:t}),Object.defineProperty(this,"events",{enumerable:!0,configurable:!0,writable:!0,value:new Map}),this.setOptions(t);for(const t of Object.getOwnPropertyNames(Object.getPrototypeOf(this)))t.startsWith("on")&&"function"==typeof this[t]&&(this[t]=this[t].bind(this))}setOptions(e){this.options=e?t({},this.constructor.defaults,e):{};for(const[t,e]of Object.entries(this.option("on")||{}))this.on(t,e)}option(t,...s){let n=e(t,this.options);return n&&"function"==typeof n&&(n=n.call(this,this,...s)),n}optionFor(t,s,n,...i){let r=e(s,t);var o;"string"!=typeof(o=r)||isNaN(o)||isNaN(parseFloat(o))||(r=parseFloat(r)),"true"===r&&(r=!0),"false"===r&&(r=!1),r&&"function"==typeof r&&(r=r.call(this,this,t,...i));let a=e(s,this.options);return a&&"function"==typeof a?r=a.call(this,this,t,...i,r):void 0===r&&(r=a),void 0===r?n:r}cn(t){const e=this.options.classes;return e&&e[t]||""}localize(t,e=[]){t=String(t).replace(/\{\{(\w+).?(\w+)?\}\}/g,((t,e,s)=>{let n="";return s?n=this.option(`${e[0]+e.toLowerCase().substring(1)}.l10n.${s}`):e&&(n=this.option(`l10n.${e}`)),n||(n=t),n}));for(let s=0;s<e.length;s++)t=t.split(e[s][0]).join(e[s][1]);return t=t.replace(/\{\{(.*?)\}\}/g,((t,e)=>e))}on(t,e){let s=[];"string"==typeof t?s=t.split(" "):Array.isArray(t)&&(s=t),this.events||(this.events=new Map),s.forEach((t=>{let s=this.events.get(t);s||(this.events.set(t,[]),s=[]),s.includes(e)||s.push(e),this.events.set(t,s)}))}off(t,e){let s=[];"string"==typeof t?s=t.split(" "):Array.isArray(t)&&(s=t),s.forEach((t=>{const s=this.events.get(t);if(Array.isArray(s)){const t=s.indexOf(e);t>-1&&s.splice(t,1)}}))}emit(t,...e){[...this.events.get(t)||[]].forEach((t=>t(this,...e))),"*"!==t&&this.emit("*",t,...e)}}Object.defineProperty(s,"version",{enumerable:!0,configurable:!0,writable:!0,value:"5.0.14"}),Object.defineProperty(s,"defaults",{enumerable:!0,configurable:!0,writable:!0,value:{}});class n extends s{constructor(t,e){super(e),Object.defineProperty(this,"instance",{enumerable:!0,configurable:!0,writable:!0,value:t})}attach(){}detach(){}}class i extends n{constructor(){super(...arguments),Object.defineProperty(this,"container",{enumerable:!0,configurable:!0,writable:!0,value:null}),Object.defineProperty(this,"pins",{enumerable:!0,configurable:!0,writable:!0,value:[]})}onTransform(t){for(const s of this.pins){if(!((e=s)&&null!==e&&e instanceof Element&&"nodeType"in e))continue;const{fitWidth:n,fitHeight:i,fullWidth:r,fullHeight:o}=t.contentRect,a=s.dataset.x||"",c=s.dataset.y||"";let l=0,f=0;l=a.includes("%")?n*(parseFloat(a)/100):parseFloat(a)/r*n,l-=.5*n,f=c.includes("%")?i*(parseFloat(c)/100):parseFloat(c)/o*i,f-=.5*i;const h=new DOMPoint(l,f).matrixTransform(t.getMatrix());s.style.transform=`translate3d(${h.x||0}px, ${h.y||0}px, 0)`}var e}attach(){this.pins=Array.from(this.instance.container.querySelectorAll("[data-panzoom-pin]")),this.pins.length&&(this.instance.container.classList.add("has-pins"),this.instance.on("afterTransform",this.onTransform))}detach(){this.pins=[],this.instance.container.classList.remove("has-pins"),this.instance.off("afterTransform",this.onTransform)}}Object.defineProperty(i,"defaults",{enumerable:!0,configurable:!0,writable:!0,value:{}});export{i as Pins};
+const t=(e,...s)=>{const n=s.length;for(let i=0;i<n;i++){const n=s[i]||{};Object.entries(n).forEach((([s,n])=>{const i=Array.isArray(n)?[]:{};var r;e[s]||Object.assign(e,{[s]:i}),"object"==typeof(r=n)&&null!==r&&r.constructor===Object&&"[object Object]"===Object.prototype.toString.call(r)?Object.assign(e[s],t(i,n)):Array.isArray(n)?Object.assign(e,{[s]:[...n]}):Object.assign(e,{[s]:n})}))}return e},e=function(t,e){return t.split(".").reduce(((t,e)=>"object"==typeof t?t[e]:void 0),e)};class s{constructor(t={}){Object.defineProperty(this,"options",{enumerable:!0,configurable:!0,writable:!0,value:t}),Object.defineProperty(this,"events",{enumerable:!0,configurable:!0,writable:!0,value:new Map}),this.setOptions(t);for(const t of Object.getOwnPropertyNames(Object.getPrototypeOf(this)))t.startsWith("on")&&"function"==typeof this[t]&&(this[t]=this[t].bind(this))}setOptions(e){this.options=e?t({},this.constructor.defaults,e):{};for(const[t,e]of Object.entries(this.option("on")||{}))this.on(t,e)}option(t,...s){let n=e(t,this.options);return n&&"function"==typeof n&&(n=n.call(this,this,...s)),n}optionFor(t,s,n,...i){let r=e(s,t);var o;"string"!=typeof(o=r)||isNaN(o)||isNaN(parseFloat(o))||(r=parseFloat(r)),"true"===r&&(r=!0),"false"===r&&(r=!1),r&&"function"==typeof r&&(r=r.call(this,this,t,...i));let a=e(s,this.options);return a&&"function"==typeof a?r=a.call(this,this,t,...i,r):void 0===r&&(r=a),void 0===r?n:r}cn(t){const e=this.options.classes;return e&&e[t]||""}localize(t,e=[]){t=String(t).replace(/\{\{(\w+).?(\w+)?\}\}/g,((t,e,s)=>{let n="";return s?n=this.option(`${e[0]+e.toLowerCase().substring(1)}.l10n.${s}`):e&&(n=this.option(`l10n.${e}`)),n||(n=t),n}));for(let s=0;s<e.length;s++)t=t.split(e[s][0]).join(e[s][1]);return t=t.replace(/\{\{(.*?)\}\}/g,((t,e)=>e))}on(t,e){let s=[];"string"==typeof t?s=t.split(" "):Array.isArray(t)&&(s=t),this.events||(this.events=new Map),s.forEach((t=>{let s=this.events.get(t);s||(this.events.set(t,[]),s=[]),s.includes(e)||s.push(e),this.events.set(t,s)}))}off(t,e){let s=[];"string"==typeof t?s=t.split(" "):Array.isArray(t)&&(s=t),s.forEach((t=>{const s=this.events.get(t);if(Array.isArray(s)){const t=s.indexOf(e);t>-1&&s.splice(t,1)}}))}emit(t,...e){[...this.events.get(t)||[]].forEach((t=>t(this,...e))),"*"!==t&&this.emit("*",t,...e)}}Object.defineProperty(s,"version",{enumerable:!0,configurable:!0,writable:!0,value:"5.0.15"}),Object.defineProperty(s,"defaults",{enumerable:!0,configurable:!0,writable:!0,value:{}});class n extends s{constructor(t,e){super(e),Object.defineProperty(this,"instance",{enumerable:!0,configurable:!0,writable:!0,value:t})}attach(){}detach(){}}class i extends n{constructor(){super(...arguments),Object.defineProperty(this,"container",{enumerable:!0,configurable:!0,writable:!0,value:null}),Object.defineProperty(this,"pins",{enumerable:!0,configurable:!0,writable:!0,value:[]})}onTransform(t){for(const s of this.pins){if(!((e=s)&&null!==e&&e instanceof Element&&"nodeType"in e))continue;const{fitWidth:n,fitHeight:i,fullWidth:r,fullHeight:o}=t.contentRect,a=s.dataset.x||"",c=s.dataset.y||"";let l=0,f=0;l=a.includes("%")?n*(parseFloat(a)/100):parseFloat(a)/r*n,l-=.5*n,f=c.includes("%")?i*(parseFloat(c)/100):parseFloat(c)/o*i,f-=.5*i;const h=new DOMPoint(l,f).matrixTransform(t.getMatrix());s.style.transform=`translate3d(${h.x||0}px, ${h.y||0}px, 0)`}var e}attach(){this.pins=Array.from(this.instance.container.querySelectorAll("[data-panzoom-pin]")),this.pins.length&&(this.instance.container.classList.add("has-pins"),this.instance.on("afterTransform",this.onTransform))}detach(){this.pins=[],this.instance.container.classList.remove("has-pins"),this.instance.off("afterTransform",this.onTransform)}}Object.defineProperty(i,"defaults",{enumerable:!0,configurable:!0,writable:!0,value:{}});export{i as Pins};

dist/panzoom/panzoom.pins.umd.js

@@ -1 +1 @@
-!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e((t="undefined"!=typeof globalThis?globalThis:t||self).window=t.window||{})}(this,(function(t){"use strict";const e=(t,...s)=>{const n=s.length;for(let i=0;i<n;i++){const n=s[i]||{};Object.entries(n).forEach((([s,n])=>{const i=Array.isArray(n)?[]:{};var o;t[s]||Object.assign(t,{[s]:i}),"object"==typeof(o=n)&&null!==o&&o.constructor===Object&&"[object Object]"===Object.prototype.toString.call(o)?Object.assign(t[s],e(i,n)):Array.isArray(n)?Object.assign(t,{[s]:[...n]}):Object.assign(t,{[s]:n})}))}return t},s=function(t,e){return t.split(".").reduce(((t,e)=>"object"==typeof t?t[e]:void 0),e)};class n{constructor(t={}){Object.defineProperty(this,"options",{enumerable:!0,configurable:!0,writable:!0,value:t}),Object.defineProperty(this,"events",{enumerable:!0,configurable:!0,writable:!0,value:new Map}),this.setOptions(t);for(const t of Object.getOwnPropertyNames(Object.getPrototypeOf(this)))t.startsWith("on")&&"function"==typeof this[t]&&(this[t]=this[t].bind(this))}setOptions(t){this.options=t?e({},this.constructor.defaults,t):{};for(const[t,e]of Object.entries(this.option("on")||{}))this.on(t,e)}option(t,...e){let n=s(t,this.options);return n&&"function"==typeof n&&(n=n.call(this,this,...e)),n}optionFor(t,e,n,...i){let o=s(e,t);var r;"string"!=typeof(r=o)||isNaN(r)||isNaN(parseFloat(r))||(o=parseFloat(o)),"true"===o&&(o=!0),"false"===o&&(o=!1),o&&"function"==typeof o&&(o=o.call(this,this,t,...i));let a=s(e,this.options);return a&&"function"==typeof a?o=a.call(this,this,t,...i,o):void 0===o&&(o=a),void 0===o?n:o}cn(t){const e=this.options.classes;return e&&e[t]||""}localize(t,e=[]){t=String(t).replace(/\{\{(\w+).?(\w+)?\}\}/g,((t,e,s)=>{let n="";return s?n=this.option(`${e[0]+e.toLowerCase().substring(1)}.l10n.${s}`):e&&(n=this.option(`l10n.${e}`)),n||(n=t),n}));for(let s=0;s<e.length;s++)t=t.split(e[s][0]).join(e[s][1]);return t=t.replace(/\{\{(.*?)\}\}/g,((t,e)=>e))}on(t,e){let s=[];"string"==typeof t?s=t.split(" "):Array.isArray(t)&&(s=t),this.events||(this.events=new Map),s.forEach((t=>{let s=this.events.get(t);s||(this.events.set(t,[]),s=[]),s.includes(e)||s.push(e),this.events.set(t,s)}))}off(t,e){let s=[];"string"==typeof t?s=t.split(" "):Array.isArray(t)&&(s=t),s.forEach((t=>{const s=this.events.get(t);if(Array.isArray(s)){const t=s.indexOf(e);t>-1&&s.splice(t,1)}}))}emit(t,...e){[...this.events.get(t)||[]].forEach((t=>t(this,...e))),"*"!==t&&this.emit("*",t,...e)}}Object.defineProperty(n,"version",{enumerable:!0,configurable:!0,writable:!0,value:"5.0.14"}),Object.defineProperty(n,"defaults",{enumerable:!0,configurable:!0,writable:!0,value:{}});class i extends n{constructor(t,e){super(e),Object.defineProperty(this,"instance",{enumerable:!0,configurable:!0,writable:!0,value:t})}attach(){}detach(){}}class o extends i{constructor(){super(...arguments),Object.defineProperty(this,"container",{enumerable:!0,configurable:!0,writable:!0,value:null}),Object.defineProperty(this,"pins",{enumerable:!0,configurable:!0,writable:!0,value:[]})}onTransform(t){for(const s of this.pins){if(!((e=s)&&null!==e&&e instanceof Element&&"nodeType"in e))continue;const{fitWidth:n,fitHeight:i,fullWidth:o,fullHeight:r}=t.contentRect,a=s.dataset.x||"",l=s.dataset.y||"";let c=0,f=0;c=a.includes("%")?n*(parseFloat(a)/100):parseFloat(a)/o*n,c-=.5*n,f=l.includes("%")?i*(parseFloat(l)/100):parseFloat(l)/r*i,f-=.5*i;const p=new DOMPoint(c,f).matrixTransform(t.getMatrix());s.style.transform=`translate3d(${p.x||0}px, ${p.y||0}px, 0)`}var e}attach(){this.pins=Array.from(this.instance.container.querySelectorAll("[data-panzoom-pin]")),this.pins.length&&(this.instance.container.classList.add("has-pins"),this.instance.on("afterTransform",this.onTransform))}detach(){this.pins=[],this.instance.container.classList.remove("has-pins"),this.instance.off("afterTransform",this.onTransform)}}Object.defineProperty(o,"defaults",{enumerable:!0,configurable:!0,writable:!0,value:{}}),t.Pins=o}));
+!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e((t="undefined"!=typeof globalThis?globalThis:t||self).window=t.window||{})}(this,(function(t){"use strict";const e=(t,...s)=>{const n=s.length;for(let i=0;i<n;i++){const n=s[i]||{};Object.entries(n).forEach((([s,n])=>{const i=Array.isArray(n)?[]:{};var o;t[s]||Object.assign(t,{[s]:i}),"object"==typeof(o=n)&&null!==o&&o.constructor===Object&&"[object Object]"===Object.prototype.toString.call(o)?Object.assign(t[s],e(i,n)):Array.isArray(n)?Object.assign(t,{[s]:[...n]}):Object.assign(t,{[s]:n})}))}return t},s=function(t,e){return t.split(".").reduce(((t,e)=>"object"==typeof t?t[e]:void 0),e)};class n{constructor(t={}){Object.defineProperty(this,"options",{enumerable:!0,configurable:!0,writable:!0,value:t}),Object.defineProperty(this,"events",{enumerable:!0,configurable:!0,writable:!0,value:new Map}),this.setOptions(t);for(const t of Object.getOwnPropertyNames(Object.getPrototypeOf(this)))t.startsWith("on")&&"function"==typeof this[t]&&(this[t]=this[t].bind(this))}setOptions(t){this.options=t?e({},this.constructor.defaults,t):{};for(const[t,e]of Object.entries(this.option("on")||{}))this.on(t,e)}option(t,...e){let n=s(t,this.options);return n&&"function"==typeof n&&(n=n.call(this,this,...e)),n}optionFor(t,e,n,...i){let o=s(e,t);var r;"string"!=typeof(r=o)||isNaN(r)||isNaN(parseFloat(r))||(o=parseFloat(o)),"true"===o&&(o=!0),"false"===o&&(o=!1),o&&"function"==typeof o&&(o=o.call(this,this,t,...i));let a=s(e,this.options);return a&&"function"==typeof a?o=a.call(this,this,t,...i,o):void 0===o&&(o=a),void 0===o?n:o}cn(t){const e=this.options.classes;return e&&e[t]||""}localize(t,e=[]){t=String(t).replace(/\{\{(\w+).?(\w+)?\}\}/g,((t,e,s)=>{let n="";return s?n=this.option(`${e[0]+e.toLowerCase().substring(1)}.l10n.${s}`):e&&(n=this.option(`l10n.${e}`)),n||(n=t),n}));for(let s=0;s<e.length;s++)t=t.split(e[s][0]).join(e[s][1]);return t=t.replace(/\{\{(.*?)\}\}/g,((t,e)=>e))}on(t,e){let s=[];"string"==typeof t?s=t.split(" "):Array.isArray(t)&&(s=t),this.events||(this.events=new Map),s.forEach((t=>{let s=this.events.get(t);s||(this.events.set(t,[]),s=[]),s.includes(e)||s.push(e),this.events.set(t,s)}))}off(t,e){let s=[];"string"==typeof t?s=t.split(" "):Array.isArray(t)&&(s=t),s.forEach((t=>{const s=this.events.get(t);if(Array.isArray(s)){const t=s.indexOf(e);t>-1&&s.splice(t,1)}}))}emit(t,...e){[...this.events.get(t)||[]].forEach((t=>t(this,...e))),"*"!==t&&this.emit("*",t,...e)}}Object.defineProperty(n,"version",{enumerable:!0,configurable:!0,writable:!0,value:"5.0.15"}),Object.defineProperty(n,"defaults",{enumerable:!0,configurable:!0,writable:!0,value:{}});class i extends n{constructor(t,e){super(e),Object.defineProperty(this,"instance",{enumerable:!0,configurable:!0,writable:!0,value:t})}attach(){}detach(){}}class o extends i{constructor(){super(...arguments),Object.defineProperty(this,"container",{enumerable:!0,configurable:!0,writable:!0,value:null}),Object.defineProperty(this,"pins",{enumerable:!0,configurable:!0,writable:!0,value:[]})}onTransform(t){for(const s of this.pins){if(!((e=s)&&null!==e&&e instanceof Element&&"nodeType"in e))continue;const{fitWidth:n,fitHeight:i,fullWidth:o,fullHeight:r}=t.contentRect,a=s.dataset.x||"",l=s.dataset.y||"";let c=0,f=0;c=a.includes("%")?n*(parseFloat(a)/100):parseFloat(a)/o*n,c-=.5*n,f=l.includes("%")?i*(parseFloat(l)/100):parseFloat(l)/r*i,f-=.5*i;const p=new DOMPoint(c,f).matrixTransform(t.getMatrix());s.style.transform=`translate3d(${p.x||0}px, ${p.y||0}px, 0)`}var e}attach(){this.pins=Array.from(this.instance.container.querySelectorAll("[data-panzoom-pin]")),this.pins.length&&(this.instance.container.classList.add("has-pins"),this.instance.on("afterTransform",this.onTransform))}detach(){this.pins=[],this.instance.container.classList.remove("has-pins"),this.instance.off("afterTransform",this.onTransform)}}Object.defineProperty(o,"defaults",{enumerable:!0,configurable:!0,writable:!0,value:{}}),t.Pins=o}));

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fancyapps/ui",
-  "version": "5.0.14",
+  "version": "5.0.15",
   "description": "Robust JavaScript UI Component Library",
   "files": [
     "dist",

types/Carousel/Carousel.d.ts

@@ -1,180 +1,180 @@
-import { Component } from "../shared/Base/Component";
-import { Panzoom } from "../Panzoom/Panzoom";
-import { PluginsType, CarouselEventsType, slideType, pageType, userSlideType } from "./types";
-import { OptionsType } from "./options";
-import { States } from "./consts";
-export declare class Carousel extends Component<OptionsType, CarouselEventsType> {
-    static Panzoom: typeof Panzoom;
-    static defaults: Partial<OptionsType>;
-    static Plugins: PluginsType;
-    private userOptions;
-    private userPlugins;
-    private bp;
-    private lp;
-    private get axis();
-    /**
-     * Current state of the instance
-     */
-    state: States;
-    /**
-     * Index of the currently selected page
-     */
-    page: number;
-    /**
-     * Index of the previously selected page
-     */
-    prevPage: number | null;
-    /**
-     * Reference to the container element
-     */
-    container: HTMLElement;
-    /**
-     * Reference to the viewport element
-     */
-    viewport: HTMLElement | null;
-    /**
-     * Reference to the track element
-     */
-    track: HTMLElement | null;
-    /**
-     * An array containing objects associated with the carousel slides
-     */
-    slides: Array<slideType>;
-    /**
-     * An array containing objects associated with the carousel pages
-     */
-    pages: Array<pageType>;
-    /**
-     * Reference to the Panzoom instance
-     */
-    panzoom: Panzoom | null;
-    /**
-     * A collection of indexes for slides that are currently being animated using CSS animation
-     */
-    inTransition: Set<number>;
-    /**
-     * Total slide width or slide height for a vertical carousel
-     */
-    contentDim: number;
-    /**
-     * Viewport width for a horizontal or height for a vertical carousel
-     */
-    viewportDim: number;
-    /**
-     * True if the carousel is currently enabled
-     */
-    get isEnabled(): boolean;
-    /**
-     * True if the carousel can navigate infinitely
-     */
-    get isInfinite(): boolean;
-    /**
-     * True if the carousel is in RTL mode
-     */
-    get isRTL(): boolean;
-    /**
-     * True if the carousel is horizontal
-     */
-    get isHorizontal(): boolean;
-    constructor(element: HTMLElement | string | null, userOptions?: Partial<OptionsType>, userPlugins?: PluginsType);
-    private processOptions;
-    private init;
-    private initLayout;
-    private initSlides;
-    private setInitialPage;
-    private setInitialPosition;
-    private initPanzoom;
-    private attachEvents;
-    private createPages;
-    private processPages;
-    private getPageFromIndex;
-    private getSlideMetrics;
-    private getBounds;
-    private repositionSlides;
-    private createSlideEl;
-    private removeSlideEl;
-    private transitionTo;
-    private manageSlideVisiblity;
-    private markSelectedSlides;
-    private flipInfiniteTrack;
-    private lazyLoadSlide;
-    private onAnimationEnd;
-    private onDecel;
-    private onClick;
-    private onSlideTo;
-    private onChange;
-    private onRefresh;
-    private onResize;
-    private onBeforeTransform;
-    private onEndAnimation;
-    /**
-     * Reset carousel after initializing it, this method allows to replace options and plugins
-     */
-    reInit(userOptions?: Partial<OptionsType> | null, userPlugins?: PluginsType | null): void;
-    /**
-     * Slide to page by its index with optional parameters
-     */
-    slideTo(pageIndex?: number | string, { friction, transition, }?: {
-        friction?: number;
-        transition?: string | false;
-    }): void;
-    /**
-     * Re-center carousel
-     */
-    slideToClosest(opts: any): void;
-    /**
-     * Slide to the next page
-     */
-    slideNext(): void;
-    /**
-     * Slide to the previous page
-     */
-    slidePrev(): void;
-    /**
-     * Stop transition effect
-     */
-    clearTransitions(): void;
-    /**
-     * Create slide(s) and prepend to the beginning of the carousel
-     */
-    prependSlide(what: userSlideType | Array<userSlideType>): void;
-    /**
-     * Create slide(s) and add to the end of the carousel
-     */
-    appendSlide(what: userSlideType | Array<userSlideType>): void;
-    /**
-     * Remove slide and DOM elements from the carousel
-     */
-    removeSlide(index: number): void;
-    /**
-     * Forces to recalculate elements metrics
-     */
-    updateMetrics(): void;
-    /**
-     * Get the progress of the active or selected page relative to the "center"
-     */
-    getProgress(index?: number, raw?: boolean): number;
-    /**
-     * Set the height of the viewport to match the maximum height of the slides on the current page
-     */
-    setViewportHeight(): void;
-    /**
-     * Return the index of the page containing the slide
-     */
-    getPageForSlide(index: number): number;
-    /**
-     * Return all slides that are at least partially visible
-     */
-    getVisibleSlides(multiplier?: number): Set<slideType>;
-    /**
-     * Get the page index for a given Panzoom position
-     */
-    getPageFromPosition(pos: number): {
-        pageIndex: number;
-        page: number;
-    };
-    /**
-     * Destroy the instance
-     */
-    destroy(): void;
-}
+import { Component } from "../shared/Base/Component";
+import { Panzoom } from "../Panzoom/Panzoom";
+import { PluginsType, CarouselEventsType, slideType, pageType, userSlideType } from "./types";
+import { OptionsType } from "./options";
+import { States } from "./consts";
+export declare class Carousel extends Component<OptionsType, CarouselEventsType> {
+    static Panzoom: typeof Panzoom;
+    static defaults: Partial<OptionsType>;
+    static Plugins: PluginsType;
+    private userOptions;
+    private userPlugins;
+    private bp;
+    private lp;
+    private get axis();
+    /**
+     * Current state of the instance
+     */
+    state: States;
+    /**
+     * Index of the currently selected page
+     */
+    page: number;
+    /**
+     * Index of the previously selected page
+     */
+    prevPage: number | null;
+    /**
+     * Reference to the container element
+     */
+    container: HTMLElement;
+    /**
+     * Reference to the viewport element
+     */
+    viewport: HTMLElement | null;
+    /**
+     * Reference to the track element
+     */
+    track: HTMLElement | null;
+    /**
+     * An array containing objects associated with the carousel slides
+     */
+    slides: Array<slideType>;
+    /**
+     * An array containing objects associated with the carousel pages
+     */
+    pages: Array<pageType>;
+    /**
+     * Reference to the Panzoom instance
+     */
+    panzoom: Panzoom | null;
+    /**
+     * A collection of indexes for slides that are currently being animated using CSS animation
+     */
+    inTransition: Set<number>;
+    /**
+     * Total slide width or slide height for a vertical carousel
+     */
+    contentDim: number;
+    /**
+     * Viewport width for a horizontal or height for a vertical carousel
+     */
+    viewportDim: number;
+    /**
+     * True if the carousel is currently enabled
+     */
+    get isEnabled(): boolean;
+    /**
+     * True if the carousel can navigate infinitely
+     */
+    get isInfinite(): boolean;
+    /**
+     * True if the carousel is in RTL mode
+     */
+    get isRTL(): boolean;
+    /**
+     * True if the carousel is horizontal
+     */
+    get isHorizontal(): boolean;
+    constructor(element: HTMLElement | string | null, userOptions?: Partial<OptionsType>, userPlugins?: PluginsType);
+    private processOptions;
+    private init;
+    private initLayout;
+    private initSlides;
+    private setInitialPage;
+    private setInitialPosition;
+    private initPanzoom;
+    private attachEvents;
+    private createPages;
+    private processPages;
+    private getPageFromIndex;
+    private getSlideMetrics;
+    private getBounds;
+    private repositionSlides;
+    private createSlideEl;
+    private removeSlideEl;
+    private transitionTo;
+    private manageSlideVisiblity;
+    private markSelectedSlides;
+    private flipInfiniteTrack;
+    private lazyLoadSlide;
+    private onAnimationEnd;
+    private onDecel;
+    private onClick;
+    private onSlideTo;
+    private onChange;
+    private onRefresh;
+    private onResize;
+    private onBeforeTransform;
+    private onEndAnimation;
+    /**
+     * Reset carousel after initializing it, this method allows to replace options and plugins
+     */
+    reInit(userOptions?: Partial<OptionsType> | null, userPlugins?: PluginsType | null): void;
+    /**
+     * Slide to page by its index with optional parameters
+     */
+    slideTo(pageIndex?: number | string, { friction, transition, }?: {
+        friction?: number;
+        transition?: string | false;
+    }): void;
+    /**
+     * Re-center carousel
+     */
+    slideToClosest(opts: any): void;
+    /**
+     * Slide to the next page
+     */
+    slideNext(): void;
+    /**
+     * Slide to the previous page
+     */
+    slidePrev(): void;
+    /**
+     * Stop transition effect
+     */
+    clearTransitions(): void;
+    /**
+     * Create slide(s) and prepend to the beginning of the carousel
+     */
+    prependSlide(what: userSlideType | Array<userSlideType>): void;
+    /**
+     * Create slide(s) and add to the end of the carousel
+     */
+    appendSlide(what: userSlideType | Array<userSlideType>): void;
+    /**
+     * Remove slide and DOM elements from the carousel
+     */
+    removeSlide(index: number): void;
+    /**
+     * Forces to recalculate elements metrics
+     */
+    updateMetrics(): void;
+    /**
+     * Get the progress of the active or selected page relative to the "center"
+     */
+    getProgress(index?: number, raw?: boolean): number;
+    /**
+     * Set the height of the viewport to match the maximum height of the slides on the current page
+     */
+    setViewportHeight(): void;
+    /**
+     * Return the index of the page containing the slide
+     */
+    getPageForSlide(index: number): number;
+    /**
+     * Return all slides that are at least partially visible
+     */
+    getVisibleSlides(multiplier?: number): Set<slideType>;
+    /**
+     * Get the page index for a given Panzoom position
+     */
+    getPageFromPosition(pos: number): {
+        pageIndex: number;
+        page: number;
+    };
+    /**
+     * Destroy the instance
+     */
+    destroy(): void;
+}

types/Carousel/consts.d.ts

@@ -1,8 +1,8 @@
-export declare enum States {
-    Init = 0,
-    Ready = 1,
-    Destroy = 2
-}
-import { userSlideType, slideType, pageType } from "./types";
-export declare const createSlide: (params: userSlideType) => slideType;
-export declare const createPage: (parameter?: Partial<pageType>) => pageType;
+export declare enum States {
+    Init = 0,
+    Ready = 1,
+    Destroy = 2
+}
+import { userSlideType, slideType, pageType } from "./types";
+export declare const createSlide: (params: userSlideType) => slideType;
+export declare const createPage: (parameter?: Partial<pageType>) => pageType;

types/Carousel/options.d.ts

@@ -1,113 +1,113 @@
-import { OptionsType as PanzoomOptionsType } from "../Panzoom/options";
-import { userSlideType, Events } from "./types";
-export interface PluginsOptionsType {
-}
-export interface classesType {
-    container: string;
-    viewport: string;
-    track: string;
-    slide: string;
-    isLTR: string;
-    isRTL: string;
-    isHorizontal: string;
-    isVertical: string;
-    inTransition: string;
-    isSelected: string;
-}
-export interface ComponentOptionsType {
-    /**
-     * Specify the viewport element
-     */
-    viewport: HTMLElement | null | ((any?: any) => HTMLElement | null);
-    /**
-     * Specify the track element
-     */
-    track: HTMLElement | null | ((any?: any) => HTMLElement | null);
-    /**
-     * Carousel is enabled or not; useful when combining with breakpoints
-     */
-    enabled: boolean;
-    /**
-     * Virtual slides
-     */
-    slides: Array<userSlideType>;
-    /**
-     * Horizontal (`x`) or vertical Carousel (`y`)
-     */
-    axis: "x" | "y" | ((any?: any) => "x" | "y");
-    /**
-     * The name of the transition animation when changing Carousel pages
-     */
-    transition: "crossfade" | "fade" | "slide" | "classic" | string | false;
-    /**
-     * Number of pages to preload before/after the active page
-     */
-    preload: number;
-    /**
-     * The number of slides to group per page
-     */
-    slidesPerPage: number | "auto";
-    /**
-     * Index of initial page
-     */
-    initialPage: number;
-    /**
-     * Index of initial slide
-     */
-    initialSlide?: number;
-    /**
-     * Panzoom friction while changing page
-     */
-    friction: number | ((any?: any) => number);
-    /**
-     * If true, the Carousel will center the active page
-     */
-    center: boolean | ((any?: any) => boolean);
-    /**
-     * If true, the Carousel will scroll infinitely
-     */
-    infinite: boolean | ((any?: any) => boolean);
-    /**
-     * If true, the Carousel will fill the free space if `infinite: false`
-     */
-    fill: boolean;
-    /**
-     * If true, the Carousel will settle at any position after a swipe
-     */
-    dragFree: boolean;
-    /**
-     * If true, the Carousel will adjust its height to the height of the currently active slide(s)
-     */
-    adaptiveHeight: boolean;
-    /**
-     * Change direction of Carousel
-     */
-    direction: "ltr" | "rtl" | ((any?: any) => "ltr" | "rtl");
-    /**
-     * Custom options for the Panzoom instance
-     */
-    Panzoom?: Partial<PanzoomOptionsType>;
-    /**
-     * Class names for DOM elements
-     */
-    classes: Partial<classesType>;
-    /**
-     * Options that will be applied for the given breakpoint, overriding the base options
-     */
-    breakpoints?: Record<string, Omit<Partial<OptionsType>, "breakpoints">>;
-    /**
-     * Localization of strings
-     */
-    l10n: Record<string, string>;
-    /**
-     * Optional event listeners
-     */
-    on?: Partial<Events>;
-    Autoplay?: any;
-    Dots?: any;
-    Navigation?: any;
-    Sync?: any;
-    Thumbs?: any;
-}
-export declare const defaultOptions: ComponentOptionsType;
-export type OptionsType = PluginsOptionsType & ComponentOptionsType;
+import { OptionsType as PanzoomOptionsType } from "../Panzoom/options";
+import { userSlideType, Events } from "./types";
+export interface PluginsOptionsType {
+}
+export interface classesType {
+    container: string;
+    viewport: string;
+    track: string;
+    slide: string;
+    isLTR: string;
+    isRTL: string;
+    isHorizontal: string;
+    isVertical: string;
+    inTransition: string;
+    isSelected: string;
+}
+export interface ComponentOptionsType {
+    /**
+     * Specify the viewport element
+     */
+    viewport: HTMLElement | null | ((any?: any) => HTMLElement | null);
+    /**
+     * Specify the track element
+     */
+    track: HTMLElement | null | ((any?: any) => HTMLElement | null);
+    /**
+     * Carousel is enabled or not; useful when combining with breakpoints
+     */
+    enabled: boolean;
+    /**
+     * Virtual slides
+     */
+    slides: Array<userSlideType>;
+    /**
+     * Horizontal (`x`) or vertical Carousel (`y`)
+     */
+    axis: "x" | "y" | ((any?: any) => "x" | "y");
+    /**
+     * The name of the transition animation when changing Carousel pages
+     */
+    transition: "crossfade" | "fade" | "slide" | "classic" | string | false;
+    /**
+     * Number of pages to preload before/after the active page
+     */
+    preload: number;
+    /**
+     * The number of slides to group per page
+     */
+    slidesPerPage: number | "auto";
+    /**
+     * Index of initial page
+     */
+    initialPage: number;
+    /**
+     * Index of initial slide
+     */
+    initialSlide?: number;
+    /**
+     * Panzoom friction while changing page
+     */
+    friction: number | ((any?: any) => number);
+    /**
+     * If true, the Carousel will center the active page
+     */
+    center: boolean | ((any?: any) => boolean);
+    /**
+     * If true, the Carousel will scroll infinitely
+     */
+    infinite: boolean | ((any?: any) => boolean);
+    /**
+     * If true, the Carousel will fill the free space if `infinite: false`
+     */
+    fill: boolean;
+    /**
+     * If true, the Carousel will settle at any position after a swipe
+     */
+    dragFree: boolean;
+    /**
+     * If true, the Carousel will adjust its height to the height of the currently active slide(s)
+     */
+    adaptiveHeight: boolean;
+    /**
+     * Change direction of Carousel
+     */
+    direction: "ltr" | "rtl" | ((any?: any) => "ltr" | "rtl");
+    /**
+     * Custom options for the Panzoom instance
+     */
+    Panzoom?: Partial<PanzoomOptionsType>;
+    /**
+     * Class names for DOM elements
+     */
+    classes: Partial<classesType>;
+    /**
+     * Options that will be applied for the given breakpoint, overriding the base options
+     */
+    breakpoints?: Record<string, Omit<Partial<OptionsType>, "breakpoints">>;
+    /**
+     * Localization of strings
+     */
+    l10n: Record<string, string>;
+    /**
+     * Optional event listeners
+     */
+    on?: Partial<Events>;
+    Autoplay?: any;
+    Dots?: any;
+    Navigation?: any;
+    Sync?: any;
+    Thumbs?: any;
+}
+export declare const defaultOptions: ComponentOptionsType;
+export type OptionsType = PluginsOptionsType & ComponentOptionsType;

types/Carousel/plugins/Autoplay/Autoplay.d.ts

@@ -1,62 +1,62 @@
-import { Plugin } from "../../../shared/Base/Plugin";
-import { Carousel } from "../../Carousel";
-type AutoplayEventsType = "set" | "pause" | "resume" | "stop";
-type AutoplayEvents = Record<AutoplayEventsType, (...args: any[]) => void>;
-export type AutoplayOptionsType = {
-    /**
-     * If autoplay should start automatically after initialization
-     */
-    autoStart: boolean;
-    /**
-     * Optional event listeners
-     */
-    on?: Partial<AutoplayEvents>;
-    /**
-     * If autoplay should pause when the user hovers over the container
-     */
-    pauseOnHover: boolean;
-    /**
-     * Change where progress bar is appended
-     */
-    progressParentEl: HTMLElement | null | (() => HTMLElement | null);
-    /**
-     * If element should be created to display the autoplay progress
-     */
-    showProgress: boolean;
-    /**
-     * Delay (in milliseconds) before the slide change
-     */
-    timeout: number;
-};
-declare module "../../../Carousel/options" {
-    interface PluginsOptionsType {
-        Autoplay: Boolean | Partial<AutoplayOptionsType>;
-    }
-}
-export declare class Autoplay extends Plugin<Carousel, AutoplayOptionsType, AutoplayEventsType> {
-    static defaults: AutoplayOptionsType;
-    private state;
-    private inHover;
-    private timer;
-    private progressBar;
-    get isActive(): boolean;
-    private onReady;
-    private onChange;
-    private onSettle;
-    private onVisibilityChange;
-    private onMouseEnter;
-    private onMouseLeave;
-    private onTimerEnd;
-    private removeProgressBar;
-    private createProgressBar;
-    private set;
-    private clear;
-    start(): void;
-    stop(): void;
-    pause(): void;
-    resume(): void;
-    toggle(): void;
-    attach(): void;
-    detach(): void;
-}
-export {};
+import { Plugin } from "../../../shared/Base/Plugin";
+import { Carousel } from "../../Carousel";
+type AutoplayEventsType = "set" | "pause" | "resume" | "stop";
+type AutoplayEvents = Record<AutoplayEventsType, (...args: any[]) => void>;
+export type AutoplayOptionsType = {
+    /**
+     * If autoplay should start automatically after initialization
+     */
+    autoStart: boolean;
+    /**
+     * Optional event listeners
+     */
+    on?: Partial<AutoplayEvents>;
+    /**
+     * If autoplay should pause when the user hovers over the container
+     */
+    pauseOnHover: boolean;
+    /**
+     * Change where progress bar is appended
+     */
+    progressParentEl: HTMLElement | null | (() => HTMLElement | null);
+    /**
+     * If element should be created to display the autoplay progress
+     */
+    showProgress: boolean;
+    /**
+     * Delay (in milliseconds) before the slide change
+     */
+    timeout: number;
+};
+declare module "../../../Carousel/options" {
+    interface PluginsOptionsType {
+        Autoplay: Boolean | Partial<AutoplayOptionsType>;
+    }
+}
+export declare class Autoplay extends Plugin<Carousel, AutoplayOptionsType, AutoplayEventsType> {
+    static defaults: AutoplayOptionsType;
+    private state;
+    private inHover;
+    private timer;
+    private progressBar;
+    get isActive(): boolean;
+    private onReady;
+    private onChange;
+    private onSettle;
+    private onVisibilityChange;
+    private onMouseEnter;
+    private onMouseLeave;
+    private onTimerEnd;
+    private removeProgressBar;
+    private createProgressBar;
+    private set;
+    private clear;
+    start(): void;
+    stop(): void;
+    pause(): void;
+    resume(): void;
+    toggle(): void;
+    attach(): void;
+    detach(): void;
+}
+export {};

types/Carousel/plugins/Dots/Dots.d.ts

@@ -1,44 +1,44 @@
-import { Plugin } from "../../../shared/Base/Plugin";
-import { Carousel } from "../../Carousel";
-export type DotsOptionsType = {
-    classes: {
-        list: string;
-        dot: string;
-        isDynamic: string;
-        hasDots: string;
-        isBeforePrev: string;
-        isPrev: string;
-        isCurrent: string;
-        isNext: string;
-        isAfterNext: string;
-    };
-    dotTpl: string;
-    dynamicFrom: number | false;
-    maxCount: number;
-    minCount: number;
-};
-declare module "../../../Carousel/options" {
-    interface PluginsOptionsType {
-        Dots?: Boolean | Partial<DotsOptionsType>;
-    }
-}
-type DotsEventsType = "";
-export declare class Dots extends Plugin<Carousel, DotsOptionsType, DotsEventsType> {
-    static defaults: DotsOptionsType;
-    /**
-     * If this instance is currently in "dynamic" mode
-     */
-    isDynamic: boolean;
-    private list;
-    private onRefresh;
-    private build;
-    /**
-     * Refresh the elements to match the current state of the carousel
-     */
-    refresh(): void;
-    private createItem;
-    private cleanup;
-    attach(): void;
-    detach(): void;
-}
-export {};
+import { Plugin } from "../../../shared/Base/Plugin";
+import { Carousel } from "../../Carousel";
+export type DotsOptionsType = {
+    classes: {
+        list: string;
+        dot: string;
+        isDynamic: string;
+        hasDots: string;
+        isBeforePrev: string;
+        isPrev: string;
+        isCurrent: string;
+        isNext: string;
+        isAfterNext: string;
+    };
+    dotTpl: string;
+    dynamicFrom: number | false;
+    maxCount: number;
+    minCount: number;
+};
+declare module "../../../Carousel/options" {
+    interface PluginsOptionsType {
+        Dots?: Boolean | Partial<DotsOptionsType>;
+    }
+}
+type DotsEventsType = "";
+export declare class Dots extends Plugin<Carousel, DotsOptionsType, DotsEventsType> {
+    static defaults: DotsOptionsType;
+    /**
+     * If this instance is currently in "dynamic" mode
+     */
+    isDynamic: boolean;
+    private list;
+    private onRefresh;
+    private build;
+    /**
+     * Refresh the elements to match the current state of the carousel
+     */
+    refresh(): void;
+    private createItem;
+    private cleanup;
+    attach(): void;
+    detach(): void;
+}
+export {};

types/Carousel/plugins/Navigation/Navigation.d.ts

@@ -1,40 +1,40 @@
-import { Plugin } from "../../../shared/Base/Plugin";
-import { Carousel } from "../../Carousel";
-export type NavigationOptionsType = {
-    /**
-     * Class names for DOM elements
-     */
-    classes: {
-        container: string;
-        button: string;
-        isNext: string;
-        isPrev: string;
-    };
-    /**
-     * HTML template for left arrow
-     */
-    nextTpl: string;
-    /**
-     * HTML template for right arrow
-     */
-    prevTpl: string;
-};
-declare module "../../../Carousel/options" {
-    interface PluginsOptionsType {
-        Navigation: Boolean | Partial<NavigationOptionsType>;
-    }
-}
-type NavigationEventsType = "";
-export declare class Navigation extends Plugin<Carousel, NavigationOptionsType, NavigationEventsType> {
-    static defaults: NavigationOptionsType;
-    container: HTMLElement | null;
-    prev: HTMLElement | null;
-    next: HTMLElement | null;
-    private onRefresh;
-    private createButton;
-    private build;
-    cleanup(): void;
-    attach(): void;
-    detach(): void;
-}
-export {};
+import { Plugin } from "../../../shared/Base/Plugin";
+import { Carousel } from "../../Carousel";
+export type NavigationOptionsType = {
+    /**
+     * Class names for DOM elements
+     */
+    classes: {
+        container: string;
+        button: string;
+        isNext: string;
+        isPrev: string;
+    };
+    /**
+     * HTML template for left arrow
+     */
+    nextTpl: string;
+    /**
+     * HTML template for right arrow
+     */
+    prevTpl: string;
+};
+declare module "../../../Carousel/options" {
+    interface PluginsOptionsType {
+        Navigation: Boolean | Partial<NavigationOptionsType>;
+    }
+}
+type NavigationEventsType = "";
+export declare class Navigation extends Plugin<Carousel, NavigationOptionsType, NavigationEventsType> {
+    static defaults: NavigationOptionsType;
+    container: HTMLElement | null;
+    prev: HTMLElement | null;
+    next: HTMLElement | null;
+    private onRefresh;
+    private createButton;
+    private build;
+    cleanup(): void;
+    attach(): void;
+    detach(): void;
+}
+export {};

types/Carousel/plugins/Sync/Sync.d.ts

@@ -1,44 +1,44 @@
-import { Plugin } from "../../../shared/Base/Plugin";
-import { Carousel } from "../../Carousel";
-export type SyncOptionsType = {
-    /**
-     * Target carousel sliding animation friction (after clicking navigation carousel slide)
-     */
-    friction: number;
-    /**
-     * An instance of a carousel acting as navigation
-     */
-    nav?: Carousel;
-    /**
-     * An instance of a carousel acting as target
-     */
-    target?: Carousel;
-};
-declare module "../../../Carousel/options" {
-    interface PluginsOptionsType {
-        /**
-         * Sync instance to another and make it act as navigation
-         */
-        Sync?: Boolean | Partial<SyncOptionsType>;
-    }
-}
-type SyncEventsType = "";
-export declare class Sync extends Plugin<Carousel, SyncOptionsType, SyncEventsType> {
-    static defaults: SyncOptionsType;
-    private selectedIndex;
-    private target;
-    private nav;
-    private addAsTargetFor;
-    private addAsNavFor;
-    private attachEvents;
-    private onNavReady;
-    private onTargetReady;
-    private onNavClick;
-    private onNavTouch;
-    private onNavCreateSlide;
-    private onTargetChange;
-    private markSelectedSlide;
-    attach(): void;
-    detach(): void;
-}
-export {};
+import { Plugin } from "../../../shared/Base/Plugin";
+import { Carousel } from "../../Carousel";
+export type SyncOptionsType = {
+    /**
+     * Target carousel sliding animation friction (after clicking navigation carousel slide)
+     */
+    friction: number;
+    /**
+     * An instance of a carousel acting as navigation
+     */
+    nav?: Carousel;
+    /**
+     * An instance of a carousel acting as target
+     */
+    target?: Carousel;
+};
+declare module "../../../Carousel/options" {
+    interface PluginsOptionsType {
+        /**
+         * Sync instance to another and make it act as navigation
+         */
+        Sync?: Boolean | Partial<SyncOptionsType>;
+    }
+}
+type SyncEventsType = "";
+export declare class Sync extends Plugin<Carousel, SyncOptionsType, SyncEventsType> {
+    static defaults: SyncOptionsType;
+    private selectedIndex;
+    private target;
+    private nav;
+    private addAsTargetFor;
+    private addAsNavFor;
+    private attachEvents;
+    private onNavReady;
+    private onTargetReady;
+    private onNavClick;
+    private onNavTouch;
+    private onNavCreateSlide;
+    private onTargetChange;
+    private markSelectedSlide;
+    attach(): void;
+    detach(): void;
+}
+export {};

types/Carousel/plugins/Thumbs/Thumbs.d.ts

@@ -1,98 +1,98 @@
-import { Plugin } from "../../../shared/Base/Plugin";
-import type { Carousel } from "../../Carousel";
-import { OptionsType as CarouselOptionsType } from "../../../Carousel/options";
-export type ThumbsOptionsType = {
-    /**
-     * Customize carousel options
-     */
-    Carousel?: Partial<CarouselOptionsType>;
-    /**
-     * Class names for DOM elements
-     */
-    classes: {
-        container?: string;
-        viewport?: string;
-        track?: string;
-        slide?: string;
-        isResting?: string;
-        isSelected?: string;
-        isLoading?: string;
-        hasThumbs?: string;
-    };
-    /**
-     * Minimum number of slides with thumbnails in the carousel to create Thumbs
-     */
-    minCount: number;
-    /**
-     * Optional event listeners
-     */
-    on?: Record<"ready", (...any: any) => void>;
-    /**
-     * Change where thumbnail container is appended
-     */
-    parentEl?: HTMLElement | null | (() => HTMLElement | null);
-    /**
-     * Template for the thumbnail element
-     */
-    thumbTpl: string;
-    /**
-     * Choose a type - "classic" (syncs two instances of the carousel) or "modern" (Apple Photos style)
-     */
-    type: "classic" | "modern";
-};
-export declare const defaultOptions: ThumbsOptionsType;
-declare module "../../../Carousel/options" {
-    interface PluginsOptionsType {
-        Thumbs: Boolean | Partial<ThumbsOptionsType>;
-    }
-}
-declare module "../../../Carousel/types" {
-    interface slideType {
-        thumbSrc?: string;
-        thumbClipWidth?: number;
-        thumbWidth?: number;
-        thumbHeight?: number;
-        thumbSlideEl?: HTMLElement;
-    }
-}
-export declare enum States {
-    Init = 0,
-    Ready = 1,
-    Hidden = 2,
-    Disabled = 3
-}
-export declare class Thumbs extends Plugin<Carousel, ThumbsOptionsType, "ready"> {
-    static defaults: ThumbsOptionsType;
-    type: "modern" | "classic";
-    container: HTMLElement | null;
-    track: HTMLElement | null;
-    private carousel;
-    private panzoom;
-    private thumbWidth;
-    private thumbClipWidth;
-    private thumbHeight;
-    private thumbGap;
-    private thumbExtraGap;
-    private shouldCenter;
-    state: States;
-    private formatThumb;
-    private getSlides;
-    private onInitSlide;
-    private onInitSlides;
-    private onRefreshM;
-    private onChangeM;
-    private onClickModern;
-    private onTransformM;
-    private buildClassic;
-    private buildModern;
-    private updateModern;
-    private refreshModern;
-    private centerModern;
-    private lazyLoadModern;
-    private resizeModernSlide;
-    private getModernThumbPos;
-    build(): void;
-    cleanup(): void;
-    attach(): void;
-    detach(): void;
-}
+import { Plugin } from "../../../shared/Base/Plugin";
+import type { Carousel } from "../../Carousel";
+import { OptionsType as CarouselOptionsType } from "../../options";
+export type ThumbsOptionsType = {
+    /**
+     * Customize carousel options
+     */
+    Carousel?: Partial<CarouselOptionsType>;
+    /**
+     * Class names for DOM elements
+     */
+    classes: {
+        container?: string;
+        viewport?: string;
+        track?: string;
+        slide?: string;
+        isResting?: string;
+        isSelected?: string;
+        isLoading?: string;
+        hasThumbs?: string;
+    };
+    /**
+     * Minimum number of slides with thumbnails in the carousel to create Thumbs
+     */
+    minCount: number;
+    /**
+     * Optional event listeners
+     */
+    on?: Record<"ready", (...any: any) => void>;
+    /**
+     * Change where thumbnail container is appended
+     */
+    parentEl?: HTMLElement | null | (() => HTMLElement | null);
+    /**
+     * Template for the thumbnail element
+     */
+    thumbTpl: string;
+    /**
+     * Choose a type - "classic" (syncs two instances of the carousel) or "modern" (Apple Photos style)
+     */
+    type: "classic" | "modern";
+};
+export declare const defaultOptions: ThumbsOptionsType;
+declare module "../../../Carousel/options" {
+    interface PluginsOptionsType {
+        Thumbs: Boolean | Partial<ThumbsOptionsType>;
+    }
+}
+declare module "../../../Carousel/types" {
+    interface slideType {
+        thumbSrc?: string;
+        thumbClipWidth?: number;
+        thumbWidth?: number;
+        thumbHeight?: number;
+        thumbSlideEl?: HTMLElement;
+    }
+}
+export declare enum States {
+    Init = 0,
+    Ready = 1,
+    Hidden = 2,
+    Disabled = 3
+}
+export declare class Thumbs extends Plugin<Carousel, ThumbsOptionsType, "ready"> {
+    static defaults: ThumbsOptionsType;
+    type: "modern" | "classic";
+    container: HTMLElement | null;
+    track: HTMLElement | null;
+    private carousel;
+    private panzoom;
+    private thumbWidth;
+    private thumbClipWidth;
+    private thumbHeight;
+    private thumbGap;
+    private thumbExtraGap;
+    private shouldCenter;
+    state: States;
+    private formatThumb;
+    private getSlides;
+    private onInitSlide;
+    private onInitSlides;
+    private onRefreshM;
+    private onChangeM;
+    private onClickModern;
+    private onTransformM;
+    private buildClassic;
+    private buildModern;
+    private updateModern;
+    private refreshModern;
+    private centerModern;
+    private lazyLoadModern;
+    private resizeModernSlide;
+    private getModernThumbPos;
+    build(): void;
+    cleanup(): void;
+    attach(): void;
+    detach(): void;
+}

types/Carousel/plugins/index.d.ts

@@ -1,2 +1,2 @@
-import { PluginsType } from "../types";
-export declare const Plugins: PluginsType;
+import { PluginsType } from "../types";
+export declare const Plugins: PluginsType;

types/Carousel/types.d.ts

@@ -1,86 +1,86 @@
-export interface slideType {
-    html: string;
-    el: HTMLElement | null;
-    isDom: boolean;
-    class: string;
-    index: number;
-    dim: number;
-    gap: number;
-    pos: number;
-    transition: string | false;
-    thumb?: string | HTMLImageElement;
-    thumbSrc?: string;
-    thumbElSrc?: string;
-    thumbEl?: HTMLImageElement;
-}
-import { Constructor } from "../shared/Base/types";
-import { Plugin } from "../shared/Base/Plugin";
-import { Carousel } from "./Carousel";
-export type PluginsType = Record<string, Constructor<Plugin<Carousel, any, any>>>;
-export type userSlideType = String | HTMLElement | Partial<slideType>;
-export type pageType = {
-    index: number;
-    slides: Array<slideType>;
-    dim: number;
-    pos: number;
-};
-import { ComponentEventsType } from "../shared/Base/types";
-import { EventsType as PanzoomEventsType } from "../Panzoom/types";
-export type CarouselEventsType = ComponentEventsType
-/**
- * Initialization has started, plugins have been added
- */
- | "init"
-/**
- * The layout is initialized
- */
- | "initLayout"
-/**
- * A slide object is created
- */
- | "initSlide"
-/**
- * All slides have objects created
- */
- | "initSlides"
-/**
- * A corresponding DOM element is created for the slide
- */
- | "createSlide"
-/**
- * The element corresponding to the slide is removed from the DOM
- */
- | "removeSlide"
-/**
- * Slide is marked as being on the active page
- */
- | "selectSlide"
-/**
- * Slide is no longer on the active page
- */
- | "unselectSlide"
-/**
- * Initialization has been completed
- */
- | "ready"
-/**
- * Carousel metrics have been updated
- */
- | "refresh"
-/**
- * The active page of the carousel is changed
- */
- | "change"
-/**
- * Single click event has been detected
- */
- | "click"
-/**
- * The image is lazy loaded
- */
- | "load"
-/**
- * The slide change animation has finished
- */
- | "settle" | `Panzoom.${PanzoomEventsType}`;
-export type Events = Record<CarouselEventsType, (...args: any[]) => void>;
+export interface slideType {
+    html: string;
+    el: HTMLElement | null;
+    isDom: boolean;
+    class: string;
+    index: number;
+    dim: number;
+    gap: number;
+    pos: number;
+    transition: string | false;
+    thumb?: string | HTMLImageElement;
+    thumbSrc?: string;
+    thumbElSrc?: string;
+    thumbEl?: HTMLImageElement;
+}
+import { Constructor } from "../shared/Base/types";
+import { Plugin } from "../shared/Base/Plugin";
+import { Carousel } from "./Carousel";
+export type PluginsType = Record<string, Constructor<Plugin<Carousel, any, any>>>;
+export type userSlideType = String | HTMLElement | Partial<slideType>;
+export type pageType = {
+    index: number;
+    slides: Array<slideType>;
+    dim: number;
+    pos: number;
+};
+import { ComponentEventsType } from "../shared/Base/types";
+import { EventsType as PanzoomEventsType } from "../Panzoom/types";
+export type CarouselEventsType = ComponentEventsType
+/**
+ * Initialization has started, plugins have been added
+ */
+ | "init"
+/**
+ * The layout is initialized
+ */
+ | "initLayout"
+/**
+ * A slide object is created
+ */
+ | "initSlide"
+/**
+ * All slides have objects created
+ */
+ | "initSlides"
+/**
+ * A corresponding DOM element is created for the slide
+ */
+ | "createSlide"
+/**
+ * The element corresponding to the slide is removed from the DOM
+ */
+ | "removeSlide"
+/**
+ * Slide is marked as being on the active page
+ */
+ | "selectSlide"
+/**
+ * Slide is no longer on the active page
+ */
+ | "unselectSlide"
+/**
+ * Initialization has been completed
+ */
+ | "ready"
+/**
+ * Carousel metrics have been updated
+ */
+ | "refresh"
+/**
+ * The active page of the carousel is changed
+ */
+ | "change"
+/**
+ * Single click event has been detected
+ */
+ | "click"
+/**
+ * The image is lazy loaded
+ */
+ | "load"
+/**
+ * The slide change animation has finished
+ */
+ | "settle" | `Panzoom.${PanzoomEventsType}`;
+export type Events = Record<CarouselEventsType, (...args: any[]) => void>;

types/Fancybox/Fancybox.d.ts

@@ -1,215 +1,229 @@
-import { OptionsType } from "./options";
-import { EventsType, PluginsType } from "./types";
-import { States, SlideStates } from "./consts";
-import { Component } from "../shared/Base/Component";
-import { Carousel } from "../Carousel/Carousel";
-import { slideType, userSlideType } from "../Carousel/types";
-declare module "../Carousel/types" {
-    interface slideType {
-        src?: string | HTMLElement;
-        width?: number | "auto";
-        height?: number | "auto";
-        id?: string;
-        display?: string;
-        error?: string;
-        filter?: string;
-        caption?: string;
-        downloadSrc?: string;
-        downloadFilename?: string;
-        contentEl?: HTMLElement;
-        captionEl?: HTMLElement;
-        spinnerEl?: HTMLElement;
-        closeBtnEl?: HTMLElement;
-        triggerEl?: HTMLElement;
-        thumbEl?: HTMLImageElement;
-        thumbElSrc?: string;
-        poster?: string;
-        state?: SlideStates;
-    }
-}
-export declare class Fancybox extends Component<OptionsType, EventsType> {
-    static version: string;
-    static defaults: Partial<OptionsType>;
-    static Plugins: PluginsType;
-    static openers: Map<HTMLElement, Map<string, Partial<OptionsType>>>;
-    private userSlides;
-    private userPlugins;
-    private idle;
-    private idleTimer;
-    private clickTimer;
-    private pwt;
-    private ignoreFocusChange;
-    state: States;
-    id: number | string;
-    container: HTMLElement | null;
-    footer: HTMLElement | null;
-    caption: HTMLElement | null;
-    carousel: Carousel | null;
-    lastFocus: HTMLElement | null;
-    prevMouseMoveEvent: MouseEvent | undefined;
-    fsAPI: {
-        request: (el: Element) => Promise<void>;
-        exit: () => Promise<void> | undefined;
-        isFullscreen: () => boolean;
-    } | undefined;
-    get isIdle(): boolean;
-    get isCompact(): boolean;
-    constructor(userSlides?: Array<userSlideType>, userOptions?: Partial<OptionsType>, userPlugins?: PluginsType);
-    private init;
-    private initLayout;
-    private initCarousel;
-    private attachEvents;
-    private detachEvents;
-    private onClick;
-    private onWheel;
-    private onKeydown;
-    private onResize;
-    private onFocus;
-    private onMousemove;
-    private onVisibilityChange;
-    private manageCloseBtn;
-    private manageCaption;
-    /**
-     * Make sure the element, that has the focus, is inside the container
-     */
-    checkFocus(event?: FocusEvent): void;
-    /**
-     * Place focus on the first focusable element inside current slide
-     */
-    focus(event?: FocusEvent): void;
-    /**
-     * Slide carousel to the next page
-     */
-    next(): void;
-    /**
-     * Slide carousel to the previous page
-     */
-    prev(): void;
-    /**
-     * Slide carousel to page by its index with optional parameters
-     */
-    jumpTo(...args: any): void;
-    /**
-     * Check if there is another instance on top of this one
-     */
-    isTopmost(): boolean;
-    animate(element?: HTMLElement | null, className?: string, callback?: () => void | null): void;
-    stop(element: HTMLElement): void;
-    /**
-     * Set new content for the given slide
-     */
-    setContent(slide: slideType, html?: string | HTMLElement, shouldReveal?: boolean): void;
-    revealContent(slide: slideType, showClass?: string | false): void;
-    done(slide: slideType): void;
-    /**
-     * Check if the given slide is the current slide in the carousel
-     */
-    isCurrentSlide(slide: slideType): boolean;
-    /**
-     * Check if the given slide is opening slide
-     */
-    isOpeningSlide(slide: slideType): boolean;
-    /**
-     * Show loading icon inside given slide
-     */
-    showLoading(slide: slideType): void;
-    /**
-     * Hide loading icon inside given slide
-     */
-    hideLoading(slide: slideType): void;
-    /**
-     * Show error message for given slide
-     */
-    setError(slide: slideType, message: string): void;
-    /**
-     * Clear content for given slide
-     */
-    clearContent(slide: slideType): void;
-    /**
-     * Retrieve current carousel slide
-     */
-    getSlide(): slideType | undefined;
-    /**
-     * Initiate closing
-     */
-    close(event?: Event, hideClass?: string | false): void;
-    /**
-     * Clear idle state timer
-     */
-    clearIdle(): void;
-    /**
-     * Activate idle state
-     */
-    setIdle(now?: boolean): void;
-    /**
-     * Deactivate idle state
-     */
-    endIdle(): void;
-    /**
-     * Reset idle state timer
-     */
-    resetIdle(): void;
-    /**
-     * Toggle idle state
-     */
-    toggleIdle(): void;
-    /**
-     * Toggle full-screen mode
-     */
-    toggleFullscreen(): void;
-    /**
-     * Check if the instance is being closed or already destroyed
-     */
-    isClosing(): boolean;
-    private proceedClose;
-    /**
-     * Destroy the instance
-     */
-    destroy(): void;
-    /**
-     * Add a click handler that launches Fancybox after clicking on items that match the provided selector
-     */
-    static bind(selector: string, userOptions?: Partial<OptionsType>): void;
-    /**
-     * Add a click handler to the given container that launches Fancybox after clicking items that match the provided selector
-     */
-    static bind(container: HTMLElement | null, selector: string, userOptions?: Partial<OptionsType>): void;
-    /**
-     * Remove selector from the list of selectors that triggers Fancybox
-     */
-    static unbind(selector: string): void;
-    /**
-     * Remove all or one selector from the list of selectors that triggers Fancybox for the given container
-     */
-    static unbind(container: HTMLElement | null, selector?: string): void;
-    /**
-     * Immediately destroy all instances (without closing animation) and clean up
-     */
-    static destroy(): void;
-    static fromEvent(event: MouseEvent): Fancybox;
-    static fromNodes(nodes: Array<HTMLElement>, options: Partial<OptionsType>): Fancybox;
-    /**
-     * Retrieve instance by identifier or the top most instance, if identifier is not provided
-     */
-    static getInstance(id?: number): Fancybox | null;
-    /**
-     * Retrieve reference to the current slide of the highest active Fancybox instance
-     */
-    static getSlide(): slideType | null;
-    /**
-     * Create new Fancybox instance with provided options
-     */
-    static show(slides?: Array<userSlideType>, options?: Partial<OptionsType>): Fancybox;
-    /**
-     * Slide carousel of the current instance to the next page
-     */
-    static next(): void;
-    /**
-     * Slide carousel of the current instance to the previous page
-     */
-    static prev(): void;
-    /**
-     * Close all or topmost currently active instance
-     */
-    static close(all?: boolean, ...args: any): void;
-}
+import { OptionsType } from "./options";
+import { EventsType, PluginsType } from "./types";
+import { States, SlideStates } from "./consts";
+import { Component } from "../shared/Base/Component";
+import { Carousel } from "../Carousel/Carousel";
+import { slideType, userSlideType } from "../Carousel/types";
+declare module "../Carousel/types" {
+    interface slideType {
+        src?: string | HTMLElement;
+        width?: number | "auto";
+        height?: number | "auto";
+        id?: string;
+        display?: string;
+        error?: string;
+        filter?: string;
+        caption?: string;
+        downloadSrc?: string;
+        downloadFilename?: string;
+        contentEl?: HTMLElement;
+        captionEl?: HTMLElement;
+        spinnerEl?: HTMLElement;
+        closeBtnEl?: HTMLElement;
+        triggerEl?: HTMLElement;
+        thumbEl?: HTMLImageElement;
+        thumbElSrc?: string;
+        poster?: string;
+        state?: SlideStates;
+    }
+}
+export declare class Fancybox extends Component<OptionsType, EventsType> {
+    static version: string;
+    static defaults: Partial<OptionsType>;
+    static Plugins: PluginsType;
+    static openers: Map<HTMLElement, Map<string, Partial<OptionsType>>>;
+    private userSlides;
+    private userPlugins;
+    private idle;
+    private idleTimer;
+    private clickTimer;
+    private pwt;
+    private ignoreFocusChange;
+    state: States;
+    id: number | string;
+    container: HTMLElement | null;
+    footer: HTMLElement | null;
+    caption: HTMLElement | null;
+    carousel: Carousel | null;
+    lastFocus: HTMLElement | null;
+    prevMouseMoveEvent: MouseEvent | undefined;
+    fsAPI: {
+        request: (el: Element) => Promise<void>;
+        exit: () => Promise<void> | undefined;
+        isFullscreen: () => boolean;
+    } | undefined;
+    get isIdle(): boolean;
+    get isCompact(): boolean;
+    constructor(userSlides?: Array<userSlideType>, userOptions?: Partial<OptionsType>, userPlugins?: PluginsType);
+    private init;
+    private initLayout;
+    private initCarousel;
+    private attachEvents;
+    private detachEvents;
+    private onClick;
+    private onWheel;
+    private onKeydown;
+    private onResize;
+    private onFocus;
+    private onMousemove;
+    private onVisibilityChange;
+    private manageCloseBtn;
+    private manageCaption;
+    /**
+     * Make sure the element, that has the focus, is inside the container
+     */
+    checkFocus(event?: FocusEvent): void;
+    /**
+     * Place focus on the first focusable element inside current slide
+     */
+    focus(event?: FocusEvent): void;
+    /**
+     * Slide carousel to the next page
+     */
+    next(): void;
+    /**
+     * Slide carousel to the previous page
+     */
+    prev(): void;
+    /**
+     * Slide carousel to page by its index with optional parameters
+     */
+    jumpTo(...args: any): void;
+    /**
+     * Check if there is another instance on top of this one
+     */
+    isTopmost(): boolean;
+    animate(element?: HTMLElement | null, className?: string, callback?: () => void | null): void;
+    stop(element: HTMLElement): void;
+    /**
+     * Set new content for the given slide
+     */
+    setContent(slide: slideType, html?: string | HTMLElement, shouldReveal?: boolean): void;
+    revealContent(slide: slideType, showClass?: string | false): void;
+    done(slide: slideType): void;
+    /**
+     * Check if the given slide is the current slide in the carousel
+     */
+    isCurrentSlide(slide: slideType): boolean;
+    /**
+     * Check if the given slide is opening slide
+     */
+    isOpeningSlide(slide: slideType): boolean;
+    /**
+     * Show loading icon inside given slide
+     */
+    showLoading(slide: slideType): void;
+    /**
+     * Hide loading icon inside given slide
+     */
+    hideLoading(slide: slideType): void;
+    /**
+     * Show error message for given slide
+     */
+    setError(slide: slideType, message: string): void;
+    /**
+     * Clear content for given slide
+     */
+    clearContent(slide: slideType): void;
+    /**
+     * Retrieve current carousel slide
+     */
+    getSlide(): slideType | undefined;
+    /**
+     * Initiate closing
+     */
+    close(event?: Event, hideClass?: string | false): void;
+    /**
+     * Clear idle state timer
+     */
+    clearIdle(): void;
+    /**
+     * Activate idle state
+     */
+    setIdle(now?: boolean): void;
+    /**
+     * Deactivate idle state
+     */
+    endIdle(): void;
+    /**
+     * Reset idle state timer
+     */
+    resetIdle(): void;
+    /**
+     * Toggle idle state
+     */
+    toggleIdle(): void;
+    /**
+     * Toggle full-screen mode
+     */
+    toggleFullscreen(): void;
+    /**
+     * Check if the instance is being closed or already destroyed
+     */
+    isClosing(): boolean;
+    private proceedClose;
+    /**
+     * Destroy the instance
+     */
+    destroy(): void;
+    /**
+     * Add a click handler that launches Fancybox after clicking on items that match the provided selector
+     */
+    static bind(selector: string, userOptions?: Partial<OptionsType>): void;
+    /**
+     * Add a click handler to the given container that launches Fancybox after clicking items that match the provided selector
+     */
+    static bind(container: HTMLElement | null, selector: string, userOptions?: Partial<OptionsType>): void;
+    /**
+     * Remove selector from the list of selectors that triggers Fancybox
+     */
+    static unbind(selector: string): void;
+    /**
+     * Remove all or one selector from the list of selectors that triggers Fancybox for the given container
+     */
+    static unbind(container: HTMLElement | null, selector?: string): void;
+    /**
+     * Immediately destroy all instances (without closing animation) and clean up
+     */
+    static destroy(): void;
+    /**
+     * Start Fancybox using click event
+     */
+    static fromEvent(event: MouseEvent): Fancybox;
+    /**
+     * Start Fancybox using the previously assigned selector
+     */
+    static fromSelector(selector: string): void;
+    /**
+     * Start Fancybox using the previously assigned selector for the given container
+     */
+    static fromSelector(container: HTMLElement | null, selector: string): void;
+    /**
+     * Start Fancybox using HTML elements
+     */
+    static fromNodes(nodes: Array<HTMLElement>, options?: Partial<OptionsType>): Fancybox;
+    /**
+     * Retrieve instance by identifier or the top most instance, if identifier is not provided
+     */
+    static getInstance(id?: number): Fancybox | null;
+    /**
+     * Retrieve reference to the current slide of the highest active Fancybox instance
+     */
+    static getSlide(): slideType | null;
+    /**
+     * Create new Fancybox instance with provided options
+     */
+    static show(slides?: Array<userSlideType>, options?: Partial<OptionsType>): Fancybox;
+    /**
+     * Slide carousel of the current instance to the next page
+     */
+    static next(): void;
+    /**
+     * Slide carousel of the current instance to the previous page
+     */
+    static prev(): void;
+    /**
+     * Close all or topmost currently active instance
+     */
+    static close(all?: boolean, ...args: any): void;
+}

types/Fancybox/consts.d.ts

@@ -1,13 +1,13 @@
-export declare enum States {
-    Init = 0,
-    Ready = 1,
-    Closing = 2,
-    CustomClosing = 3,
-    Destroy = 4
-}
-export declare enum SlideStates {
-    Loading = 0,
-    Opening = 1,
-    Ready = 2,
-    Closing = 3
-}
+export declare enum States {
+    Init = 0,
+    Ready = 1,
+    Closing = 2,
+    CustomClosing = 3,
+    Destroy = 4
+}
+export declare enum SlideStates {
+    Loading = 0,
+    Opening = 1,
+    Ready = 2,
+    Closing = 3
+}

types/Fancybox/options.d.ts

@@ -1,177 +1,177 @@
-import { Events } from "./types";
-import { Fancybox } from "./Fancybox";
-import { slideType } from "../Carousel/types";
-import { OptionsType as CarouselOptionsType } from "../Carousel/options";
-import { ClickAction as PanzoomClickAction } from "../Panzoom/types";
-export interface PluginsOptionsType {
-}
-export type ClickAction = PanzoomClickAction | "close" | "next" | "prev";
-export type keyboardAction = "close" | "next" | "prev";
-export type keyboardType = {
-    Escape: keyboardAction;
-    Delete: keyboardAction;
-    Backspace: keyboardAction;
-    PageUp: keyboardAction;
-    PageDown: keyboardAction;
-    ArrowUp: keyboardAction;
-    ArrowDown: keyboardAction;
-    ArrowRight: keyboardAction;
-    ArrowLeft: keyboardAction;
-};
-export interface ComponentOptionsType {
-    /**
-     * Should backdrop and UI elements fade in/out on start/close
-     */
-    animated: boolean;
-    /**
-     * Set focus on first focusable element after displaying content
-     */
-    autoFocus: boolean;
-    /**
-     * The action to perform when the user clicks on the backdrop
-     */
-    backdropClick: ClickAction | ((any?: any) => ClickAction | void);
-    /**
-     * Change caption per slide
-     */
-    caption?: string | ((instance: Fancybox, slide: slideType, caption?: string) => string);
-    /**
-     * Optional object to extend options for main Carousel
-     */
-    Carousel: Partial<CarouselOptionsType>;
-    /**
-     * If true, a close button will be created above the content
-     */
-    closeButton: "auto" | boolean;
-    /**
-     * If true, only one caption element will be used for all slides
-     */
-    commonCaption: boolean;
-    /**
-     * If compact mode needs to be activated
-     */
-    compact: boolean | ((instance: Fancybox) => boolean);
-    /**
-     * The action to perform when the user clicks on the content
-     */
-    contentClick: ClickAction | ((any?: any) => ClickAction | void);
-    /**
-     * The action to take when the user double-clicks on the content
-     */
-    contentDblClick: ClickAction | ((any?: any) => ClickAction | void);
-    /**
-     * Default content type
-     */
-    defaultType: "image" | "iframe" | "video" | "inline" | "html";
-    /**
-     * The default value of the CSS `display` property for hidden inline elements
-     */
-    defaultDisplay: "block" | "flex" | string;
-    /**
-     * Enable drag-to-close gesture - drag content up/down to close instance
-     */
-    dragToClose: boolean;
-    /**
-     * If Fancybox should start in full-scren mode
-     */
-    Fullscreen: {
-        autoStart: boolean;
-    };
-    /**
-     * If true, all matching elements will be grouped together in one group
-     */
-    groupAll: boolean;
-    /**
-     * The name of the attribute used for grouping
-     */
-    groupAttr: string;
-    /**
-     * Change content height per slide
-     */
-    height?: "auto" | number | ((instance: Fancybox, slide: slideType) => "auto" | number);
-    /**
-     * Class name to be applied to the content to hide it.
-     * Note: If you disable image zoom, this class name will be used to run the image hide animation.
-     */
-    hideClass: string | false;
-    /**
-     * If browser scrollbar should be hidden
-     */
-    hideScrollbar: boolean;
-    /**
-     * Custom `id` for the instance
-     */
-    id?: number | string;
-    /**
-     * Timeout in milliseconds after which to activate idle mode
-     */
-    idle: number | false;
-    /**
-     * Keyboard events
-     */
-    keyboard: keyboardType;
-    /**
-     * Localization of strings
-     */
-    l10n?: Record<string, string>;
-    /**
-     * Custom class name for the container
-     */
-    mainClass?: string;
-    /**
-     * Optional event listeners
-     */
-    on?: Partial<Events>;
-    /**
-     * Element where container is appended
-     * Note. If no element is specified, container is appended to the `document.body`
-     */
-    parentEl?: HTMLElement | null;
-    /**
-     * Set focus back to trigger element after closing Fancybox
-     */
-    placeFocusBack: boolean;
-    /**
-     * Change source per slide
-     */
-    src?: string | HTMLElement | ((instance: Fancybox, slide: slideType) => string | HTMLElement);
-    /**
-     * Class name to be applied to the content to reveal it.
-     * Note: If you disable image zoom, this class name will be used to run the image reveal animation.
-     */
-    showClass: string | false;
-    /**
-     * Index of active slide on the start
-     */
-    startIndex: number;
-    /**
-     * HTML templates for various elements
-     */
-    tpl: {
-        closeButton?: string;
-        main?: string;
-    };
-    /**
-     *  Trap focus inside Fancybox
-     */
-    trapFocus: boolean;
-    /**
-     * Change content width per slide
-     */
-    width?: "auto" | number | ((instance: Fancybox, slide: slideType) => "auto" | number);
-    /**
-     * Mouse wheel event listener
-     */
-    wheel: "zoom" | "pan" | "close" | "slide" | false | ((instance: Fancybox, event: MouseEvent) => "zoom" | "pan" | "close" | "slide" | false);
-    event?: MouseEvent | undefined;
-    trigger?: HTMLElement | null;
-    delegate?: HTMLElement | null;
-    Hash?: any;
-    Html?: any;
-    Images?: any;
-    Slideshow?: any;
-    Thumbs?: any;
-    Toolbar?: any;
-}
-export declare const defaultOptions: ComponentOptionsType;
-export type OptionsType = PluginsOptionsType & ComponentOptionsType;
+import { Events } from "./types";
+import { Fancybox } from "./Fancybox";
+import { slideType } from "../Carousel/types";
+import { OptionsType as CarouselOptionsType } from "../Carousel/options";
+import { ClickAction as PanzoomClickAction } from "../Panzoom/types";
+export interface PluginsOptionsType {
+}
+export type ClickAction = PanzoomClickAction | "close" | "next" | "prev";
+export type keyboardAction = "close" | "next" | "prev";
+export type keyboardType = {
+    Escape: keyboardAction;
+    Delete: keyboardAction;
+    Backspace: keyboardAction;
+    PageUp: keyboardAction;
+    PageDown: keyboardAction;
+    ArrowUp: keyboardAction;
+    ArrowDown: keyboardAction;
+    ArrowRight: keyboardAction;
+    ArrowLeft: keyboardAction;
+};
+export interface ComponentOptionsType {
+    /**
+     * Should backdrop and UI elements fade in/out on start/close
+     */
+    animated: boolean;
+    /**
+     * Set focus on first focusable element after displaying content
+     */
+    autoFocus: boolean;
+    /**
+     * The action to perform when the user clicks on the backdrop
+     */
+    backdropClick: ClickAction | ((any?: any) => ClickAction | void);
+    /**
+     * Change caption per slide
+     */
+    caption?: string | ((instance: Fancybox, slide: slideType, caption?: string) => string);
+    /**
+     * Optional object to extend options for main Carousel
+     */
+    Carousel: Partial<CarouselOptionsType>;
+    /**
+     * If true, a close button will be created above the content
+     */
+    closeButton: "auto" | boolean;
+    /**
+     * If true, only one caption element will be used for all slides
+     */
+    commonCaption: boolean;
+    /**
+     * If compact mode needs to be activated
+     */
+    compact: boolean | ((instance: Fancybox) => boolean);
+    /**
+     * The action to perform when the user clicks on the content
+     */
+    contentClick: ClickAction | ((any?: any) => ClickAction | void);
+    /**
+     * The action to take when the user double-clicks on the content
+     */
+    contentDblClick: ClickAction | ((any?: any) => ClickAction | void);
+    /**
+     * Default content type
+     */
+    defaultType: "image" | "iframe" | "video" | "inline" | "html";
+    /**
+     * The default value of the CSS `display` property for hidden inline elements
+     */
+    defaultDisplay: "block" | "flex" | string;
+    /**
+     * Enable drag-to-close gesture - drag content up/down to close instance
+     */
+    dragToClose: boolean;
+    /**
+     * If Fancybox should start in full-scren mode
+     */
+    Fullscreen: {
+        autoStart: boolean;
+    };
+    /**
+     * If true, all matching elements will be grouped together in one group
+     */
+    groupAll: boolean;
+    /**
+     * The name of the attribute used for grouping
+     */
+    groupAttr: string;
+    /**
+     * Change content height per slide
+     */
+    height?: "auto" | number | ((instance: Fancybox, slide: slideType) => "auto" | number);
+    /**
+     * Class name to be applied to the content to hide it.
+     * Note: If you disable image zoom, this class name will be used to run the image hide animation.
+     */
+    hideClass: string | false;
+    /**
+     * If browser scrollbar should be hidden
+     */
+    hideScrollbar: boolean;
+    /**
+     * Custom `id` for the instance
+     */
+    id?: number | string;
+    /**
+     * Timeout in milliseconds after which to activate idle mode
+     */
+    idle: number | false;
+    /**
+     * Keyboard events
+     */
+    keyboard: keyboardType;
+    /**
+     * Localization of strings
+     */
+    l10n?: Record<string, string>;
+    /**
+     * Custom class name for the container
+     */
+    mainClass?: string;
+    /**
+     * Optional event listeners
+     */
+    on?: Partial<Events>;
+    /**
+     * Element where container is appended
+     * Note. If no element is specified, container is appended to the `document.body`
+     */
+    parentEl?: HTMLElement | null;
+    /**
+     * Set focus back to trigger element after closing Fancybox
+     */
+    placeFocusBack: boolean;
+    /**
+     * Change source per slide
+     */
+    src?: string | HTMLElement | ((instance: Fancybox, slide: slideType) => string | HTMLElement);
+    /**
+     * Class name to be applied to the content to reveal it.
+     * Note: If you disable image zoom, this class name will be used to run the image reveal animation.
+     */
+    showClass: string | false;
+    /**
+     * Index of active slide on the start
+     */
+    startIndex: number;
+    /**
+     * HTML templates for various elements
+     */
+    tpl: {
+        closeButton?: string;
+        main?: string;
+    };
+    /**
+     *  Trap focus inside Fancybox
+     */
+    trapFocus: boolean;
+    /**
+     * Change content width per slide
+     */
+    width?: "auto" | number | ((instance: Fancybox, slide: slideType) => "auto" | number);
+    /**
+     * Mouse wheel event listener
+     */
+    wheel: "zoom" | "pan" | "close" | "slide" | false | ((instance: Fancybox, event: MouseEvent) => "zoom" | "pan" | "close" | "slide" | false);
+    event?: MouseEvent | undefined;
+    trigger?: HTMLElement | null;
+    delegate?: HTMLElement | null;
+    Hash?: any;
+    Html?: any;
+    Images?: any;
+    Slideshow?: any;
+    Thumbs?: any;
+    Toolbar?: any;
+}
+export declare const defaultOptions: ComponentOptionsType;
+export type OptionsType = PluginsOptionsType & ComponentOptionsType;

types/Fancybox/plugins/Hash/Hash.d.ts

@@ -1,34 +1,34 @@
-import { Plugin } from "../../../shared/Base/Plugin";
-import { Fancybox } from "../../Fancybox";
-export type HashOptionsType = {
-    slug?: string;
-};
-declare module "../../../Carousel/types" {
-    interface slideType {
-        slug?: string;
-    }
-}
-declare module "../../../Fancybox/options" {
-    interface PluginsOptionsType {
-        Hash?: Boolean | Partial<HashOptionsType>;
-        slug?: string;
-    }
-}
-export declare const defaultOptions: HashOptionsType;
-export declare class Hash extends Plugin<Fancybox, HashOptionsType, ""> {
-    static defaults: HashOptionsType;
-    static hasSilentClose: boolean;
-    private origHash;
-    private timer;
-    private onChange;
-    private onClose;
-    attach(): void;
-    detach(): void;
-    static parseURL(): {
-        hash: string;
-        slug: string;
-        index: number;
-    };
-    static startFromUrl(): void;
-    static destroy(): void;
-}
+import { Plugin } from "../../../shared/Base/Plugin";
+import { Fancybox } from "../../Fancybox";
+export type HashOptionsType = {
+    slug?: string;
+};
+declare module "../../../Carousel/types" {
+    interface slideType {
+        slug?: string;
+    }
+}
+declare module "../../../Fancybox/options" {
+    interface PluginsOptionsType {
+        Hash?: Boolean | Partial<HashOptionsType>;
+        slug?: string;
+    }
+}
+export declare const defaultOptions: HashOptionsType;
+export declare class Hash extends Plugin<Fancybox, HashOptionsType, ""> {
+    static defaults: HashOptionsType;
+    static hasSilentClose: boolean;
+    private origHash;
+    private timer;
+    private onChange;
+    private onClose;
+    attach(): void;
+    detach(): void;
+    static parseURL(): {
+        hash: string;
+        slug: string;
+        index: number;
+    };
+    static startFromUrl(): void;
+    static destroy(): void;
+}

types/Fancybox/plugins/Html/Html.d.ts

@@ -1,102 +1,102 @@
-import { Plugin } from "../../../shared/Base/Plugin";
-import { slideType } from "../../../Carousel/types";
-import { Fancybox } from "../../Fancybox";
-export type HtmlOptionsType = {
-    /**
-     * A body of data to be sent in the XHR request
-     */
-    ajax: Document | XMLHttpRequestBodyInit | null;
-    /**
-     * If resize the iframe element to match the dimensions of the iframe page content
-     */
-    autoSize: boolean;
-    /**
-     * If wait for iframe content to load before displaying
-     */
-    preload: boolean;
-    /**
-     * If videos should start playing automatically after they are displayed
-     */
-    videoAutoplay: boolean;
-    /**
-     * HTML5 video element template
-     */
-    videoTpl: string;
-    /**
-     * Default HTML5 video format
-     */
-    videoFormat: string;
-    /**
-     * Aspect ratio of the video element
-     */
-    videoRatio: number;
-    /**
-     * Vimeo embedded player parameters
-     * https://vimeo.zendesk.com/hc/en-us/articles/360001494447-Player-parameters-overview
-     */
-    vimeo: {
-        byline: 0 | 1;
-        color: string;
-        controls: 0 | 1;
-        dnt: 0 | 1;
-        muted: 0 | 1;
-    };
-    /**
-     * YouTube embedded player parameters
-     * https://developers.google.com/youtube/player_parameters#Parameters
-     */
-    youtube: {
-        controls: 0 | 1;
-        enablejsapi: 0 | 1;
-        nocookie: 0 | 1;
-        rel: 0 | 1;
-        fs: 0 | 1;
-    };
-};
-declare module "../../../Fancybox/options" {
-    interface PluginsOptionsType {
-        Html?: Boolean | Partial<HtmlOptionsType>;
-    }
-}
-export declare const defaultOptions: HtmlOptionsType;
-export declare const contentTypes: readonly ["image", "html", "ajax", "inline", "clone", "iframe", "map", "pdf", "html5video", "youtube", "vimeo", "video"];
-type contentType = typeof contentTypes[number];
-declare module "../../../Carousel/types" {
-    interface slideType {
-        type?: contentType;
-        defaultType?: contentType;
-        ratio?: string | number;
-        videoFormat?: string;
-        ajax?: Document | XMLHttpRequestBodyInit | null;
-        xhr?: XMLHttpRequest | null;
-        poller?: ReturnType<typeof setTimeout>;
-        placeholderEl?: HTMLElement | null;
-        iframeEl?: HTMLIFrameElement | null;
-        preload?: boolean;
-        autoSize?: boolean;
-        videoId?: string;
-        autoplay?: boolean;
-    }
-}
-export declare class Html extends Plugin<Fancybox, HtmlOptionsType, ""> {
-    static defaults: HtmlOptionsType;
-    private onInitSlide;
-    private onCreateSlide;
-    private onRemoveSlide;
-    private onSelectSlide;
-    private onUnselectSlide;
-    private onDone;
-    private onRefresh;
-    private onMessage;
-    private loadAjaxContent;
-    private setInlineContent;
-    private setIframeContent;
-    private resizeIframe;
-    private playVideo;
-    private processType;
-    setContent(slide: slideType): void;
-    private setAspectRatio;
-    attach(): void;
-    detach(): void;
-}
-export {};
+import { Plugin } from "../../../shared/Base/Plugin";
+import { slideType } from "../../../Carousel/types";
+import { Fancybox } from "../../Fancybox";
+export type HtmlOptionsType = {
+    /**
+     * A body of data to be sent in the XHR request
+     */
+    ajax: Document | XMLHttpRequestBodyInit | null;
+    /**
+     * If resize the iframe element to match the dimensions of the iframe page content
+     */
+    autoSize: boolean;
+    /**
+     * If wait for iframe content to load before displaying
+     */
+    preload: boolean;
+    /**
+     * If videos should start playing automatically after they are displayed
+     */
+    videoAutoplay: boolean;
+    /**
+     * HTML5 video element template
+     */
+    videoTpl: string;
+    /**
+     * Default HTML5 video format
+     */
+    videoFormat: string;
+    /**
+     * Aspect ratio of the video element
+     */
+    videoRatio: number;
+    /**
+     * Vimeo embedded player parameters
+     * https://vimeo.zendesk.com/hc/en-us/articles/360001494447-Player-parameters-overview
+     */
+    vimeo: {
+        byline: 0 | 1;
+        color: string;
+        controls: 0 | 1;
+        dnt: 0 | 1;
+        muted: 0 | 1;
+    };
+    /**
+     * YouTube embedded player parameters
+     * https://developers.google.com/youtube/player_parameters#Parameters
+     */
+    youtube: {
+        controls: 0 | 1;
+        enablejsapi: 0 | 1;
+        nocookie: 0 | 1;
+        rel: 0 | 1;
+        fs: 0 | 1;
+    };
+};
+declare module "../../../Fancybox/options" {
+    interface PluginsOptionsType {
+        Html?: Boolean | Partial<HtmlOptionsType>;
+    }
+}
+export declare const defaultOptions: HtmlOptionsType;
+export declare const contentTypes: readonly ["image", "html", "ajax", "inline", "clone", "iframe", "map", "pdf", "html5video", "youtube", "vimeo", "video"];
+type contentType = typeof contentTypes[number];
+declare module "../../../Carousel/types" {
+    interface slideType {
+        type?: contentType;
+        defaultType?: contentType;
+        ratio?: string | number;
+        videoFormat?: string;
+        ajax?: Document | XMLHttpRequestBodyInit | null;
+        xhr?: XMLHttpRequest | null;
+        poller?: ReturnType<typeof setTimeout>;
+        placeholderEl?: HTMLElement | null;
+        iframeEl?: HTMLIFrameElement | null;
+        preload?: boolean;
+        autoSize?: boolean;
+        videoId?: string;
+        autoplay?: boolean;
+    }
+}
+export declare class Html extends Plugin<Fancybox, HtmlOptionsType, ""> {
+    static defaults: HtmlOptionsType;
+    private onInitSlide;
+    private onCreateSlide;
+    private onRemoveSlide;
+    private onSelectSlide;
+    private onUnselectSlide;
+    private onDone;
+    private onRefresh;
+    private onMessage;
+    private loadAjaxContent;
+    private setInlineContent;
+    private setIframeContent;
+    private resizeIframe;
+    private playVideo;
+    private processType;
+    setContent(slide: slideType): void;
+    private setAspectRatio;
+    attach(): void;
+    detach(): void;
+}
+export {};

types/Fancybox/plugins/Images/Images.d.ts

@@ -1,64 +1,64 @@
-import { Plugin } from "../../../shared/Base/Plugin";
-import { Panzoom } from "../../../Panzoom/Panzoom";
-import { OptionsType as PanzoomOptionsType } from "../../../Panzoom/options";
-import { Carousel } from "../../../Carousel/Carousel";
-import { slideType } from "../../../Carousel/types";
-import { Fancybox } from "../../Fancybox";
-export type OptionsType = {
-    /**
-     * Set custom content per slide
-     */
-    content?: (instance: Images, slide: slideType) => string | HTMLElement | HTMLPictureElement;
-    /**
-     * Initial image zoom level, see Panzoom documentation for more information.
-     */
-    initialSize: "fit" | "cover" | "full" | "max" | ((instance: Images) => "fit" | "cover" | "full" | "max");
-    /**
-     * Custom options for Panzoom instance, see Panzoom documentation for more information.
-     */
-    Panzoom: Partial<PanzoomOptionsType>;
-    /**
-     * If the image download needs to be prevented
-     */
-    protected: boolean;
-    /**
-     * If animate an image with zoom in/out animation when launching/closing Fancybox
-     */
-    zoom: boolean;
-    /**
-     * If zoom animation should animate the opacity when launching/closing Fancybox
-     */
-    zoomOpacity: "auto" | boolean;
-};
-export declare const defaultOptions: OptionsType;
-declare module "../../../Carousel/types" {
-    interface slideType {
-        panzoom?: Panzoom;
-        imageEl?: HTMLImageElement | HTMLPictureElement;
-        srcset?: string;
-        sizes?: string;
-    }
-}
-declare module "../../../Fancybox/options" {
-    interface PluginsOptionsType {
-        Images: Boolean | Partial<ImagesOptionsType>;
-    }
-}
-export type ImagesOptionsType = Partial<OptionsType>;
-export declare class Images extends Plugin<Fancybox, ImagesOptionsType, ""> {
-    static defaults: OptionsType;
-    onCreateSlide(_fancybox: Fancybox, _carousel: Carousel, slide: slideType): void;
-    onRemoveSlide(_fancybox: Fancybox, _carousel: Carousel, slide: slideType): void;
-    onChange(_fancybox: Fancybox, carousel: Carousel, page: number, _prevPage: number): void;
-    onClose(): void;
-    setContent(slide: slideType, imageSrc: string): Promise<Panzoom>;
-    zoomIn(slide: slideType): Promise<Panzoom>;
-    getZoomInfo(slide: slideType): false | {
-        x: number;
-        y: number;
-        scale: number;
-        opacity: boolean;
-    };
-    attach(): void;
-    detach(): void;
-}
+import { Plugin } from "../../../shared/Base/Plugin";
+import { Panzoom } from "../../../Panzoom/Panzoom";
+import { OptionsType as PanzoomOptionsType } from "../../../Panzoom/options";
+import { Carousel } from "../../../Carousel/Carousel";
+import { slideType } from "../../../Carousel/types";
+import { Fancybox } from "../../Fancybox";
+export type OptionsType = {
+    /**
+     * Set custom content per slide
+     */
+    content?: (instance: Images, slide: slideType) => string | HTMLElement | HTMLPictureElement;
+    /**
+     * Initial image zoom level, see Panzoom documentation for more information.
+     */
+    initialSize: "fit" | "cover" | "full" | "max" | ((instance: Images) => "fit" | "cover" | "full" | "max");
+    /**
+     * Custom options for Panzoom instance, see Panzoom documentation for more information.
+     */
+    Panzoom: Partial<PanzoomOptionsType>;
+    /**
+     * If the image download needs to be prevented
+     */
+    protected: boolean;
+    /**
+     * If animate an image with zoom in/out animation when launching/closing Fancybox
+     */
+    zoom: boolean;
+    /**
+     * If zoom animation should animate the opacity when launching/closing Fancybox
+     */
+    zoomOpacity: "auto" | boolean;
+};
+export declare const defaultOptions: OptionsType;
+declare module "../../../Carousel/types" {
+    interface slideType {
+        panzoom?: Panzoom;
+        imageEl?: HTMLImageElement | HTMLPictureElement;
+        srcset?: string;
+        sizes?: string;
+    }
+}
+declare module "../../../Fancybox/options" {
+    interface PluginsOptionsType {
+        Images: Boolean | Partial<ImagesOptionsType>;
+    }
+}
+export type ImagesOptionsType = Partial<OptionsType>;
+export declare class Images extends Plugin<Fancybox, ImagesOptionsType, ""> {
+    static defaults: OptionsType;
+    onCreateSlide(_fancybox: Fancybox, _carousel: Carousel, slide: slideType): void;
+    onRemoveSlide(_fancybox: Fancybox, _carousel: Carousel, slide: slideType): void;
+    onChange(_fancybox: Fancybox, carousel: Carousel, page: number, _prevPage: number): void;
+    onClose(): void;
+    setContent(slide: slideType, imageSrc: string): Promise<Panzoom>;
+    zoomIn(slide: slideType): Promise<Panzoom>;
+    getZoomInfo(slide: slideType): false | {
+        x: number;
+        y: number;
+        scale: number;
+        opacity: boolean;
+    };
+    attach(): void;
+    detach(): void;
+}

types/Fancybox/plugins/Slideshow/Slideshow.d.ts

@@ -1,38 +1,38 @@
-import { Plugin } from "../../../shared/Base/Plugin";
-import type { AutoplayOptionsType } from "../../../Carousel/plugins/Autoplay/Autoplay";
-import { Fancybox } from "../../Fancybox";
-export type OptionsType = {
-    /**
-     * Custom options for Carousel Autoplay plugin instance, see relevant documentation for more information
-     */
-    Autoplay?: Partial<AutoplayOptionsType>;
-    /**
-     * Keyboard shortcut to toggle Slideshow
-     */
-    key: string;
-    /**
-     * If the slideshow should automatically activate after Fancybox is launched
-     */
-    playOnStart: boolean;
-    /**
-     * Delay (in milliseconds) before the slide change
-     */
-    timeout: number;
-};
-export declare const defaultOptions: OptionsType;
-export type SlideshowOptionsType = Partial<OptionsType>;
-declare module "../../../Fancybox/options" {
-    interface PluginsOptionsType {
-        Slideshow: Boolean | Partial<SlideshowOptionsType>;
-    }
-}
-export declare class Slideshow extends Plugin<Fancybox, SlideshowOptionsType, ""> {
-    static defaults: OptionsType;
-    private ref;
-    private onPrepare;
-    private onReady;
-    private onDone;
-    private onKeydown;
-    attach(): void;
-    detach(): void;
-}
+import { Plugin } from "../../../shared/Base/Plugin";
+import type { AutoplayOptionsType } from "../../../Carousel/plugins/Autoplay/Autoplay";
+import { Fancybox } from "../../Fancybox";
+export type OptionsType = {
+    /**
+     * Custom options for Carousel Autoplay plugin instance, see relevant documentation for more information
+     */
+    Autoplay?: Partial<AutoplayOptionsType>;
+    /**
+     * Keyboard shortcut to toggle Slideshow
+     */
+    key: string;
+    /**
+     * If the slideshow should automatically activate after Fancybox is launched
+     */
+    playOnStart: boolean;
+    /**
+     * Delay (in milliseconds) before the slide change
+     */
+    timeout: number;
+};
+export declare const defaultOptions: OptionsType;
+export type SlideshowOptionsType = Partial<OptionsType>;
+declare module "../../../Fancybox/options" {
+    interface PluginsOptionsType {
+        Slideshow: Boolean | Partial<SlideshowOptionsType>;
+    }
+}
+export declare class Slideshow extends Plugin<Fancybox, SlideshowOptionsType, ""> {
+    static defaults: OptionsType;
+    private ref;
+    private onPrepare;
+    private onReady;
+    private onDone;
+    private onKeydown;
+    attach(): void;
+    detach(): void;
+}

types/Fancybox/plugins/Thumbs/Thumbs.d.ts

@@ -1,40 +1,40 @@
-import { Plugin } from "../../../shared/Base/Plugin";
-import { ThumbsOptionsType as CarouselThumbsOptionsType } from "../../../Carousel/plugins/Thumbs/Thumbs";
-import { Fancybox } from "../../Fancybox";
-export type OptionsType = CarouselThumbsOptionsType & {
-    /**
-     *  Keyboard shortcut to toggle thumbnail container
-     */
-    key: string | false;
-    /**
-     * Change the location where the thumbnail container is added
-     */
-    parentEl: HTMLElement | null | (() => HTMLElement | null);
-    /**
-     * If thumbnail bar should appear automatically after Fancybox is launched
-     */
-    showOnStart: boolean;
-};
-export declare const defaultOptions: OptionsType;
-export type ThumbsOptionsType = Partial<OptionsType>;
-declare module "../../../Fancybox/options" {
-    interface PluginsOptionsType {
-        Thumbs: Boolean | Partial<ThumbsOptionsType>;
-    }
-}
-export declare class Thumbs extends Plugin<Fancybox, ThumbsOptionsType, ""> {
-    static defaults: OptionsType;
-    private ref;
-    private hidden;
-    get isEnabled(): boolean;
-    get isHidden(): boolean;
-    private onInit;
-    private onResize;
-    private onKeydown;
-    toggle(): void;
-    show(): void;
-    hide(): void;
-    refresh(): void;
-    attach(): void;
-    detach(): void;
-}
+import { Plugin } from "../../../shared/Base/Plugin";
+import { ThumbsOptionsType as CarouselThumbsOptionsType } from "../../../Carousel/plugins/Thumbs/Thumbs";
+import { Fancybox } from "../../Fancybox";
+export type OptionsType = CarouselThumbsOptionsType & {
+    /**
+     *  Keyboard shortcut to toggle thumbnail container
+     */
+    key: string | false;
+    /**
+     * Change the location where the thumbnail container is added
+     */
+    parentEl: HTMLElement | null | (() => HTMLElement | null);
+    /**
+     * If thumbnail bar should appear automatically after Fancybox is launched
+     */
+    showOnStart: boolean;
+};
+export declare const defaultOptions: OptionsType;
+export type ThumbsOptionsType = Partial<OptionsType>;
+declare module "../../../Fancybox/options" {
+    interface PluginsOptionsType {
+        Thumbs: Boolean | Partial<ThumbsOptionsType>;
+    }
+}
+export declare class Thumbs extends Plugin<Fancybox, ThumbsOptionsType, ""> {
+    static defaults: OptionsType;
+    private ref;
+    private hidden;
+    get isEnabled(): boolean;
+    get isHidden(): boolean;
+    private onInit;
+    private onResize;
+    private onKeydown;
+    toggle(): void;
+    show(): void;
+    hide(): void;
+    refresh(): void;
+    attach(): void;
+    detach(): void;
+}

types/Fancybox/plugins/Toolbar/Toolbar.d.ts

@@ -1,86 +1,86 @@
-import { Plugin } from "../../../shared/Base/Plugin";
-import { PanzoomButtonsType } from "../../../shared/buttons";
-import { Fancybox } from "../../Fancybox";
-export declare enum ToolbarStates {
-    Init = 0,
-    Ready = 1,
-    Disabled = 2
-}
-export declare const ToolbarItems: {
-    infobar: {
-        tpl: string;
-    };
-    download: {
-        tpl: string;
-    };
-    prev: {
-        tpl: string;
-    };
-    next: {
-        tpl: string;
-    };
-    slideshow: {
-        tpl: string;
-    };
-    fullscreen: {
-        tpl: string;
-    };
-    thumbs: {
-        tpl: string;
-    };
-    close: {
-        tpl: string;
-    };
-};
-export type ToolbarItemType = {
-    tpl: string;
-    click?: (instance: Toolbar, event: Event) => void;
-};
-export type ToolbarItemsType = Record<keyof typeof ToolbarItems | string, ToolbarItemType>;
-export type ToolbarItemKey = keyof PanzoomButtonsType | keyof ToolbarItemsType;
-export type ToolbarPosition = "left" | "middle" | "right";
-export type OptionsType = {
-    /**
-     * If absolutely position container;
-     * "auto" - absolutely positioned if there is no item in the "middle" column
-     */
-    absolute: "auto" | boolean;
-    /**
-     * What toolbar items to display
-     */
-    display: Record<ToolbarPosition, Array<ToolbarItemKey>>;
-    /**
-     * If enabled; "auto" - enable only if there is at least one image in the gallery
-     */
-    enabled: "auto" | boolean;
-    /**
-     * Collection of all available toolbar items
-     */
-    items: ToolbarItemsType;
-    /**
-     * Change where toolbar container is appended
-     */
-    parentEl: HTMLElement | null | (() => HTMLElement | null);
-};
-export declare const defaultOptions: OptionsType;
-export type ToolbarOptionsType = Partial<OptionsType>;
-declare module "../../../Fancybox/options" {
-    interface PluginsOptionsType {
-        Toolbar: Boolean | Partial<ToolbarOptionsType>;
-    }
-}
-export declare class Toolbar extends Plugin<Fancybox, ToolbarOptionsType, ""> {
-    static defaults: OptionsType;
-    state: ToolbarStates;
-    private container;
-    private onReady;
-    private onClick;
-    private onChange;
-    private onRefresh;
-    private onDone;
-    private createContainer;
-    private createEl;
-    private removeContainer;
-    attach(): void;
-    detach(): void;
-}
+import { Plugin } from "../../../shared/Base/Plugin";
+import { PanzoomButtonsType } from "../../../shared/buttons";
+import { Fancybox } from "../../Fancybox";
+export declare enum ToolbarStates {
+    Init = 0,
+    Ready = 1,
+    Disabled = 2
+}
+export declare const ToolbarItems: {
+    infobar: {
+        tpl: string;
+    };
+    download: {
+        tpl: string;
+    };
+    prev: {
+        tpl: string;
+    };
+    next: {
+        tpl: string;
+    };
+    slideshow: {
+        tpl: string;
+    };
+    fullscreen: {
+        tpl: string;
+    };
+    thumbs: {
+        tpl: string;
+    };
+    close: {
+        tpl: string;
+    };
+};
+export type ToolbarItemType = {
+    tpl: string;
+    click?: (instance: Toolbar, event: Event) => void;
+};
+export type ToolbarItemsType = Record<keyof typeof ToolbarItems | string, ToolbarItemType>;
+export type ToolbarItemKey = keyof PanzoomButtonsType | keyof ToolbarItemsType;
+export type ToolbarPosition = "left" | "middle" | "right";
+export type OptionsType = {
+    /**
+     * If absolutely position container;
+     * "auto" - absolutely positioned if there is no item in the "middle" column
+     */
+    absolute: "auto" | boolean;
+    /**
+     * What toolbar items to display
+     */
+    display: Record<ToolbarPosition, Array<ToolbarItemKey>>;
+    /**
+     * If enabled; "auto" - enable only if there is at least one image in the gallery
+     */
+    enabled: "auto" | boolean;
+    /**
+     * Collection of all available toolbar items
+     */
+    items: ToolbarItemsType;
+    /**
+     * Change where toolbar container is appended
+     */
+    parentEl: HTMLElement | null | (() => HTMLElement | null);
+};
+export declare const defaultOptions: OptionsType;
+export type ToolbarOptionsType = Partial<OptionsType>;
+declare module "../../../Fancybox/options" {
+    interface PluginsOptionsType {
+        Toolbar: Boolean | Partial<ToolbarOptionsType>;
+    }
+}
+export declare class Toolbar extends Plugin<Fancybox, ToolbarOptionsType, ""> {
+    static defaults: OptionsType;
+    state: ToolbarStates;
+    private container;
+    private onReady;
+    private onClick;
+    private onChange;
+    private onRefresh;
+    private onDone;
+    private createContainer;
+    private createEl;
+    private removeContainer;
+    attach(): void;
+    detach(): void;
+}

types/Fancybox/plugins/index.d.ts

@@ -1,2 +1,2 @@
-import { PluginsType } from "../types";
-export declare const Plugins: PluginsType;
+import { PluginsType } from "../types";
+export declare const Plugins: PluginsType;

types/Fancybox/types.d.ts

@@ -1,80 +1,80 @@
-import { Constructor } from "../shared/Base/types";
-import { Plugin } from "../shared/Base/Plugin";
-import { Fancybox } from "./Fancybox";
-export type PluginsType = Record<string, Constructor<Plugin<Fancybox, any, any>>>;
-import { CarouselEventsType } from "../Carousel/types";
-import { ComponentEventsType } from "../shared/Base/types";
-export type EventsType = ComponentEventsType
-/**
- * Initialization has started, plugins have been added
- */
- | "init"
-/**
- * The layout is initialized
- */
- | "initLayout"
-/**
- * The Carousel is initialized
- */
- | "initCarousel"
-/**
- * Initialization has been completed
- */
- | "ready"
-/**
- * The content on one of the slides starts loading
- */
- | "loading"
-/**
- * Content is loaded on one of the slides but is not yet displayed
- */
- | "loaded"
-/**
- * Content could not be loaded in one of the slides
- */
- | "error"
-/**
- * Content is ready to be displayed on one of the slides
- */
- | "reveal"
-/**
- * Content is revealed on one of the slides
- */
- | "done"
-/**
- * The idle state is activated
- */
- | "setIdle"
-/**
- * The idle state is deactivated
- */
- | "endIdle"
-/**
- * A keyboard button is pressed
- */
- | "keydown"
-/**
- * Single click event has been detected
- */
- | "click"
-/**
- * Wheel event has been detected
- */
- | "wheel"
-/**
- * A window resizing event was detected
- */
- | "resize"
-/**
- * Closing has begun and can be prevented
- */
- | "shouldClose"
-/**
- * Closing is ongoing
- */
- | "close"
-/**
- * Closing is complete
- */
- | "destroy" | `Carousel.${CarouselEventsType}`;
-export type Events = Record<EventsType, (...args: any[]) => void>;
+import { Constructor } from "../shared/Base/types";
+import { Plugin } from "../shared/Base/Plugin";
+import { Fancybox } from "./Fancybox";
+export type PluginsType = Record<string, Constructor<Plugin<Fancybox, any, any>>>;
+import { CarouselEventsType } from "../Carousel/types";
+import { ComponentEventsType } from "../shared/Base/types";
+export type EventsType = ComponentEventsType
+/**
+ * Initialization has started, plugins have been added
+ */
+ | "init"
+/**
+ * The layout is initialized
+ */
+ | "initLayout"
+/**
+ * The Carousel is initialized
+ */
+ | "initCarousel"
+/**
+ * Initialization has been completed
+ */
+ | "ready"
+/**
+ * The content on one of the slides starts loading
+ */
+ | "loading"
+/**
+ * Content is loaded on one of the slides but is not yet displayed
+ */
+ | "loaded"
+/**
+ * Content could not be loaded in one of the slides
+ */
+ | "error"
+/**
+ * Content is ready to be displayed on one of the slides
+ */
+ | "reveal"
+/**
+ * Content is revealed on one of the slides
+ */
+ | "done"
+/**
+ * The idle state is activated
+ */
+ | "setIdle"
+/**
+ * The idle state is deactivated
+ */
+ | "endIdle"
+/**
+ * A keyboard button is pressed
+ */
+ | "keydown"
+/**
+ * Single click event has been detected
+ */
+ | "click"
+/**
+ * Wheel event has been detected
+ */
+ | "wheel"
+/**
+ * A window resizing event was detected
+ */
+ | "resize"
+/**
+ * Closing has begun and can be prevented
+ */
+ | "shouldClose"
+/**
+ * Closing is ongoing
+ */
+ | "close"
+/**
+ * Closing is complete
+ */
+ | "destroy" | `Carousel.${CarouselEventsType}`;
+export type Events = Record<EventsType, (...args: any[]) => void>;

types/Panzoom/Panzoom.d.ts

@@ -1,354 +1,354 @@
-import { Component } from "../shared/Base/Component";
-import { PluginsType, EventsType, Bounds, MatrixValues, ZoomOptions } from "./types";
-import { States } from "./consts";
-import { OptionsType } from "./options";
-export declare class Panzoom extends Component<OptionsType, EventsType> {
-    static defaults: Partial<OptionsType>;
-    static Plugins: PluginsType;
-    private pointerTracker;
-    private resizeObserver;
-    private updateTimer;
-    private clickTimer;
-    private rAF;
-    private isTicking;
-    private friction;
-    private ignoreBounds;
-    private isBouncingX;
-    private isBouncingY;
-    private clicks;
-    private trackingPoints;
-    private pwt;
-    private cwd;
-    private pmme;
-    /**
-     * Current state of the instance
-     */
-    state: States;
-    /**
-     * True if the user is currently dragging
-     */
-    isDragging: boolean;
-    /**
-     * Reference to the container element
-     */
-    container: HTMLElement;
-    /**
-     * Reference to the content element
-     */
-    content: HTMLElement | HTMLImageElement | HTMLPictureElement;
-    /**
-     * Reference to the loading indicator element
-     */
-    spinner: HTMLElement | null;
-    /**
-     * Container dimensions.
-     * `innerWidth` & `innerHeight` values are width/height without padding.
-     */
-    containerRect: {
-        width: number;
-        height: number;
-        innerWidth: number;
-        innerHeight: number;
-    };
-    /**
-     * Content dimensions and position relative to parent.
-     * `width` & `height` values are in current scale.
-     */
-    contentRect: {
-        top: number;
-        right: number;
-        bottom: number;
-        left: number;
-        fullWidth: number;
-        fullHeight: number;
-        fitWidth: number;
-        fitHeight: number;
-        width: number;
-        height: number;
-    };
-    /**
-     * Initial position of the drag
-     */
-    dragStart: {
-        x: number;
-        y: number;
-        top: number;
-        left: number;
-        time: number;
-    };
-    /**
-     * Current position of the drag
-     */
-    dragOffset: {
-        x: number;
-        y: number;
-        time: number;
-    };
-    /**
-     * Transformation matrix values that define current x/y position and scale
-     */
-    current: MatrixValues;
-    /**
-     * Transformation matrix values that define the x/y position and scale of the end of the current animation
-     */
-    target: MatrixValues;
-    /**
-     * The velocity of each transformation matrix value
-     */
-    velocity: MatrixValues;
-    /**
-     * Axis that is currently locked
-     */
-    lockedAxis: false | "x" | "y";
-    /**
-     * True if the user is on a touch device
-     */
-    get isTouchDevice(): boolean;
-    get isMobile(): boolean;
-    /**
-     * Current pan mode - `mousemove` or `drag`
-     */
-    get panMode(): "drag" | "mousemove";
-    /**
-     * If the content can be dragged when it fits into the container
-     */
-    get panOnlyZoomed(): boolean | ((...any: any) => boolean | "auto");
-    /**
-     * True if the content has any boundaries
-     */
-    get isInfinite(): boolean | "x" | "y";
-    /**
-     * At what angle the content is rotated
-     */
-    get angle(): number;
-    /**
-     * At what angle the content is rotated at the end of the current animation
-     */
-    get targetAngle(): number;
-    /**
-     * At what scale the content is scaled
-     */
-    get scale(): number;
-    /**
-     * At what scale the content is scaled at the end of the current animation
-     */
-    get targetScale(): number;
-    /**
-     * Minimum scale level
-     */
-    get minScale(): number;
-    /**
-     * At what scale the content will be at full width and height (1 to 1)
-     */
-    get fullScale(): number;
-    /**
-     * Maximum scale level given the `maxScale` option
-     */
-    get maxScale(): number;
-    /**
-     * At what scale the content will cover the container
-     */
-    get coverScale(): number;
-    /**
-     * True if the content is currently animated and the scale level is changing
-     */
-    get isScaling(): boolean;
-    /**
-     * True if the content (image) has not finished loading
-     */
-    get isContentLoading(): boolean;
-    /**
-     * True if the animation is complete and the content fits within the bounds
-     */
-    get isResting(): boolean;
-    constructor(container: HTMLElement | null, userOptions?: Partial<OptionsType>, userPlugins?: PluginsType);
-    private initContent;
-    private onLoad;
-    private onError;
-    /**
-     * Initialize the resize observer
-     */
-    attachObserver(): void;
-    /**
-     * Remove the resize observer
-     */
-    detachObserver(): void;
-    /**
-     * Enable click, wheel, mousemove and all touch events
-     */
-    attachEvents(): void;
-    /**
-     * Remove click, wheel, mouse movement and all touch events
-     */
-    detachEvents(): void;
-    private animate;
-    private setTargetForce;
-    private checkBounds;
-    private clampTargetBounds;
-    private calculateContentDim;
-    private setEdgeForce;
-    private enable;
-    private onClick;
-    private addTrackingPoint;
-    private onPointerDown;
-    private onPointerMove;
-    private onPointerUp;
-    private startDecelAnim;
-    private onWheel;
-    private onMouseMove;
-    private onKeydown;
-    private onResize;
-    private setTransform;
-    /**
-     * Calculate dimensions of contents and container
-     */
-    updateMetrics(silently?: boolean): void;
-    /**
-     * Get information about current content boundaries
-     */
-    getBounds(): Bounds;
-    /**
-     * Enable or disable controls depending on the current size of the content
-     */
-    updateControls(): void;
-    /**
-     * Pan content to selected position and scale, use `friction` to control duration
-     */
-    panTo({ x, y, scale, friction, angle, originX, originY, flipX, flipY, ignoreBounds, }: {
-        x?: number;
-        y?: number;
-        scale?: number;
-        friction?: number;
-        angle?: number;
-        originX?: number;
-        originY?: number;
-        flipX?: boolean;
-        flipY?: boolean;
-        ignoreBounds?: boolean;
-    }): void;
-    /**
-     * Relatively change position, scale, or angle of content, and flip content horizontally or vertically
-     */
-    applyChange({ panX, panY, scale, angle, originX, originY, friction, flipX, flipY, ignoreBounds, bounce, }: {
-        panX?: number;
-        panY?: number;
-        scale?: number;
-        angle?: number;
-        originX?: number;
-        originY?: number;
-        friction?: number;
-        flipX?: boolean;
-        flipY?: boolean;
-        ignoreBounds?: boolean;
-        bounce?: boolean;
-    }): void;
-    /**
-     * Stop animation and optionally set target values to the current values (or vice versa)
-     */
-    stop(freeze?: "current" | "target" | false): void;
-    /**
-     * Request an animation frame to check if the content position or scale needs to be changed based on the target values or if the content is out of bounds
-     */
-    requestTick(): void;
-    /**
-     * Update the current position based on the mouse move event
-     */
-    panWithMouse(event: MouseEvent, friction?: number): void;
-    /**
-     * Update the current scale based on the mouse scroll event
-     */
-    zoomWithWheel(event: WheelEvent): void;
-    /**
-     * Check if the content can be scaled up
-     */
-    canZoomIn(): boolean;
-    /**
-     * Check if the content can be scaled down
-     */
-    canZoomOut(): boolean;
-    /**
-     * Increase scale level
-     */
-    zoomIn(scale?: number, opts?: ZoomOptions): void;
-    /**
-     * Reduce scale level
-     */
-    zoomOut(scale?: number, opts?: ZoomOptions): void;
-    /**
-     * Change the scale level so that the content fits inside the container
-     */
-    zoomToFit(opts?: ZoomOptions): void;
-    /**
-     * Change the scale level so that the content covers the container
-     */
-    zoomToCover(opts?: ZoomOptions): void;
-    /**
-     * Change the scale level so that the content has full width and height (e.g, on a 1-to-1 scale)
-     */
-    zoomToFull(opts?: ZoomOptions): void;
-    /**
-     * Change the scale level to maximum
-     */
-    zoomToMax(opts?: ZoomOptions): void;
-    /**
-     * Toggle `full` scale level: `fit` -> `full` -> `fit`
-     */
-    toggleZoom(opts?: ZoomOptions): void;
-    /**
-     * Toggle scale level: `fit` -> `max` -> `fit`
-     */
-    toggleMax(opts?: ZoomOptions): void;
-    /**
-     * Toggle scale level: `fit` -> `cover` -> `fit`
-     */
-    toggleCover(opts?: ZoomOptions): void;
-    /**
-     * Iterate scale level: `fit` -> `full` -> `max` -> `fit`
-     */
-    iterateZoom(opts?: ZoomOptions): void;
-    /**
-     * Scale the content to a specific step or level.
-     * Note: Origin `[0,0]` is in the center, because content has CSS `transform-origin: center center;`
-     */
-    zoomTo(zoomLevel?: number | "fit" | "cover" | "full" | "max" | "next", { friction, originX, originY, event, }?: ZoomOptions): void;
-    /**
-     * Rotate the content counterclockwise
-     */
-    rotateCCW(): void;
-    /**
-     * Rotate the content clockwise
-     */
-    rotateCW(): void;
-    /**
-     * Flip content horizontally
-     */
-    flipX(): void;
-    /**
-     * Flip content vertically
-     */
-    flipY(): void;
-    /**
-     * Change the scale level so that the content fits the container horizontally
-     */
-    fitX(): void;
-    /**
-     * Change the scale level so that the content fits the container vertically
-     */
-    fitY(): void;
-    /**
-     * Toggle full screen mode
-     */
-    toggleFS(): void;
-    /**
-     * Get transformation matrix values
-     */
-    getMatrix(source?: MatrixValues): DOMMatrix;
-    /**
-     * Reset all transformations AND animate to the original position
-     */
-    reset(friction?: number): void;
-    /**
-     * Destroy the instance
-     */
-    destroy(): void;
-}
+import { Component } from "../shared/Base/Component";
+import { PluginsType, EventsType, Bounds, MatrixValues, ZoomOptions } from "./types";
+import { States } from "./consts";
+import { OptionsType } from "./options";
+export declare class Panzoom extends Component<OptionsType, EventsType> {
+    static defaults: Partial<OptionsType>;
+    static Plugins: PluginsType;
+    private pointerTracker;
+    private resizeObserver;
+    private updateTimer;
+    private clickTimer;
+    private rAF;
+    private isTicking;
+    private friction;
+    private ignoreBounds;
+    private isBouncingX;
+    private isBouncingY;
+    private clicks;
+    private trackingPoints;
+    private pwt;
+    private cwd;
+    private pmme;
+    /**
+     * Current state of the instance
+     */
+    state: States;
+    /**
+     * True if the user is currently dragging
+     */
+    isDragging: boolean;
+    /**
+     * Reference to the container element
+     */
+    container: HTMLElement;
+    /**
+     * Reference to the content element
+     */
+    content: HTMLElement | HTMLImageElement | HTMLPictureElement;
+    /**
+     * Reference to the loading indicator element
+     */
+    spinner: HTMLElement | null;
+    /**
+     * Container dimensions.
+     * `innerWidth` & `innerHeight` values are width/height without padding.
+     */
+    containerRect: {
+        width: number;
+        height: number;
+        innerWidth: number;
+        innerHeight: number;
+    };
+    /**
+     * Content dimensions and position relative to parent.
+     * `width` & `height` values are in current scale.
+     */
+    contentRect: {
+        top: number;
+        right: number;
+        bottom: number;
+        left: number;
+        fullWidth: number;
+        fullHeight: number;
+        fitWidth: number;
+        fitHeight: number;
+        width: number;
+        height: number;
+    };
+    /**
+     * Initial position of the drag
+     */
+    dragStart: {
+        x: number;
+        y: number;
+        top: number;
+        left: number;
+        time: number;
+    };
+    /**
+     * Current position of the drag
+     */
+    dragOffset: {
+        x: number;
+        y: number;
+        time: number;
+    };
+    /**
+     * Transformation matrix values that define current x/y position and scale
+     */
+    current: MatrixValues;
+    /**
+     * Transformation matrix values that define the x/y position and scale of the end of the current animation
+     */
+    target: MatrixValues;
+    /**
+     * The velocity of each transformation matrix value
+     */
+    velocity: MatrixValues;
+    /**
+     * Axis that is currently locked
+     */
+    lockedAxis: false | "x" | "y";
+    /**
+     * True if the user is on a touch device
+     */
+    get isTouchDevice(): boolean;
+    get isMobile(): boolean;
+    /**
+     * Current pan mode - `mousemove` or `drag`
+     */
+    get panMode(): "drag" | "mousemove";
+    /**
+     * If the content can be dragged when it fits into the container
+     */
+    get panOnlyZoomed(): boolean | ((...any: any) => boolean | "auto");
+    /**
+     * True if the content has any boundaries
+     */
+    get isInfinite(): boolean | "x" | "y";
+    /**
+     * At what angle the content is rotated
+     */
+    get angle(): number;
+    /**
+     * At what angle the content is rotated at the end of the current animation
+     */
+    get targetAngle(): number;
+    /**
+     * At what scale the content is scaled
+     */
+    get scale(): number;
+    /**
+     * At what scale the content is scaled at the end of the current animation
+     */
+    get targetScale(): number;
+    /**
+     * Minimum scale level
+     */
+    get minScale(): number;
+    /**
+     * At what scale the content will be at full width and height (1 to 1)
+     */
+    get fullScale(): number;
+    /**
+     * Maximum scale level given the `maxScale` option
+     */
+    get maxScale(): number;
+    /**
+     * At what scale the content will cover the container
+     */
+    get coverScale(): number;
+    /**
+     * True if the content is currently animated and the scale level is changing
+     */
+    get isScaling(): boolean;
+    /**
+     * True if the content (image) has not finished loading
+     */
+    get isContentLoading(): boolean;
+    /**
+     * True if the animation is complete and the content fits within the bounds
+     */
+    get isResting(): boolean;
+    constructor(container: HTMLElement | null, userOptions?: Partial<OptionsType>, userPlugins?: PluginsType);
+    private initContent;
+    private onLoad;
+    private onError;
+    /**
+     * Initialize the resize observer
+     */
+    attachObserver(): void;
+    /**
+     * Remove the resize observer
+     */
+    detachObserver(): void;
+    /**
+     * Enable click, wheel, mousemove and all touch events
+     */
+    attachEvents(): void;
+    /**
+     * Remove click, wheel, mouse movement and all touch events
+     */
+    detachEvents(): void;
+    private animate;
+    private setTargetForce;
+    private checkBounds;
+    private clampTargetBounds;
+    private calculateContentDim;
+    private setEdgeForce;
+    private enable;
+    private onClick;
+    private addTrackingPoint;
+    private onPointerDown;
+    private onPointerMove;
+    private onPointerUp;
+    private startDecelAnim;
+    private onWheel;
+    private onMouseMove;
+    private onKeydown;
+    private onResize;
+    private setTransform;
+    /**
+     * Calculate dimensions of contents and container
+     */
+    updateMetrics(silently?: boolean): void;
+    /**
+     * Get information about current content boundaries
+     */
+    getBounds(): Bounds;
+    /**
+     * Enable or disable controls depending on the current size of the content
+     */
+    updateControls(): void;
+    /**
+     * Pan content to selected position and scale, use `friction` to control duration
+     */
+    panTo({ x, y, scale, friction, angle, originX, originY, flipX, flipY, ignoreBounds, }: {
+        x?: number;
+        y?: number;
+        scale?: number;
+        friction?: number;
+        angle?: number;
+        originX?: number;
+        originY?: number;
+        flipX?: boolean;
+        flipY?: boolean;
+        ignoreBounds?: boolean;
+    }): void;
+    /**
+     * Relatively change position, scale, or angle of content, and flip content horizontally or vertically
+     */
+    applyChange({ panX, panY, scale, angle, originX, originY, friction, flipX, flipY, ignoreBounds, bounce, }: {
+        panX?: number;
+        panY?: number;
+        scale?: number;
+        angle?: number;
+        originX?: number;
+        originY?: number;
+        friction?: number;
+        flipX?: boolean;
+        flipY?: boolean;
+        ignoreBounds?: boolean;
+        bounce?: boolean;
+    }): void;
+    /**
+     * Stop animation and optionally set target values to the current values (or vice versa)
+     */
+    stop(freeze?: "current" | "target" | false): void;
+    /**
+     * Request an animation frame to check if the content position or scale needs to be changed based on the target values or if the content is out of bounds
+     */
+    requestTick(): void;
+    /**
+     * Update the current position based on the mouse move event
+     */
+    panWithMouse(event: MouseEvent, friction?: number): void;
+    /**
+     * Update the current scale based on the mouse scroll event
+     */
+    zoomWithWheel(event: WheelEvent): void;
+    /**
+     * Check if the content can be scaled up
+     */
+    canZoomIn(): boolean;
+    /**
+     * Check if the content can be scaled down
+     */
+    canZoomOut(): boolean;
+    /**
+     * Increase scale level
+     */
+    zoomIn(scale?: number, opts?: ZoomOptions): void;
+    /**
+     * Reduce scale level
+     */
+    zoomOut(scale?: number, opts?: ZoomOptions): void;
+    /**
+     * Change the scale level so that the content fits inside the container
+     */
+    zoomToFit(opts?: ZoomOptions): void;
+    /**
+     * Change the scale level so that the content covers the container
+     */
+    zoomToCover(opts?: ZoomOptions): void;
+    /**
+     * Change the scale level so that the content has full width and height (e.g, on a 1-to-1 scale)
+     */
+    zoomToFull(opts?: ZoomOptions): void;
+    /**
+     * Change the scale level to maximum
+     */
+    zoomToMax(opts?: ZoomOptions): void;
+    /**
+     * Toggle `full` scale level: `fit` -> `full` -> `fit`
+     */
+    toggleZoom(opts?: ZoomOptions): void;
+    /**
+     * Toggle scale level: `fit` -> `max` -> `fit`
+     */
+    toggleMax(opts?: ZoomOptions): void;
+    /**
+     * Toggle scale level: `fit` -> `cover` -> `fit`
+     */
+    toggleCover(opts?: ZoomOptions): void;
+    /**
+     * Iterate scale level: `fit` -> `full` -> `max` -> `fit`
+     */
+    iterateZoom(opts?: ZoomOptions): void;
+    /**
+     * Scale the content to a specific step or level.
+     * Note: Origin `[0,0]` is in the center, because content has CSS `transform-origin: center center;`
+     */
+    zoomTo(zoomLevel?: number | "fit" | "cover" | "full" | "max" | "next", { friction, originX, originY, event, }?: ZoomOptions): void;
+    /**
+     * Rotate the content counterclockwise
+     */
+    rotateCCW(): void;
+    /**
+     * Rotate the content clockwise
+     */
+    rotateCW(): void;
+    /**
+     * Flip content horizontally
+     */
+    flipX(): void;
+    /**
+     * Flip content vertically
+     */
+    flipY(): void;
+    /**
+     * Change the scale level so that the content fits the container horizontally
+     */
+    fitX(): void;
+    /**
+     * Change the scale level so that the content fits the container vertically
+     */
+    fitY(): void;
+    /**
+     * Toggle full screen mode
+     */
+    toggleFS(): void;
+    /**
+     * Get transformation matrix values
+     */
+    getMatrix(source?: MatrixValues): DOMMatrix;
+    /**
+     * Reset all transformations AND animate to the original position
+     */
+    reset(friction?: number): void;
+    /**
+     * Destroy the instance
+     */
+    destroy(): void;
+}

types/Panzoom/consts.d.ts

@@ -1,9 +1,9 @@
-export declare enum States {
-    Init = 0,
-    Error = 1,
-    Ready = 2,
-    Panning = 3,
-    Mousemove = 4,
-    Destroy = 5
-}
-export declare const MatrixKeys: readonly ["a", "b", "c", "d", "e", "f"];
+export declare enum States {
+    Init = 0,
+    Error = 1,
+    Ready = 2,
+    Panning = 3,
+    Mousemove = 4,
+    Destroy = 5
+}
+export declare const MatrixKeys: readonly ["a", "b", "c", "d", "e", "f"];

types/Panzoom/options.d.ts

@@ -1,174 +1,174 @@
-import { Bounds, Events, ClickAction, WheelAction } from "./types";
-export interface PluginsOptionsType {
-}
-export interface classesType {
-    /**
-     * Class name that specifies the content
-     */
-    content: string;
-    /**
-     * Content is currently loading
-     */
-    isLoading: string;
-    /**
-     * Content can be zoomed in
-     */
-    canZoomIn: string;
-    /**
-     * Content can be zoomed out
-     */
-    canZoomOut: string;
-    /**
-     * Content is draggable
-     */
-    isDraggable: string;
-    /**
-     * User is currently dragging
-     */
-    isDragging: string;
-    /**
-     * Container is in the fullscreen mode
-     */
-    inFullscreen: string;
-    /**
-     * Class name applied to `html` element indicating that at least one container is in full screen mode
-     */
-    htmlHasFullscreen: string;
-}
-export interface ComponentOptionsType {
-    /**
-     * Specify the content element. If no content is specified, it will be assumed that the content is the first child element
-     */
-    content: Element | null | ((...any: any) => Element | null);
-    /**
-     * Content width
-     */
-    width: "auto" | number | ((...any: any) => "auto" | number);
-    /**
-     * Content height
-     */
-    height: "auto" | number | ((...any: any) => "auto" | number);
-    /**
-     * Use touch events to pan content or follow the cursor.
-     * Automatically switches to `drag` if user’s primary input mechanism can not hover over elements.
-     * Tip: experiment with `mouseMoveFactor` option for better ux.
-     */
-    panMode: "drag" | "mousemove";
-    /**
-     * Enable touch guestures
-     */
-    touch: boolean | ((...any: any) => boolean);
-    /**
-     * If a CSS transformation is to be applied to the parent element of the content
-     */
-    transformParent: boolean;
-    /**
-     * Minimum touch drag distance to start panning content;
-     * it can help detect click events on touch devices
-     */
-    dragMinThreshold: number;
-    /**
-     * Lock axis while dragging
-     */
-    lockAxis: "x" | "y" | "xy" | false;
-    /**
-     * The proportion by which the content pans relative to the cursor position;
-     * for example, `2` means the cursor only needs to move 80% of the width/height of the content to reach the container border
-     */
-    mouseMoveFactor: number;
-    /**
-     * Animation friction when content is moved depending on cursor position
-     */
-    mouseMoveFriction: number;
-    /**
-     * Globally enable (or disable) any zooming
-     */
-    zoom: boolean | ((...any: any) => boolean);
-    /**
-     * Enable pinch-to-zoom guesture to zoom in/out using two fingers
-     */
-    pinchToZoom: boolean | ((...any: any) => boolean);
-    /**
-     * Allow panning only when content is zoomed in.
-     * Using `true` allows other components (e.g. Carousel) to pick up touch events.
-     * Note: if set to "auto", disables for touch devices (to allow page scrolling).
-     */
-    panOnlyZoomed: boolean | "auto" | ((...any: any) => boolean | "auto");
-    /**
-     * Minimum scale level
-     */
-    minScale: number | ((...any: any) => number);
-    /**
-     * The maximum zoom level the user can zoom.
-     * If, for example, it is `2`, then the user can zoom content to 2x the original size
-     */
-    maxScale: number | ((...any: any) => number);
-    /**
-     * Default friction for animations, the value must be in the interval [0, 1)
-     */
-    friction: number;
-    /**
-     * Friction while panning/dragging
-     */
-    dragFriction: number;
-    /**
-     * Friction while decelerating after drag end
-     */
-    decelFriction: number;
-    /**
-     * Add click event listener
-     */
-    click: ClickAction | ((...any: any) => ClickAction);
-    /**
-     * Add double click event listener
-     */
-    dblClick: ClickAction | ((...any: any) => ClickAction);
-    /**
-     * Add mouse wheel event listener
-     */
-    wheel: WheelAction | ((...any: any) => WheelAction);
-    /**
-     * Number of times to stop restricting wheel operation after min/max zoom level is reached
-     */
-    wheelLimit: number;
-    /**
-     * Content x/y boundaries
-     */
-    bounds: "auto" | ((...any: any) => Bounds);
-    /**
-     * Force to ignore boundaries boundar; always or only when the drag is locked on the axis
-     */
-    infinite: boolean | "x" | "y";
-    /**
-     * If enable rubberband effect - drag out of bounds with resistance
-     */
-    rubberband: boolean;
-    /**
-     * Show loading icon
-     */
-    spinner: boolean;
-    /**
-     * Bounce after hitting the edge
-     */
-    bounce: boolean;
-    /**
-     * Limit the animation's maximum acceleration
-     */
-    maxVelocity: number | ((...any: any) => number);
-    /**
-     * Class names for DOM elements
-     */
-    classes: classesType;
-    /**
-     * Localization of strings
-     */
-    l10n?: Record<string, string>;
-    /**
-     * Optional event listeners
-     */
-    on?: Partial<Events>;
-    Pins?: any;
-    Toolbar?: any;
-}
-export declare const defaultOptions: ComponentOptionsType;
-export type OptionsType = PluginsOptionsType & ComponentOptionsType;
+import { Bounds, Events, ClickAction, WheelAction } from "./types";
+export interface PluginsOptionsType {
+}
+export interface classesType {
+    /**
+     * Class name that specifies the content
+     */
+    content: string;
+    /**
+     * Content is currently loading
+     */
+    isLoading: string;
+    /**
+     * Content can be zoomed in
+     */
+    canZoomIn: string;
+    /**
+     * Content can be zoomed out
+     */
+    canZoomOut: string;
+    /**
+     * Content is draggable
+     */
+    isDraggable: string;
+    /**
+     * User is currently dragging
+     */
+    isDragging: string;
+    /**
+     * Container is in the fullscreen mode
+     */
+    inFullscreen: string;
+    /**
+     * Class name applied to `html` element indicating that at least one container is in full screen mode
+     */
+    htmlHasFullscreen: string;
+}
+export interface ComponentOptionsType {
+    /**
+     * Specify the content element. If no content is specified, it will be assumed that the content is the first child element
+     */
+    content: Element | null | ((...any: any) => Element | null);
+    /**
+     * Content width
+     */
+    width: "auto" | number | ((...any: any) => "auto" | number);
+    /**
+     * Content height
+     */
+    height: "auto" | number | ((...any: any) => "auto" | number);
+    /**
+     * Use touch events to pan content or follow the cursor.
+     * Automatically switches to `drag` if user’s primary input mechanism can not hover over elements.
+     * Tip: experiment with `mouseMoveFactor` option for better ux.
+     */
+    panMode: "drag" | "mousemove";
+    /**
+     * Enable touch guestures
+     */
+    touch: boolean | ((...any: any) => boolean);
+    /**
+     * If a CSS transformation is to be applied to the parent element of the content
+     */
+    transformParent: boolean;
+    /**
+     * Minimum touch drag distance to start panning content;
+     * it can help detect click events on touch devices
+     */
+    dragMinThreshold: number;
+    /**
+     * Lock axis while dragging
+     */
+    lockAxis: "x" | "y" | "xy" | false;
+    /**
+     * The proportion by which the content pans relative to the cursor position;
+     * for example, `2` means the cursor only needs to move 80% of the width/height of the content to reach the container border
+     */
+    mouseMoveFactor: number;
+    /**
+     * Animation friction when content is moved depending on cursor position
+     */
+    mouseMoveFriction: number;
+    /**
+     * Globally enable (or disable) any zooming
+     */
+    zoom: boolean | ((...any: any) => boolean);
+    /**
+     * Enable pinch-to-zoom guesture to zoom in/out using two fingers
+     */
+    pinchToZoom: boolean | ((...any: any) => boolean);
+    /**
+     * Allow panning only when content is zoomed in.
+     * Using `true` allows other components (e.g. Carousel) to pick up touch events.
+     * Note: if set to "auto", disables for touch devices (to allow page scrolling).
+     */
+    panOnlyZoomed: boolean | "auto" | ((...any: any) => boolean | "auto");
+    /**
+     * Minimum scale level
+     */
+    minScale: number | ((...any: any) => number);
+    /**
+     * The maximum zoom level the user can zoom.
+     * If, for example, it is `2`, then the user can zoom content to 2x the original size
+     */
+    maxScale: number | ((...any: any) => number);
+    /**
+     * Default friction for animations, the value must be in the interval [0, 1)
+     */
+    friction: number;
+    /**
+     * Friction while panning/dragging
+     */
+    dragFriction: number;
+    /**
+     * Friction while decelerating after drag end
+     */
+    decelFriction: number;
+    /**
+     * Add click event listener
+     */
+    click: ClickAction | ((...any: any) => ClickAction);
+    /**
+     * Add double click event listener
+     */
+    dblClick: ClickAction | ((...any: any) => ClickAction);
+    /**
+     * Add mouse wheel event listener
+     */
+    wheel: WheelAction | ((...any: any) => WheelAction);
+    /**
+     * Number of times to stop restricting wheel operation after min/max zoom level is reached
+     */
+    wheelLimit: number;
+    /**
+     * Content x/y boundaries
+     */
+    bounds: "auto" | ((...any: any) => Bounds);
+    /**
+     * Force to ignore boundaries boundar; always or only when the drag is locked on the axis
+     */
+    infinite: boolean | "x" | "y";
+    /**
+     * If enable rubberband effect - drag out of bounds with resistance
+     */
+    rubberband: boolean;
+    /**
+     * Show loading icon
+     */
+    spinner: boolean;
+    /**
+     * Bounce after hitting the edge
+     */
+    bounce: boolean;
+    /**
+     * Limit the animation's maximum acceleration
+     */
+    maxVelocity: number | ((...any: any) => number);
+    /**
+     * Class names for DOM elements
+     */
+    classes: classesType;
+    /**
+     * Localization of strings
+     */
+    l10n?: Record<string, string>;
+    /**
+     * Optional event listeners
+     */
+    on?: Partial<Events>;
+    Pins?: any;
+    Toolbar?: any;
+}
+export declare const defaultOptions: ComponentOptionsType;
+export type OptionsType = PluginsOptionsType & ComponentOptionsType;

types/Panzoom/plugins/index.d.ts

@@ -1,2 +1,2 @@
-import { PluginsType } from "../types";
-export declare const Plugins: PluginsType;
+import { PluginsType } from "../types";
+export declare const Plugins: PluginsType;

types/Panzoom/types.d.ts

@@ -1,113 +1,113 @@
-import { MatrixKeys } from "./consts";
-export type MatrixValues = {
-    [K in typeof MatrixKeys[number]]: number;
-};
-export type Bounds = {
-    x: {
-        min: number;
-        max: number;
-    };
-    y: {
-        min: number;
-        max: number;
-    };
-};
-import { ComponentEventsType } from "../shared/Base/types";
-export type EventsType = ComponentEventsType
-/**
- * Initialization has started, plugins have been added
- */
- | "init"
-/**
- * Content is loading
- */
- | "beforeLoad"
-/**
- * Content has loaded successfully
- */
- | "afterLoad"
-/**
- * Content did not load successfully
- */
- | "error"
-/**
- * Panzoom has successfully launched
- */
- | "ready"
-/**
- * Single click event has been detected
- */
- | "click"
-/**
- * Double click event has been detected
- */
- | "dblClick"
-/**
- * Wheel event has been detected
- */
- | "wheel"
-/**
- * Container and content dimensions have been updated
- */
- | "refresh"
-/**
- * Pointer down event has been detected
- */
- | "touchStart"
-/**
- * Pointer move event has been detected
- */
- | "touchMove"
-/**
- * Pointer up/cancel event has been detected
- */
- | "touchEnd"
-/**
- * Deceleration animation has started
- */
- | "decel"
-/**
- * Mouse move event has been detected
- */
- | "mouseMove"
-/**
- * Animation has started
- */
- | "startAnimation"
-/**
- * Animation has ended
- */
- | "endAnimation"
-/**
- * The "transform" CSS property of the content will be updated.
- */
- | "beforeTransform"
-/**
- * The "transform" CSS property of the content has been updated
- */
- | "afterTransform"
-/**
- * Enter full-screen mode
- */
- | "enterFS"
-/**
- * Exit full-screen mode
- */
- | "exitFS"
-/**
- * Instance is detroyed
- */
- | "destroy";
-export type Events = Record<EventsType, (...args: any[]) => void>;
-import { Constructor } from "../shared/Base/types";
-import { Plugin } from "../shared/Base/Plugin";
-import { Panzoom } from "./Panzoom";
-export type PluginsType = Record<string, Constructor<Plugin<Panzoom, any, any>>>;
-export type ClickAction = "toggleZoom" | "toggleCover" | "toggleMax" | "zoomToFit" | "zoomToMax" | "iterateZoom" | false;
-export type WheelAction = "zoom" | "pan" | false;
-export type ZoomOptions = {
-    friction?: number | "auto";
-    originX?: number;
-    originY?: number;
-    event?: Event & MouseEvent;
-};
+import { MatrixKeys } from "./consts";
+export type MatrixValues = {
+    [K in typeof MatrixKeys[number]]: number;
+};
+export type Bounds = {
+    x: {
+        min: number;
+        max: number;
+    };
+    y: {
+        min: number;
+        max: number;
+    };
+};
+import { ComponentEventsType } from "../shared/Base/types";
+export type EventsType = ComponentEventsType
+/**
+ * Initialization has started, plugins have been added
+ */
+ | "init"
+/**
+ * Content is loading
+ */
+ | "beforeLoad"
+/**
+ * Content has loaded successfully
+ */
+ | "afterLoad"
+/**
+ * Content did not load successfully
+ */
+ | "error"
+/**
+ * Panzoom has successfully launched
+ */
+ | "ready"
+/**
+ * Single click event has been detected
+ */
+ | "click"
+/**
+ * Double click event has been detected
+ */
+ | "dblClick"
+/**
+ * Wheel event has been detected
+ */
+ | "wheel"
+/**
+ * Container and content dimensions have been updated
+ */
+ | "refresh"
+/**
+ * Pointer down event has been detected
+ */
+ | "touchStart"
+/**
+ * Pointer move event has been detected
+ */
+ | "touchMove"
+/**
+ * Pointer up/cancel event has been detected
+ */
+ | "touchEnd"
+/**
+ * Deceleration animation has started
+ */
+ | "decel"
+/**
+ * Mouse move event has been detected
+ */
+ | "mouseMove"
+/**
+ * Animation has started
+ */
+ | "startAnimation"
+/**
+ * Animation has ended
+ */
+ | "endAnimation"
+/**
+ * The "transform" CSS property of the content will be updated.
+ */
+ | "beforeTransform"
+/**
+ * The "transform" CSS property of the content has been updated
+ */
+ | "afterTransform"
+/**
+ * Enter full-screen mode
+ */
+ | "enterFS"
+/**
+ * Exit full-screen mode
+ */
+ | "exitFS"
+/**
+ * Instance is detroyed
+ */
+ | "destroy";
+export type Events = Record<EventsType, (...args: any[]) => void>;
+import { Constructor } from "../shared/Base/types";
+import { Plugin } from "../shared/Base/Plugin";
+import { Panzoom } from "./Panzoom";
+export type PluginsType = Record<string, Constructor<Plugin<Panzoom, any, any>>>;
+export type ClickAction = "toggleZoom" | "toggleCover" | "toggleMax" | "zoomToFit" | "zoomToMax" | "iterateZoom" | false;
+export type WheelAction = "zoom" | "pan" | false;
+export type ZoomOptions = {
+    friction?: number | "auto";
+    originX?: number;
+    originY?: number;
+    event?: Event & MouseEvent;
+};

types/index.d.ts

@@ -1,3 +1,3 @@
-export * from "./Panzoom/Panzoom";
-export * from "./Carousel/Carousel";
-export * from "./Fancybox/Fancybox";
+export * from "./Panzoom/Panzoom";
+export * from "./Carousel/Carousel";
+export * from "./Fancybox/Fancybox";

types/shared/Base/Base.d.ts

@@ -1,16 +1,16 @@
-import { DeepGet, DeepKeyOf, Listener } from "./types";
-export declare class Base<OptionsType, EventsType> {
-    options: Partial<OptionsType>;
-    static version: string;
-    static defaults: unknown;
-    protected events: Map<EventsType, Array<Listener>>;
-    constructor(options?: Partial<OptionsType>);
-    setOptions(options: Partial<OptionsType>): void;
-    option<T extends DeepKeyOf<OptionsType>>(key: T, ...rest: any): Exclude<DeepGet<OptionsType, T>, Function>;
-    optionFor<T extends DeepKeyOf<OptionsType>>(obj: any, key: T, fallback?: DeepGet<OptionsType, T>, ...rest: any): Exclude<DeepGet<OptionsType, T>, Function>;
-    cn(key: string): string;
-    localize(str: string, params?: Array<[string, any]>): string;
-    on(what: EventsType | EventsType[] | "*", listener: Listener): void;
-    off(what: EventsType | EventsType[] | "*", listener: Listener): void;
-    emit(event: EventsType, ...args: any[]): void;
-}
+import { DeepGet, DeepKeyOf, Listener } from "./types";
+export declare class Base<OptionsType, EventsType> {
+    options: Partial<OptionsType>;
+    static version: string;
+    static defaults: unknown;
+    protected events: Map<EventsType, Array<Listener>>;
+    constructor(options?: Partial<OptionsType>);
+    setOptions(options: Partial<OptionsType>): void;
+    option<T extends DeepKeyOf<OptionsType>>(key: T, ...rest: any): Exclude<DeepGet<OptionsType, T>, Function>;
+    optionFor<T extends DeepKeyOf<OptionsType>>(obj: any, key: T, fallback?: DeepGet<OptionsType, T>, ...rest: any): Exclude<DeepGet<OptionsType, T>, Function>;
+    cn(key: string): string;
+    localize(str: string, params?: Array<[string, any]>): string;
+    on(what: EventsType | EventsType[] | "*", listener: Listener): void;
+    off(what: EventsType | EventsType[] | "*", listener: Listener): void;
+    emit(event: EventsType, ...args: any[]): void;
+}

types/shared/Base/Component.d.ts

@@ -1,9 +1,9 @@
-import { Constructor } from "./types";
-import { Base } from "./Base";
-import { Plugin } from "./Plugin";
-export declare class Component<ComponentOptionsType, ComponentEventsType> extends Base<ComponentOptionsType, ComponentEventsType> {
-    plugins: Record<string, Plugin<Component<ComponentOptionsType, ComponentEventsType>, any, any>>;
-    constructor(options?: Partial<ComponentOptionsType>);
-    attachPlugins(Plugins?: Record<string, Constructor<Plugin<Component<ComponentOptionsType, ComponentEventsType>, any, any>>>): void;
-    detachPlugins(): this;
-}
+import { Constructor } from "./types";
+import { Base } from "./Base";
+import { Plugin } from "./Plugin";
+export declare class Component<ComponentOptionsType, ComponentEventsType> extends Base<ComponentOptionsType, ComponentEventsType> {
+    plugins: Record<string, Plugin<Component<ComponentOptionsType, ComponentEventsType>, any, any>>;
+    constructor(options?: Partial<ComponentOptionsType>);
+    attachPlugins(Plugins?: Record<string, Constructor<Plugin<Component<ComponentOptionsType, ComponentEventsType>, any, any>>>): void;
+    detachPlugins(Plugins?: string[]): this;
+}

types/shared/Base/Plugin.d.ts

@@ -1,7 +1,7 @@
-import { Base } from "./Base";
-export declare class Plugin<ComponentType, PluginOptionsType extends object, PluginEventsType extends string> extends Base<PluginOptionsType, PluginEventsType> {
-    instance: ComponentType;
-    constructor(instance: ComponentType, options: PluginOptionsType);
-    attach(): void;
-    detach(): void;
-}
+import { Base } from "./Base";
+export declare class Plugin<ComponentType, PluginOptionsType extends object, PluginEventsType extends string> extends Base<PluginOptionsType, PluginEventsType> {
+    instance: ComponentType;
+    constructor(instance: ComponentType, options: PluginOptionsType);
+    attach(): void;
+    detach(): void;
+}

types/shared/Base/types.d.ts

@@ -1,8 +1,8 @@
-export type Constructor<T = any> = new (...args: any[]) => T;
-export type Listener = (...args: any[]) => void;
-export type DeepKeyOf<O> = {
-    [K in Extract<keyof O, string>]: O[K] extends Array<any> ? K : O[K] extends Record<string, unknown> ? `${K}` | `${K}.${DeepKeyOf<O[K]>}` : K;
-}[Extract<keyof O, string>];
-export type DeepGet<O, P extends string> = P extends `${infer Key}.${infer Rest}` ? Key extends keyof O | `${bigint}` ? DeepGet<O[Key & keyof O], Rest> : never : P extends keyof O | `${bigint}` ? O[P & keyof O] : never;
-export type ComponentEventsType = "*" | "attachPlugins" | "detachPlugins";
-export type PluginEventsType = "*";
+export type Constructor<T = any> = new (...args: any[]) => T;
+export type Listener = (...args: any[]) => void;
+export type DeepKeyOf<O> = {
+    [K in Extract<keyof O, string>]: O[K] extends Array<any> ? K : O[K] extends Record<string, unknown> ? `${K}` | `${K}.${DeepKeyOf<O[K]>}` : K;
+}[Extract<keyof O, string>];
+export type DeepGet<O, P extends string> = P extends `${infer Key}.${infer Rest}` ? Key extends keyof O | `${bigint}` ? DeepGet<O[Key & keyof O], Rest> : never : P extends keyof O | `${bigint}` ? O[P & keyof O] : never;
+export type ComponentEventsType = "*" | "attachPlugins" | "detachPlugins";
+export type PluginEventsType = "*";

types/shared/buttons.d.ts

@@ -1,88 +1,88 @@
-export declare const PanzoomButtons: {
-    panLeft: {
-        icon: string;
-        change: {
-            panX: number;
-        };
-    };
-    panRight: {
-        icon: string;
-        change: {
-            panX: number;
-        };
-    };
-    panUp: {
-        icon: string;
-        change: {
-            panY: number;
-        };
-    };
-    panDown: {
-        icon: string;
-        change: {
-            panY: number;
-        };
-    };
-    zoomIn: {
-        icon: string;
-        action: string;
-    };
-    zoomOut: {
-        icon: string;
-        action: string;
-    };
-    toggle1to1: {
-        icon: string;
-        action: string;
-    };
-    toggleZoom: {
-        icon: string;
-        action: string;
-    };
-    iterateZoom: {
-        icon: string;
-        action: string;
-    };
-    rotateCCW: {
-        icon: string;
-        action: string;
-    };
-    rotateCW: {
-        icon: string;
-        action: string;
-    };
-    flipX: {
-        icon: string;
-        action: string;
-    };
-    flipY: {
-        icon: string;
-        action: string;
-    };
-    fitX: {
-        icon: string;
-        action: string;
-    };
-    fitY: {
-        icon: string;
-        action: string;
-    };
-    reset: {
-        icon: string;
-        action: string;
-    };
-    toggleFS: {
-        icon: string;
-        action: string;
-    };
-};
-export type PanzoomButtonType = {
-    icon: string;
-} & ({
-    change: Record<string, number>;
-    action?: never;
-} | {
-    action: string;
-    change?: never;
-});
-export type PanzoomButtonsType = Record<keyof typeof PanzoomButtons, PanzoomButtonType>;
+export declare const PanzoomButtons: {
+    panLeft: {
+        icon: string;
+        change: {
+            panX: number;
+        };
+    };
+    panRight: {
+        icon: string;
+        change: {
+            panX: number;
+        };
+    };
+    panUp: {
+        icon: string;
+        change: {
+            panY: number;
+        };
+    };
+    panDown: {
+        icon: string;
+        change: {
+            panY: number;
+        };
+    };
+    zoomIn: {
+        icon: string;
+        action: string;
+    };
+    zoomOut: {
+        icon: string;
+        action: string;
+    };
+    toggle1to1: {
+        icon: string;
+        action: string;
+    };
+    toggleZoom: {
+        icon: string;
+        action: string;
+    };
+    iterateZoom: {
+        icon: string;
+        action: string;
+    };
+    rotateCCW: {
+        icon: string;
+        action: string;
+    };
+    rotateCW: {
+        icon: string;
+        action: string;
+    };
+    flipX: {
+        icon: string;
+        action: string;
+    };
+    flipY: {
+        icon: string;
+        action: string;
+    };
+    fitX: {
+        icon: string;
+        action: string;
+    };
+    fitY: {
+        icon: string;
+        action: string;
+    };
+    reset: {
+        icon: string;
+        action: string;
+    };
+    toggleFS: {
+        icon: string;
+        action: string;
+    };
+};
+export type PanzoomButtonType = {
+    icon: string;
+} & ({
+    change: Record<string, number>;
+    action?: never;
+} | {
+    action: string;
+    change?: never;
+});
+export type PanzoomButtonsType = Record<keyof typeof PanzoomButtons, PanzoomButtonType>;

types/shared/spinner.d.ts

@@ -1 +1 @@
-export declare const spinner = "<div class=\"f-spinner\"><svg viewBox=\"0 0 50 50\"><circle cx=\"25\" cy=\"25\" r=\"20\"></circle><circle cx=\"25\" cy=\"25\" r=\"20\"></circle></svg></div>";
+export declare const spinner = "<div class=\"f-spinner\"><svg viewBox=\"0 0 50 50\"><circle cx=\"25\" cy=\"25\" r=\"20\"></circle><circle cx=\"25\" cy=\"25\" r=\"20\"></circle></svg></div>";

types/shared/utils/PointerTracker.d.ts

@@ -1,45 +1,45 @@
-export interface Point {
-    clientX: number;
-    clientY: number;
-}
-export declare class Pointer {
-    pageX: number;
-    pageY: number;
-    clientX: number;
-    clientY: number;
-    id: number;
-    time: number;
-    nativePointer: Touch | MouseEvent;
-    constructor(nativePointer: Touch | MouseEvent);
-}
-export type InputEvent = TouchEvent | MouseEvent;
-type StartCallback = (event: InputEvent, pointer: Pointer, currentPointers: Pointer[]) => boolean;
-type MoveCallback = (event: InputEvent, changedPointers: Pointer[], previousPointers: Pointer[]) => void;
-type EndCallback = (event: InputEvent, pointer: Pointer, currentPointers: Pointer[]) => void;
-interface PointerTrackerOptions {
-    start: StartCallback;
-    move?: MoveCallback;
-    end?: EndCallback;
-}
-export declare class PointerTracker {
-    private element;
-    private startCallback;
-    private moveCallback;
-    private endCallback;
-    readonly currentPointers: Pointer[];
-    readonly startPointers: Pointer[];
-    constructor(element: HTMLElement, { start, move, end, }: PointerTrackerOptions);
-    private onPointerStart;
-    private onTouchStart;
-    private onMove;
-    private onPointerEnd;
-    private onTouchEnd;
-    private triggerPointerStart;
-    private triggerPointerEnd;
-    private onWindowBlur;
-    clear(): void;
-    stop(): void;
-}
-export declare function getDistance(a: Point, b?: Point): number;
-export declare function getMidpoint(a: Point, b?: Point): Point;
-export {};
+export interface Point {
+    clientX: number;
+    clientY: number;
+}
+export declare class Pointer {
+    pageX: number;
+    pageY: number;
+    clientX: number;
+    clientY: number;
+    id: number;
+    time: number;
+    nativePointer: Touch | MouseEvent;
+    constructor(nativePointer: Touch | MouseEvent);
+}
+export type InputEvent = TouchEvent | MouseEvent;
+type StartCallback = (event: InputEvent, pointer: Pointer, currentPointers: Pointer[]) => boolean;
+type MoveCallback = (event: InputEvent, changedPointers: Pointer[], previousPointers: Pointer[]) => void;
+type EndCallback = (event: InputEvent, pointer: Pointer, currentPointers: Pointer[]) => void;
+interface PointerTrackerOptions {
+    start: StartCallback;
+    move?: MoveCallback;
+    end?: EndCallback;
+}
+export declare class PointerTracker {
+    private element;
+    private startCallback;
+    private moveCallback;
+    private endCallback;
+    readonly currentPointers: Pointer[];
+    readonly startPointers: Pointer[];
+    constructor(element: HTMLElement, { start, move, end, }: PointerTrackerOptions);
+    private onPointerStart;
+    private onTouchStart;
+    private onMove;
+    private onPointerEnd;
+    private onTouchEnd;
+    private triggerPointerStart;
+    private triggerPointerEnd;
+    private onWindowBlur;
+    clear(): void;
+    stop(): void;
+}
+export declare function getDistance(a: Point, b?: Point): number;
+export declare function getMidpoint(a: Point, b?: Point): Point;
+export {};

types/shared/utils/addClass.d.ts

@@ -1 +1 @@
-export declare const addClass: (el: HTMLElement | null, classes?: string) => void;
+export declare const addClass: (el: HTMLElement | null, classes?: string) => void;

types/shared/utils/canUseDOM.d.ts

@@ -1,4 +1,4 @@
-/**
- * Detect if rendering from the client or the server
- */
-export declare const canUseDOM: boolean;
+/**
+ * Detect if rendering from the client or the server
+ */
+export declare const canUseDOM: boolean;

types/shared/utils/getDimensions.d.ts

@@ -1,15 +1,15 @@
-/**
- * Get actual width of the element, regardless of how much of content is currently visible
- */
-export declare const getFullWidth: (elem: HTMLImageElement | SVGSVGElement | HTMLElement) => number;
-/**
- * Get actual height of the element, regardless of how much of content is currently visible
- */
-export declare const getFullHeight: (elem: HTMLImageElement | SVGSVGElement | HTMLElement) => number;
-/**
- * Calculate bounding size to fit dimensions while preserving aspect ratio
- */
-export declare const calculateAspectRatioFit: (srcWidth: number, srcHeight: number, maxWidth: number, maxHeight: number) => {
-    width: number;
-    height: number;
-};
+/**
+ * Get actual width of the element, regardless of how much of content is currently visible
+ */
+export declare const getFullWidth: (elem: HTMLImageElement | SVGSVGElement | HTMLElement) => number;
+/**
+ * Get actual height of the element, regardless of how much of content is currently visible
+ */
+export declare const getFullHeight: (elem: HTMLImageElement | SVGSVGElement | HTMLElement) => number;
+/**
+ * Calculate bounding size to fit dimensions while preserving aspect ratio
+ */
+export declare const calculateAspectRatioFit: (srcWidth: number, srcHeight: number, maxWidth: number, maxHeight: number) => {
+    width: number;
+    height: number;
+};

types/shared/utils/getDirectChildren.d.ts

@@ -1 +1 @@
-export declare const getDirectChildren: (parent: Element, sel?: string) => Element[];
+export declare const getDirectChildren: (parent: Element, sel?: string) => Element[];

types/shared/utils/getScrollableParent.d.ts

@@ -1,2 +1,2 @@
-export declare const isScrollable: (ele: HTMLElement | null) => boolean;
-export declare const getScrollableParent: (ele: HTMLElement, limit?: HTMLElement | undefined) => false | HTMLElement;
+export declare const isScrollable: (ele: HTMLElement | null) => boolean;
+export declare const getScrollableParent: (ele: HTMLElement, limit?: HTMLElement | undefined) => false | HTMLElement;

types/shared/utils/isInViewport.d.ts

@@ -1 +1 @@
-export declare const isInViewport: (element: HTMLElement) => number;
+export declare const isInViewport: (element: HTMLElement) => number;

types/shared/utils/isNode.d.ts

@@ -1 +1 @@
-export declare const isNode: (variable: any) => boolean;
+export declare const isNode: (variable: any) => boolean;

types/shared/utils/isPlainObject.d.ts

@@ -1 +1 @@
-export declare const isPlainObject: (obj: any) => boolean;
+export declare const isPlainObject: (obj: any) => boolean;

types/shared/utils/merge.d.ts

@@ -1 +1 @@
-export declare const merge: <T extends Record<string, any>>(target: T, ...sources: T[]) => T;
+export declare const merge: <T extends Record<string, any>>(target: T, ...sources: T[]) => T;

types/shared/utils/removeClass.d.ts

@@ -1 +1 @@
-export declare const removeClass: (el: HTMLElement | null, classes?: string) => void;
+export declare const removeClass: (el: HTMLElement | null, classes?: string) => void;

types/shared/utils/resolve.d.ts

@@ -1 +1 @@
-export declare const resolve: <T>(path: string, obj: T) => any;
+export declare const resolve: <T>(path: string, obj: T) => any;

types/shared/utils/round.d.ts

@@ -1,4 +1,4 @@
-/**
- * Round half up; to be more specific and to ensure things like 1.005 round correctly
- */
-export declare const round: (value: number | string, precision?: number) => number;
+/**
+ * Round half up; to be more specific and to ensure things like 1.005 round correctly
+ */
+export declare const round: (value: number | string, precision?: number) => number;

types/shared/utils/setFocusOn.d.ts

@@ -1,2 +1,2 @@
-export declare const FOCUSABLE_ELEMENTS: string;
-export declare const setFocusOn: (node: HTMLElement) => void;
+export declare const FOCUSABLE_ELEMENTS: string;
+export declare const setFocusOn: (node: HTMLElement) => void;

types/shared/utils/splitClasses.d.ts

@@ -1 +1 @@
-export declare const splitClasses: (classes?: string) => string[];
+export declare const splitClasses: (classes?: string) => string[];

types/shared/utils/stringToHtml.d.ts

@@ -1 +1 @@
-export declare const stringToHtml: (str: string) => HTMLElement;
+export declare const stringToHtml: (str: string) => HTMLElement;

types/shared/utils/throttle.d.ts

@@ -1,5 +1,5 @@
-/**
- * Returns a throttled version of a given function that is only invoked at most
- * once within a given threshold of time in milliseconds.
- */
-export declare const throttle: (func: Function, timeout: number) => (...args: any) => void;
+/**
+ * Returns a throttled version of a given function that is only invoked at most
+ * once within a given threshold of time in milliseconds.
+ */
+export declare const throttle: (func: Function, timeout: number) => (...args: any) => void;

types/shared/utils/toggleClass.d.ts

@@ -1 +1 @@
-export declare const toggleClass: (el: HTMLElement, classes?: string, condition?: boolean) => void;
+export declare const toggleClass: (el: HTMLElement, classes?: string, condition?: boolean) => void;