@fluid-topics/ft-reader-navigation-button 0.3.17 → 0.3.18

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,6 +1,11 @@
1
1
  import { css } from "lit";
2
+ import { setVariable } from "@fluid-topics/ft-wc-utils";
3
+ import { FtReaderInternalLinkCssVariables } from "@fluid-topics/ft-reader-internal-link/build/ft-reader-internal-link.css";
2
4
  export const FtReaderNavigationButtonCssVariables = {};
3
5
  // language=CSS
4
6
  export const styles = css `
7
+ ft-reader-internal-link {
8
+ ${setVariable(FtReaderInternalLinkCssVariables.outlineColor, "transparent")}
9
+ }
5
10
  `;
6
11
  //# sourceMappingURL=ft-reader-navigation-button.css.js.map
@@ -14,7 +14,7 @@ export declare class FtReaderNavigationButton extends FtReaderComponent implemen
14
14
  iconVariant?: FtIconVariants;
15
15
  icon?: string;
16
16
  trailingIcon: boolean;
17
- keepVisible: boolean;
17
+ editorMode: boolean;
18
18
  private currentPage?;
19
19
  private targetPage?;
20
20
  get isReady(): boolean;
@@ -20,7 +20,7 @@ export class FtReaderNavigationButton extends FtReaderComponent {
20
20
  this.hideTooltip = false;
21
21
  this.iconVariant = FtIconVariants.fluid_topics;
22
22
  this.trailingIcon = false;
23
- this.keepVisible = false;
23
+ this.editorMode = false;
24
24
  }
25
25
  get isReady() {
26
26
  return this.currentPage != null;
@@ -33,20 +33,23 @@ export class FtReaderNavigationButton extends FtReaderComponent {
33
33
  }
34
34
  render() {
35
35
  var _a, _b, _c, _d, _e;
36
- if (this.targetPage == null && !this.keepVisible) {
36
+ if (this.targetPage == null && !this.editorMode) {
37
37
  return nothing;
38
38
  }
39
- return html `
40
- <ft-reader-internal-link .tocId=${(_a = this.targetPage) === null || _a === void 0 ? void 0 : _a.rootTocId}>
41
- <ft-button ?forceTooltip=${!this.hideTooltip}
42
- ?hideTooltip=${this.hideTooltip}
43
- ?trailingIcon=${this.trailingIcon}
44
- .label=${(_c = (_b = this.targetPage) === null || _b === void 0 ? void 0 : _b.title) !== null && _c !== void 0 ? _c : ""}
45
- .tooltipPosition=${this.tooltipPosition}
46
- .iconVariant=${this.iconVariant}
47
- .icon=${(_d = this.icon) !== null && _d !== void 0 ? _d : this.defaultIcon}>
48
- ${(_e = this.content) !== null && _e !== void 0 ? _e : this.defaultContent}
49
- </ft-button>
39
+ const button = html `
40
+ <ft-button ?forceTooltip=${!this.hideTooltip}
41
+ ?hideTooltip=${this.hideTooltip}
42
+ ?trailingIcon=${this.trailingIcon}
43
+ .label=${(_b = (_a = this.targetPage) === null || _a === void 0 ? void 0 : _a.title) !== null && _b !== void 0 ? _b : ""}
44
+ .tooltipPosition=${this.tooltipPosition}
45
+ .iconVariant=${this.iconVariant}
46
+ .icon=${(_c = this.icon) !== null && _c !== void 0 ? _c : this.defaultIcon}>
47
+ ${(_d = this.content) !== null && _d !== void 0 ? _d : this.defaultContent}
48
+ </ft-button>
49
+ `;
50
+ return this.editorMode ? button : html `
51
+ <ft-reader-internal-link .tocId=${(_e = this.targetPage) === null || _e === void 0 ? void 0 : _e.rootTocId} removestyle>
52
+ ${button}
50
53
  </ft-reader-internal-link>
51
54
  `;
52
55
  }
@@ -100,7 +103,7 @@ __decorate([
100
103
  ], FtReaderNavigationButton.prototype, "trailingIcon", void 0);
101
104
  __decorate([
102
105
  property({ type: Boolean, attribute: false })
103
- ], FtReaderNavigationButton.prototype, "keepVisible", void 0);
106
+ ], FtReaderNavigationButton.prototype, "editorMode", void 0);
104
107
  __decorate([
105
108
  redux()
106
109
  ], FtReaderNavigationButton.prototype, "currentPage", void 0);