hono-decks 0.4.0 → 0.4.1
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/advanced.js +42 -82
- package/dist/mod.js +50 -74
- package/dist/node.js +42 -82
- package/package.json +1 -1
package/dist/advanced.js
CHANGED
|
@@ -1779,12 +1779,7 @@ function renderViewerScript(nonce) {
|
|
|
1779
1779
|
const iframe = root.querySelector("iframe");
|
|
1780
1780
|
const frameOrigin = iframe?.src ? new URL(iframe.src, window.location.href).origin : window.location.origin;
|
|
1781
1781
|
const position = root.querySelector("[data-slide-position]");
|
|
1782
|
-
const navigationLayers = root.querySelectorAll("[data-viewer-navigation]");
|
|
1783
1782
|
const printPath = root.getAttribute("data-hono-decks-print-path") || "";
|
|
1784
|
-
let pointerStartX = null;
|
|
1785
|
-
let pointerStartY = null;
|
|
1786
|
-
let suppressNavigationClick = false;
|
|
1787
|
-
let suppressNavigationClickTimer = null;
|
|
1788
1783
|
|
|
1789
1784
|
if (position && viewport) viewport.append(position);
|
|
1790
1785
|
|
|
@@ -1802,53 +1797,6 @@ function renderViewerScript(nonce) {
|
|
|
1802
1797
|
target?.postMessage({ type: ${JSON.stringify(VIEWER_COMMAND_MESSAGE_TYPE)}, action, index }, frameOrigin);
|
|
1803
1798
|
}
|
|
1804
1799
|
|
|
1805
|
-
function navigationClick(event) {
|
|
1806
|
-
if (suppressNavigationClick) {
|
|
1807
|
-
clearNavigationClickSuppression();
|
|
1808
|
-
event.preventDefault();
|
|
1809
|
-
return;
|
|
1810
|
-
}
|
|
1811
|
-
const action = event.currentTarget?.getAttribute("data-viewer-navigation");
|
|
1812
|
-
if (action === "previous" || action === "next") {
|
|
1813
|
-
sendCommand(action);
|
|
1814
|
-
viewport?.focus({ preventScroll: true });
|
|
1815
|
-
}
|
|
1816
|
-
}
|
|
1817
|
-
|
|
1818
|
-
function clearNavigationClickSuppression() {
|
|
1819
|
-
suppressNavigationClick = false;
|
|
1820
|
-
if (suppressNavigationClickTimer !== null) window.clearTimeout(suppressNavigationClickTimer);
|
|
1821
|
-
suppressNavigationClickTimer = null;
|
|
1822
|
-
}
|
|
1823
|
-
|
|
1824
|
-
function suppressCurrentNavigationClick() {
|
|
1825
|
-
clearNavigationClickSuppression();
|
|
1826
|
-
suppressNavigationClick = true;
|
|
1827
|
-
suppressNavigationClickTimer = window.setTimeout(clearNavigationClickSuppression, 0);
|
|
1828
|
-
}
|
|
1829
|
-
|
|
1830
|
-
function viewerPointerDown(event) {
|
|
1831
|
-
pointerStartX = event.clientX;
|
|
1832
|
-
pointerStartY = event.clientY;
|
|
1833
|
-
}
|
|
1834
|
-
|
|
1835
|
-
function viewerPointerUp(event) {
|
|
1836
|
-
if (pointerStartX === null || pointerStartY === null) return;
|
|
1837
|
-
const deltaX = event.clientX - pointerStartX;
|
|
1838
|
-
const deltaY = event.clientY - pointerStartY;
|
|
1839
|
-
pointerStartX = null;
|
|
1840
|
-
pointerStartY = null;
|
|
1841
|
-
if (Math.abs(deltaX) < 48 || Math.abs(deltaX) < Math.abs(deltaY)) return;
|
|
1842
|
-
suppressCurrentNavigationClick();
|
|
1843
|
-
sendCommand(deltaX < 0 ? "next" : "previous");
|
|
1844
|
-
}
|
|
1845
|
-
|
|
1846
|
-
function viewerPointerCancel() {
|
|
1847
|
-
pointerStartX = null;
|
|
1848
|
-
pointerStartY = null;
|
|
1849
|
-
clearNavigationClickSuppression();
|
|
1850
|
-
}
|
|
1851
|
-
|
|
1852
1800
|
function isPortraitMobile() {
|
|
1853
1801
|
return window.matchMedia("(orientation: portrait) and (pointer: coarse)").matches;
|
|
1854
1802
|
}
|
|
@@ -1918,9 +1866,15 @@ function renderViewerScript(nonce) {
|
|
|
1918
1866
|
root.querySelectorAll("[data-action='previous']").forEach((control) => {
|
|
1919
1867
|
control.addEventListener("click", () => sendCommand("previous"));
|
|
1920
1868
|
});
|
|
1869
|
+
root.querySelectorAll("[data-hono-decks-mobile-action='previous']").forEach((control) => {
|
|
1870
|
+
control.addEventListener("click", () => sendCommand("previous"));
|
|
1871
|
+
});
|
|
1921
1872
|
root.querySelectorAll("[data-action='next']").forEach((control) => {
|
|
1922
1873
|
control.addEventListener("click", () => sendCommand("next"));
|
|
1923
1874
|
});
|
|
1875
|
+
root.querySelectorAll("[data-hono-decks-mobile-action='next']").forEach((control) => {
|
|
1876
|
+
control.addEventListener("click", () => sendCommand("next"));
|
|
1877
|
+
});
|
|
1924
1878
|
root.querySelectorAll("[data-action='fullscreen']").forEach((control) => {
|
|
1925
1879
|
control.addEventListener("click", () => { void toggleViewerFullscreen(); });
|
|
1926
1880
|
});
|
|
@@ -1930,10 +1884,6 @@ function renderViewerScript(nonce) {
|
|
|
1930
1884
|
if (Number.isFinite(index)) sendCommand("goTo", index);
|
|
1931
1885
|
});
|
|
1932
1886
|
});
|
|
1933
|
-
navigationLayers.forEach((layer) => layer.addEventListener("click", navigationClick));
|
|
1934
|
-
viewport?.addEventListener("pointerdown", viewerPointerDown);
|
|
1935
|
-
viewport?.addEventListener("pointerup", viewerPointerUp);
|
|
1936
|
-
viewport?.addEventListener("pointercancel", viewerPointerCancel);
|
|
1937
1887
|
window.addEventListener("message", handleMessage);
|
|
1938
1888
|
controllers.set(root, { handleKeydown, unlockViewerOrientation });
|
|
1939
1889
|
}
|
|
@@ -1977,17 +1927,20 @@ body{overflow:hidden}
|
|
|
1977
1927
|
.hono-decks-viewer-header{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
|
|
1978
1928
|
.hono-decks-viewer-title{margin:0;font-size:1rem;line-height:1.25}
|
|
1979
1929
|
.hono-decks-viewer-meta{margin:.2rem 0 0;color:#cbd5e1;font-size:.82rem}
|
|
1980
|
-
.hono-decks-viewer-shell{display:grid;grid-template-rows:minmax(0,1fr)
|
|
1930
|
+
.hono-decks-viewer-shell{position:relative;display:grid;grid-template-rows:minmax(0,1fr);place-items:center;width:100%;height:100%;min-width:0;min-height:0;box-sizing:border-box;padding:env(safe-area-inset-top,0) env(safe-area-inset-right,0) env(safe-area-inset-bottom,0) env(safe-area-inset-left,0)}
|
|
1981
1931
|
.hono-decks-viewer-stage{display:grid;place-items:center;justify-content:center;width:100%;height:100%;min-width:0;min-height:0;container-type:size}
|
|
1982
1932
|
${viewerViewportRule()}
|
|
1983
1933
|
.hono-decks-viewport:focus-visible{outline:2px solid currentColor;outline-offset:4px}
|
|
1984
1934
|
.hono-decks-frame-stage{width:100%;height:100%}
|
|
1985
1935
|
.hono-decks-frame-stage iframe{width:100%;height:100%;border:0;display:block}
|
|
1986
|
-
.hono-decks-
|
|
1987
|
-
.hono-decks-
|
|
1988
|
-
.hono-decks-
|
|
1936
|
+
.hono-decks-mobile-navigation{position:absolute;top:25%;bottom:25%;display:none;width:clamp(2.25rem,6%,2.75rem);align-items:center;justify-content:center;z-index:2;margin:0;border:0;border-radius:8px;background:rgba(15,23,42,.12);color:rgba(238,242,255,.56);padding:0;appearance:none;opacity:.72;pointer-events:none;touch-action:manipulation}
|
|
1937
|
+
.hono-decks-mobile-navigation-previous{left:.25rem}
|
|
1938
|
+
.hono-decks-mobile-navigation-next{right:.25rem}
|
|
1939
|
+
.hono-decks-mobile-navigation:focus-visible{outline:2px solid currentColor;outline-offset:-4px}
|
|
1940
|
+
.hono-decks-mobile-navigation:active{background:rgba(15,23,42,.28);color:#eef2ff;opacity:1}
|
|
1941
|
+
.hono-decks-mobile-navigation .hono-decks-control-icon{width:22px;height:22px}
|
|
1989
1942
|
.hono-decks-viewport>[data-hono-decks-position]{position:absolute;left:50%;bottom:max(8px,env(safe-area-inset-bottom,0));z-index:3;transform:translateX(-50%);border:0;background:transparent;color:inherit;padding:0;font:inherit;font-size:12px;line-height:1;opacity:.38;pointer-events:none;white-space:nowrap}
|
|
1990
|
-
.hono-decks-viewer-controls{display:flex;gap:8px;align-items:center;justify-content:center;max-width:100
|
|
1943
|
+
.hono-decks-viewer-controls{position:absolute;left:50%;bottom:max(.5rem,env(safe-area-inset-bottom,0));display:flex;gap:8px;align-items:center;justify-content:center;max-width:calc(100% - 1rem);min-width:0;z-index:4;transform:translateX(-50%)}
|
|
1991
1944
|
.hono-decks-viewer-controls [data-hono-decks-navigation-control="previous"],.hono-decks-viewer-controls [data-hono-decks-navigation-control="next"],.hono-decks-viewer-controls [data-hono-decks-position]{position:absolute;visibility:hidden;pointer-events:none}
|
|
1992
1945
|
.hono-decks-viewer-controls button,.hono-decks-viewer-controls a,.hono-decks-viewer-controls span{border:1px solid rgba(148,163,184,.32);border-radius:8px;background:rgba(15,23,42,.78);color:inherit;padding:8px 10px;font:inherit;font-size:14px}
|
|
1993
1946
|
.hono-decks-viewer-controls span{flex:0 0 auto;white-space:nowrap}
|
|
@@ -1996,31 +1949,35 @@ ${viewerViewportRule()}
|
|
|
1996
1949
|
.hono-decks-viewer-controls button *,.hono-decks-viewer-controls a *{pointer-events:none;cursor:pointer}
|
|
1997
1950
|
.hono-decks-control-icon{width:16px;height:16px;flex:0 0 auto;stroke:currentColor;pointer-events:none}
|
|
1998
1951
|
@media (max-width:480px){.hono-decks-viewer-controls{gap:4px}.hono-decks-viewer-controls button,.hono-decks-viewer-controls a{width:36px;height:36px}.hono-decks-viewer-controls button,.hono-decks-viewer-controls a,.hono-decks-viewer-controls span{padding:7px 8px}}
|
|
1999
|
-
@media (pointer:coarse){.hono-decks-viewer-controls [data-hono-decks-navigation-control="fullscreen"],.hono-decks-viewer-controls [data-hono-decks-print]{display:none}}
|
|
2000
|
-
@media (orientation:landscape) and (max-height:600px){.hono-decks-viewer-
|
|
1952
|
+
@media (pointer:coarse){.hono-decks-mobile-navigation{display:inline-flex;pointer-events:auto}.hono-decks-viewer-controls [data-hono-decks-navigation-control="fullscreen"],.hono-decks-viewer-controls [data-hono-decks-print]{display:none}}
|
|
1953
|
+
@media (orientation:landscape) and (max-height:600px){.hono-decks-viewer-controls{left:auto;right:max(.5rem,env(safe-area-inset-right,0));top:50%;bottom:auto;flex-direction:column;transform:translateY(-50%)}.hono-decks-viewport{width:min(100%,calc(100dvh * 16 / 9))}}
|
|
2001
1954
|
@media (prefers-reduced-motion: reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}`;
|
|
2002
1955
|
}
|
|
2003
1956
|
function embeddedViewerStyle() {
|
|
2004
1957
|
const root = "[data-hono-decks-viewer][data-hono-decks-embed]";
|
|
2005
1958
|
return `${root}{color-scheme:dark;background:#050816;color:#eef2ff;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;display:grid;gap:12px;width:100%;min-width:0;box-sizing:border-box}
|
|
2006
1959
|
${root} *:focus-visible{outline:none}
|
|
2007
|
-
${root} .hono-decks-viewer-shell{display:grid;grid-template-rows:minmax(0,1fr)
|
|
1960
|
+
${root} .hono-decks-viewer-shell{position:relative;display:grid;grid-template-rows:minmax(0,1fr);place-items:center;width:100%;min-width:0;min-height:0;box-sizing:border-box}
|
|
2008
1961
|
${root} .hono-decks-viewer-stage{display:grid;place-items:center;width:100%;min-width:0;min-height:0;container-type:inline-size}
|
|
2009
1962
|
${root} .hono-decks-viewport{width:100%;aspect-ratio:${VIEWER_ASPECT_RATIO};position:relative;overflow:hidden;touch-action:pan-y}
|
|
2010
1963
|
${root} .hono-decks-viewport:focus-visible{outline:2px solid currentColor;outline-offset:4px}
|
|
2011
1964
|
${root} .hono-decks-frame-stage,${root} .hono-decks-frame-stage iframe{width:100%;height:100%}
|
|
2012
1965
|
${root} .hono-decks-frame-stage iframe{border:0;display:block}
|
|
2013
|
-
${root} .hono-decks-
|
|
2014
|
-
${root} .hono-decks-
|
|
2015
|
-
${root} .hono-decks-
|
|
1966
|
+
${root} .hono-decks-mobile-navigation{position:absolute;top:25%;bottom:25%;display:none;width:clamp(2.25rem,6%,2.75rem);align-items:center;justify-content:center;z-index:2;margin:0;border:0;border-radius:8px;background:rgba(15,23,42,.12);color:rgba(238,242,255,.56);padding:0;appearance:none;opacity:.72;pointer-events:none;touch-action:manipulation}
|
|
1967
|
+
${root} .hono-decks-mobile-navigation-previous{left:.25rem}
|
|
1968
|
+
${root} .hono-decks-mobile-navigation-next{right:.25rem}
|
|
1969
|
+
${root} .hono-decks-mobile-navigation:focus-visible{outline:2px solid currentColor;outline-offset:-4px}
|
|
1970
|
+
${root} .hono-decks-mobile-navigation:active{background:rgba(15,23,42,.28);color:#eef2ff;opacity:1}
|
|
1971
|
+
${root} .hono-decks-mobile-navigation .hono-decks-control-icon{width:22px;height:22px}
|
|
2016
1972
|
${root} .hono-decks-viewport>[data-hono-decks-position]{position:absolute;left:50%;bottom:8px;z-index:3;transform:translateX(-50%);border:0;background:transparent;color:inherit;padding:0;font:inherit;font-size:12px;line-height:1;opacity:.5;pointer-events:none;white-space:nowrap}
|
|
2017
|
-
${root} .hono-decks-viewer-controls{display:flex;gap:8px;align-items:center;justify-content:center;max-width:100
|
|
1973
|
+
${root} .hono-decks-viewer-controls{position:absolute;left:50%;bottom:max(.5rem,env(safe-area-inset-bottom,0));display:flex;gap:8px;align-items:center;justify-content:center;max-width:calc(100% - 1rem);min-width:0;z-index:4;transform:translateX(-50%)}
|
|
2018
1974
|
${root} .hono-decks-viewer-controls [data-hono-decks-navigation-control="previous"],${root} .hono-decks-viewer-controls [data-hono-decks-navigation-control="next"],${root} .hono-decks-viewer-controls [data-hono-decks-position]{position:absolute;visibility:hidden;pointer-events:none}
|
|
2019
1975
|
${root} .hono-decks-viewer-controls button,${root} .hono-decks-viewer-controls a,${root} .hono-decks-viewer-controls span{border:1px solid rgba(148,163,184,.32);border-radius:8px;background:rgba(15,23,42,.78);color:inherit;padding:8px 10px;font:inherit;font-size:14px}
|
|
2020
1976
|
${root} .hono-decks-viewer-controls button,${root} .hono-decks-viewer-controls a{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;box-sizing:border-box;text-decoration:none;cursor:pointer}
|
|
2021
1977
|
${root} .hono-decks-viewer-controls button *,${root} .hono-decks-viewer-controls a *{pointer-events:none;cursor:pointer}
|
|
2022
1978
|
${root} .hono-decks-control-icon{width:16px;height:16px;flex:0 0 auto;stroke:currentColor;pointer-events:none}
|
|
2023
1979
|
${root} .hono-decks-viewer-toc button{font:inherit}
|
|
1980
|
+
@media (pointer:coarse){${root} .hono-decks-mobile-navigation{display:inline-flex;pointer-events:auto}}
|
|
2024
1981
|
@media (prefers-reduced-motion: reduce){${root},${root} *{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}`;
|
|
2025
1982
|
}
|
|
2026
1983
|
//#endregion
|
|
@@ -2215,24 +2172,27 @@ function renderViewerFrame(input) {
|
|
|
2215
2172
|
src: input.renderUrl
|
|
2216
2173
|
})
|
|
2217
2174
|
}),
|
|
2218
|
-
|
|
2219
|
-
|
|
2220
|
-
type: "button",
|
|
2221
|
-
"data-viewer-navigation": "previous",
|
|
2222
|
-
"aria-label": "Previous slide"
|
|
2223
|
-
}),
|
|
2224
|
-
jsx("button", {
|
|
2225
|
-
class: "hono-decks-viewer-navigation-layer hono-decks-viewer-navigation-next",
|
|
2226
|
-
type: "button",
|
|
2227
|
-
"data-viewer-navigation": "next",
|
|
2228
|
-
"aria-label": "Next slide"
|
|
2229
|
-
})
|
|
2175
|
+
renderMobileNavigationControl("previous"),
|
|
2176
|
+
renderMobileNavigationControl("next")
|
|
2230
2177
|
]
|
|
2231
2178
|
})
|
|
2232
2179
|
});
|
|
2233
2180
|
}
|
|
2234
2181
|
function renderViewerFrameHtml(input) {
|
|
2235
|
-
return `<div class="hono-decks-viewer-stage" data-hono-decks-frame><div class="hono-decks-viewport" data-viewer-viewport tabindex="0"><div class="hono-decks-frame-stage" data-viewer-stage><iframe title="${escapeHtml$2(input.title)}" src="${escapeHtml$2(input.renderUrl)}"></iframe></div
|
|
2182
|
+
return `<div class="hono-decks-viewer-stage" data-hono-decks-frame><div class="hono-decks-viewport" data-viewer-viewport tabindex="0"><div class="hono-decks-frame-stage" data-viewer-stage><iframe title="${escapeHtml$2(input.title)}" src="${escapeHtml$2(input.renderUrl)}"></iframe></div>${renderMobileNavigationControlHtml("previous")}${renderMobileNavigationControlHtml("next")}</div></div>`;
|
|
2183
|
+
}
|
|
2184
|
+
function renderMobileNavigationControl(action) {
|
|
2185
|
+
return jsx("button", {
|
|
2186
|
+
class: `hono-decks-mobile-navigation hono-decks-mobile-navigation-${action}`,
|
|
2187
|
+
type: "button",
|
|
2188
|
+
"data-hono-decks-mobile-action": action,
|
|
2189
|
+
"data-hono-decks-mobile-navigation": action,
|
|
2190
|
+
"aria-label": controlIconLabel(action),
|
|
2191
|
+
children: renderControlIcon(action)
|
|
2192
|
+
});
|
|
2193
|
+
}
|
|
2194
|
+
function renderMobileNavigationControlHtml(action) {
|
|
2195
|
+
return `<button class="hono-decks-mobile-navigation hono-decks-mobile-navigation-${action}" type="button" data-hono-decks-mobile-action="${action}" data-hono-decks-mobile-navigation="${action}" aria-label="${controlIconLabel(action)}">${renderControlIconHtml(action)}</button>`;
|
|
2236
2196
|
}
|
|
2237
2197
|
function renderViewerControls(options, context) {
|
|
2238
2198
|
return jsx("nav", {
|
|
@@ -2561,7 +2521,7 @@ function withFrameAncestors(currentPolicy, ancestors) {
|
|
|
2561
2521
|
return directives.join("; ");
|
|
2562
2522
|
}
|
|
2563
2523
|
function externalEmbedPageStyle() {
|
|
2564
|
-
return `:root{color-scheme:dark;background:#050816}html,body{width:100%;height:100%;margin:0;overflow:hidden}body{min-height:100vh}@supports (height:100dvh){body{min-height:100dvh}}.hono-decks-embedded-viewer{width:100%;height:100%;min-height:0}.hono-decks-embedded-viewer .hono-decks-viewer-shell{position:relative;height:100%;grid-template-rows:minmax(0,1fr)}.hono-decks-embedded-viewer .hono-decks-viewport{width:min(100%,calc(100vh * 16 / 9));max-height:100%}@supports (height:100dvh){.hono-decks-embedded-viewer .hono-decks-viewport{width:min(100%,calc(100dvh * 16 / 9))}}.hono-decks-embedded-viewer .hono-decks-viewer-controls{
|
|
2524
|
+
return `:root{color-scheme:dark;background:#050816}html,body{width:100%;height:100%;margin:0;overflow:hidden}body{min-height:100vh}@supports (height:100dvh){body{min-height:100dvh}}.hono-decks-embedded-viewer{width:100%;height:100%;min-height:0}.hono-decks-embedded-viewer .hono-decks-viewer-shell{position:relative;height:100%;grid-template-rows:minmax(0,1fr)}.hono-decks-embedded-viewer .hono-decks-viewport{width:min(100%,calc(100vh * 16 / 9));max-height:100%}@supports (height:100dvh){.hono-decks-embedded-viewer .hono-decks-viewport{width:min(100%,calc(100dvh * 16 / 9))}}.hono-decks-embedded-viewer .hono-decks-viewer-controls{bottom:max(.5rem,env(safe-area-inset-bottom,0px));z-index:4}`;
|
|
2565
2525
|
}
|
|
2566
2526
|
function escapeHtml$1(value) {
|
|
2567
2527
|
return value.replaceAll("&", "&").replaceAll("<", "<").replaceAll(">", ">").replaceAll("\"", """).replaceAll("'", "'");
|
package/dist/mod.js
CHANGED
|
@@ -320,6 +320,9 @@ function renderControlIcon(name, className = "hono-decks-control-icon") {
|
|
|
320
320
|
children: controlIconPaths(name)
|
|
321
321
|
});
|
|
322
322
|
}
|
|
323
|
+
function renderControlIconHtml(name, className = "hono-decks-control-icon") {
|
|
324
|
+
return `<svg class="${className}" data-hono-decks-control-icon viewBox="0 0 24 24" aria-hidden="true" focusable="false" fill="none" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">${controlIconPathHtml(name)}</svg>`;
|
|
325
|
+
}
|
|
323
326
|
function controlIconLabel(name) {
|
|
324
327
|
switch (name) {
|
|
325
328
|
case "deck-list": return "Deck list";
|
|
@@ -336,6 +339,22 @@ function controlIconLabel(name) {
|
|
|
336
339
|
case "export-png": return "Export PNG";
|
|
337
340
|
}
|
|
338
341
|
}
|
|
342
|
+
function controlIconPathHtml(name) {
|
|
343
|
+
switch (name) {
|
|
344
|
+
case "deck-list": return "<path d=\"M4 5h16\" /><path d=\"M4 12h16\" /><path d=\"M4 19h16\" />";
|
|
345
|
+
case "home": return "<path d=\"M3 11l9-8 9 8\" /><path d=\"M5 10v10h14V10\" /><path d=\"M9 20v-6h6v6\" />";
|
|
346
|
+
case "viewer": return "<path d=\"M2 12s3.5-7 10-7 10 7 10 7-3.5 7-10 7-10-7-10-7z\" /><circle cx=\"12\" cy=\"12\" r=\"3\" />";
|
|
347
|
+
case "projection": return "<path d=\"M4 5h16v10H4z\" /><path d=\"M8 19h8\" /><path d=\"M12 15v4\" />";
|
|
348
|
+
case "presenter": return "<path d=\"M4 5h16v10H4z\" /><path d=\"M8 21l4-6 4 6\" /><path d=\"M9 9h6\" />";
|
|
349
|
+
case "previous": return "<path d=\"M15 6l-6 6 6 6\" />";
|
|
350
|
+
case "next": return "<path d=\"M9 6l6 6-6 6\" />";
|
|
351
|
+
case "fullscreen": return "<path d=\"M8 3H5a2 2 0 0 0-2 2v3\" /><path d=\"M16 3h3a2 2 0 0 1 2 2v3\" /><path d=\"M8 21H5a2 2 0 0 1-2-2v-3\" /><path d=\"M16 21h3a2 2 0 0 0 2-2v-3\" />";
|
|
352
|
+
case "print": return "<path d=\"M6 9V3h12v6\" /><path d=\"M6 18H4a2 2 0 0 1-2-2v-5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v5a2 2 0 0 1-2 2h-2\" /><path d=\"M6 14h12v7H6z\" />";
|
|
353
|
+
case "details": return "<circle cx=\"12\" cy=\"12\" r=\"9\" /><path d=\"M12 11v5\" /><path d=\"M12 8h.01\" />";
|
|
354
|
+
case "export-pdf": return "<path d=\"M14 3v4a2 2 0 0 0 2 2h4\" /><path d=\"M5 3h9l6 6v12H5z\" /><path d=\"M8 15h8\" /><path d=\"M8 18h5\" />";
|
|
355
|
+
case "export-png": return "<rect x=\"4\" y=\"5\" width=\"16\" height=\"14\" rx=\"2\" /><path d=\"M8 14l2.5-2.5L14 15l2-2 2 2\" /><circle cx=\"9\" cy=\"9\" r=\"1\" />";
|
|
356
|
+
}
|
|
357
|
+
}
|
|
339
358
|
function controlIconPaths(name) {
|
|
340
359
|
switch (name) {
|
|
341
360
|
case "deck-list": return [
|
|
@@ -456,12 +475,7 @@ function renderViewerScript(nonce) {
|
|
|
456
475
|
const iframe = root.querySelector("iframe");
|
|
457
476
|
const frameOrigin = iframe?.src ? new URL(iframe.src, window.location.href).origin : window.location.origin;
|
|
458
477
|
const position = root.querySelector("[data-slide-position]");
|
|
459
|
-
const navigationLayers = root.querySelectorAll("[data-viewer-navigation]");
|
|
460
478
|
const printPath = root.getAttribute("data-hono-decks-print-path") || "";
|
|
461
|
-
let pointerStartX = null;
|
|
462
|
-
let pointerStartY = null;
|
|
463
|
-
let suppressNavigationClick = false;
|
|
464
|
-
let suppressNavigationClickTimer = null;
|
|
465
479
|
|
|
466
480
|
if (position && viewport) viewport.append(position);
|
|
467
481
|
|
|
@@ -479,53 +493,6 @@ function renderViewerScript(nonce) {
|
|
|
479
493
|
target?.postMessage({ type: ${JSON.stringify(VIEWER_COMMAND_MESSAGE_TYPE)}, action, index }, frameOrigin);
|
|
480
494
|
}
|
|
481
495
|
|
|
482
|
-
function navigationClick(event) {
|
|
483
|
-
if (suppressNavigationClick) {
|
|
484
|
-
clearNavigationClickSuppression();
|
|
485
|
-
event.preventDefault();
|
|
486
|
-
return;
|
|
487
|
-
}
|
|
488
|
-
const action = event.currentTarget?.getAttribute("data-viewer-navigation");
|
|
489
|
-
if (action === "previous" || action === "next") {
|
|
490
|
-
sendCommand(action);
|
|
491
|
-
viewport?.focus({ preventScroll: true });
|
|
492
|
-
}
|
|
493
|
-
}
|
|
494
|
-
|
|
495
|
-
function clearNavigationClickSuppression() {
|
|
496
|
-
suppressNavigationClick = false;
|
|
497
|
-
if (suppressNavigationClickTimer !== null) window.clearTimeout(suppressNavigationClickTimer);
|
|
498
|
-
suppressNavigationClickTimer = null;
|
|
499
|
-
}
|
|
500
|
-
|
|
501
|
-
function suppressCurrentNavigationClick() {
|
|
502
|
-
clearNavigationClickSuppression();
|
|
503
|
-
suppressNavigationClick = true;
|
|
504
|
-
suppressNavigationClickTimer = window.setTimeout(clearNavigationClickSuppression, 0);
|
|
505
|
-
}
|
|
506
|
-
|
|
507
|
-
function viewerPointerDown(event) {
|
|
508
|
-
pointerStartX = event.clientX;
|
|
509
|
-
pointerStartY = event.clientY;
|
|
510
|
-
}
|
|
511
|
-
|
|
512
|
-
function viewerPointerUp(event) {
|
|
513
|
-
if (pointerStartX === null || pointerStartY === null) return;
|
|
514
|
-
const deltaX = event.clientX - pointerStartX;
|
|
515
|
-
const deltaY = event.clientY - pointerStartY;
|
|
516
|
-
pointerStartX = null;
|
|
517
|
-
pointerStartY = null;
|
|
518
|
-
if (Math.abs(deltaX) < 48 || Math.abs(deltaX) < Math.abs(deltaY)) return;
|
|
519
|
-
suppressCurrentNavigationClick();
|
|
520
|
-
sendCommand(deltaX < 0 ? "next" : "previous");
|
|
521
|
-
}
|
|
522
|
-
|
|
523
|
-
function viewerPointerCancel() {
|
|
524
|
-
pointerStartX = null;
|
|
525
|
-
pointerStartY = null;
|
|
526
|
-
clearNavigationClickSuppression();
|
|
527
|
-
}
|
|
528
|
-
|
|
529
496
|
function isPortraitMobile() {
|
|
530
497
|
return window.matchMedia("(orientation: portrait) and (pointer: coarse)").matches;
|
|
531
498
|
}
|
|
@@ -595,9 +562,15 @@ function renderViewerScript(nonce) {
|
|
|
595
562
|
root.querySelectorAll("[data-action='previous']").forEach((control) => {
|
|
596
563
|
control.addEventListener("click", () => sendCommand("previous"));
|
|
597
564
|
});
|
|
565
|
+
root.querySelectorAll("[data-hono-decks-mobile-action='previous']").forEach((control) => {
|
|
566
|
+
control.addEventListener("click", () => sendCommand("previous"));
|
|
567
|
+
});
|
|
598
568
|
root.querySelectorAll("[data-action='next']").forEach((control) => {
|
|
599
569
|
control.addEventListener("click", () => sendCommand("next"));
|
|
600
570
|
});
|
|
571
|
+
root.querySelectorAll("[data-hono-decks-mobile-action='next']").forEach((control) => {
|
|
572
|
+
control.addEventListener("click", () => sendCommand("next"));
|
|
573
|
+
});
|
|
601
574
|
root.querySelectorAll("[data-action='fullscreen']").forEach((control) => {
|
|
602
575
|
control.addEventListener("click", () => { void toggleViewerFullscreen(); });
|
|
603
576
|
});
|
|
@@ -607,10 +580,6 @@ function renderViewerScript(nonce) {
|
|
|
607
580
|
if (Number.isFinite(index)) sendCommand("goTo", index);
|
|
608
581
|
});
|
|
609
582
|
});
|
|
610
|
-
navigationLayers.forEach((layer) => layer.addEventListener("click", navigationClick));
|
|
611
|
-
viewport?.addEventListener("pointerdown", viewerPointerDown);
|
|
612
|
-
viewport?.addEventListener("pointerup", viewerPointerUp);
|
|
613
|
-
viewport?.addEventListener("pointercancel", viewerPointerCancel);
|
|
614
583
|
window.addEventListener("message", handleMessage);
|
|
615
584
|
controllers.set(root, { handleKeydown, unlockViewerOrientation });
|
|
616
585
|
}
|
|
@@ -641,23 +610,27 @@ function embeddedViewerStyle() {
|
|
|
641
610
|
const root = "[data-hono-decks-viewer][data-hono-decks-embed]";
|
|
642
611
|
return `${root}{color-scheme:dark;background:#050816;color:#eef2ff;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;display:grid;gap:12px;width:100%;min-width:0;box-sizing:border-box}
|
|
643
612
|
${root} *:focus-visible{outline:none}
|
|
644
|
-
${root} .hono-decks-viewer-shell{display:grid;grid-template-rows:minmax(0,1fr)
|
|
613
|
+
${root} .hono-decks-viewer-shell{position:relative;display:grid;grid-template-rows:minmax(0,1fr);place-items:center;width:100%;min-width:0;min-height:0;box-sizing:border-box}
|
|
645
614
|
${root} .hono-decks-viewer-stage{display:grid;place-items:center;width:100%;min-width:0;min-height:0;container-type:inline-size}
|
|
646
615
|
${root} .hono-decks-viewport{width:100%;aspect-ratio:${VIEWER_ASPECT_RATIO};position:relative;overflow:hidden;touch-action:pan-y}
|
|
647
616
|
${root} .hono-decks-viewport:focus-visible{outline:2px solid currentColor;outline-offset:4px}
|
|
648
617
|
${root} .hono-decks-frame-stage,${root} .hono-decks-frame-stage iframe{width:100%;height:100%}
|
|
649
618
|
${root} .hono-decks-frame-stage iframe{border:0;display:block}
|
|
650
|
-
${root} .hono-decks-
|
|
651
|
-
${root} .hono-decks-
|
|
652
|
-
${root} .hono-decks-
|
|
619
|
+
${root} .hono-decks-mobile-navigation{position:absolute;top:25%;bottom:25%;display:none;width:clamp(2.25rem,6%,2.75rem);align-items:center;justify-content:center;z-index:2;margin:0;border:0;border-radius:8px;background:rgba(15,23,42,.12);color:rgba(238,242,255,.56);padding:0;appearance:none;opacity:.72;pointer-events:none;touch-action:manipulation}
|
|
620
|
+
${root} .hono-decks-mobile-navigation-previous{left:.25rem}
|
|
621
|
+
${root} .hono-decks-mobile-navigation-next{right:.25rem}
|
|
622
|
+
${root} .hono-decks-mobile-navigation:focus-visible{outline:2px solid currentColor;outline-offset:-4px}
|
|
623
|
+
${root} .hono-decks-mobile-navigation:active{background:rgba(15,23,42,.28);color:#eef2ff;opacity:1}
|
|
624
|
+
${root} .hono-decks-mobile-navigation .hono-decks-control-icon{width:22px;height:22px}
|
|
653
625
|
${root} .hono-decks-viewport>[data-hono-decks-position]{position:absolute;left:50%;bottom:8px;z-index:3;transform:translateX(-50%);border:0;background:transparent;color:inherit;padding:0;font:inherit;font-size:12px;line-height:1;opacity:.5;pointer-events:none;white-space:nowrap}
|
|
654
|
-
${root} .hono-decks-viewer-controls{display:flex;gap:8px;align-items:center;justify-content:center;max-width:100
|
|
626
|
+
${root} .hono-decks-viewer-controls{position:absolute;left:50%;bottom:max(.5rem,env(safe-area-inset-bottom,0));display:flex;gap:8px;align-items:center;justify-content:center;max-width:calc(100% - 1rem);min-width:0;z-index:4;transform:translateX(-50%)}
|
|
655
627
|
${root} .hono-decks-viewer-controls [data-hono-decks-navigation-control="previous"],${root} .hono-decks-viewer-controls [data-hono-decks-navigation-control="next"],${root} .hono-decks-viewer-controls [data-hono-decks-position]{position:absolute;visibility:hidden;pointer-events:none}
|
|
656
628
|
${root} .hono-decks-viewer-controls button,${root} .hono-decks-viewer-controls a,${root} .hono-decks-viewer-controls span{border:1px solid rgba(148,163,184,.32);border-radius:8px;background:rgba(15,23,42,.78);color:inherit;padding:8px 10px;font:inherit;font-size:14px}
|
|
657
629
|
${root} .hono-decks-viewer-controls button,${root} .hono-decks-viewer-controls a{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;box-sizing:border-box;text-decoration:none;cursor:pointer}
|
|
658
630
|
${root} .hono-decks-viewer-controls button *,${root} .hono-decks-viewer-controls a *{pointer-events:none;cursor:pointer}
|
|
659
631
|
${root} .hono-decks-control-icon{width:16px;height:16px;flex:0 0 auto;stroke:currentColor;pointer-events:none}
|
|
660
632
|
${root} .hono-decks-viewer-toc button{font:inherit}
|
|
633
|
+
@media (pointer:coarse){${root} .hono-decks-mobile-navigation{display:inline-flex;pointer-events:auto}}
|
|
661
634
|
@media (prefers-reduced-motion: reduce){${root},${root} *{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}`;
|
|
662
635
|
}
|
|
663
636
|
//#endregion
|
|
@@ -766,24 +739,27 @@ function renderViewerFrame(input) {
|
|
|
766
739
|
src: input.renderUrl
|
|
767
740
|
})
|
|
768
741
|
}),
|
|
769
|
-
|
|
770
|
-
|
|
771
|
-
type: "button",
|
|
772
|
-
"data-viewer-navigation": "previous",
|
|
773
|
-
"aria-label": "Previous slide"
|
|
774
|
-
}),
|
|
775
|
-
jsx("button", {
|
|
776
|
-
class: "hono-decks-viewer-navigation-layer hono-decks-viewer-navigation-next",
|
|
777
|
-
type: "button",
|
|
778
|
-
"data-viewer-navigation": "next",
|
|
779
|
-
"aria-label": "Next slide"
|
|
780
|
-
})
|
|
742
|
+
renderMobileNavigationControl("previous"),
|
|
743
|
+
renderMobileNavigationControl("next")
|
|
781
744
|
]
|
|
782
745
|
})
|
|
783
746
|
});
|
|
784
747
|
}
|
|
785
748
|
function renderViewerFrameHtml(input) {
|
|
786
|
-
return `<div class="hono-decks-viewer-stage" data-hono-decks-frame><div class="hono-decks-viewport" data-viewer-viewport tabindex="0"><div class="hono-decks-frame-stage" data-viewer-stage><iframe title="${escapeHtml(input.title)}" src="${escapeHtml(input.renderUrl)}"></iframe></div
|
|
749
|
+
return `<div class="hono-decks-viewer-stage" data-hono-decks-frame><div class="hono-decks-viewport" data-viewer-viewport tabindex="0"><div class="hono-decks-frame-stage" data-viewer-stage><iframe title="${escapeHtml(input.title)}" src="${escapeHtml(input.renderUrl)}"></iframe></div>${renderMobileNavigationControlHtml("previous")}${renderMobileNavigationControlHtml("next")}</div></div>`;
|
|
750
|
+
}
|
|
751
|
+
function renderMobileNavigationControl(action) {
|
|
752
|
+
return jsx("button", {
|
|
753
|
+
class: `hono-decks-mobile-navigation hono-decks-mobile-navigation-${action}`,
|
|
754
|
+
type: "button",
|
|
755
|
+
"data-hono-decks-mobile-action": action,
|
|
756
|
+
"data-hono-decks-mobile-navigation": action,
|
|
757
|
+
"aria-label": controlIconLabel(action),
|
|
758
|
+
children: renderControlIcon(action)
|
|
759
|
+
});
|
|
760
|
+
}
|
|
761
|
+
function renderMobileNavigationControlHtml(action) {
|
|
762
|
+
return `<button class="hono-decks-mobile-navigation hono-decks-mobile-navigation-${action}" type="button" data-hono-decks-mobile-action="${action}" data-hono-decks-mobile-navigation="${action}" aria-label="${controlIconLabel(action)}">${renderControlIconHtml(action)}</button>`;
|
|
787
763
|
}
|
|
788
764
|
function renderViewerControls(options, context) {
|
|
789
765
|
return jsx("nav", {
|
package/dist/node.js
CHANGED
|
@@ -4139,12 +4139,7 @@ function renderViewerScript(nonce) {
|
|
|
4139
4139
|
const iframe = root.querySelector("iframe");
|
|
4140
4140
|
const frameOrigin = iframe?.src ? new URL(iframe.src, window.location.href).origin : window.location.origin;
|
|
4141
4141
|
const position = root.querySelector("[data-slide-position]");
|
|
4142
|
-
const navigationLayers = root.querySelectorAll("[data-viewer-navigation]");
|
|
4143
4142
|
const printPath = root.getAttribute("data-hono-decks-print-path") || "";
|
|
4144
|
-
let pointerStartX = null;
|
|
4145
|
-
let pointerStartY = null;
|
|
4146
|
-
let suppressNavigationClick = false;
|
|
4147
|
-
let suppressNavigationClickTimer = null;
|
|
4148
4143
|
|
|
4149
4144
|
if (position && viewport) viewport.append(position);
|
|
4150
4145
|
|
|
@@ -4162,53 +4157,6 @@ function renderViewerScript(nonce) {
|
|
|
4162
4157
|
target?.postMessage({ type: ${JSON.stringify(VIEWER_COMMAND_MESSAGE_TYPE)}, action, index }, frameOrigin);
|
|
4163
4158
|
}
|
|
4164
4159
|
|
|
4165
|
-
function navigationClick(event) {
|
|
4166
|
-
if (suppressNavigationClick) {
|
|
4167
|
-
clearNavigationClickSuppression();
|
|
4168
|
-
event.preventDefault();
|
|
4169
|
-
return;
|
|
4170
|
-
}
|
|
4171
|
-
const action = event.currentTarget?.getAttribute("data-viewer-navigation");
|
|
4172
|
-
if (action === "previous" || action === "next") {
|
|
4173
|
-
sendCommand(action);
|
|
4174
|
-
viewport?.focus({ preventScroll: true });
|
|
4175
|
-
}
|
|
4176
|
-
}
|
|
4177
|
-
|
|
4178
|
-
function clearNavigationClickSuppression() {
|
|
4179
|
-
suppressNavigationClick = false;
|
|
4180
|
-
if (suppressNavigationClickTimer !== null) window.clearTimeout(suppressNavigationClickTimer);
|
|
4181
|
-
suppressNavigationClickTimer = null;
|
|
4182
|
-
}
|
|
4183
|
-
|
|
4184
|
-
function suppressCurrentNavigationClick() {
|
|
4185
|
-
clearNavigationClickSuppression();
|
|
4186
|
-
suppressNavigationClick = true;
|
|
4187
|
-
suppressNavigationClickTimer = window.setTimeout(clearNavigationClickSuppression, 0);
|
|
4188
|
-
}
|
|
4189
|
-
|
|
4190
|
-
function viewerPointerDown(event) {
|
|
4191
|
-
pointerStartX = event.clientX;
|
|
4192
|
-
pointerStartY = event.clientY;
|
|
4193
|
-
}
|
|
4194
|
-
|
|
4195
|
-
function viewerPointerUp(event) {
|
|
4196
|
-
if (pointerStartX === null || pointerStartY === null) return;
|
|
4197
|
-
const deltaX = event.clientX - pointerStartX;
|
|
4198
|
-
const deltaY = event.clientY - pointerStartY;
|
|
4199
|
-
pointerStartX = null;
|
|
4200
|
-
pointerStartY = null;
|
|
4201
|
-
if (Math.abs(deltaX) < 48 || Math.abs(deltaX) < Math.abs(deltaY)) return;
|
|
4202
|
-
suppressCurrentNavigationClick();
|
|
4203
|
-
sendCommand(deltaX < 0 ? "next" : "previous");
|
|
4204
|
-
}
|
|
4205
|
-
|
|
4206
|
-
function viewerPointerCancel() {
|
|
4207
|
-
pointerStartX = null;
|
|
4208
|
-
pointerStartY = null;
|
|
4209
|
-
clearNavigationClickSuppression();
|
|
4210
|
-
}
|
|
4211
|
-
|
|
4212
4160
|
function isPortraitMobile() {
|
|
4213
4161
|
return window.matchMedia("(orientation: portrait) and (pointer: coarse)").matches;
|
|
4214
4162
|
}
|
|
@@ -4278,9 +4226,15 @@ function renderViewerScript(nonce) {
|
|
|
4278
4226
|
root.querySelectorAll("[data-action='previous']").forEach((control) => {
|
|
4279
4227
|
control.addEventListener("click", () => sendCommand("previous"));
|
|
4280
4228
|
});
|
|
4229
|
+
root.querySelectorAll("[data-hono-decks-mobile-action='previous']").forEach((control) => {
|
|
4230
|
+
control.addEventListener("click", () => sendCommand("previous"));
|
|
4231
|
+
});
|
|
4281
4232
|
root.querySelectorAll("[data-action='next']").forEach((control) => {
|
|
4282
4233
|
control.addEventListener("click", () => sendCommand("next"));
|
|
4283
4234
|
});
|
|
4235
|
+
root.querySelectorAll("[data-hono-decks-mobile-action='next']").forEach((control) => {
|
|
4236
|
+
control.addEventListener("click", () => sendCommand("next"));
|
|
4237
|
+
});
|
|
4284
4238
|
root.querySelectorAll("[data-action='fullscreen']").forEach((control) => {
|
|
4285
4239
|
control.addEventListener("click", () => { void toggleViewerFullscreen(); });
|
|
4286
4240
|
});
|
|
@@ -4290,10 +4244,6 @@ function renderViewerScript(nonce) {
|
|
|
4290
4244
|
if (Number.isFinite(index)) sendCommand("goTo", index);
|
|
4291
4245
|
});
|
|
4292
4246
|
});
|
|
4293
|
-
navigationLayers.forEach((layer) => layer.addEventListener("click", navigationClick));
|
|
4294
|
-
viewport?.addEventListener("pointerdown", viewerPointerDown);
|
|
4295
|
-
viewport?.addEventListener("pointerup", viewerPointerUp);
|
|
4296
|
-
viewport?.addEventListener("pointercancel", viewerPointerCancel);
|
|
4297
4247
|
window.addEventListener("message", handleMessage);
|
|
4298
4248
|
controllers.set(root, { handleKeydown, unlockViewerOrientation });
|
|
4299
4249
|
}
|
|
@@ -4337,17 +4287,20 @@ body{overflow:hidden}
|
|
|
4337
4287
|
.hono-decks-viewer-header{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
|
|
4338
4288
|
.hono-decks-viewer-title{margin:0;font-size:1rem;line-height:1.25}
|
|
4339
4289
|
.hono-decks-viewer-meta{margin:.2rem 0 0;color:#cbd5e1;font-size:.82rem}
|
|
4340
|
-
.hono-decks-viewer-shell{display:grid;grid-template-rows:minmax(0,1fr)
|
|
4290
|
+
.hono-decks-viewer-shell{position:relative;display:grid;grid-template-rows:minmax(0,1fr);place-items:center;width:100%;height:100%;min-width:0;min-height:0;box-sizing:border-box;padding:env(safe-area-inset-top,0) env(safe-area-inset-right,0) env(safe-area-inset-bottom,0) env(safe-area-inset-left,0)}
|
|
4341
4291
|
.hono-decks-viewer-stage{display:grid;place-items:center;justify-content:center;width:100%;height:100%;min-width:0;min-height:0;container-type:size}
|
|
4342
4292
|
${viewerViewportRule()}
|
|
4343
4293
|
.hono-decks-viewport:focus-visible{outline:2px solid currentColor;outline-offset:4px}
|
|
4344
4294
|
.hono-decks-frame-stage{width:100%;height:100%}
|
|
4345
4295
|
.hono-decks-frame-stage iframe{width:100%;height:100%;border:0;display:block}
|
|
4346
|
-
.hono-decks-
|
|
4347
|
-
.hono-decks-
|
|
4348
|
-
.hono-decks-
|
|
4296
|
+
.hono-decks-mobile-navigation{position:absolute;top:25%;bottom:25%;display:none;width:clamp(2.25rem,6%,2.75rem);align-items:center;justify-content:center;z-index:2;margin:0;border:0;border-radius:8px;background:rgba(15,23,42,.12);color:rgba(238,242,255,.56);padding:0;appearance:none;opacity:.72;pointer-events:none;touch-action:manipulation}
|
|
4297
|
+
.hono-decks-mobile-navigation-previous{left:.25rem}
|
|
4298
|
+
.hono-decks-mobile-navigation-next{right:.25rem}
|
|
4299
|
+
.hono-decks-mobile-navigation:focus-visible{outline:2px solid currentColor;outline-offset:-4px}
|
|
4300
|
+
.hono-decks-mobile-navigation:active{background:rgba(15,23,42,.28);color:#eef2ff;opacity:1}
|
|
4301
|
+
.hono-decks-mobile-navigation .hono-decks-control-icon{width:22px;height:22px}
|
|
4349
4302
|
.hono-decks-viewport>[data-hono-decks-position]{position:absolute;left:50%;bottom:max(8px,env(safe-area-inset-bottom,0));z-index:3;transform:translateX(-50%);border:0;background:transparent;color:inherit;padding:0;font:inherit;font-size:12px;line-height:1;opacity:.38;pointer-events:none;white-space:nowrap}
|
|
4350
|
-
.hono-decks-viewer-controls{display:flex;gap:8px;align-items:center;justify-content:center;max-width:100
|
|
4303
|
+
.hono-decks-viewer-controls{position:absolute;left:50%;bottom:max(.5rem,env(safe-area-inset-bottom,0));display:flex;gap:8px;align-items:center;justify-content:center;max-width:calc(100% - 1rem);min-width:0;z-index:4;transform:translateX(-50%)}
|
|
4351
4304
|
.hono-decks-viewer-controls [data-hono-decks-navigation-control="previous"],.hono-decks-viewer-controls [data-hono-decks-navigation-control="next"],.hono-decks-viewer-controls [data-hono-decks-position]{position:absolute;visibility:hidden;pointer-events:none}
|
|
4352
4305
|
.hono-decks-viewer-controls button,.hono-decks-viewer-controls a,.hono-decks-viewer-controls span{border:1px solid rgba(148,163,184,.32);border-radius:8px;background:rgba(15,23,42,.78);color:inherit;padding:8px 10px;font:inherit;font-size:14px}
|
|
4353
4306
|
.hono-decks-viewer-controls span{flex:0 0 auto;white-space:nowrap}
|
|
@@ -4356,31 +4309,35 @@ ${viewerViewportRule()}
|
|
|
4356
4309
|
.hono-decks-viewer-controls button *,.hono-decks-viewer-controls a *{pointer-events:none;cursor:pointer}
|
|
4357
4310
|
.hono-decks-control-icon{width:16px;height:16px;flex:0 0 auto;stroke:currentColor;pointer-events:none}
|
|
4358
4311
|
@media (max-width:480px){.hono-decks-viewer-controls{gap:4px}.hono-decks-viewer-controls button,.hono-decks-viewer-controls a{width:36px;height:36px}.hono-decks-viewer-controls button,.hono-decks-viewer-controls a,.hono-decks-viewer-controls span{padding:7px 8px}}
|
|
4359
|
-
@media (pointer:coarse){.hono-decks-viewer-controls [data-hono-decks-navigation-control="fullscreen"],.hono-decks-viewer-controls [data-hono-decks-print]{display:none}}
|
|
4360
|
-
@media (orientation:landscape) and (max-height:600px){.hono-decks-viewer-
|
|
4312
|
+
@media (pointer:coarse){.hono-decks-mobile-navigation{display:inline-flex;pointer-events:auto}.hono-decks-viewer-controls [data-hono-decks-navigation-control="fullscreen"],.hono-decks-viewer-controls [data-hono-decks-print]{display:none}}
|
|
4313
|
+
@media (orientation:landscape) and (max-height:600px){.hono-decks-viewer-controls{left:auto;right:max(.5rem,env(safe-area-inset-right,0));top:50%;bottom:auto;flex-direction:column;transform:translateY(-50%)}.hono-decks-viewport{width:min(100%,calc(100dvh * 16 / 9))}}
|
|
4361
4314
|
@media (prefers-reduced-motion: reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}`;
|
|
4362
4315
|
}
|
|
4363
4316
|
function embeddedViewerStyle() {
|
|
4364
4317
|
const root = "[data-hono-decks-viewer][data-hono-decks-embed]";
|
|
4365
4318
|
return `${root}{color-scheme:dark;background:#050816;color:#eef2ff;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;display:grid;gap:12px;width:100%;min-width:0;box-sizing:border-box}
|
|
4366
4319
|
${root} *:focus-visible{outline:none}
|
|
4367
|
-
${root} .hono-decks-viewer-shell{display:grid;grid-template-rows:minmax(0,1fr)
|
|
4320
|
+
${root} .hono-decks-viewer-shell{position:relative;display:grid;grid-template-rows:minmax(0,1fr);place-items:center;width:100%;min-width:0;min-height:0;box-sizing:border-box}
|
|
4368
4321
|
${root} .hono-decks-viewer-stage{display:grid;place-items:center;width:100%;min-width:0;min-height:0;container-type:inline-size}
|
|
4369
4322
|
${root} .hono-decks-viewport{width:100%;aspect-ratio:${VIEWER_ASPECT_RATIO};position:relative;overflow:hidden;touch-action:pan-y}
|
|
4370
4323
|
${root} .hono-decks-viewport:focus-visible{outline:2px solid currentColor;outline-offset:4px}
|
|
4371
4324
|
${root} .hono-decks-frame-stage,${root} .hono-decks-frame-stage iframe{width:100%;height:100%}
|
|
4372
4325
|
${root} .hono-decks-frame-stage iframe{border:0;display:block}
|
|
4373
|
-
${root} .hono-decks-
|
|
4374
|
-
${root} .hono-decks-
|
|
4375
|
-
${root} .hono-decks-
|
|
4326
|
+
${root} .hono-decks-mobile-navigation{position:absolute;top:25%;bottom:25%;display:none;width:clamp(2.25rem,6%,2.75rem);align-items:center;justify-content:center;z-index:2;margin:0;border:0;border-radius:8px;background:rgba(15,23,42,.12);color:rgba(238,242,255,.56);padding:0;appearance:none;opacity:.72;pointer-events:none;touch-action:manipulation}
|
|
4327
|
+
${root} .hono-decks-mobile-navigation-previous{left:.25rem}
|
|
4328
|
+
${root} .hono-decks-mobile-navigation-next{right:.25rem}
|
|
4329
|
+
${root} .hono-decks-mobile-navigation:focus-visible{outline:2px solid currentColor;outline-offset:-4px}
|
|
4330
|
+
${root} .hono-decks-mobile-navigation:active{background:rgba(15,23,42,.28);color:#eef2ff;opacity:1}
|
|
4331
|
+
${root} .hono-decks-mobile-navigation .hono-decks-control-icon{width:22px;height:22px}
|
|
4376
4332
|
${root} .hono-decks-viewport>[data-hono-decks-position]{position:absolute;left:50%;bottom:8px;z-index:3;transform:translateX(-50%);border:0;background:transparent;color:inherit;padding:0;font:inherit;font-size:12px;line-height:1;opacity:.5;pointer-events:none;white-space:nowrap}
|
|
4377
|
-
${root} .hono-decks-viewer-controls{display:flex;gap:8px;align-items:center;justify-content:center;max-width:100
|
|
4333
|
+
${root} .hono-decks-viewer-controls{position:absolute;left:50%;bottom:max(.5rem,env(safe-area-inset-bottom,0));display:flex;gap:8px;align-items:center;justify-content:center;max-width:calc(100% - 1rem);min-width:0;z-index:4;transform:translateX(-50%)}
|
|
4378
4334
|
${root} .hono-decks-viewer-controls [data-hono-decks-navigation-control="previous"],${root} .hono-decks-viewer-controls [data-hono-decks-navigation-control="next"],${root} .hono-decks-viewer-controls [data-hono-decks-position]{position:absolute;visibility:hidden;pointer-events:none}
|
|
4379
4335
|
${root} .hono-decks-viewer-controls button,${root} .hono-decks-viewer-controls a,${root} .hono-decks-viewer-controls span{border:1px solid rgba(148,163,184,.32);border-radius:8px;background:rgba(15,23,42,.78);color:inherit;padding:8px 10px;font:inherit;font-size:14px}
|
|
4380
4336
|
${root} .hono-decks-viewer-controls button,${root} .hono-decks-viewer-controls a{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;box-sizing:border-box;text-decoration:none;cursor:pointer}
|
|
4381
4337
|
${root} .hono-decks-viewer-controls button *,${root} .hono-decks-viewer-controls a *{pointer-events:none;cursor:pointer}
|
|
4382
4338
|
${root} .hono-decks-control-icon{width:16px;height:16px;flex:0 0 auto;stroke:currentColor;pointer-events:none}
|
|
4383
4339
|
${root} .hono-decks-viewer-toc button{font:inherit}
|
|
4340
|
+
@media (pointer:coarse){${root} .hono-decks-mobile-navigation{display:inline-flex;pointer-events:auto}}
|
|
4384
4341
|
@media (prefers-reduced-motion: reduce){${root},${root} *{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}`;
|
|
4385
4342
|
}
|
|
4386
4343
|
//#endregion
|
|
@@ -4575,24 +4532,27 @@ function renderViewerFrame(input) {
|
|
|
4575
4532
|
src: input.renderUrl
|
|
4576
4533
|
})
|
|
4577
4534
|
}),
|
|
4578
|
-
|
|
4579
|
-
|
|
4580
|
-
type: "button",
|
|
4581
|
-
"data-viewer-navigation": "previous",
|
|
4582
|
-
"aria-label": "Previous slide"
|
|
4583
|
-
}),
|
|
4584
|
-
jsx("button", {
|
|
4585
|
-
class: "hono-decks-viewer-navigation-layer hono-decks-viewer-navigation-next",
|
|
4586
|
-
type: "button",
|
|
4587
|
-
"data-viewer-navigation": "next",
|
|
4588
|
-
"aria-label": "Next slide"
|
|
4589
|
-
})
|
|
4535
|
+
renderMobileNavigationControl("previous"),
|
|
4536
|
+
renderMobileNavigationControl("next")
|
|
4590
4537
|
]
|
|
4591
4538
|
})
|
|
4592
4539
|
});
|
|
4593
4540
|
}
|
|
4594
4541
|
function renderViewerFrameHtml(input) {
|
|
4595
|
-
return `<div class="hono-decks-viewer-stage" data-hono-decks-frame><div class="hono-decks-viewport" data-viewer-viewport tabindex="0"><div class="hono-decks-frame-stage" data-viewer-stage><iframe title="${escapeHtml$3(input.title)}" src="${escapeHtml$3(input.renderUrl)}"></iframe></div
|
|
4542
|
+
return `<div class="hono-decks-viewer-stage" data-hono-decks-frame><div class="hono-decks-viewport" data-viewer-viewport tabindex="0"><div class="hono-decks-frame-stage" data-viewer-stage><iframe title="${escapeHtml$3(input.title)}" src="${escapeHtml$3(input.renderUrl)}"></iframe></div>${renderMobileNavigationControlHtml("previous")}${renderMobileNavigationControlHtml("next")}</div></div>`;
|
|
4543
|
+
}
|
|
4544
|
+
function renderMobileNavigationControl(action) {
|
|
4545
|
+
return jsx("button", {
|
|
4546
|
+
class: `hono-decks-mobile-navigation hono-decks-mobile-navigation-${action}`,
|
|
4547
|
+
type: "button",
|
|
4548
|
+
"data-hono-decks-mobile-action": action,
|
|
4549
|
+
"data-hono-decks-mobile-navigation": action,
|
|
4550
|
+
"aria-label": controlIconLabel(action),
|
|
4551
|
+
children: renderControlIcon(action)
|
|
4552
|
+
});
|
|
4553
|
+
}
|
|
4554
|
+
function renderMobileNavigationControlHtml(action) {
|
|
4555
|
+
return `<button class="hono-decks-mobile-navigation hono-decks-mobile-navigation-${action}" type="button" data-hono-decks-mobile-action="${action}" data-hono-decks-mobile-navigation="${action}" aria-label="${controlIconLabel(action)}">${renderControlIconHtml(action)}</button>`;
|
|
4596
4556
|
}
|
|
4597
4557
|
function renderViewerControls(options, context) {
|
|
4598
4558
|
return jsx("nav", {
|
|
@@ -4921,7 +4881,7 @@ function withFrameAncestors(currentPolicy, ancestors) {
|
|
|
4921
4881
|
return directives.join("; ");
|
|
4922
4882
|
}
|
|
4923
4883
|
function externalEmbedPageStyle() {
|
|
4924
|
-
return `:root{color-scheme:dark;background:#050816}html,body{width:100%;height:100%;margin:0;overflow:hidden}body{min-height:100vh}@supports (height:100dvh){body{min-height:100dvh}}.hono-decks-embedded-viewer{width:100%;height:100%;min-height:0}.hono-decks-embedded-viewer .hono-decks-viewer-shell{position:relative;height:100%;grid-template-rows:minmax(0,1fr)}.hono-decks-embedded-viewer .hono-decks-viewport{width:min(100%,calc(100vh * 16 / 9));max-height:100%}@supports (height:100dvh){.hono-decks-embedded-viewer .hono-decks-viewport{width:min(100%,calc(100dvh * 16 / 9))}}.hono-decks-embedded-viewer .hono-decks-viewer-controls{
|
|
4884
|
+
return `:root{color-scheme:dark;background:#050816}html,body{width:100%;height:100%;margin:0;overflow:hidden}body{min-height:100vh}@supports (height:100dvh){body{min-height:100dvh}}.hono-decks-embedded-viewer{width:100%;height:100%;min-height:0}.hono-decks-embedded-viewer .hono-decks-viewer-shell{position:relative;height:100%;grid-template-rows:minmax(0,1fr)}.hono-decks-embedded-viewer .hono-decks-viewport{width:min(100%,calc(100vh * 16 / 9));max-height:100%}@supports (height:100dvh){.hono-decks-embedded-viewer .hono-decks-viewport{width:min(100%,calc(100dvh * 16 / 9))}}.hono-decks-embedded-viewer .hono-decks-viewer-controls{bottom:max(.5rem,env(safe-area-inset-bottom,0px));z-index:4}`;
|
|
4925
4885
|
}
|
|
4926
4886
|
function escapeHtml$2(value) {
|
|
4927
4887
|
return value.replaceAll("&", "&").replaceAll("<", "<").replaceAll(">", ">").replaceAll("\"", """).replaceAll("'", "'");
|