lightgallery 2.9.0 → 3.0.0-beta.2

package/dist/plugins/hash/lg-hash.umd.js

@@ -0,0 +1,210 @@
+(function(global, factory) {
+  typeof exports === "object" && typeof module !== "undefined" ? module.exports = factory() : typeof define === "function" && define.amd ? define(factory) : (global = typeof globalThis !== "undefined" ? globalThis : global || self, global.lgHash = factory());
+})(this, function() {
+  "use strict";/*!
+ * lightgallery | 3.0.0-beta.2 | October 1st 2026
+ * http://www.lightgalleryjs.com/
+ * Copyright (c) 2020 Sachin Neravath;
+ * @license GPLv3
+ */
+
+  function createHistoryHashDriver(win) {
+    return {
+      kind: "history",
+      getHash: () => win.location.hash || "",
+      replaceHash: (hash) => win.history.replaceState(
+        null,
+        "",
+        win.location.pathname + win.location.search + hash
+      ),
+      clearHash: () => win.history.replaceState(
+        null,
+        "",
+        win.location.pathname + win.location.search
+      ),
+      subscribe: (onChange) => {
+        win.addEventListener("hashchange", onChange);
+        return () => win.removeEventListener("hashchange", onChange);
+      }
+    };
+  }
+  function settleNavigateResult(result) {
+    var _a, _b, _c, _d;
+    const promises = result;
+    (_b = (_a = promises == null ? void 0 : promises.committed) == null ? void 0 : _a.catch) == null ? void 0 : _b.call(_a, () => void 0);
+    (_d = (_c = promises == null ? void 0 : promises.finished) == null ? void 0 : _c.catch) == null ? void 0 : _d.call(_c, () => void 0);
+  }
+  function createNavigationHashDriver(win, navigation) {
+    const getHash = () => {
+      var _a;
+      const url = (_a = navigation.currentEntry) == null ? void 0 : _a.url;
+      if (typeof url === "string") {
+        const index = url.indexOf("#");
+        return index === -1 ? "" : url.slice(index);
+      }
+      return win.location.hash || "";
+    };
+    return {
+      kind: "navigation",
+      getHash,
+      replaceHash: (hash) => settleNavigateResult(
+        navigation.navigate(
+          win.location.pathname + win.location.search + hash,
+          { history: "replace", state: { lgHash: hash } }
+        )
+      ),
+      clearHash: () => (
+        // Not navigate(): a destination without a fragment is a
+        // *cross-document* navigation (the same-document fast path
+        // requires the destination to have one), so clearing the hash
+        // through it reloads the page every time a gallery closes.
+        // replaceState drops the fragment in place, and the entry
+        // change still reaches `currententrychange` subscribers.
+        win.history.replaceState(
+          null,
+          "",
+          win.location.pathname + win.location.search
+        )
+      ),
+      subscribe: (onChange) => {
+        navigation.addEventListener("currententrychange", onChange);
+        return () => navigation.removeEventListener("currententrychange", onChange);
+      }
+    };
+  }
+  function createHashDriver(win, preference = "auto") {
+    const navigation = win.navigation;
+    const navigationCapable = !!navigation && typeof navigation.navigate === "function" && typeof navigation.addEventListener === "function" && typeof navigation.removeEventListener === "function";
+    if (preference !== "history" && navigationCapable) {
+      return createNavigationHashDriver(win, navigation);
+    }
+    return createHistoryHashDriver(win);
+  }
+  const lGEvents = {
+    afterSlide: "lgAfterSlide",
+    afterClose: "lgAfterClose"
+  };
+  const hashSettings = {
+    hash: true,
+    hashDriver: "auto",
+    galleryId: "1",
+    customSlideName: false
+  };
+  var __defProp = Object.defineProperty;
+  var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+  var __hasOwnProp = Object.prototype.hasOwnProperty;
+  var __propIsEnum = Object.prototype.propertyIsEnumerable;
+  var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+  var __spreadValues = (a, b) => {
+    for (var prop in b || (b = {}))
+      if (__hasOwnProp.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    if (__getOwnPropSymbols)
+      for (var prop of __getOwnPropSymbols(b)) {
+        if (__propIsEnum.call(b, prop))
+          __defNormalProp(a, prop, b[prop]);
+      }
+    return a;
+  };
+  class Hash {
+    constructor(instance, $LG) {
+      this.core = instance;
+      this.$LG = $LG;
+      this.settings = __spreadValues(__spreadValues({}, hashSettings), this.core.settings);
+      return this;
+    }
+    init() {
+      if (!this.settings.hash) {
+        return;
+      }
+      this.driver = createHashDriver(
+        window,
+        this.settings.hashDriver
+      );
+      this.oldHash = this.driver.getHash();
+      setTimeout(() => {
+        this.buildFromHash();
+      }, 100);
+      this.core.LGel.on(
+        `${lGEvents.afterSlide}.hash`,
+        this.onAfterSlide.bind(this)
+      );
+      this.core.LGel.on(
+        `${lGEvents.afterClose}.hash`,
+        this.onCloseAfter.bind(this)
+      );
+      this.unsubscribeDriver = this.driver.subscribe(
+        this.onHashchange.bind(this)
+      );
+    }
+    onAfterSlide(event) {
+      let slideName = this.core.galleryItems[event.detail.index].slideName;
+      slideName = this.settings.customSlideName ? slideName || event.detail.index : event.detail.index;
+      this.driver.replaceHash(
+        "#lg=" + this.settings.galleryId + "&slide=" + slideName
+      );
+    }
+    /**
+     * Get index of the slide from custom slideName. Has to be a public method. Used in hash plugin
+     * @param {String} hash
+     * @returns {Number} Index of the slide.
+     */
+    getIndexFromUrl(hash = this.driver.getHash()) {
+      const slideName = hash.split("&slide=")[1];
+      let _idx = 0;
+      if (this.settings.customSlideName) {
+        for (let index = 0; index < this.core.galleryItems.length; index++) {
+          const dynamicEl = this.core.galleryItems[index];
+          if (dynamicEl.slideName === slideName) {
+            _idx = index;
+            break;
+          }
+        }
+      } else {
+        _idx = parseInt(slideName, 10);
+      }
+      return isNaN(_idx) ? 0 : _idx;
+    }
+    // Build Gallery if gallery id exist in the URL
+    buildFromHash() {
+      const _hash = this.driver.getHash();
+      if (_hash.indexOf("lg=" + this.settings.galleryId) > 0) {
+        this.$LG(document.body).addClass("lg-from-hash");
+        const index = this.getIndexFromUrl(_hash);
+        this.core.openGallery(index);
+        return true;
+      }
+    }
+    onCloseAfter() {
+      if (this.oldHash && this.oldHash.indexOf("lg=" + this.settings.galleryId) < 0) {
+        this.driver.replaceHash(this.oldHash);
+      } else {
+        this.driver.clearHash();
+      }
+    }
+    onHashchange() {
+      if (!this.core.lgOpened) return;
+      const _hash = this.driver.getHash();
+      const index = this.getIndexFromUrl(_hash);
+      if (_hash.indexOf("lg=" + this.settings.galleryId) > -1) {
+        this.core.slide(index, false, false);
+      } else if (this.core.lGalleryOn) {
+        this.core.closeGallery();
+      }
+    }
+    closeGallery() {
+      if (this.settings.hash) {
+        this.$LG(document.body).removeClass("lg-from-hash");
+      }
+    }
+    destroy() {
+      var _a;
+      this.core.LGel.off(".lg.hash");
+      this.core.LGel.off(".hash");
+      (_a = this.unsubscribeDriver) == null ? void 0 : _a.call(this);
+      this.unsubscribeDriver = void 0;
+    }
+  }
+  return Hash;
+});
+//# sourceMappingURL=lg-hash.umd.js.map

package/dist/plugins/hash/lg-hash.umd.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"lg-hash.umd.js","sources":["../../../packages/headless/src/hash-driver.ts","../../../src/lg-events.ts","../../../src/plugins/hash/lg-hash-settings.ts","../../../src/plugins/hash/lg-hash.ts"],"sourcesContent":["/**\n * URL-hash drivers for the hash plugin (plan 012). The plugin's history\n * side-effects — replace-write the deep link, restore/clear on close,\n * follow back/forward — sit behind one interface with two engines:\n *\n * - `history`: today's behavior (history.replaceState + `hashchange`) —\n *   the default fallback everywhere.\n * - `navigation`: the Navigation API (Baseline Newly Available, Jan\n *   2026) — replace-navigations carry entry state, and back/forward is\n *   observed via `currententrychange`. Strictly a feature-detected\n *   enhancement: nothing here is load-bearing (Safari's missing\n *   `precommitHandler` is irrelevant — we never intercept), and any\n *   missing capability falls back to the history driver.\n *\n * The deep-link URL format (`#lg=<galleryId>&slide=<index|name>`) is\n * public API and identical across drivers — pinned by the parity tests.\n *\n * Everything is structurally typed (the runtimes pass `window`); nothing\n * in this module touches DOM globals directly.\n *\n * Revisit note: flip the docs' default emphasis toward `navigation` once\n * the API reaches Widely Available (~2028 per current projection).\n */\n\nexport interface HashDriver {\n    /** Which engine this driver runs on (also used by the parity tests). */\n    readonly kind: 'history' | 'navigation';\n    /** The current URL hash including the leading '#', or ''. */\n    getHash(): string;\n    /** Replace the current entry's hash (never grows history). */\n    replaceHash(hash: string): void;\n    /** Replace the current entry with the bare URL (drops the hash). */\n    clearHash(): void;\n    /**\n     * Notify on URL changes the driver did not itself cause is NOT\n     * guaranteed — subscribers must be re-entrant-safe (the hash plugin's\n     * handlers already are: same-slide jumps no-op and close checks the\n     * open flag).\n     */\n    subscribe(onChange: () => void): () => void;\n}\n\nexport interface HashHistoryWindow {\n    location: { hash: string; pathname: string; search: string };\n    history: {\n        replaceState(data: unknown, unused: string, url?: string): void;\n    };\n    addEventListener(type: string, listener: () => void): void;\n    removeEventListener(type: string, listener: () => void): void;\n}\n\n/** Structural slice of the Navigation API the driver uses. */\nexport interface NavigationLike {\n    currentEntry?: { url?: string | null } | null;\n    navigate(\n        url: string,\n        options?: {\n            history?: 'auto' | 'push' | 'replace';\n            state?: unknown;\n        },\n    ): unknown;\n    addEventListener(type: string, listener: () => void): void;\n    removeEventListener(type: string, listener: () => void): void;\n}\n\nexport interface HashNavigationWindow extends HashHistoryWindow {\n    navigation?: NavigationLike;\n}\n\nexport type HashDriverPreference = 'auto' | 'history' | 'navigation';\n\nexport function createHistoryHashDriver(win: HashHistoryWindow): HashDriver {\n    return {\n        kind: 'history',\n        getHash: () => win.location.hash || '',\n        replaceHash: (hash) =>\n            win.history.replaceState(\n                null,\n                '',\n                win.location.pathname + win.location.search + hash,\n            ),\n        clearHash: () =>\n            win.history.replaceState(\n                null,\n                '',\n                win.location.pathname + win.location.search,\n            ),\n        subscribe: (onChange) => {\n            win.addEventListener('hashchange', onChange);\n            return () => win.removeEventListener('hashchange', onChange);\n        },\n    };\n}\n\n/** Swallow the navigate() result promises — a dismissed/aborted\n *  navigation has nothing to clean up (same posture as the share sheet). */\nfunction settleNavigateResult(result: unknown): void {\n    const promises = result as {\n        committed?: Promise<unknown>;\n        finished?: Promise<unknown>;\n    } | null;\n    promises?.committed?.catch?.(() => undefined);\n    promises?.finished?.catch?.(() => undefined);\n}\n\nexport function createNavigationHashDriver(\n    win: HashHistoryWindow,\n    navigation: NavigationLike,\n): HashDriver {\n    const getHash = (): string => {\n        const url = navigation.currentEntry?.url;\n        if (typeof url === 'string') {\n            const index = url.indexOf('#');\n            return index === -1 ? '' : url.slice(index);\n        }\n        return win.location.hash || '';\n    };\n    return {\n        kind: 'navigation',\n        getHash,\n        replaceHash: (hash) =>\n            settleNavigateResult(\n                navigation.navigate(\n                    win.location.pathname + win.location.search + hash,\n                    { history: 'replace', state: { lgHash: hash } },\n                ),\n            ),\n        clearHash: () =>\n            // Not navigate(): a destination without a fragment is a\n            // *cross-document* navigation (the same-document fast path\n            // requires the destination to have one), so clearing the hash\n            // through it reloads the page every time a gallery closes.\n            // replaceState drops the fragment in place, and the entry\n            // change still reaches `currententrychange` subscribers.\n            win.history.replaceState(\n                null,\n                '',\n                win.location.pathname + win.location.search,\n            ),\n        subscribe: (onChange) => {\n            // currententrychange also fires for the driver's own replace\n            // navigations — safe by contract (see HashDriver.subscribe).\n            navigation.addEventListener('currententrychange', onChange);\n            return () =>\n                navigation.removeEventListener('currententrychange', onChange);\n        },\n    };\n}\n\n/**\n * Pick a driver: `navigation` when preferred-or-auto and the Navigation\n * API is present with everything the driver needs; the history driver in\n * every other case (including an explicit `navigation` preference on a\n * browser without support — the enhancement is never load-bearing).\n */\nexport function createHashDriver(\n    win: HashNavigationWindow,\n    preference: HashDriverPreference = 'auto',\n): HashDriver {\n    const navigation = win.navigation;\n    const navigationCapable =\n        !!navigation &&\n        typeof navigation.navigate === 'function' &&\n        typeof navigation.addEventListener === 'function' &&\n        typeof navigation.removeEventListener === 'function';\n    if (preference !== 'history' && navigationCapable) {\n        return createNavigationHashDriver(win, navigation);\n    }\n    return createHistoryHashDriver(win);\n}\n","import { LightGallery } from './lightgallery';\nimport { VideoSource } from './plugins/video/types';\n\n/**\n * List of lightGallery events\n * All events should be documented here\n * Below interfaces are used to build the website documentations\n * */\nexport const lGEvents: {\n    [key: string]: string;\n} = {\n    afterAppendSlide: 'lgAfterAppendSlide',\n    init: 'lgInit',\n    hasVideo: 'lgHasVideo',\n    containerResize: 'lgContainerResize',\n    updateSlides: 'lgUpdateSlides',\n    afterAppendSubHtml: 'lgAfterAppendSubHtml',\n    beforeOpen: 'lgBeforeOpen',\n    afterOpen: 'lgAfterOpen',\n    slideItemLoad: 'lgSlideItemLoad',\n    beforeSlide: 'lgBeforeSlide',\n    afterSlide: 'lgAfterSlide',\n    posterClick: 'lgPosterClick',\n    dragStart: 'lgDragStart',\n    dragMove: 'lgDragMove',\n    dragEnd: 'lgDragEnd',\n    beforeNextSlide: 'lgBeforeNextSlide',\n    beforePrevSlide: 'lgBeforePrevSlide',\n    beforeClose: 'lgBeforeClose',\n    afterClose: 'lgAfterClose',\n    rotateLeft: 'lgRotateLeft',\n    rotateRight: 'lgRotateRight',\n    flipHorizontal: 'lgFlipHorizontal',\n    flipVertical: 'lgFlipVertical',\n    autoplay: 'lgAutoplay',\n    autoplayStart: 'lgAutoplayStart',\n    autoplayStop: 'lgAutoplayStop',\n};\n\n// Follow the below format for the event documentation\n// @method is the method name when event is used with Angular/React components\n\n/**\n * Fired only once when lightGallery is initialized\n * @name lgInit\n * @method onInit\n * @example\n *   const lg = document.getElementById('custom-events-demo');\n *   // Perform any action on lightGallery initialization.\n *   // Init event returns the plugin instance that can be used to call any lightGalley public method\n *   let pluginInstance = null;\n *   lg.addEventListener('lgInit', (event) => {\n *      pluginInstance = event.detail.instance;\n *   });\n *   lightGallery(lg);\n * @see <a href=\"/docs/methods/\">Methods</a>\n */\nexport interface InitDetail {\n    /**\n     * lightGallery plugin instance\n     */\n    instance: LightGallery;\n}\n\n/**\n * Fired when the slide content has been inserted into it's slide container.\n * @name lgAfterAppendSlide\n * @method onAfterAppendSlide\n */\nexport interface AfterAppendSlideEventDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n}\n\n/**\n * Fired immediately before opening the gallery\n * @name lgBeforeOpen\n * @method onBeforeOpen\n */\nexport interface BeforeOpenDetail {}\n\n/**\n * Fired immediately after opening the gallery\n * @name lgAfterOpen\n * @method onAfterOpen\n */\nexport interface AfterOpenDetail {}\n\n/**\n * Fired once the media inside the slide has been completely loaded .\n * @name lgSlideItemLoad\n * @method onSlideItemLoad\n */\nexport interface SlideItemLoadDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n    /**\n     * For the first slide, lightGallery adds some delay for displaying the loaded slide item.\n     * This delay is required for the transition effect when the slide item is displayed\n     * Respect the delay when you use this event\n     */\n    delay: number;\n\n    // Will be true for the first slide\n    isFirstSlide: boolean;\n}\n\n/**\n * Fired immediately before each slide transition.\n * @name lgBeforeSlide\n * @method onBeforeSlide\n * @example\n *   const lg = document.getElementById('custom-events-demo');\n *   // Perform any action before each slide transition\n *   lg.addEventListener('lgBeforeSlide', (event) => {\n *       const { index, prevIndex } = event.detail;\n *       alert(index, prevIndex);\n *   });\n *   lightGallery(lg);\n */\nexport interface BeforeSlideDetail {\n    /**\n     * Index of the previous slide\n     */\n    prevIndex: number;\n    /**\n     * Index of the slide\n     */\n    index: number;\n    /**\n     * true if slide function called via touch event or mouse drag\n     */\n    fromTouch: boolean;\n    /**\n     * true if slide function called via thumbnail click\n     */\n    fromThumb: boolean;\n}\n\n/**\n * Fired immediately after each slide transition.\n * @name lgAfterSlide\n * @method onAfterSlide\n */\nexport interface AfterSlideDetail {\n    /**\n     * Index of the previous slide\n     */\n    prevIndex: number;\n    /**\n     * Index of the slide\n     */\n    index: number;\n    /**\n     * true if slide function called via touch event or mouse drag\n     */\n    fromTouch: boolean;\n    /**\n     * true if slide function called via thumbnail click\n     */\n    fromThumb: boolean;\n}\n\n/**\n * Fired when the video poster is clicked.\n * @name lgPosterClick\n * @method onPosterClick\n */\nexport interface PosterClickDetail {}\n\n/**\n * Fired when the drag event to move to different slide starts.\n * @name lgDragStart\n * @method onDragStart\n */\nexport interface DragStartDetail {}\n\n/**\n * Fired periodically during the drag operation.\n * @name lgDragMove\n * @method onDragMove\n */\nexport interface DragMoveDetail {}\n\n/**\n * Fired when the user has finished the drag operation\n * @name lgDragEnd\n * @method onDragEnd\n */\nexport interface DragEndDetail {}\n\n/**\n * Fired immediately before the start of the close process.\n * @name lgBeforeClose\n * @method onBeforeClose\n */\nexport interface BeforeCloseDetail {}\n\n/**\n * Fired immediately once lightGallery is closed.\n * @name lgAfterClose\n * @method onAfterClose\n */\nexport interface AfterCloseDetail {\n    /**\n     * lightGallery plugin instance\n     */\n    instance: LightGallery;\n}\n\n/**\n * Fired immediately before each \"next\" slide transition\n * @name lgBeforeNextSlide\n * @method onBeforeNextSlide\n */\nexport interface BeforeNextSlideDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n    /**\n     * true if slide function called via touch event or mouse drag\n     */\n    fromTouch: boolean;\n}\n\n/**\n * Fired immediately before each \"prev\" slide transition\n * @name lgBeforePrevSlide\n * @method onBeforePrevSlide\n */\nexport interface BeforePrevSlideDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n    /**\n     * true if slide function called via touch event or mouse drag\n     */\n    fromTouch: boolean;\n}\n\n/**\n * Fired when the sub-html content (ex : title/ description) has been appended into the slide.\n * @name lgAfterAppendSubHtml\n * @method onAfterAppendSubHtml\n */\nexport interface AfterAppendSubHtmlDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n}\n\n/**\n * Fired when the lightGallery container has been resized.\n * @name lgContainerResize\n * @method onContainerResize\n */\nexport interface ContainerResizeDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n}\n\n/**\n * Fired when lightGallery detects video slide\n * @name lgHasVideo\n * @method onHasVideo\n */\nexport interface HasVideoDetail {\n    /**\n     * Index of the slide,\n     */\n    index: number;\n    /**\n     * Video source\n     */\n    src: string;\n    /**\n     * HTML5 video source if available\n     * <p>\n       HTML5 video source = source: {\n            src: string;\n            type: string;\n        }[];\n        attributes: HTMLVideoElement;\n     * </p>\n     */\n    html5Video: VideoSource;\n    /**\n     * True if video has poster\n     */\n    hasPoster: boolean;\n}\n\n/**\n * Fired when the image is rotated in anticlockwise direction\n * @name lgRotateLeft\n * @method onRotateLeft\n */\nexport interface RotateLeftDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n}\n\n/**\n * Fired when the image is rotated in clockwise direction\n * @name lgRotateRight\n * @method onRotateRight\n */\nexport interface RotateRightDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n}\n\n/**\n * Fired when the image is flipped horizontally\n * @name lgFlipHorizontal\n * @method onFlipHorizontal\n */\nexport interface FlipHorizontalDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n}\n\n/**\n * Fired when the image is flipped vertically\n * @name lgFlipVertical\n * @method onFlipVertical\n */\nexport interface FlipVerticalDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n}\n","import { HashDriverPreference } from '@lightgallery/headless';\n\nexport interface HashSettings {\n    /**\n     * Enable/Disable hash option\n     */\n    hash: boolean;\n\n    /**\n     * URL engine behind the hash syncing.\n     * @description 'auto' uses the Navigation API where the browser\n     * supports it and falls back to the History API everywhere else;\n     * 'history' and 'navigation' force an engine (an unsupported\n     * 'navigation' quietly falls back, the enhancement is never\n     * load-bearing). The deep-link URL format is identical either way.\n     * See <a href=\"/docs/hash-drivers/\">Hash drivers</a>.\n     * @version V3.0.0\n     */\n    hashDriver: HashDriverPreference;\n\n    /**\n     * Unique id for each gallery.\n     * @description It is mandatory when you use hash plugin for multiple galleries on the same page.\n     */\n    galleryId: string;\n\n    /**\n     * Custom slide name to use in the url when hash plugin is enabled\n     */\n    customSlideName: boolean;\n}\n\nexport const hashSettings: HashSettings = {\n    hash: true,\n    hashDriver: 'auto',\n    galleryId: '1',\n    customSlideName: false,\n};\n","import {\n    createHashDriver,\n    type HashDriver,\n    type HashNavigationWindow,\n} from '@lightgallery/headless';\n\nimport { lGEvents } from '../../lg-events';\nimport { LgQuery } from '../../lgQuery';\nimport { LightGallery } from '../../lightgallery';\nimport { hashSettings, HashSettings } from './lg-hash-settings';\n\nexport default class Hash {\n    core: LightGallery;\n    settings: HashSettings;\n    oldHash!: string;\n    private $LG!: LgQuery;\n    // URL engine (plan 012): History API today, Navigation API where the\n    // browser has it, same URLs either way.\n    private driver!: HashDriver;\n    private unsubscribeDriver?: () => void;\n    constructor(instance: LightGallery, $LG: LgQuery) {\n        // get lightGallery core plugin instance\n        this.core = instance;\n        this.$LG = $LG;\n        // extend module default settings with lightGallery core settings\n        this.settings = { ...hashSettings, ...this.core.settings };\n        return this;\n    }\n\n    public init(): void {\n        if (!this.settings.hash) {\n            return;\n        }\n        this.driver = createHashDriver(\n            window as unknown as HashNavigationWindow,\n            this.settings.hashDriver,\n        );\n        this.oldHash = this.driver.getHash();\n        setTimeout(() => {\n            this.buildFromHash();\n        }, 100);\n        // Change hash value on after each slide transition\n        this.core.LGel.on(\n            `${lGEvents.afterSlide}.hash`,\n            this.onAfterSlide.bind(this),\n        );\n        this.core.LGel.on(\n            `${lGEvents.afterClose}.hash`,\n            this.onCloseAfter.bind(this),\n        );\n\n        // Follow back/forward URL changes (hashchange on the history\n        // driver, currententrychange on the navigation driver).\n        this.unsubscribeDriver = this.driver.subscribe(\n            this.onHashchange.bind(this),\n        );\n    }\n\n    private onAfterSlide(event: CustomEvent) {\n        let slideName = this.core.galleryItems[event.detail.index].slideName;\n        slideName = this.settings.customSlideName\n            ? slideName || event.detail.index\n            : event.detail.index;\n        this.driver.replaceHash(\n            '#lg=' + this.settings.galleryId + '&slide=' + slideName,\n        );\n    }\n\n    /**\n     * Get index of the slide from custom slideName. Has to be a public method. Used in hash plugin\n     * @param {String} hash\n     * @returns {Number} Index of the slide.\n     */\n    getIndexFromUrl(hash = this.driver.getHash()): number {\n        const slideName = hash.split('&slide=')[1];\n        let _idx = 0;\n\n        if (this.settings.customSlideName) {\n            for (\n                let index = 0;\n                index < this.core.galleryItems.length;\n                index++\n            ) {\n                const dynamicEl = this.core.galleryItems[index];\n                if (dynamicEl.slideName === slideName) {\n                    _idx = index;\n                    break;\n                }\n            }\n        } else {\n            _idx = parseInt(slideName, 10);\n        }\n\n        return isNaN(_idx) ? 0 : _idx;\n    }\n\n    // Build Gallery if gallery id exist in the URL\n    buildFromHash(): boolean | undefined {\n        // if dynamic option is enabled execute immediately\n        const _hash = this.driver.getHash();\n        if (_hash.indexOf('lg=' + this.settings.galleryId) > 0) {\n            // This class is used to remove the initial animation if galleryId present in the URL\n            this.$LG(document.body).addClass('lg-from-hash');\n\n            const index = this.getIndexFromUrl(_hash);\n\n            this.core.openGallery(index);\n            return true;\n        }\n    }\n\n    private onCloseAfter() {\n        // Reset to old hash value\n        if (\n            this.oldHash &&\n            this.oldHash.indexOf('lg=' + this.settings.galleryId) < 0\n        ) {\n            this.driver.replaceHash(this.oldHash);\n        } else {\n            this.driver.clearHash();\n        }\n    }\n\n    private onHashchange() {\n        if (!this.core.lgOpened) return;\n        const _hash = this.driver.getHash();\n        const index = this.getIndexFromUrl(_hash);\n\n        // it galleryId doesn't exist in the url close the gallery\n        if (_hash.indexOf('lg=' + this.settings.galleryId) > -1) {\n            this.core.slide(index, false, false);\n        } else if (this.core.lGalleryOn) {\n            this.core.closeGallery();\n        }\n    }\n\n    closeGallery(): void {\n        if (this.settings.hash) {\n            this.$LG(document.body).removeClass('lg-from-hash');\n        }\n    }\n\n    destroy(): void {\n        this.core.LGel.off('.lg.hash');\n        this.core.LGel.off('.hash');\n        this.unsubscribeDriver?.();\n        this.unsubscribeDriver = undefined;\n    }\n}\n"],"names":[],"mappings":"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"}

package/dist/plugins/hash/package.json

@@ -0,0 +1,7 @@
+{
+  "name": "lightgallery/plugins/hash",
+  "private": true,
+  "main": "lg-hash.umd.js",
+  "module": "lg-hash.es5.js",
+  "typings": "lg-hash.d.ts"
+}

package/dist/plugins/justified/lg-justified.es5.js

@@ -0,0 +1,415 @@
+/*!
+ * lightgallery | 3.0.0-beta.2 | October 1st 2026
+ * http://www.lightgalleryjs.com/
+ * Copyright (c) 2020 Sachin Neravath;
+ * @license GPLv3
+ */
+function parseImageSize(lgSize, viewportWidth) {
+  if (!lgSize) {
+    return void 0;
+  }
+  let size = lgSize;
+  const responsiveSizes = lgSize.split(",");
+  if (responsiveSizes[1]) {
+    for (let i = 0; i < responsiveSizes.length; i++) {
+      const candidate = responsiveSizes[i].trim();
+      const responsiveWidth = parseInt(candidate.split("-")[2], 10);
+      if (responsiveWidth > viewportWidth) {
+        size = candidate;
+        break;
+      }
+      if (i === responsiveSizes.length - 1) {
+        size = candidate;
+      }
+    }
+  }
+  const parts = size.trim().split("-");
+  const width = parseInt(parts[0], 10);
+  const height = parseInt(parts[1], 10);
+  if (!Number.isFinite(width) || !Number.isFinite(height)) {
+    return void 0;
+  }
+  return { width, height };
+}
+const DEFAULT_TARGET_ROW_HEIGHT = 180;
+const DEFAULT_GAP = 8;
+const DEFAULT_MAX_SCALE = 1.75;
+function sanitizeRatios(ratios) {
+  let warned = false;
+  return ratios.map((ratio) => {
+    if (Number.isFinite(ratio) && ratio > 0) {
+      return ratio;
+    }
+    if (!warned && typeof console !== "undefined") {
+      warned = true;
+      console.warn(
+        "lightGallery justified layout: invalid aspect ratio, treating as 1 (square). See https://www.lightgalleryjs.com/docs/justified-layout/"
+      );
+    }
+    return 1;
+  });
+}
+function renderRow(options) {
+  const { row, firstIndex, top, containerWidth, gap, fill, boxes } = options;
+  const height = Math.round(options.height);
+  let start = 0;
+  row.forEach((ratio, offset) => {
+    let width = Math.round(ratio * height);
+    if (fill && offset === row.length - 1) {
+      width = containerWidth - start;
+    }
+    boxes[firstIndex + offset] = { top, start, width, height };
+    start += width + gap;
+  });
+  return height;
+}
+function getJustifiedLayout(options) {
+  const {
+    containerWidth,
+    targetRowHeight = DEFAULT_TARGET_ROW_HEIGHT,
+    gap = DEFAULT_GAP,
+    lastRow = "start",
+    maxScale = DEFAULT_MAX_SCALE
+  } = options;
+  const ratios = sanitizeRatios(options.ratios);
+  const boxes = new Array(ratios.length);
+  const maxHeight = targetRowHeight * maxScale;
+  const fillHeight = (row2) => {
+    const available = containerWidth - gap * (row2.length - 1);
+    const ratioSum = row2.reduce((sum, ratio) => sum + ratio, 0);
+    return available / ratioSum;
+  };
+  let top = 0;
+  let row = [];
+  let firstIndex = 0;
+  const closeRow = (height, fill) => {
+    const rendered = renderRow({
+      row,
+      firstIndex,
+      top,
+      height: Math.min(height, maxHeight),
+      containerWidth,
+      gap,
+      // A clamped row no longer fills the width — never stretch it.
+      fill: fill && height <= maxHeight,
+      boxes
+    });
+    top += rendered + gap;
+    firstIndex += row.length;
+    row = [];
+  };
+  ratios.forEach((ratio) => {
+    row.push(ratio);
+    const height = fillHeight(row);
+    if (height > targetRowHeight) {
+      return;
+    }
+    const heightWithout = row.length > 1 ? fillHeight(row.slice(0, -1)) : null;
+    if (heightWithout !== null && heightWithout - targetRowHeight < targetRowHeight - height) {
+      const carried = row.pop();
+      closeRow(heightWithout, true);
+      row = [carried];
+      if (fillHeight(row) <= targetRowHeight) {
+        closeRow(fillHeight(row), true);
+      }
+    } else {
+      closeRow(height, true);
+    }
+  });
+  if (row.length > 0) {
+    if (lastRow === "hide") {
+      row.forEach((_, offset) => {
+        boxes[firstIndex + offset] = {
+          top: 0,
+          start: 0,
+          width: 0,
+          height: 0
+        };
+      });
+    } else if (lastRow === "justify") {
+      closeRow(fillHeight(row), true);
+    } else {
+      closeRow(targetRowHeight, false);
+    }
+  }
+  return {
+    boxes,
+    containerHeight: firstIndex > 0 || row.length > 0 ? Math.max(top - gap, 0) : 0
+  };
+}
+function getJustifiedRows(boxes) {
+  const rows = [];
+  let rowTop = -1;
+  boxes.forEach((box, index) => {
+    if (box.width === 0 && box.height === 0) {
+      return;
+    }
+    if (!rows.length || box.top !== rowTop) {
+      rows.push([]);
+      rowTop = box.top;
+    }
+    rows[rows.length - 1].push(index);
+  });
+  return rows;
+}
+function getRevealableItems(rows, isLoaded, reveal) {
+  if (reveal === "image") {
+    return [].concat(...rows).filter(isLoaded);
+  }
+  const revealable = [];
+  for (const row of rows) {
+    if (!row.every(isLoaded)) {
+      break;
+    }
+    revealable.push(...row);
+  }
+  return revealable;
+}
+const lGEvents = {
+  updateSlides: "lgUpdateSlides"
+};
+const justifiedSettings = {
+  justified: true,
+  justifiedRowHeight: 180,
+  justifiedGap: 8,
+  justifiedLastRow: "start",
+  justifiedMaxScale: 1.75,
+  justifiedReveal: "row"
+};
+var __defProp = Object.defineProperty;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+class Justified {
+  constructor(instance, $LG) {
+    this.triggers = [];
+    this.ratios = [];
+    this.layoutWidth = 0;
+    this.pendingLoads = [];
+    this.rows = [];
+    this.loaded = /* @__PURE__ */ new Set();
+    this.loadWatchers = /* @__PURE__ */ new Map();
+    this.originalContainerStyle = "";
+    this.originalTriggerStyles = /* @__PURE__ */ new Map();
+    this.core = instance;
+    this.$LG = $LG;
+    this.settings = __spreadValues(__spreadValues({}, justifiedSettings), this.core.settings);
+    return this;
+  }
+  init() {
+    if (!this.settings.justified || this.core.settings.dynamic) {
+      return;
+    }
+    this.collectTriggers();
+    if (!this.triggers.length) {
+      return;
+    }
+    this.originalContainerStyle = this.core.el.getAttribute("style") || "";
+    this.core.el.classList.add("lg-justified", "lg-justified-reveal");
+    this.resolveRatios();
+    this.layout();
+    this.core.LGel.on(`${lGEvents.updateSlides}.justified`, () => {
+      this.pendingLoads.forEach((cancel) => cancel());
+      this.pendingLoads = [];
+      this.cancelLoadWatchers();
+      this.collectTriggers();
+      this.resolveRatios();
+      this.layout();
+    });
+    if (typeof ResizeObserver !== "undefined") {
+      this.resizeObserver = new ResizeObserver(() => {
+        if (this.core.el.clientWidth !== this.layoutWidth) {
+          this.layout();
+        }
+      });
+      this.resizeObserver.observe(this.core.el);
+    }
+  }
+  /** Adopt the core's current trigger list into the layout. */
+  collectTriggers() {
+    this.triggers = Array.prototype.slice.call(this.core.items);
+    this.triggers.forEach((trigger) => {
+      if (!this.originalTriggerStyles.has(trigger)) {
+        this.originalTriggerStyles.set(
+          trigger,
+          trigger.getAttribute("style") || ""
+        );
+      }
+      trigger.classList.add("lg-justified-item");
+    });
+  }
+  /** Best-known aspect ratio per trigger; unknowns resolve on load. */
+  resolveRatios() {
+    this.ratios = this.triggers.map((trigger, index) => {
+      const size = parseImageSize(
+        trigger.getAttribute("data-lg-size") || void 0,
+        window.innerWidth
+      );
+      if (size) {
+        return size.width / size.height;
+      }
+      const img = trigger.querySelector("img");
+      if (!img) {
+        return 1;
+      }
+      const width = parseInt(img.getAttribute("width") || "", 10);
+      const height = parseInt(img.getAttribute("height") || "", 10);
+      if (width > 0 && height > 0) {
+        return width / height;
+      }
+      if (img.complete && img.naturalWidth > 0) {
+        return img.naturalWidth / img.naturalHeight;
+      }
+      this.watchImageLoad(img, index);
+      return null;
+    });
+  }
+  /** Relayout once when the last unknown thumbnail resolves. */
+  watchImageLoad(img, index) {
+    const cancel = () => {
+      img.removeEventListener("load", onDone);
+      img.removeEventListener("error", onDone);
+    };
+    const onDone = () => {
+      cancel();
+      this.pendingLoads = this.pendingLoads.filter((c) => c !== cancel);
+      this.ratios[index] = img.naturalWidth > 0 ? img.naturalWidth / img.naturalHeight : 1;
+      if (this.ratios.every((ratio) => ratio !== null)) {
+        this.layout();
+      }
+    };
+    img.addEventListener("load", onDone);
+    img.addEventListener("error", onDone);
+    this.pendingLoads.push(cancel);
+  }
+  layout() {
+    const containerWidth = this.core.el.clientWidth;
+    if (!containerWidth) {
+      return;
+    }
+    this.layoutWidth = containerWidth;
+    const { boxes, containerHeight } = getJustifiedLayout({
+      // Unknown ratios render square until their image resolves.
+      ratios: this.ratios.map((ratio) => ratio != null ? ratio : 1),
+      containerWidth,
+      targetRowHeight: this.settings.justifiedRowHeight,
+      gap: this.settings.justifiedGap,
+      lastRow: this.settings.justifiedLastRow,
+      maxScale: this.settings.justifiedMaxScale
+    });
+    const startSide = this.core.settings.direction === "rtl" ? "right" : "left";
+    const endSide = startSide === "left" ? "right" : "left";
+    this.core.el.style.height = `${containerHeight}px`;
+    this.triggers.forEach((trigger, index) => {
+      const box = boxes[index];
+      const hidden = box.width === 0 && box.height === 0;
+      trigger.classList.toggle("lg-justified-item-hidden", hidden);
+      if (hidden) {
+        return;
+      }
+      trigger.style.top = `${box.top}px`;
+      trigger.style[startSide] = `${box.start}px`;
+      trigger.style[endSide] = "auto";
+      trigger.style.width = `${box.width}px`;
+      trigger.style.height = `${box.height}px`;
+      const img = trigger.querySelector("img");
+      if (img && img.hasAttribute("srcset")) {
+        img.setAttribute("sizes", `${box.width}px`);
+      }
+      this.watchLoad(trigger, img);
+    });
+    this.rows = getJustifiedRows(boxes).map(
+      (row) => row.map((index) => this.triggers[index])
+    );
+    this.reveal();
+  }
+  /** Track when the trigger's thumbnail has settled (loaded or failed). */
+  watchLoad(trigger, img) {
+    if (this.loaded.has(trigger) || this.loadWatchers.has(trigger)) {
+      return;
+    }
+    if (!img || img.complete) {
+      this.loaded.add(trigger);
+      return;
+    }
+    const onDone = () => {
+      cancel();
+      this.loaded.add(trigger);
+      this.reveal();
+    };
+    const cancel = () => {
+      img.removeEventListener("load", onDone);
+      img.removeEventListener("error", onDone);
+      this.loadWatchers.delete(trigger);
+    };
+    img.addEventListener("load", onDone);
+    img.addEventListener("error", onDone);
+    this.loadWatchers.set(trigger, cancel);
+  }
+  /**
+   * Fade in what may show now (see `justifiedReveal`). Never re-hides:
+   * a relayout regroups the rows, already visible triggers stay.
+   */
+  reveal() {
+    getRevealableItems(
+      this.rows,
+      (trigger) => this.loaded.has(trigger),
+      this.settings.justifiedReveal
+    ).forEach((trigger) => {
+      trigger.classList.add("lg-justified-item-visible");
+    });
+  }
+  cancelLoadWatchers() {
+    Array.from(this.loadWatchers.values()).forEach((cancel) => cancel());
+  }
+  closeGallery() {
+  }
+  destroy() {
+    var _a;
+    (_a = this.resizeObserver) == null ? void 0 : _a.disconnect();
+    this.pendingLoads.forEach((cancel) => cancel());
+    this.pendingLoads = [];
+    this.cancelLoadWatchers();
+    this.loaded.clear();
+    this.rows = [];
+    if (!this.triggers.length) {
+      return;
+    }
+    this.core.LGel.off(".justified");
+    this.core.el.classList.remove("lg-justified", "lg-justified-reveal");
+    if (this.originalContainerStyle) {
+      this.core.el.setAttribute("style", this.originalContainerStyle);
+    } else {
+      this.core.el.removeAttribute("style");
+    }
+    this.triggers.forEach((trigger) => {
+      trigger.classList.remove(
+        "lg-justified-item",
+        "lg-justified-item-hidden",
+        "lg-justified-item-visible"
+      );
+      const original = this.originalTriggerStyles.get(trigger);
+      if (original) {
+        trigger.setAttribute("style", original);
+      } else {
+        trigger.removeAttribute("style");
+      }
+    });
+  }
+}
+export {
+  Justified as default
+};
+//# sourceMappingURL=lg-justified.es5.js.map