@salesforcedevs/docs-components 0.74.3-alpha.2 → 0.74.3-alpha.3

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.
Files changed (3) hide show
  1. package/package.json +1 -1
  2. package/src/modules/doc/breadcrumbs/breadcrumbs.html +49 -47
  3. package/src/modules/doc/breadcrumbs/breadcrumbs.ts +6 -7
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@salesforcedevs/docs-components",
3
- "version": "0.74.3-alpha.2",
3
+ "version": "0.74.3-alpha.3",
4
4
  "description": "Docs Lightning web components for DSC",
5
5
  "license": "MIT",
6
6
  "main": "index.js",
package/src/modules/doc/breadcrumbs/breadcrumbs.html CHANGED
@@ -1,58 +1,60 @@
1
1
  <template>
2
2
  <nav role="navigation" aria-label={ariaLabel}>
3
- <template if:false={renderSmallVariant}>
4
- <template if:true={renderFirstCrumb}>
5
- <doc-breadcrumb-item
6
- analytics-event={analyticsEventName}
7
- analytics-base-payload={analyticsBasePayload}
8
- href={firstCrumb.href}
9
- label={firstCrumb.label}
10
- ></doc-breadcrumb-item>
11
- <span class="breadcrumb-item_slash">/</span>
3
+ <template if:true={hasBreadcrumbs}>
4
+ <template if:false={renderSmallVariant}>
5
+ <template if:true={renderFirstCrumb}>
6
+ <doc-breadcrumb-item
7
+ analytics-event={analyticsEventName}
8
+ analytics-base-payload={analyticsBasePayload}
9
+ href={firstCrumb.href}
10
+ label={firstCrumb.label}
11
+ ></doc-breadcrumb-item>
12
+ <span class="breadcrumb-item_slash">/</span>
13
+ </template>
14
+ <template if:true={renderDropdown}>
15
+ <dx-dropdown
16
+ if:true={renderDropdown}
17
+ analytics-event={analyticsEventName}
18
+ analytics-base-payload={analyticsBasePayload}
19
+ options={dropdownOptions}
20
+ open-on-hover
21
+ placement="bottom"
22
+ suppress-gtm-nav-headings
23
+ variant="indented"
24
+ width="fit-content"
25
+ >
26
+ <dx-button
27
+ aria-label="Open Breadcrumbs Dropdown"
28
+ icon-size="large"
29
+ icon-symbol="threedots"
30
+ variant="tertiary"
31
+ ></dx-button>
32
+ </dx-dropdown>
33
+ <span class="breadcrumb-item_slash">/</span>
34
+ </template>
35
+ <template for:each={breadcrumbItems} for:item="breadcrumb">
36
+ <doc-breadcrumb-item
37
+ analytics-event={analyticsEventName}
38
+ analytics-base-payload={analyticsBasePayload}
39
+ href={breadcrumb.href}
40
+ key={breadcrumb.id}
41
+ label={breadcrumb.label}
42
+ ></doc-breadcrumb-item>
43
+ <span class="breadcrumb-item_slash" key={breadcrumb.label}>
44
+ /
45
+ </span>
46
+ </template>
47
+ <doc-breadcrumb-item label={lastCrumb.label}></doc-breadcrumb-item>
12
48
  </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">
49
+ <template if:true={renderSmallVariant}>
35
50
  <doc-breadcrumb-item
36
51
  analytics-event={analyticsEventName}
37
52
  analytics-base-payload={analyticsBasePayload}
38
- href={breadcrumb.href}
39
- key={breadcrumb.id}
40
- label={breadcrumb.label}
53
+ href={lastLinkCrump.href}
54
+ label={lastLinkCrump.label}
55
+ variant="back-arrow"
41
56
  ></doc-breadcrumb-item>
42
- <span class="breadcrumb-item_slash" key={breadcrumb.label}>
43
- /
44
- </span>
45
57
  </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
58
  </template>
57
59
  </nav>
58
60
  </template>
package/src/modules/doc/breadcrumbs/breadcrumbs.ts CHANGED
@@ -68,6 +68,10 @@ export default class Breadcrumbs extends LightningElement {
68
68
  return this.breadcrumbs[this.breadcrumbs.length - 2];
69
69
  }
70
70
 
71
+ private get hasBreadcrumbs(): boolean {
72
+ return this.breadcrumbs.length > 0;
73
+ }
74
+
71
75
  private get hasInternalBreadcrumbs(): boolean {
72
76
  return this.breadcrumbs.length > 2;
73
77
  }
@@ -76,12 +80,7 @@ export default class Breadcrumbs extends LightningElement {
76
80
  return this.breadcrumbs!.slice(
77
81
  this.dropdownOptionAmount! + 1,
78
82
  this._breadcrumbs.length - 1
79
- ).map((crumb) => ({
80
- id: "",
81
- href: "",
82
- label: "",
83
- ...crumb
84
- }));
83
+ );
85
84
  }
86
85
 
87
86
  private get renderDropdown(): boolean {
@@ -157,7 +156,7 @@ export default class Breadcrumbs extends LightningElement {
157
156
  }
158
157
 
159
158
  private calculateBreadcrumbsConfigs(): void {
160
- if (!this.breadcrumbs.length) {
159
+ if (!this.hasBreadcrumbs) {
161
160
  return;
162
161
  }
163
162