@fluid-topics/ft-reader-content 1.2.21 → 1.2.22
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,8 +1,8 @@
|
|
|
1
1
|
import { TemplateResult } from "lit";
|
|
2
|
-
import { ElementDefinitionsMap } from "@fluid-topics/ft-wc-utils";
|
|
2
|
+
import { Debouncer, ElementDefinitionsMap } from "@fluid-topics/ft-wc-utils";
|
|
3
3
|
import { FtReaderComponent } from "@fluid-topics/ft-reader-context/build/registration";
|
|
4
4
|
import { FtReaderPage, FtReaderScrollTarget } from "@fluid-topics/ft-reader-context/build/store/model";
|
|
5
|
-
import { FtInfiniteScroll } from "@fluid-topics/ft-infinite-scroll";
|
|
5
|
+
import { FtInfiniteScroll, RenderedItemsChangeEvent, VisibleItemsChangeEvent } from "@fluid-topics/ft-infinite-scroll";
|
|
6
6
|
import { FtReaderContentProperties } from "./ft-reader-content.properties";
|
|
7
7
|
import "@fluid-topics/ft-reader-topic-context";
|
|
8
8
|
export declare class FtReaderContent extends FtReaderComponent implements FtReaderContentProperties {
|
|
@@ -18,9 +18,11 @@ export declare class FtReaderContent extends FtReaderComponent implements FtRead
|
|
|
18
18
|
mapId?: string;
|
|
19
19
|
container?: FtInfiniteScroll<any>;
|
|
20
20
|
protected render(): TemplateResult<1>;
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
21
|
+
protected renderTopicInContext(tocId: string, index: number): TemplateResult<1>;
|
|
22
|
+
protected getScrollTarget(): string | null;
|
|
23
|
+
protected renderedTopicsDebouncer: Debouncer;
|
|
24
|
+
protected renderedTopicChange(event: RenderedItemsChangeEvent<string>): void;
|
|
25
|
+
protected visibleTopicsDebouncer: Debouncer;
|
|
26
|
+
protected visibleTopicChange(event: VisibleItemsChangeEvent<string>): void;
|
|
27
|
+
protected onScrollDone(): void;
|
|
26
28
|
}
|
|
@@ -22,6 +22,7 @@ class FtReaderContent extends FtReaderComponent {
|
|
|
22
22
|
this.disableContextInteractions = false;
|
|
23
23
|
this.renderBeforeFirst = 5;
|
|
24
24
|
this.renderAfterLast = 10;
|
|
25
|
+
this.renderedTopicsDebouncer = new Debouncer(50);
|
|
25
26
|
this.visibleTopicsDebouncer = new Debouncer(50);
|
|
26
27
|
}
|
|
27
28
|
render() {
|
|
@@ -37,6 +38,7 @@ class FtReaderContent extends FtReaderComponent {
|
|
|
37
38
|
.renderBeforeFirst=${this.renderBeforeFirst}
|
|
38
39
|
.renderAfterLast=${this.renderAfterLast}
|
|
39
40
|
exportpartsPrefix="scroller"
|
|
41
|
+
@rendered-items-change=${this.renderedTopicChange}
|
|
40
42
|
@visible-items-change=${this.visibleTopicChange}
|
|
41
43
|
@scrolled-to-target=${this.onScrollDone}>
|
|
42
44
|
</ft-infinite-scroll>
|
|
@@ -63,9 +65,14 @@ class FtReaderContent extends FtReaderComponent {
|
|
|
63
65
|
}
|
|
64
66
|
return null;
|
|
65
67
|
}
|
|
68
|
+
renderedTopicChange(event) {
|
|
69
|
+
if (!this.disableContextInteractions) {
|
|
70
|
+
this.renderedTopicsDebouncer.run(() => { var _a; return (_a = this.stateManager) === null || _a === void 0 ? void 0 : _a.setRenderedTopics(event.detail.items); });
|
|
71
|
+
}
|
|
72
|
+
}
|
|
66
73
|
visibleTopicChange(event) {
|
|
67
74
|
if (!this.disableContextInteractions) {
|
|
68
|
-
this.visibleTopicsDebouncer.run(() => { var _a; return (_a = this.stateManager) === null || _a === void 0 ? void 0 : _a.setVisibleTopics(event.detail.
|
|
75
|
+
this.visibleTopicsDebouncer.run(() => { var _a; return (_a = this.stateManager) === null || _a === void 0 ? void 0 : _a.setVisibleTopics(event.detail.items); });
|
|
69
76
|
}
|
|
70
77
|
}
|
|
71
78
|
onScrollDone() {
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
"use strict";(()=>{var
|
|
1
|
+
"use strict";(()=>{var me=Object.create;var k=Object.defineProperty;var fe=Object.getOwnPropertyDescriptor;var ue=Object.getOwnPropertyNames;var ve=Object.getPrototypeOf,be=Object.prototype.hasOwnProperty;var w=(o,e)=>()=>(e||o((e={exports:{}}).exports,e),e.exports);var ge=(o,e,t,r)=>{if(e&&typeof e=="object"||typeof e=="function")for(let s of ue(e))!be.call(o,s)&&s!==t&&k(o,s,{get:()=>e[s],enumerable:!(r=fe(e,s))||r.enumerable});return o};var n=(o,e,t)=>(t=o!=null?me(ve(o)):{},ge(e||!o||!o.__esModule?k(t,"default",{value:o,enumerable:!0}):t,o));var f=w((Re,j)=>{j.exports=ftGlobals.wcUtils});var v=w((we,H)=>{H.exports=ftGlobals.lit});var T=w((Oe,K)=>{K.exports=ftGlobals.litDecorators});var V=w((Ae,W)=>{W.exports=ftGlobals.litRepeat});var z=w((Ee,Z)=>{Z.exports=ftGlobals.litUnsafeHTML});var pe=n(f());var E=n(v()),_=n(T()),u=n(f());var G=n(f()),U=n(T());var q;(function(o){o.FEEDBACK="FEEDBACK",o.RATING="RATING",o.PRINT="PRINT",o.BOOKMARK="BOOKMARK",o.COLLECTIONS="COLLECTIONS",o.PERSONAL_BOOKS="PERSONAL_BOOKS"})(q||(q={}));var Ie=function(o,e,t,r){var s=arguments.length,i=s<3?e:r===null?r=Object.getOwnPropertyDescriptor(e,t):r,l;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")i=Reflect.decorate(o,e,t,r);else for(var a=o.length-1;a>=0;a--)(l=o[a])&&(i=(s<3?l(i):s>3?l(e,t,i):l(e,t))||i);return s>3&&i&&Object.defineProperty(e,t,i),i},N=class extends Event{constructor(){super("register-ft-reader-component",{bubbles:!0,composed:!0})}},$=Symbol("registerInterval");function xe(o){var e;class t extends o{constructor(){super(...arguments),this[e]=0}setReaderStateManager(s){this.clearStateManager(),this.stateManager=s,this.addStore(s.store,"reader")}clearStateManager(){this.stateManager&&(this.removeStore("reader"),this.stateManager=void 0)}get service(){var s;return(s=this.stateManager)===null||s===void 0?void 0:s.service}connectedCallback(){super.connectedCallback(),this[$]=window.setInterval(()=>this.tryToRegisterToContext(),50)}tryToRegisterToContext(){this.stateManager!=null?window.clearInterval(this[$]):this.dispatchEvent(new N)}disconnectedCallback(){super.disconnectedCallback(),this.clearStateManager()}}return e=$,Ie([(0,U.state)()],t.prototype,"stateManager",void 0),t}var I=class extends xe(G.FtLitElementRedux){};var ee=n(f());var y=n(v()),d=n(T()),X=n(V()),h=n(f()),Y=n(z());var J=n(v()),S=n(f()),L={padding:S.FtCssVariableFactory.create("--ft-infinite-scroll-padding","","SIZE","0"),itemsGap:S.FtCssVariableFactory.create("--ft-infinite-scroll-items-gap","","SIZE","4px"),itemContainerMinHeight:S.FtCssVariableFactory.create("--ft-infinite-scroll-item-container-min-height","","SIZE",".1px")},Q=J.css`
|
|
2
2
|
.items-container {
|
|
3
|
-
padding: ${
|
|
3
|
+
padding: ${L.padding};
|
|
4
4
|
outline: none;
|
|
5
5
|
}
|
|
6
6
|
|
|
@@ -17,7 +17,7 @@
|
|
|
17
17
|
By adding this gap we ensure that the previous item will be fully hidden
|
|
18
18
|
and even if its size changes, it will not impact the scroll offset
|
|
19
19
|
*/
|
|
20
|
-
margin-top: ${
|
|
20
|
+
margin-top: ${L.itemsGap};
|
|
21
21
|
}
|
|
22
22
|
|
|
23
23
|
.item-container:not(.rendered) {
|
|
@@ -26,25 +26,25 @@
|
|
|
26
26
|
|
|
27
27
|
.item-container.rendered {
|
|
28
28
|
display: flow-root;
|
|
29
|
-
min-height: ${
|
|
29
|
+
min-height: ${L.itemContainerMinHeight};
|
|
30
30
|
}
|
|
31
|
-
`;var
|
|
31
|
+
`;var m=function(o,e,t,r){var s=arguments.length,i=s<3?e:r===null?r=Object.getOwnPropertyDescriptor(e,t):r,l;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")i=Reflect.decorate(o,e,t,r);else for(var a=o.length-1;a>=0;a--)(l=o[a])&&(i=(s<3?l(i):s>3?l(e,t,i):l(e,t))||i);return s>3&&i&&Object.defineProperty(e,t,i),i},M=class extends CustomEvent{constructor(e,t){super("visible-items-change",{detail:{indexes:e,items:t,visibleIndexes:e,visibleItems:t}})}},B=class extends CustomEvent{constructor(e,t){super("rendered-items-change",{detail:{indexes:e,items:t}})}},F=class extends Event{constructor(){super("scrolled-to-target")}},Te=o=>(o??[])[(o??[]).length-1],c=class extends h.FtLitElement{constructor(){super(...arguments),this.items=[],this.renderItem=()=>y.html``,this.getItemKey=(e,t)=>`${t} - ${JSON.stringify(e)}`,this.internalScroll=!1,this.renderBeforeFirst=1,this.renderAfterLast=1,this.ensureScrollToTarget=!1,this.visibleItems=[],this.scrolledToTarget=!1,this.scrolling=!1,this.renderApprovalTimeouts=[],this.renderedIndexes=new Set,this.scrollDebouncer=new h.Debouncer(5),this.scrollDoneDebouncer=new h.Debouncer(10),this.onVisibilityChange=e=>{let t=new Set(this.visibleItems),r=new Set;for(let s of e){let i=+s.target.getAttribute("data-item-index");s.intersectionRect.height>0?(t.add(i),r.add(i)):r.has(i)||t.delete(i)}this.visibleItems=[...t].sort((s,i)=>s-i)},this.intersectionObserver=new IntersectionObserver(this.onVisibilityChange),this.scrollingDebouncer=new h.Debouncer(50),this.ignoreNextScrollEvent=!1,this.scrollListener=()=>{var e;let t=this.ignoreNextScrollEvent;this.ignoreNextScrollEvent=!1,t||(this.scrolling=!0,this.scrollingDebouncer.run(()=>this.scrolling=!1));let r=this.scrollable.scrollTop,s=r-((e=this.lastScrollTop)!==null&&e!==void 0?e:0);if(this.lastScrollTop=r,this.scrolledToTarget&&(this.restoreScrollIfNeeded(t?0:s),!t||this.scrollRestorationItem==null)){let i=this.searchFirstVisibleItem(r,this.itemsContainer.children);this.scrollRestorationItem=i?+i.getAttribute("data-item-index"):void 0,this.scrollRestorationOffset=r-this.getOffset(i)}},this.restoreScrollIfNeeded=(e=0)=>{var t;let r=this.scrollable.scrollHeight,s=r-((t=this.lastScrollHeight)!==null&&t!==void 0?t:r);if(this.lastScrollHeight=r,s!==0&&this.scrolledToTarget&&this.scrollRestorationItem!=null&&this.scrollRestorationOffset!=null&&!(this.scrollRestorationItem===0&&this.scrollRestorationOffset<0)){let i=this.getItem(this.scrollRestorationItem),l=this.getOffset(i),a=(0,h.minmax)(this.scrollRestorationItem===0?-l:1,this.scrollRestorationOffset,i.clientHeight-1),D=l+a+e-this.scrollable.scrollTop;(Math.abs(s-D)<4||Math.abs(D)>5)&&(this.ignoreNextScrollEvent=!0,this.scrollable.scrollTop+=D)}},this._shouldRestoreScroll=!1,this.scrollAdjustment=()=>{this.restoreScrollIfNeeded(),this.shouldRestoreScroll&&requestAnimationFrame(this.scrollAdjustment)},this.onMutation=()=>{for(let e of this.itemsContainer.children)this.intersectionObserver.observe(e)},this.mutationObserver=new MutationObserver(this.onMutation),this.lastRenderedItemsLength=0,this.resetVisibleItemsDebouncer=new h.Debouncer(10)}get scrollable(){var e;return(e=this._scrollable)!==null&&e!==void 0?e:document.body}set scrollable(e){var t,r,s;this._scrollable!==e&&(this._scrollable&&(this._scrollable.removeEventListener("scroll",this.scrollListener),this.initialOverflowAnchorValue&&(this._scrollable.style.overflowAnchor=this.initialOverflowAnchorValue),h.scrollHelper.release(this,this._scrollable)),this._scrollable=h.scrollHelper.lock(this,e),e&&!this._scrollable&&console.error("Scrollable parent is already locked",this,e),(t=this._scrollable)===null||t===void 0||t.addEventListener("scroll",this.scrollListener),this.lastScrollTop=(r=this._scrollable)===null||r===void 0?void 0:r.scrollTop,this.lastScrollHeight=(s=this._scrollable)===null||s===void 0?void 0:s.scrollHeight,this._scrollable&&(this.initialOverflowAnchorValue=getComputedStyle(this._scrollable).overflowAnchor,this._scrollable.style.overflowAnchor="none"))}render(){return y.html`
|
|
32
32
|
<div @scroll-into-view="${this.onScrollIntoView}" class="items-container ${this.internalScroll?"scrollable":""}" tabindex="-1">
|
|
33
|
-
${(0,
|
|
33
|
+
${(0,X.repeat)(this.items,(e,t)=>this.getItemKey(e,t),(e,t)=>this.renderItemContainer(e,t))}
|
|
34
34
|
</div>
|
|
35
35
|
`}renderItemContainer(e,t){this.prepareRenderIfNeeded(t);let r=this.scrolledToTarget&&this.visibleItems.includes(t),s=this.renderedIndexes.has(t);return y.html`
|
|
36
36
|
<div id="item-${t}"
|
|
37
37
|
class="item-container ${s?"rendered":""} ${r?"visible":""}"
|
|
38
38
|
data-item-index="${t}">
|
|
39
|
-
${s?(()=>{let l=this.renderItem(e,t);return typeof l=="string"?(0,
|
|
39
|
+
${s?(()=>{let l=this.renderItem(e,t);return typeof l=="string"?(0,Y.unsafeHTML)(l):l})():y.nothing}
|
|
40
40
|
</div>
|
|
41
|
-
`}prepareRenderIfNeeded(e){let t=this.renderApprovalTimeouts[e]!=null;this.inRenderRange(e)&&!t&&(this.renderApprovalTimeouts[e]=setTimeout(()=>{this.inRenderRange(e)?this.
|
|
42
|
-
`;var
|
|
43
|
-
`;var
|
|
41
|
+
`}prepareRenderIfNeeded(e){let t=this.renderApprovalTimeouts[e]!=null;this.inRenderRange(e)&&!t&&(this.renderApprovalTimeouts[e]=setTimeout(()=>{this.inRenderRange(e)?this.addRenderedIndex(e):this.renderApprovalTimeouts[e]=void 0,this.requestUpdate()},300))}addRenderedIndex(e){e>=0&&!this.renderedIndexes.has(e)&&this.renderedIndexes.add(e)}inRenderRange(e){return e>=this.visibleItems[0]-this.renderBeforeFirst&&e<=Te(this.visibleItems)+this.renderAfterLast}isRendered(e){return this.renderedIndexes.has(this.items.indexOf(e))}resetScroll(e=!0){this.shouldRestoreScroll=!1,this.intersectionObserver.disconnect(),this.visibleItems=[],this.scrolledToTarget=!1,this.internalScroll&&this.scrollable!==this.internalScrollable?this.scrollable=this.internalScrollable:!this.internalScroll&&e&&(this.scrollable=h.scrollHelper.findFirstScrollableParent(this.itemsContainer));let t=this.resolveScrollToIndex();this.addRenderedIndex(t),this.scrollToTarget(t),this.scrollDoneDebouncer.run(()=>{this.ensureScrollToTarget&&t>=0&&this.scrollDebouncer.run(()=>{Math.abs(this.scrollable.scrollTop-this.getOffset(t))>5&&this.scrollToTarget(t)},500),this.scrollToTarget(t),this.scrolledToTarget=!0,this.shouldRestoreScroll=!0,this.resetIntersectionObserver()})}resolveScrollToIndex(){var e;let t=(e=this.scrollToIndex)!==null&&e!==void 0?e:this.scrollToItem?this.items.indexOf(this.scrollToItem):-1;return t>=this.items.length?-1:t}getItem(e){var t,r,s;return(r=(t=this.shadowRoot)===null||t===void 0?void 0:t.querySelector(`#item-${e}`))!==null&&r!==void 0?r:(s=this.shadowRoot)===null||s===void 0?void 0:s.querySelector("#item-0")}scrollToTarget(e){e<=0?(this.scrollable.scrollTop=0,this.scrollRestorationOffset=-this.getOffset(e)):(this.scrollable.scrollTop=this.getOffset(e),this.scrollRestorationOffset=0),this.scrollRestorationItem=e>=0?e:void 0}onScrollIntoView(e){var t;this.scrollDebouncer.cancel();let r=e.composedPath()[0],s=this.getOffset(r),i=(t=e.composedPath().find(l=>typeof l.matches=="function"&&l.matches(".item-container")))===null||t===void 0?void 0:t.getAttribute("data-item-index");this.scrollRestorationItem=i==null?this.scrollRestorationItem:+i,this.scrollRestorationOffset=s-this.getOffset(this.scrollRestorationItem),this.ignoreNextScrollEvent=!0,this.scrollable.scrollTop=s}getOffset(e){let t=typeof e=="number"?this.getItem(e):e;return t?h.scrollHelper.getAbsoluteScrollOffset(this.scrollable,t):0}appendItems(...e){this.items=[...this.items,...e]}prependItems(...e){this.items=[...e,...this.items]}connectedCallback(){super.connectedCallback(),setTimeout(()=>{this.mutationObserver.disconnect(),this.mutationObserver.observe(this.itemsContainer,{childList:!0}),this.resetScroll()},0)}disconnectedCallback(){super.disconnectedCallback(),this.scrollable=void 0,this.intersectionObserver.disconnect(),this.mutationObserver.disconnect(),this.shouldRestoreScroll=!1}resetIntersectionObserver(){this.intersectionObserver.disconnect(),this.intersectionObserver=new IntersectionObserver(this.onVisibilityChange,{root:this.scrollable,rootMargin:"-8px",threshold:[0,.01,.1,1]}),this.onMutation()}searchFirstVisibleItem(e,t,r,s){if(r=r??0,s=s??t.length-1,s<=r)return t[r];let i=Math.floor((s-r)/2)+r,l=t[i],a=this.getOffset(l);return a>e?this.searchFirstVisibleItem(e,t,r,i-1):a+l.clientHeight<e?this.searchFirstVisibleItem(e,t,i+1,s):l}get shouldRestoreScroll(){return this._shouldRestoreScroll}set shouldRestoreScroll(e){let t=e&&!this._shouldRestoreScroll;this._shouldRestoreScroll=e,t&&requestAnimationFrame(this.scrollAdjustment)}update(e){super.update(e),e.has("items")&&(this.renderedIndexes=new Set,this.lastRenderedItemsLength=0,this.renderApprovalTimeouts=[]),((e.has("scrollToItem")||e.has("scrollToIndex"))&&(this.scrollToItem!=null||this.scrollToIndex!=null)||e.has("internalScroll"))&&this.resetScroll()}updated(e){super.updated(e),(e.has("visibleItems")||e.has("items"))&&this.onVisibleItemsChange(),e.has("scrolledToTarget")&&this.scrolledToTarget&&(this.scrollToItem!=null||this.scrollToIndex!=null)&&this.dispatchEvent(new F)}contentAvailableCallback(e){var t,r;super.contentAvailableCallback(e);let s=[...(r=(t=this.shadowRoot)===null||t===void 0?void 0:t.querySelectorAll(".item-container.rendered"))!==null&&r!==void 0?r:[]].map(i=>+i.getAttribute("data-item-index"));this.lastRenderedItemsLength!==s.length&&(this.dispatchRenderedItemsChangeEvent(s),this.lastRenderedItemsLength=s.length)}dispatchRenderedItemsChangeEvent(e){let t=e??[...this.renderedIndexes].sort((r,s)=>r-s);this.dispatchEvent(new B(t,t.map(r=>this.items[r])))}onVisibleItemsChange(){this.visibleItems.every((t,r)=>this.visibleItems[r+1]==null||t+1===this.visibleItems[r+1])||(0,h.deepEqual)(this.visibleItems,this.lastNotOkVisibleItems)?(this.resetVisibleItemsDebouncer.cancel(),this.dispatchVisibleItemsEvent()):this.resetVisibleItemsDebouncer.run(()=>{this.lastNotOkVisibleItems=[...this.visibleItems],this.visibleItems=[],this.resetIntersectionObserver()})}dispatchVisibleItemsEvent(){var e;(e=this.cancelableDispatchEvent)===null||e===void 0||e.cancel(),this.cancelableDispatchEvent=(0,h.cancelable)((0,h.waitUntil)(()=>!this.scrolling)),this.cancelableDispatchEvent.then(()=>this.dispatchEvent(new M(this.visibleItems,this.visibleItems.map(t=>this.items[t])))).catch(()=>null)}};c.styles=Q;m([(0,d.property)({type:Array})],c.prototype,"items",void 0);m([(0,d.property)({attribute:!1})],c.prototype,"renderItem",void 0);m([(0,d.property)({attribute:!1})],c.prototype,"getItemKey",void 0);m([(0,d.property)({type:Object})],c.prototype,"scrollToItem",void 0);m([(0,d.property)({type:Number})],c.prototype,"scrollToIndex",void 0);m([(0,d.property)({type:Boolean})],c.prototype,"internalScroll",void 0);m([(0,d.property)({type:Number})],c.prototype,"renderBeforeFirst",void 0);m([(0,d.property)({type:Number})],c.prototype,"renderAfterLast",void 0);m([(0,d.property)({type:Boolean})],c.prototype,"ensureScrollToTarget",void 0);m([(0,d.state)({hasChanged(o,e){return o!=null&&e==null||o.length!==e.length||o[0]!==e[0]}})],c.prototype,"visibleItems",void 0);m([(0,d.query)(".scrollable")],c.prototype,"internalScrollable",void 0);m([(0,d.query)(".items-container")],c.prototype,"itemsContainer",void 0);m([(0,d.state)()],c.prototype,"scrolledToTarget",void 0);m([(0,d.state)()],c.prototype,"scrolling",void 0);(0,ee.customElement)("ft-infinite-scroll")(c);var te=n(v()),Pe={},re=te.css`
|
|
42
|
+
`;var ne=n(f());var oe=n(v()),O=n(T());var se=n(v());var ie=se.css`
|
|
43
|
+
`;var le=n(f()),C=function(o,e,t,r){var s=arguments.length,i=s<3?e:r===null?r=Object.getOwnPropertyDescriptor(e,t):r,l;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")i=Reflect.decorate(o,e,t,r);else for(var a=o.length-1;a>=0;a--)(l=o[a])&&(i=(s<3?l(i):s>3?l(e,t,i):l(e,t))||i);return s>3&&i&&Object.defineProperty(e,t,i),i},b=class extends I{constructor(){super(...arguments),this.disableContextInteractions=!1,this.registeredComponents=[]}render(){return oe.html`
|
|
44
44
|
<article id=${this.tocId}>
|
|
45
45
|
<slot @register-ft-reader-topic-component=${this.registerComponent}></slot>
|
|
46
46
|
</article>
|
|
47
|
-
`}registerComponent(e){e.stopPropagation();let t=e.composedPath()[0];this.register(t)}register(e){this.registeredComponents.push(e),e.tocNode=this.tocNode,e.disableContextInteractions=this.disableContextInteractions}update(e){super.update(e),["mapId","tocId","stateManager"].some(t=>e.has(t))&&this.setTocNode(),e.has("tocNode")&&this.registeredComponents.forEach(t=>t.tocNode=this.tocNode)}async setTocNode(){var e;this.tocNode=void 0,this.tocNode=this.mapId&&this.tocId?await((e=this.service)===null||e===void 0?void 0:e.getTocNode(this.tocId)):void 0}disconnectedCallback(){super.disconnectedCallback(),this.registeredComponents=[]}};
|
|
47
|
+
`}registerComponent(e){e.stopPropagation();let t=e.composedPath()[0];this.register(t)}register(e){this.registeredComponents.push(e),e.tocNode=this.tocNode,e.disableContextInteractions=this.disableContextInteractions}update(e){super.update(e),["mapId","tocId","stateManager"].some(t=>e.has(t))&&this.setTocNode(),e.has("tocNode")&&this.registeredComponents.forEach(t=>t.tocNode=this.tocNode)}async setTocNode(){var e;this.tocNode=void 0,this.tocNode=this.mapId&&this.tocId?await((e=this.service)===null||e===void 0?void 0:e.getTocNode(this.tocId)):void 0}disconnectedCallback(){super.disconnectedCallback(),this.registeredComponents=[]}};b.styles=ie;C([(0,le.redux)({selector:o=>{var e;return(e=o.map)===null||e===void 0?void 0:e.id}})],b.prototype,"mapId",void 0);C([(0,O.property)()],b.prototype,"tocId",void 0);C([(0,O.property)({type:Boolean})],b.prototype,"disableContextInteractions",void 0);C([(0,O.state)()],b.prototype,"tocNode",void 0);(0,ne.customElement)("ft-reader-topic-context")(b);var he=n(f()),R=n(v()),A=n(T());var ae=n(v());var ce=ae.css`
|
|
48
48
|
:host {
|
|
49
49
|
position: absolute;
|
|
50
50
|
top: 0;
|
|
@@ -63,7 +63,7 @@
|
|
|
63
63
|
.ft-watermark {
|
|
64
64
|
z-index: 79;
|
|
65
65
|
}
|
|
66
|
-
`;var
|
|
66
|
+
`;var de=n(V()),P=function(o,e,t,r){var s=arguments.length,i=s<3?e:r===null?r=Object.getOwnPropertyDescriptor(e,t):r,l;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")i=Reflect.decorate(o,e,t,r);else for(var a=o.length-1;a>=0;a--)(l=o[a])&&(i=(s<3?l(i):s>3?l(e,t,i):l(e,t))||i);return s>3&&i&&Object.defineProperty(e,t,i),i},x=class extends I{constructor(){super(...arguments),this.height="0"}render(){var e,t,r;return this.watermark?R.html`
|
|
67
67
|
<style>
|
|
68
68
|
.ft-watermark {
|
|
69
69
|
height: ${this.height};
|
|
@@ -73,14 +73,14 @@
|
|
|
73
73
|
<svg xmlns="http://www.w3.org/2000/svg" class="ft-watermark" part="svg">
|
|
74
74
|
<text x="0" y="0" text-anchor="middle" transform="rotate(-45)" fill="${(e=this.watermark)===null||e===void 0?void 0:e.color}"
|
|
75
75
|
fill-opacity="${(t=this.watermark)===null||t===void 0?void 0:t.opacity}%">
|
|
76
|
-
${(0,
|
|
76
|
+
${(0,de.repeat)(((r=this.watermark)===null||r===void 0?void 0:r.text)||[],s=>R.svg`<tspan x="0" dy="1.2em">${s}</tspan>`)}
|
|
77
77
|
</text>
|
|
78
78
|
</svg>
|
|
79
79
|
</div>
|
|
80
|
-
`:
|
|
80
|
+
`:R.nothing}updated(e){if(super.updated(e),e.has("watermark")&&this.watermark){let t=this.svg.getBBox();this.svg.setAttribute("viewBox",t.x+" "+t.y+" "+t.width+" "+t.height)}}};x.styles=ce;P([(0,he.redux)({selector:o=>{var e;return(e=o.map)===null||e===void 0?void 0:e.watermark}})],x.prototype,"watermark",void 0);P([(0,A.query)(".ft-watermark")],x.prototype,"svg",void 0);P([(0,A.property)()],x.prototype,"height",void 0);var g=function(o,e,t,r){var s=arguments.length,i=s<3?e:r===null?r=Object.getOwnPropertyDescriptor(e,t):r,l;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")i=Reflect.decorate(o,e,t,r);else for(var a=o.length-1;a>=0;a--)(l=o[a])&&(i=(s<3?l(i):s>3?l(e,t,i):l(e,t))||i);return s>3&&i&&Object.defineProperty(e,t,i),i},p=class extends I{constructor(){super(...arguments),this.renderTopic=()=>E.html`
|
|
81
81
|
<ft-reader-topic-title></ft-reader-topic-title>
|
|
82
82
|
<ft-reader-topic-content></ft-reader-topic-content>
|
|
83
|
-
`,this.disableContextInteractions=!1,this.renderBeforeFirst=5,this.renderAfterLast=10,this.visibleTopicsDebouncer=new
|
|
83
|
+
`,this.disableContextInteractions=!1,this.renderBeforeFirst=5,this.renderAfterLast=10,this.renderedTopicsDebouncer=new u.Debouncer(50),this.visibleTopicsDebouncer=new u.Debouncer(50)}render(){var e,t,r;let s=((e=this.currentPage)===null||e===void 0?void 0:e.topics)||[];return E.html`
|
|
84
84
|
<ft-infinite-scroll class="ft-reader-content"
|
|
85
85
|
.items=${s}
|
|
86
86
|
.renderItem=${(i,l)=>this.renderTopicInContext(i,l)}
|
|
@@ -90,6 +90,7 @@
|
|
|
90
90
|
.renderBeforeFirst=${this.renderBeforeFirst}
|
|
91
91
|
.renderAfterLast=${this.renderAfterLast}
|
|
92
92
|
exportpartsPrefix="scroller"
|
|
93
|
+
@rendered-items-change=${this.renderedTopicChange}
|
|
93
94
|
@visible-items-change=${this.visibleTopicChange}
|
|
94
95
|
@scrolled-to-target=${this.onScrollDone}>
|
|
95
96
|
</ft-infinite-scroll>
|
|
@@ -99,4 +100,4 @@
|
|
|
99
100
|
<ft-reader-topic-context tocId="${e}" ?disableContextInteractions=${this.disableContextInteractions}>
|
|
100
101
|
${this.renderTopic(e,t)}
|
|
101
102
|
</ft-reader-topic-context>
|
|
102
|
-
`}getScrollTarget(){var e,t,r;if(this.disableContextInteractions)return null;let s=(e=this.container)===null||e===void 0?void 0:e.isRendered((t=this.scrollTarget)===null||t===void 0?void 0:t.tocId);return!((r=this.scrollTarget)===null||r===void 0)&&r.tocId&&(!s||this.scrollTarget.section==null)?this.scrollTarget.tocId:null}visibleTopicChange(e){this.disableContextInteractions||this.visibleTopicsDebouncer.run(()=>{var t;return(t=this.stateManager)===null||t===void 0?void 0:t.setVisibleTopics(e.detail.
|
|
103
|
+
`}getScrollTarget(){var e,t,r;if(this.disableContextInteractions)return null;let s=(e=this.container)===null||e===void 0?void 0:e.isRendered((t=this.scrollTarget)===null||t===void 0?void 0:t.tocId);return!((r=this.scrollTarget)===null||r===void 0)&&r.tocId&&(!s||this.scrollTarget.section==null)?this.scrollTarget.tocId:null}renderedTopicChange(e){this.disableContextInteractions||this.renderedTopicsDebouncer.run(()=>{var t;return(t=this.stateManager)===null||t===void 0?void 0:t.setRenderedTopics(e.detail.items)})}visibleTopicChange(e){this.disableContextInteractions||this.visibleTopicsDebouncer.run(()=>{var t;return(t=this.stateManager)===null||t===void 0?void 0:t.setVisibleTopics(e.detail.items)})}onScrollDone(){var e,t;!this.disableContextInteractions&&!(!((e=this.scrollTarget)===null||e===void 0)&&e.section)&&((t=this.stateManager)===null||t===void 0||t.scrollDone())}};p.elementDefinitions={"ft-infinite-scroll":c,"ft-reader-watermark":x};p.styles=re;g([(0,_.property)()],p.prototype,"renderTopic",void 0);g([(0,_.property)({type:Boolean})],p.prototype,"disableContextInteractions",void 0);g([(0,u.redux)()],p.prototype,"currentPage",void 0);g([(0,u.redux)()],p.prototype,"scrollTarget",void 0);g([(0,u.redux)()],p.prototype,"visibleTopics",void 0);g([(0,u.redux)({selector:o=>{var e,t;return(t=(e=o.configuration)===null||e===void 0?void 0:e.loadBeforeFirstVisibleTopic)!==null&&t!==void 0?t:5}})],p.prototype,"renderBeforeFirst",void 0);g([(0,u.redux)({selector:o=>{var e,t;return(t=(e=o.configuration)===null||e===void 0?void 0:e.loadAfterLastVisibleTopic)!==null&&t!==void 0?t:5}})],p.prototype,"renderAfterLast",void 0);g([(0,u.redux)()],p.prototype,"mapId",void 0);g([(0,_.query)(".ft-reader-content")],p.prototype,"container",void 0);(0,pe.customElement)("ft-reader-content")(p);})();
|