@coveo/atomic 3.34.0-pre.15af8fb61b → 3.34.0-pre.1ad38ff1e4
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/dist/atomic/_atomic.esm.js +1 -1
- package/dist/atomic/atomic.esm.js.map +1 -1
- package/dist/atomic/components/_index.d.ts +2 -0
- package/dist/atomic/components/_index.js +1 -0
- package/dist/atomic/components/analytics-config.js +1 -1
- package/dist/atomic/components/atomic-insight-history-toggle.js +2 -2
- package/dist/atomic/components/atomic-insight-history-toggle.js.map +1 -1
- package/dist/atomic/components/atomic-insight-user-actions-toggle.js +2 -2
- package/dist/atomic/components/atomic-insight-user-actions-toggle.js.map +1 -1
- package/dist/atomic/components/atomic-search-box-recent-queries.d.ts +11 -0
- package/dist/atomic/components/atomic-search-box-recent-queries.js +8 -0
- package/dist/atomic/components/atomic-search-box-recent-queries.js.map +1 -0
- package/dist/atomic/components/atomic-search-box-recent-queries2.js +183 -0
- package/dist/atomic/components/atomic-search-box-recent-queries2.js.map +1 -0
- package/dist/atomic/components/atomic-search-box.js +8 -2
- package/dist/atomic/components/atomic-search-box.js.map +1 -1
- package/dist/atomic/components/atomic-smart-snippet-feedback-modal2.js +2 -2
- package/dist/atomic/components/atomic-tab-manager.js +1 -1
- package/dist/atomic/components/clock.js +2 -2
- package/dist/atomic/components/components/commerce/atomic-product/atomic-product.js +41 -56
- package/dist/atomic/components/components/common/layout/custom-render-controller.js +48 -0
- package/dist/atomic/components/components/common/layout/item-layout-controller.js +105 -0
- package/dist/atomic/components/components/search/index.js +0 -1
- package/dist/atomic/components/components/search/lazy-index.js +0 -1
- package/dist/atomic/components/global/environment.js +1 -1
- package/dist/atomic/components/index.js.map +1 -1
- package/dist/atomic/{p-11b094f7.entry.js → p-0c5fff04.entry.js} +2 -2
- package/dist/atomic/{p-bf81c1d3.js → p-1b364176.js} +2 -2
- package/dist/atomic/{p-ca3dc59b.entry.js → p-20764605.entry.js} +2 -2
- package/dist/atomic/{p-6078667f.entry.js → p-406a288c.entry.js} +2 -2
- package/dist/atomic/{p-9239be63.entry.js → p-6289adc7.entry.js} +2 -2
- package/dist/atomic/{p-5a710350.entry.js → p-88af4470.entry.js} +2 -2
- package/dist/atomic/{p-1d10c438.entry.js → p-8c47cfdb.entry.js} +2 -2
- package/dist/atomic/{p-e1cc5150.js → p-c280cd05.js} +1 -1
- package/dist/atomic/p-df4397ab.entry.js +2 -0
- package/dist/atomic/p-df4397ab.entry.js.map +1 -0
- package/dist/cjs/_loader.cjs.js +1 -1
- package/dist/cjs/{analytics-config-f40518ec.js → analytics-config-83f4fb5d.js} +2 -2
- package/dist/cjs/{analytics-config-f40518ec.js.map → analytics-config-83f4fb5d.js.map} +1 -1
- package/dist/cjs/atomic-insight-history-toggle.cjs.entry.js +2 -2
- package/dist/cjs/atomic-insight-history-toggle.cjs.entry.js.map +1 -1
- package/dist/cjs/atomic-insight-interface.cjs.entry.js +1 -1
- package/dist/cjs/atomic-insight-user-actions-toggle.cjs.entry.js +2 -2
- package/dist/cjs/atomic-insight-user-actions-toggle.cjs.entry.js.map +1 -1
- package/dist/cjs/atomic-recs-interface.cjs.entry.js +1 -1
- package/dist/cjs/atomic-search-box-query-suggestions_2.cjs.entry.js +234 -0
- package/dist/cjs/atomic-search-box-query-suggestions_2.cjs.entry.js.map +1 -0
- package/dist/cjs/atomic-smart-snippet-feedback-modal.cjs.entry.js +2 -2
- package/dist/cjs/atomic-tab-manager.cjs.entry.js +1 -1
- package/dist/cjs/atomic.cjs.js +1 -1
- package/dist/cjs/clock-f03ff827.js +7 -0
- package/dist/cjs/clock-f03ff827.js.map +1 -0
- package/dist/cjs/index-757bc886.js +2 -2
- package/dist/cjs/version.cjs.js +1 -1
- package/dist/esm/_loader.js +1 -1
- package/dist/esm/{analytics-config-49aa97b1.js → analytics-config-b6bd56be.js} +2 -2
- package/dist/esm/{analytics-config-49aa97b1.js.map → analytics-config-b6bd56be.js.map} +1 -1
- package/dist/esm/atomic-insight-history-toggle.entry.js +2 -2
- package/dist/esm/atomic-insight-history-toggle.entry.js.map +1 -1
- package/dist/esm/atomic-insight-interface.entry.js +1 -1
- package/dist/esm/atomic-insight-user-actions-toggle.entry.js +2 -2
- package/dist/esm/atomic-insight-user-actions-toggle.entry.js.map +1 -1
- package/dist/esm/atomic-recs-interface.entry.js +1 -1
- package/dist/esm/atomic-search-box-query-suggestions_2.entry.js +229 -0
- package/dist/esm/atomic-search-box-query-suggestions_2.entry.js.map +1 -0
- package/dist/esm/atomic-smart-snippet-feedback-modal.entry.js +2 -2
- package/dist/esm/atomic-tab-manager.entry.js +1 -1
- package/dist/esm/atomic.js +1 -1
- package/dist/esm/clock-add3e9a5.js +5 -0
- package/dist/esm/clock-add3e9a5.js.map +1 -0
- package/dist/esm/index-3f35faca.js +2 -2
- package/dist/esm/version.js +1 -1
- package/dist/types/components/commerce/atomic-product/atomic-product.d.ts +10 -13
- package/dist/types/components/common/layout/custom-render-controller.d.ts +28 -0
- package/dist/types/components/common/layout/item-layout-controller.d.ts +46 -0
- package/dist/types/components/search/index.d.ts +0 -1
- package/dist/types/components/search/search-box-suggestions/atomic-search-box-recent-queries/atomic-search-box-recent-queries.d.ts +37 -0
- package/dist/types/components.d.ts +49 -0
- package/docs/atomic-docs.json +98 -1
- package/package.json +1 -1
- package/dist/atomic/components/components/search/atomic-search-box-recent-queries/atomic-search-box-recent-queries.js +0 -137
- package/dist/atomic/p-899d19ef.entry.js +0 -2
- package/dist/atomic/p-899d19ef.entry.js.map +0 -1
- package/dist/cjs/atomic-search-box-query-suggestions.cjs.entry.js +0 -76
- package/dist/cjs/atomic-search-box-query-suggestions.cjs.entry.js.map +0 -1
- package/dist/cjs/clock-7aeb19d0.js +0 -7
- package/dist/cjs/clock-7aeb19d0.js.map +0 -1
- package/dist/esm/atomic-search-box-query-suggestions.entry.js +0 -72
- package/dist/esm/atomic-search-box-query-suggestions.entry.js.map +0 -1
- package/dist/esm/clock-b1f5d7f7.js +0 -5
- package/dist/esm/clock-b1f5d7f7.js.map +0 -1
- package/dist/types/components/search/atomic-search-box-recent-queries/atomic-search-box-recent-queries.d.ts +0 -45
- /package/dist/atomic/{p-11b094f7.entry.js.map → p-0c5fff04.entry.js.map} +0 -0
- /package/dist/atomic/{p-bf81c1d3.js.map → p-1b364176.js.map} +0 -0
- /package/dist/atomic/{p-ca3dc59b.entry.js.map → p-20764605.entry.js.map} +0 -0
- /package/dist/atomic/{p-6078667f.entry.js.map → p-406a288c.entry.js.map} +0 -0
- /package/dist/atomic/{p-9239be63.entry.js.map → p-6289adc7.entry.js.map} +0 -0
- /package/dist/atomic/{p-5a710350.entry.js.map → p-88af4470.entry.js.map} +0 -0
- /package/dist/atomic/{p-1d10c438.entry.js.map → p-8c47cfdb.entry.js.map} +0 -0
- /package/dist/atomic/{p-e1cc5150.js.map → p-c280cd05.js.map} +0 -0
package/docs/atomic-docs.json
CHANGED
@@ -1,5 +1,5 @@
|
|
1
1
|
{
|
2
|
-
"timestamp": "2025-10-
|
2
|
+
"timestamp": "2025-10-03T20:07:56",
|
3
3
|
"compiler": {
|
4
4
|
"name": "@stencil/core",
|
5
5
|
"version": "4.20.0",
|
@@ -12308,11 +12308,13 @@
|
|
12308
12308
|
"dependents": [],
|
12309
12309
|
"dependencies": [
|
12310
12310
|
"atomic-suggestion-renderer",
|
12311
|
+
"atomic-search-box-recent-queries",
|
12311
12312
|
"atomic-search-box-query-suggestions"
|
12312
12313
|
],
|
12313
12314
|
"dependencyGraph": {
|
12314
12315
|
"atomic-search-box": [
|
12315
12316
|
"atomic-suggestion-renderer",
|
12317
|
+
"atomic-search-box-recent-queries",
|
12316
12318
|
"atomic-search-box-query-suggestions"
|
12317
12319
|
]
|
12318
12320
|
}
|
@@ -12631,6 +12633,101 @@
|
|
12631
12633
|
]
|
12632
12634
|
}
|
12633
12635
|
},
|
12636
|
+
{
|
12637
|
+
"filePath": "src/components/search/search-box-suggestions/atomic-search-box-recent-queries/atomic-search-box-recent-queries.tsx",
|
12638
|
+
"encapsulation": "shadow",
|
12639
|
+
"tag": "atomic-search-box-recent-queries",
|
12640
|
+
"docs": "The `atomic-search-box-recent-queries` component can be added as a child of an `atomic-search-box` component, allowing for the configuration of recent query suggestions.",
|
12641
|
+
"docsTags": [],
|
12642
|
+
"usage": {},
|
12643
|
+
"props": [
|
12644
|
+
{
|
12645
|
+
"name": "icon",
|
12646
|
+
"type": "string | undefined",
|
12647
|
+
"complexType": {
|
12648
|
+
"original": "string",
|
12649
|
+
"resolved": "string | undefined",
|
12650
|
+
"references": {}
|
12651
|
+
},
|
12652
|
+
"mutable": false,
|
12653
|
+
"attr": "icon",
|
12654
|
+
"reflectToAttr": false,
|
12655
|
+
"docs": "The SVG icon to display.\n\n- Use a value that starts with `http://`, `https://`, `./`, or `../`, to fetch and display an icon from a given location.\n- Use a value that starts with `assets://`, to display an icon from the Atomic package.\n- Use a stringified SVG to display it directly.",
|
12656
|
+
"docsTags": [],
|
12657
|
+
"values": [
|
12658
|
+
{
|
12659
|
+
"type": "string"
|
12660
|
+
},
|
12661
|
+
{
|
12662
|
+
"type": "undefined"
|
12663
|
+
}
|
12664
|
+
],
|
12665
|
+
"optional": true,
|
12666
|
+
"required": false
|
12667
|
+
},
|
12668
|
+
{
|
12669
|
+
"name": "maxWithQuery",
|
12670
|
+
"type": "number",
|
12671
|
+
"complexType": {
|
12672
|
+
"original": "number",
|
12673
|
+
"resolved": "number",
|
12674
|
+
"references": {}
|
12675
|
+
},
|
12676
|
+
"mutable": false,
|
12677
|
+
"attr": "max-with-query",
|
12678
|
+
"reflectToAttr": true,
|
12679
|
+
"docs": "The maximum number of suggestions that will be displayed if the user has typed something into the input field.",
|
12680
|
+
"docsTags": [],
|
12681
|
+
"default": "3",
|
12682
|
+
"values": [
|
12683
|
+
{
|
12684
|
+
"type": "number"
|
12685
|
+
}
|
12686
|
+
],
|
12687
|
+
"optional": false,
|
12688
|
+
"required": false
|
12689
|
+
},
|
12690
|
+
{
|
12691
|
+
"name": "maxWithoutQuery",
|
12692
|
+
"type": "number | undefined",
|
12693
|
+
"complexType": {
|
12694
|
+
"original": "number",
|
12695
|
+
"resolved": "number | undefined",
|
12696
|
+
"references": {}
|
12697
|
+
},
|
12698
|
+
"mutable": false,
|
12699
|
+
"attr": "max-without-query",
|
12700
|
+
"reflectToAttr": true,
|
12701
|
+
"docs": "The maximum number of suggestions that will be displayed initially when the input field is empty.",
|
12702
|
+
"docsTags": [],
|
12703
|
+
"values": [
|
12704
|
+
{
|
12705
|
+
"type": "number"
|
12706
|
+
},
|
12707
|
+
{
|
12708
|
+
"type": "undefined"
|
12709
|
+
}
|
12710
|
+
],
|
12711
|
+
"optional": true,
|
12712
|
+
"required": false
|
12713
|
+
}
|
12714
|
+
],
|
12715
|
+
"methods": [],
|
12716
|
+
"events": [],
|
12717
|
+
"listeners": [],
|
12718
|
+
"styles": [],
|
12719
|
+
"slots": [],
|
12720
|
+
"parts": [],
|
12721
|
+
"dependents": [
|
12722
|
+
"atomic-search-box"
|
12723
|
+
],
|
12724
|
+
"dependencies": [],
|
12725
|
+
"dependencyGraph": {
|
12726
|
+
"atomic-search-box": [
|
12727
|
+
"atomic-search-box-recent-queries"
|
12728
|
+
]
|
12729
|
+
}
|
12730
|
+
},
|
12634
12731
|
{
|
12635
12732
|
"filePath": "src/components/search/facets/atomic-segmented-facet/atomic-segmented-facet.tsx",
|
12636
12733
|
"encapsulation": "shadow",
|
package/package.json
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
{
|
2
2
|
"name": "@coveo/atomic",
|
3
3
|
"type": "module",
|
4
|
-
"version": "3.34.0-pre.
|
4
|
+
"version": "3.34.0-pre.1ad38ff1e4",
|
5
5
|
"description": "A web-component library for building modern UIs interfacing with the Coveo platform",
|
6
6
|
"homepage": "https://docs.coveo.com/en/atomic/latest/",
|
7
7
|
"repository": {
|
@@ -1,137 +0,0 @@
|
|
1
|
-
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
|
2
|
-
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
3
|
-
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
4
|
-
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
5
|
-
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
6
|
-
};
|
7
|
-
import { buildRecentQueriesList, } from '@coveo/headless';
|
8
|
-
import { html, LitElement, nothing } from 'lit';
|
9
|
-
import { customElement, property, state } from 'lit/decorators.js';
|
10
|
-
import { errorGuard } from "../../../decorators/error-guard";
|
11
|
-
import { SafeStorage, StorageItems } from "../../../utils/local-storage-utils";
|
12
|
-
import { once } from "../../../utils/utils";
|
13
|
-
const Clock = "<svg fill=\"none\" stroke=\"currentColor\" stroke-linejoin=\"round\" stroke-linecap=\"round\" viewBox=\"0 0 16 16\" xmlns=\"http://www.w3.org/2000/svg\"><circle cx=\"8\" cy=\"8\" r=\"7.5\"/><path d=\"m8.5 4.5v4\"/><path d=\"m10.3066 10.1387-1.80932-1.5768\"/></svg>";
|
14
|
-
import { getPartialRecentQueryClearElement, getPartialRecentQueryElement, renderRecentQuery, renderRecentQueryClear, } from '../../common/suggestions/recent-queries';
|
15
|
-
import { dispatchSearchBoxSuggestionsEvent } from '../../common/suggestions/suggestions-events';
|
16
|
-
/**
|
17
|
-
* The `atomic-search-box-recent-queries` component can be added as a child of an `atomic-search-box` component, allowing for the configuration of recent query suggestions.
|
18
|
-
*/
|
19
|
-
let AtomicSearchBoxRecentQueries = class AtomicSearchBoxRecentQueries extends LitElement {
|
20
|
-
constructor() {
|
21
|
-
super(...arguments);
|
22
|
-
/**
|
23
|
-
* The maximum number of suggestions to display when the user types in the input field.
|
24
|
-
*/
|
25
|
-
this.maxWithQuery = 3;
|
26
|
-
this.warnUser = once(() => this.bindings.engine.logger.warn('The recent queries feature is deactivated because analytics are disabled.'));
|
27
|
-
}
|
28
|
-
connectedCallback() {
|
29
|
-
super.connectedCallback();
|
30
|
-
try {
|
31
|
-
dispatchSearchBoxSuggestionsEvent((bindings) => {
|
32
|
-
this.bindings = bindings;
|
33
|
-
return this.initialize();
|
34
|
-
}, this, ['atomic-search-box']);
|
35
|
-
}
|
36
|
-
catch (error) {
|
37
|
-
this.error = error;
|
38
|
-
}
|
39
|
-
}
|
40
|
-
initialize() {
|
41
|
-
this.storage = new SafeStorage();
|
42
|
-
this.recentQueriesList = buildRecentQueriesList(this.bindings.engine, {
|
43
|
-
initialState: { queries: this.retrieveLocalStorage() },
|
44
|
-
options: {
|
45
|
-
maxLength: 1000,
|
46
|
-
clearFilters: this.bindings.clearFilters,
|
47
|
-
},
|
48
|
-
});
|
49
|
-
this.recentQueriesList.subscribe(() => this.updateLocalStorage());
|
50
|
-
return {
|
51
|
-
position: Array.from(this.parentNode.children).indexOf(this),
|
52
|
-
renderItems: () => this.renderItems(),
|
53
|
-
};
|
54
|
-
}
|
55
|
-
retrieveLocalStorage() {
|
56
|
-
return this.storage.getParsedJSON(StorageItems.RECENT_QUERIES, []);
|
57
|
-
}
|
58
|
-
updateLocalStorage() {
|
59
|
-
if (!this.recentQueriesList.state.analyticsEnabled) {
|
60
|
-
return this.disableFeature();
|
61
|
-
}
|
62
|
-
return this.storage.setJSON(StorageItems.RECENT_QUERIES, this.recentQueriesList.state.queries);
|
63
|
-
}
|
64
|
-
disableFeature() {
|
65
|
-
this.warnUser();
|
66
|
-
this.storage.removeItem(StorageItems.RECENT_QUERIES);
|
67
|
-
}
|
68
|
-
renderItems() {
|
69
|
-
if (!this.recentQueriesList.state.analyticsEnabled) {
|
70
|
-
return [];
|
71
|
-
}
|
72
|
-
const query = this.bindings.searchBoxController.state.value;
|
73
|
-
const hasQuery = query !== '';
|
74
|
-
const max = hasQuery ? this.maxWithQuery : this.maxWithoutQuery;
|
75
|
-
const filteredQueries = this.recentQueriesList.state.queries
|
76
|
-
.filter((recentQuery) => recentQuery.toLowerCase().startsWith(query.toLowerCase()))
|
77
|
-
.slice(0, max);
|
78
|
-
const suggestionElements = filteredQueries.map((value) => this.renderItem(value));
|
79
|
-
if (suggestionElements.length) {
|
80
|
-
suggestionElements.unshift(this.renderClear());
|
81
|
-
}
|
82
|
-
return suggestionElements;
|
83
|
-
}
|
84
|
-
renderClear() {
|
85
|
-
const partialItem = getPartialRecentQueryClearElement(this.bindings.i18n);
|
86
|
-
return {
|
87
|
-
...partialItem,
|
88
|
-
content: renderRecentQueryClear({ i18n: this.bindings.i18n }),
|
89
|
-
onSelect: () => {
|
90
|
-
this.recentQueriesList.clear();
|
91
|
-
this.bindings.triggerSuggestions();
|
92
|
-
},
|
93
|
-
};
|
94
|
-
}
|
95
|
-
renderItem(value) {
|
96
|
-
const query = this.bindings.searchBoxController.state.value;
|
97
|
-
const partialItem = getPartialRecentQueryElement(value, this.bindings.i18n);
|
98
|
-
return {
|
99
|
-
...partialItem,
|
100
|
-
content: renderRecentQuery({
|
101
|
-
icon: this.icon || Clock,
|
102
|
-
query,
|
103
|
-
value,
|
104
|
-
}),
|
105
|
-
onSelect: () => {
|
106
|
-
if (this.bindings.isStandalone) {
|
107
|
-
this.bindings.searchBoxController.updateText(value);
|
108
|
-
this.bindings.searchBoxController.submit();
|
109
|
-
return;
|
110
|
-
}
|
111
|
-
this.recentQueriesList.executeRecentQuery(this.recentQueriesList.state.queries.indexOf(value));
|
112
|
-
},
|
113
|
-
};
|
114
|
-
}
|
115
|
-
render() {
|
116
|
-
return html `${nothing}`;
|
117
|
-
}
|
118
|
-
};
|
119
|
-
__decorate([
|
120
|
-
state()
|
121
|
-
], AtomicSearchBoxRecentQueries.prototype, "error", void 0);
|
122
|
-
__decorate([
|
123
|
-
property()
|
124
|
-
], AtomicSearchBoxRecentQueries.prototype, "icon", void 0);
|
125
|
-
__decorate([
|
126
|
-
property({ type: Number, attribute: 'max-with-query', reflect: true })
|
127
|
-
], AtomicSearchBoxRecentQueries.prototype, "maxWithQuery", void 0);
|
128
|
-
__decorate([
|
129
|
-
property({ type: Number, attribute: 'max-without-query', reflect: true })
|
130
|
-
], AtomicSearchBoxRecentQueries.prototype, "maxWithoutQuery", void 0);
|
131
|
-
__decorate([
|
132
|
-
errorGuard()
|
133
|
-
], AtomicSearchBoxRecentQueries.prototype, "render", null);
|
134
|
-
AtomicSearchBoxRecentQueries = __decorate([
|
135
|
-
customElement('atomic-search-box-recent-queries')
|
136
|
-
], AtomicSearchBoxRecentQueries);
|
137
|
-
export { AtomicSearchBoxRecentQueries };
|
@@ -1,2 +0,0 @@
|
|
1
|
-
import{r as t,h as s,g as e}from"./p-dc3df5ce.js";import{loadQuerySuggestActions as i}from"@coveo/headless";import{S as r}from"./p-cfb3c589.js";import{g as o,Q as n,a as h,b as c}from"./p-af93b44c.js";import{d as a}from"./p-4b7a19db.js";import"./p-8f5830b4.js";import"./p-c9074946.js";import"./p-1580513b.js";const d=class{constructor(s){t(this,s);this.error=undefined;this.icon=undefined;this.maxWithQuery=undefined;this.maxWithoutQuery=undefined}componentWillLoad(){try{a((t=>{this.bindings=t;return this.initialize()}),this.host,["atomic-search-box"])}catch(t){this.error=t}}initialize(){const t=this.bindings.engine;const{registerQuerySuggest:s,fetchQuerySuggestions:e}=i(t);t.dispatch(s({id:this.bindings.id,count:this.bindings.numberOfQueries}));return{position:Array.from(this.host.parentNode.children).indexOf(this.host),onInput:()=>t.dispatch(e({id:this.bindings.id})),renderItems:()=>this.renderItems()}}renderItems(){const t=this.bindings.searchBoxController.state.value!=="";const s=t?this.maxWithQuery:this.maxWithoutQuery;return this.bindings.searchBoxController.state.suggestions.slice(0,s).map((t=>this.renderItem(t)))}renderItem(t){const e=this.bindings.searchBoxController.state.value!=="";const i=o(t,this.bindings.i18n);return{...i,content:s(c,null,s(h,{icon:this.icon||r,hasSuggestion:this.bindings.getSuggestions().length>1}),s(n,{suggestion:t,hasQuery:e})),onSelect:()=>{this.bindings.searchBoxController.selectSuggestion(t.rawValue)}}}render(){if(this.error){return s("atomic-component-error",{key:"d8ace632cbbd5924ed771125cea0b395b021fe3e",element:this.host,error:this.error})}}get host(){return e(this)}};export{d as atomic_search_box_query_suggestions};
|
2
|
-
//# sourceMappingURL=p-899d19ef.entry.js.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"names":["AtomicSearchBoxQuerySuggestions","componentWillLoad","dispatchSearchBoxSuggestionsEvent","bindings","this","initialize","host","error","engine","registerQuerySuggest","fetchQuerySuggestions","loadQuerySuggestActions","dispatch","id","count","numberOfQueries","position","Array","from","parentNode","children","indexOf","onInput","renderItems","hasQuery","searchBoxController","state","value","max","maxWithQuery","maxWithoutQuery","suggestions","slice","map","suggestion","renderItem","partialItem","getPartialSearchBoxSuggestionElement","i18n","content","h","QuerySuggestionContainer","QuerySuggestionIcon","icon","SearchIcon","hasSuggestion","getSuggestions","length","QuerySuggestionText","onSelect","selectSuggestion","rawValue","render","key","element"],"sources":["src/components/search/search-box-suggestions/atomic-search-box-query-suggestions/atomic-search-box-query-suggestions.tsx"],"sourcesContent":["import {\n loadQuerySuggestActions,\n SearchBox,\n SearchEngine,\n Suggestion,\n} from '@coveo/headless';\nimport {Component, Element, Prop, State, h} from '@stencil/core';\nimport SearchIcon from '../../../../images/search.svg';\nimport {\n getPartialSearchBoxSuggestionElement,\n QuerySuggestionContainer,\n QuerySuggestionIcon,\n QuerySuggestionText,\n} from '../../../common/suggestions/stencil-query-suggestions';\nimport {\n dispatchSearchBoxSuggestionsEvent,\n} from '../../../common/suggestions/suggestions-events';\nimport type {\n SearchBoxSuggestionElement,\n SearchBoxSuggestions,\n SearchBoxSuggestionsBindings,\n} from '../../../common/suggestions/suggestions-types';\n\n/**\n * The `atomic-search-box-query-suggestions` component can be added as a child of an `atomic-search-box` component, allowing for the configuration of query suggestion behavior.\n */\n@Component({\n tag: 'atomic-search-box-query-suggestions',\n shadow: true,\n})\nexport class AtomicSearchBoxQuerySuggestions {\n private bindings!: SearchBoxSuggestionsBindings<SearchBox>;\n @Element() private host!: HTMLElement;\n\n @State() public error!: Error;\n\n /**\n * The SVG icon to display.\n *\n * - Use a value that starts with `http://`, `https://`, `./`, or `../`, to fetch and display an icon from a given location.\n * - Use a value that starts with `assets://`, to display an icon from the Atomic package.\n * - Use a stringified SVG to display it directly.\n */\n @Prop() public icon?: string;\n\n /**\n * The maximum number of suggestions that will be displayed if the user has typed something into the input field.\n */\n @Prop({reflect: true}) public maxWithQuery?: number;\n /**\n * The maximum number of suggestions that will be displayed initially when the input field is empty.\n */\n @Prop({reflect: true}) public maxWithoutQuery?: number;\n\n componentWillLoad() {\n try {\n dispatchSearchBoxSuggestionsEvent<SearchBox>(\n (bindings) => {\n this.bindings = bindings;\n return this.initialize();\n },\n this.host,\n ['atomic-search-box']\n );\n } catch (error) {\n this.error = error as Error;\n }\n }\n\n private initialize(): SearchBoxSuggestions {\n const engine = this.bindings.engine as SearchEngine<{\n querySet: string;\n querySuggest: string;\n }>;\n const {registerQuerySuggest, fetchQuerySuggestions} =\n loadQuerySuggestActions(engine);\n\n engine.dispatch(\n registerQuerySuggest({\n id: this.bindings.id,\n count: this.bindings.numberOfQueries,\n })\n );\n\n return {\n position: Array.from(this.host.parentNode!.children).indexOf(this.host),\n onInput: () =>\n engine.dispatch(\n fetchQuerySuggestions({\n id: this.bindings.id,\n })\n ),\n renderItems: () => this.renderItems(),\n };\n }\n\n private renderItems(): SearchBoxSuggestionElement[] {\n const hasQuery = this.bindings.searchBoxController.state.value !== '';\n const max = hasQuery ? this.maxWithQuery : this.maxWithoutQuery;\n return this.bindings.searchBoxController.state.suggestions\n .slice(0, max)\n .map((suggestion) => this.renderItem(suggestion));\n }\n\n private renderItem(suggestion: Suggestion) {\n const hasQuery = this.bindings.searchBoxController.state.value !== '';\n const partialItem = getPartialSearchBoxSuggestionElement(\n suggestion,\n this.bindings.i18n\n );\n\n return {\n ...partialItem,\n content: (\n <QuerySuggestionContainer>\n <QuerySuggestionIcon\n icon={this.icon || SearchIcon}\n hasSuggestion={this.bindings.getSuggestions().length > 1}\n />\n\n <QuerySuggestionText suggestion={suggestion} hasQuery={hasQuery} />\n </QuerySuggestionContainer>\n ),\n onSelect: () => {\n this.bindings.searchBoxController.selectSuggestion(suggestion.rawValue);\n },\n };\n }\n\n public render() {\n if (this.error) {\n return (\n <atomic-component-error\n element={this.host}\n error={this.error}\n ></atomic-component-error>\n );\n }\n }\n}\n"],"mappings":"2TA8BaA,EAA+B,M,6HAwB1C,iBAAAC,GACE,IACEC,GACGC,IACCC,KAAKD,SAAWA,EAChB,OAAOC,KAAKC,YAAY,GAE1BD,KAAKE,KACL,CAAC,qB,CAEH,MAAOC,GACPH,KAAKG,MAAQA,C,EAIT,UAAAF,GACN,MAAMG,EAASJ,KAAKD,SAASK,OAI7B,MAAMC,qBAACA,EAAoBC,sBAAEA,GAC3BC,EAAwBH,GAE1BA,EAAOI,SACLH,EAAqB,CACnBI,GAAIT,KAAKD,SAASU,GAClBC,MAAOV,KAAKD,SAASY,mBAIzB,MAAO,CACLC,SAAUC,MAAMC,KAAKd,KAAKE,KAAKa,WAAYC,UAAUC,QAAQjB,KAAKE,MAClEgB,QAAS,IACPd,EAAOI,SACLF,EAAsB,CACpBG,GAAIT,KAAKD,SAASU,MAGxBU,YAAa,IAAMnB,KAAKmB,c,CAIpB,WAAAA,GACN,MAAMC,EAAWpB,KAAKD,SAASsB,oBAAoBC,MAAMC,QAAU,GACnE,MAAMC,EAAMJ,EAAWpB,KAAKyB,aAAezB,KAAK0B,gBAChD,OAAO1B,KAAKD,SAASsB,oBAAoBC,MAAMK,YAC5CC,MAAM,EAAGJ,GACTK,KAAKC,GAAe9B,KAAK+B,WAAWD,I,CAGjC,UAAAC,CAAWD,GACjB,MAAMV,EAAWpB,KAAKD,SAASsB,oBAAoBC,MAAMC,QAAU,GACnE,MAAMS,EAAcC,EAClBH,EACA9B,KAAKD,SAASmC,MAGhB,MAAO,IACFF,EACHG,QACEC,EAACC,EAAwB,KACvBD,EAACE,EAAmB,CAClBC,KAAMvC,KAAKuC,MAAQC,EACnBC,cAAezC,KAAKD,SAAS2C,iBAAiBC,OAAS,IAGzDP,EAACQ,EAAmB,CAACd,WAAYA,EAAYV,SAAUA,KAG3DyB,SAAU,KACR7C,KAAKD,SAASsB,oBAAoByB,iBAAiBhB,EAAWiB,SAAS,E,CAKtE,MAAAC,GACL,GAAIhD,KAAKG,MAAO,CACd,OACEiC,EAAA,0BAAAa,IAAA,2CACEC,QAASlD,KAAKE,KACdC,MAAOH,KAAKG,O","ignoreList":[]}
|
@@ -1,76 +0,0 @@
|
|
1
|
-
'use strict';
|
2
|
-
|
3
|
-
Object.defineProperty(exports, '__esModule', { value: true });
|
4
|
-
|
5
|
-
const index = require('./index-757bc886.js');
|
6
|
-
const headless = require('@coveo/headless');
|
7
|
-
const search = require('./search-a4774f02.js');
|
8
|
-
const stencilQuerySuggestions = require('./stencil-query-suggestions-03268ecc.js');
|
9
|
-
const suggestionsEvents = require('./suggestions-events-63dd0640.js');
|
10
|
-
require('./string-utils-bdf08f8c.js');
|
11
|
-
require('./dom-utils-d4790328.js');
|
12
|
-
require('./event-utils-9bfcf3c5.js');
|
13
|
-
|
14
|
-
const AtomicSearchBoxQuerySuggestions = class {
|
15
|
-
constructor(hostRef) {
|
16
|
-
index.registerInstance(this, hostRef);
|
17
|
-
this.error = undefined;
|
18
|
-
this.icon = undefined;
|
19
|
-
this.maxWithQuery = undefined;
|
20
|
-
this.maxWithoutQuery = undefined;
|
21
|
-
}
|
22
|
-
componentWillLoad() {
|
23
|
-
try {
|
24
|
-
suggestionsEvents.dispatchSearchBoxSuggestionsEvent((bindings) => {
|
25
|
-
this.bindings = bindings;
|
26
|
-
return this.initialize();
|
27
|
-
}, this.host, ['atomic-search-box']);
|
28
|
-
}
|
29
|
-
catch (error) {
|
30
|
-
this.error = error;
|
31
|
-
}
|
32
|
-
}
|
33
|
-
initialize() {
|
34
|
-
const engine = this.bindings.engine;
|
35
|
-
const { registerQuerySuggest, fetchQuerySuggestions } = headless.loadQuerySuggestActions(engine);
|
36
|
-
engine.dispatch(registerQuerySuggest({
|
37
|
-
id: this.bindings.id,
|
38
|
-
count: this.bindings.numberOfQueries,
|
39
|
-
}));
|
40
|
-
return {
|
41
|
-
position: Array.from(this.host.parentNode.children).indexOf(this.host),
|
42
|
-
onInput: () => engine.dispatch(fetchQuerySuggestions({
|
43
|
-
id: this.bindings.id,
|
44
|
-
})),
|
45
|
-
renderItems: () => this.renderItems(),
|
46
|
-
};
|
47
|
-
}
|
48
|
-
renderItems() {
|
49
|
-
const hasQuery = this.bindings.searchBoxController.state.value !== '';
|
50
|
-
const max = hasQuery ? this.maxWithQuery : this.maxWithoutQuery;
|
51
|
-
return this.bindings.searchBoxController.state.suggestions
|
52
|
-
.slice(0, max)
|
53
|
-
.map((suggestion) => this.renderItem(suggestion));
|
54
|
-
}
|
55
|
-
renderItem(suggestion) {
|
56
|
-
const hasQuery = this.bindings.searchBoxController.state.value !== '';
|
57
|
-
const partialItem = stencilQuerySuggestions.getPartialSearchBoxSuggestionElement(suggestion, this.bindings.i18n);
|
58
|
-
return {
|
59
|
-
...partialItem,
|
60
|
-
content: (index.h(stencilQuerySuggestions.QuerySuggestionContainer, null, index.h(stencilQuerySuggestions.QuerySuggestionIcon, { icon: this.icon || search.SearchIcon, hasSuggestion: this.bindings.getSuggestions().length > 1 }), index.h(stencilQuerySuggestions.QuerySuggestionText, { suggestion: suggestion, hasQuery: hasQuery }))),
|
61
|
-
onSelect: () => {
|
62
|
-
this.bindings.searchBoxController.selectSuggestion(suggestion.rawValue);
|
63
|
-
},
|
64
|
-
};
|
65
|
-
}
|
66
|
-
render() {
|
67
|
-
if (this.error) {
|
68
|
-
return (index.h("atomic-component-error", { key: 'd8ace632cbbd5924ed771125cea0b395b021fe3e', element: this.host, error: this.error }));
|
69
|
-
}
|
70
|
-
}
|
71
|
-
get host() { return index.getElement(this); }
|
72
|
-
};
|
73
|
-
|
74
|
-
exports.atomic_search_box_query_suggestions = AtomicSearchBoxQuerySuggestions;
|
75
|
-
|
76
|
-
//# sourceMappingURL=atomic-search-box-query-suggestions.cjs.entry.js.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"file":"atomic-search-box-query-suggestions.entry.cjs.js","mappings":";;;;;;;;;;;;;MA8Ba,+BAA+B;;;;;;;;IAwB1C,iBAAiB;QACf,IAAI;YACFA,mDAAiC,CAC/B,CAAC,QAAQ;gBACP,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC;gBACzB,OAAO,IAAI,CAAC,UAAU,EAAE,CAAC;aAC1B,EACD,IAAI,CAAC,IAAI,EACT,CAAC,mBAAmB,CAAC,CACtB,CAAC;SACH;QAAC,OAAO,KAAK,EAAE;YACd,IAAI,CAAC,KAAK,GAAG,KAAc,CAAC;SAC7B;KACF;IAEO,UAAU;QAChB,MAAM,MAAM,GAAG,IAAI,CAAC,QAAQ,CAAC,MAG3B,CAAC;QACH,MAAM,EAAC,oBAAoB,EAAE,qBAAqB,EAAC,GACjDC,gCAAuB,CAAC,MAAM,CAAC,CAAC;QAElC,MAAM,CAAC,QAAQ,CACb,oBAAoB,CAAC;YACnB,EAAE,EAAE,IAAI,CAAC,QAAQ,CAAC,EAAE;YACpB,KAAK,EAAE,IAAI,CAAC,QAAQ,CAAC,eAAe;SACrC,CAAC,CACH,CAAC;QAEF,OAAO;YACL,QAAQ,EAAE,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,UAAW,CAAC,QAAQ,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC;YACvE,OAAO,EAAE,MACP,MAAM,CAAC,QAAQ,CACb,qBAAqB,CAAC;gBACpB,EAAE,EAAE,IAAI,CAAC,QAAQ,CAAC,EAAE;aACrB,CAAC,CACH;YACH,WAAW,EAAE,MAAM,IAAI,CAAC,WAAW,EAAE;SACtC,CAAC;KACH;IAEO,WAAW;QACjB,MAAM,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,mBAAmB,CAAC,KAAK,CAAC,KAAK,KAAK,EAAE,CAAC;QACtE,MAAM,GAAG,GAAG,QAAQ,GAAG,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,eAAe,CAAC;QAChE,OAAO,IAAI,CAAC,QAAQ,CAAC,mBAAmB,CAAC,KAAK,CAAC,WAAW;aACvD,KAAK,CAAC,CAAC,EAAE,GAAG,CAAC;aACb,GAAG,CAAC,CAAC,UAAU,KAAK,IAAI,CAAC,UAAU,CAAC,UAAU,CAAC,CAAC,CAAC;KACrD;IAEO,UAAU,CAAC,UAAsB;QACvC,MAAM,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,mBAAmB,CAAC,KAAK,CAAC,KAAK,KAAK,EAAE,CAAC;QACtE,MAAM,WAAW,GAAGC,4DAAoC,CACtD,UAAU,EACV,IAAI,CAAC,QAAQ,CAAC,IAAI,CACnB,CAAC;QAEF,OAAO;YACL,GAAG,WAAW;YACd,OAAO,GACLC,QAACC,gDAAwB,QACvBD,QAACE,2CAAmB,IAClB,IAAI,EAAE,IAAI,CAAC,IAAI,IAAIC,iBAAU,EAC7B,aAAa,EAAE,IAAI,CAAC,QAAQ,CAAC,cAAc,EAAE,CAAC,MAAM,GAAG,CAAC,GACxD,EAEFH,QAACI,2CAAmB,IAAC,UAAU,EAAE,UAAU,EAAE,QAAQ,EAAE,QAAQ,GAAI,CAC1C,CAC5B;YACD,QAAQ,EAAE;gBACR,IAAI,CAAC,QAAQ,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC;aACzE;SACF,CAAC;KACH;IAEM,MAAM;QACX,IAAI,IAAI,CAAC,KAAK,EAAE;YACd,QACEJ,qFACE,OAAO,EAAE,IAAI,CAAC,IAAI,EAClB,KAAK,EAAE,IAAI,CAAC,KAAK,GACO,EAC1B;SACH;KACF;;;;;;","names":["dispatchSearchBoxSuggestionsEvent","loadQuerySuggestActions","getPartialSearchBoxSuggestionElement","h","QuerySuggestionContainer","QuerySuggestionIcon","SearchIcon","QuerySuggestionText"],"sources":["src/components/search/search-box-suggestions/atomic-search-box-query-suggestions/atomic-search-box-query-suggestions.tsx"],"sourcesContent":["import {\n loadQuerySuggestActions,\n SearchBox,\n SearchEngine,\n Suggestion,\n} from '@coveo/headless';\nimport {Component, Element, Prop, State, h} from '@stencil/core';\nimport SearchIcon from '../../../../images/search.svg';\nimport {\n getPartialSearchBoxSuggestionElement,\n QuerySuggestionContainer,\n QuerySuggestionIcon,\n QuerySuggestionText,\n} from '../../../common/suggestions/stencil-query-suggestions';\nimport {\n dispatchSearchBoxSuggestionsEvent,\n} from '../../../common/suggestions/suggestions-events';\nimport type {\n SearchBoxSuggestionElement,\n SearchBoxSuggestions,\n SearchBoxSuggestionsBindings,\n} from '../../../common/suggestions/suggestions-types';\n\n/**\n * The `atomic-search-box-query-suggestions` component can be added as a child of an `atomic-search-box` component, allowing for the configuration of query suggestion behavior.\n */\n@Component({\n tag: 'atomic-search-box-query-suggestions',\n shadow: true,\n})\nexport class AtomicSearchBoxQuerySuggestions {\n private bindings!: SearchBoxSuggestionsBindings<SearchBox>;\n @Element() private host!: HTMLElement;\n\n @State() public error!: Error;\n\n /**\n * The SVG icon to display.\n *\n * - Use a value that starts with `http://`, `https://`, `./`, or `../`, to fetch and display an icon from a given location.\n * - Use a value that starts with `assets://`, to display an icon from the Atomic package.\n * - Use a stringified SVG to display it directly.\n */\n @Prop() public icon?: string;\n\n /**\n * The maximum number of suggestions that will be displayed if the user has typed something into the input field.\n */\n @Prop({reflect: true}) public maxWithQuery?: number;\n /**\n * The maximum number of suggestions that will be displayed initially when the input field is empty.\n */\n @Prop({reflect: true}) public maxWithoutQuery?: number;\n\n componentWillLoad() {\n try {\n dispatchSearchBoxSuggestionsEvent<SearchBox>(\n (bindings) => {\n this.bindings = bindings;\n return this.initialize();\n },\n this.host,\n ['atomic-search-box']\n );\n } catch (error) {\n this.error = error as Error;\n }\n }\n\n private initialize(): SearchBoxSuggestions {\n const engine = this.bindings.engine as SearchEngine<{\n querySet: string;\n querySuggest: string;\n }>;\n const {registerQuerySuggest, fetchQuerySuggestions} =\n loadQuerySuggestActions(engine);\n\n engine.dispatch(\n registerQuerySuggest({\n id: this.bindings.id,\n count: this.bindings.numberOfQueries,\n })\n );\n\n return {\n position: Array.from(this.host.parentNode!.children).indexOf(this.host),\n onInput: () =>\n engine.dispatch(\n fetchQuerySuggestions({\n id: this.bindings.id,\n })\n ),\n renderItems: () => this.renderItems(),\n };\n }\n\n private renderItems(): SearchBoxSuggestionElement[] {\n const hasQuery = this.bindings.searchBoxController.state.value !== '';\n const max = hasQuery ? this.maxWithQuery : this.maxWithoutQuery;\n return this.bindings.searchBoxController.state.suggestions\n .slice(0, max)\n .map((suggestion) => this.renderItem(suggestion));\n }\n\n private renderItem(suggestion: Suggestion) {\n const hasQuery = this.bindings.searchBoxController.state.value !== '';\n const partialItem = getPartialSearchBoxSuggestionElement(\n suggestion,\n this.bindings.i18n\n );\n\n return {\n ...partialItem,\n content: (\n <QuerySuggestionContainer>\n <QuerySuggestionIcon\n icon={this.icon || SearchIcon}\n hasSuggestion={this.bindings.getSuggestions().length > 1}\n />\n\n <QuerySuggestionText suggestion={suggestion} hasQuery={hasQuery} />\n </QuerySuggestionContainer>\n ),\n onSelect: () => {\n this.bindings.searchBoxController.selectSuggestion(suggestion.rawValue);\n },\n };\n }\n\n public render() {\n if (this.error) {\n return (\n <atomic-component-error\n element={this.host}\n error={this.error}\n ></atomic-component-error>\n );\n }\n }\n}\n"],"version":3}
|
@@ -1,7 +0,0 @@
|
|
1
|
-
'use strict';
|
2
|
-
|
3
|
-
const Clockicon = `<svg fill="none" stroke="currentColor" stroke-linejoin="round" stroke-linecap="round" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><circle cx="8" cy="8" r="7.5"/><path d="m8.5 4.5v4"/><path d="m10.3066 10.1387-1.80932-1.5768"/></svg>`;
|
4
|
-
|
5
|
-
exports.Clockicon = Clockicon;
|
6
|
-
|
7
|
-
//# sourceMappingURL=clock-7aeb19d0.js.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"file":"clock-7aeb19d0.js","mappings":";;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}
|
@@ -1,72 +0,0 @@
|
|
1
|
-
import { r as registerInstance, h, g as getElement } from './index-3f35faca.js';
|
2
|
-
import { loadQuerySuggestActions } from '@coveo/headless';
|
3
|
-
import { S as SearchIcon } from './search-64cc84a9.js';
|
4
|
-
import { g as getPartialSearchBoxSuggestionElement, Q as QuerySuggestionText, a as QuerySuggestionIcon, b as QuerySuggestionContainer } from './stencil-query-suggestions-5d6a46d7.js';
|
5
|
-
import { d as dispatchSearchBoxSuggestionsEvent } from './suggestions-events-b7a6f007.js';
|
6
|
-
import './string-utils-5f5a23a8.js';
|
7
|
-
import './dom-utils-f6086cd3.js';
|
8
|
-
import './event-utils-8de63ec3.js';
|
9
|
-
|
10
|
-
const AtomicSearchBoxQuerySuggestions = class {
|
11
|
-
constructor(hostRef) {
|
12
|
-
registerInstance(this, hostRef);
|
13
|
-
this.error = undefined;
|
14
|
-
this.icon = undefined;
|
15
|
-
this.maxWithQuery = undefined;
|
16
|
-
this.maxWithoutQuery = undefined;
|
17
|
-
}
|
18
|
-
componentWillLoad() {
|
19
|
-
try {
|
20
|
-
dispatchSearchBoxSuggestionsEvent((bindings) => {
|
21
|
-
this.bindings = bindings;
|
22
|
-
return this.initialize();
|
23
|
-
}, this.host, ['atomic-search-box']);
|
24
|
-
}
|
25
|
-
catch (error) {
|
26
|
-
this.error = error;
|
27
|
-
}
|
28
|
-
}
|
29
|
-
initialize() {
|
30
|
-
const engine = this.bindings.engine;
|
31
|
-
const { registerQuerySuggest, fetchQuerySuggestions } = loadQuerySuggestActions(engine);
|
32
|
-
engine.dispatch(registerQuerySuggest({
|
33
|
-
id: this.bindings.id,
|
34
|
-
count: this.bindings.numberOfQueries,
|
35
|
-
}));
|
36
|
-
return {
|
37
|
-
position: Array.from(this.host.parentNode.children).indexOf(this.host),
|
38
|
-
onInput: () => engine.dispatch(fetchQuerySuggestions({
|
39
|
-
id: this.bindings.id,
|
40
|
-
})),
|
41
|
-
renderItems: () => this.renderItems(),
|
42
|
-
};
|
43
|
-
}
|
44
|
-
renderItems() {
|
45
|
-
const hasQuery = this.bindings.searchBoxController.state.value !== '';
|
46
|
-
const max = hasQuery ? this.maxWithQuery : this.maxWithoutQuery;
|
47
|
-
return this.bindings.searchBoxController.state.suggestions
|
48
|
-
.slice(0, max)
|
49
|
-
.map((suggestion) => this.renderItem(suggestion));
|
50
|
-
}
|
51
|
-
renderItem(suggestion) {
|
52
|
-
const hasQuery = this.bindings.searchBoxController.state.value !== '';
|
53
|
-
const partialItem = getPartialSearchBoxSuggestionElement(suggestion, this.bindings.i18n);
|
54
|
-
return {
|
55
|
-
...partialItem,
|
56
|
-
content: (h(QuerySuggestionContainer, null, h(QuerySuggestionIcon, { icon: this.icon || SearchIcon, hasSuggestion: this.bindings.getSuggestions().length > 1 }), h(QuerySuggestionText, { suggestion: suggestion, hasQuery: hasQuery }))),
|
57
|
-
onSelect: () => {
|
58
|
-
this.bindings.searchBoxController.selectSuggestion(suggestion.rawValue);
|
59
|
-
},
|
60
|
-
};
|
61
|
-
}
|
62
|
-
render() {
|
63
|
-
if (this.error) {
|
64
|
-
return (h("atomic-component-error", { key: 'd8ace632cbbd5924ed771125cea0b395b021fe3e', element: this.host, error: this.error }));
|
65
|
-
}
|
66
|
-
}
|
67
|
-
get host() { return getElement(this); }
|
68
|
-
};
|
69
|
-
|
70
|
-
export { AtomicSearchBoxQuerySuggestions as atomic_search_box_query_suggestions };
|
71
|
-
|
72
|
-
//# sourceMappingURL=atomic-search-box-query-suggestions.entry.js.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"file":"atomic-search-box-query-suggestions.entry.js","mappings":";;;;;;;;;MA8Ba,+BAA+B;;;;;;;;IAwB1C,iBAAiB;QACf,IAAI;YACF,iCAAiC,CAC/B,CAAC,QAAQ;gBACP,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC;gBACzB,OAAO,IAAI,CAAC,UAAU,EAAE,CAAC;aAC1B,EACD,IAAI,CAAC,IAAI,EACT,CAAC,mBAAmB,CAAC,CACtB,CAAC;SACH;QAAC,OAAO,KAAK,EAAE;YACd,IAAI,CAAC,KAAK,GAAG,KAAc,CAAC;SAC7B;KACF;IAEO,UAAU;QAChB,MAAM,MAAM,GAAG,IAAI,CAAC,QAAQ,CAAC,MAG3B,CAAC;QACH,MAAM,EAAC,oBAAoB,EAAE,qBAAqB,EAAC,GACjD,uBAAuB,CAAC,MAAM,CAAC,CAAC;QAElC,MAAM,CAAC,QAAQ,CACb,oBAAoB,CAAC;YACnB,EAAE,EAAE,IAAI,CAAC,QAAQ,CAAC,EAAE;YACpB,KAAK,EAAE,IAAI,CAAC,QAAQ,CAAC,eAAe;SACrC,CAAC,CACH,CAAC;QAEF,OAAO;YACL,QAAQ,EAAE,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,UAAW,CAAC,QAAQ,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC;YACvE,OAAO,EAAE,MACP,MAAM,CAAC,QAAQ,CACb,qBAAqB,CAAC;gBACpB,EAAE,EAAE,IAAI,CAAC,QAAQ,CAAC,EAAE;aACrB,CAAC,CACH;YACH,WAAW,EAAE,MAAM,IAAI,CAAC,WAAW,EAAE;SACtC,CAAC;KACH;IAEO,WAAW;QACjB,MAAM,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,mBAAmB,CAAC,KAAK,CAAC,KAAK,KAAK,EAAE,CAAC;QACtE,MAAM,GAAG,GAAG,QAAQ,GAAG,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,eAAe,CAAC;QAChE,OAAO,IAAI,CAAC,QAAQ,CAAC,mBAAmB,CAAC,KAAK,CAAC,WAAW;aACvD,KAAK,CAAC,CAAC,EAAE,GAAG,CAAC;aACb,GAAG,CAAC,CAAC,UAAU,KAAK,IAAI,CAAC,UAAU,CAAC,UAAU,CAAC,CAAC,CAAC;KACrD;IAEO,UAAU,CAAC,UAAsB;QACvC,MAAM,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,mBAAmB,CAAC,KAAK,CAAC,KAAK,KAAK,EAAE,CAAC;QACtE,MAAM,WAAW,GAAG,oCAAoC,CACtD,UAAU,EACV,IAAI,CAAC,QAAQ,CAAC,IAAI,CACnB,CAAC;QAEF,OAAO;YACL,GAAG,WAAW;YACd,OAAO,GACL,EAAC,wBAAwB,QACvB,EAAC,mBAAmB,IAClB,IAAI,EAAE,IAAI,CAAC,IAAI,IAAI,UAAU,EAC7B,aAAa,EAAE,IAAI,CAAC,QAAQ,CAAC,cAAc,EAAE,CAAC,MAAM,GAAG,CAAC,GACxD,EAEF,EAAC,mBAAmB,IAAC,UAAU,EAAE,UAAU,EAAE,QAAQ,EAAE,QAAQ,GAAI,CAC1C,CAC5B;YACD,QAAQ,EAAE;gBACR,IAAI,CAAC,QAAQ,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC;aACzE;SACF,CAAC;KACH;IAEM,MAAM;QACX,IAAI,IAAI,CAAC,KAAK,EAAE;YACd,QACE,+EACE,OAAO,EAAE,IAAI,CAAC,IAAI,EAClB,KAAK,EAAE,IAAI,CAAC,KAAK,GACO,EAC1B;SACH;KACF;;;;;;","names":[],"sources":["src/components/search/search-box-suggestions/atomic-search-box-query-suggestions/atomic-search-box-query-suggestions.tsx"],"sourcesContent":["import {\n loadQuerySuggestActions,\n SearchBox,\n SearchEngine,\n Suggestion,\n} from '@coveo/headless';\nimport {Component, Element, Prop, State, h} from '@stencil/core';\nimport SearchIcon from '../../../../images/search.svg';\nimport {\n getPartialSearchBoxSuggestionElement,\n QuerySuggestionContainer,\n QuerySuggestionIcon,\n QuerySuggestionText,\n} from '../../../common/suggestions/stencil-query-suggestions';\nimport {\n dispatchSearchBoxSuggestionsEvent,\n} from '../../../common/suggestions/suggestions-events';\nimport type {\n SearchBoxSuggestionElement,\n SearchBoxSuggestions,\n SearchBoxSuggestionsBindings,\n} from '../../../common/suggestions/suggestions-types';\n\n/**\n * The `atomic-search-box-query-suggestions` component can be added as a child of an `atomic-search-box` component, allowing for the configuration of query suggestion behavior.\n */\n@Component({\n tag: 'atomic-search-box-query-suggestions',\n shadow: true,\n})\nexport class AtomicSearchBoxQuerySuggestions {\n private bindings!: SearchBoxSuggestionsBindings<SearchBox>;\n @Element() private host!: HTMLElement;\n\n @State() public error!: Error;\n\n /**\n * The SVG icon to display.\n *\n * - Use a value that starts with `http://`, `https://`, `./`, or `../`, to fetch and display an icon from a given location.\n * - Use a value that starts with `assets://`, to display an icon from the Atomic package.\n * - Use a stringified SVG to display it directly.\n */\n @Prop() public icon?: string;\n\n /**\n * The maximum number of suggestions that will be displayed if the user has typed something into the input field.\n */\n @Prop({reflect: true}) public maxWithQuery?: number;\n /**\n * The maximum number of suggestions that will be displayed initially when the input field is empty.\n */\n @Prop({reflect: true}) public maxWithoutQuery?: number;\n\n componentWillLoad() {\n try {\n dispatchSearchBoxSuggestionsEvent<SearchBox>(\n (bindings) => {\n this.bindings = bindings;\n return this.initialize();\n },\n this.host,\n ['atomic-search-box']\n );\n } catch (error) {\n this.error = error as Error;\n }\n }\n\n private initialize(): SearchBoxSuggestions {\n const engine = this.bindings.engine as SearchEngine<{\n querySet: string;\n querySuggest: string;\n }>;\n const {registerQuerySuggest, fetchQuerySuggestions} =\n loadQuerySuggestActions(engine);\n\n engine.dispatch(\n registerQuerySuggest({\n id: this.bindings.id,\n count: this.bindings.numberOfQueries,\n })\n );\n\n return {\n position: Array.from(this.host.parentNode!.children).indexOf(this.host),\n onInput: () =>\n engine.dispatch(\n fetchQuerySuggestions({\n id: this.bindings.id,\n })\n ),\n renderItems: () => this.renderItems(),\n };\n }\n\n private renderItems(): SearchBoxSuggestionElement[] {\n const hasQuery = this.bindings.searchBoxController.state.value !== '';\n const max = hasQuery ? this.maxWithQuery : this.maxWithoutQuery;\n return this.bindings.searchBoxController.state.suggestions\n .slice(0, max)\n .map((suggestion) => this.renderItem(suggestion));\n }\n\n private renderItem(suggestion: Suggestion) {\n const hasQuery = this.bindings.searchBoxController.state.value !== '';\n const partialItem = getPartialSearchBoxSuggestionElement(\n suggestion,\n this.bindings.i18n\n );\n\n return {\n ...partialItem,\n content: (\n <QuerySuggestionContainer>\n <QuerySuggestionIcon\n icon={this.icon || SearchIcon}\n hasSuggestion={this.bindings.getSuggestions().length > 1}\n />\n\n <QuerySuggestionText suggestion={suggestion} hasQuery={hasQuery} />\n </QuerySuggestionContainer>\n ),\n onSelect: () => {\n this.bindings.searchBoxController.selectSuggestion(suggestion.rawValue);\n },\n };\n }\n\n public render() {\n if (this.error) {\n return (\n <atomic-component-error\n element={this.host}\n error={this.error}\n ></atomic-component-error>\n );\n }\n }\n}\n"],"version":3}
|
@@ -1,5 +0,0 @@
|
|
1
|
-
const Clockicon = `<svg fill="none" stroke="currentColor" stroke-linejoin="round" stroke-linecap="round" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><circle cx="8" cy="8" r="7.5"/><path d="m8.5 4.5v4"/><path d="m10.3066 10.1387-1.80932-1.5768"/></svg>`;
|
2
|
-
|
3
|
-
export { Clockicon as C };
|
4
|
-
|
5
|
-
//# sourceMappingURL=clock-b1f5d7f7.js.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"file":"clock-b1f5d7f7.js","mappings":";;;;","names":[],"sources":[],"sourcesContent":[],"version":3}
|
@@ -1,45 +0,0 @@
|
|
1
|
-
import { type SearchBox } from '@coveo/headless';
|
2
|
-
import { LitElement } from 'lit';
|
3
|
-
import type { SearchBoxSuggestionsComponent } from "../../../decorators/types";
|
4
|
-
import type { SearchBoxSuggestions, SearchBoxSuggestionsBindings } from '../../common/suggestions/suggestions-types';
|
5
|
-
import type { Bindings } from '../atomic-search-interface/interfaces';
|
6
|
-
/**
|
7
|
-
* The `atomic-search-box-recent-queries` component can be added as a child of an `atomic-search-box` component, allowing for the configuration of recent query suggestions.
|
8
|
-
*/
|
9
|
-
export declare class AtomicSearchBoxRecentQueries extends LitElement implements SearchBoxSuggestionsComponent<Bindings> {
|
10
|
-
bindings: SearchBoxSuggestionsBindings<SearchBox, Bindings>;
|
11
|
-
private recentQueriesList;
|
12
|
-
private storage;
|
13
|
-
error: Error;
|
14
|
-
/**
|
15
|
-
* The SVG icon to display.
|
16
|
-
*
|
17
|
-
* - Use a value that starts with `http://`, `https://`, `./`, or `../`, to fetch and display an icon from a given location.
|
18
|
-
* - Use a value that starts with `assets://`, to display an icon from the Atomic package.
|
19
|
-
* - Use a stringified SVG to display it directly.
|
20
|
-
*/
|
21
|
-
icon?: string;
|
22
|
-
/**
|
23
|
-
* The maximum number of suggestions to display when the user types in the input field.
|
24
|
-
*/
|
25
|
-
maxWithQuery: number;
|
26
|
-
/**
|
27
|
-
* The maximum number of suggestions to display initially, when the input field is empty.
|
28
|
-
*/
|
29
|
-
maxWithoutQuery?: number;
|
30
|
-
connectedCallback(): void;
|
31
|
-
initialize(): SearchBoxSuggestions;
|
32
|
-
private retrieveLocalStorage;
|
33
|
-
private updateLocalStorage;
|
34
|
-
private warnUser;
|
35
|
-
private disableFeature;
|
36
|
-
private renderItems;
|
37
|
-
private renderClear;
|
38
|
-
private renderItem;
|
39
|
-
render(): import("lit-html").TemplateResult<1>;
|
40
|
-
}
|
41
|
-
declare global {
|
42
|
-
interface HTMLElementTagNameMap {
|
43
|
-
'atomic-search-box-recent-queries': AtomicSearchBoxRecentQueries;
|
44
|
-
}
|
45
|
-
}
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|