@salesforcedevs/dx-components 1.3.259 → 1.3.261
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/lwc.config.json +1 -0
- package/package.json +2 -2
- package/src/modules/dx/cardContent/cardContent.html +1 -4
- package/src/modules/dx/embeddedVideo/embeddedVideo.css +35 -0
- package/src/modules/dx/embeddedVideo/embeddedVideo.html +56 -0
- package/src/modules/dx/embeddedVideo/embeddedVideo.ts +40 -0
- package/src/modules/dx/searchResults/resultsTemplate.js +157 -0
- package/src/modules/dx/searchResults/searchResults.ts +11 -141
- package/src/modules/dx/section/section.css +4 -2
package/lwc.config.json
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@salesforcedevs/dx-components",
|
|
3
|
-
"version": "1.3.
|
|
3
|
+
"version": "1.3.261",
|
|
4
4
|
"description": "DX Lightning web components",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"engines": {
|
|
@@ -45,5 +45,5 @@
|
|
|
45
45
|
"volta": {
|
|
46
46
|
"node": "16.19.1"
|
|
47
47
|
},
|
|
48
|
-
"gitHead": "
|
|
48
|
+
"gitHead": "8f326de081fbbef38ac44074ed4f54190e6416c1"
|
|
49
49
|
}
|
|
@@ -23,10 +23,7 @@
|
|
|
23
23
|
/>
|
|
24
24
|
</a>
|
|
25
25
|
<div
|
|
26
|
-
class="
|
|
27
|
-
dx-card-base_section-vertical dx-card-base_column
|
|
28
|
-
card_section-text
|
|
29
|
-
"
|
|
26
|
+
class="dx-card-base_section-vertical dx-card-base_column card_section-text"
|
|
30
27
|
>
|
|
31
28
|
<span if:true={label} part="label" class="label dx-text-label-3">
|
|
32
29
|
{label}
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
@import "dxHelpers/text";
|
|
2
|
+
@import "dxHelpers/reset";
|
|
3
|
+
|
|
4
|
+
iframe {
|
|
5
|
+
border-radius: 16px;
|
|
6
|
+
}
|
|
7
|
+
|
|
8
|
+
h2 {
|
|
9
|
+
margin-top: var(--dx-g-spacing-md);
|
|
10
|
+
}
|
|
11
|
+
|
|
12
|
+
.profile-image {
|
|
13
|
+
height: 48px;
|
|
14
|
+
width: 48px;
|
|
15
|
+
border-radius: 48px;
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
.profile-container {
|
|
19
|
+
display: grid;
|
|
20
|
+
grid-template-columns: 48px 1fr 100px;
|
|
21
|
+
align-items: center;
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
.profile-text {
|
|
25
|
+
margin-left: 10px;
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
.profile-text p {
|
|
29
|
+
color: var(--dx-g-blue-vibrant-20);
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
dx-icon {
|
|
33
|
+
display: inline;
|
|
34
|
+
margin: 0 6px;
|
|
35
|
+
}
|
|
@@ -0,0 +1,56 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<div class="container">
|
|
3
|
+
<template lwc:if={isTwitter}>
|
|
4
|
+
<iframe
|
|
5
|
+
scrolling="no"
|
|
6
|
+
frameborder="0"
|
|
7
|
+
allowfullscreen="true"
|
|
8
|
+
title="X Post"
|
|
9
|
+
src={twitterSrc}
|
|
10
|
+
height="215"
|
|
11
|
+
width="382"
|
|
12
|
+
></iframe>
|
|
13
|
+
</template>
|
|
14
|
+
<template lwc:if={isLinkedin}>
|
|
15
|
+
<iframe
|
|
16
|
+
scrolling="no"
|
|
17
|
+
src={linkedinSrc}
|
|
18
|
+
height="215"
|
|
19
|
+
width="382"
|
|
20
|
+
frameborder="0"
|
|
21
|
+
allowfullscreen=""
|
|
22
|
+
title="Embedded post"
|
|
23
|
+
></iframe>
|
|
24
|
+
</template>
|
|
25
|
+
<h2 class="dx-text-display-6">{title}</h2>
|
|
26
|
+
<p class="dx-text-body-2">{body}</p>
|
|
27
|
+
<div lwc:if={hasSocial}>
|
|
28
|
+
<dx-hr no-padding="true" spacing="smd"></dx-hr>
|
|
29
|
+
<div class="profile-container">
|
|
30
|
+
<img
|
|
31
|
+
class="profile-image"
|
|
32
|
+
src={socialProfileImgSrc}
|
|
33
|
+
alt={socialProfileImgAlt}
|
|
34
|
+
/>
|
|
35
|
+
<div class="profile-text">
|
|
36
|
+
<p class="dx-text-display-8">{socialName}</p>
|
|
37
|
+
<p class="dx-text-body-3">{socialJobTitle}</p>
|
|
38
|
+
</div>
|
|
39
|
+
<dx-button
|
|
40
|
+
variant="inline"
|
|
41
|
+
icon-symbol="new_window"
|
|
42
|
+
target="_blank"
|
|
43
|
+
href={href}
|
|
44
|
+
>
|
|
45
|
+
View on
|
|
46
|
+
<dx-icon
|
|
47
|
+
sprite="brand"
|
|
48
|
+
symbol={type}
|
|
49
|
+
color={socialIconColor}
|
|
50
|
+
size="large"
|
|
51
|
+
></dx-icon>
|
|
52
|
+
</dx-button>
|
|
53
|
+
</div>
|
|
54
|
+
</div>
|
|
55
|
+
</div>
|
|
56
|
+
</template>
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
import { LightningElement, api } from "lwc";
|
|
2
|
+
|
|
3
|
+
export default class EmbeddedVideo extends LightningElement {
|
|
4
|
+
@api type: "twitter" | "linkedin" = "twitter";
|
|
5
|
+
@api videoId!: string;
|
|
6
|
+
@api compact = false;
|
|
7
|
+
|
|
8
|
+
@api title = "";
|
|
9
|
+
@api body = "";
|
|
10
|
+
|
|
11
|
+
@api hasSocial? = false;
|
|
12
|
+
@api socialName?: string;
|
|
13
|
+
@api socialJobTitle?: string;
|
|
14
|
+
@api socialProfileImgSrc?: string;
|
|
15
|
+
@api href?: string;
|
|
16
|
+
|
|
17
|
+
get isTwitter() {
|
|
18
|
+
return this.type === "twitter";
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
get twitterSrc() {
|
|
22
|
+
return `https://platform.twitter.com/embed/Tweet.html?dnt=false&features=eyJ0ZndfdGltZWxpbmVfbGlzdCI6eyJidWNrZXQiOltdLCJ2ZXJzaW9uIjpudWxsfSwidGZ3X2ZvbGxvd2VyX2NvdW50X3N1bnNldCI6eyJidWNrZXQiOnRydWUsInZlcnNpb24iOm51bGx9LCJ0ZndfdHdlZXRfZWRpdF9iYWNrZW5kIjp7ImJ1Y2tldCI6Im9uIiwidmVyc2lvbiI6bnVsbH0sInRmd19yZWZzcmNfc2Vzc2lvbiI6eyJidWNrZXQiOiJvbiIsInZlcnNpb24iOm51bGx9LCJ0ZndfZm9zbnJfc29mdF9pbnRlcnZlbnRpb25zX2VuYWJsZWQiOnsiYnVja2V0Ijoib24iLCJ2ZXJzaW9uIjpudWxsfSwidGZ3X21peGVkX21lZGlhXzE1ODk3Ijp7ImJ1Y2tldCI6InRyZWF0bWVudCIsInZlcnNpb24iOm51bGx9LCJ0ZndfZXhwZXJpbWVudHNfY29va2llX2V4cGlyYXRpb24iOnsiYnVja2V0IjoxMjA5NjAwLCJ2ZXJzaW9uIjpudWxsfSwidGZ3X3Nob3dfYmlyZHdhdGNoX3Bpdm90c19lbmFibGVkIjp7ImJ1Y2tldCI6Im9uIiwidmVyc2lvbiI6bnVsbH0sInRmd19kdXBsaWNhdGVfc2NyaWJlc190b19zZXR0aW5ncyI6eyJidWNrZXQiOiJvbiIsInZlcnNpb24iOm51bGx9LCJ0ZndfdXNlX3Byb2ZpbGVfaW1hZ2Vfc2hhcGVfZW5hYmxlZCI6eyJidWNrZXQiOiJvbiIsInZlcnNpb24iOm51bGx9LCJ0ZndfdmlkZW9faGxzX2R5bmFtaWNfbWFuaWZlc3RzXzE1MDgyIjp7ImJ1Y2tldCI6InRydWVfYml0cmF0ZSIsInZlcnNpb24iOm51bGx9LCJ0ZndfbGVnYWN5X3RpbWVsaW5lX3N1bnNldCI6eyJidWNrZXQiOnRydWUsInZlcnNpb24iOm51bGx9LCJ0ZndfdHdlZXRfZWRpdF9mcm9udGVuZCI6eyJidWNrZXQiOiJvbiIsInZlcnNpb24iOm51bGx9fQ%3D%3D&frame=false&hideCard=false&hideThread=false&id=${this.videoId}&lang=en&maxWidth=318px&origin=https%3A%2F%2Fpublish.twitter.com%2F%23&sessionId=89704af49f57022abd058f0b4cff7b8ed0d9e820&theme=light&widgetsVersion=2615f7e52b7e0%3A1702314776716&width=318px`;
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
get isLinkedin() {
|
|
26
|
+
return this.type === "linkedin";
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
get linkedinSrc() {
|
|
30
|
+
return `https://www.linkedin.com/embed/feed/update/urn:li:ugcPost:${this.videoId}?compact=1`;
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
get socialProfileImgAlt() {
|
|
34
|
+
return `headshot of ${this.socialName}`;
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
get socialIconColor() {
|
|
38
|
+
return this.type === "twitter" ? "black" : "blue-vibrant-50";
|
|
39
|
+
}
|
|
40
|
+
}
|
|
@@ -0,0 +1,157 @@
|
|
|
1
|
+
/*
|
|
2
|
+
The String.raw tagged template literal is basically a no-op and won't do any changes to the template string,
|
|
3
|
+
but if you assign it to a variable with the name html or css,
|
|
4
|
+
tools like Prettier and VS Code will interpret the string as HTML or CSS respectively
|
|
5
|
+
*/
|
|
6
|
+
const html = String.raw;
|
|
7
|
+
|
|
8
|
+
export default html`
|
|
9
|
+
<div class="coveo-show-if-no-results">
|
|
10
|
+
<div class="no-results">
|
|
11
|
+
<img
|
|
12
|
+
src="https://a.sfdcstatic.com/developer-website/images/binary-cloud-circle-small.svg"
|
|
13
|
+
alt="purple cloud with floating binary numbers above"
|
|
14
|
+
/>
|
|
15
|
+
<div class="no-results-info">
|
|
16
|
+
<span
|
|
17
|
+
class="CoveoQuerySummary dx-text-display-8"
|
|
18
|
+
data-enable-no-results-found-message="true"
|
|
19
|
+
data-no-results-found-message="Sorry, no results were found for your search “\${query}”"
|
|
20
|
+
></span>
|
|
21
|
+
<p class="dx-text-display-8 tip">Search Tips:</p>
|
|
22
|
+
<ul class="tip-list">
|
|
23
|
+
<li>Please consider misspellings</li>
|
|
24
|
+
<li>Try different search keywords</li>
|
|
25
|
+
</ul>
|
|
26
|
+
<p class="dx-text-display-8 tip tbc-container">
|
|
27
|
+
Still not finding what you're looking for? Consider asking
|
|
28
|
+
in the
|
|
29
|
+
<a
|
|
30
|
+
class="link"
|
|
31
|
+
href="https://trailhead.salesforce.com/trailblazer-community/feed"
|
|
32
|
+
>
|
|
33
|
+
Trailblazer Community
|
|
34
|
+
</a>
|
|
35
|
+
!
|
|
36
|
+
</p>
|
|
37
|
+
</div>
|
|
38
|
+
</div>
|
|
39
|
+
</div>
|
|
40
|
+
<div class="coveo-show-if-results">
|
|
41
|
+
<script
|
|
42
|
+
id="myDocumentResultTemplate"
|
|
43
|
+
class="result-template"
|
|
44
|
+
type="text/underscore"
|
|
45
|
+
data-field-publicurl=""
|
|
46
|
+
>
|
|
47
|
+
<div class="dx-result">
|
|
48
|
+
<div class="dx-result-info">
|
|
49
|
+
<span class="CoveoFieldValue" data-field="@content_type" data-helper="badge" data-html-value="true"></span>
|
|
50
|
+
<% if (!raw.breadcrumbs && !raw.metabreadcrumbs) { %>
|
|
51
|
+
<% if (raw.content_type === "community posts" && raw.sfid) { %>
|
|
52
|
+
<span class="CoveoFieldValue" data-field="@sfid" data-helper="communityBreadcrumbs" data-html-value="true"></span>
|
|
53
|
+
<% } else { %>
|
|
54
|
+
<span class="CoveoFieldValue" data-field="@uri" data-helper="uriBreadcrumbs" data-html-value="true"></span>
|
|
55
|
+
<% } %>
|
|
56
|
+
<% } else { %>
|
|
57
|
+
<% if (raw.uri.includes('/references/')) { %>
|
|
58
|
+
<span class="CoveoFieldValue" data-field="@metabreadcrumbs" data-helper="metabreadcrumbs" data-html-value="true"></span>
|
|
59
|
+
<% } else { %>
|
|
60
|
+
<span class="CoveoFieldValue" data-field="@breadcrumbs" data-helper="breadcrumbs" data-html-value="true"></span>
|
|
61
|
+
<% } %>
|
|
62
|
+
<% } %>
|
|
63
|
+
</div>
|
|
64
|
+
<% if (raw.content_type === "community posts") { %>
|
|
65
|
+
<a
|
|
66
|
+
class="dx-result-title CoveoResultLink"
|
|
67
|
+
data-href-template="https://trailhead.salesforce.com/trailblazer-community/feed/<%= raw.sfid %>"
|
|
68
|
+
target="_blank"
|
|
69
|
+
>
|
|
70
|
+
<% } else { %>
|
|
71
|
+
<a
|
|
72
|
+
href="<%= raw.uri %>"
|
|
73
|
+
class="dx-result-title CoveoResultLink"
|
|
74
|
+
<% if (!raw.uri.includes('developer.salesforce.com') && !raw.uri.includes('developer-website-s.herokuapp.com')) { %>
|
|
75
|
+
target="_blank"
|
|
76
|
+
<% } %>
|
|
77
|
+
>
|
|
78
|
+
<% } %>
|
|
79
|
+
<%= title %>
|
|
80
|
+
<% if (!raw.uri.includes('developer.salesforce.com') && !raw.uri.includes('developer-website-s.herokuapp.com')) { %>
|
|
81
|
+
<svg xmlns="http://www.w3.org/2000/svg" style="display: inline; vertical-align: baseline;" fill="var(--dx-g-blue-vibrant-20)" width="20" height="20" part="svg" aria-hidden="true"><use xlink:href="/assets/icons/utility-sprite/svg/symbols.svg#new_window"></use></svg>
|
|
82
|
+
<% } %>
|
|
83
|
+
</a>
|
|
84
|
+
<span class="CoveoFieldValue" data-field="@sflastmodifieddate" data-helper="postedDate" data-html-value="true"></span>
|
|
85
|
+
<p class="dx-result-excerpt CoveoExcerpt"></p>
|
|
86
|
+
<% if (raw.sfcommentcount || raw.sflikecount) { %>
|
|
87
|
+
<div class="post-info-container">
|
|
88
|
+
<span class="CoveoFieldValue" data-field="@sfcommentcount" data-helper="replies" data-html-value="true"></span>
|
|
89
|
+
<% if (raw.sfcommentcount && raw.sflikecount) { %>
|
|
90
|
+
<span>•</span>
|
|
91
|
+
<% } %>
|
|
92
|
+
<span class="CoveoFieldValue" data-field="@sflikecount" data-helper="likes" data-html-value="true"></span>
|
|
93
|
+
</div>
|
|
94
|
+
<% } %>
|
|
95
|
+
</div>
|
|
96
|
+
</script>
|
|
97
|
+
<script
|
|
98
|
+
id="myDefaultResultTemplate"
|
|
99
|
+
class="result-template"
|
|
100
|
+
type="text/underscore"
|
|
101
|
+
>
|
|
102
|
+
<div class="dx-result">
|
|
103
|
+
<div class="dx-result-info">
|
|
104
|
+
<span class="CoveoFieldValue" data-field="@content_type" data-helper="badge" data-html-value="true"></span>
|
|
105
|
+
<% if (!raw.breadcrumbs && !raw.metabreadcrumbs) { %>
|
|
106
|
+
<% if (raw.content_type === "community posts" && raw.sfid) { %>
|
|
107
|
+
<span class="CoveoFieldValue" data-field="@sfid" data-helper="communityBreadcrumbs" data-html-value="true"></span>
|
|
108
|
+
<% } else { %>
|
|
109
|
+
<span class="CoveoFieldValue" data-field="@uri" data-helper="uriBreadcrumbs" data-html-value="true"></span>
|
|
110
|
+
<% } %>
|
|
111
|
+
<% } else { %>
|
|
112
|
+
<% if (raw.uri.includes('/references/')) { %>
|
|
113
|
+
<span class="CoveoFieldValue" data-field="@metabreadcrumbs" data-helper="metabreadcrumbs" data-html-value="true"></span>
|
|
114
|
+
<% } else { %>
|
|
115
|
+
<span class="CoveoFieldValue" data-field="@breadcrumbs" data-helper="breadcrumbs" data-html-value="true"></span>
|
|
116
|
+
<% } %>
|
|
117
|
+
<% } %>
|
|
118
|
+
</div>
|
|
119
|
+
<% if (raw.content_type === "community posts") { %>
|
|
120
|
+
<a
|
|
121
|
+
class="dx-result-title CoveoResultLink"
|
|
122
|
+
data-href-template="https://trailhead.salesforce.com/trailblazer-community/feed/<%= raw.sfid %>"
|
|
123
|
+
target="_blank"
|
|
124
|
+
>
|
|
125
|
+
<% } else { %>
|
|
126
|
+
<a
|
|
127
|
+
href="<%= raw.uri %>"
|
|
128
|
+
class="dx-result-title CoveoResultLink"
|
|
129
|
+
<% if (!raw.uri.includes('developer.salesforce.com') && !raw.uri.includes('developer-website-s.herokuapp.com')) { %>
|
|
130
|
+
target="_blank"
|
|
131
|
+
<% } %>
|
|
132
|
+
>
|
|
133
|
+
<% } %>
|
|
134
|
+
<% if (title) { %>
|
|
135
|
+
<%= title %>
|
|
136
|
+
<% } else { %>
|
|
137
|
+
<%= uri %>
|
|
138
|
+
<% } %>
|
|
139
|
+
<% if (!raw.uri.includes('developer.salesforce.com') && !raw.uri.includes('developer-website-s.herokuapp.com')) { %>
|
|
140
|
+
<svg xmlns="http://www.w3.org/2000/svg" style="display: inline; vertical-align: baseline;" fill="var(--dx-g-blue-vibrant-20)" width="20" height="20" part="svg" aria-hidden="true"><use xlink:href="/assets/icons/utility-sprite/svg/symbols.svg#new_window"></use></svg>
|
|
141
|
+
<% } %>
|
|
142
|
+
</a>
|
|
143
|
+
<span class="CoveoFieldValue" data-field="@sflastmodifieddate" data-helper="postedDate" data-html-value="true"></span>
|
|
144
|
+
<p class="dx-result-excerpt CoveoExcerpt"></p>
|
|
145
|
+
<% if (raw.sfcommentcount || raw.sflikecount) { %>
|
|
146
|
+
<div class="post-info-container">
|
|
147
|
+
<span class="CoveoFieldValue" data-field="@sfcommentcount" data-helper="replies" data-html-value="true"></span>
|
|
148
|
+
<% if (raw.sfcommentcount && raw.sflikecount) { %>
|
|
149
|
+
<span>•</span>
|
|
150
|
+
<% } %>
|
|
151
|
+
<span class="CoveoFieldValue" data-field="@sflikecount" data-helper="likes" data-html-value="true"></span>
|
|
152
|
+
</div>
|
|
153
|
+
<% } %>
|
|
154
|
+
</div>
|
|
155
|
+
</script>
|
|
156
|
+
</div>
|
|
157
|
+
`;
|
|
@@ -8,6 +8,7 @@ import {
|
|
|
8
8
|
} from "dxConstants/contentTypes";
|
|
9
9
|
import { getContentTypeColorVariables } from "dxUtils/contentTypes";
|
|
10
10
|
import { pollUntil } from "dxUtils/async";
|
|
11
|
+
import resultsTemplate from "./resultsTemplate";
|
|
11
12
|
|
|
12
13
|
// Max height for breadcrumb without wrapping
|
|
13
14
|
const MAX_BREADCRUMB_HEIGHT = 16;
|
|
@@ -41,146 +42,6 @@ function getPaginationState(event: CoveoSDK.IQuerySuccessEventArgs): {
|
|
|
41
42
|
return { numberOfPages, currentPage };
|
|
42
43
|
}
|
|
43
44
|
|
|
44
|
-
const resultsTemplatesInnerHtml = `
|
|
45
|
-
<div class="coveo-show-if-no-results">
|
|
46
|
-
<div class="no-results">
|
|
47
|
-
<img
|
|
48
|
-
src="https://a.sfdcstatic.com/developer-website/images/binary-cloud-circle-small.svg"
|
|
49
|
-
alt="purple cloud with floating binary numbers above"
|
|
50
|
-
/>
|
|
51
|
-
<div class="no-results-info">
|
|
52
|
-
<span class="CoveoQuerySummary dx-text-display-8"
|
|
53
|
-
data-enable-no-results-found-message="true"
|
|
54
|
-
data-no-results-found-message="Sorry, no results were found for your search “\${query}”">
|
|
55
|
-
</span>
|
|
56
|
-
<p class="dx-text-display-8 tip">Search Tips:</p>
|
|
57
|
-
<ul class="tip-list">
|
|
58
|
-
<li>Please consider misspellings</li>
|
|
59
|
-
<li>Try different search keywords</li>
|
|
60
|
-
</ul>
|
|
61
|
-
<p class="dx-text-display-8 tip tbc-container">
|
|
62
|
-
Still not finding what you're looking for? Consider
|
|
63
|
-
asking in the
|
|
64
|
-
<a
|
|
65
|
-
class="link"
|
|
66
|
-
href="https://trailhead.salesforce.com/trailblazer-community/feed"
|
|
67
|
-
>
|
|
68
|
-
Trailblazer Community
|
|
69
|
-
</a>
|
|
70
|
-
!
|
|
71
|
-
</p>
|
|
72
|
-
</div>
|
|
73
|
-
</div>
|
|
74
|
-
</div>
|
|
75
|
-
<div class="coveo-show-if-results">
|
|
76
|
-
<script
|
|
77
|
-
id="myDocumentResultTemplate"
|
|
78
|
-
class="result-template"
|
|
79
|
-
type="text/underscore"
|
|
80
|
-
data-field-publicurl=""
|
|
81
|
-
>
|
|
82
|
-
<div class="dx-result">
|
|
83
|
-
<div class="dx-result-info">
|
|
84
|
-
<span class="CoveoFieldValue" data-field="@content_type" data-helper="badge" data-html-value="true"></span>
|
|
85
|
-
<% if (!raw.breadcrumbs && !raw.metabreadcrumbs) { %>
|
|
86
|
-
<span class="CoveoFieldValue" data-field="@uri" data-helper="uriBreadcrumbs" data-html-value="true"></span>
|
|
87
|
-
<% } else { %>
|
|
88
|
-
<% if (raw.uri.includes('/references/')) { %>
|
|
89
|
-
<span class="CoveoFieldValue" data-field="@metabreadcrumbs" data-helper="metabreadcrumbs" data-html-value="true"></span>
|
|
90
|
-
<% } else { %>
|
|
91
|
-
<span class="CoveoFieldValue" data-field="@breadcrumbs" data-helper="breadcrumbs" data-html-value="true"></span>
|
|
92
|
-
<% } %>
|
|
93
|
-
<% } %>
|
|
94
|
-
</div>
|
|
95
|
-
<% if (raw.content_type === "community posts") { %>
|
|
96
|
-
<a
|
|
97
|
-
class="dx-result-title CoveoResultLink"
|
|
98
|
-
data-href-template="https://trailhead.salesforce.com/trailblazer-community/feed/<%= raw.sfid %>"
|
|
99
|
-
>
|
|
100
|
-
<% } else { %>
|
|
101
|
-
<a
|
|
102
|
-
href="<%= raw.uri %>"
|
|
103
|
-
class="dx-result-title CoveoResultLink"
|
|
104
|
-
<% if (!raw.uri.includes('developer.salesforce.com') && !raw.uri.includes('developer-website-s.herokuapp.com')) { %>
|
|
105
|
-
target="_blank"
|
|
106
|
-
<% } %>
|
|
107
|
-
>
|
|
108
|
-
<% } %>
|
|
109
|
-
<%= title %>
|
|
110
|
-
<% if (!raw.uri.includes('developer.salesforce.com') && !raw.uri.includes('developer-website-s.herokuapp.com')) { %>
|
|
111
|
-
<svg xmlns="http://www.w3.org/2000/svg" style="display: inline; vertical-align: baseline;" fill="var(--dx-g-blue-vibrant-20)" width="20" height="20" part="svg" aria-hidden="true"><use xlink:href="/assets/icons/utility-sprite/svg/symbols.svg#new_window"></use></svg>
|
|
112
|
-
<% } %>
|
|
113
|
-
</a>
|
|
114
|
-
<span class="CoveoFieldValue" data-field="@sflastmodifieddate" data-helper="postedDate" data-html-value="true"></span>
|
|
115
|
-
<p class="dx-result-excerpt CoveoExcerpt"></p>
|
|
116
|
-
<% if (raw.sfcommentcount || raw.sflikecount) { %>
|
|
117
|
-
<div class="post-info-container">
|
|
118
|
-
<span class="CoveoFieldValue" data-field="@sfcommentcount" data-helper="replies" data-html-value="true"></span>
|
|
119
|
-
<% if (raw.sfcommentcount && raw.sflikecount) { %>
|
|
120
|
-
<span>•</span>
|
|
121
|
-
<% } %>
|
|
122
|
-
<span class="CoveoFieldValue" data-field="@sflikecount" data-helper="likes" data-html-value="true"></span>
|
|
123
|
-
</div>
|
|
124
|
-
<% } %>
|
|
125
|
-
</div>
|
|
126
|
-
</script>
|
|
127
|
-
<script
|
|
128
|
-
id="myDefaultResultTemplate"
|
|
129
|
-
class="result-template"
|
|
130
|
-
type="text/underscore"
|
|
131
|
-
>
|
|
132
|
-
<div class="dx-result">
|
|
133
|
-
<div class="dx-result-info">
|
|
134
|
-
<span class="CoveoFieldValue" data-field="@content_type" data-helper="badge" data-html-value="true"></span>
|
|
135
|
-
<% if (!raw.breadcrumbs && !raw.metabreadcrumbs) { %>
|
|
136
|
-
<span class="CoveoFieldValue" data-field="@uri" data-helper="uriBreadcrumbs" data-html-value="true"></span>
|
|
137
|
-
<% } else { %>
|
|
138
|
-
<% if (raw.uri.includes('/references/')) { %>
|
|
139
|
-
<span class="CoveoFieldValue" data-field="@metabreadcrumbs" data-helper="metabreadcrumbs" data-html-value="true"></span>
|
|
140
|
-
<% } else { %>
|
|
141
|
-
<span class="CoveoFieldValue" data-field="@breadcrumbs" data-helper="breadcrumbs" data-html-value="true"></span>
|
|
142
|
-
<% } %>
|
|
143
|
-
<% } %>
|
|
144
|
-
</div>
|
|
145
|
-
<% if (raw.content_type === "community posts") { %>
|
|
146
|
-
<a
|
|
147
|
-
class="dx-result-title CoveoResultLink"
|
|
148
|
-
data-href-template="https://trailhead.salesforce.com/trailblazer-community/feed/<%= raw.sfid %>"
|
|
149
|
-
>
|
|
150
|
-
<% } else { %>
|
|
151
|
-
<a
|
|
152
|
-
href="<%= raw.uri %>"
|
|
153
|
-
class="dx-result-title CoveoResultLink"
|
|
154
|
-
<% if (!raw.uri.includes('developer.salesforce.com') && !raw.uri.includes('developer-website-s.herokuapp.com')) { %>
|
|
155
|
-
target="_blank"
|
|
156
|
-
<% } %>
|
|
157
|
-
>
|
|
158
|
-
<% } %>
|
|
159
|
-
<% if (title) { %>
|
|
160
|
-
<%= title %>
|
|
161
|
-
<% } else { %>
|
|
162
|
-
<%= uri %>
|
|
163
|
-
<% } %>
|
|
164
|
-
<% if (!raw.uri.includes('developer.salesforce.com') && !raw.uri.includes('developer-website-s.herokuapp.com')) { %>
|
|
165
|
-
<svg xmlns="http://www.w3.org/2000/svg" style="display: inline; vertical-align: baseline;" fill="var(--dx-g-blue-vibrant-20)" width="20" height="20" part="svg" aria-hidden="true"><use xlink:href="/assets/icons/utility-sprite/svg/symbols.svg#new_window"></use></svg>
|
|
166
|
-
<% } %>
|
|
167
|
-
</a>
|
|
168
|
-
<span class="CoveoFieldValue" data-field="@sflastmodifieddate" data-helper="postedDate" data-html-value="true"></span>
|
|
169
|
-
<p class="dx-result-excerpt CoveoExcerpt"></p>
|
|
170
|
-
<% if (raw.sfcommentcount || raw.sflikecount) { %>
|
|
171
|
-
<div class="post-info-container">
|
|
172
|
-
<span class="CoveoFieldValue" data-field="@sfcommentcount" data-helper="replies" data-html-value="true"></span>
|
|
173
|
-
<% if (raw.sfcommentcount && raw.sflikecount) { %>
|
|
174
|
-
<span>•</span>
|
|
175
|
-
<% } %>
|
|
176
|
-
<span class="CoveoFieldValue" data-field="@sflikecount" data-helper="likes" data-html-value="true"></span>
|
|
177
|
-
</div>
|
|
178
|
-
<% } %>
|
|
179
|
-
</div>
|
|
180
|
-
</script>
|
|
181
|
-
</div>
|
|
182
|
-
`;
|
|
183
|
-
|
|
184
45
|
const isInternalDomain = (domain: string) =>
|
|
185
46
|
domain === "developer.salesforce.com" ||
|
|
186
47
|
domain === "developer-website-s.herokuapp.com";
|
|
@@ -284,6 +145,10 @@ const buildTemplateHelperUriBreadcrumbs = (value: string) => {
|
|
|
284
145
|
return `<span class="breadcrumb">/ ${breadcrumbs.join(" / ")} /</span>`;
|
|
285
146
|
};
|
|
286
147
|
|
|
148
|
+
const buildTemplateHelperCommunityBreadcrumbs = () => {
|
|
149
|
+
return `<span class="breadcrumb"><span class="breadcrumb-item">trailhead.salesforce.com</span> / <span class="breadcrumb-item">trailblazer-community</span> / <span class="breadcrumb-item">feed</span> / </span>`;
|
|
150
|
+
};
|
|
151
|
+
|
|
287
152
|
const buildTemplateHelperBreadcrumbs = (value: string) => {
|
|
288
153
|
const parts = value.split("/").filter((part) => part !== "");
|
|
289
154
|
|
|
@@ -577,7 +442,7 @@ export default class SearchResults extends LightningElement {
|
|
|
577
442
|
|
|
578
443
|
if (resultsList) {
|
|
579
444
|
// eslint-disable-next-line @lwc/lwc/no-inner-html
|
|
580
|
-
resultsList.innerHTML =
|
|
445
|
+
resultsList.innerHTML = resultsTemplate;
|
|
581
446
|
}
|
|
582
447
|
|
|
583
448
|
Coveo.SearchEndpoint.configureCloudV2Endpoint(
|
|
@@ -607,6 +472,11 @@ export default class SearchResults extends LightningElement {
|
|
|
607
472
|
buildTemplateHelperUriBreadcrumbs
|
|
608
473
|
);
|
|
609
474
|
|
|
475
|
+
Coveo.TemplateHelpers.registerTemplateHelper(
|
|
476
|
+
"communityBreadcrumbs",
|
|
477
|
+
buildTemplateHelperCommunityBreadcrumbs
|
|
478
|
+
);
|
|
479
|
+
|
|
610
480
|
Coveo.TemplateHelpers.registerTemplateHelper(
|
|
611
481
|
"postedDate",
|
|
612
482
|
buildTemplateHelperPostedDate
|
|
@@ -12,6 +12,8 @@
|
|
|
12
12
|
--dx-c-section-cta-color: var(--dx-g-blue-vibrant-50);
|
|
13
13
|
--dx-c-section-cta-inline-hover-color: var(--dx-g-blue-vibrant-30);
|
|
14
14
|
--dx-c-section-position: relative;
|
|
15
|
+
--dx-c-section-graphic-margin-top: var(--graphic-height);
|
|
16
|
+
--dx-c-section-graphic-margin-bottom: var(--graphic-height);
|
|
15
17
|
}
|
|
16
18
|
|
|
17
19
|
.section {
|
|
@@ -34,11 +36,11 @@
|
|
|
34
36
|
}
|
|
35
37
|
|
|
36
38
|
.section.graphic-top:not(.graphic-overlap) {
|
|
37
|
-
margin-top: var(--graphic-
|
|
39
|
+
margin-top: var(--dx-c-section-graphic-margin-top);
|
|
38
40
|
}
|
|
39
41
|
|
|
40
42
|
.section.graphic-bottom:not(.graphic-overlap) {
|
|
41
|
-
margin-bottom: var(--graphic-
|
|
43
|
+
margin-bottom: var(--dx-c-section-graphic-margin-bottom);
|
|
42
44
|
}
|
|
43
45
|
|
|
44
46
|
.background-graphic {
|