@vivliostyle/react 2.17.0 → 2.17.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}var n,r=e(require("@emotion/styled")),t=require("@vivliostyle/core"),o=require("react"),i=e(o);function a(){return(a=Object.assign
|
|
1
|
+
function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}var n,r=e(require("@emotion/styled")),t=require("@vivliostyle/core"),o=require("react"),i=e(o);function a(){return(a=Object.assign?Object.assign.bind():function(e){for(var n=1;n<arguments.length;n++){var r=arguments[n];for(var t in r)Object.prototype.hasOwnProperty.call(r,t)&&(e[t]=r[t])}return e}).apply(this,arguments)}var u,d,c=r.div(n||(u=["\n overflow: scroll;\n background: "," !important;\n"],d||(d=u.slice(0)),u.raw=d,n=u),function(e){return e.background});exports.Renderer=function(e){var n=e.source,r=e.page,u=void 0===r?1:r,d=e.zoom,s=void 0===d?1:d,f=e.fontSize,l=void 0===f?16:f,v=e.background,g=void 0===v?"#ececec":v,p=e.renderAllPages,h=void 0===p||p,y=e.autoResize,S=void 0===y||y,L=e.pageViewMode,m=void 0===L?t.PageViewMode.SINGLE_PAGE:L,b=e.defaultPaperSize,w=e.pageBorderWidth,z=void 0===w?1:w,P=e.fitToScreen,E=void 0!==P&&P,R=e.userStyleSheet,k=e.authorStyleSheet,T=e.style,A=e.onMessage,M=e.onError,O=e.onReadyStateChange,W=e.onLoad,j=e.onNavigation,V=e.onHyperlink,C=e.children,G=o.useRef(null),N=o.useRef(),q=i.useRef();function x(){N.current.setOptions({fontSize:l,pageViewMode:m,zoom:s,renderAllPages:h,autoResize:S,defaultPaperSize:b,pageBorderWidth:z,fitToScreen:E})}function B(){var e,r,t=N.current,o=n.endsWith(".json"),i=a({},R?{userStyleSheet:[(e={},e[R.endsWith(".css")?"url":"text"]=R,e)]}:null,k?{authorStyleSheet:[(r={},r[k.endsWith(".css")?"url":"text"]=k,r)]}:null);o?t.loadPublication(n,i):t.loadDocument({url:n},i,{fontSize:l,pageViewMode:m,zoom:1,renderAllPages:h,autoResize:S,defaultPaperSize:b,pageBorderWidth:z,fitToScreen:!1})}o.useEffect(function(){return N.current=new t.CoreViewer({viewportElement:G.current}),x(),function(){function e(e,n){A&&A(e.content,n)}var n=function(n){return e(n,"debug")},r=function(n){return e(n,"info")},o=function(n){return e(n,"warn")};function i(e){M&&M(e.content)}function a(){O&&O(N.current.readyState)}function u(){W&&W(q.current)}function d(e){var n={docTitle:e.docTitle,epageCount:e.epageCount,epage:e.epage,metadata:e.metadata};q.current=n,j&&j(n)}function c(e){V&&V(e)}var s=N.current;return s.addListener("debug",n),s.addListener("info",r),s.addListener("warn",o),s.addListener("error",i),s.addListener("readystatechange",a),s.addListener("loaded",u),s.addListener("nav",d),s.addListener("hyperlink",c),function(){O&&O(t.ReadyState.LOADING),s.removeListener("debug",n),s.removeListener("info",r),s.removeListener("warn",o),s.removeListener("error",i),s.removeListener("readystatechange",a),s.removeListener("loaded",u),s.removeListener("nav",d),s.removeListener("hyperlink",c),G.current.innerHTML=""}}()},[]),o.useEffect(function(){B()},[n,k,R]),o.useEffect(function(){x()},[l,m,s,h,S,b,z,E]),o.useEffect(function(){var e;null===(e=N.current)||void 0===e||e.navigateToPage(t.Navigation.EPAGE,u-1)},[u]);var D=i.createElement(c,{ref:G,style:T,background:g});return"function"==typeof C&&C instanceof Function?C({container:D,reload:B}):D};
|
|
2
2
|
//# sourceMappingURL=react-vivliostyle.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"react-vivliostyle.js","sources":["../src/renderer.tsx","../src/epage.ts"],"sourcesContent":["import styled from \"@emotion/styled\";\nimport {\n CoreViewer,\n Navigation,\n PageViewMode,\n Payload,\n ReadyState,\n} from \"@vivliostyle/core\";\nimport React, { useEffect, useRef } from \"react\";\nimport { epageFromPageNumber } from \"./epage\";\n\nexport type MessageType = \"debug\" | \"info\" | \"warn\";\nexport type NavigationPayload = Omit<Payload, \"internal\" | \"href\" | \"content\">;\nexport type HyperlinkPayload = Pick<Payload, \"internal\" | \"href\">;\n\ninterface VolatileState {\n docTitle: string;\n epage: number;\n epageCount: number;\n metadata: unknown;\n}\n\ntype ChildrenFunction = ({\n container,\n reload,\n}: {\n container: JSX.Element;\n reload: () => void;\n}) => React.ReactNode;\n\ninterface RendererProps {\n source: string;\n page?: number;\n zoom?: number;\n renderAllPages?: boolean;\n autoResize?: boolean;\n pageViewMode?: PageViewMode;\n defaultPaperSize?: {\n width: number;\n height: number;\n };\n pageBorderWidth?: number;\n fitToScreen?: boolean;\n fontSize?: number;\n background?: string;\n userStyleSheet?: string;\n authorStyleSheet?: string;\n style?: React.CSSProperties;\n onMessage?: (message: string, type: MessageType) => void;\n onError?: (error: string) => void;\n onReadyStateChange?: (state: ReadyState) => void;\n onLoad?: (state: VolatileState) => void;\n onNavigation?: (state: VolatileState) => void;\n onHyperlink?: (payload: HyperlinkPayload) => void;\n children?: React.ReactNode | ChildrenFunction;\n}\n\nexport const Renderer: React.FC<RendererProps> = ({\n source,\n page = 1,\n zoom = 1,\n fontSize = 16,\n background = \"#ececec\",\n renderAllPages = true,\n autoResize = true,\n pageViewMode = PageViewMode.SINGLE_PAGE,\n defaultPaperSize,\n pageBorderWidth = 1,\n fitToScreen = false,\n userStyleSheet,\n authorStyleSheet,\n style,\n onMessage,\n onError,\n onReadyStateChange,\n onLoad,\n onNavigation,\n onHyperlink,\n children,\n}) => {\n const containerRef = useRef<HTMLDivElement>(null);\n const instanceRef = useRef<CoreViewer>();\n const stateRef = React.useRef<VolatileState>();\n\n function setViewerOptions() {\n const viewerOptions = {\n fontSize,\n pageViewMode,\n zoom,\n renderAllPages,\n autoResize,\n defaultPaperSize,\n pageBorderWidth,\n fitToScreen,\n };\n instanceRef.current!.setOptions(viewerOptions);\n }\n\n function loadSource() {\n const instance = instanceRef.current!;\n const isPublication = source.endsWith(\".json\");\n const documentOptions = {\n ...(userStyleSheet\n ? {\n userStyleSheet: [\n {\n [userStyleSheet.endsWith(\".css\")\n ? \"url\"\n : \"text\"]: userStyleSheet,\n },\n ],\n }\n : null),\n ...(authorStyleSheet\n ? {\n authorStyleSheet: [\n {\n [authorStyleSheet.endsWith(\".css\")\n ? \"url\"\n : \"text\"]: authorStyleSheet,\n },\n ],\n }\n : null),\n };\n\n if (isPublication) {\n instance.loadPublication(source, documentOptions);\n } else {\n instance.loadDocument({ url: source }, documentOptions, {\n fontSize,\n pageViewMode,\n zoom: 1,\n renderAllPages,\n autoResize,\n defaultPaperSize,\n pageBorderWidth,\n fitToScreen: false,\n });\n }\n }\n\n function registerEventHandlers() {\n function handleMessage(payload: Payload, type: MessageType) {\n onMessage && onMessage(payload.content, type);\n }\n\n const handleDebug = (payload: Payload) => handleMessage(payload, \"debug\");\n const handleInfo = (payload: Payload) => handleMessage(payload, \"info\");\n const handleWarn = (payload: Payload) => handleMessage(payload, \"warn\");\n\n function handleError(payload: Payload) {\n onError && onError(payload.content);\n }\n\n function handleReadyStateChange() {\n const { readyState } = instanceRef.current!;\n onReadyStateChange && onReadyStateChange(readyState);\n }\n\n function handleLoaded() {\n onLoad && onLoad(stateRef.current!);\n }\n\n function handleNavigation(payload: NavigationPayload) {\n const { docTitle, epageCount, epage, metadata } = payload;\n const currentState = {\n docTitle,\n epageCount,\n epage: epage as number,\n metadata,\n };\n stateRef.current = currentState;\n onNavigation && onNavigation(currentState);\n }\n\n function handleHyperlink(payload: HyperlinkPayload) {\n onHyperlink && onHyperlink(payload);\n }\n\n const instance = instanceRef.current!;\n instance.addListener(\"debug\", handleDebug);\n instance.addListener(\"info\", handleInfo);\n instance.addListener(\"warn\", handleWarn);\n instance.addListener(\"error\", handleError);\n instance.addListener(\"readystatechange\", handleReadyStateChange);\n instance.addListener(\"loaded\", handleLoaded);\n instance.addListener(\"nav\", handleNavigation);\n instance.addListener(\"hyperlink\", handleHyperlink);\n\n return () => {\n onReadyStateChange && onReadyStateChange(ReadyState.LOADING);\n instance.removeListener(\"debug\", handleDebug);\n instance.removeListener(\"info\", handleInfo);\n instance.removeListener(\"warn\", handleWarn);\n instance.removeListener(\"error\", handleError);\n instance.removeListener(\"readystatechange\", handleReadyStateChange);\n instance.removeListener(\"loaded\", handleLoaded);\n instance.removeListener(\"nav\", handleNavigation);\n instance.removeListener(\"hyperlink\", handleHyperlink);\n containerRef.current!.innerHTML = \"\";\n };\n }\n\n function initInstance() {\n instanceRef.current = new CoreViewer({\n viewportElement: containerRef.current!,\n });\n }\n\n // initialize document and event handlers\n useEffect(() => {\n initInstance();\n setViewerOptions();\n\n const cleanup = registerEventHandlers();\n return cleanup;\n }, []);\n\n useEffect(() => {\n loadSource();\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [source, authorStyleSheet, userStyleSheet]);\n\n useEffect(() => {\n setViewerOptions();\n }, [\n fontSize,\n pageViewMode,\n zoom,\n renderAllPages,\n autoResize,\n defaultPaperSize,\n pageBorderWidth,\n fitToScreen,\n ]);\n\n // sync location\n useEffect(() => {\n const epage = epageFromPageNumber(page);\n instanceRef.current?.navigateToPage(Navigation.EPAGE, epage);\n }, [page]);\n\n const container = (\n <Container ref={containerRef} style={style} background={background} />\n );\n\n if (typeof children === \"function\" && children instanceof Function) {\n return children({ container, reload: loadSource });\n }\n\n return container;\n};\n\nconst Container = styled.div<Pick<RendererProps, \"background\">>`\n overflow: scroll;\n background: ${({ background }) => background} !important;\n`;\n","export function epageToPageNumber(epage: number): number {\n return Math.round(epage + 1);\n}\n\nexport function epageFromPageNumber(pageNumber: number): number {\n return pageNumber - 1;\n}\n"],"names":["Container","styled","div","background","source","page","zoom","fontSize","renderAllPages","autoResize","pageViewMode","PageViewMode","SINGLE_PAGE","defaultPaperSize","pageBorderWidth","fitToScreen","userStyleSheet","authorStyleSheet","style","onMessage","onError","onReadyStateChange","onLoad","onNavigation","onHyperlink","children","containerRef","useRef","instanceRef","stateRef","React","setViewerOptions","current","setOptions","loadSource","instance","isPublication","endsWith","documentOptions","loadPublication","loadDocument","url","useEffect","CoreViewer","viewportElement","handleMessage","payload","type","content","handleDebug","handleInfo","handleWarn","handleError","handleReadyStateChange","readyState","handleLoaded","handleNavigation","currentState","docTitle","epageCount","epage","metadata","handleHyperlink","addListener","ReadyState","LOADING","removeListener","innerHTML","registerEventHandlers","navigateToPage","Navigation","EPAGE","container","ref","Function","reload"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"react-vivliostyle.js","sources":["../src/renderer.tsx","../src/epage.ts"],"sourcesContent":["import styled from \"@emotion/styled\";\nimport {\n CoreViewer,\n Navigation,\n PageViewMode,\n Payload,\n ReadyState,\n} from \"@vivliostyle/core\";\nimport React, { useEffect, useRef } from \"react\";\nimport { epageFromPageNumber } from \"./epage\";\n\nexport type MessageType = \"debug\" | \"info\" | \"warn\";\nexport type NavigationPayload = Omit<Payload, \"internal\" | \"href\" | \"content\">;\nexport type HyperlinkPayload = Pick<Payload, \"internal\" | \"href\">;\n\ninterface VolatileState {\n docTitle: string;\n epage: number;\n epageCount: number;\n metadata: unknown;\n}\n\ntype ChildrenFunction = ({\n container,\n reload,\n}: {\n container: JSX.Element;\n reload: () => void;\n}) => React.ReactNode;\n\ninterface RendererProps {\n source: string;\n page?: number;\n zoom?: number;\n renderAllPages?: boolean;\n autoResize?: boolean;\n pageViewMode?: PageViewMode;\n defaultPaperSize?: {\n width: number;\n height: number;\n };\n pageBorderWidth?: number;\n fitToScreen?: boolean;\n fontSize?: number;\n background?: string;\n userStyleSheet?: string;\n authorStyleSheet?: string;\n style?: React.CSSProperties;\n onMessage?: (message: string, type: MessageType) => void;\n onError?: (error: string) => void;\n onReadyStateChange?: (state: ReadyState) => void;\n onLoad?: (state: VolatileState) => void;\n onNavigation?: (state: VolatileState) => void;\n onHyperlink?: (payload: HyperlinkPayload) => void;\n children?: React.ReactNode | ChildrenFunction;\n}\n\nexport const Renderer: React.FC<RendererProps> = ({\n source,\n page = 1,\n zoom = 1,\n fontSize = 16,\n background = \"#ececec\",\n renderAllPages = true,\n autoResize = true,\n pageViewMode = PageViewMode.SINGLE_PAGE,\n defaultPaperSize,\n pageBorderWidth = 1,\n fitToScreen = false,\n userStyleSheet,\n authorStyleSheet,\n style,\n onMessage,\n onError,\n onReadyStateChange,\n onLoad,\n onNavigation,\n onHyperlink,\n children,\n}) => {\n const containerRef = useRef<HTMLDivElement>(null);\n const instanceRef = useRef<CoreViewer>();\n const stateRef = React.useRef<VolatileState>();\n\n function setViewerOptions() {\n const viewerOptions = {\n fontSize,\n pageViewMode,\n zoom,\n renderAllPages,\n autoResize,\n defaultPaperSize,\n pageBorderWidth,\n fitToScreen,\n };\n instanceRef.current!.setOptions(viewerOptions);\n }\n\n function loadSource() {\n const instance = instanceRef.current!;\n const isPublication = source.endsWith(\".json\");\n const documentOptions = {\n ...(userStyleSheet\n ? {\n userStyleSheet: [\n {\n [userStyleSheet.endsWith(\".css\")\n ? \"url\"\n : \"text\"]: userStyleSheet,\n },\n ],\n }\n : null),\n ...(authorStyleSheet\n ? {\n authorStyleSheet: [\n {\n [authorStyleSheet.endsWith(\".css\")\n ? \"url\"\n : \"text\"]: authorStyleSheet,\n },\n ],\n }\n : null),\n };\n\n if (isPublication) {\n instance.loadPublication(source, documentOptions);\n } else {\n instance.loadDocument({ url: source }, documentOptions, {\n fontSize,\n pageViewMode,\n zoom: 1,\n renderAllPages,\n autoResize,\n defaultPaperSize,\n pageBorderWidth,\n fitToScreen: false,\n });\n }\n }\n\n function registerEventHandlers() {\n function handleMessage(payload: Payload, type: MessageType) {\n onMessage && onMessage(payload.content, type);\n }\n\n const handleDebug = (payload: Payload) => handleMessage(payload, \"debug\");\n const handleInfo = (payload: Payload) => handleMessage(payload, \"info\");\n const handleWarn = (payload: Payload) => handleMessage(payload, \"warn\");\n\n function handleError(payload: Payload) {\n onError && onError(payload.content);\n }\n\n function handleReadyStateChange() {\n const { readyState } = instanceRef.current!;\n onReadyStateChange && onReadyStateChange(readyState);\n }\n\n function handleLoaded() {\n onLoad && onLoad(stateRef.current!);\n }\n\n function handleNavigation(payload: NavigationPayload) {\n const { docTitle, epageCount, epage, metadata } = payload;\n const currentState = {\n docTitle,\n epageCount,\n epage: epage as number,\n metadata,\n };\n stateRef.current = currentState;\n onNavigation && onNavigation(currentState);\n }\n\n function handleHyperlink(payload: HyperlinkPayload) {\n onHyperlink && onHyperlink(payload);\n }\n\n const instance = instanceRef.current!;\n instance.addListener(\"debug\", handleDebug);\n instance.addListener(\"info\", handleInfo);\n instance.addListener(\"warn\", handleWarn);\n instance.addListener(\"error\", handleError);\n instance.addListener(\"readystatechange\", handleReadyStateChange);\n instance.addListener(\"loaded\", handleLoaded);\n instance.addListener(\"nav\", handleNavigation);\n instance.addListener(\"hyperlink\", handleHyperlink);\n\n return () => {\n onReadyStateChange && onReadyStateChange(ReadyState.LOADING);\n instance.removeListener(\"debug\", handleDebug);\n instance.removeListener(\"info\", handleInfo);\n instance.removeListener(\"warn\", handleWarn);\n instance.removeListener(\"error\", handleError);\n instance.removeListener(\"readystatechange\", handleReadyStateChange);\n instance.removeListener(\"loaded\", handleLoaded);\n instance.removeListener(\"nav\", handleNavigation);\n instance.removeListener(\"hyperlink\", handleHyperlink);\n containerRef.current!.innerHTML = \"\";\n };\n }\n\n function initInstance() {\n instanceRef.current = new CoreViewer({\n viewportElement: containerRef.current!,\n });\n }\n\n // initialize document and event handlers\n useEffect(() => {\n initInstance();\n setViewerOptions();\n\n const cleanup = registerEventHandlers();\n return cleanup;\n }, []);\n\n useEffect(() => {\n loadSource();\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [source, authorStyleSheet, userStyleSheet]);\n\n useEffect(() => {\n setViewerOptions();\n }, [\n fontSize,\n pageViewMode,\n zoom,\n renderAllPages,\n autoResize,\n defaultPaperSize,\n pageBorderWidth,\n fitToScreen,\n ]);\n\n // sync location\n useEffect(() => {\n const epage = epageFromPageNumber(page);\n instanceRef.current?.navigateToPage(Navigation.EPAGE, epage);\n }, [page]);\n\n const container = (\n <Container ref={containerRef} style={style} background={background} />\n );\n\n if (typeof children === \"function\" && children instanceof Function) {\n return children({ container, reload: loadSource });\n }\n\n return container;\n};\n\nconst Container = styled.div<Pick<RendererProps, \"background\">>`\n overflow: scroll;\n background: ${({ background }) => background} !important;\n`;\n","export function epageToPageNumber(epage: number): number {\n return Math.round(epage + 1);\n}\n\nexport function epageFromPageNumber(pageNumber: number): number {\n return pageNumber - 1;\n}\n"],"names":["styled","div","background","source","page","zoom","fontSize","renderAllPages","autoResize","pageViewMode","PageViewMode","SINGLE_PAGE","defaultPaperSize","pageBorderWidth","fitToScreen","userStyleSheet","authorStyleSheet","style","onMessage","onError","onReadyStateChange","onLoad","onNavigation","onHyperlink","children","useRef","React","instanceRef","current","setOptions","endsWith","isPublication","instance","loadPublication","documentOptions","loadDocument","url","useEffect","viewportElement","containerRef","setViewerOptions","payload","type","content","readyState","stateRef","docTitle","epageCount","epage","metadata","currentState","addListener","handleDebug","handleInfo","handleWarn","handleError","handleReadyStateChange","handleLoaded","handleNavigation","handleHyperlink","ReadyState","LOADING","removeListener","innerHTML","registerEventHandlers","loadSource","navigateToPage","Navigation","EPAGE","Container","ref","container","reload"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import e from"@emotion/styled";import{ReadyState as n,Navigation as r,PageViewMode as t,CoreViewer as o}from"@vivliostyle/core";import i,{useRef as a,useEffect as u}from"react";function d(){return(d=Object.assign
|
|
1
|
+
import e from"@emotion/styled";import{ReadyState as n,Navigation as r,PageViewMode as t,CoreViewer as o}from"@vivliostyle/core";import i,{useRef as a,useEffect as u}from"react";function d(){return(d=Object.assign?Object.assign.bind():function(e){for(var n=1;n<arguments.length;n++){var r=arguments[n];for(var t in r)Object.prototype.hasOwnProperty.call(r,t)&&(e[t]=r[t])}return e}).apply(this,arguments)}var c,s,l,f=function(e){var c=e.source,s=e.page,l=void 0===s?1:s,f=e.zoom,g=void 0===f?1:f,p=e.fontSize,m=void 0===p?16:p,h=e.background,L=void 0===h?"#ececec":h,S=e.renderAllPages,y=void 0===S||S,b=e.autoResize,z=void 0===b||b,w=e.pageViewMode,P=void 0===w?t.SINGLE_PAGE:w,k=e.defaultPaperSize,E=e.pageBorderWidth,T=void 0===E?1:E,A=e.fitToScreen,O=void 0!==A&&A,W=e.userStyleSheet,M=e.authorStyleSheet,R=e.style,j=e.onMessage,G=e.onError,x=e.onReadyStateChange,B=e.onLoad,C=e.onNavigation,N=e.onHyperlink,V=e.children,D=a(null),H=a(),I=i.useRef();function F(){H.current.setOptions({fontSize:m,pageViewMode:P,zoom:g,renderAllPages:y,autoResize:z,defaultPaperSize:k,pageBorderWidth:T,fitToScreen:O})}function _(){var e,n,r=H.current,t=c.endsWith(".json"),o=d({},W?{userStyleSheet:[(e={},e[W.endsWith(".css")?"url":"text"]=W,e)]}:null,M?{authorStyleSheet:[(n={},n[M.endsWith(".css")?"url":"text"]=M,n)]}:null);t?r.loadPublication(c,o):r.loadDocument({url:c},o,{fontSize:m,pageViewMode:P,zoom:1,renderAllPages:y,autoResize:z,defaultPaperSize:k,pageBorderWidth:T,fitToScreen:!1})}u(function(){return H.current=new o({viewportElement:D.current}),F(),function(){function e(e,n){j&&j(e.content,n)}var r=function(n){return e(n,"debug")},t=function(n){return e(n,"info")},o=function(n){return e(n,"warn")};function i(e){G&&G(e.content)}function a(){x&&x(H.current.readyState)}function u(){B&&B(I.current)}function d(e){var n={docTitle:e.docTitle,epageCount:e.epageCount,epage:e.epage,metadata:e.metadata};I.current=n,C&&C(n)}function c(e){N&&N(e)}var s=H.current;return s.addListener("debug",r),s.addListener("info",t),s.addListener("warn",o),s.addListener("error",i),s.addListener("readystatechange",a),s.addListener("loaded",u),s.addListener("nav",d),s.addListener("hyperlink",c),function(){x&&x(n.LOADING),s.removeListener("debug",r),s.removeListener("info",t),s.removeListener("warn",o),s.removeListener("error",i),s.removeListener("readystatechange",a),s.removeListener("loaded",u),s.removeListener("nav",d),s.removeListener("hyperlink",c),D.current.innerHTML=""}}()},[]),u(function(){_()},[c,M,W]),u(function(){F()},[m,P,g,y,z,k,T,O]),u(function(){var e;null===(e=H.current)||void 0===e||e.navigateToPage(r.EPAGE,l-1)},[l]);var q=i.createElement(v,{ref:D,style:R,background:L});return"function"==typeof V&&V instanceof Function?V({container:q,reload:_}):q},v=e.div(c||(s=["\n overflow: scroll;\n background: "," !important;\n"],l||(l=s.slice(0)),s.raw=l,c=s),function(e){return e.background});export{f as Renderer};
|
|
2
2
|
//# sourceMappingURL=react-vivliostyle.modern.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"react-vivliostyle.modern.js","sources":["../src/renderer.tsx","../src/epage.ts"],"sourcesContent":["import styled from \"@emotion/styled\";\nimport {\n CoreViewer,\n Navigation,\n PageViewMode,\n Payload,\n ReadyState,\n} from \"@vivliostyle/core\";\nimport React, { useEffect, useRef } from \"react\";\nimport { epageFromPageNumber } from \"./epage\";\n\nexport type MessageType = \"debug\" | \"info\" | \"warn\";\nexport type NavigationPayload = Omit<Payload, \"internal\" | \"href\" | \"content\">;\nexport type HyperlinkPayload = Pick<Payload, \"internal\" | \"href\">;\n\ninterface VolatileState {\n docTitle: string;\n epage: number;\n epageCount: number;\n metadata: unknown;\n}\n\ntype ChildrenFunction = ({\n container,\n reload,\n}: {\n container: JSX.Element;\n reload: () => void;\n}) => React.ReactNode;\n\ninterface RendererProps {\n source: string;\n page?: number;\n zoom?: number;\n renderAllPages?: boolean;\n autoResize?: boolean;\n pageViewMode?: PageViewMode;\n defaultPaperSize?: {\n width: number;\n height: number;\n };\n pageBorderWidth?: number;\n fitToScreen?: boolean;\n fontSize?: number;\n background?: string;\n userStyleSheet?: string;\n authorStyleSheet?: string;\n style?: React.CSSProperties;\n onMessage?: (message: string, type: MessageType) => void;\n onError?: (error: string) => void;\n onReadyStateChange?: (state: ReadyState) => void;\n onLoad?: (state: VolatileState) => void;\n onNavigation?: (state: VolatileState) => void;\n onHyperlink?: (payload: HyperlinkPayload) => void;\n children?: React.ReactNode | ChildrenFunction;\n}\n\nexport const Renderer: React.FC<RendererProps> = ({\n source,\n page = 1,\n zoom = 1,\n fontSize = 16,\n background = \"#ececec\",\n renderAllPages = true,\n autoResize = true,\n pageViewMode = PageViewMode.SINGLE_PAGE,\n defaultPaperSize,\n pageBorderWidth = 1,\n fitToScreen = false,\n userStyleSheet,\n authorStyleSheet,\n style,\n onMessage,\n onError,\n onReadyStateChange,\n onLoad,\n onNavigation,\n onHyperlink,\n children,\n}) => {\n const containerRef = useRef<HTMLDivElement>(null);\n const instanceRef = useRef<CoreViewer>();\n const stateRef = React.useRef<VolatileState>();\n\n function setViewerOptions() {\n const viewerOptions = {\n fontSize,\n pageViewMode,\n zoom,\n renderAllPages,\n autoResize,\n defaultPaperSize,\n pageBorderWidth,\n fitToScreen,\n };\n instanceRef.current!.setOptions(viewerOptions);\n }\n\n function loadSource() {\n const instance = instanceRef.current!;\n const isPublication = source.endsWith(\".json\");\n const documentOptions = {\n ...(userStyleSheet\n ? {\n userStyleSheet: [\n {\n [userStyleSheet.endsWith(\".css\")\n ? \"url\"\n : \"text\"]: userStyleSheet,\n },\n ],\n }\n : null),\n ...(authorStyleSheet\n ? {\n authorStyleSheet: [\n {\n [authorStyleSheet.endsWith(\".css\")\n ? \"url\"\n : \"text\"]: authorStyleSheet,\n },\n ],\n }\n : null),\n };\n\n if (isPublication) {\n instance.loadPublication(source, documentOptions);\n } else {\n instance.loadDocument({ url: source }, documentOptions, {\n fontSize,\n pageViewMode,\n zoom: 1,\n renderAllPages,\n autoResize,\n defaultPaperSize,\n pageBorderWidth,\n fitToScreen: false,\n });\n }\n }\n\n function registerEventHandlers() {\n function handleMessage(payload: Payload, type: MessageType) {\n onMessage && onMessage(payload.content, type);\n }\n\n const handleDebug = (payload: Payload) => handleMessage(payload, \"debug\");\n const handleInfo = (payload: Payload) => handleMessage(payload, \"info\");\n const handleWarn = (payload: Payload) => handleMessage(payload, \"warn\");\n\n function handleError(payload: Payload) {\n onError && onError(payload.content);\n }\n\n function handleReadyStateChange() {\n const { readyState } = instanceRef.current!;\n onReadyStateChange && onReadyStateChange(readyState);\n }\n\n function handleLoaded() {\n onLoad && onLoad(stateRef.current!);\n }\n\n function handleNavigation(payload: NavigationPayload) {\n const { docTitle, epageCount, epage, metadata } = payload;\n const currentState = {\n docTitle,\n epageCount,\n epage: epage as number,\n metadata,\n };\n stateRef.current = currentState;\n onNavigation && onNavigation(currentState);\n }\n\n function handleHyperlink(payload: HyperlinkPayload) {\n onHyperlink && onHyperlink(payload);\n }\n\n const instance = instanceRef.current!;\n instance.addListener(\"debug\", handleDebug);\n instance.addListener(\"info\", handleInfo);\n instance.addListener(\"warn\", handleWarn);\n instance.addListener(\"error\", handleError);\n instance.addListener(\"readystatechange\", handleReadyStateChange);\n instance.addListener(\"loaded\", handleLoaded);\n instance.addListener(\"nav\", handleNavigation);\n instance.addListener(\"hyperlink\", handleHyperlink);\n\n return () => {\n onReadyStateChange && onReadyStateChange(ReadyState.LOADING);\n instance.removeListener(\"debug\", handleDebug);\n instance.removeListener(\"info\", handleInfo);\n instance.removeListener(\"warn\", handleWarn);\n instance.removeListener(\"error\", handleError);\n instance.removeListener(\"readystatechange\", handleReadyStateChange);\n instance.removeListener(\"loaded\", handleLoaded);\n instance.removeListener(\"nav\", handleNavigation);\n instance.removeListener(\"hyperlink\", handleHyperlink);\n containerRef.current!.innerHTML = \"\";\n };\n }\n\n function initInstance() {\n instanceRef.current = new CoreViewer({\n viewportElement: containerRef.current!,\n });\n }\n\n // initialize document and event handlers\n useEffect(() => {\n initInstance();\n setViewerOptions();\n\n const cleanup = registerEventHandlers();\n return cleanup;\n }, []);\n\n useEffect(() => {\n loadSource();\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [source, authorStyleSheet, userStyleSheet]);\n\n useEffect(() => {\n setViewerOptions();\n }, [\n fontSize,\n pageViewMode,\n zoom,\n renderAllPages,\n autoResize,\n defaultPaperSize,\n pageBorderWidth,\n fitToScreen,\n ]);\n\n // sync location\n useEffect(() => {\n const epage = epageFromPageNumber(page);\n instanceRef.current?.navigateToPage(Navigation.EPAGE, epage);\n }, [page]);\n\n const container = (\n <Container ref={containerRef} style={style} background={background} />\n );\n\n if (typeof children === \"function\" && children instanceof Function) {\n return children({ container, reload: loadSource });\n }\n\n return container;\n};\n\nconst Container = styled.div<Pick<RendererProps, \"background\">>`\n overflow: scroll;\n background: ${({ background }) => background} !important;\n`;\n","export function epageToPageNumber(epage: number): number {\n return Math.round(epage + 1);\n}\n\nexport function epageFromPageNumber(pageNumber: number): number {\n return pageNumber - 1;\n}\n"],"names":["Renderer","source","page","zoom","fontSize","background","renderAllPages","autoResize","pageViewMode","PageViewMode","SINGLE_PAGE","defaultPaperSize","pageBorderWidth","fitToScreen","userStyleSheet","authorStyleSheet","style","onMessage","onError","onReadyStateChange","onLoad","onNavigation","onHyperlink","children","containerRef","useRef","instanceRef","stateRef","React","setViewerOptions","current","setOptions","loadSource","instance","isPublication","endsWith","documentOptions","loadPublication","loadDocument","url","useEffect","CoreViewer","viewportElement","handleMessage","payload","type","content","handleDebug","handleInfo","handleWarn","handleError","handleReadyStateChange","readyState","handleLoaded","handleNavigation","currentState","docTitle","epageCount","epage","metadata","handleHyperlink","addListener","ReadyState","LOADING","removeListener","innerHTML","registerEventHandlers","navigateToPage","Navigation","EPAGE","container","Container","ref","Function","reload","styled","div"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"react-vivliostyle.modern.js","sources":["../src/renderer.tsx","../src/epage.ts"],"sourcesContent":["import styled from \"@emotion/styled\";\nimport {\n CoreViewer,\n Navigation,\n PageViewMode,\n Payload,\n ReadyState,\n} from \"@vivliostyle/core\";\nimport React, { useEffect, useRef } from \"react\";\nimport { epageFromPageNumber } from \"./epage\";\n\nexport type MessageType = \"debug\" | \"info\" | \"warn\";\nexport type NavigationPayload = Omit<Payload, \"internal\" | \"href\" | \"content\">;\nexport type HyperlinkPayload = Pick<Payload, \"internal\" | \"href\">;\n\ninterface VolatileState {\n docTitle: string;\n epage: number;\n epageCount: number;\n metadata: unknown;\n}\n\ntype ChildrenFunction = ({\n container,\n reload,\n}: {\n container: JSX.Element;\n reload: () => void;\n}) => React.ReactNode;\n\ninterface RendererProps {\n source: string;\n page?: number;\n zoom?: number;\n renderAllPages?: boolean;\n autoResize?: boolean;\n pageViewMode?: PageViewMode;\n defaultPaperSize?: {\n width: number;\n height: number;\n };\n pageBorderWidth?: number;\n fitToScreen?: boolean;\n fontSize?: number;\n background?: string;\n userStyleSheet?: string;\n authorStyleSheet?: string;\n style?: React.CSSProperties;\n onMessage?: (message: string, type: MessageType) => void;\n onError?: (error: string) => void;\n onReadyStateChange?: (state: ReadyState) => void;\n onLoad?: (state: VolatileState) => void;\n onNavigation?: (state: VolatileState) => void;\n onHyperlink?: (payload: HyperlinkPayload) => void;\n children?: React.ReactNode | ChildrenFunction;\n}\n\nexport const Renderer: React.FC<RendererProps> = ({\n source,\n page = 1,\n zoom = 1,\n fontSize = 16,\n background = \"#ececec\",\n renderAllPages = true,\n autoResize = true,\n pageViewMode = PageViewMode.SINGLE_PAGE,\n defaultPaperSize,\n pageBorderWidth = 1,\n fitToScreen = false,\n userStyleSheet,\n authorStyleSheet,\n style,\n onMessage,\n onError,\n onReadyStateChange,\n onLoad,\n onNavigation,\n onHyperlink,\n children,\n}) => {\n const containerRef = useRef<HTMLDivElement>(null);\n const instanceRef = useRef<CoreViewer>();\n const stateRef = React.useRef<VolatileState>();\n\n function setViewerOptions() {\n const viewerOptions = {\n fontSize,\n pageViewMode,\n zoom,\n renderAllPages,\n autoResize,\n defaultPaperSize,\n pageBorderWidth,\n fitToScreen,\n };\n instanceRef.current!.setOptions(viewerOptions);\n }\n\n function loadSource() {\n const instance = instanceRef.current!;\n const isPublication = source.endsWith(\".json\");\n const documentOptions = {\n ...(userStyleSheet\n ? {\n userStyleSheet: [\n {\n [userStyleSheet.endsWith(\".css\")\n ? \"url\"\n : \"text\"]: userStyleSheet,\n },\n ],\n }\n : null),\n ...(authorStyleSheet\n ? {\n authorStyleSheet: [\n {\n [authorStyleSheet.endsWith(\".css\")\n ? \"url\"\n : \"text\"]: authorStyleSheet,\n },\n ],\n }\n : null),\n };\n\n if (isPublication) {\n instance.loadPublication(source, documentOptions);\n } else {\n instance.loadDocument({ url: source }, documentOptions, {\n fontSize,\n pageViewMode,\n zoom: 1,\n renderAllPages,\n autoResize,\n defaultPaperSize,\n pageBorderWidth,\n fitToScreen: false,\n });\n }\n }\n\n function registerEventHandlers() {\n function handleMessage(payload: Payload, type: MessageType) {\n onMessage && onMessage(payload.content, type);\n }\n\n const handleDebug = (payload: Payload) => handleMessage(payload, \"debug\");\n const handleInfo = (payload: Payload) => handleMessage(payload, \"info\");\n const handleWarn = (payload: Payload) => handleMessage(payload, \"warn\");\n\n function handleError(payload: Payload) {\n onError && onError(payload.content);\n }\n\n function handleReadyStateChange() {\n const { readyState } = instanceRef.current!;\n onReadyStateChange && onReadyStateChange(readyState);\n }\n\n function handleLoaded() {\n onLoad && onLoad(stateRef.current!);\n }\n\n function handleNavigation(payload: NavigationPayload) {\n const { docTitle, epageCount, epage, metadata } = payload;\n const currentState = {\n docTitle,\n epageCount,\n epage: epage as number,\n metadata,\n };\n stateRef.current = currentState;\n onNavigation && onNavigation(currentState);\n }\n\n function handleHyperlink(payload: HyperlinkPayload) {\n onHyperlink && onHyperlink(payload);\n }\n\n const instance = instanceRef.current!;\n instance.addListener(\"debug\", handleDebug);\n instance.addListener(\"info\", handleInfo);\n instance.addListener(\"warn\", handleWarn);\n instance.addListener(\"error\", handleError);\n instance.addListener(\"readystatechange\", handleReadyStateChange);\n instance.addListener(\"loaded\", handleLoaded);\n instance.addListener(\"nav\", handleNavigation);\n instance.addListener(\"hyperlink\", handleHyperlink);\n\n return () => {\n onReadyStateChange && onReadyStateChange(ReadyState.LOADING);\n instance.removeListener(\"debug\", handleDebug);\n instance.removeListener(\"info\", handleInfo);\n instance.removeListener(\"warn\", handleWarn);\n instance.removeListener(\"error\", handleError);\n instance.removeListener(\"readystatechange\", handleReadyStateChange);\n instance.removeListener(\"loaded\", handleLoaded);\n instance.removeListener(\"nav\", handleNavigation);\n instance.removeListener(\"hyperlink\", handleHyperlink);\n containerRef.current!.innerHTML = \"\";\n };\n }\n\n function initInstance() {\n instanceRef.current = new CoreViewer({\n viewportElement: containerRef.current!,\n });\n }\n\n // initialize document and event handlers\n useEffect(() => {\n initInstance();\n setViewerOptions();\n\n const cleanup = registerEventHandlers();\n return cleanup;\n }, []);\n\n useEffect(() => {\n loadSource();\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [source, authorStyleSheet, userStyleSheet]);\n\n useEffect(() => {\n setViewerOptions();\n }, [\n fontSize,\n pageViewMode,\n zoom,\n renderAllPages,\n autoResize,\n defaultPaperSize,\n pageBorderWidth,\n fitToScreen,\n ]);\n\n // sync location\n useEffect(() => {\n const epage = epageFromPageNumber(page);\n instanceRef.current?.navigateToPage(Navigation.EPAGE, epage);\n }, [page]);\n\n const container = (\n <Container ref={containerRef} style={style} background={background} />\n );\n\n if (typeof children === \"function\" && children instanceof Function) {\n return children({ container, reload: loadSource });\n }\n\n return container;\n};\n\nconst Container = styled.div<Pick<RendererProps, \"background\">>`\n overflow: scroll;\n background: ${({ background }) => background} !important;\n`;\n","export function epageToPageNumber(epage: number): number {\n return Math.round(epage + 1);\n}\n\nexport function epageFromPageNumber(pageNumber: number): number {\n return pageNumber - 1;\n}\n"],"names":["source","page","zoom","fontSize","background","renderAllPages","autoResize","pageViewMode","PageViewMode","SINGLE_PAGE","defaultPaperSize","pageBorderWidth","fitToScreen","userStyleSheet","authorStyleSheet","style","onMessage","onError","onReadyStateChange","onLoad","onNavigation","onHyperlink","children","useRef","React","instanceRef","current","setOptions","endsWith","isPublication","instance","loadPublication","documentOptions","loadDocument","url","useEffect","viewportElement","containerRef","setViewerOptions","payload","type","content","readyState","stateRef","docTitle","epageCount","epage","metadata","currentState","addListener","handleDebug","handleInfo","handleWarn","handleError","handleReadyStateChange","handleLoaded","handleNavigation","handleHyperlink","ReadyState","LOADING","removeListener","innerHTML","registerEventHandlers","loadSource","navigateToPage","Navigation","EPAGE","Container","ref","container","reload","styled","div"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@vivliostyle/react",
|
|
3
3
|
"description": "React component for Vivliostyle",
|
|
4
|
-
"version": "2.17.
|
|
4
|
+
"version": "2.17.1",
|
|
5
5
|
"author": "Yasuaki Uechi <y@uechi.io>",
|
|
6
6
|
"scripts": {
|
|
7
7
|
"build": "microbundle-crl --format modern,cjs && shx rm -rf dist/stories",
|
|
@@ -18,7 +18,7 @@
|
|
|
18
18
|
"dependencies": {
|
|
19
19
|
"@emotion/core": "^10.0.28",
|
|
20
20
|
"@emotion/styled": "^10.0.27",
|
|
21
|
-
"@vivliostyle/core": "^2.17.
|
|
21
|
+
"@vivliostyle/core": "^2.17.1"
|
|
22
22
|
},
|
|
23
23
|
"peerDependencies": {
|
|
24
24
|
"react": "^16.13.1",
|
|
@@ -70,5 +70,5 @@
|
|
|
70
70
|
"engines": {
|
|
71
71
|
"node": ">=12"
|
|
72
72
|
},
|
|
73
|
-
"gitHead": "
|
|
73
|
+
"gitHead": "76db495b6028353e7494377bef6bf7c59dd0f3ce"
|
|
74
74
|
}
|