@page-speed/lightbox 0.0.1 → 0.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.cjs CHANGED
@@ -979,7 +979,7 @@ var require_react_development = __commonJS({
979
979
  }
980
980
  return lazyType;
981
981
  }
982
- function forwardRef(render) {
982
+ function forwardRef2(render) {
983
983
  {
984
984
  if (render != null && render.$$typeof === REACT_MEMO_TYPE) {
985
985
  error("forwardRef requires a render function but received a `memo` component. Instead of forwardRef(memo(...)), use memo(forwardRef(...)).");
@@ -1040,7 +1040,7 @@ var require_react_development = __commonJS({
1040
1040
  }
1041
1041
  return false;
1042
1042
  }
1043
- function memo(type, compare) {
1043
+ function memo2(type, compare) {
1044
1044
  {
1045
1045
  if (!isValidElementType(type)) {
1046
1046
  error("memo: The first argument must be a component. Instead received: %s", type === null ? "null" : typeof type);
@@ -1100,11 +1100,11 @@ var require_react_development = __commonJS({
1100
1100
  var dispatcher = resolveDispatcher();
1101
1101
  return dispatcher.useReducer(reducer, initialArg, init);
1102
1102
  }
1103
- function useRef4(initialValue) {
1103
+ function useRef5(initialValue) {
1104
1104
  var dispatcher = resolveDispatcher();
1105
1105
  return dispatcher.useRef(initialValue);
1106
1106
  }
1107
- function useEffect7(create, deps) {
1107
+ function useEffect10(create, deps) {
1108
1108
  var dispatcher = resolveDispatcher();
1109
1109
  return dispatcher.useEffect(create, deps);
1110
1110
  }
@@ -1120,11 +1120,11 @@ var require_react_development = __commonJS({
1120
1120
  var dispatcher = resolveDispatcher();
1121
1121
  return dispatcher.useCallback(callback, deps);
1122
1122
  }
1123
- function useMemo2(create, deps) {
1123
+ function useMemo4(create, deps) {
1124
1124
  var dispatcher = resolveDispatcher();
1125
1125
  return dispatcher.useMemo(create, deps);
1126
1126
  }
1127
- function useImperativeHandle(ref, create, deps) {
1127
+ function useImperativeHandle2(ref, create, deps) {
1128
1128
  var dispatcher = resolveDispatcher();
1129
1129
  return dispatcher.useImperativeHandle(ref, create, deps);
1130
1130
  }
@@ -1877,24 +1877,24 @@ var require_react_development = __commonJS({
1877
1877
  exports2.createElement = createElement$1;
1878
1878
  exports2.createFactory = createFactory;
1879
1879
  exports2.createRef = createRef;
1880
- exports2.forwardRef = forwardRef;
1880
+ exports2.forwardRef = forwardRef2;
1881
1881
  exports2.isValidElement = isValidElement;
1882
1882
  exports2.lazy = lazy;
1883
- exports2.memo = memo;
1883
+ exports2.memo = memo2;
1884
1884
  exports2.startTransition = startTransition;
1885
1885
  exports2.unstable_act = act;
1886
1886
  exports2.useCallback = useCallback7;
1887
1887
  exports2.useContext = useContext;
1888
1888
  exports2.useDebugValue = useDebugValue;
1889
1889
  exports2.useDeferredValue = useDeferredValue;
1890
- exports2.useEffect = useEffect7;
1890
+ exports2.useEffect = useEffect10;
1891
1891
  exports2.useId = useId;
1892
- exports2.useImperativeHandle = useImperativeHandle;
1892
+ exports2.useImperativeHandle = useImperativeHandle2;
1893
1893
  exports2.useInsertionEffect = useInsertionEffect;
1894
1894
  exports2.useLayoutEffect = useLayoutEffect;
1895
- exports2.useMemo = useMemo2;
1895
+ exports2.useMemo = useMemo4;
1896
1896
  exports2.useReducer = useReducer;
1897
- exports2.useRef = useRef4;
1897
+ exports2.useRef = useRef5;
1898
1898
  exports2.useState = useState9;
1899
1899
  exports2.useSyncExternalStore = useSyncExternalStore;
1900
1900
  exports2.useTransition = useTransition;
@@ -2802,11 +2802,11 @@ var require_react_jsx_runtime_development = __commonJS({
2802
2802
  return jsxWithValidation(type, props, key, false);
2803
2803
  }
2804
2804
  }
2805
- var jsx11 = jsxWithValidationDynamic;
2806
- var jsxs7 = jsxWithValidationStatic;
2805
+ var jsx15 = jsxWithValidationDynamic;
2806
+ var jsxs11 = jsxWithValidationStatic;
2807
2807
  exports2.Fragment = REACT_FRAGMENT_TYPE;
2808
- exports2.jsx = jsx11;
2809
- exports2.jsxs = jsxs7;
2808
+ exports2.jsx = jsx15;
2809
+ exports2.jsxs = jsxs11;
2810
2810
  })();
2811
2811
  }
2812
2812
  }
@@ -20878,11 +20878,11 @@ __export(dist_exports, {
20878
20878
  useZoom: () => useZoom
20879
20879
  });
20880
20880
  function usePDFDocument(url, onError) {
20881
- const [document2, setDocument] = (0, import_react5.useState)(null);
20882
- const [loading, setLoading] = (0, import_react5.useState)(true);
20883
- const [error, setError] = (0, import_react5.useState)(null);
20884
- const [pdfDoc, setPdfDoc] = (0, import_react5.useState)(null);
20885
- (0, import_react5.useEffect)(() => {
20881
+ const [document2, setDocument] = (0, import_react9.useState)(null);
20882
+ const [loading, setLoading] = (0, import_react9.useState)(true);
20883
+ const [error, setError] = (0, import_react9.useState)(null);
20884
+ const [pdfDoc, setPdfDoc] = (0, import_react9.useState)(null);
20885
+ (0, import_react9.useEffect)(() => {
20886
20886
  if (!url) return;
20887
20887
  setLoading(true);
20888
20888
  setError(null);
@@ -20929,17 +20929,17 @@ function usePageState({
20929
20929
  totalPages,
20930
20930
  initialPage = 1
20931
20931
  }) {
20932
- const [currentPage, setCurrentPage] = (0, import_react6.useState)(
20932
+ const [currentPage, setCurrentPage] = (0, import_react10.useState)(
20933
20933
  Math.max(1, Math.min(initialPage, totalPages))
20934
20934
  );
20935
- const goToPage = (0, import_react6.useCallback)((page) => {
20935
+ const goToPage = (0, import_react10.useCallback)((page) => {
20936
20936
  const validPage = Math.max(1, Math.min(page, totalPages));
20937
20937
  setCurrentPage(validPage);
20938
20938
  }, [totalPages]);
20939
- const nextPage = (0, import_react6.useCallback)(() => {
20939
+ const nextPage = (0, import_react10.useCallback)(() => {
20940
20940
  goToPage(currentPage + 1);
20941
20941
  }, [currentPage, goToPage]);
20942
- const prevPage = (0, import_react6.useCallback)(() => {
20942
+ const prevPage = (0, import_react10.useCallback)(() => {
20943
20943
  goToPage(currentPage - 1);
20944
20944
  }, [currentPage, goToPage]);
20945
20945
  return {
@@ -20952,10 +20952,10 @@ function usePageState({
20952
20952
  };
20953
20953
  }
20954
20954
  function usePageRenderer(pdfDoc) {
20955
- const cacheRef = (0, import_react7.useRef)(/* @__PURE__ */ new Map());
20956
- const [rendering, setRendering] = (0, import_react7.useState)(false);
20957
- const [pageInfo, setPageInfo] = (0, import_react7.useState)(null);
20958
- const renderPage = (0, import_react7.useCallback)(
20955
+ const cacheRef = (0, import_react11.useRef)(/* @__PURE__ */ new Map());
20956
+ const [rendering, setRendering] = (0, import_react11.useState)(false);
20957
+ const [pageInfo, setPageInfo] = (0, import_react11.useState)(null);
20958
+ const renderPage = (0, import_react11.useCallback)(
20959
20959
  async (pageNumber, scale = DEFAULT_SCALE, rotation = 0) => {
20960
20960
  if (!pdfDoc) return null;
20961
20961
  try {
@@ -21014,21 +21014,21 @@ function usePageRenderer(pdfDoc) {
21014
21014
  return { renderPage, rendering, pageInfo };
21015
21015
  }
21016
21016
  function useZoom(initialZoom = 1.5) {
21017
- const [zoomLevel, setZoomLevel] = (0, import_react8.useState)(
21017
+ const [zoomLevel, setZoomLevel] = (0, import_react12.useState)(
21018
21018
  typeof initialZoom === "number" ? initialZoom : 1.5
21019
21019
  );
21020
- const [zoomMode, setZoomMode] = (0, import_react8.useState)(
21020
+ const [zoomMode, setZoomMode] = (0, import_react12.useState)(
21021
21021
  typeof initialZoom === "string" ? initialZoom : "custom"
21022
21022
  );
21023
- const zoomIn = (0, import_react8.useCallback)(() => {
21023
+ const zoomIn = (0, import_react12.useCallback)(() => {
21024
21024
  setZoomLevel((prev) => Math.min(MAX_ZOOM, prev + ZOOM_STEP));
21025
21025
  setZoomMode("custom");
21026
21026
  }, []);
21027
- const zoomOut = (0, import_react8.useCallback)(() => {
21027
+ const zoomOut = (0, import_react12.useCallback)(() => {
21028
21028
  setZoomLevel((prev) => Math.max(MIN_ZOOM, prev - ZOOM_STEP));
21029
21029
  setZoomMode("custom");
21030
21030
  }, []);
21031
- const setZoom = (0, import_react8.useCallback)((level) => {
21031
+ const setZoom = (0, import_react12.useCallback)((level) => {
21032
21032
  if (typeof level === "number") {
21033
21033
  setZoomLevel(Math.max(MIN_ZOOM, Math.min(MAX_ZOOM, level)));
21034
21034
  setZoomMode("custom");
@@ -21047,11 +21047,11 @@ function useZoom(initialZoom = 1.5) {
21047
21047
  };
21048
21048
  }
21049
21049
  function useSearch(pdfDoc) {
21050
- const [query, setQuery] = (0, import_react9.useState)("");
21051
- const [results, setResults] = (0, import_react9.useState)([]);
21052
- const [searching, setSearching] = (0, import_react9.useState)(false);
21053
- const [currentResultIndex, setCurrentResultIndex] = (0, import_react9.useState)(0);
21054
- const search = (0, import_react9.useCallback)(
21050
+ const [query, setQuery] = (0, import_react13.useState)("");
21051
+ const [results, setResults] = (0, import_react13.useState)([]);
21052
+ const [searching, setSearching] = (0, import_react13.useState)(false);
21053
+ const [currentResultIndex, setCurrentResultIndex] = (0, import_react13.useState)(0);
21054
+ const search = (0, import_react13.useCallback)(
21055
21055
  async (searchText) => {
21056
21056
  if (!pdfDoc || !searchText.trim()) {
21057
21057
  setResults([]);
@@ -21088,10 +21088,10 @@ function useSearch(pdfDoc) {
21088
21088
  },
21089
21089
  [pdfDoc]
21090
21090
  );
21091
- const nextResult = (0, import_react9.useCallback)(() => {
21091
+ const nextResult = (0, import_react13.useCallback)(() => {
21092
21092
  setCurrentResultIndex((prev) => (prev + 1) % results.length);
21093
21093
  }, [results.length]);
21094
- const prevResult = (0, import_react9.useCallback)(() => {
21094
+ const prevResult = (0, import_react13.useCallback)(() => {
21095
21095
  setCurrentResultIndex((prev) => (prev - 1 + results.length) % results.length);
21096
21096
  }, [results.length]);
21097
21097
  return {
@@ -21110,9 +21110,9 @@ function PDFCanvas({
21110
21110
  scale,
21111
21111
  onRender
21112
21112
  }) {
21113
- const containerRef = (0, import_react10.useRef)(null);
21114
- const [canvas, setCanvas] = (0, import_react10.useState)(null);
21115
- (0, import_react10.useEffect)(() => {
21113
+ const containerRef = (0, import_react14.useRef)(null);
21114
+ const [canvas, setCanvas] = (0, import_react14.useState)(null);
21115
+ (0, import_react14.useEffect)(() => {
21116
21116
  const render = async () => {
21117
21117
  const renderedCanvas = await onRender(pageNumber, scale, 0);
21118
21118
  if (renderedCanvas && containerRef.current) {
@@ -21127,7 +21127,7 @@ function PDFCanvas({
21127
21127
  render();
21128
21128
  }
21129
21129
  }, [pdfDoc, pageNumber, scale, onRender]);
21130
- return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { ref: containerRef, className: PDFViewer_default.canvas });
21130
+ return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { ref: containerRef, className: PDFViewer_default.canvas });
21131
21131
  }
21132
21132
  function PDFControls({
21133
21133
  pageState,
@@ -21140,8 +21140,8 @@ function PDFControls({
21140
21140
  url
21141
21141
  }) {
21142
21142
  if (!pdfDocument) return null;
21143
- return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: PDFViewer_default.controls, children: [
21144
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
21143
+ return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: PDFViewer_default.controls, children: [
21144
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
21145
21145
  "button",
21146
21146
  {
21147
21147
  onClick: pageState.prevPage,
@@ -21150,7 +21150,7 @@ function PDFControls({
21150
21150
  children: "<"
21151
21151
  }
21152
21152
  ),
21153
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
21153
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
21154
21154
  "input",
21155
21155
  {
21156
21156
  type: "number",
@@ -21161,11 +21161,11 @@ function PDFControls({
21161
21161
  className: PDFViewer_default.pageInput
21162
21162
  }
21163
21163
  ),
21164
- /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("span", { className: PDFViewer_default.pageTotal, children: [
21164
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("span", { className: PDFViewer_default.pageTotal, children: [
21165
21165
  "of ",
21166
21166
  pdfDocument.numPages
21167
21167
  ] }),
21168
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
21168
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
21169
21169
  "button",
21170
21170
  {
21171
21171
  onClick: pageState.nextPage,
@@ -21174,7 +21174,7 @@ function PDFControls({
21174
21174
  children: ">"
21175
21175
  }
21176
21176
  ),
21177
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
21177
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
21178
21178
  "button",
21179
21179
  {
21180
21180
  onClick: zoom.zoomOut,
@@ -21183,11 +21183,11 @@ function PDFControls({
21183
21183
  children: "-"
21184
21184
  }
21185
21185
  ),
21186
- /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("span", { className: PDFViewer_default.zoomLevel, children: [
21186
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("span", { className: PDFViewer_default.zoomLevel, children: [
21187
21187
  Math.round(zoom.zoomLevel * 100),
21188
21188
  "%"
21189
21189
  ] }),
21190
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
21190
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
21191
21191
  "button",
21192
21192
  {
21193
21193
  onClick: zoom.zoomIn,
@@ -21196,7 +21196,7 @@ function PDFControls({
21196
21196
  children: "+"
21197
21197
  }
21198
21198
  ),
21199
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
21199
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
21200
21200
  "input",
21201
21201
  {
21202
21202
  type: "text",
@@ -21206,13 +21206,13 @@ function PDFControls({
21206
21206
  className: PDFViewer_default.searchInput
21207
21207
  }
21208
21208
  ),
21209
- search.results.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("span", { className: PDFViewer_default.searchResults, children: [
21209
+ search.results.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("span", { className: PDFViewer_default.searchResults, children: [
21210
21210
  search.results.length,
21211
21211
  " results"
21212
21212
  ] }),
21213
- enableDownload && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("a", { href: url, download: true, className: PDFViewer_default.button, title: "Download", children: "Download" }),
21214
- enablePrint && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("button", { onClick: () => window.print(), title: "Print", children: "Print" }),
21215
- enableFullscreen && typeof document !== "undefined" && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
21213
+ enableDownload && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("a", { href: url, download: true, className: PDFViewer_default.button, title: "Download", children: "Download" }),
21214
+ enablePrint && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("button", { onClick: () => window.print(), title: "Print", children: "Print" }),
21215
+ enableFullscreen && typeof document !== "undefined" && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
21216
21216
  "button",
21217
21217
  {
21218
21218
  onClick: () => {
@@ -21234,8 +21234,8 @@ function PDFThumbnails({
21234
21234
  onSelectPage,
21235
21235
  numPages
21236
21236
  }) {
21237
- const [thumbnails, setThumbnails] = (0, import_react11.useState)([]);
21238
- (0, import_react11.useEffect)(() => {
21237
+ const [thumbnails, setThumbnails] = (0, import_react15.useState)([]);
21238
+ (0, import_react15.useEffect)(() => {
21239
21239
  const generateThumbnails = async () => {
21240
21240
  if (!pdfDoc) return;
21241
21241
  const thumbs = [];
@@ -21264,13 +21264,13 @@ function PDFThumbnails({
21264
21264
  };
21265
21265
  generateThumbnails();
21266
21266
  }, [pdfDoc, numPages]);
21267
- return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: PDFViewer_default.thumbnails, children: thumbnails.map((thumb, idx) => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
21267
+ return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: PDFViewer_default.thumbnails, children: thumbnails.map((thumb, idx) => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
21268
21268
  "div",
21269
21269
  {
21270
21270
  className: `${PDFViewer_default.thumbnail} ${idx + 1 === currentPage ? PDFViewer_default.active : ""}`,
21271
21271
  onClick: () => onSelectPage(idx + 1),
21272
21272
  children: [
21273
- /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
21273
+ /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
21274
21274
  "canvas",
21275
21275
  {
21276
21276
  width: thumb.width,
@@ -21285,7 +21285,7 @@ function PDFThumbnails({
21285
21285
  }
21286
21286
  }
21287
21287
  ),
21288
- /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: PDFViewer_default.pageNumber, children: idx + 1 })
21288
+ /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: PDFViewer_default.pageNumber, children: idx + 1 })
21289
21289
  ]
21290
21290
  },
21291
21291
  idx
@@ -21322,35 +21322,35 @@ function PDFViewer({
21322
21322
  const { renderPage, pageInfo } = usePageRenderer(pdfDoc);
21323
21323
  const zoom = useZoom(initialZoom);
21324
21324
  const search = useSearch(pdfDoc);
21325
- (0, import_react4.useEffect)(() => {
21325
+ (0, import_react8.useEffect)(() => {
21326
21326
  if (document2) {
21327
21327
  onDocumentLoad?.(document2);
21328
21328
  }
21329
21329
  }, [document2, onDocumentLoad]);
21330
- (0, import_react4.useEffect)(() => {
21330
+ (0, import_react8.useEffect)(() => {
21331
21331
  onPageChange?.(pageState.currentPage);
21332
21332
  }, [pageState.currentPage, onPageChange]);
21333
- (0, import_react4.useEffect)(() => {
21333
+ (0, import_react8.useEffect)(() => {
21334
21334
  if (search.results.length > 0) {
21335
21335
  onSearchResults?.(search.results);
21336
21336
  }
21337
21337
  }, [search.results, onSearchResults]);
21338
21338
  if (error) {
21339
- return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: PDFViewer_default.error, style: { height, width }, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("p", { children: [
21339
+ return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: PDFViewer_default.error, style: { height, width }, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("p", { children: [
21340
21340
  "Failed to load PDF: ",
21341
21341
  error.message
21342
21342
  ] }) });
21343
21343
  }
21344
21344
  if (loading) {
21345
- return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: PDFViewer_default.loading, style: { height, width }, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("p", { children: "Loading PDF..." }) });
21345
+ return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: PDFViewer_default.loading, style: { height, width }, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("p", { children: "Loading PDF..." }) });
21346
21346
  }
21347
- return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
21347
+ return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
21348
21348
  "div",
21349
21349
  {
21350
21350
  className: `${PDFViewer_default.viewer} ${className || ""}`,
21351
21351
  style: { height, width, ...style },
21352
21352
  children: [
21353
- showControls && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
21353
+ showControls && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
21354
21354
  PDFControls,
21355
21355
  {
21356
21356
  pageState,
@@ -21363,8 +21363,8 @@ function PDFViewer({
21363
21363
  url
21364
21364
  }
21365
21365
  ),
21366
- /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: PDFViewer_default.content, children: [
21367
- showThumbnails && document2 && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
21366
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: PDFViewer_default.content, children: [
21367
+ showThumbnails && document2 && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
21368
21368
  PDFThumbnails,
21369
21369
  {
21370
21370
  pdfDoc,
@@ -21373,7 +21373,7 @@ function PDFViewer({
21373
21373
  numPages: document2.numPages
21374
21374
  }
21375
21375
  ),
21376
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
21376
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
21377
21377
  PDFCanvas,
21378
21378
  {
21379
21379
  pdfDoc,
@@ -21451,22 +21451,22 @@ function createProgressiveFetchHandler(onProgress) {
21451
21451
  return response.arrayBuffer();
21452
21452
  };
21453
21453
  }
21454
- var import_react4, import_react5, pdfjsLib, import_react6, import_react7, import_react8, import_react9, import_react10, import_jsx_runtime4, import_jsx_runtime5, import_react11, import_jsx_runtime6, import_jsx_runtime7, DEFAULT_SCALE, CACHE_SIZE, MIN_ZOOM, MAX_ZOOM, ZOOM_STEP, PDFViewer_default, linearizedPDFConfig;
21454
+ var import_react8, import_react9, pdfjsLib, import_react10, import_react11, import_react12, import_react13, import_react14, import_jsx_runtime5, import_jsx_runtime6, import_react15, import_jsx_runtime7, import_jsx_runtime8, DEFAULT_SCALE, CACHE_SIZE, MIN_ZOOM, MAX_ZOOM, ZOOM_STEP, PDFViewer_default, linearizedPDFConfig;
21455
21455
  var init_dist = __esm({
21456
21456
  "node_modules/.pnpm/@page-speed+pdf-viewer@0.0.2_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@page-speed/pdf-viewer/dist/index.js"() {
21457
- import_react4 = __toESM(require_react());
21458
- import_react5 = __toESM(require_react());
21459
- pdfjsLib = __toESM(require_pdf());
21460
- import_react6 = __toESM(require_react());
21461
- import_react7 = __toESM(require_react());
21462
21457
  import_react8 = __toESM(require_react());
21463
21458
  import_react9 = __toESM(require_react());
21459
+ pdfjsLib = __toESM(require_pdf());
21464
21460
  import_react10 = __toESM(require_react());
21465
- import_jsx_runtime4 = __toESM(require_jsx_runtime());
21466
- import_jsx_runtime5 = __toESM(require_jsx_runtime());
21467
21461
  import_react11 = __toESM(require_react());
21462
+ import_react12 = __toESM(require_react());
21463
+ import_react13 = __toESM(require_react());
21464
+ import_react14 = __toESM(require_react());
21465
+ import_jsx_runtime5 = __toESM(require_jsx_runtime());
21468
21466
  import_jsx_runtime6 = __toESM(require_jsx_runtime());
21467
+ import_react15 = __toESM(require_react());
21469
21468
  import_jsx_runtime7 = __toESM(require_jsx_runtime());
21469
+ import_jsx_runtime8 = __toESM(require_jsx_runtime());
21470
21470
  if (typeof window !== "undefined") {
21471
21471
  pdfjsLib.GlobalWorkerOptions.workerSrc = `//cdnjs.cloudflare.com/ajax/libs/pdf.js/${pdfjsLib.version}/pdf.worker.min.js`;
21472
21472
  }
@@ -21506,13 +21506,17 @@ var init_dist = __esm({
21506
21506
  var index_exports = {};
21507
21507
  __export(index_exports, {
21508
21508
  ComponentRenderer: () => ComponentRenderer,
21509
+ CustomSlideLayout: () => CustomSlideLayout,
21510
+ FullscreenLayout: () => FullscreenLayout,
21509
21511
  HorizontalLayout: () => HorizontalLayout,
21510
21512
  ImageRenderer: () => ImageRenderer,
21513
+ InlineLayout: () => InlineLayout,
21511
21514
  Lightbox: () => Lightbox,
21512
21515
  LightboxChrome: () => LightboxChrome,
21513
21516
  LightboxContent: () => LightboxContent,
21514
21517
  LightboxOverlay: () => LightboxOverlay,
21515
21518
  PDFRenderer: () => PDFRenderer,
21519
+ VerticalSplitLayout: () => VerticalSplitLayout,
21516
21520
  VideoRenderer: () => VideoRenderer,
21517
21521
  useGalleryState: () => useGalleryState,
21518
21522
  useKeyboardShortcuts: () => useKeyboardShortcuts,
@@ -21523,7 +21527,7 @@ __export(index_exports, {
21523
21527
  module.exports = __toCommonJS(index_exports);
21524
21528
 
21525
21529
  // src/components/Lightbox.tsx
21526
- var import_react13 = __toESM(require_react());
21530
+ var import_react17 = __toESM(require_react());
21527
21531
 
21528
21532
  // src/hooks/useGalleryState.ts
21529
21533
  var import_react = __toESM(require_react());
@@ -21621,7 +21625,23 @@ var Lightbox_default = {
21621
21625
  captionTitle: "Lightbox_captionTitle",
21622
21626
  captionText: "Lightbox_captionText",
21623
21627
  pdfContainer: "Lightbox_pdfContainer",
21624
- pdfFallback: "Lightbox_pdfFallback"
21628
+ pdfFallback: "Lightbox_pdfFallback",
21629
+ verticalSplitLayoutRoot: "Lightbox_verticalSplitLayoutRoot",
21630
+ verticalSplitLayoutContainer: "Lightbox_verticalSplitLayoutContainer",
21631
+ verticalSplitContent: "Lightbox_verticalSplitContent",
21632
+ verticalSplitSidebar: "Lightbox_verticalSplitSidebar",
21633
+ customSlideLayoutRoot: "Lightbox_customSlideLayoutRoot",
21634
+ customSlideLayoutContainer: "Lightbox_customSlideLayoutContainer",
21635
+ customSlideContent: "Lightbox_customSlideContent",
21636
+ customSlideChrome: "Lightbox_customSlideChrome",
21637
+ fullscreenLayoutRoot: "Lightbox_fullscreenLayoutRoot",
21638
+ fullscreenLayoutContainer: "Lightbox_fullscreenLayoutContainer",
21639
+ fullscreenContent: "Lightbox_fullscreenContent",
21640
+ fullscreenChrome: "Lightbox_fullscreenChrome",
21641
+ inlineLayoutRoot: "Lightbox_inlineLayoutRoot",
21642
+ inlineLayoutContainer: "Lightbox_inlineLayoutContainer",
21643
+ inlineContent: "Lightbox_inlineContent",
21644
+ inlineToolbar: "Lightbox_inlineToolbar"
21625
21645
  };
21626
21646
 
21627
21647
  // src/components/LightboxOverlay.tsx
@@ -21645,27 +21665,679 @@ function LightboxOverlay({
21645
21665
  );
21646
21666
  }
21647
21667
 
21668
+ // node_modules/.pnpm/@page-speed+img@0.4.3_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@page-speed/img/dist/core/Img.js
21669
+ var import_jsx_runtime2 = __toESM(require_jsx_runtime(), 1);
21670
+ var import_react7 = __toESM(require_react(), 1);
21671
+
21672
+ // node_modules/.pnpm/@page-speed+hooks@0.4.3_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@page-speed/hooks/dist/chunk-JSF23IF7.js
21673
+ var import_react4 = __toESM(require_react(), 1);
21674
+ var BASE_URL = "https://octane.cdn.ing/api/v1/images/transform?";
21675
+ var DPR_MULTIPLIERS = [1, 2];
21676
+ function useOptimizedImage(options) {
21677
+ const {
21678
+ src,
21679
+ eager = false,
21680
+ threshold = 0.1,
21681
+ rootMargin = "50px",
21682
+ width,
21683
+ height,
21684
+ optixFlowConfig
21685
+ } = options;
21686
+ const optixFlowApiKey = (0, import_react4.useMemo)(() => {
21687
+ return optixFlowConfig?.apiKey;
21688
+ }, [optixFlowConfig?.apiKey]);
21689
+ const useOptixFlow = (0, import_react4.useMemo)(() => {
21690
+ return optixFlowApiKey ? true : false;
21691
+ }, [optixFlowApiKey]);
21692
+ const [state, setState] = (0, import_react4.useState)({
21693
+ isLoaded: false,
21694
+ isInView: false
21695
+ });
21696
+ const [size, setSize] = (0, import_react4.useState)({
21697
+ width: width ?? 0,
21698
+ height: height ?? 0
21699
+ });
21700
+ const imgRef = (0, import_react4.useRef)(null);
21701
+ const observerRef = (0, import_react4.useRef)(null);
21702
+ (0, import_react4.useEffect)(() => {
21703
+ if (width !== void 0 || height !== void 0) {
21704
+ setSize((prev) => ({
21705
+ width: width ?? prev.width,
21706
+ height: height ?? prev.height
21707
+ }));
21708
+ }
21709
+ }, [width, height]);
21710
+ (0, import_react4.useEffect)(() => {
21711
+ if (!imgRef.current) return;
21712
+ const calculateRenderedSize = () => {
21713
+ const img2 = imgRef.current;
21714
+ if (!img2) return;
21715
+ const renderedWidth = width ?? (Math.round(img2.clientWidth) || img2.naturalWidth || 0);
21716
+ const renderedHeight = height ?? (Math.round(img2.clientHeight) || img2.naturalHeight || 0);
21717
+ if (renderedWidth > 0 || renderedHeight > 0) {
21718
+ setSize((prev) => {
21719
+ if (prev.width !== renderedWidth || prev.height !== renderedHeight) {
21720
+ return { width: renderedWidth, height: renderedHeight };
21721
+ }
21722
+ return prev;
21723
+ });
21724
+ }
21725
+ };
21726
+ if (imgRef.current.clientWidth > 0) {
21727
+ calculateRenderedSize();
21728
+ }
21729
+ const img = imgRef.current;
21730
+ img.addEventListener("load", calculateRenderedSize);
21731
+ let resizeObserver = null;
21732
+ if (typeof ResizeObserver !== "undefined") {
21733
+ resizeObserver = new ResizeObserver(() => {
21734
+ calculateRenderedSize();
21735
+ });
21736
+ resizeObserver.observe(img);
21737
+ }
21738
+ return () => {
21739
+ img.removeEventListener("load", calculateRenderedSize);
21740
+ resizeObserver?.disconnect();
21741
+ };
21742
+ }, [width, height, state.isLoaded]);
21743
+ const buildOptixFlowUrl = (0, import_react4.useCallback)(
21744
+ (imgWidth, imgHeight, format) => {
21745
+ if (!useOptixFlow) return src;
21746
+ if (!imgWidth || !imgHeight) return src;
21747
+ const params = new URLSearchParams();
21748
+ params.set("url", src);
21749
+ params.set("w", String(imgWidth));
21750
+ params.set("h", String(imgHeight));
21751
+ params.set("q", String(optixFlowConfig?.compressionLevel ?? 75));
21752
+ params.set("f", format);
21753
+ params.set("apiKey", optixFlowApiKey);
21754
+ return `${BASE_URL}${params.toString()}`;
21755
+ },
21756
+ [useOptixFlow, src, optixFlowConfig?.compressionLevel, optixFlowApiKey]
21757
+ );
21758
+ const generateSrcset = (0, import_react4.useCallback)(
21759
+ (baseWidth, baseHeight, format) => {
21760
+ if (!useOptixFlow || baseWidth === 0 || baseHeight === 0) return "";
21761
+ return DPR_MULTIPLIERS.map((dpr) => {
21762
+ const scaledWidth = Math.round(baseWidth * dpr);
21763
+ const scaledHeight = Math.round(baseHeight * dpr);
21764
+ const url = buildOptixFlowUrl(scaledWidth, scaledHeight, format);
21765
+ return `${url} ${dpr}x`;
21766
+ }).join(", ");
21767
+ },
21768
+ [useOptixFlow, buildOptixFlowUrl]
21769
+ );
21770
+ const primarySrc = (0, import_react4.useMemo)(() => {
21771
+ const hasDimensions = size.width > 0 && size.height > 0;
21772
+ if (!useOptixFlow || !hasDimensions) return src;
21773
+ const fallbackFormat = optixFlowConfig?.renderedFileType ?? "jpeg";
21774
+ return buildOptixFlowUrl(size.width, size.height, fallbackFormat);
21775
+ }, [useOptixFlow, src, size.width, size.height, optixFlowConfig?.renderedFileType, buildOptixFlowUrl]);
21776
+ const srcset = (0, import_react4.useMemo)(() => {
21777
+ return {
21778
+ avif: generateSrcset(size.width, size.height, "avif"),
21779
+ webp: generateSrcset(size.width, size.height, "webp"),
21780
+ jpeg: generateSrcset(size.width, size.height, "jpeg")
21781
+ };
21782
+ }, [size.width, size.height, generateSrcset]);
21783
+ const sizes = (0, import_react4.useMemo)(() => {
21784
+ if (size.width === 0) return "";
21785
+ return `${size.width}px`;
21786
+ }, [size.width]);
21787
+ (0, import_react4.useEffect)(() => {
21788
+ if (typeof window === "undefined" || !imgRef.current) {
21789
+ return;
21790
+ }
21791
+ if (eager) {
21792
+ setState({ isLoaded: false, isInView: true });
21793
+ return;
21794
+ }
21795
+ observerRef.current = new IntersectionObserver(
21796
+ ([entry]) => {
21797
+ if (entry.isIntersecting) {
21798
+ setState((prev) => ({ ...prev, isInView: true }));
21799
+ observerRef.current?.disconnect();
21800
+ }
21801
+ },
21802
+ { threshold, rootMargin }
21803
+ );
21804
+ observerRef.current.observe(imgRef.current);
21805
+ return () => {
21806
+ observerRef.current?.disconnect();
21807
+ };
21808
+ }, [eager, threshold, rootMargin]);
21809
+ (0, import_react4.useEffect)(() => {
21810
+ if (!imgRef.current) return;
21811
+ const handleLoad = () => {
21812
+ setState((prev) => ({ ...prev, isLoaded: true }));
21813
+ };
21814
+ const img = imgRef.current;
21815
+ if (img.complete) {
21816
+ handleLoad();
21817
+ } else {
21818
+ img.addEventListener("load", handleLoad);
21819
+ return () => img.removeEventListener("load", handleLoad);
21820
+ }
21821
+ }, [state.isInView]);
21822
+ const ref = (0, import_react4.useCallback)((node) => {
21823
+ imgRef.current = node;
21824
+ }, []);
21825
+ const emptySrcset = { avif: "", webp: "", jpeg: "" };
21826
+ return {
21827
+ ref,
21828
+ // Primary src uses exact rendered dimensions for Lighthouse "Properly size images" compliance
21829
+ src: state.isInView || eager ? primarySrc : src,
21830
+ // Srcset with format variants and DPR multipliers for <picture> element
21831
+ srcset: state.isInView || eager ? srcset : emptySrcset,
21832
+ // Sizes attribute for responsive image selection
21833
+ sizes: state.isInView || eager ? sizes : "",
21834
+ isLoaded: state.isLoaded,
21835
+ isInView: state.isInView,
21836
+ loading: eager ? "eager" : "lazy",
21837
+ size
21838
+ };
21839
+ }
21840
+
21841
+ // node_modules/.pnpm/@page-speed+img@0.4.3_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@page-speed/img/dist/utils/cache.js
21842
+ var l2Cache = /* @__PURE__ */ new Map();
21843
+ function cacheGet(key) {
21844
+ return l2Cache.get(key);
21845
+ }
21846
+ function cacheSet(key, value) {
21847
+ l2Cache.set(key, value);
21848
+ }
21849
+
21850
+ // node_modules/.pnpm/@page-speed+img@0.4.3_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@page-speed/img/dist/utils/api.js
21851
+ var DEFAULT_CDN_HOST = "https://cdn.ing";
21852
+ function normalizeHost(cdnHost) {
21853
+ return (cdnHost ?? DEFAULT_CDN_HOST).replace(/\/$/, "");
21854
+ }
21855
+ function buildPrimaryImageUrl(mediaId, cdnHost) {
21856
+ const host = normalizeHost(cdnHost);
21857
+ return `${host}/assets/images/${mediaId}`;
21858
+ }
21859
+ function buildLegacyImageUrl(mediaId, cdnHost) {
21860
+ const host = normalizeHost(cdnHost);
21861
+ return `${host}/i/r/${mediaId}`;
21862
+ }
21863
+ function buildPlaceholderImageUrl(mediaId, cdnHost) {
21864
+ const host = normalizeHost(cdnHost);
21865
+ return `${host}/assets/low_res_thumb/${mediaId}`;
21866
+ }
21867
+ function hasRenderableUrlVariant(variant) {
21868
+ if (!variant)
21869
+ return false;
21870
+ const candidates = [variant.sm, variant.md, variant.lg, variant.full];
21871
+ return candidates.some((value) => typeof value === "string" && value.trim().length > 0);
21872
+ }
21873
+ function imageVariantsHaveRenderableSource(variants) {
21874
+ if (!variants)
21875
+ return false;
21876
+ return ["AVIF", "WEBP", "JPEG"].some((format) => {
21877
+ const entry = variants?.[format];
21878
+ return hasRenderableUrlVariant(entry);
21879
+ });
21880
+ }
21881
+ function hasUrlValue(value) {
21882
+ return typeof value === "string" && value.trim().length > 0;
21883
+ }
21884
+ function imageDataHasRenderableSource(data) {
21885
+ if (!data)
21886
+ return false;
21887
+ if (imageVariantsHaveRenderableSource(data.variants_data?.variants ?? null)) {
21888
+ return true;
21889
+ }
21890
+ const raw = data;
21891
+ const directFields = [
21892
+ raw.img_url,
21893
+ raw.file_data_url,
21894
+ raw.file_data_thumbnail_url,
21895
+ raw.img_src,
21896
+ raw.med_src,
21897
+ raw.thumb_src,
21898
+ raw.low_res_thumb
21899
+ ];
21900
+ return directFields.some(hasUrlValue);
21901
+ }
21902
+ async function fetchFrom(url, signal) {
21903
+ const res = await fetch(url, { signal });
21904
+ if (!res.ok) {
21905
+ const error = new Error(`Failed to fetch image data (status ${res.status}) from ${url}`);
21906
+ error.status = res.status;
21907
+ throw error;
21908
+ }
21909
+ return await res.json();
21910
+ }
21911
+ async function fetchImageData(mediaId, options = {}) {
21912
+ if (!Number.isFinite(mediaId)) {
21913
+ throw new Error("Invalid mediaId provided to fetchImageData");
21914
+ }
21915
+ const host = normalizeHost(options.cdnHost);
21916
+ const cacheKey = `image:${host}:${mediaId}`;
21917
+ if (!options.bypassCache) {
21918
+ const cached = cacheGet(cacheKey);
21919
+ if (cached)
21920
+ return cached;
21921
+ }
21922
+ const urls = [buildPrimaryImageUrl(mediaId, host), buildLegacyImageUrl(mediaId, host)];
21923
+ let lastError;
21924
+ for (const url of urls) {
21925
+ try {
21926
+ const data = await fetchFrom(url, options.signal);
21927
+ if (imageDataHasRenderableSource(data)) {
21928
+ cacheSet(cacheKey, data);
21929
+ }
21930
+ return data;
21931
+ } catch (err) {
21932
+ if (err?.name === "AbortError") {
21933
+ throw err;
21934
+ }
21935
+ lastError = err;
21936
+ }
21937
+ }
21938
+ if (lastError instanceof Error) {
21939
+ throw lastError;
21940
+ }
21941
+ throw new Error(`Failed to fetch image data for mediaId ${mediaId}`);
21942
+ }
21943
+
21944
+ // node_modules/.pnpm/@page-speed+img@0.4.3_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@page-speed/img/dist/core/useMediaSelectionEffect.js
21945
+ var import_react5 = __toESM(require_react(), 1);
21946
+ var MEDIA_SELECTED_EVENT = "dt:media-selected";
21947
+ function useMediaSelectionEffect() {
21948
+ (0, import_react5.useEffect)(() => {
21949
+ if (typeof window === "undefined")
21950
+ return;
21951
+ const handler = () => {
21952
+ };
21953
+ window.addEventListener(MEDIA_SELECTED_EVENT, handler);
21954
+ return () => window.removeEventListener(MEDIA_SELECTED_EVENT, handler);
21955
+ }, []);
21956
+ }
21957
+
21958
+ // node_modules/.pnpm/@page-speed+img@0.4.3_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@page-speed/img/dist/core/useResponsiveReset.js
21959
+ var import_react6 = __toESM(require_react(), 1);
21960
+ function resetResponsivePictureState(element) {
21961
+ if (!element)
21962
+ return;
21963
+ element.querySelectorAll("source").forEach((source) => {
21964
+ const srcset = source.getAttribute("srcset");
21965
+ if (srcset) {
21966
+ source.setAttribute("data-srcset", srcset);
21967
+ source.removeAttribute("srcset");
21968
+ requestAnimationFrame(() => {
21969
+ source.setAttribute("srcset", srcset);
21970
+ });
21971
+ }
21972
+ });
21973
+ }
21974
+ function useResponsiveReset(ref) {
21975
+ (0, import_react6.useEffect)(() => {
21976
+ const element = ref.current;
21977
+ if (!element)
21978
+ return;
21979
+ if (element instanceof HTMLPictureElement) {
21980
+ resetResponsivePictureState(element);
21981
+ } else if (element.parentElement instanceof HTMLPictureElement) {
21982
+ resetResponsivePictureState(element.parentElement);
21983
+ }
21984
+ }, [ref]);
21985
+ }
21986
+
21987
+ // node_modules/.pnpm/@page-speed+img@0.4.3_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@page-speed/img/dist/core/Img.js
21988
+ var DEFAULT_WIDTHS = {
21989
+ sm: 640,
21990
+ md: 1024,
21991
+ lg: 1536,
21992
+ full: 2560
21993
+ };
21994
+ var MAX_VARIANT_REFRESH_ATTEMPTS = 5;
21995
+ var VARIANT_REFRESH_DELAY_MS = 3e3;
21996
+ var TRANSPARENT_PIXEL = "data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==";
21997
+ var defaultOptixFlowConfig;
21998
+ var deprecatedMediaWarnings = /* @__PURE__ */ new Set();
21999
+ var readGlobalOptixFlowConfig = () => {
22000
+ if (typeof globalThis === "undefined")
22001
+ return void 0;
22002
+ const globalAny = globalThis;
22003
+ return globalAny.PageSpeedImgDefaults?.optixFlowConfig || globalAny.OpensiteImgDefaults?.optixFlowConfig || globalAny.PAGE_SPEED_IMG_DEFAULTS?.optixFlowConfig;
22004
+ };
22005
+ var resolveOptixFlowConfig = (config) => {
22006
+ return config ?? defaultOptixFlowConfig ?? readGlobalOptixFlowConfig();
22007
+ };
22008
+ var warnDeprecatedMediaId = (mediaId) => {
22009
+ if (!Number.isFinite(mediaId) || mediaId == null)
22010
+ return;
22011
+ const id = mediaId;
22012
+ if (deprecatedMediaWarnings.has(id))
22013
+ return;
22014
+ deprecatedMediaWarnings.add(id);
22015
+ if (typeof console !== "undefined" && console.warn) {
22016
+ console.warn("[DEPRECATED] <Img mediaId> is deprecated. Provide src + optixFlowConfig instead.", { mediaId: id });
22017
+ }
22018
+ };
22019
+ var isUrlString = (value) => typeof value === "string" && value.trim().length > 0;
22020
+ var parseDimension = (value) => {
22021
+ if (value === "" || value === null || typeof value === "undefined")
22022
+ return void 0;
22023
+ if (typeof value === "number" && Number.isFinite(value))
22024
+ return value;
22025
+ if (typeof value === "string") {
22026
+ const numeric = Number(value);
22027
+ if (Number.isFinite(numeric))
22028
+ return numeric;
22029
+ }
22030
+ return void 0;
22031
+ };
22032
+ var composeRefs = (hookRef, forwardedRef, localRef) => (0, import_react7.useCallback)((node) => {
22033
+ hookRef(node);
22034
+ localRef.current = node;
22035
+ if (typeof forwardedRef === "function") {
22036
+ forwardedRef(node);
22037
+ } else if (forwardedRef && typeof forwardedRef === "object") {
22038
+ forwardedRef.current = node;
22039
+ }
22040
+ }, [hookRef, forwardedRef, localRef]);
22041
+ function widthMapFromMetadata(v) {
22042
+ const w = v?.widths;
22043
+ if (!w)
22044
+ return null;
22045
+ return {
22046
+ sm: w.small ?? w.sm ?? DEFAULT_WIDTHS.sm,
22047
+ md: w.medium ?? w.md ?? DEFAULT_WIDTHS.md,
22048
+ lg: w.large ?? w.lg ?? DEFAULT_WIDTHS.lg,
22049
+ full: w.full_size ?? w.full ?? DEFAULT_WIDTHS.full
22050
+ };
22051
+ }
22052
+ function pickBest(sizes) {
22053
+ if (!sizes)
22054
+ return void 0;
22055
+ return sizes.md || sizes.lg || sizes.sm || sizes.full || Object.values(sizes).find(Boolean);
22056
+ }
22057
+ var DEFAULT_SIZES = "(max-width:640px) 640px, (max-width:1024px) 1024px, 1536px";
22058
+ var ModernImg = ({ sizes, loading, decoding, alt, title, src: directSrc, eager, intersectionMargin, intersectionThreshold, optixFlowConfig, forwardedRef, ...rest }) => {
22059
+ const imgRef = (0, import_react7.useRef)(null);
22060
+ const pictureRef = (0, import_react7.useRef)(null);
22061
+ useResponsiveReset(pictureRef);
22062
+ useMediaSelectionEffect();
22063
+ const normalizedSrc = (0, import_react7.useMemo)(() => typeof directSrc === "string" ? directSrc.trim() : "", [directSrc]);
22064
+ const numericWidth = (0, import_react7.useMemo)(() => parseDimension(rest.width), [rest]);
22065
+ const numericHeight = (0, import_react7.useMemo)(() => parseDimension(rest.height), [rest]);
22066
+ const resolvedOptixConfig = (0, import_react7.useMemo)(() => resolveOptixFlowConfig(optixFlowConfig), [optixFlowConfig]);
22067
+ const eagerLoad = eager ?? loading === "eager";
22068
+ const { ref: hookRef, src, srcset, sizes: computedSizes, loading: hookLoading, size } = useOptimizedImage({
22069
+ src: normalizedSrc,
22070
+ eager: eagerLoad,
22071
+ width: numericWidth,
22072
+ height: numericHeight,
22073
+ rootMargin: intersectionMargin ?? "200px",
22074
+ threshold: intersectionThreshold ?? 0.1,
22075
+ optixFlowConfig: resolvedOptixConfig
22076
+ });
22077
+ const mergedRef = composeRefs(hookRef, forwardedRef, imgRef);
22078
+ const { width, height, ...restProps } = rest;
22079
+ const sizesAttr = sizes ?? (computedSizes || void 0);
22080
+ const loadingAttr = loading ?? hookLoading ?? "lazy";
22081
+ const decodingAttr = decoding ?? "async";
22082
+ const hasSrcSet = Boolean(srcset.avif || srcset.webp || srcset.jpeg);
22083
+ const imgSrc = src || normalizedSrc || TRANSPARENT_PIXEL;
22084
+ const inlineSrcSet = hasSrcSet && !srcset.avif && !srcset.webp ? srcset.jpeg : "";
22085
+ const parsedWidth = parseDimension(width);
22086
+ const parsedHeight = parseDimension(height);
22087
+ const widthAttr = parsedWidth ?? (size.width || numericWidth || void 0);
22088
+ const heightAttr = parsedHeight ?? (size.height || numericHeight || void 0);
22089
+ if (!hasSrcSet) {
22090
+ return (0, import_jsx_runtime2.jsx)("img", { ref: mergedRef, src: imgSrc, loading: loadingAttr, decoding: decodingAttr, alt, title, width: widthAttr, height: heightAttr, ...restProps });
22091
+ }
22092
+ return (0, import_jsx_runtime2.jsxs)("picture", { ref: pictureRef, children: [srcset.avif ? (0, import_jsx_runtime2.jsx)("source", { type: "image/avif", srcSet: srcset.avif, sizes: sizesAttr }) : null, srcset.webp ? (0, import_jsx_runtime2.jsx)("source", { type: "image/webp", srcSet: srcset.webp, sizes: sizesAttr }) : null, (0, import_jsx_runtime2.jsx)("img", { ref: mergedRef, src: imgSrc, srcSet: inlineSrcSet || void 0, sizes: inlineSrcSet ? sizesAttr : void 0, loading: loadingAttr, decoding: decodingAttr, alt, title, width: widthAttr, height: heightAttr, ...restProps })] });
22093
+ };
22094
+ var LegacyImg = ({ mediaId, cdnHost, sizes, onImageData, loading, decoding, alt, title, src: directSrc, forwardedRef, ...rest }) => {
22095
+ const imgRef = (0, import_react7.useRef)(null);
22096
+ const pictureRef = (0, import_react7.useRef)(null);
22097
+ (0, import_react7.useImperativeHandle)(forwardedRef, () => imgRef.current);
22098
+ useResponsiveReset(pictureRef);
22099
+ useMediaSelectionEffect();
22100
+ const [data, setData] = (0, import_react7.useState)(null);
22101
+ const [retryCount, setRetryCount] = (0, import_react7.useState)(0);
22102
+ const hasMediaId = Number.isFinite(mediaId);
22103
+ const loadingAttr = loading ?? "lazy";
22104
+ const decodingAttr = decoding ?? "async";
22105
+ const [isInView, setIsInView] = (0, import_react7.useState)(() => !hasMediaId || loadingAttr !== "lazy");
22106
+ const cdnOrigin = (0, import_react7.useMemo)(() => (cdnHost ?? DEFAULT_CDN_HOST).replace(/\/$/, ""), [cdnHost]);
22107
+ (0, import_react7.useEffect)(() => {
22108
+ if (!hasMediaId) {
22109
+ setData(null);
22110
+ setRetryCount(0);
22111
+ return;
22112
+ }
22113
+ setData(null);
22114
+ setRetryCount(0);
22115
+ }, [hasMediaId, mediaId, cdnHost]);
22116
+ (0, import_react7.useEffect)(() => {
22117
+ if (!hasMediaId) {
22118
+ return;
22119
+ }
22120
+ const controller = new AbortController();
22121
+ fetchImageData(mediaId, {
22122
+ cdnHost,
22123
+ signal: controller.signal,
22124
+ bypassCache: retryCount > 0
22125
+ }).then((d) => {
22126
+ setData(d);
22127
+ onImageData?.(d);
22128
+ }).catch((err) => {
22129
+ if (err?.name !== "AbortError") {
22130
+ console.warn("Image data fetch failed:", err);
22131
+ }
22132
+ });
22133
+ return () => controller.abort();
22134
+ }, [hasMediaId, mediaId, cdnHost, onImageData, retryCount]);
22135
+ (0, import_react7.useEffect)(() => {
22136
+ if (!hasMediaId || loadingAttr !== "lazy") {
22137
+ setIsInView(true);
22138
+ return;
22139
+ }
22140
+ setIsInView(false);
22141
+ }, [hasMediaId, mediaId, loadingAttr]);
22142
+ (0, import_react7.useEffect)(() => {
22143
+ if (!hasMediaId || loadingAttr !== "lazy" || isInView) {
22144
+ return;
22145
+ }
22146
+ if (typeof window === "undefined" || typeof window.IntersectionObserver === "undefined") {
22147
+ setIsInView(true);
22148
+ return;
22149
+ }
22150
+ const node = imgRef.current;
22151
+ if (!node) {
22152
+ return;
22153
+ }
22154
+ const observer = new IntersectionObserver((entries) => {
22155
+ if (entries.some((entry) => entry.isIntersecting)) {
22156
+ setIsInView(true);
22157
+ observer.disconnect();
22158
+ }
22159
+ }, { rootMargin: "200px" });
22160
+ observer.observe(node);
22161
+ return () => observer.disconnect();
22162
+ }, [hasMediaId, loadingAttr, isInView]);
22163
+ const picture = (0, import_react7.useMemo)(() => {
22164
+ if (!data)
22165
+ return null;
22166
+ const v = data.variants_data?.variants ?? {};
22167
+ const webp2 = v.WEBP;
22168
+ const avif2 = v.AVIF;
22169
+ const jpeg2 = v.JPEG;
22170
+ const widths = widthMapFromMetadata(v.WEBP?.metadata) || widthMapFromMetadata(v.JPEG?.metadata) || { ...DEFAULT_WIDTHS };
22171
+ const ensureAbsolute = (url) => {
22172
+ if (!isUrlString(url))
22173
+ return void 0;
22174
+ if (/^https?:\/\//i.test(url) || url.startsWith("data:"))
22175
+ return url;
22176
+ if (url.startsWith("//"))
22177
+ return `https:${url}`;
22178
+ if (url.startsWith("/"))
22179
+ return `${cdnOrigin}${url}`;
22180
+ return `${cdnOrigin}/${url}`;
22181
+ };
22182
+ const normalizeCandidate = (candidate) => ensureAbsolute(typeof candidate === "string" ? candidate : void 0);
22183
+ const variantCandidates = [
22184
+ pickBest(webp2),
22185
+ pickBest(jpeg2),
22186
+ pickBest(avif2),
22187
+ webp2?.sm,
22188
+ webp2?.md,
22189
+ webp2?.lg,
22190
+ webp2?.full,
22191
+ jpeg2?.sm,
22192
+ jpeg2?.md,
22193
+ jpeg2?.lg,
22194
+ jpeg2?.full,
22195
+ avif2?.sm,
22196
+ avif2?.md,
22197
+ avif2?.lg,
22198
+ avif2?.full
22199
+ ].map((candidate) => normalizeCandidate(candidate ?? void 0)).filter(isUrlString);
22200
+ const raw = data;
22201
+ const directCandidates = [
22202
+ raw.img_url,
22203
+ raw.file_data_url,
22204
+ raw.file_data_thumbnail_url,
22205
+ raw.img_src,
22206
+ raw.med_src,
22207
+ raw.thumb_src,
22208
+ raw.low_res_thumb
22209
+ ].map((candidate) => isUrlString(candidate) ? normalizeCandidate(candidate) : void 0).filter(isUrlString);
22210
+ const fallbackCandidates = raw.fallback_url ? [normalizeCandidate(raw.fallback_url)].filter(isUrlString) : [];
22211
+ const fallback2 = [...variantCandidates, ...directCandidates, ...fallbackCandidates][0];
22212
+ if (!fallback2) {
22213
+ return null;
22214
+ }
22215
+ const toSrcSet2 = (sizes2) => {
22216
+ if (!sizes2)
22217
+ return void 0;
22218
+ const entries = [];
22219
+ const push = (url, width) => {
22220
+ const absolute = normalizeCandidate(url);
22221
+ if (absolute && width)
22222
+ entries.push(`${absolute} ${width}w`);
22223
+ };
22224
+ push(sizes2.sm, widths.sm);
22225
+ push(sizes2.md, widths.md);
22226
+ push(sizes2.lg, widths.lg);
22227
+ push(sizes2.full, widths.full);
22228
+ return entries.length ? entries.join(", ") : void 0;
22229
+ };
22230
+ return { webp: webp2, avif: avif2, jpeg: jpeg2, toSrcSet: toSrcSet2, fallback: fallback2, widths, hasVariantSource: variantCandidates.length > 0 };
22231
+ }, [data, cdnOrigin]);
22232
+ const hasVariantEntries = (0, import_react7.useMemo)(() => imageVariantsHaveRenderableSource(data?.variants_data?.variants ?? null), [data]);
22233
+ const variantsStatus = (0, import_react7.useMemo)(() => {
22234
+ const status = data?.variants_data?.status ?? data?.variants_status ?? "";
22235
+ return typeof status === "string" ? status.toLowerCase() : "";
22236
+ }, [data]);
22237
+ const variantsFailed = variantsStatus === "failed" || variantsStatus === "error";
22238
+ const shouldPollForVariants = hasMediaId && Boolean(data) && !variantsFailed && !hasVariantEntries && retryCount < MAX_VARIANT_REFRESH_ATTEMPTS;
22239
+ (0, import_react7.useEffect)(() => {
22240
+ if (!shouldPollForVariants) {
22241
+ return;
22242
+ }
22243
+ if (typeof window === "undefined") {
22244
+ return;
22245
+ }
22246
+ const timeoutId = window.setTimeout(() => {
22247
+ setRetryCount((count) => count + 1);
22248
+ }, VARIANT_REFRESH_DELAY_MS);
22249
+ return () => window.clearTimeout(timeoutId);
22250
+ }, [shouldPollForVariants]);
22251
+ const altAttr = (0, import_react7.useMemo)(() => {
22252
+ if (typeof alt === "string")
22253
+ return alt;
22254
+ return data?.meta?.content_manifest?.summary ?? void 0;
22255
+ }, [alt, data]);
22256
+ const titleAttr = (0, import_react7.useMemo)(() => {
22257
+ if (typeof title === "string")
22258
+ return title;
22259
+ return data?.meta?.content_manifest?.title ?? void 0;
22260
+ }, [title, data]);
22261
+ const widthAttr = (0, import_react7.useMemo)(() => data?.meta?.sizing?.width ?? data?.variants_data?.metadata?.width ?? void 0, [data]);
22262
+ const heightAttr = (0, import_react7.useMemo)(() => data?.meta?.sizing?.height ?? data?.variants_data?.metadata?.height ?? void 0, [data]);
22263
+ const dataFilename = (0, import_react7.useMemo)(() => {
22264
+ const base = data?.meta?.content_manifest?.optimized_filename;
22265
+ if (!base)
22266
+ return void 0;
22267
+ const href = picture?.fallback;
22268
+ if (!href)
22269
+ return void 0;
22270
+ const dot = href.lastIndexOf(".");
22271
+ const ext = dot > -1 ? href.slice(dot + 1).toLowerCase() : "jpg";
22272
+ return `${base}.${ext}`;
22273
+ }, [data, picture]);
22274
+ if (!hasMediaId) {
22275
+ const r = { ...rest };
22276
+ return (0, import_jsx_runtime2.jsx)("img", { ref: imgRef, src: directSrc, loading: loadingAttr, decoding: decodingAttr, alt: altAttr, title: titleAttr, width: r.width, height: r.height, ...r });
22277
+ }
22278
+ const placeholderSrc = buildPlaceholderImageUrl(mediaId, cdnHost);
22279
+ if (!data || !picture || !isInView) {
22280
+ const r = { ...rest };
22281
+ return (0, import_jsx_runtime2.jsx)("img", { ref: imgRef, src: placeholderSrc, loading: loadingAttr, decoding: decodingAttr, alt: altAttr, title: titleAttr, width: r.width ?? widthAttr, height: r.height ?? heightAttr, ...r });
22282
+ }
22283
+ const sizesAttr = sizes ?? DEFAULT_SIZES;
22284
+ const { webp, avif, jpeg, toSrcSet, fallback } = picture;
22285
+ const webpSet = toSrcSet(webp);
22286
+ const avifSet = toSrcSet(avif);
22287
+ const jpegSet = toSrcSet(jpeg);
22288
+ if (webpSet || avifSet || jpegSet) {
22289
+ return (0, import_jsx_runtime2.jsxs)("picture", { children: [avifSet ? (0, import_jsx_runtime2.jsx)("source", { type: "image/avif", srcSet: avifSet, sizes: sizesAttr }) : null, webpSet ? (0, import_jsx_runtime2.jsx)("source", { type: "image/webp", srcSet: webpSet, sizes: sizesAttr }) : null, (0, import_jsx_runtime2.jsx)("img", { ref: imgRef, src: fallback, srcSet: jpegSet && !webpSet && !avifSet ? jpegSet : void 0, sizes: jpegSet && !webpSet && !avifSet ? sizesAttr : void 0, loading: loadingAttr, decoding: decodingAttr, alt: altAttr, title: titleAttr, width: widthAttr, height: heightAttr, "data-filename": dataFilename, ...rest })] });
22290
+ }
22291
+ return (0, import_jsx_runtime2.jsx)("img", { ref: imgRef, src: fallback, loading: loadingAttr, decoding: decodingAttr, alt: altAttr, title: titleAttr, width: widthAttr, height: heightAttr, "data-filename": dataFilename, ...rest });
22292
+ };
22293
+ var ImgBase = (0, import_react7.forwardRef)(function Img(props, ref) {
22294
+ const hasMediaId = Number.isFinite(props.mediaId);
22295
+ if (hasMediaId) {
22296
+ warnDeprecatedMediaId(props.mediaId);
22297
+ return (0, import_jsx_runtime2.jsx)(LegacyImg, { ...props, forwardedRef: ref });
22298
+ }
22299
+ const hasSrc = typeof props.src === "string" && props.src.trim().length > 0;
22300
+ if (!hasSrc) {
22301
+ if (typeof console !== "undefined" && console.warn) {
22302
+ console.warn("<Img /> requires either src or mediaId. No src provided, rendering null.");
22303
+ }
22304
+ return null;
22305
+ }
22306
+ return (0, import_jsx_runtime2.jsx)(ModernImg, { ...props, forwardedRef: ref });
22307
+ });
22308
+ var Img2 = (0, import_react7.memo)(ImgBase);
22309
+ Img2.displayName = "PageSpeedImg";
22310
+
21648
22311
  // src/renderers/ImageRenderer.tsx
21649
- var import_jsx_runtime2 = __toESM(require_jsx_runtime());
21650
- function ImageRenderer({ item }) {
22312
+ var import_jsx_runtime3 = __toESM(require_jsx_runtime());
22313
+ var toImgOptixFlowConfig = (config) => {
22314
+ if (!config) return void 0;
22315
+ const { compression, ...rest } = config;
22316
+ const base = rest;
22317
+ return {
22318
+ ...base,
22319
+ compressionLevel: typeof compression === "number" ? compression : base.compressionLevel
22320
+ };
22321
+ };
22322
+ function ImageRenderer({ item, optixFlowConfig }) {
21651
22323
  if (!item.src) return null;
21652
- return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
21653
- "img",
22324
+ return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
22325
+ Img2,
21654
22326
  {
21655
22327
  className: Lightbox_default.media,
21656
22328
  src: item.src,
21657
- srcSet: item.srcSet,
21658
22329
  alt: item.alt || item.title || "",
21659
- loading: "lazy"
22330
+ loading: "lazy",
22331
+ optixFlowConfig: toImgOptixFlowConfig(optixFlowConfig)
21660
22332
  }
21661
22333
  );
21662
22334
  }
21663
22335
 
21664
22336
  // src/renderers/VideoRenderer.tsx
21665
- var import_jsx_runtime3 = __toESM(require_jsx_runtime());
22337
+ var import_jsx_runtime4 = __toESM(require_jsx_runtime());
21666
22338
  function VideoRenderer({ item }) {
21667
22339
  if (!item.src) return null;
21668
- return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
22340
+ return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
21669
22341
  "video",
21670
22342
  {
21671
22343
  className: Lightbox_default.media,
@@ -21677,8 +22349,8 @@ function VideoRenderer({ item }) {
21677
22349
  }
21678
22350
 
21679
22351
  // src/renderers/PDFRenderer.tsx
21680
- var import_react12 = __toESM(require_react());
21681
- var import_jsx_runtime8 = __toESM(require_jsx_runtime());
22352
+ var import_react16 = __toESM(require_react());
22353
+ var import_jsx_runtime9 = __toESM(require_jsx_runtime());
21682
22354
  function loadPDFViewer() {
21683
22355
  return Promise.resolve().then(() => (init_dist(), dist_exports)).then((mod) => ({
21684
22356
  // The PDF viewer package exposes a named PDFViewer export.
@@ -21686,47 +22358,54 @@ function loadPDFViewer() {
21686
22358
  default: mod.PDFViewer
21687
22359
  }));
21688
22360
  }
21689
- var LazyPDFViewer = import_react12.default.lazy(loadPDFViewer);
22361
+ var LazyPDFViewer = import_react16.default.lazy(loadPDFViewer);
21690
22362
  var AnyPDFViewer = LazyPDFViewer;
21691
22363
  function PDFRenderer({ item }) {
21692
22364
  if (!item.src) return null;
21693
- return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: Lightbox_default.pdfContainer, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
21694
- import_react12.Suspense,
22365
+ return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: Lightbox_default.pdfContainer, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
22366
+ import_react16.Suspense,
21695
22367
  {
21696
- fallback: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: Lightbox_default.pdfFallback, children: "Loading document..." }),
21697
- children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(AnyPDFViewer, { url: item.src })
22368
+ fallback: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: Lightbox_default.pdfFallback, children: "Loading document..." }),
22369
+ children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(AnyPDFViewer, { url: item.src })
21698
22370
  }
21699
22371
  ) });
21700
22372
  }
21701
22373
 
21702
22374
  // src/renderers/ComponentRenderer.tsx
21703
- var import_jsx_runtime9 = __toESM(require_jsx_runtime());
22375
+ var import_jsx_runtime10 = __toESM(require_jsx_runtime());
21704
22376
  function ComponentRenderer({ item }) {
21705
22377
  if (!item.component) return null;
21706
22378
  const Component = item.component;
21707
- return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Component, { ...item.data || {} });
22379
+ return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Component, { ...item.data || {} });
21708
22380
  }
21709
22381
 
21710
22382
  // src/components/LightboxContent.tsx
21711
- var import_jsx_runtime10 = __toESM(require_jsx_runtime());
21712
- function LightboxContent({ item, layout }) {
22383
+ var import_jsx_runtime11 = __toESM(require_jsx_runtime());
22384
+ function LightboxContent({ item, layout, optixFlowConfig }) {
21713
22385
  if (!item) return null;
21714
22386
  switch (item.type) {
21715
22387
  case "image":
21716
- return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(ImageRenderer, { item, layout });
22388
+ return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
22389
+ ImageRenderer,
22390
+ {
22391
+ item,
22392
+ layout,
22393
+ optixFlowConfig
22394
+ }
22395
+ );
21717
22396
  case "video":
21718
- return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(VideoRenderer, { item, layout });
22397
+ return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(VideoRenderer, { item, layout });
21719
22398
  case "pdf":
21720
- return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(PDFRenderer, { item, layout });
22399
+ return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(PDFRenderer, { item, layout });
21721
22400
  case "component":
21722
- return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(ComponentRenderer, { item });
22401
+ return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(ComponentRenderer, { item });
21723
22402
  default:
21724
22403
  return null;
21725
22404
  }
21726
22405
  }
21727
22406
 
21728
22407
  // src/components/LightboxChrome.tsx
21729
- var import_jsx_runtime11 = __toESM(require_jsx_runtime());
22408
+ var import_jsx_runtime12 = __toESM(require_jsx_runtime());
21730
22409
  var DEFAULT_CONTROLS = {
21731
22410
  navigation: true,
21732
22411
  keyboard: true,
@@ -21756,9 +22435,9 @@ function LightboxChrome({
21756
22435
  onClose
21757
22436
  }) {
21758
22437
  const resolved = mergeControls(controls);
21759
- return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: Lightbox_default.chrome, children: [
21760
- resolved.navigation && /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: Lightbox_default.chromeSection, children: [
21761
- /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
22438
+ return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: Lightbox_default.chrome, children: [
22439
+ resolved.navigation && /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: Lightbox_default.chromeSection, children: [
22440
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
21762
22441
  "button",
21763
22442
  {
21764
22443
  type: "button",
@@ -21769,7 +22448,7 @@ function LightboxChrome({
21769
22448
  children: "\u2039"
21770
22449
  }
21771
22450
  ),
21772
- /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
22451
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
21773
22452
  "button",
21774
22453
  {
21775
22454
  type: "button",
@@ -21781,17 +22460,17 @@ function LightboxChrome({
21781
22460
  }
21782
22461
  )
21783
22462
  ] }),
21784
- /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: Lightbox_default.chromeSection, children: resolved.captions && currentItem && /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: Lightbox_default.captionContainer, children: [
21785
- currentItem.title && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: Lightbox_default.captionTitle, children: currentItem.title }),
21786
- currentItem.caption && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: Lightbox_default.captionText, children: currentItem.caption })
22463
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: Lightbox_default.chromeSection, children: resolved.captions && currentItem && /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: Lightbox_default.captionContainer, children: [
22464
+ currentItem.title && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: Lightbox_default.captionTitle, children: currentItem.title }),
22465
+ currentItem.caption && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: Lightbox_default.captionText, children: currentItem.caption })
21787
22466
  ] }) }),
21788
- /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: Lightbox_default.chromeSection, children: [
21789
- resolved.counter && totalItems > 0 && /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("span", { className: Lightbox_default.counter, children: [
22467
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: Lightbox_default.chromeSection, children: [
22468
+ resolved.counter && totalItems > 0 && /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("span", { className: Lightbox_default.counter, children: [
21790
22469
  currentIndex + 1,
21791
22470
  " / ",
21792
22471
  totalItems
21793
22472
  ] }),
21794
- resolved.closeButton && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
22473
+ resolved.closeButton && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
21795
22474
  "button",
21796
22475
  {
21797
22476
  type: "button",
@@ -21806,7 +22485,7 @@ function LightboxChrome({
21806
22485
  }
21807
22486
 
21808
22487
  // src/components/Layouts/HorizontalLayout.tsx
21809
- var import_jsx_runtime12 = __toESM(require_jsx_runtime());
22488
+ var import_jsx_runtime13 = __toESM(require_jsx_runtime());
21810
22489
  function HorizontalLayout({
21811
22490
  content,
21812
22491
  chrome,
@@ -21820,7 +22499,7 @@ function HorizontalLayout({
21820
22499
  height,
21821
22500
  ...style
21822
22501
  };
21823
- return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: Lightbox_default.horizontalLayoutRoot, style: containerStyle, children: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
22502
+ return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: Lightbox_default.horizontalLayoutRoot, style: containerStyle, children: /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
21824
22503
  "div",
21825
22504
  {
21826
22505
  className: [
@@ -21828,15 +22507,128 @@ function HorizontalLayout({
21828
22507
  className || ""
21829
22508
  ].join(" ").trim(),
21830
22509
  children: [
21831
- /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: Lightbox_default.mainContent, children: content }),
21832
- /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: Lightbox_default.toolbar, children: chrome })
22510
+ /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: Lightbox_default.mainContent, children: content }),
22511
+ /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: Lightbox_default.toolbar, children: chrome })
22512
+ ]
22513
+ }
22514
+ ) });
22515
+ }
22516
+
22517
+ // src/components/Layouts/VerticalSplitLayout.tsx
22518
+ var import_jsx_runtime14 = __toESM(require_jsx_runtime());
22519
+ function VerticalSplitLayout({
22520
+ content,
22521
+ chrome,
22522
+ height,
22523
+ maxWidth,
22524
+ className,
22525
+ style
22526
+ }) {
22527
+ const containerStyle = {
22528
+ maxWidth,
22529
+ height,
22530
+ ...style
22531
+ };
22532
+ return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: Lightbox_default.verticalSplitLayoutRoot, style: containerStyle, children: /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
22533
+ "div",
22534
+ {
22535
+ className: [
22536
+ Lightbox_default.verticalSplitLayoutContainer,
22537
+ className || ""
22538
+ ].join(" ").trim(),
22539
+ children: [
22540
+ /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: Lightbox_default.verticalSplitContent, children: content }),
22541
+ /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: Lightbox_default.verticalSplitSidebar, children: chrome })
22542
+ ]
22543
+ }
22544
+ ) });
22545
+ }
22546
+
22547
+ // src/components/Layouts/CustomSlideLayout.tsx
22548
+ var import_jsx_runtime15 = __toESM(require_jsx_runtime());
22549
+ function CustomSlideLayout({
22550
+ content,
22551
+ chrome,
22552
+ height,
22553
+ maxWidth,
22554
+ className,
22555
+ style
22556
+ }) {
22557
+ const containerStyle = {
22558
+ maxWidth,
22559
+ height,
22560
+ ...style
22561
+ };
22562
+ return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: Lightbox_default.customSlideLayoutRoot, style: containerStyle, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
22563
+ "div",
22564
+ {
22565
+ className: [
22566
+ Lightbox_default.customSlideLayoutContainer,
22567
+ className || ""
22568
+ ].join(" ").trim(),
22569
+ children: [
22570
+ /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: Lightbox_default.customSlideContent, children: content }),
22571
+ /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: Lightbox_default.customSlideChrome, children: chrome })
22572
+ ]
22573
+ }
22574
+ ) });
22575
+ }
22576
+
22577
+ // src/components/Layouts/FullscreenLayout.tsx
22578
+ var import_jsx_runtime16 = __toESM(require_jsx_runtime());
22579
+ function FullscreenLayout({
22580
+ content,
22581
+ chrome,
22582
+ className,
22583
+ style
22584
+ }) {
22585
+ return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: Lightbox_default.fullscreenLayoutRoot, style, children: /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
22586
+ "div",
22587
+ {
22588
+ className: [
22589
+ Lightbox_default.fullscreenLayoutContainer,
22590
+ className || ""
22591
+ ].join(" ").trim(),
22592
+ children: [
22593
+ /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: Lightbox_default.fullscreenContent, children: content }),
22594
+ /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: Lightbox_default.fullscreenChrome, children: chrome })
22595
+ ]
22596
+ }
22597
+ ) });
22598
+ }
22599
+
22600
+ // src/components/Layouts/InlineLayout.tsx
22601
+ var import_jsx_runtime17 = __toESM(require_jsx_runtime());
22602
+ function InlineLayout({
22603
+ content,
22604
+ chrome,
22605
+ height,
22606
+ maxWidth,
22607
+ className,
22608
+ style
22609
+ }) {
22610
+ const containerStyle = {
22611
+ maxWidth,
22612
+ height,
22613
+ ...style
22614
+ };
22615
+ return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: Lightbox_default.inlineLayoutRoot, style: containerStyle, children: /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
22616
+ "div",
22617
+ {
22618
+ className: [
22619
+ Lightbox_default.inlineLayoutContainer,
22620
+ className || ""
22621
+ ].join(" ").trim(),
22622
+ children: [
22623
+ /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: Lightbox_default.inlineContent, children: content }),
22624
+ /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: Lightbox_default.inlineToolbar, children: chrome })
21833
22625
  ]
21834
22626
  }
21835
22627
  ) });
21836
22628
  }
21837
22629
 
21838
22630
  // src/components/Lightbox.tsx
21839
- var import_jsx_runtime13 = __toESM(require_jsx_runtime());
22631
+ var import_jsx_runtime18 = __toESM(require_jsx_runtime());
21840
22632
  function Lightbox(props) {
21841
22633
  const { items, initialIndex = 0 } = props;
21842
22634
  const gallery = useGalleryState({
@@ -21845,14 +22637,14 @@ function Lightbox(props) {
21845
22637
  onSelect: props.onSelect
21846
22638
  });
21847
22639
  const { breakpoint } = useResponsiveness();
21848
- const layout = (0, import_react13.useMemo)(() => {
22640
+ const layout = (0, import_react17.useMemo)(() => {
21849
22641
  if (props.layout) return props.layout;
21850
22642
  if (breakpoint === "mobile") return "fullscreen";
21851
22643
  if (breakpoint === "tablet") return "vertical-split";
21852
22644
  return "horizontal";
21853
22645
  }, [props.layout, breakpoint]);
21854
- const didCloseRef = (0, import_react13.useRef)(false);
21855
- (0, import_react13.useEffect)(() => {
22646
+ const didCloseRef = (0, import_react17.useRef)(false);
22647
+ (0, import_react17.useEffect)(() => {
21856
22648
  props.onOpen?.();
21857
22649
  if (props.disableScroll === false) {
21858
22650
  return () => {
@@ -21877,17 +22669,17 @@ function Lightbox(props) {
21877
22669
  }
21878
22670
  };
21879
22671
  }, [props.disableScroll, props.onOpen, props.onClose]);
21880
- const handleClose = (0, import_react13.useCallback)(() => {
22672
+ const handleClose = (0, import_react17.useCallback)(() => {
21881
22673
  if (didCloseRef.current) return;
21882
22674
  didCloseRef.current = true;
21883
22675
  props.onClose?.();
21884
22676
  }, [props.onClose]);
21885
- const handleNext = (0, import_react13.useCallback)(() => {
22677
+ const handleNext = (0, import_react17.useCallback)(() => {
21886
22678
  if (!gallery.canNext) return;
21887
22679
  gallery.next();
21888
22680
  props.onNext?.();
21889
22681
  }, [gallery, props.onNext]);
21890
- const handlePrev = (0, import_react13.useCallback)(() => {
22682
+ const handlePrev = (0, import_react17.useCallback)(() => {
21891
22683
  if (!gallery.canPrev) return;
21892
22684
  gallery.prev();
21893
22685
  props.onPrev?.();
@@ -21913,64 +22705,90 @@ function Lightbox(props) {
21913
22705
  captions: true,
21914
22706
  ...props.controls
21915
22707
  };
21916
- return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: Lightbox_default.lightboxPortal, role: "dialog", "aria-modal": "true", children: [
21917
- /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
22708
+ const contentNode = /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
22709
+ LightboxContent,
22710
+ {
22711
+ item: currentItem,
22712
+ layout,
22713
+ optixFlowConfig: props.optixFlowConfig
22714
+ }
22715
+ );
22716
+ const chromeNode = /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
22717
+ LightboxChrome,
22718
+ {
22719
+ currentIndex: gallery.currentIndex,
22720
+ totalItems: items.length,
22721
+ currentItem,
22722
+ canNext: gallery.canNext,
22723
+ canPrev: gallery.canPrev,
22724
+ controls: effectiveControls,
22725
+ onNext: handleNext,
22726
+ onPrev: handlePrev,
22727
+ onClose: handleClose
22728
+ }
22729
+ );
22730
+ const layoutProps = {
22731
+ content: contentNode,
22732
+ chrome: chromeNode,
22733
+ height: props.height,
22734
+ maxWidth: props.maxWidth,
22735
+ className: props.className,
22736
+ style: props.style
22737
+ };
22738
+ if (layout === "inline") {
22739
+ return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(InlineLayout, { ...layoutProps });
22740
+ }
22741
+ let layoutComponent;
22742
+ switch (layout) {
22743
+ case "vertical-split":
22744
+ layoutComponent = /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(VerticalSplitLayout, { ...layoutProps });
22745
+ break;
22746
+ case "custom-slide":
22747
+ layoutComponent = /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(CustomSlideLayout, { ...layoutProps });
22748
+ break;
22749
+ case "fullscreen":
22750
+ layoutComponent = /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(FullscreenLayout, { ...layoutProps });
22751
+ break;
22752
+ case "horizontal":
22753
+ default:
22754
+ layoutComponent = /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(HorizontalLayout, { ...layoutProps });
22755
+ break;
22756
+ }
22757
+ return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: Lightbox_default.lightboxPortal, role: "dialog", "aria-modal": "true", children: [
22758
+ /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
21918
22759
  LightboxOverlay,
21919
22760
  {
21920
22761
  onClose: handleClose,
21921
22762
  closeOnBackdropClick: props.closeOnBackdropClick ?? true
21922
22763
  }
21923
22764
  ),
21924
- /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
21925
- HorizontalLayout,
21926
- {
21927
- content: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(LightboxContent, { item: currentItem, layout }),
21928
- chrome: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
21929
- LightboxChrome,
21930
- {
21931
- currentIndex: gallery.currentIndex,
21932
- totalItems: items.length,
21933
- currentItem,
21934
- canNext: gallery.canNext,
21935
- canPrev: gallery.canPrev,
21936
- controls: effectiveControls,
21937
- onNext: handleNext,
21938
- onPrev: handlePrev,
21939
- onClose: handleClose
21940
- }
21941
- ),
21942
- height: props.height,
21943
- maxWidth: props.maxWidth,
21944
- className: props.className,
21945
- style: props.style
21946
- }
21947
- )
22765
+ layoutComponent
21948
22766
  ] });
21949
22767
  }
21950
22768
 
21951
22769
  // src/hooks/useLightboxState.ts
21952
- var import_react14 = __toESM(require_react());
22770
+ var import_react18 = __toESM(require_react());
21953
22771
  function useLightboxState({
21954
22772
  onOpen,
21955
22773
  onClose,
21956
22774
  disableScroll = true
21957
22775
  }) {
21958
- const [isOpen, setIsOpen] = (0, import_react14.useState)(false);
21959
- const open = (0, import_react14.useCallback)(() => {
22776
+ const [isOpen, setIsOpen] = (0, import_react18.useState)(false);
22777
+ const open = (0, import_react18.useCallback)(() => {
21960
22778
  setIsOpen(true);
21961
22779
  onOpen?.();
21962
22780
  if (disableScroll) {
21963
22781
  document.body.style.overflow = "hidden";
21964
22782
  }
21965
22783
  }, [onOpen, disableScroll]);
21966
- const close = (0, import_react14.useCallback)(() => {
22784
+ const close = (0, import_react18.useCallback)(() => {
21967
22785
  setIsOpen(false);
21968
22786
  onClose?.();
21969
22787
  if (disableScroll) {
21970
22788
  document.body.style.overflow = "";
21971
22789
  }
21972
22790
  }, [onClose, disableScroll]);
21973
- (0, import_react14.useEffect)(() => {
22791
+ (0, import_react18.useEffect)(() => {
21974
22792
  return () => {
21975
22793
  if (disableScroll) {
21976
22794
  document.body.style.overflow = "";