flipbookengine 0.1.0 → 0.1.2
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/engine.d.ts +3 -0
- package/dist/flipbook-engine.css +1 -1
- package/dist/flipbook-engine.iife.js +22 -22
- package/dist/flipbook-engine.iife.js.map +1 -1
- package/dist/flipbook-engine.js +528 -458
- package/dist/flipbook-engine.js.map +1 -1
- package/dist/flipbook-engine.react.js +2 -2
- package/dist/flipbook-engine.react.js.map +1 -1
- package/dist/flipbook-engine.vue.js +7 -6
- package/dist/flipbook-engine.vue.js.map +1 -1
- package/dist/react/index.d.ts +1 -1
- package/dist/vue/index.d.ts +5 -2
- package/package.json +7 -3
- package/react/package.json +5 -0
- package/vue/package.json +5 -0
|
@@ -29,13 +29,13 @@ const R = d(({
|
|
|
29
29
|
const r = new F(l.current, u);
|
|
30
30
|
e.current = r;
|
|
31
31
|
const t = r.on("pageChange", (n) => c == null ? void 0 : c(n));
|
|
32
|
-
return r.init(m, i).catch(console.error), () => {
|
|
32
|
+
return r.init(m, i || []).catch(console.error), () => {
|
|
33
33
|
t(), r.destroy(), e.current = null;
|
|
34
34
|
};
|
|
35
35
|
}, []), f(() => {
|
|
36
36
|
e.current && e.current.updateOptions(u);
|
|
37
37
|
}, [u]), f(() => {
|
|
38
|
-
e.current && e.current.setPages(i);
|
|
38
|
+
e.current && e.current.setPages(i || []);
|
|
39
39
|
}, [i]), /* @__PURE__ */ b.createElement("div", { ref: l, className: p, style: { width: "100%", height: "100%", minHeight: "400px", ...s } });
|
|
40
40
|
});
|
|
41
41
|
R.displayName = "Flipbook";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"flipbook-engine.react.js","sources":["../src/react/index.tsx"],"sourcesContent":["/**\n * FlipbookEngine\n * Copyright (c) 2026 Murat Dogan\n * SPDX-License-Identifier: AGPL-3.0-or-later\n * https://flipbookengine.com\n */\n\nimport React, { forwardRef, useEffect, useImperativeHandle, useRef } from 'react';\nimport { FlipbookEngine, FlipbookEngineOptions, FlipbookPageAsset } from '../index';\n\nexport interface FlipbookProps extends Omit<FlipbookEngineOptions, 'theme'> {\n className?: string;\n style?: React.CSSProperties;\n pdfUrl: string;\n pages
|
|
1
|
+
{"version":3,"file":"flipbook-engine.react.js","sources":["../src/react/index.tsx"],"sourcesContent":["/**\n * FlipbookEngine\n * Copyright (c) 2026 Murat Dogan\n * SPDX-License-Identifier: AGPL-3.0-or-later\n * https://flipbookengine.com\n */\n\nimport React, { forwardRef, useEffect, useImperativeHandle, useRef } from 'react';\nimport { FlipbookEngine, FlipbookEngineOptions, FlipbookPageAsset } from '../index';\n\nexport interface FlipbookProps extends Omit<FlipbookEngineOptions, 'theme'> {\n className?: string;\n style?: React.CSSProperties;\n pdfUrl: string;\n pages?: FlipbookPageAsset[];\n theme?: 'auto' | 'light' | 'dark';\n onPageChange?: (e: { currentPage: number; totalPages: number }) => void;\n}\n\nexport interface FlipbookRef {\n engine: FlipbookEngine | null;\n flipNext: () => void;\n flipPrev: () => void;\n turnToPage: (pageIndex: number) => void;\n}\n\nexport const Flipbook = forwardRef<FlipbookRef, FlipbookProps>(({\n className,\n style,\n pdfUrl,\n pages,\n onPageChange,\n ...options\n}, ref) => {\n const containerRef = useRef<HTMLDivElement>(null);\n const engineRef = useRef<FlipbookEngine | null>(null);\n\n useImperativeHandle(ref, () => ({\n get engine() { return engineRef.current; },\n flipNext: () => (engineRef.current as any)?.ui?.bkNext?.click(),\n flipPrev: () => (engineRef.current as any)?.ui?.bkPrev?.click(),\n turnToPage: (idx: number) => {\n if (engineRef.current && (engineRef.current as any).pageFlip) {\n (engineRef.current as any).pageFlip.flip(idx);\n }\n }\n }));\n\n useEffect(() => {\n if (!containerRef.current) return;\n\n const engine = new FlipbookEngine(containerRef.current, options);\n engineRef.current = engine;\n\n const unsubscribeChange = engine.on('pageChange', (e: any) => onPageChange?.(e));\n\n engine.init(pdfUrl, pages || []).catch(console.error);\n\n return () => {\n unsubscribeChange();\n engine.destroy();\n engineRef.current = null;\n };\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []); // Run once on mount\n\n useEffect(() => {\n if (engineRef.current) {\n engineRef.current.updateOptions(options);\n }\n }, [options]);\n\n useEffect(() => {\n if (engineRef.current) {\n engineRef.current.setPages(pages || []);\n }\n }, [pages]);\n\n return <div ref={containerRef} className={className} style={{ width: '100%', height: '100%', minHeight: '400px', ...style }} />;\n});\n\nFlipbook.displayName = 'Flipbook';\n"],"names":["Flipbook","forwardRef","className","style","pdfUrl","pages","onPageChange","options","ref","containerRef","useRef","engineRef","useImperativeHandle","_c","_b","_a","idx","useEffect","engine","FlipbookEngine","unsubscribeChange","e","React"],"mappings":";;AA0BO,MAAMA,IAAWC,EAAuC,CAAC;AAAA,EAC5D,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,QAAAC;AAAA,EACA,OAAAC;AAAA,EACA,cAAAC;AAAA,EACA,GAAGC;AACP,GAAGC,MAAQ;AACP,QAAMC,IAAeC,EAAuB,IAAI,GAC1CC,IAAYD,EAA8B,IAAI;AAEpD,SAAAE,EAAoBJ,GAAK,OAAO;AAAA,IAC5B,IAAI,SAAS;AAAE,aAAOG,EAAU;AAAA,IAAS;AAAA,IACzC,UAAU,MAAA;;AAAO,cAAAE,KAAAC,KAAAC,IAAAJ,EAAU,YAAV,gBAAAI,EAA2B,OAA3B,gBAAAD,EAA+B,WAA/B,gBAAAD,EAAuC;AAAA;AAAA,IACxD,UAAU,MAAA;;AAAO,cAAAA,KAAAC,KAAAC,IAAAJ,EAAU,YAAV,gBAAAI,EAA2B,OAA3B,gBAAAD,EAA+B,WAA/B,gBAAAD,EAAuC;AAAA;AAAA,IACxD,YAAY,CAACG,MAAgB;AACzB,MAAIL,EAAU,WAAYA,EAAU,QAAgB,YAC/CA,EAAU,QAAgB,SAAS,KAAKK,CAAG;AAAA,IAEpD;AAAA,EAAA,EACF,GAEFC,EAAU,MAAM;AACZ,QAAI,CAACR,EAAa,QAAS;AAE3B,UAAMS,IAAS,IAAIC,EAAeV,EAAa,SAASF,CAAO;AAC/D,IAAAI,EAAU,UAAUO;AAEpB,UAAME,IAAoBF,EAAO,GAAG,cAAc,CAACG,MAAWf,KAAA,gBAAAA,EAAee,EAAE;AAE/E,WAAAH,EAAO,KAAKd,GAAQC,KAAS,CAAA,CAAE,EAAE,MAAM,QAAQ,KAAK,GAE7C,MAAM;AACT,MAAAe,EAAA,GACAF,EAAO,QAAA,GACPP,EAAU,UAAU;AAAA,IACxB;AAAA,EAEJ,GAAG,CAAA,CAAE,GAELM,EAAU,MAAM;AACZ,IAAIN,EAAU,WACVA,EAAU,QAAQ,cAAcJ,CAAO;AAAA,EAE/C,GAAG,CAACA,CAAO,CAAC,GAEZU,EAAU,MAAM;AACZ,IAAIN,EAAU,WACVA,EAAU,QAAQ,SAASN,KAAS,CAAA,CAAE;AAAA,EAE9C,GAAG,CAACA,CAAK,CAAC,GAEH,gBAAAiB,EAAA,cAAC,OAAA,EAAI,KAAKb,GAAc,WAAAP,GAAsB,OAAO,EAAE,OAAO,QAAQ,QAAQ,QAAQ,WAAW,SAAS,GAAGC,KAAS;AACjI,CAAC;AAEDH,EAAS,cAAc;"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { defineComponent as u, ref as f, onMounted as g, onBeforeUnmount as s, watch as p, h as
|
|
2
|
-
import { FlipbookEngine as
|
|
1
|
+
import { defineComponent as u, ref as f, onMounted as g, onBeforeUnmount as s, watch as p, h as d } from "vue";
|
|
2
|
+
import { FlipbookEngine as c } from "./flipbook-engine.js";
|
|
3
3
|
const b = u({
|
|
4
4
|
name: "Flipbook",
|
|
5
5
|
props: {
|
|
@@ -9,7 +9,8 @@ const b = u({
|
|
|
9
9
|
},
|
|
10
10
|
pages: {
|
|
11
11
|
type: Array,
|
|
12
|
-
required: !
|
|
12
|
+
required: !1,
|
|
13
|
+
default: () => []
|
|
13
14
|
},
|
|
14
15
|
options: {
|
|
15
16
|
type: Object,
|
|
@@ -21,13 +22,13 @@ const b = u({
|
|
|
21
22
|
const o = f(null);
|
|
22
23
|
let e = null, r;
|
|
23
24
|
return g(() => {
|
|
24
|
-
o.value && (e = new
|
|
25
|
+
o.value && (e = new c(o.value, i.options), r = e.on("pageChange", (t) => l("pageChange", t)), e.init(i.pdfUrl, i.pages || []).catch(console.error));
|
|
25
26
|
}), s(() => {
|
|
26
27
|
r && r(), e && (e.destroy(), e = null);
|
|
27
28
|
}), p(() => i.options, (t) => {
|
|
28
29
|
e && e.updateOptions(t);
|
|
29
30
|
}, { deep: !0 }), p(() => i.pages, (t) => {
|
|
30
|
-
e && e.setPages(t);
|
|
31
|
+
e && e.setPages(t || []);
|
|
31
32
|
}, { deep: !0 }), a({
|
|
32
33
|
getEngine: () => e,
|
|
33
34
|
flipNext: () => {
|
|
@@ -41,7 +42,7 @@ const b = u({
|
|
|
41
42
|
turnToPage: (t) => {
|
|
42
43
|
e && e.pageFlip && e.pageFlip.flip(t);
|
|
43
44
|
}
|
|
44
|
-
}), () =>
|
|
45
|
+
}), () => d("div", {
|
|
45
46
|
ref: o,
|
|
46
47
|
style: { width: "100%", height: "100%", minHeight: "400px" }
|
|
47
48
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"flipbook-engine.vue.js","sources":["../src/vue/index.ts"],"sourcesContent":["/**\n * FlipbookEngine\n * Copyright (c) 2026 Murat Dogan\n * SPDX-License-Identifier: AGPL-3.0-or-later\n * https://flipbookengine.com\n */\n\nimport { defineComponent, h, ref, onMounted, onBeforeUnmount, watch, PropType } from 'vue';\nimport { FlipbookEngine, FlipbookEngineOptions, FlipbookPageAsset } from '../index';\n\nexport const Flipbook = defineComponent({\n name: 'Flipbook',\n props: {\n pdfUrl: {\n type: String,\n required: true\n },\n pages: {\n type: Array as PropType<FlipbookPageAsset[]>,\n required:
|
|
1
|
+
{"version":3,"file":"flipbook-engine.vue.js","sources":["../src/vue/index.ts"],"sourcesContent":["/**\n * FlipbookEngine\n * Copyright (c) 2026 Murat Dogan\n * SPDX-License-Identifier: AGPL-3.0-or-later\n * https://flipbookengine.com\n */\n\nimport { defineComponent, h, ref, onMounted, onBeforeUnmount, watch, PropType } from 'vue';\nimport { FlipbookEngine, FlipbookEngineOptions, FlipbookPageAsset } from '../index';\n\nexport const Flipbook = defineComponent({\n name: 'Flipbook',\n props: {\n pdfUrl: {\n type: String,\n required: true\n },\n pages: {\n type: Array as PropType<FlipbookPageAsset[]>,\n required: false,\n default: () => []\n },\n options: {\n type: Object as PropType<Omit<FlipbookEngineOptions, 'theme'> & { theme?: 'auto' | 'light' | 'dark' }>,\n default: () => ({})\n }\n },\n emits: ['pageChange'],\n setup(props, { emit, expose }) {\n const containerRef = ref<HTMLElement | null>(null);\n let engine: FlipbookEngine | null = null;\n let unsubscribeChange: () => void;\n \n onMounted(() => {\n if (!containerRef.value) return;\n \n engine = new FlipbookEngine(containerRef.value, props.options as any);\n \n unsubscribeChange = engine.on('pageChange', (e: any) => emit('pageChange', e));\n \n engine.init(props.pdfUrl, props.pages || []).catch(console.error);\n });\n \n onBeforeUnmount(() => {\n if (unsubscribeChange) unsubscribeChange();\n if (engine) {\n engine.destroy();\n engine = null;\n }\n });\n \n watch(() => props.options, (newOptions) => {\n if (engine) {\n engine.updateOptions(newOptions as any);\n }\n }, { deep: true });\n \n watch(() => props.pages, (newPages) => {\n if (engine) {\n engine.setPages(newPages || []);\n }\n }, { deep: true });\n\n expose({\n getEngine: () => engine,\n flipNext: () => (engine as any)?.ui?.bkNext?.click(),\n flipPrev: () => (engine as any)?.ui?.bkPrev?.click(),\n turnToPage: (idx: number) => {\n if (engine && (engine as any).pageFlip) {\n (engine as any).pageFlip.flip(idx);\n }\n }\n });\n\n return () => h('div', {\n ref: containerRef,\n style: { width: '100%', height: '100%', minHeight: '400px' }\n });\n }\n});\n"],"names":["Flipbook","defineComponent","props","emit","expose","containerRef","ref","engine","unsubscribeChange","onMounted","FlipbookEngine","e","onBeforeUnmount","watch","newOptions","newPages","_b","_a","idx","h"],"mappings":";;AAUO,MAAMA,IAAWC,EAAgB;AAAA,EACpC,MAAM;AAAA,EACN,OAAO;AAAA,IACH,QAAQ;AAAA,MACJ,MAAM;AAAA,MACN,UAAU;AAAA,IAAA;AAAA,IAEd,OAAO;AAAA,MACH,MAAM;AAAA,MACN,UAAU;AAAA,MACV,SAAS,MAAM,CAAA;AAAA,IAAC;AAAA,IAEpB,SAAS;AAAA,MACL,MAAM;AAAA,MACN,SAAS,OAAO,CAAA;AAAA,IAAC;AAAA,EACrB;AAAA,EAEJ,OAAO,CAAC,YAAY;AAAA,EACpB,MAAMC,GAAO,EAAE,MAAAC,GAAM,QAAAC,KAAU;AAC3B,UAAMC,IAAeC,EAAwB,IAAI;AACjD,QAAIC,IAAgC,MAChCC;AAEJ,WAAAC,EAAU,MAAM;AACZ,MAAKJ,EAAa,UAElBE,IAAS,IAAIG,EAAeL,EAAa,OAAOH,EAAM,OAAc,GAEpEM,IAAoBD,EAAO,GAAG,cAAc,CAACI,MAAWR,EAAK,cAAcQ,CAAC,CAAC,GAE7EJ,EAAO,KAAKL,EAAM,QAAQA,EAAM,SAAS,CAAA,CAAE,EAAE,MAAM,QAAQ,KAAK;AAAA,IACpE,CAAC,GAEDU,EAAgB,MAAM;AAClB,MAAIJ,KAAmBA,EAAA,GACnBD,MACAA,EAAO,QAAA,GACPA,IAAS;AAAA,IAEjB,CAAC,GAEDM,EAAM,MAAMX,EAAM,SAAS,CAACY,MAAe;AACvC,MAAIP,KACAA,EAAO,cAAcO,CAAiB;AAAA,IAE9C,GAAG,EAAE,MAAM,IAAM,GAEjBD,EAAM,MAAMX,EAAM,OAAO,CAACa,MAAa;AACnC,MAAIR,KACAA,EAAO,SAASQ,KAAY,EAAE;AAAA,IAEtC,GAAG,EAAE,MAAM,IAAM,GAEjBX,EAAO;AAAA,MACH,WAAW,MAAMG;AAAA,MACjB,UAAU,MAAA;;AAAO,gBAAAS,KAAAC,IAAAV,KAAA,gBAAAA,EAAgB,OAAhB,gBAAAU,EAAoB,WAApB,gBAAAD,EAA4B;AAAA;AAAA,MAC7C,UAAU,MAAA;;AAAO,gBAAAA,KAAAC,IAAAV,KAAA,gBAAAA,EAAgB,OAAhB,gBAAAU,EAAoB,WAApB,gBAAAD,EAA4B;AAAA;AAAA,MAC7C,YAAY,CAACE,MAAgB;AACzB,QAAIX,KAAWA,EAAe,YACzBA,EAAe,SAAS,KAAKW,CAAG;AAAA,MAEzC;AAAA,IAAA,CACH,GAEM,MAAMC,EAAE,OAAO;AAAA,MAClB,KAAKd;AAAA,MACL,OAAO,EAAE,OAAO,QAAQ,QAAQ,QAAQ,WAAW,QAAA;AAAA,IAAQ,CAC9D;AAAA,EACL;AACJ,CAAC;"}
|
package/dist/react/index.d.ts
CHANGED
|
@@ -5,7 +5,7 @@ export interface FlipbookProps extends Omit<FlipbookEngineOptions, 'theme'> {
|
|
|
5
5
|
className?: string;
|
|
6
6
|
style?: React.CSSProperties;
|
|
7
7
|
pdfUrl: string;
|
|
8
|
-
pages
|
|
8
|
+
pages?: FlipbookPageAsset[];
|
|
9
9
|
theme?: 'auto' | 'light' | 'dark';
|
|
10
10
|
onPageChange?: (e: {
|
|
11
11
|
currentPage: number;
|
package/dist/vue/index.d.ts
CHANGED
|
@@ -8,7 +8,8 @@ export declare const Flipbook: import('vue').DefineComponent<import('vue').Extra
|
|
|
8
8
|
};
|
|
9
9
|
pages: {
|
|
10
10
|
type: PropType<FlipbookPageAsset[]>;
|
|
11
|
-
required:
|
|
11
|
+
required: false;
|
|
12
|
+
default: () => never[];
|
|
12
13
|
};
|
|
13
14
|
options: {
|
|
14
15
|
type: PropType<Omit<FlipbookEngineOptions, "theme"> & {
|
|
@@ -25,7 +26,8 @@ export declare const Flipbook: import('vue').DefineComponent<import('vue').Extra
|
|
|
25
26
|
};
|
|
26
27
|
pages: {
|
|
27
28
|
type: PropType<FlipbookPageAsset[]>;
|
|
28
|
-
required:
|
|
29
|
+
required: false;
|
|
30
|
+
default: () => never[];
|
|
29
31
|
};
|
|
30
32
|
options: {
|
|
31
33
|
type: PropType<Omit<FlipbookEngineOptions, "theme"> & {
|
|
@@ -36,6 +38,7 @@ export declare const Flipbook: import('vue').DefineComponent<import('vue').Extra
|
|
|
36
38
|
}>> & Readonly<{
|
|
37
39
|
onPageChange?: ((...args: any[]) => any) | undefined;
|
|
38
40
|
}>, {
|
|
41
|
+
pages: FlipbookPageAsset[];
|
|
39
42
|
options: Omit<FlipbookEngineOptions, "theme"> & {
|
|
40
43
|
theme?: "auto" | "light" | "dark";
|
|
41
44
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "flipbookengine",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.2",
|
|
4
4
|
"description": "A modern, embeddable HTML flipbook engine for PDF-backed catalogs and digital publications.",
|
|
5
5
|
"private": false,
|
|
6
6
|
"scripts": {
|
|
@@ -39,6 +39,8 @@
|
|
|
39
39
|
],
|
|
40
40
|
"files": [
|
|
41
41
|
"dist",
|
|
42
|
+
"react",
|
|
43
|
+
"vue",
|
|
42
44
|
"README.md",
|
|
43
45
|
"LICENSE",
|
|
44
46
|
"CHANGELOG.md",
|
|
@@ -60,11 +62,13 @@
|
|
|
60
62
|
},
|
|
61
63
|
"./react": {
|
|
62
64
|
"types": "./dist/react/index.d.ts",
|
|
63
|
-
"import": "./dist/flipbook-engine.react.js"
|
|
65
|
+
"import": "./dist/flipbook-engine.react.js",
|
|
66
|
+
"default": "./dist/flipbook-engine.react.js"
|
|
64
67
|
},
|
|
65
68
|
"./vue": {
|
|
66
69
|
"types": "./dist/vue/index.d.ts",
|
|
67
|
-
"import": "./dist/flipbook-engine.vue.js"
|
|
70
|
+
"import": "./dist/flipbook-engine.vue.js",
|
|
71
|
+
"default": "./dist/flipbook-engine.vue.js"
|
|
68
72
|
}
|
|
69
73
|
},
|
|
70
74
|
"peerDependencies": {
|