flipbookengine 0.1.7 → 0.2.2

package/dist/flipbook-engine.react.js

@@ -1,45 +1,46 @@
-import b, { forwardRef as d, useRef as o, useImperativeHandle as k, useEffect as f } from "react";
-import { FlipbookEngine as F } from "./flipbook-engine.js";
-const R = d(({
-  className: p,
-  style: s,
-  pdfUrl: m,
-  pages: i,
-  onPageChange: c,
+import { jsx as a } from "react/jsx-runtime";
+import { forwardRef as g, useRef as o, useImperativeHandle as b, useEffect as c } from "react";
+import { FlipbookEngine as x } from "./flipbook-engine.js";
+const v = g(({
+  className: f,
+  style: l,
+  pdfUrl: s,
+  pages: t,
+  onPageChange: n,
   ...u
-}, a) => {
-  const l = o(null), e = o(null);
-  return k(a, () => ({
+}, p) => {
+  const i = o(null), e = o(null);
+  return b(p, () => ({
     get engine() {
       return e.current;
     },
     flipNext: () => {
-      var r, t, n;
-      return (n = (t = (r = e.current) == null ? void 0 : r.ui) == null ? void 0 : t.bkNext) == null ? void 0 : n.click();
+      var r;
+      return (r = e.current) == null ? void 0 : r.nextPage();
     },
     flipPrev: () => {
-      var r, t, n;
-      return (n = (t = (r = e.current) == null ? void 0 : r.ui) == null ? void 0 : t.bkPrev) == null ? void 0 : n.click();
+      var r;
+      return (r = e.current) == null ? void 0 : r.prevPage();
     },
     turnToPage: (r) => {
-      e.current && e.current.pageFlip && e.current.pageFlip.flip(r);
+      e.current && e.current.goToPage(r);
     }
-  })), f(() => {
-    if (!l.current) return;
-    const r = new F(l.current, u);
+  })), c(() => {
+    if (!i.current) return;
+    const r = new x(i.current, u);
     e.current = r;
-    const t = r.on("pageChange", (n) => c == null ? void 0 : c(n));
-    return r.init(m, i || []).catch(console.error), () => {
-      t(), r.destroy(), e.current = null;
+    const m = r.on("pageChange", (d) => n == null ? void 0 : n(d));
+    return r.init(s, t || []).catch(console.error), () => {
+      m(), r.destroy(), e.current = null;
     };
-  }, []), f(() => {
+  }, []), c(() => {
     e.current && e.current.updateOptions(u);
-  }, [u]), f(() => {
-    e.current && e.current.setPages(i || []);
-  }, [i]), /* @__PURE__ */ b.createElement("div", { ref: l, className: p, style: { width: "100%", height: "100%", minHeight: "400px", ...s } });
+  }, [u]), c(() => {
+    e.current && e.current.setPages(t || []);
+  }, [t]), /* @__PURE__ */ a("div", { ref: i, className: f, style: { width: "100%", height: "100%", minHeight: "400px", ...l } });
 });
-R.displayName = "Flipbook";
+v.displayName = "Flipbook";
 export {
-  R as Flipbook
+  v as Flipbook
 };
 //# sourceMappingURL=flipbook-engine.react.js.map

package/dist/flipbook-engine.react.js.map

@@ -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?: 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;"}
+{"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\n/** @jsxImportSource react */\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?.nextPage(),\n        flipPrev: () => engineRef.current?.prevPage(),\n        turnToPage: (idx: number) => {\n            if (engineRef.current) {\n                engineRef.current.goToPage(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","_a","idx","useEffect","engine","FlipbookEngine","unsubscribeChange","e","jsx"],"mappings":";;;AA2BO,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;;AAAM,cAAAE,IAAAF,EAAU,YAAV,gBAAAE,EAAmB;AAAA;AAAA,IACnC,UAAU,MAAA;;AAAM,cAAAA,IAAAF,EAAU,YAAV,gBAAAE,EAAmB;AAAA;AAAA,IACnC,YAAY,CAACC,MAAgB;AACzB,MAAIH,EAAU,WACVA,EAAU,QAAQ,SAASG,CAAG;AAAA,IAEtC;AAAA,EAAA,EACF,GAEFC,EAAU,MAAM;AACZ,QAAI,CAACN,EAAa,QAAS;AAE3B,UAAMO,IAAS,IAAIC,EAAeR,EAAa,SAASF,CAAO;AAC/D,IAAAI,EAAU,UAAUK;AAEpB,UAAME,IAAoBF,EAAO,GAAG,cAAc,CAACG,MAAWb,KAAA,gBAAAA,EAAea,EAAE;AAE/E,WAAAH,EAAO,KAAKZ,GAAQC,KAAS,CAAA,CAAE,EAAE,MAAM,QAAQ,KAAK,GAE7C,MAAM;AACT,MAAAa,EAAA,GACAF,EAAO,QAAA,GACPL,EAAU,UAAU;AAAA,IACxB;AAAA,EAEJ,GAAG,CAAA,CAAE,GAELI,EAAU,MAAM;AACZ,IAAIJ,EAAU,WACVA,EAAU,QAAQ,cAAcJ,CAAO;AAAA,EAE/C,GAAG,CAACA,CAAO,CAAC,GAEZQ,EAAU,MAAM;AACZ,IAAIJ,EAAU,WACVA,EAAU,QAAQ,SAASN,KAAS,CAAA,CAAE;AAAA,EAE9C,GAAG,CAACA,CAAK,CAAC,GAEH,gBAAAe,EAAC,OAAA,EAAI,KAAKX,GAAc,WAAAP,GAAsB,OAAO,EAAE,OAAO,QAAQ,QAAQ,QAAQ,WAAW,SAAS,GAAGC,KAAS;AACjI,CAAC;AAEDH,EAAS,cAAc;"}

package/dist/flipbook-engine.vue.js

@@ -1,6 +1,6 @@
-import { defineComponent as u, ref as f, onMounted as g, onBeforeUnmount as s, watch as p, h as d } from "vue";
-import { FlipbookEngine as c } from "./flipbook-engine.js";
-const b = u({
+import { defineComponent as l, ref as u, onMounted as f, onBeforeUnmount as g, watch as r, h as s } from "vue";
+import { FlipbookEngine as d } from "./flipbook-engine.js";
+const m = l({
   name: "Flipbook",
   props: {
     pdfUrl: {
@@ -18,37 +18,31 @@ const b = u({
     }
   },
   emits: ["pageChange"],
-  setup(i, { emit: l, expose: a }) {
-    const o = f(null);
-    let e = null, r;
-    return g(() => {
-      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));
-    }), s(() => {
-      r && r(), e && (e.destroy(), e = null);
-    }), p(() => i.options, (t) => {
+  setup(n, { emit: a, expose: p }) {
+    const o = u(null);
+    let e = null, i;
+    return f(() => {
+      o.value && (e = new d(o.value, n.options), i = e.on("pageChange", (t) => a("pageChange", t)), e.init(n.pdfUrl, n.pages || []).catch(console.error));
+    }), g(() => {
+      i && i(), e && (e.destroy(), e = null);
+    }), r(() => n.options, (t) => {
       e && e.updateOptions(t);
-    }, { deep: !0 }), p(() => i.pages, (t) => {
+    }, { deep: !0 }), r(() => n.pages, (t) => {
       e && e.setPages(t || []);
-    }, { deep: !0 }), a({
+    }, { deep: !0 }), p({
       getEngine: () => e,
-      flipNext: () => {
-        var t, n;
-        return (n = (t = e == null ? void 0 : e.ui) == null ? void 0 : t.bkNext) == null ? void 0 : n.click();
-      },
-      flipPrev: () => {
-        var t, n;
-        return (n = (t = e == null ? void 0 : e.ui) == null ? void 0 : t.bkPrev) == null ? void 0 : n.click();
-      },
+      flipNext: () => e == null ? void 0 : e.nextPage(),
+      flipPrev: () => e == null ? void 0 : e.prevPage(),
       turnToPage: (t) => {
-        e && e.pageFlip && e.pageFlip.flip(t);
+        e && e.goToPage(t);
       }
-    }), () => d("div", {
+    }), () => s("div", {
       ref: o,
       style: { width: "100%", height: "100%", minHeight: "400px" }
     });
   }
 });
 export {
-  b as Flipbook
+  m as Flipbook
 };
 //# sourceMappingURL=flipbook-engine.vue.js.map

package/dist/flipbook-engine.vue.js.map

@@ -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: 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;"}
+{"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?.nextPage(),\n            flipPrev: () => engine?.prevPage(),\n            turnToPage: (idx: number) => {\n                if (engine) {\n                    engine.goToPage(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","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,MAAMA,KAAA,gBAAAA,EAAQ;AAAA,MACxB,UAAU,MAAMA,KAAA,gBAAAA,EAAQ;AAAA,MACxB,YAAY,CAACS,MAAgB;AACzB,QAAIT,KACAA,EAAO,SAASS,CAAG;AAAA,MAE3B;AAAA,IAAA,CACH,GAEM,MAAMC,EAAE,OAAO;AAAA,MAClB,KAAKZ;AAAA,MACL,OAAO,EAAE,OAAO,QAAQ,QAAQ,QAAQ,WAAW,QAAA;AAAA,IAAQ,CAC9D;AAAA,EACL;AACJ,CAAC;"}

package/dist/i18n/locales/en.d.ts

@@ -16,4 +16,6 @@ export declare const enMessages: {
     readonly fullscreen: "Fullscreen";
     readonly settings: "Settings";
     readonly downloadCatalog: "Download Catalog";
+    readonly play: "Play";
+    readonly pause: "Pause";
 };

package/dist/i18n/locales/tr.d.ts

@@ -15,5 +15,7 @@ export declare const trMessages: {
     readonly zoomIn: "Yaklaş";
     readonly fullscreen: "Tam Ekran";
     readonly settings: "Ayarlar";
-    readonly downloadCatalog: "Katalogu Indir";
+    readonly downloadCatalog: "Kataloğu İndir";
+    readonly play: "Otomatik Oynat";
+    readonly pause: "Duraklat";
 };

package/dist/i18n/service.d.ts

@@ -16,6 +16,8 @@ export interface FlipbookMessages {
     fullscreen: string;
     settings: string;
     downloadCatalog: string;
+    play: string;
+    pause: string;
 }
 export declare const builtInMessages: {
     readonly en: {
@@ -30,6 +32,8 @@ export declare const builtInMessages: {
         readonly fullscreen: "Fullscreen";
         readonly settings: "Settings";
         readonly downloadCatalog: "Download Catalog";
+        readonly play: "Play";
+        readonly pause: "Pause";
     };
     readonly tr: {
         readonly emptyStateTitle: "Veri bulunamadi.";
@@ -42,7 +46,9 @@ export declare const builtInMessages: {
         readonly zoomIn: "Yaklaş";
         readonly fullscreen: "Tam Ekran";
         readonly settings: "Ayarlar";
-        readonly downloadCatalog: "Katalogu Indir";
+        readonly downloadCatalog: "Kataloğu İndir";
+        readonly play: "Otomatik Oynat";
+        readonly pause: "Duraklat";
     };
 };
 export type FlipbookLocale = keyof typeof builtInMessages;

package/dist/state/store.d.ts

@@ -0,0 +1,31 @@
+import { FlipbookThemeMode } from '../theme/theme';
+import { NormalizedFlipbookPage } from '../model/pages';
+import { FlipbookEngineOptions } from '../engine';
+
+export declare const currentPage: import('@preact/signals-core').Signal<number>;
+export declare const totalPages: import('@preact/signals-core').Signal<number>;
+export declare const isSingleMode: import('@preact/signals-core').Signal<boolean>;
+export declare const showThumbs: import('@preact/signals-core').Signal<boolean>;
+export declare const orientation: import('@preact/signals-core').Signal<"landscape" | "portrait">;
+export declare const flipState: import('@preact/signals-core').Signal<"read" | "fold_corner" | "flipping">;
+export declare const themeMode: import('@preact/signals-core').Signal<FlipbookThemeMode>;
+export declare const allowDownload: import('@preact/signals-core').Signal<boolean>;
+export declare const hasDownloadUrl: import('@preact/signals-core').Signal<boolean>;
+export declare const primaryColor: import('@preact/signals-core').Signal<string>;
+export declare const whiteLabel: import('@preact/signals-core').Signal<boolean>;
+export declare const isZoomed: import('@preact/signals-core').Signal<boolean>;
+export declare const isAutoPlaying: import('@preact/signals-core').Signal<boolean>;
+export declare const autoPlayInterval: import('@preact/signals-core').Signal<number>;
+export declare const soundEnabled: import('@preact/signals-core').Signal<boolean>;
+export declare const zoomState: import('@preact/signals-core').Signal<{
+    isActive: boolean;
+    translateX: number;
+    translateY: number;
+    isDragging: boolean;
+    scale: number;
+}>;
+export declare const pages: import('@preact/signals-core').Signal<NormalizedFlipbookPage[]>;
+export declare const isDoublePageLayout: import('@preact/signals-core').ReadonlySignal<boolean>;
+export declare const isFrontCover: import('@preact/signals-core').ReadonlySignal<boolean>;
+export declare const isBackCover: import('@preact/signals-core').ReadonlySignal<boolean>;
+export declare function initStore(options: FlipbookEngineOptions, total: number, mappedPages: NormalizedFlipbookPage[], hasPdfUrl: boolean): void;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "flipbookengine",
-  "version": "0.1.7",
+  "version": "0.2.2",
   "description": "A modern, embeddable HTML flipbook engine for PDF-backed catalogs and digital publications.",
   "private": false,
   "scripts": {
@@ -97,6 +97,8 @@
   },
   "type": "module",
   "dependencies": {
+    "@preact/signals-core": "^1.14.3",
+    "@serenity-is/domwise": "^10.2.3",
     "page-flip": "^2.0.7",
     "pdfjs-dist": "^5.4.530"
   }

package/dist/ui/template.d.ts

@@ -1,41 +0,0 @@
-import { FlipbookMessages } from '../i18n/service';
-
-export interface FlipbookUiState {
-    showThumbs: boolean;
-}
-export interface FlipbookUiOptions {
-    allowDownload: boolean;
-    hasDownloadUrl: boolean;
-    totalPages: number;
-    className?: string;
-    whiteLabel: boolean;
-    watermarkUrl?: string;
-    messages: FlipbookMessages;
-}
-export interface FlipbookUiElements {
-    wrapper: HTMLElement;
-    area: HTMLElement;
-    navPrev: HTMLElement;
-    navNext: HTMLElement;
-    bookWrapper: HTMLElement;
-    bookSizer: HTMLElement;
-    book: HTMLElement;
-    singleView: HTMLElement;
-    singleImg: HTMLImageElement;
-    settingsPanel: HTMLElement;
-    toggleThumbs: HTMLInputElement;
-    toggleSingle: HTMLInputElement;
-    btnToggleThumbs: HTMLElement;
-    bkPrev: HTMLElement;
-    bkNext: HTMLElement;
-    pageInfo: HTMLElement;
-    zoomOut: HTMLElement;
-    zoomIn: HTMLElement;
-    fullscreen: HTMLElement;
-    btnSound: HTMLElement;
-    btnSettings: HTMLElement;
-    downloadBtn?: HTMLElement;
-    thumbs: HTMLElement;
-}
-export declare function buildFlipbookUi(state: FlipbookUiState, options: FlipbookUiOptions): FlipbookUiElements;
-export declare function buildEmptyStateUi(message: string): HTMLDivElement;

package/dist/utils/dom.d.ts

@@ -1,7 +0,0 @@
-/**
- * FlipbookEngine
- * Copyright (c) 2026 Murat Dogan
- * SPDX-License-Identifier: AGPL-3.0-or-later
- * https://flipbookengine.com
- */
-export declare function el<K extends keyof HTMLElementTagNameMap>(tag: K, attrs?: Record<string, any> | null, children?: (string | Node | boolean | undefined | null)[] | string | Node | boolean): HTMLElementTagNameMap[K];