@salesforcedevs/docs-components 1.3.221 → 1.3.227-docheader2-alpha
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.
- package/package.json +2 -2
- package/src/modules/doc/amfReference/amfReference.html +3 -0
- package/src/modules/doc/amfReference/amfReference.ts +39 -7
- package/src/modules/doc/contentLayout/contentLayout.css +6 -1
- package/src/modules/doc/contentLayout/contentLayout.html +11 -0
- package/src/modules/doc/contentLayout/contentLayout.ts +5 -0
- package/src/modules/doc/header/header.css +32 -39
- package/src/modules/doc/header/header.html +2 -53
- package/src/modules/doc/header/header.ts +1 -92
- package/src/modules/doc/xmlContent/types.ts +5 -2
- package/src/modules/doc/xmlContent/xmlContent.html +4 -0
- package/src/modules/doc/xmlContent/xmlContent.ts +22 -39
- package/LICENSE +0 -12
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@salesforcedevs/docs-components",
|
|
3
|
-
"version": "1.3.
|
|
3
|
+
"version": "1.3.227-docheader2-alpha",
|
|
4
4
|
"description": "Docs Lightning web components for DSC",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"main": "index.js",
|
|
@@ -24,5 +24,5 @@
|
|
|
24
24
|
"@types/lodash.orderby": "^4.6.7",
|
|
25
25
|
"@types/lodash.uniqby": "^4.7.7"
|
|
26
26
|
},
|
|
27
|
-
"gitHead": "
|
|
27
|
+
"gitHead": "4629fdd9ca18a13480044ad43515b91945d16aad"
|
|
28
28
|
}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
<template>
|
|
2
2
|
<doc-content-layout
|
|
3
|
+
if:true={isVersionFetched}
|
|
3
4
|
use-old-sidebar={useOldSidebar}
|
|
4
5
|
class="content-type content-type-reference"
|
|
5
6
|
coveo-organization-id={coveoOrganizationId}
|
|
@@ -16,6 +17,8 @@
|
|
|
16
17
|
toc-title={tocTitle}
|
|
17
18
|
toc-options={tocOptions}
|
|
18
19
|
enable-slot-change="true"
|
|
20
|
+
languages={languages}
|
|
21
|
+
language={language}
|
|
19
22
|
>
|
|
20
23
|
<doc-phase
|
|
21
24
|
slot="doc-phase"
|
|
@@ -3,7 +3,8 @@ import { noCase } from "no-case";
|
|
|
3
3
|
import { sentenceCase } from "sentence-case";
|
|
4
4
|
import qs from "query-string";
|
|
5
5
|
import { AmfModelParser } from "doc/amfModelParser";
|
|
6
|
-
import { normalizeBoolean } from "dxUtils/normalizers";
|
|
6
|
+
import { normalizeBoolean, toJson } from "dxUtils/normalizers";
|
|
7
|
+
import type { OptionWithLink } from "typings/custom";
|
|
7
8
|
import type {
|
|
8
9
|
AmfConfig,
|
|
9
10
|
AmfMetadataTopic,
|
|
@@ -43,14 +44,16 @@ export default class AmfReference extends LightningElement {
|
|
|
43
44
|
@api coveoOrganizationId!: string;
|
|
44
45
|
@api coveoPublicAccessToken!: string;
|
|
45
46
|
@api coveoAnalyticsToken!: string;
|
|
46
|
-
@api coveoAdvancedQueryConfig!: string;
|
|
47
47
|
@api coveoSearchHub!: string;
|
|
48
48
|
@api useOldSidebar: boolean = false;
|
|
49
49
|
@api tocTitle?: string;
|
|
50
50
|
@api tocOptions?: string;
|
|
51
|
+
@api languages!: OptionWithLink[];
|
|
52
|
+
@api language!: string;
|
|
51
53
|
@track navigation = [] as NavigationItem[];
|
|
52
54
|
@track versions: Array<ReferenceVersion> = [];
|
|
53
55
|
@track showVersionBanner = false;
|
|
56
|
+
@track _coveoAdvancedQueryConfig!: { [key: string]: any };
|
|
54
57
|
|
|
55
58
|
// Update this to update what component gets rendered in the content block
|
|
56
59
|
@track
|
|
@@ -114,12 +117,14 @@ export default class AmfReference extends LightningElement {
|
|
|
114
117
|
this.versions = this.getVersions();
|
|
115
118
|
}
|
|
116
119
|
this.selectedVersion = selectedVersion;
|
|
117
|
-
if (
|
|
118
|
-
this.
|
|
119
|
-
this.oldVersionInfo
|
|
120
|
-
|
|
121
|
-
|
|
120
|
+
if (this.isSpecBasedReference(this._currentReferenceId)) {
|
|
121
|
+
this.isVersionFetched = true;
|
|
122
|
+
if (this.oldVersionInfo) {
|
|
123
|
+
this.showVersionBanner = true;
|
|
124
|
+
}
|
|
122
125
|
}
|
|
126
|
+
} else {
|
|
127
|
+
this.isVersionFetched = true;
|
|
123
128
|
}
|
|
124
129
|
|
|
125
130
|
// This is to check if the url is hash based and redirect if needed
|
|
@@ -152,6 +157,31 @@ export default class AmfReference extends LightningElement {
|
|
|
152
157
|
this._expandChildren = normalizeBoolean(value);
|
|
153
158
|
}
|
|
154
159
|
|
|
160
|
+
/*
|
|
161
|
+
* The get coveoAdvancedQueryConfig() method returns this._coveoAdvancedQueryConfig,
|
|
162
|
+
* but before returning it, it checks if there are multiple versions (this.versions.length > 1)
|
|
163
|
+
* and if a version is selected (this.selectedVersion). If both conditions are met,
|
|
164
|
+
* it updates the version property of this._coveoAdvancedQueryConfig with the selected version.
|
|
165
|
+
*/
|
|
166
|
+
@api
|
|
167
|
+
get coveoAdvancedQueryConfig(): { [key: string]: any } {
|
|
168
|
+
const coveoConfig = this._coveoAdvancedQueryConfig;
|
|
169
|
+
if (this.versions.length > 1 && this.selectedVersion) {
|
|
170
|
+
const currentGAVersionRef = this.versions[0];
|
|
171
|
+
if (this.selectedVersion.id !== currentGAVersionRef.id) {
|
|
172
|
+
// Currently Coveo only supports query without "v"
|
|
173
|
+
const version = this.selectedVersion.id.replace("v", "");
|
|
174
|
+
coveoConfig.version = version;
|
|
175
|
+
this._coveoAdvancedQueryConfig = coveoConfig;
|
|
176
|
+
}
|
|
177
|
+
}
|
|
178
|
+
return this._coveoAdvancedQueryConfig;
|
|
179
|
+
}
|
|
180
|
+
|
|
181
|
+
set coveoAdvancedQueryConfig(config) {
|
|
182
|
+
this._coveoAdvancedQueryConfig = toJson(config);
|
|
183
|
+
}
|
|
184
|
+
|
|
155
185
|
// model
|
|
156
186
|
protected _amfConfigList: AmfConfig[] = [];
|
|
157
187
|
protected _amfConfigMap: Map<string, AmfConfig> = new Map();
|
|
@@ -172,6 +202,7 @@ export default class AmfReference extends LightningElement {
|
|
|
172
202
|
private isParentLevelDocPhaseEnabled = false;
|
|
173
203
|
private selectedReferenceDocPhase?: string | null = null;
|
|
174
204
|
private _expandChildren?: boolean = false;
|
|
205
|
+
private isVersionFetched = false;
|
|
175
206
|
|
|
176
207
|
/**
|
|
177
208
|
* Key for storing the currently selected reference url. This will be used to save the
|
|
@@ -1284,6 +1315,7 @@ export default class AmfReference extends LightningElement {
|
|
|
1284
1315
|
this.showVersionBanner = true;
|
|
1285
1316
|
}
|
|
1286
1317
|
|
|
1318
|
+
this.isVersionFetched = true;
|
|
1287
1319
|
this.updateDocPhase();
|
|
1288
1320
|
this.selectedSidebarValue = window.location.pathname;
|
|
1289
1321
|
}
|
|
@@ -61,12 +61,16 @@ dx-toc {
|
|
|
61
61
|
flex-direction: row;
|
|
62
62
|
justify-content: center;
|
|
63
63
|
max-width: var(--dx-g-doc-content-max-width);
|
|
64
|
+
|
|
65
|
+
/* Derived this manually by substracting (topHeader, doc header, banner and the content). */
|
|
66
|
+
min-height: 62vh;
|
|
64
67
|
margin: auto;
|
|
65
68
|
padding: 0 var(--dx-g-global-header-padding-horizontal);
|
|
69
|
+
margin-bottom: calc(2 * (var(--dx-g-spacing-5xl) + 4px));
|
|
66
70
|
}
|
|
67
71
|
|
|
68
72
|
.content-body {
|
|
69
|
-
margin: var(--dx-g-spacing-sm) 0
|
|
73
|
+
margin: var(--dx-g-spacing-sm) 0 0;
|
|
70
74
|
max-width: 900px;
|
|
71
75
|
flex: 1;
|
|
72
76
|
width: 0;
|
|
@@ -106,6 +110,7 @@ dx-toc {
|
|
|
106
110
|
.content-body-container {
|
|
107
111
|
padding-right: 0;
|
|
108
112
|
overflow-x: auto;
|
|
113
|
+
margin-bottom: calc(var(--dx-g-spacing-5xl) + 4px);
|
|
109
114
|
}
|
|
110
115
|
|
|
111
116
|
.left-nav-bar {
|
|
@@ -7,6 +7,10 @@
|
|
|
7
7
|
value={sidebarValue}
|
|
8
8
|
header={sidebarHeader}
|
|
9
9
|
ontogglesidebar={onToggleSidebar}
|
|
10
|
+
languages={languages}
|
|
11
|
+
language={language}
|
|
12
|
+
bail-href={bailHref}
|
|
13
|
+
bail-label={bailLabel}
|
|
10
14
|
>
|
|
11
15
|
<slot name="sidebar-header" slot="header"></slot>
|
|
12
16
|
</dx-sidebar-old>
|
|
@@ -22,6 +26,10 @@
|
|
|
22
26
|
coveo-search-hub={coveoSearchHub}
|
|
23
27
|
coveo-advanced-query-config={coveoAdvancedQueryConfig}
|
|
24
28
|
ontogglesidebar={onToggleSidebar}
|
|
29
|
+
languages={languages}
|
|
30
|
+
language={language}
|
|
31
|
+
bail-href={bailHref}
|
|
32
|
+
bail-label={bailLabel}
|
|
25
33
|
>
|
|
26
34
|
<slot name="sidebar-header" slot="header"></slot>
|
|
27
35
|
</dx-sidebar>
|
|
@@ -48,6 +56,9 @@
|
|
|
48
56
|
></dx-toc>
|
|
49
57
|
</div>
|
|
50
58
|
</div>
|
|
59
|
+
<div class="footer-container">
|
|
60
|
+
<dx-footer variant="no-signup"></dx-footer>
|
|
61
|
+
</div>
|
|
51
62
|
</div>
|
|
52
63
|
</div>
|
|
53
64
|
</template>
|
|
@@ -4,6 +4,7 @@ import { closest } from "kagekiri";
|
|
|
4
4
|
import { toJson } from "dxUtils/normalizers";
|
|
5
5
|
import { highlightTerms } from "dxUtils/highlight";
|
|
6
6
|
import { SearchSyncer } from "docUtils/searchSyncer";
|
|
7
|
+
import type { OptionWithLink } from "typings/custom";
|
|
7
8
|
|
|
8
9
|
type AnchorMap = { [key: string]: { intersect: boolean; id: string } };
|
|
9
10
|
|
|
@@ -36,6 +37,10 @@ export default class ContentLayout extends LightningElement {
|
|
|
36
37
|
@api coveoSearchHub!: string;
|
|
37
38
|
@api coveoAdvancedQueryConfig!: string;
|
|
38
39
|
@api useOldSidebar?: boolean = false;
|
|
40
|
+
@api languages!: OptionWithLink[];
|
|
41
|
+
@api language!: string;
|
|
42
|
+
@api bailHref!: string;
|
|
43
|
+
@api bailLabel!: string;
|
|
39
44
|
|
|
40
45
|
@api
|
|
41
46
|
get breadcrumbs() {
|
|
@@ -16,44 +16,32 @@ dx-logo {
|
|
|
16
16
|
);
|
|
17
17
|
}
|
|
18
18
|
|
|
19
|
+
.has-brand.has-scoped-nav-items {
|
|
20
|
+
border-bottom: 1px solid var(--dx-g-gray-90);
|
|
21
|
+
border-top: 1px solid var(--dx-g-gray-90);
|
|
22
|
+
}
|
|
23
|
+
|
|
19
24
|
.nav_menu-ctas {
|
|
20
25
|
margin-right: var(--dx-g-spacing-sm);
|
|
21
26
|
}
|
|
22
27
|
|
|
23
28
|
header:not(.has-brand) > .header_l1 {
|
|
24
|
-
background:
|
|
29
|
+
background: white;
|
|
30
|
+
border-bottom: 1px solid var(--dx-g-gray-90);
|
|
25
31
|
}
|
|
26
32
|
|
|
27
33
|
header:not(.has-brand) > .header_l2 {
|
|
28
|
-
|
|
34
|
+
border-bottom: 1px solid var(--dx-g-gray-90);
|
|
35
|
+
border-top: 1px solid var(--dx-g-gray-90);
|
|
29
36
|
}
|
|
30
37
|
|
|
31
38
|
.header_l2_group.header_l2_group-right-ctas {
|
|
32
39
|
align-items: baseline;
|
|
33
40
|
}
|
|
34
41
|
|
|
35
|
-
.
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
margin-left: var(--dx-g-spacing-sm);
|
|
39
|
-
}
|
|
40
|
-
|
|
41
|
-
.header_lang-dropdown {
|
|
42
|
-
--button-primary-color: var(--dx-g-blue-vibrant-40);
|
|
43
|
-
--button-primary-color-hover: var(--dx-g-blue-vibrant-30);
|
|
44
|
-
}
|
|
45
|
-
|
|
46
|
-
.header_lang-dropdown > dx-button {
|
|
47
|
-
--dx-c-button-primary-color: var(--button-primary-color);
|
|
48
|
-
--dx-c-button-primary-color-hover: var(--button-primary-color-hover);
|
|
49
|
-
--dx-c-slot-empty-width: min-content;
|
|
50
|
-
--border-color: var(--button-primary-color);
|
|
51
|
-
|
|
52
|
-
border-bottom: 1px dashed var(--border-color);
|
|
53
|
-
}
|
|
54
|
-
|
|
55
|
-
.header_lang-dropdown > dx-button:hover {
|
|
56
|
-
--border-color: var(--button-primary-color-hover);
|
|
42
|
+
.has-brand .header_l2_group-title {
|
|
43
|
+
padding: 12px 32px 11px 0;
|
|
44
|
+
min-width: 320px;
|
|
57
45
|
}
|
|
58
46
|
|
|
59
47
|
@media (max-width: 768px) {
|
|
@@ -71,37 +59,42 @@ header:not(.has-brand) > .header_l2 {
|
|
|
71
59
|
width: 100%;
|
|
72
60
|
}
|
|
73
61
|
|
|
62
|
+
.header_l2_group-title {
|
|
63
|
+
margin-right: 0;
|
|
64
|
+
padding: var(--dx-g-spacing-sm) 0 2px
|
|
65
|
+
var(--dx-g-global-header-padding-horizontal);
|
|
66
|
+
min-height: 41px;
|
|
67
|
+
}
|
|
68
|
+
|
|
74
69
|
.header_l2_group-nav {
|
|
75
70
|
height: var(--dx-g-spacing-3xl);
|
|
76
71
|
padding: 0;
|
|
77
|
-
|
|
72
|
+
margin-top: 3px;
|
|
78
73
|
}
|
|
79
74
|
|
|
80
75
|
.header_l2_group-nav_overflow {
|
|
81
|
-
height:
|
|
76
|
+
height: var(--dx-g-spacing-3xl);
|
|
82
77
|
margin-right: var(--dx-g-spacing-sm);
|
|
83
78
|
}
|
|
84
79
|
|
|
85
|
-
.
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
var(--dx-g-global-header-padding-horizontal);
|
|
89
|
-
min-height: var(--dx-g-doc-header-main-nav-height);
|
|
90
|
-
}
|
|
91
|
-
|
|
92
|
-
.header_l2_group-title .header_lang-dropdown {
|
|
93
|
-
margin-left: auto;
|
|
80
|
+
.subtitle {
|
|
81
|
+
font-weight: var(--dx-g-font-demi);
|
|
82
|
+
letter-spacing: -0.08px;
|
|
94
83
|
}
|
|
95
84
|
|
|
96
|
-
.
|
|
97
|
-
|
|
85
|
+
.has-brand .header_l2_group-title {
|
|
86
|
+
margin-right: 0;
|
|
87
|
+
padding: var(--dx-g-spacing-sm) 0 2px
|
|
88
|
+
var(--dx-g-global-header-padding-horizontal);
|
|
89
|
+
min-height: 41px;
|
|
98
90
|
}
|
|
99
91
|
|
|
100
92
|
.has-scoped-nav-items > .header_l2 {
|
|
101
93
|
height: unset;
|
|
102
94
|
}
|
|
103
95
|
|
|
104
|
-
.has-
|
|
105
|
-
|
|
96
|
+
header:not(.has-brand) > .header_l2 {
|
|
97
|
+
padding-bottom: 0;
|
|
98
|
+
border: 0;
|
|
106
99
|
}
|
|
107
100
|
}
|
|
@@ -14,28 +14,12 @@
|
|
|
14
14
|
if:true={isValidBrand}
|
|
15
15
|
sprite="salesforcebrand"
|
|
16
16
|
symbol={brand}
|
|
17
|
-
size="
|
|
17
|
+
size="large"
|
|
18
18
|
></dx-icon>
|
|
19
|
-
<span class="subtitle dx-text-display-
|
|
19
|
+
<span class="subtitle dx-text-display-7">
|
|
20
20
|
{subtitle}
|
|
21
21
|
</span>
|
|
22
22
|
</a>
|
|
23
|
-
<dx-dropdown
|
|
24
|
-
if:true={showMobileLanguages}
|
|
25
|
-
class="header_lang-dropdown"
|
|
26
|
-
options={languages}
|
|
27
|
-
small
|
|
28
|
-
value={language}
|
|
29
|
-
value-path={langValuePath}
|
|
30
|
-
onchange={onLangChange}
|
|
31
|
-
>
|
|
32
|
-
<dx-button
|
|
33
|
-
aria-label="Select Language"
|
|
34
|
-
variant="inline"
|
|
35
|
-
icon-size="large"
|
|
36
|
-
icon-symbol="world"
|
|
37
|
-
></dx-button>
|
|
38
|
-
</dx-dropdown>
|
|
39
23
|
</div>
|
|
40
24
|
<div
|
|
41
25
|
if:true={hasScopedNavItems}
|
|
@@ -52,41 +36,6 @@
|
|
|
52
36
|
></dx-header-nav>
|
|
53
37
|
</div>
|
|
54
38
|
</div>
|
|
55
|
-
<div
|
|
56
|
-
if:false={smallMobile}
|
|
57
|
-
class="header_l2_group header_l2_group-right-ctas"
|
|
58
|
-
>
|
|
59
|
-
<dx-dropdown
|
|
60
|
-
if:true={hasLanguages}
|
|
61
|
-
class="header_lang-dropdown"
|
|
62
|
-
options={languages}
|
|
63
|
-
small
|
|
64
|
-
value-path={langValuePath}
|
|
65
|
-
value={language}
|
|
66
|
-
onchange={onLangChange}
|
|
67
|
-
>
|
|
68
|
-
<dx-button
|
|
69
|
-
aria-label="Select Language"
|
|
70
|
-
variant="inline"
|
|
71
|
-
icon-size="small"
|
|
72
|
-
icon-symbol="world"
|
|
73
|
-
>
|
|
74
|
-
{languageLabel}
|
|
75
|
-
</dx-button>
|
|
76
|
-
</dx-dropdown>
|
|
77
|
-
<dx-button
|
|
78
|
-
if:true={hasBailLink}
|
|
79
|
-
aria-label={bailLabel}
|
|
80
|
-
class="header_bail-link"
|
|
81
|
-
href={bailHref}
|
|
82
|
-
onclick={handleBailClick}
|
|
83
|
-
variant="tertiary"
|
|
84
|
-
icon-symbol="new_window"
|
|
85
|
-
target="_blank"
|
|
86
|
-
>
|
|
87
|
-
{bailLabel}
|
|
88
|
-
</dx-button>
|
|
89
|
-
</div>
|
|
90
39
|
</div>
|
|
91
40
|
</header>
|
|
92
41
|
</dx-brand-theme-provider>
|
|
@@ -1,14 +1,11 @@
|
|
|
1
1
|
import { api } from "lwc";
|
|
2
2
|
import cx from "classnames";
|
|
3
|
-
import type { OptionWithNested
|
|
3
|
+
import type { OptionWithNested } from "typings/custom";
|
|
4
4
|
import { HeaderBase } from "dxBaseElements/headerBase";
|
|
5
5
|
import { toJson } from "dxUtils/normalizers";
|
|
6
|
-
import get from "lodash.get";
|
|
7
|
-
import { track } from "dxUtils/analytics";
|
|
8
6
|
|
|
9
7
|
const TABLET_MATCH = "980px";
|
|
10
8
|
const MOBILE_MATCH = "880px";
|
|
11
|
-
const SMALL_MOBILE_MATCH = "768px";
|
|
12
9
|
|
|
13
10
|
export default class Header extends HeaderBase {
|
|
14
11
|
@api langValuePath: string = "id"; // allows to override how language property is interpreted, follows valuePath dropdown api.
|
|
@@ -23,31 +20,7 @@ export default class Header extends HeaderBase {
|
|
|
23
20
|
this._scopedNavItems = toJson(value);
|
|
24
21
|
}
|
|
25
22
|
|
|
26
|
-
@api
|
|
27
|
-
get languages() {
|
|
28
|
-
return this._languages;
|
|
29
|
-
}
|
|
30
|
-
|
|
31
|
-
set languages(value) {
|
|
32
|
-
this._languages = toJson(value);
|
|
33
|
-
}
|
|
34
|
-
|
|
35
|
-
@api
|
|
36
|
-
get language() {
|
|
37
|
-
return this._language;
|
|
38
|
-
}
|
|
39
|
-
|
|
40
|
-
set language(value) {
|
|
41
|
-
if (this._language !== value) {
|
|
42
|
-
this._language = value;
|
|
43
|
-
}
|
|
44
|
-
}
|
|
45
|
-
|
|
46
|
-
private _language: string | null = null;
|
|
47
|
-
private _languages!: OptionWithLink[];
|
|
48
23
|
private _scopedNavItems!: OptionWithNested[];
|
|
49
|
-
private smallMobile = false;
|
|
50
|
-
private smallMobileMatchMedia!: MediaQueryList;
|
|
51
24
|
private tablet = false;
|
|
52
25
|
private tabletMatchMedia!: MediaQueryList;
|
|
53
26
|
private shouldRender = false;
|
|
@@ -60,24 +33,6 @@ export default class Header extends HeaderBase {
|
|
|
60
33
|
return this.scopedNavItems && this.scopedNavItems.length > 0;
|
|
61
34
|
}
|
|
62
35
|
|
|
63
|
-
private get hasLanguages(): boolean {
|
|
64
|
-
return !!(this.languages && this.languages.length);
|
|
65
|
-
}
|
|
66
|
-
|
|
67
|
-
private get showMobileLanguages(): boolean {
|
|
68
|
-
return this.smallMobile && this.hasLanguages;
|
|
69
|
-
}
|
|
70
|
-
|
|
71
|
-
private get languageLabel(): string {
|
|
72
|
-
return (
|
|
73
|
-
(this.language &&
|
|
74
|
-
this.languages.find(
|
|
75
|
-
(lang) => get(lang, this.langValuePath) === this.language
|
|
76
|
-
)?.label) ||
|
|
77
|
-
this.languages[0].label
|
|
78
|
-
);
|
|
79
|
-
}
|
|
80
|
-
|
|
81
36
|
connectedCallback(): void {
|
|
82
37
|
super.connectedCallback();
|
|
83
38
|
this.tabletMatchMedia = window.matchMedia(
|
|
@@ -86,14 +41,6 @@ export default class Header extends HeaderBase {
|
|
|
86
41
|
this.onTabletChange(this.tabletMatchMedia);
|
|
87
42
|
this.tabletMatchMedia.addEventListener("change", this.onTabletChange);
|
|
88
43
|
|
|
89
|
-
this.smallMobileMatchMedia = window.matchMedia(
|
|
90
|
-
`(max-width: ${SMALL_MOBILE_MATCH})`
|
|
91
|
-
);
|
|
92
|
-
this.onSmallMobileChange(this.smallMobileMatchMedia);
|
|
93
|
-
this.smallMobileMatchMedia.addEventListener(
|
|
94
|
-
"change",
|
|
95
|
-
this.onSmallMobileChange
|
|
96
|
-
);
|
|
97
44
|
if (
|
|
98
45
|
(window.location.pathname.includes("/docs/") &&
|
|
99
46
|
window.location.pathname !== "/docs/apis") ||
|
|
@@ -112,53 +59,15 @@ export default class Header extends HeaderBase {
|
|
|
112
59
|
"change",
|
|
113
60
|
this.onTabletChange
|
|
114
61
|
);
|
|
115
|
-
|
|
116
|
-
this.smallMobileMatchMedia.removeEventListener(
|
|
117
|
-
"change",
|
|
118
|
-
this.onSmallMobileChange
|
|
119
|
-
);
|
|
120
62
|
}
|
|
121
63
|
|
|
122
64
|
private onTabletChange = (e: MediaQueryListEvent | MediaQueryList) =>
|
|
123
65
|
(this.tablet = e.matches);
|
|
124
66
|
|
|
125
|
-
private onSmallMobileChange = (e: MediaQueryListEvent | MediaQueryList) =>
|
|
126
|
-
(this.smallMobile = e.matches);
|
|
127
|
-
|
|
128
67
|
protected additionalClasses(): string {
|
|
129
68
|
return cx(
|
|
130
69
|
this.brand && "has-brand",
|
|
131
70
|
this.hasScopedNavItems && "has-scoped-nav-items"
|
|
132
71
|
);
|
|
133
72
|
}
|
|
134
|
-
|
|
135
|
-
private onLangChange(event: CustomEvent<string>): void {
|
|
136
|
-
const { detail } = event;
|
|
137
|
-
this._language = detail;
|
|
138
|
-
|
|
139
|
-
this.dispatchEvent(new CustomEvent("langchange", { detail }));
|
|
140
|
-
}
|
|
141
|
-
|
|
142
|
-
private handleBailClick(event: Event) {
|
|
143
|
-
const payload = {
|
|
144
|
-
click_text: "pdf",
|
|
145
|
-
click_url: this.bailHref,
|
|
146
|
-
element_title: "pdf",
|
|
147
|
-
element_type: "link",
|
|
148
|
-
content_category: "download"
|
|
149
|
-
};
|
|
150
|
-
track(event.target!, "custEv_pdfDownload", {
|
|
151
|
-
...payload,
|
|
152
|
-
file_name: this.getFilename(this.bailHref!),
|
|
153
|
-
file_extension: "pdf"
|
|
154
|
-
});
|
|
155
|
-
|
|
156
|
-
track(event.target!, "custEv_linkClick", {
|
|
157
|
-
...payload
|
|
158
|
-
});
|
|
159
|
-
}
|
|
160
|
-
|
|
161
|
-
private getFilename = function (path: string) {
|
|
162
|
-
return path.substring(path.lastIndexOf("/") + 1);
|
|
163
|
-
};
|
|
164
73
|
}
|
|
@@ -61,12 +61,15 @@ export type ApiDocLanguage = {
|
|
|
61
61
|
|
|
62
62
|
export interface Header extends Element {
|
|
63
63
|
subtitle: string;
|
|
64
|
+
headerHref: string;
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
export type SiderbarFooter = {
|
|
64
68
|
bailHref: string;
|
|
65
69
|
bailLabel: string;
|
|
66
70
|
languages: Array<DocLanguage>;
|
|
67
71
|
language?: string;
|
|
68
|
-
|
|
69
|
-
}
|
|
72
|
+
};
|
|
70
73
|
|
|
71
74
|
export type ApiNavItem = {
|
|
72
75
|
children: Array<ApiNavItem>;
|
|
@@ -11,6 +11,10 @@
|
|
|
11
11
|
sidebar-value={sidebarValue}
|
|
12
12
|
onselect={handleSelect}
|
|
13
13
|
use-old-sidebar={useOldSidebar}
|
|
14
|
+
languages={sidebarFooterContent.languages}
|
|
15
|
+
language={sidebarFooterContent.language}
|
|
16
|
+
bail-href={sidebarFooterContent.bailHref}
|
|
17
|
+
bail-label={sidebarFooterContent.bailLabel}
|
|
14
18
|
>
|
|
15
19
|
<doc-phase
|
|
16
20
|
slot="version-banner"
|
|
@@ -8,6 +8,7 @@ import {
|
|
|
8
8
|
DocVersion,
|
|
9
9
|
TreeNode,
|
|
10
10
|
Header,
|
|
11
|
+
SiderbarFooter,
|
|
11
12
|
HistoryState,
|
|
12
13
|
PageReference,
|
|
13
14
|
TocMap
|
|
@@ -26,6 +27,12 @@ const PIXEL_PER_CHARACTER_MAP: { [key: string]: number } = {
|
|
|
26
27
|
"ja-jp": 12.5
|
|
27
28
|
};
|
|
28
29
|
|
|
30
|
+
const defaultSidebarFooter: SiderbarFooter = {
|
|
31
|
+
bailHref: "",
|
|
32
|
+
bailLabel: "",
|
|
33
|
+
languages: [],
|
|
34
|
+
language: ""
|
|
35
|
+
};
|
|
29
36
|
export default class DocXmlContent extends LightningElementWithState<{
|
|
30
37
|
isFetchingDocument: boolean;
|
|
31
38
|
isFetchingContent: boolean;
|
|
@@ -64,15 +71,16 @@ export default class DocXmlContent extends LightningElementWithState<{
|
|
|
64
71
|
private docContent = "";
|
|
65
72
|
private language?: DocLanguage | null = null;
|
|
66
73
|
private loaded = false;
|
|
74
|
+
private _pageHeader?: Header;
|
|
67
75
|
private pdfUrl = "";
|
|
68
76
|
private tocMap: TocMap = {};
|
|
69
77
|
private sidebarContent: Array<TreeNode> | null = null;
|
|
70
78
|
private version: DocVersion | null = null;
|
|
71
79
|
private docTitle = "";
|
|
72
80
|
private _pathName = "";
|
|
73
|
-
private _pageHeader?: Header;
|
|
74
81
|
private listenerAttached = false;
|
|
75
82
|
private _enableCoveo?: boolean = false;
|
|
83
|
+
private sidebarFooterContent: SiderbarFooter = { ...defaultSidebarFooter };
|
|
76
84
|
|
|
77
85
|
private searchSyncer = new SearchSyncer({
|
|
78
86
|
callbacks: {
|
|
@@ -214,13 +222,6 @@ export default class DocXmlContent extends LightningElementWithState<{
|
|
|
214
222
|
disconnectedCallback(): void {
|
|
215
223
|
window.removeEventListener("popstate", this.handlePopState);
|
|
216
224
|
this.searchSyncer.dispose();
|
|
217
|
-
if (this.listenerAttached) {
|
|
218
|
-
this.pageHeader.removeEventListener(
|
|
219
|
-
"langchange",
|
|
220
|
-
this.handleLanguageChange
|
|
221
|
-
);
|
|
222
|
-
this.listenerAttached = false;
|
|
223
|
-
}
|
|
224
225
|
}
|
|
225
226
|
|
|
226
227
|
private get languageId(): string | undefined {
|
|
@@ -414,12 +415,8 @@ export default class DocXmlContent extends LightningElementWithState<{
|
|
|
414
415
|
}
|
|
415
416
|
|
|
416
417
|
getReferenceFromUrl(): PageReference {
|
|
417
|
-
const [
|
|
418
|
-
|
|
419
|
-
docId,
|
|
420
|
-
deliverable,
|
|
421
|
-
contentDocumentId
|
|
422
|
-
] = window.location.pathname.substr(1).split("/");
|
|
418
|
+
const [page, docId, deliverable, contentDocumentId] =
|
|
419
|
+
window.location.pathname.substr(1).split("/");
|
|
423
420
|
|
|
424
421
|
const { origin: domain, hash, search } = window.location;
|
|
425
422
|
|
|
@@ -469,7 +466,7 @@ export default class DocXmlContent extends LightningElementWithState<{
|
|
|
469
466
|
this.availableVersions = data.availableVersions;
|
|
470
467
|
this.pdfUrl = data.pdfUrl;
|
|
471
468
|
|
|
472
|
-
this.
|
|
469
|
+
this.updateHeaderAndSidebarFooter();
|
|
473
470
|
|
|
474
471
|
this.buildBreadcrumbs();
|
|
475
472
|
|
|
@@ -533,7 +530,7 @@ export default class DocXmlContent extends LightningElementWithState<{
|
|
|
533
530
|
});
|
|
534
531
|
}
|
|
535
532
|
|
|
536
|
-
|
|
533
|
+
updateHeaderAndSidebarFooter(): void {
|
|
537
534
|
if (!this.pageHeader) {
|
|
538
535
|
return;
|
|
539
536
|
}
|
|
@@ -543,20 +540,12 @@ export default class DocXmlContent extends LightningElementWithState<{
|
|
|
543
540
|
}
|
|
544
541
|
|
|
545
542
|
if (this.pdfUrl) {
|
|
546
|
-
this.
|
|
547
|
-
this.
|
|
543
|
+
this.sidebarFooterContent.bailHref = this.pdfUrl;
|
|
544
|
+
this.sidebarFooterContent.bailLabel = "PDF";
|
|
548
545
|
}
|
|
549
546
|
|
|
550
|
-
|
|
551
|
-
|
|
552
|
-
"langchange",
|
|
553
|
-
this.handleLanguageChange
|
|
554
|
-
);
|
|
555
|
-
this.listenerAttached = true;
|
|
556
|
-
}
|
|
557
|
-
|
|
558
|
-
this.pageHeader.languages = this.availableLanguages;
|
|
559
|
-
this.pageHeader.language = this.language?.id;
|
|
547
|
+
this.sidebarFooterContent.languages = this.availableLanguages;
|
|
548
|
+
this.sidebarFooterContent.language = this.language?.id;
|
|
560
549
|
|
|
561
550
|
if (this.pageReference) {
|
|
562
551
|
const { docId, deliverable, page } = this.pageReference;
|
|
@@ -581,20 +570,14 @@ export default class DocXmlContent extends LightningElementWithState<{
|
|
|
581
570
|
}
|
|
582
571
|
|
|
583
572
|
private updateSearchInput(searchParam: string): void {
|
|
584
|
-
(
|
|
585
|
-
"doc-content-layout"
|
|
586
|
-
)
|
|
573
|
+
(
|
|
574
|
+
this.template.querySelector("doc-content-layout") as any
|
|
575
|
+
)?.setSidebarInputValue(searchParam);
|
|
587
576
|
}
|
|
588
577
|
|
|
589
578
|
private pageReferenceToString(reference: PageReference): string {
|
|
590
|
-
const {
|
|
591
|
-
|
|
592
|
-
docId,
|
|
593
|
-
deliverable,
|
|
594
|
-
contentDocumentId,
|
|
595
|
-
hash,
|
|
596
|
-
search
|
|
597
|
-
} = reference;
|
|
579
|
+
const { page, docId, deliverable, contentDocumentId, hash, search } =
|
|
580
|
+
reference;
|
|
598
581
|
return `/${page}/${docId}/${deliverable}/${contentDocumentId}${this.normalizeSearch(
|
|
599
582
|
search!
|
|
600
583
|
)}${this.normalizeHash(hash)}`;
|
package/LICENSE
DELETED
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
Copyright (c) 2020, Salesforce.com, Inc.
|
|
2
|
-
All rights reserved.
|
|
3
|
-
|
|
4
|
-
Redistribution and use in source and binary forms, with or without modification, are permitted provided that the following conditions are met:
|
|
5
|
-
|
|
6
|
-
* Redistributions of source code must retain the above copyright notice, this list of conditions and the following disclaimer.
|
|
7
|
-
|
|
8
|
-
* Redistributions in binary form must reproduce the above copyright notice, this list of conditions and the following disclaimer in the documentation and/or other materials provided with the distribution.
|
|
9
|
-
|
|
10
|
-
* Neither the name of Salesforce.com nor the names of its contributors may be used to endorse or promote products derived from this software without specific prior written permission.
|
|
11
|
-
|
|
12
|
-
THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
|