@fluid-topics/ft-reader-toc 2.1.18 → 2.1.20

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,4 +1,4 @@
1
- import { I18nMessageContext } from "@fluid-topics/ft-i18n";
1
+ import { I18nMessageContext, } from "@fluid-topics/ft-i18n";
2
2
  export const readerToc = I18nMessageContext.build("designedReaderToc");
3
3
  export const readerTocDefaultMessages = {
4
4
  expand: "Expand {0}",
@@ -4,23 +4,23 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
4
4
  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
5
5
  return c > 3 && r && Object.defineProperty(target, key, r), r;
6
6
  };
7
- import { html, nothing } from "lit";
7
+ import { html, nothing, } from "lit";
8
8
  import { repeat } from "lit/directives/repeat.js";
9
9
  import { classMap } from "lit/directives/class-map.js";
10
10
  import { styleMap } from "lit/directives/style-map.js";
11
11
  import { ifDefined } from "lit/directives/if-defined.js";
12
- import { property, state } from "lit/decorators.js";
13
- import { hasChanged, redux, scrollHelper } from "@fluid-topics/ft-wc-utils";
12
+ import { property, state, } from "lit/decorators.js";
13
+ import { hasChanged, redux, scrollHelper, } from "@fluid-topics/ft-wc-utils";
14
14
  import { FtReaderComponent, } from "@fluid-topics/ft-reader-context/build/registration";
15
15
  import { FtTypography } from "@fluid-topics/ft-typography";
16
16
  import { FtReaderInternalLink } from "@fluid-topics/ft-reader-internal-link";
17
- import { FtIcon, FtIconVariants } from "@fluid-topics/ft-icon";
17
+ import { FtIcon, FtIconVariants, } from "@fluid-topics/ft-icon";
18
18
  import { FtButton } from "@fluid-topics/ft-button";
19
- import { FtSizeCategory, FtSizeWatcher } from "@fluid-topics/ft-size-watcher";
20
- import { FtReaderTocCssVariables, styles } from "./ft-reader-toc.styles";
19
+ import { FtSizeCategory, FtSizeWatcher, } from "@fluid-topics/ft-size-watcher";
20
+ import { FtReaderTocCssVariables, styles, } from "./ft-reader-toc.styles";
21
21
  import { FtSkeleton } from "@fluid-topics/ft-skeleton";
22
22
  import { withI18n } from "@fluid-topics/ft-i18n";
23
- import { readerToc, readerTocDefaultMessages } from "./FtReaderTocMessages";
23
+ import { readerToc, readerTocDefaultMessages, } from "./FtReaderTocMessages";
24
24
  export class FtReaderToc extends withI18n(FtReaderComponent) {
25
25
  get isCurrentPageToc() {
26
26
  return this.scope === "current-page";
@@ -56,7 +56,7 @@ export class FtReaderToc extends withI18n(FtReaderComponent) {
56
56
  var _a, _b, _c;
57
57
  super.update(changedProperties);
58
58
  if (changedProperties.has("toc")) {
59
- this.nodesToExpandExist = ((_a = this.toc) !== null && _a !== void 0 ? _a : []).some(n => n.children.length > 0);
59
+ this.nodesToExpandExist = ((_a = this.toc) !== null && _a !== void 0 ? _a : []).some((n) => n.children.length > 0);
60
60
  }
61
61
  if (changedProperties.has("highlightedTocIds") && !this.expanded) {
62
62
  this.automaticallyExpandedNodes = this.buildAutomaticallyExpandedNodes((_b = this.highlightedTocIds) !== null && _b !== void 0 ? _b : []);
@@ -69,7 +69,7 @@ export class FtReaderToc extends withI18n(FtReaderComponent) {
69
69
  if (this.scrollCurrentTopicIntoView && props.has("highlightedTocIds") && this.highlightedTocIds && ((_a = this.highlightedTocIds) === null || _a === void 0 ? void 0 : _a.length) > 0) {
70
70
  const target = (_b = this.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector(`[tocId="${this.highlightedTocIds[0]}"]`);
71
71
  if (target) {
72
- scrollHelper.scrollIntoViewIfPossible(target, { behavior: "instant", position: .25 });
72
+ scrollHelper.scrollIntoViewIfPossible(target, { behavior: "instant", position: 0.25 });
73
73
  }
74
74
  }
75
75
  }
@@ -83,10 +83,10 @@ export class FtReaderToc extends withI18n(FtReaderComponent) {
83
83
  "ft-reader-toc-expanded": this.expanded,
84
84
  };
85
85
  return html `
86
- <div class=${classMap(classes)}>
86
+ <div class="${classMap(classes)}">
87
87
  <ft-size-watcher @change=${this.onViewportSizeChange}></ft-size-watcher>
88
88
  ${this.renderExpandCollapseAll()}
89
- ${repeat((_a = this.toc) !== null && _a !== void 0 ? _a : [], node => node.tocId, node => this.renderNode(node))}
89
+ ${repeat((_a = this.toc) !== null && _a !== void 0 ? _a : [], (node) => node.tocId, (node) => this.renderNode(node))}
90
90
  </div>
91
91
  `;
92
92
  }
@@ -117,12 +117,12 @@ export class FtReaderToc extends withI18n(FtReaderComponent) {
117
117
  const currentPageDepth = this.isCurrentPageToc ? ((_c = (_b = this.currentPage) === null || _b === void 0 ? void 0 : _b.breadcrumb.length) !== null && _c !== void 0 ? _c : 0) + 1 : 0;
118
118
  const tabNumber = node.depth - 1 - currentPageDepth;
119
119
  const styles = {
120
- "padding-left": `calc( ${FtReaderTocCssVariables.tabulationSize} * ${tabNumber} + 4px)` // +4px for padding before button
120
+ "padding-left": `calc( ${FtReaderTocCssVariables.tabulationSize} * ${tabNumber} + 4px)`, // +4px for padding before button
121
121
  };
122
122
  return html `
123
123
  <div class="ft-reader-toc--node ${isHighlighted ? "ft-reader-toc--node-highlighted" : ""}"
124
124
  aria-current="${ifDefined(isHighlighted ? "true" : undefined)}">
125
- <div class="ft-reader-toc--link-container" data-depth="${node.depth}" style=${styleMap(styles)}>
125
+ <div class="ft-reader-toc--link-container" data-depth="${node.depth}" style="${styleMap(styles)}">
126
126
  ${this.nodesToExpandExist && !this.expanded ? html `
127
127
  <div class="ft-reader-toc--toggle-container">
128
128
  ${canDisplayChildren ? html `
@@ -131,7 +131,7 @@ export class FtReaderToc extends withI18n(FtReaderComponent) {
131
131
  round hideTooltip
132
132
  ?dense=${this.viewportSize !== FtSizeCategory.S}
133
133
  label="${isExpanded ? readerToc.messages.collapse(node.title) : readerToc.messages.expand(node.title)}"
134
- .iconVariant="${this.iconVariant}"
134
+ .iconVariant=${this.iconVariant}
135
135
  icon="${isExpanded
136
136
  ? (this.collapseIcon || "MINUS")
137
137
  : (this.expandIcon || "PLUS")}"
@@ -158,7 +158,7 @@ export class FtReaderToc extends withI18n(FtReaderComponent) {
158
158
  <div id="${node.tocId}-children"
159
159
  class="ft-reader-toc--node-children"
160
160
  ?hidden=${!isExpanded}>
161
- ${repeat(isExpanded ? node.children : [], (child) => child.tocId, child => this.renderNode(child))}
161
+ ${repeat(isExpanded ? node.children : [], (child) => child.tocId, (child) => this.renderNode(child))}
162
162
  </div>
163
163
  ` : nothing}
164
164
  </div>
@@ -166,8 +166,8 @@ export class FtReaderToc extends withI18n(FtReaderComponent) {
166
166
  }
167
167
  buildAutomaticallyExpandedNodes(tocIdsToShow) {
168
168
  var _a, _b;
169
- let topicsToExpand = new Set(this.autoCollapse ? [] : this.automaticallyExpandedNodes);
170
- for (let tocIdToShow of tocIdsToShow) {
169
+ const topicsToExpand = new Set(this.autoCollapse ? [] : this.automaticallyExpandedNodes);
170
+ for (const tocIdToShow of tocIdsToShow) {
171
171
  let tocIdToExpand = tocIdToShow;
172
172
  while (tocIdToExpand && !topicsToExpand.has(tocIdToExpand)) {
173
173
  topicsToExpand.add(tocIdToExpand);
@@ -211,8 +211,8 @@ export class FtReaderToc extends withI18n(FtReaderComponent) {
211
211
  return html `
212
212
  <ft-icon class="ft-reader-toc--leaf-node-icon"
213
213
  part="leaf-node-icon"
214
- .variant="${this.leafNodeIconVariant}"
215
- .value="${this.leafNodeIcon}"></ft-icon>
214
+ .variant=${this.leafNodeIconVariant}
215
+ .value=${this.leafNodeIcon}></ft-icon>
216
216
  `;
217
217
  }
218
218
  }
@@ -222,7 +222,7 @@ FtReaderToc.elementDefinitions = {
222
222
  "ft-reader-internal-link": FtReaderInternalLink,
223
223
  "ft-size-watcher": FtSizeWatcher,
224
224
  "ft-typography": FtTypography,
225
- "ft-skeleton": FtSkeleton
225
+ "ft-skeleton": FtSkeleton,
226
226
  };
227
227
  // language=CSS
228
228
  FtReaderToc.styles = styles;
@@ -288,7 +288,7 @@ __decorate([
288
288
  return ((_a = s.paginationConfiguration) === null || _a === void 0 ? void 0 : _a.splitCurrentPageToc) ? (_b = s.currentPage) === null || _b === void 0 ? void 0 : _b.toc : undefined;
289
289
  }
290
290
  return ((_c = s.paginationConfiguration) === null || _c === void 0 ? void 0 : _c.splitCurrentPageToc) ? s.pagesToc : s.toc;
291
- }
291
+ },
292
292
  })
293
293
  ], FtReaderToc.prototype, "toc", void 0);
294
294
  __decorate([
@@ -301,7 +301,7 @@ __decorate([
301
301
  return ((_a = s.paginationConfiguration) === null || _a === void 0 ? void 0 : _a.splitCurrentPageToc) && !self.isCurrentPageToc
302
302
  ? (((_b = s.currentPage) === null || _b === void 0 ? void 0 : _b.rootTocId) ? [s.currentPage.rootTocId] : [])
303
303
  : s.visibleTopics;
304
- }
304
+ },
305
305
  })
306
306
  ], FtReaderToc.prototype, "highlightedTocIds", void 0);
307
307
  __decorate([