@salesforcedevs/docs-components 0.74.3 → 0.74.5

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 CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@salesforcedevs/docs-components",
3
- "version": "0.74.3",
3
+ "version": "0.74.5",
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": "5b1dbe02a568ae6db02402a2d9e420b5b09b0f47"
27
+ "gitHead": "2a5e20148fd0661cfd71f37f1e3e6bd519ae3ff6"
28
28
  }
@@ -1,7 +1,7 @@
1
1
  <template>
2
2
  <nav role="navigation" aria-label={ariaLabel}>
3
- <template if:false={renderSmallVariant}>
4
- <template if:true={renderFirstCrumb}>
3
+ <template if:true={displayCrumbs}>
4
+ <template if:false={renderSmallVariant}>
5
5
  <doc-breadcrumb-item
6
6
  analytics-event={analyticsEventName}
7
7
  analytics-base-payload={analyticsBasePayload}
@@ -9,50 +9,50 @@
9
9
  label={firstCrumb.label}
10
10
  ></doc-breadcrumb-item>
11
11
  <span class="breadcrumb-item_slash">/</span>
12
+ <template if:true={renderDropdown}>
13
+ <dx-dropdown
14
+ if:true={renderDropdown}
15
+ analytics-event={analyticsEventName}
16
+ analytics-base-payload={analyticsBasePayload}
17
+ options={dropdownOptions}
18
+ open-on-hover
19
+ placement="bottom"
20
+ suppress-gtm-nav-headings
21
+ variant="indented"
22
+ width="fit-content"
23
+ >
24
+ <dx-button
25
+ aria-label="Open Breadcrumbs Dropdown"
26
+ icon-size="large"
27
+ icon-symbol="threedots"
28
+ variant="tertiary"
29
+ ></dx-button>
30
+ </dx-dropdown>
31
+ <span class="breadcrumb-item_slash">/</span>
32
+ </template>
33
+ <template for:each={breadcrumbItems} for:item="breadcrumb">
34
+ <doc-breadcrumb-item
35
+ analytics-event={analyticsEventName}
36
+ analytics-base-payload={analyticsBasePayload}
37
+ href={breadcrumb.href}
38
+ key={breadcrumb.id}
39
+ label={breadcrumb.label}
40
+ ></doc-breadcrumb-item>
41
+ <span class="breadcrumb-item_slash" key={breadcrumb.label}>
42
+ /
43
+ </span>
44
+ </template>
45
+ <doc-breadcrumb-item label={lastCrumb.label}></doc-breadcrumb-item>
12
46
  </template>
13
- <template if:true={renderDropdown}>
14
- <dx-dropdown
15
- if:true={renderDropdown}
16
- analytics-event={analyticsEventName}
17
- analytics-base-payload={analyticsBasePayload}
18
- options={dropdownOptions}
19
- open-on-hover
20
- placement="bottom"
21
- suppress-gtm-nav-headings
22
- variant="indented"
23
- width="fit-content"
24
- >
25
- <dx-button
26
- aria-label="Open Breadcrumbs Dropdown"
27
- icon-size="large"
28
- icon-symbol="threedots"
29
- variant="tertiary"
30
- ></dx-button>
31
- </dx-dropdown>
32
- <span class="breadcrumb-item_slash">/</span>
33
- </template>
34
- <template for:each={breadcrumbItems} for:item="breadcrumb">
47
+ <template if:true={renderSmallVariant}>
35
48
  <doc-breadcrumb-item
36
49
  analytics-event={analyticsEventName}
37
50
  analytics-base-payload={analyticsBasePayload}
38
- href={breadcrumb.href}
39
- key={breadcrumb.id}
40
- label={breadcrumb.label}
51
+ href={lastLinkCrump.href}
52
+ label={lastLinkCrump.label}
53
+ variant="back-arrow"
41
54
  ></doc-breadcrumb-item>
42
- <span class="breadcrumb-item_slash" key={breadcrumb.label}>
43
- /
44
- </span>
45
55
  </template>
46
- <doc-breadcrumb-item label={lastCrumb.label}></doc-breadcrumb-item>
47
- </template>
48
- <template if:true={renderSmallVariant}>
49
- <doc-breadcrumb-item
50
- analytics-event={analyticsEventName}
51
- analytics-base-payload={analyticsBasePayload}
52
- href={lastLinkCrump.href}
53
- label={lastLinkCrump.label}
54
- variant="back-arrow"
55
- ></doc-breadcrumb-item>
56
56
  </template>
57
57
  </nav>
58
58
  </template>
@@ -92,7 +92,7 @@ export default class Breadcrumbs extends LightningElement {
92
92
  );
93
93
  }
94
94
 
95
- private get renderFirstCrumb(): boolean {
95
+ private get displayCrumbs(): boolean {
96
96
  return this.breadcrumbs.length > 1;
97
97
  }
98
98
 
@@ -29,10 +29,12 @@
29
29
  <div class="content-body-container">
30
30
  <div class="content-body">
31
31
  <doc-breadcrumbs
32
- if:true={breadcrumbs}
32
+ if:true={showBreadcrumbs}
33
33
  breadcrumbs={breadcrumbs}
34
34
  ></doc-breadcrumbs>
35
- <slot onslotchange={onSlotChange}></slot>
35
+ <div style={docContentStyle}>
36
+ <slot onslotchange={onSlotChange}></slot>
37
+ </div>
36
38
  </div>
37
39
  <div class="right-nav-bar is-sticky">
38
40
  <dx-toc
@@ -38,7 +38,7 @@ export default class ContentLayout extends LightningElement {
38
38
  return this._breadcrumbs;
39
39
  }
40
40
 
41
- set breadcrumbs(value) {
41
+ set breadcrumbs(value): [] {
42
42
  if (value) {
43
43
  this._breadcrumbs = toJson(value);
44
44
  }
@@ -111,6 +111,14 @@ export default class ContentLayout extends LightningElement {
111
111
  return window.location.pathname;
112
112
  }
113
113
 
114
+ get showBreadcrumbs(): boolean {
115
+ return this.breadcrumbs != null && (this.breadcrumbs as any[]).length > 1;
116
+ }
117
+
118
+ get docContentStyle(): string {
119
+ return this.showBreadcrumbs ? "" : "margin-top: 48px";
120
+ }
121
+
114
122
  connectedCallback(): void {
115
123
  const hasParentHighlightListener = closest(
116
124
  "doc-xml-content",
@@ -34,6 +34,7 @@
34
34
  docs-data={docContent}
35
35
  page-reference={pageReference}
36
36
  onnavclick={handleNavClick}
37
+ style={docContentStyle}
37
38
  ></doc-content>
38
39
  </doc-content-layout>
39
40
  </template>
@@ -577,7 +577,11 @@ export default class DocXmlContent extends LightningElementWithState<{
577
577
  }
578
578
 
579
579
  get showBreadcrumbs(): boolean {
580
- return this.breadcrumbs && this.breadcrumbs.length > 0;
580
+ return this.breadcrumbs && this.breadcrumbs.length > 1;
581
+ }
582
+
583
+ get docContentStyle(): string {
584
+ return this.showBreadcrumbs ? "" : "margin-top: 48px";
581
585
  }
582
586
 
583
587
  private buildBreadcrumbs(): void {