@embedpdf/plugin-scroll 1.0.11 → 1.0.12
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 +2 -661
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.ts +1 -204
- package/dist/index.js +33 -67
- package/dist/index.js.map +1 -1
- package/dist/lib/actions.d.ts +27 -0
- package/dist/lib/index.d.ts +9 -0
- package/dist/lib/manifest.d.ts +4 -0
- package/dist/lib/reducer.d.ts +6 -0
- package/dist/lib/scroll-plugin.d.ts +45 -0
- package/dist/lib/selectors.d.ts +2 -0
- package/dist/lib/strategies/base-strategy.d.ts +35 -0
- package/dist/lib/strategies/horizontal-strategy.d.ts +14 -0
- package/dist/lib/strategies/vertical-strategy.d.ts +14 -0
- package/dist/lib/types/virtual-item.d.ts +21 -0
- package/dist/lib/types.d.ts +112 -0
- package/dist/preact/adapter.d.ts +4 -0
- package/dist/preact/core.d.ts +1 -0
- package/dist/preact/index.cjs +2 -181
- package/dist/preact/index.cjs.map +1 -1
- package/dist/preact/index.d.ts +1 -54
- package/dist/preact/index.js +13 -18
- package/dist/preact/index.js.map +1 -1
- package/dist/react/adapter.d.ts +2 -0
- package/dist/react/core.d.ts +1 -0
- package/dist/react/index.cjs +2 -181
- package/dist/react/index.cjs.map +1 -1
- package/dist/react/index.d.ts +1 -53
- package/dist/react/index.js +12 -18
- package/dist/react/index.js.map +1 -1
- package/dist/shared-preact/components/index.d.ts +1 -0
- package/dist/shared-preact/components/scroller.d.ts +14 -0
- package/dist/shared-preact/hooks/index.d.ts +1 -0
- package/dist/shared-preact/hooks/use-scroll.d.ts +32 -0
- package/dist/shared-preact/index.d.ts +2 -0
- package/dist/shared-react/components/index.d.ts +1 -0
- package/dist/shared-react/components/scroller.d.ts +14 -0
- package/dist/shared-react/hooks/index.d.ts +1 -0
- package/dist/shared-react/hooks/use-scroll.d.ts +32 -0
- package/dist/shared-react/index.d.ts +2 -0
- package/dist/vue/components/index.d.ts +1 -0
- package/dist/vue/components/scroller.vue.d.ts +28 -0
- package/dist/vue/hooks/index.d.ts +1 -0
- package/dist/vue/hooks/use-scroll.d.ts +11 -0
- package/dist/vue/index.cjs +2 -0
- package/dist/vue/index.cjs.map +1 -0
- package/dist/vue/index.d.ts +2 -0
- package/dist/vue/index.js +136 -0
- package/dist/vue/index.js.map +1 -0
- package/package.json +22 -13
- package/dist/index.d.cts +0 -204
- package/dist/preact/index.d.cts +0 -54
- package/dist/react/index.d.cts +0 -53
package/dist/react/index.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"file":"index.cjs","sources":["../../src/shared/hooks/use-scroll.ts","../../src/shared/components/scroller.tsx"],"sourcesContent":["import { useCapability, usePlugin } from '@embedpdf/core/@framework';\nimport { ScrollPlugin } from '@embedpdf/plugin-scroll';\nimport { useEffect, useState } from '@framework';\n\nexport const useScrollPlugin = () => usePlugin<ScrollPlugin>(ScrollPlugin.id);\nexport const useScrollCapability = () => useCapability<ScrollPlugin>(ScrollPlugin.id);\n\nexport const useScroll = () => {\n const { provides: scroll } = useScrollCapability();\n const [currentPage, setCurrentPage] = useState(1);\n const [totalPages, setTotalPages] = useState(1);\n\n useEffect(() => {\n if (!scroll) return;\n return scroll.onPageChange(({ pageNumber, totalPages }) => {\n setCurrentPage(pageNumber);\n setTotalPages(totalPages);\n });\n }, [scroll]);\n\n return {\n ...scroll,\n currentPage,\n totalPages,\n };\n};\n","import { ReactNode, useEffect, useState, HTMLAttributes } from '@framework';\nimport { ScrollStrategy, ScrollerLayout, PageLayout } from '@embedpdf/plugin-scroll';\nimport { useRegistry } from '@embedpdf/core/@framework';\nimport { PdfDocumentObject, Rotation } from '@embedpdf/models';\n\nimport { useScrollCapability, useScrollPlugin } from '../hooks';\n\ninterface RenderPageProps extends PageLayout {\n rotation: Rotation;\n scale: number;\n document: PdfDocumentObject | null;\n}\n\ntype ScrollerProps = HTMLAttributes<HTMLDivElement> & {\n renderPage: (props: RenderPageProps) => ReactNode;\n overlayElements?: ReactNode[];\n};\n\nexport function Scroller({ renderPage, overlayElements, ...props }: ScrollerProps) {\n const { provides: scrollProvides } = useScrollCapability();\n const { plugin: scrollPlugin } = useScrollPlugin();\n const { registry } = useRegistry();\n const [scrollerLayout, setScrollerLayout] = useState<ScrollerLayout | null>(\n () => scrollProvides?.getScrollerLayout() ?? null,\n );\n\n useEffect(() => {\n if (!scrollProvides) return;\n\n return scrollProvides.onScrollerData(setScrollerLayout);\n }, [scrollProvides]);\n\n useEffect(() => {\n if (!scrollPlugin) return;\n\n scrollPlugin.setLayoutReady();\n }, [scrollPlugin]);\n\n if (!scrollerLayout) return null;\n if (!registry) return null;\n\n const coreState = registry.getStore().getState();\n\n return (\n <div\n {...props}\n style={{\n width: `${scrollerLayout.totalWidth}px`,\n height: `${scrollerLayout.totalHeight}px`,\n position: 'relative',\n boxSizing: 'border-box',\n margin: '0 auto',\n ...(scrollerLayout.strategy === ScrollStrategy.Horizontal && {\n display: 'flex',\n flexDirection: 'row',\n }),\n }}\n >\n <div\n style={{\n ...(scrollerLayout.strategy === ScrollStrategy.Horizontal\n ? {\n width: scrollerLayout.startSpacing,\n height: '100%',\n flexShrink: 0,\n }\n : {\n height: scrollerLayout.startSpacing,\n width: '100%',\n }),\n }}\n />\n <div\n style={{\n gap: scrollerLayout.pageGap,\n display: 'flex',\n alignItems: 'center',\n position: 'relative',\n boxSizing: 'border-box',\n ...(scrollerLayout.strategy === ScrollStrategy.Horizontal\n ? {\n flexDirection: 'row',\n minHeight: '100%',\n }\n : {\n flexDirection: 'column',\n minWidth: 'fit-content',\n }),\n }}\n >\n {scrollerLayout.items.map((item) => (\n <div\n key={item.pageNumbers[0]}\n style={{\n display: 'flex',\n justifyContent: 'center',\n gap: scrollerLayout.pageGap,\n }}\n >\n {item.pageLayouts.map((layout) => (\n <div\n key={layout.pageNumber}\n style={{\n width: `${layout.rotatedWidth}px`,\n height: `${layout.rotatedHeight}px`,\n }}\n >\n {renderPage({\n ...layout,\n rotation: coreState.core.rotation,\n scale: coreState.core.scale,\n document: coreState.core.document,\n })}\n </div>\n ))}\n </div>\n ))}\n </div>\n <div\n style={{\n ...(scrollerLayout.strategy === ScrollStrategy.Horizontal\n ? {\n width: scrollerLayout.endSpacing,\n height: '100%',\n flexShrink: 0,\n }\n : {\n height: scrollerLayout.endSpacing,\n width: '100%',\n }),\n }}\n />\n {overlayElements}\n </div>\n );\n}\n"],"names":["useScrollPlugin","usePlugin","ScrollPlugin","id","useScrollCapability","useCapability","renderPage","overlayElements","props","provides","scrollProvides","plugin","scrollPlugin","registry","useRegistry","scrollerLayout","setScrollerLayout","useState","getScrollerLayout","useEffect","onScrollerData","setLayoutReady","coreState","getStore","getState","jsxRuntime","jsxs","style","width","totalWidth","height","totalHeight","position","boxSizing","margin","strategy","ScrollStrategy","Horizontal","display","flexDirection","children","jsx","startSpacing","flexShrink","gap","pageGap","alignItems","minHeight","minWidth","items","map","item","justifyContent","pageLayouts","layout","rotatedWidth","rotatedHeight","rotation","core","scale","document","pageNumber","pageNumbers","endSpacing","scroll","currentPage","setCurrentPage","totalPages","setTotalPages","onPageChange"],"mappings":"+MAIaA,EAAkB,IAAMC,YAAwBC,EAAAA,aAAaC,IAC7DC,EAAsB,IAAMC,gBAA4BH,EAAAA,aAAaC,qBCa3E,UAAkBG,WAAEA,EAAAC,gBAAYA,KAAoBC,IACzD,MAAQC,SAAUC,GAAmBN,KAC7BO,OAAQC,GAAiBZ,KAC3Ba,SAAEA,GAAaC,iBACdC,EAAgBC,GAAqBC,EAAAA,UAC1C,WAAMP,WAAgBQ,sBAAuB,OAe3C,GAZJC,EAAAA,WAAU,KACR,GAAKT,EAEE,OAAAA,EAAeU,eAAeJ,EAAiB,GACrD,CAACN,IAEJS,EAAAA,WAAU,KACHP,GAELA,EAAaS,gBAAe,GAC3B,CAACT,KAECG,EAAuB,OAAA,KACxB,IAACF,EAAiB,OAAA,KAEtB,MAAMS,EAAYT,EAASU,WAAWC,WAGpC,OAAAC,EAAAC,KAAC,MAAA,IACKlB,EACJmB,MAAO,CACLC,MAAO,GAAGb,EAAec,eACzBC,OAAQ,GAAGf,EAAegB,gBAC1BC,SAAU,WACVC,UAAW,aACXC,OAAQ,YACJnB,EAAeoB,WAAaC,EAAAA,eAAeC,YAAc,CAC3DC,QAAS,OACTC,cAAe,QAInBC,SAAA,CAAAf,EAAAgB,IAAC,MAAA,CACCd,MAAO,IACDZ,EAAeoB,WAAaC,EAAAA,eAAeC,WAC3C,CACET,MAAOb,EAAe2B,aACtBZ,OAAQ,OACRa,WAAY,GAEd,CACEb,OAAQf,EAAe2B,aACvBd,MAAO,WAIjBH,EAAAgB,IAAC,MAAA,CACCd,MAAO,CACLiB,IAAK7B,EAAe8B,QACpBP,QAAS,OACTQ,WAAY,SACZd,SAAU,WACVC,UAAW,gBACPlB,EAAeoB,WAAaC,EAAAA,eAAeC,WAC3C,CACEE,cAAe,MACfQ,UAAW,QAEb,CACER,cAAe,SACfS,SAAU,gBAIjBR,SAAezB,EAAAkC,MAAMC,KAAKC,GACzB1B,EAAAgB,IAAC,MAAA,CAECd,MAAO,CACLW,QAAS,OACTc,eAAgB,SAChBR,IAAK7B,EAAe8B,SAGrBL,SAAKW,EAAAE,YAAYH,KAAKI,GACrB7B,EAAAgB,IAAC,MAAA,CAECd,MAAO,CACLC,MAAO,GAAG0B,EAAOC,iBACjBzB,OAAQ,GAAGwB,EAAOE,mBAGnBhB,SAAWlC,EAAA,IACPgD,EACHG,SAAUnC,EAAUoC,KAAKD,SACzBE,MAAOrC,EAAUoC,KAAKC,MACtBC,SAAUtC,EAAUoC,KAAKE,YAVtBN,EAAOO,eATXV,EAAKW,YAAY,QA0B5BrC,EAAAgB,IAAC,MAAA,CACCd,MAAO,IACDZ,EAAeoB,WAAaC,EAAAA,eAAeC,WAC3C,CACET,MAAOb,EAAegD,WACtBjC,OAAQ,OACRa,WAAY,GAEd,CACEb,OAAQf,EAAegD,WACvBnC,MAAO,WAIhBrB,IAGP,oBDhIyB,KACvB,MAAQE,SAAUuD,GAAW5D,KACtB6D,EAAaC,GAAkBjD,EAAAA,SAAS,IACxCkD,EAAYC,GAAiBnD,EAAAA,SAAS,GAUtC,OARPE,EAAAA,WAAU,KACR,GAAK6C,EACL,OAAOA,EAAOK,cAAa,EAAGR,aAAYM,WAAAA,MACxCD,EAAeL,GACfO,EAAcD,EAAU,GACzB,GACA,CAACH,IAEG,IACFA,EACHC,cACAE,aACF"}
|
package/dist/react/index.d.ts
CHANGED
|
@@ -1,53 +1 @@
|
|
|
1
|
-
|
|
2
|
-
import { Rotation, PdfDocumentObject } from '@embedpdf/models';
|
|
3
|
-
import * as _embedpdf_plugin_viewport from '@embedpdf/plugin-viewport';
|
|
4
|
-
import * as _embedpdf_core from '@embedpdf/core';
|
|
5
|
-
import * as _embedpdf_plugin_scroll from '@embedpdf/plugin-scroll';
|
|
6
|
-
import { ScrollPlugin, PageLayout } from '@embedpdf/plugin-scroll';
|
|
7
|
-
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
8
|
-
import React, { ReactNode } from 'react';
|
|
9
|
-
|
|
10
|
-
declare const useScrollPlugin: () => {
|
|
11
|
-
plugin: ScrollPlugin | null;
|
|
12
|
-
isLoading: boolean;
|
|
13
|
-
ready: Promise<void>;
|
|
14
|
-
};
|
|
15
|
-
declare const useScrollCapability: () => {
|
|
16
|
-
provides: Readonly<_embedpdf_plugin_scroll.ScrollCapability> | null;
|
|
17
|
-
isLoading: boolean;
|
|
18
|
-
ready: Promise<void>;
|
|
19
|
-
};
|
|
20
|
-
declare const useScroll: () => {
|
|
21
|
-
currentPage: number;
|
|
22
|
-
totalPages: number;
|
|
23
|
-
onScrollerData?: _embedpdf_core.EventHook<_embedpdf_plugin_scroll.ScrollerLayout> | undefined;
|
|
24
|
-
onStateChange?: _embedpdf_core.EventHook<_embedpdf_plugin_scroll.ScrollState> | undefined;
|
|
25
|
-
onScroll?: _embedpdf_core.EventHook<_embedpdf_plugin_scroll.ScrollMetrics> | undefined;
|
|
26
|
-
getCurrentPage?: (() => number) | undefined;
|
|
27
|
-
getTotalPages?: (() => number) | undefined;
|
|
28
|
-
onPageChange?: _embedpdf_core.EventHook<_embedpdf_plugin_scroll.PageChangePayload> | undefined;
|
|
29
|
-
onLayoutChange?: _embedpdf_core.EventHook<_embedpdf_plugin_scroll.LayoutChangePayload> | undefined;
|
|
30
|
-
onLayoutReady?: _embedpdf_core.EventHook<boolean> | undefined;
|
|
31
|
-
scrollToPage?: ((options: _embedpdf_plugin_scroll.ScrollToPageOptions) => void) | undefined;
|
|
32
|
-
scrollToNextPage?: ((behavior?: ScrollBehavior) => void) | undefined;
|
|
33
|
-
scrollToPreviousPage?: ((behavior?: ScrollBehavior) => void) | undefined;
|
|
34
|
-
getMetrics?: ((viewport?: _embedpdf_plugin_viewport.ViewportMetrics) => _embedpdf_plugin_scroll.ScrollMetrics) | undefined;
|
|
35
|
-
getLayout?: (() => _embedpdf_plugin_scroll.LayoutChangePayload) | undefined;
|
|
36
|
-
getScrollerLayout?: (() => _embedpdf_plugin_scroll.ScrollerLayout) | undefined;
|
|
37
|
-
getRectPositionForPage?: ((page: number, rect: _embedpdf_models.Rect, scale?: number, rotation?: _embedpdf_models.Rotation) => _embedpdf_models.Rect | null) | undefined;
|
|
38
|
-
setScrollStrategy?: ((strategy: _embedpdf_plugin_scroll.ScrollStrategy) => void) | undefined;
|
|
39
|
-
getPageGap?: (() => number) | undefined;
|
|
40
|
-
};
|
|
41
|
-
|
|
42
|
-
interface RenderPageProps extends PageLayout {
|
|
43
|
-
rotation: Rotation;
|
|
44
|
-
scale: number;
|
|
45
|
-
document: PdfDocumentObject | null;
|
|
46
|
-
}
|
|
47
|
-
type ScrollerProps = React.HTMLAttributes<HTMLDivElement> & {
|
|
48
|
-
renderPage: (props: RenderPageProps) => ReactNode;
|
|
49
|
-
overlayElements?: ReactNode[];
|
|
50
|
-
};
|
|
51
|
-
declare function Scroller({ renderPage, overlayElements, ...props }: ScrollerProps): react_jsx_runtime.JSX.Element | null;
|
|
52
|
-
|
|
53
|
-
export { Scroller, useScroll, useScrollCapability, useScrollPlugin };
|
|
1
|
+
export * from '../shared-react';
|
package/dist/react/index.js
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
1
|
+
import { usePlugin, useCapability, useRegistry } from "@embedpdf/core/react";
|
|
2
|
+
import { ScrollPlugin, ScrollStrategy } from "@embedpdf/plugin-scroll";
|
|
3
|
+
import { useState, useEffect } from "react";
|
|
4
|
+
import { jsxs, jsx } from "react/jsx-runtime";
|
|
5
|
+
const useScrollPlugin = () => usePlugin(ScrollPlugin.id);
|
|
6
|
+
const useScrollCapability = () => useCapability(ScrollPlugin.id);
|
|
7
|
+
const useScroll = () => {
|
|
8
8
|
const { provides: scroll } = useScrollCapability();
|
|
9
9
|
const [currentPage, setCurrentPage] = useState(1);
|
|
10
10
|
const [totalPages, setTotalPages] = useState(1);
|
|
@@ -21,24 +21,18 @@ var useScroll = () => {
|
|
|
21
21
|
totalPages
|
|
22
22
|
};
|
|
23
23
|
};
|
|
24
|
-
|
|
25
|
-
// src/react/components/scroller.tsx
|
|
26
|
-
import { useEffect as useEffect2, useState as useState2 } from "react";
|
|
27
|
-
import { ScrollStrategy } from "@embedpdf/plugin-scroll";
|
|
28
|
-
import { useRegistry } from "@embedpdf/core/react";
|
|
29
|
-
import { jsx, jsxs } from "react/jsx-runtime";
|
|
30
24
|
function Scroller({ renderPage, overlayElements, ...props }) {
|
|
31
25
|
const { provides: scrollProvides } = useScrollCapability();
|
|
32
26
|
const { plugin: scrollPlugin } = useScrollPlugin();
|
|
33
27
|
const { registry } = useRegistry();
|
|
34
|
-
const [scrollerLayout, setScrollerLayout] =
|
|
35
|
-
() => scrollProvides
|
|
28
|
+
const [scrollerLayout, setScrollerLayout] = useState(
|
|
29
|
+
() => (scrollProvides == null ? void 0 : scrollProvides.getScrollerLayout()) ?? null
|
|
36
30
|
);
|
|
37
|
-
|
|
31
|
+
useEffect(() => {
|
|
38
32
|
if (!scrollProvides) return;
|
|
39
33
|
return scrollProvides.onScrollerData(setScrollerLayout);
|
|
40
34
|
}, [scrollProvides]);
|
|
41
|
-
|
|
35
|
+
useEffect(() => {
|
|
42
36
|
if (!scrollPlugin) return;
|
|
43
37
|
scrollPlugin.setLayoutReady();
|
|
44
38
|
}, [scrollPlugin]);
|
|
@@ -148,4 +142,4 @@ export {
|
|
|
148
142
|
useScrollCapability,
|
|
149
143
|
useScrollPlugin
|
|
150
144
|
};
|
|
151
|
-
//# sourceMappingURL=index.js.map
|
|
145
|
+
//# sourceMappingURL=index.js.map
|
package/dist/react/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../src/shared/hooks/use-scroll.ts","../../src/shared/components/scroller.tsx"],"sourcesContent":["import { useCapability, usePlugin } from '@embedpdf/core/@framework';\nimport { ScrollPlugin } from '@embedpdf/plugin-scroll';\nimport { useEffect, useState } from '@framework';\n\nexport const useScrollPlugin = () => usePlugin<ScrollPlugin>(ScrollPlugin.id);\nexport const useScrollCapability = () => useCapability<ScrollPlugin>(ScrollPlugin.id);\n\nexport const useScroll = () => {\n const { provides: scroll } = useScrollCapability();\n const [currentPage, setCurrentPage] = useState(1);\n const [totalPages, setTotalPages] = useState(1);\n\n useEffect(() => {\n if (!scroll) return;\n return scroll.onPageChange(({ pageNumber, totalPages }) => {\n setCurrentPage(pageNumber);\n setTotalPages(totalPages);\n });\n }, [scroll]);\n\n return {\n ...scroll,\n currentPage,\n totalPages,\n };\n};\n","import { ReactNode, useEffect, useState, HTMLAttributes } from '@framework';\nimport { ScrollStrategy, ScrollerLayout, PageLayout } from '@embedpdf/plugin-scroll';\nimport { useRegistry } from '@embedpdf/core/@framework';\nimport { PdfDocumentObject, Rotation } from '@embedpdf/models';\n\nimport { useScrollCapability, useScrollPlugin } from '../hooks';\n\ninterface RenderPageProps extends PageLayout {\n rotation: Rotation;\n scale: number;\n document: PdfDocumentObject | null;\n}\n\ntype ScrollerProps = HTMLAttributes<HTMLDivElement> & {\n renderPage: (props: RenderPageProps) => ReactNode;\n overlayElements?: ReactNode[];\n};\n\nexport function Scroller({ renderPage, overlayElements, ...props }: ScrollerProps) {\n const { provides: scrollProvides } = useScrollCapability();\n const { plugin: scrollPlugin } = useScrollPlugin();\n const { registry } = useRegistry();\n const [scrollerLayout, setScrollerLayout] = useState<ScrollerLayout | null>(\n () => scrollProvides?.getScrollerLayout() ?? null,\n );\n\n useEffect(() => {\n if (!scrollProvides) return;\n\n return scrollProvides.onScrollerData(setScrollerLayout);\n }, [scrollProvides]);\n\n useEffect(() => {\n if (!scrollPlugin) return;\n\n scrollPlugin.setLayoutReady();\n }, [scrollPlugin]);\n\n if (!scrollerLayout) return null;\n if (!registry) return null;\n\n const coreState = registry.getStore().getState();\n\n return (\n <div\n {...props}\n style={{\n width: `${scrollerLayout.totalWidth}px`,\n height: `${scrollerLayout.totalHeight}px`,\n position: 'relative',\n boxSizing: 'border-box',\n margin: '0 auto',\n ...(scrollerLayout.strategy === ScrollStrategy.Horizontal && {\n display: 'flex',\n flexDirection: 'row',\n }),\n }}\n >\n <div\n style={{\n ...(scrollerLayout.strategy === ScrollStrategy.Horizontal\n ? {\n width: scrollerLayout.startSpacing,\n height: '100%',\n flexShrink: 0,\n }\n : {\n height: scrollerLayout.startSpacing,\n width: '100%',\n }),\n }}\n />\n <div\n style={{\n gap: scrollerLayout.pageGap,\n display: 'flex',\n alignItems: 'center',\n position: 'relative',\n boxSizing: 'border-box',\n ...(scrollerLayout.strategy === ScrollStrategy.Horizontal\n ? {\n flexDirection: 'row',\n minHeight: '100%',\n }\n : {\n flexDirection: 'column',\n minWidth: 'fit-content',\n }),\n }}\n >\n {scrollerLayout.items.map((item) => (\n <div\n key={item.pageNumbers[0]}\n style={{\n display: 'flex',\n justifyContent: 'center',\n gap: scrollerLayout.pageGap,\n }}\n >\n {item.pageLayouts.map((layout) => (\n <div\n key={layout.pageNumber}\n style={{\n width: `${layout.rotatedWidth}px`,\n height: `${layout.rotatedHeight}px`,\n }}\n >\n {renderPage({\n ...layout,\n rotation: coreState.core.rotation,\n scale: coreState.core.scale,\n document: coreState.core.document,\n })}\n </div>\n ))}\n </div>\n ))}\n </div>\n <div\n style={{\n ...(scrollerLayout.strategy === ScrollStrategy.Horizontal\n ? {\n width: scrollerLayout.endSpacing,\n height: '100%',\n flexShrink: 0,\n }\n : {\n height: scrollerLayout.endSpacing,\n width: '100%',\n }),\n }}\n />\n {overlayElements}\n </div>\n );\n}\n"],"names":["totalPages"],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './scroller';
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { ReactNode, HTMLAttributes } from '../../preact/adapter.ts';
|
|
2
|
+
import { PageLayout } from '../../lib/index.ts';
|
|
3
|
+
import { PdfDocumentObject, Rotation } from '@embedpdf/models';
|
|
4
|
+
interface RenderPageProps extends PageLayout {
|
|
5
|
+
rotation: Rotation;
|
|
6
|
+
scale: number;
|
|
7
|
+
document: PdfDocumentObject | null;
|
|
8
|
+
}
|
|
9
|
+
type ScrollerProps = HTMLAttributes<HTMLDivElement> & {
|
|
10
|
+
renderPage: (props: RenderPageProps) => ReactNode;
|
|
11
|
+
overlayElements?: ReactNode[];
|
|
12
|
+
};
|
|
13
|
+
export declare function Scroller({ renderPage, overlayElements, ...props }: ScrollerProps): import("preact").JSX.Element | null;
|
|
14
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './use-scroll';
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
import { ScrollPlugin } from '../../lib/index.ts';
|
|
2
|
+
export declare const useScrollPlugin: () => {
|
|
3
|
+
plugin: ScrollPlugin | null;
|
|
4
|
+
isLoading: boolean;
|
|
5
|
+
ready: Promise<void>;
|
|
6
|
+
};
|
|
7
|
+
export declare const useScrollCapability: () => {
|
|
8
|
+
provides: Readonly<import('../../lib/index.ts').ScrollCapability> | null;
|
|
9
|
+
isLoading: boolean;
|
|
10
|
+
ready: Promise<void>;
|
|
11
|
+
};
|
|
12
|
+
export declare const useScroll: () => {
|
|
13
|
+
currentPage: number;
|
|
14
|
+
totalPages: number;
|
|
15
|
+
onScrollerData?: import('@embedpdf/core').EventHook<import('../../lib/index.ts').ScrollerLayout> | undefined;
|
|
16
|
+
onStateChange?: import('@embedpdf/core').EventHook<import('../../lib/index.ts').ScrollState> | undefined;
|
|
17
|
+
onScroll?: import('@embedpdf/core').EventHook<import('../../lib/index.ts').ScrollMetrics> | undefined;
|
|
18
|
+
getCurrentPage?: (() => number) | undefined;
|
|
19
|
+
getTotalPages?: (() => number) | undefined;
|
|
20
|
+
onPageChange?: import('@embedpdf/core').EventHook<import('../../lib/index.ts').PageChangePayload> | undefined;
|
|
21
|
+
onLayoutChange?: import('@embedpdf/core').EventHook<import('../../lib/index.ts').LayoutChangePayload> | undefined;
|
|
22
|
+
onLayoutReady?: import('@embedpdf/core').EventHook<boolean> | undefined;
|
|
23
|
+
scrollToPage?: ((options: import('../../lib/index.ts').ScrollToPageOptions) => void) | undefined;
|
|
24
|
+
scrollToNextPage?: ((behavior?: ScrollBehavior) => void) | undefined;
|
|
25
|
+
scrollToPreviousPage?: ((behavior?: ScrollBehavior) => void) | undefined;
|
|
26
|
+
getMetrics?: ((viewport?: import('@embedpdf/plugin-viewport').ViewportMetrics) => import('../../lib/index.ts').ScrollMetrics) | undefined;
|
|
27
|
+
getLayout?: (() => import('../../lib/index.ts').LayoutChangePayload) | undefined;
|
|
28
|
+
getScrollerLayout?: (() => import('../../lib/index.ts').ScrollerLayout) | undefined;
|
|
29
|
+
getRectPositionForPage?: ((page: number, rect: import('@embedpdf/models').Rect, scale?: number, rotation?: import('@embedpdf/models').Rotation) => import('@embedpdf/models').Rect | null) | undefined;
|
|
30
|
+
setScrollStrategy?: ((strategy: import('../../lib/index.ts').ScrollStrategy) => void) | undefined;
|
|
31
|
+
getPageGap?: (() => number) | undefined;
|
|
32
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './scroller';
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { ReactNode, HTMLAttributes } from '../../react/adapter.ts';
|
|
2
|
+
import { PageLayout } from '../../lib/index.ts';
|
|
3
|
+
import { PdfDocumentObject, Rotation } from '@embedpdf/models';
|
|
4
|
+
interface RenderPageProps extends PageLayout {
|
|
5
|
+
rotation: Rotation;
|
|
6
|
+
scale: number;
|
|
7
|
+
document: PdfDocumentObject | null;
|
|
8
|
+
}
|
|
9
|
+
type ScrollerProps = HTMLAttributes<HTMLDivElement> & {
|
|
10
|
+
renderPage: (props: RenderPageProps) => ReactNode;
|
|
11
|
+
overlayElements?: ReactNode[];
|
|
12
|
+
};
|
|
13
|
+
export declare function Scroller({ renderPage, overlayElements, ...props }: ScrollerProps): import("react/jsx-runtime").JSX.Element | null;
|
|
14
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './use-scroll';
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
import { ScrollPlugin } from '../../lib/index.ts';
|
|
2
|
+
export declare const useScrollPlugin: () => {
|
|
3
|
+
plugin: ScrollPlugin | null;
|
|
4
|
+
isLoading: boolean;
|
|
5
|
+
ready: Promise<void>;
|
|
6
|
+
};
|
|
7
|
+
export declare const useScrollCapability: () => {
|
|
8
|
+
provides: Readonly<import('../../lib/index.ts').ScrollCapability> | null;
|
|
9
|
+
isLoading: boolean;
|
|
10
|
+
ready: Promise<void>;
|
|
11
|
+
};
|
|
12
|
+
export declare const useScroll: () => {
|
|
13
|
+
currentPage: number;
|
|
14
|
+
totalPages: number;
|
|
15
|
+
onScrollerData?: import('@embedpdf/core').EventHook<import('../../lib/index.ts').ScrollerLayout> | undefined;
|
|
16
|
+
onStateChange?: import('@embedpdf/core').EventHook<import('../../lib/index.ts').ScrollState> | undefined;
|
|
17
|
+
onScroll?: import('@embedpdf/core').EventHook<import('../../lib/index.ts').ScrollMetrics> | undefined;
|
|
18
|
+
getCurrentPage?: (() => number) | undefined;
|
|
19
|
+
getTotalPages?: (() => number) | undefined;
|
|
20
|
+
onPageChange?: import('@embedpdf/core').EventHook<import('../../lib/index.ts').PageChangePayload> | undefined;
|
|
21
|
+
onLayoutChange?: import('@embedpdf/core').EventHook<import('../../lib/index.ts').LayoutChangePayload> | undefined;
|
|
22
|
+
onLayoutReady?: import('@embedpdf/core').EventHook<boolean> | undefined;
|
|
23
|
+
scrollToPage?: ((options: import('../../lib/index.ts').ScrollToPageOptions) => void) | undefined;
|
|
24
|
+
scrollToNextPage?: ((behavior?: ScrollBehavior) => void) | undefined;
|
|
25
|
+
scrollToPreviousPage?: ((behavior?: ScrollBehavior) => void) | undefined;
|
|
26
|
+
getMetrics?: ((viewport?: import('@embedpdf/plugin-viewport').ViewportMetrics) => import('../../lib/index.ts').ScrollMetrics) | undefined;
|
|
27
|
+
getLayout?: (() => import('../../lib/index.ts').LayoutChangePayload) | undefined;
|
|
28
|
+
getScrollerLayout?: (() => import('../../lib/index.ts').ScrollerLayout) | undefined;
|
|
29
|
+
getRectPositionForPage?: ((page: number, rect: import('@embedpdf/models').Rect, scale?: number, rotation?: import('@embedpdf/models').Rotation) => import('@embedpdf/models').Rect | null) | undefined;
|
|
30
|
+
setScrollStrategy?: ((strategy: import('../../lib/index.ts').ScrollStrategy) => void) | undefined;
|
|
31
|
+
getPageGap?: (() => number) | undefined;
|
|
32
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default as Scroller } from './scroller.vue';
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import { StyleValue } from 'vue';
|
|
2
|
+
import { PageLayout } from '../../lib/index.ts';
|
|
3
|
+
import { PdfDocumentObject, Rotation } from '@embedpdf/models';
|
|
4
|
+
type __VLS_Props = {
|
|
5
|
+
style?: StyleValue;
|
|
6
|
+
overlayElements?: any[];
|
|
7
|
+
};
|
|
8
|
+
interface PageSlotProps extends PageLayout {
|
|
9
|
+
rotation: Rotation;
|
|
10
|
+
scale: number;
|
|
11
|
+
document: PdfDocumentObject | null;
|
|
12
|
+
}
|
|
13
|
+
declare var __VLS_1: {
|
|
14
|
+
page: PageSlotProps;
|
|
15
|
+
};
|
|
16
|
+
type __VLS_Slots = {} & {
|
|
17
|
+
default?: (props: typeof __VLS_1) => any;
|
|
18
|
+
};
|
|
19
|
+
declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
|
|
20
|
+
overlayElements: any[];
|
|
21
|
+
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
|
|
22
|
+
declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
|
|
23
|
+
export default _default;
|
|
24
|
+
type __VLS_WithSlots<T, S> = T & {
|
|
25
|
+
new (): {
|
|
26
|
+
$slots: S;
|
|
27
|
+
};
|
|
28
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './use-scroll';
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { ScrollPlugin } from '../../lib/index.ts';
|
|
2
|
+
export declare const useScrollPlugin: () => import('@embedpdf/core/vue').PluginState<ScrollPlugin>;
|
|
3
|
+
export declare const useScrollCapability: () => import('@embedpdf/core/vue').CapabilityState<Readonly<import('../../lib/index.ts').ScrollCapability>>;
|
|
4
|
+
/**
|
|
5
|
+
* Convenience hook that also tracks current / total page.
|
|
6
|
+
*/
|
|
7
|
+
export declare function useScroll(): {
|
|
8
|
+
scroll: import('vue').Ref<Readonly<import('../../lib/index.ts').ScrollCapability> | null, Readonly<import('../../lib/index.ts').ScrollCapability> | null>;
|
|
9
|
+
currentPage: import('vue').Ref<number, number>;
|
|
10
|
+
totalPages: import('vue').Ref<number, number>;
|
|
11
|
+
};
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),t=require("@embedpdf/core/vue"),l=require("@embedpdf/plugin-scroll"),r=()=>t.usePlugin(l.ScrollPlugin.id),o=()=>t.useCapability(l.ScrollPlugin.id);const a=e.defineComponent({__name:"scroller",props:{style:{type:[Boolean,null,String,Object,Array]},overlayElements:{default:()=>[]}},setup(a){const n=a,i=e.useAttrs(),{provides:u}=o(),{plugin:c}=r(),{registry:s}=t.useRegistry(),p=e.ref(null);function y(e){const t=s.value.getStore().getState().core;return{...e,rotation:t.rotation,scale:t.scale,document:t.document}}e.watchEffect((e=>{if(!u.value)return;p.value=u.value.getScrollerLayout();e(u.value.onScrollerData((e=>p.value=e)))})),e.onMounted((()=>{var e;null==(e=c.value)||e.setLayoutReady()}));const g=e.computed((()=>{if(!p.value)return n.style;return["object"!=typeof n.style||Array.isArray(n.style)?n.style??{}:{...n.style},{width:`${p.value.totalWidth}px`,height:`${p.value.totalHeight}px`,position:"relative",boxSizing:"border-box",margin:"0 auto",...p.value.strategy===l.ScrollStrategy.Horizontal&&{display:"flex",flexDirection:"row"}}]}));return(t,l)=>p.value&&e.unref(s)?(e.openBlock(),e.createElementBlock("div",e.mergeProps({key:0,style:g.value},e.unref(i)),["horizontal"===p.value.strategy?(e.openBlock(),e.createElementBlock("div",{key:0,style:e.normalizeStyle({width:p.value.startSpacing+"px",height:"100%",flexShrink:0})},null,4)):(e.openBlock(),e.createElementBlock("div",{key:1,style:e.normalizeStyle({height:p.value.startSpacing+"px",width:"100%"})},null,4)),e.createElementVNode("div",{style:e.normalizeStyle({gap:p.value.pageGap+"px",display:"flex",alignItems:"center",position:"relative",boxSizing:"border-box",flexDirection:"horizontal"===p.value.strategy?"row":"column",minHeight:"horizontal"===p.value.strategy?"100%":void 0,minWidth:"vertical"===p.value.strategy?"fit-content":void 0})},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(p.value.items,(l=>(e.openBlock(),e.createElementBlock("div",{key:l.pageNumbers[0],style:e.normalizeStyle({display:"flex",justifyContent:"center",gap:p.value.pageGap+"px"})},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(l.pageLayouts,(l=>(e.openBlock(),e.createElementBlock("div",{key:l.pageNumber,style:e.normalizeStyle({width:l.rotatedWidth+"px",height:l.rotatedHeight+"px"})},[e.renderSlot(t.$slots,"default",{page:y(l)})],4)))),128))],4)))),128))],4),"horizontal"===p.value.strategy?(e.openBlock(),e.createElementBlock("div",{key:2,style:e.normalizeStyle({width:p.value.endSpacing+"px",height:"100%",flexShrink:0})},null,4)):(e.openBlock(),e.createElementBlock("div",{key:3,style:e.normalizeStyle({height:p.value.endSpacing+"px",width:"100%"})},null,4)),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.overlayElements,((t,l)=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(t),{key:l})))),128))],16)):e.createCommentVNode("",!0)}});exports.Scroller=a,exports.useScroll=function(){const{provides:t}=o(),l=e.ref(1),r=e.ref(1);return e.watchEffect((e=>{if(!t.value)return;e(t.value.onPageChange((({pageNumber:e,totalPages:t})=>{l.value=e,r.value=t})))})),{scroll:t,currentPage:l,totalPages:r}},exports.useScrollCapability=o,exports.useScrollPlugin=r;
|
|
2
|
+
//# sourceMappingURL=index.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.cjs","sources":["../../src/vue/hooks/use-scroll.ts","../../src/vue/components/scroller.vue"],"sourcesContent":["import { ref, watchEffect } from 'vue';\nimport { useCapability, usePlugin } from '@embedpdf/core/vue';\nimport { ScrollPlugin } from '@embedpdf/plugin-scroll';\n\nexport const useScrollPlugin = () => usePlugin<ScrollPlugin>(ScrollPlugin.id);\nexport const useScrollCapability = () => useCapability<ScrollPlugin>(ScrollPlugin.id);\n\n/**\n * Convenience hook that also tracks current / total page.\n */\nexport function useScroll() {\n const { provides: scroll } = useScrollCapability();\n\n const currentPage = ref(1);\n const totalPages = ref(1);\n\n watchEffect((onCleanup) => {\n if (!scroll.value) return;\n\n const off = scroll.value.onPageChange(({ pageNumber, totalPages: tp }) => {\n currentPage.value = pageNumber;\n totalPages.value = tp;\n });\n onCleanup(off);\n });\n\n return {\n scroll,\n currentPage,\n totalPages,\n };\n}\n","<script setup lang=\"ts\">\n/* ------------------------------------------------------------------ */\n/* imports */\n/* ------------------------------------------------------------------ */\nimport { computed, onMounted, ref, watchEffect, useAttrs } from 'vue';\nimport type { StyleValue } from 'vue';\n\nimport { useScrollCapability, useScrollPlugin } from '../hooks';\nimport { ScrollStrategy, type ScrollerLayout, type PageLayout } from '@embedpdf/plugin-scroll';\nimport { useRegistry } from '@embedpdf/core/vue';\nimport type { PdfDocumentObject, Rotation } from '@embedpdf/models';\n\n/* ------------------------------------------------------------------ */\n/* props – pure layout; page content comes from the *slot* */\n/* ------------------------------------------------------------------ */\nconst props = withDefaults(\n defineProps<{\n style?: StyleValue;\n overlayElements?: any[];\n }>(),\n { overlayElements: () => [] },\n);\n\nconst attrs = useAttrs();\n\n/* ------------------------------------------------------------------ */\n/* plugin + reactive state */\n/* ------------------------------------------------------------------ */\nconst { provides: scrollProvides } = useScrollCapability();\nconst { plugin: scrollPlugin } = useScrollPlugin();\nconst { registry } = useRegistry(); // shallowRef<PluginRegistry|null>\n\nconst layout = ref<ScrollerLayout | null>(null);\n\n/* subscribe to scroller‑layout updates */\nwatchEffect((onCleanup) => {\n if (!scrollProvides.value) return;\n\n layout.value = scrollProvides.value.getScrollerLayout();\n const off = scrollProvides.value.onScrollerData((l) => (layout.value = l));\n onCleanup(off);\n});\n\n/* inform plugin once the DOM is ready */\nonMounted(() => {\n scrollPlugin.value?.setLayoutReady();\n});\n\n/* ------------------------------------------------------------------ */\n/* helpers */\n/* ------------------------------------------------------------------ */\ninterface PageSlotProps extends PageLayout {\n rotation: Rotation;\n scale: number;\n document: PdfDocumentObject | null;\n}\n\n/** Build the prop object that we’ll forward into the default slot */\nfunction pageSlotProps(pl: PageLayout): PageSlotProps {\n const core = registry.value!.getStore().getState().core;\n return {\n ...pl,\n rotation: core.rotation,\n scale: core.scale,\n document: core.document,\n };\n}\n\n/* ------------------------------------------------------------------ */\n/* computed root style */\n/* ------------------------------------------------------------------ */\nconst rootStyle = computed<StyleValue>(() => {\n if (!layout.value) return props.style;\n\n const base =\n typeof props.style === 'object' && !Array.isArray(props.style)\n ? { ...props.style }\n : (props.style ?? {});\n\n return [\n base,\n {\n width: `${layout.value.totalWidth}px`,\n height: `${layout.value.totalHeight}px`,\n position: 'relative',\n boxSizing: 'border-box',\n margin: '0 auto',\n ...(layout.value.strategy === ScrollStrategy.Horizontal && {\n display: 'flex',\n flexDirection: 'row',\n }),\n },\n ];\n});\n</script>\n\n<template>\n <!-- render nothing until both layout + registry exist -->\n <div v-if=\"layout && registry\" :style=\"rootStyle\" v-bind=\"attrs\">\n <!-- leading spacer -->\n <div\n v-if=\"layout.strategy === 'horizontal'\"\n :style=\"{ width: layout.startSpacing + 'px', height: '100%', flexShrink: 0 }\"\n />\n <div v-else :style=\"{ height: layout.startSpacing + 'px', width: '100%' }\" />\n\n <!-- actual page grid -->\n <div\n :style=\"{\n gap: layout.pageGap + 'px',\n display: 'flex',\n alignItems: 'center',\n position: 'relative',\n boxSizing: 'border-box',\n flexDirection: layout.strategy === 'horizontal' ? 'row' : 'column',\n minHeight: layout.strategy === 'horizontal' ? '100%' : undefined,\n minWidth: layout.strategy === 'vertical' ? 'fit-content' : undefined,\n }\"\n >\n <template v-for=\"item in layout.items\" :key=\"item.pageNumbers[0]\">\n <div :style=\"{ display: 'flex', justifyContent: 'center', gap: layout.pageGap + 'px' }\">\n <div\n v-for=\"pl in item.pageLayouts\"\n :key=\"pl.pageNumber\"\n :style=\"{ width: pl.rotatedWidth + 'px', height: pl.rotatedHeight + 'px' }\"\n >\n <!-- 🔑 give the host app full control over page content -->\n <slot :page=\"pageSlotProps(pl)\" />\n </div>\n </div>\n </template>\n </div>\n\n <!-- trailing spacer -->\n <div\n v-if=\"layout.strategy === 'horizontal'\"\n :style=\"{ width: layout.endSpacing + 'px', height: '100%', flexShrink: 0 }\"\n />\n <div v-else :style=\"{ height: layout.endSpacing + 'px', width: '100%' }\" />\n\n <!-- optional overlay components -->\n <component v-for=\"(el, i) in props.overlayElements\" :is=\"el\" :key=\"i\" />\n </div>\n</template>\n"],"names":["useScrollPlugin","usePlugin","ScrollPlugin","id","useScrollCapability","useCapability","props","__props","attrs","useAttrs","provides","scrollProvides","plugin","scrollPlugin","registry","useRegistry","layout","ref","pageSlotProps","pl","core","value","getStore","getState","rotation","scale","document","vue$1","watchEffect","onCleanup","getScrollerLayout","onScrollerData","l","onMounted","_a","setLayoutReady","rootStyle","computed","style","Array","isArray","width","totalWidth","height","totalHeight","position","boxSizing","margin","strategy","ScrollStrategy","Horizontal","display","flexDirection","_unref","_openBlock","_createElementBlock","_mergeProps","unref","_normalizeStyle","normalizeStyle","startSpacing","flexShrink","_createElementVNode","gap","pageGap","createElementBlock","_Fragment","_renderList","renderList","items","item","key","pageNumbers","justifyContent","Fragment","pageLayouts","pageNumber","rotatedWidth","rotatedHeight","_renderSlot","_ctx","$slots","page","endSpacing","overlayElements","el","i","openBlock","_createBlock","_resolveDynamicComponent","resolveDynamicComponent","scroll","currentPage","totalPages","onPageChange","tp"],"mappings":"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"}
|
|
@@ -0,0 +1,136 @@
|
|
|
1
|
+
import { ref, watchEffect, defineComponent, useAttrs, onMounted, computed, createElementBlock, createCommentVNode, unref, openBlock, mergeProps, createElementVNode, normalizeStyle, Fragment, renderList, renderSlot, createBlock, resolveDynamicComponent } from "vue";
|
|
2
|
+
import { useCapability, usePlugin, useRegistry } from "@embedpdf/core/vue";
|
|
3
|
+
import { ScrollPlugin, ScrollStrategy } from "@embedpdf/plugin-scroll";
|
|
4
|
+
const useScrollPlugin = () => usePlugin(ScrollPlugin.id);
|
|
5
|
+
const useScrollCapability = () => useCapability(ScrollPlugin.id);
|
|
6
|
+
function useScroll() {
|
|
7
|
+
const { provides: scroll } = useScrollCapability();
|
|
8
|
+
const currentPage = ref(1);
|
|
9
|
+
const totalPages = ref(1);
|
|
10
|
+
watchEffect((onCleanup) => {
|
|
11
|
+
if (!scroll.value) return;
|
|
12
|
+
const off = scroll.value.onPageChange(({ pageNumber, totalPages: tp }) => {
|
|
13
|
+
currentPage.value = pageNumber;
|
|
14
|
+
totalPages.value = tp;
|
|
15
|
+
});
|
|
16
|
+
onCleanup(off);
|
|
17
|
+
});
|
|
18
|
+
return {
|
|
19
|
+
scroll,
|
|
20
|
+
currentPage,
|
|
21
|
+
totalPages
|
|
22
|
+
};
|
|
23
|
+
}
|
|
24
|
+
const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
25
|
+
__name: "scroller",
|
|
26
|
+
props: {
|
|
27
|
+
style: { type: [Boolean, null, String, Object, Array] },
|
|
28
|
+
overlayElements: { default: () => [] }
|
|
29
|
+
},
|
|
30
|
+
setup(__props) {
|
|
31
|
+
const props = __props;
|
|
32
|
+
const attrs = useAttrs();
|
|
33
|
+
const { provides: scrollProvides } = useScrollCapability();
|
|
34
|
+
const { plugin: scrollPlugin } = useScrollPlugin();
|
|
35
|
+
const { registry } = useRegistry();
|
|
36
|
+
const layout = ref(null);
|
|
37
|
+
watchEffect((onCleanup) => {
|
|
38
|
+
if (!scrollProvides.value) return;
|
|
39
|
+
layout.value = scrollProvides.value.getScrollerLayout();
|
|
40
|
+
const off = scrollProvides.value.onScrollerData((l) => layout.value = l);
|
|
41
|
+
onCleanup(off);
|
|
42
|
+
});
|
|
43
|
+
onMounted(() => {
|
|
44
|
+
var _a;
|
|
45
|
+
(_a = scrollPlugin.value) == null ? void 0 : _a.setLayoutReady();
|
|
46
|
+
});
|
|
47
|
+
function pageSlotProps(pl) {
|
|
48
|
+
const core = registry.value.getStore().getState().core;
|
|
49
|
+
return {
|
|
50
|
+
...pl,
|
|
51
|
+
rotation: core.rotation,
|
|
52
|
+
scale: core.scale,
|
|
53
|
+
document: core.document
|
|
54
|
+
};
|
|
55
|
+
}
|
|
56
|
+
const rootStyle = computed(() => {
|
|
57
|
+
if (!layout.value) return props.style;
|
|
58
|
+
const base = typeof props.style === "object" && !Array.isArray(props.style) ? { ...props.style } : props.style ?? {};
|
|
59
|
+
return [
|
|
60
|
+
base,
|
|
61
|
+
{
|
|
62
|
+
width: `${layout.value.totalWidth}px`,
|
|
63
|
+
height: `${layout.value.totalHeight}px`,
|
|
64
|
+
position: "relative",
|
|
65
|
+
boxSizing: "border-box",
|
|
66
|
+
margin: "0 auto",
|
|
67
|
+
...layout.value.strategy === ScrollStrategy.Horizontal && {
|
|
68
|
+
display: "flex",
|
|
69
|
+
flexDirection: "row"
|
|
70
|
+
}
|
|
71
|
+
}
|
|
72
|
+
];
|
|
73
|
+
});
|
|
74
|
+
return (_ctx, _cache) => {
|
|
75
|
+
return layout.value && unref(registry) ? (openBlock(), createElementBlock("div", mergeProps({
|
|
76
|
+
key: 0,
|
|
77
|
+
style: rootStyle.value
|
|
78
|
+
}, unref(attrs)), [
|
|
79
|
+
layout.value.strategy === "horizontal" ? (openBlock(), createElementBlock("div", {
|
|
80
|
+
key: 0,
|
|
81
|
+
style: normalizeStyle({ width: layout.value.startSpacing + "px", height: "100%", flexShrink: 0 })
|
|
82
|
+
}, null, 4)) : (openBlock(), createElementBlock("div", {
|
|
83
|
+
key: 1,
|
|
84
|
+
style: normalizeStyle({ height: layout.value.startSpacing + "px", width: "100%" })
|
|
85
|
+
}, null, 4)),
|
|
86
|
+
createElementVNode("div", {
|
|
87
|
+
style: normalizeStyle({
|
|
88
|
+
gap: layout.value.pageGap + "px",
|
|
89
|
+
display: "flex",
|
|
90
|
+
alignItems: "center",
|
|
91
|
+
position: "relative",
|
|
92
|
+
boxSizing: "border-box",
|
|
93
|
+
flexDirection: layout.value.strategy === "horizontal" ? "row" : "column",
|
|
94
|
+
minHeight: layout.value.strategy === "horizontal" ? "100%" : void 0,
|
|
95
|
+
minWidth: layout.value.strategy === "vertical" ? "fit-content" : void 0
|
|
96
|
+
})
|
|
97
|
+
}, [
|
|
98
|
+
(openBlock(true), createElementBlock(Fragment, null, renderList(layout.value.items, (item) => {
|
|
99
|
+
return openBlock(), createElementBlock("div", {
|
|
100
|
+
key: item.pageNumbers[0],
|
|
101
|
+
style: normalizeStyle({ display: "flex", justifyContent: "center", gap: layout.value.pageGap + "px" })
|
|
102
|
+
}, [
|
|
103
|
+
(openBlock(true), createElementBlock(Fragment, null, renderList(item.pageLayouts, (pl) => {
|
|
104
|
+
return openBlock(), createElementBlock("div", {
|
|
105
|
+
key: pl.pageNumber,
|
|
106
|
+
style: normalizeStyle({ width: pl.rotatedWidth + "px", height: pl.rotatedHeight + "px" })
|
|
107
|
+
}, [
|
|
108
|
+
renderSlot(_ctx.$slots, "default", {
|
|
109
|
+
page: pageSlotProps(pl)
|
|
110
|
+
})
|
|
111
|
+
], 4);
|
|
112
|
+
}), 128))
|
|
113
|
+
], 4);
|
|
114
|
+
}), 128))
|
|
115
|
+
], 4),
|
|
116
|
+
layout.value.strategy === "horizontal" ? (openBlock(), createElementBlock("div", {
|
|
117
|
+
key: 2,
|
|
118
|
+
style: normalizeStyle({ width: layout.value.endSpacing + "px", height: "100%", flexShrink: 0 })
|
|
119
|
+
}, null, 4)) : (openBlock(), createElementBlock("div", {
|
|
120
|
+
key: 3,
|
|
121
|
+
style: normalizeStyle({ height: layout.value.endSpacing + "px", width: "100%" })
|
|
122
|
+
}, null, 4)),
|
|
123
|
+
(openBlock(true), createElementBlock(Fragment, null, renderList(props.overlayElements, (el, i) => {
|
|
124
|
+
return openBlock(), createBlock(resolveDynamicComponent(el), { key: i });
|
|
125
|
+
}), 128))
|
|
126
|
+
], 16)) : createCommentVNode("", true);
|
|
127
|
+
};
|
|
128
|
+
}
|
|
129
|
+
});
|
|
130
|
+
export {
|
|
131
|
+
_sfc_main as Scroller,
|
|
132
|
+
useScroll,
|
|
133
|
+
useScrollCapability,
|
|
134
|
+
useScrollPlugin
|
|
135
|
+
};
|
|
136
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../src/vue/hooks/use-scroll.ts","../../src/vue/components/scroller.vue"],"sourcesContent":["import { ref, watchEffect } from 'vue';\nimport { useCapability, usePlugin } from '@embedpdf/core/vue';\nimport { ScrollPlugin } from '@embedpdf/plugin-scroll';\n\nexport const useScrollPlugin = () => usePlugin<ScrollPlugin>(ScrollPlugin.id);\nexport const useScrollCapability = () => useCapability<ScrollPlugin>(ScrollPlugin.id);\n\n/**\n * Convenience hook that also tracks current / total page.\n */\nexport function useScroll() {\n const { provides: scroll } = useScrollCapability();\n\n const currentPage = ref(1);\n const totalPages = ref(1);\n\n watchEffect((onCleanup) => {\n if (!scroll.value) return;\n\n const off = scroll.value.onPageChange(({ pageNumber, totalPages: tp }) => {\n currentPage.value = pageNumber;\n totalPages.value = tp;\n });\n onCleanup(off);\n });\n\n return {\n scroll,\n currentPage,\n totalPages,\n };\n}\n","<script setup lang=\"ts\">\n/* ------------------------------------------------------------------ */\n/* imports */\n/* ------------------------------------------------------------------ */\nimport { computed, onMounted, ref, watchEffect, useAttrs } from 'vue';\nimport type { StyleValue } from 'vue';\n\nimport { useScrollCapability, useScrollPlugin } from '../hooks';\nimport { ScrollStrategy, type ScrollerLayout, type PageLayout } from '@embedpdf/plugin-scroll';\nimport { useRegistry } from '@embedpdf/core/vue';\nimport type { PdfDocumentObject, Rotation } from '@embedpdf/models';\n\n/* ------------------------------------------------------------------ */\n/* props – pure layout; page content comes from the *slot* */\n/* ------------------------------------------------------------------ */\nconst props = withDefaults(\n defineProps<{\n style?: StyleValue;\n overlayElements?: any[];\n }>(),\n { overlayElements: () => [] },\n);\n\nconst attrs = useAttrs();\n\n/* ------------------------------------------------------------------ */\n/* plugin + reactive state */\n/* ------------------------------------------------------------------ */\nconst { provides: scrollProvides } = useScrollCapability();\nconst { plugin: scrollPlugin } = useScrollPlugin();\nconst { registry } = useRegistry(); // shallowRef<PluginRegistry|null>\n\nconst layout = ref<ScrollerLayout | null>(null);\n\n/* subscribe to scroller‑layout updates */\nwatchEffect((onCleanup) => {\n if (!scrollProvides.value) return;\n\n layout.value = scrollProvides.value.getScrollerLayout();\n const off = scrollProvides.value.onScrollerData((l) => (layout.value = l));\n onCleanup(off);\n});\n\n/* inform plugin once the DOM is ready */\nonMounted(() => {\n scrollPlugin.value?.setLayoutReady();\n});\n\n/* ------------------------------------------------------------------ */\n/* helpers */\n/* ------------------------------------------------------------------ */\ninterface PageSlotProps extends PageLayout {\n rotation: Rotation;\n scale: number;\n document: PdfDocumentObject | null;\n}\n\n/** Build the prop object that we’ll forward into the default slot */\nfunction pageSlotProps(pl: PageLayout): PageSlotProps {\n const core = registry.value!.getStore().getState().core;\n return {\n ...pl,\n rotation: core.rotation,\n scale: core.scale,\n document: core.document,\n };\n}\n\n/* ------------------------------------------------------------------ */\n/* computed root style */\n/* ------------------------------------------------------------------ */\nconst rootStyle = computed<StyleValue>(() => {\n if (!layout.value) return props.style;\n\n const base =\n typeof props.style === 'object' && !Array.isArray(props.style)\n ? { ...props.style }\n : (props.style ?? {});\n\n return [\n base,\n {\n width: `${layout.value.totalWidth}px`,\n height: `${layout.value.totalHeight}px`,\n position: 'relative',\n boxSizing: 'border-box',\n margin: '0 auto',\n ...(layout.value.strategy === ScrollStrategy.Horizontal && {\n display: 'flex',\n flexDirection: 'row',\n }),\n },\n ];\n});\n</script>\n\n<template>\n <!-- render nothing until both layout + registry exist -->\n <div v-if=\"layout && registry\" :style=\"rootStyle\" v-bind=\"attrs\">\n <!-- leading spacer -->\n <div\n v-if=\"layout.strategy === 'horizontal'\"\n :style=\"{ width: layout.startSpacing + 'px', height: '100%', flexShrink: 0 }\"\n />\n <div v-else :style=\"{ height: layout.startSpacing + 'px', width: '100%' }\" />\n\n <!-- actual page grid -->\n <div\n :style=\"{\n gap: layout.pageGap + 'px',\n display: 'flex',\n alignItems: 'center',\n position: 'relative',\n boxSizing: 'border-box',\n flexDirection: layout.strategy === 'horizontal' ? 'row' : 'column',\n minHeight: layout.strategy === 'horizontal' ? '100%' : undefined,\n minWidth: layout.strategy === 'vertical' ? 'fit-content' : undefined,\n }\"\n >\n <template v-for=\"item in layout.items\" :key=\"item.pageNumbers[0]\">\n <div :style=\"{ display: 'flex', justifyContent: 'center', gap: layout.pageGap + 'px' }\">\n <div\n v-for=\"pl in item.pageLayouts\"\n :key=\"pl.pageNumber\"\n :style=\"{ width: pl.rotatedWidth + 'px', height: pl.rotatedHeight + 'px' }\"\n >\n <!-- 🔑 give the host app full control over page content -->\n <slot :page=\"pageSlotProps(pl)\" />\n </div>\n </div>\n </template>\n </div>\n\n <!-- trailing spacer -->\n <div\n v-if=\"layout.strategy === 'horizontal'\"\n :style=\"{ width: layout.endSpacing + 'px', height: '100%', flexShrink: 0 }\"\n />\n <div v-else :style=\"{ height: layout.endSpacing + 'px', width: '100%' }\" />\n\n <!-- optional overlay components -->\n <component v-for=\"(el, i) in props.overlayElements\" :is=\"el\" :key=\"i\" />\n </div>\n</template>\n"],"names":["_unref","_openBlock","_createElementBlock","_mergeProps","_normalizeStyle","_createElementVNode","_Fragment","_renderList","_renderSlot","_createBlock","_resolveDynamicComponent"],"mappings":"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"}
|