@coveo/atomic 3.33.8-pre.f62f2d7753 → 3.33.8-pre.f82c4ba7d3

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 (120) hide show
  1. package/dist/atomic/_atomic.esm.js +1 -1
  2. package/dist/atomic/atomic.esm.js.map +1 -1
  3. package/dist/atomic/components/_index.d.ts +2 -2
  4. package/dist/atomic/components/_index.js +1 -1
  5. package/dist/atomic/components/analytics-config.js +1 -1
  6. package/dist/atomic/components/atomic-insight-history-toggle.js +2 -2
  7. package/dist/atomic/components/atomic-insight-history-toggle.js.map +1 -1
  8. package/dist/atomic/components/atomic-insight-search-box.js +2 -29
  9. package/dist/atomic/components/atomic-insight-search-box.js.map +1 -1
  10. package/dist/atomic/components/atomic-insight-user-actions-toggle.js +2 -2
  11. package/dist/atomic/components/atomic-insight-user-actions-toggle.js.map +1 -1
  12. package/dist/atomic/components/atomic-search-box-query-suggestions.d.ts +11 -0
  13. package/dist/atomic/components/atomic-search-box-query-suggestions.js +8 -0
  14. package/dist/atomic/components/atomic-search-box-query-suggestions.js.map +1 -0
  15. package/dist/atomic/components/atomic-search-box-query-suggestions2.js +89 -0
  16. package/dist/atomic/components/atomic-search-box-query-suggestions2.js.map +1 -0
  17. package/dist/atomic/components/atomic-search-box.js +3 -3
  18. package/dist/atomic/components/clock.js +2 -2
  19. package/dist/atomic/components/components/commerce/atomic-commerce-breadbox/atomic-commerce-breadbox.js +18 -11
  20. package/dist/atomic/components/components/commerce/atomic-commerce-interface/atomic-commerce-interface.js +2 -7
  21. package/dist/atomic/components/components/commerce/atomic-commerce-layout/atomic-commerce-layout.js +19 -10
  22. package/dist/atomic/components/components/common/layout/layout-styles-controller.js +40 -0
  23. package/dist/atomic/components/components/common/layout/mobile-breakpoint-controller.js +26 -0
  24. package/dist/atomic/components/components/search/atomic-search-box-recent-queries/atomic-search-box-recent-queries.js +137 -0
  25. package/dist/atomic/components/components/search/index.js +1 -1
  26. package/dist/atomic/components/components/search/lazy-index.js +1 -1
  27. package/dist/atomic/components/global/environment.js +1 -1
  28. package/dist/atomic/components/stencil-query-suggestions.js +33 -0
  29. package/dist/atomic/components/stencil-query-suggestions.js.map +1 -0
  30. package/dist/atomic/{p-e5352270.entry.js → p-0ce38b0d.entry.js} +2 -2
  31. package/dist/atomic/p-26a51a77.entry.js +2 -0
  32. package/dist/atomic/p-26a51a77.entry.js.map +1 -0
  33. package/dist/atomic/{p-b24d432b.entry.js → p-299555fb.entry.js} +2 -2
  34. package/dist/atomic/p-2e9db4ca.entry.js +2 -0
  35. package/dist/atomic/p-2e9db4ca.entry.js.map +1 -0
  36. package/dist/atomic/{p-b87dbae7.js → p-5bc31a30.js} +2 -2
  37. package/dist/atomic/{p-6e6d686e.entry.js → p-7383fd32.entry.js} +2 -2
  38. package/dist/atomic/{p-9d6b988d.entry.js → p-88d5e178.entry.js} +2 -2
  39. package/dist/atomic/p-af93b44c.js +2 -0
  40. package/dist/atomic/p-af93b44c.js.map +1 -0
  41. package/dist/atomic/{p-6329ff94.entry.js → p-ba4bf29f.entry.js} +2 -2
  42. package/dist/atomic/{p-c280cd05.js → p-e1cc5150.js} +1 -1
  43. package/dist/cjs/_loader.cjs.js +1 -1
  44. package/dist/cjs/{analytics-config-de93a689.js → analytics-config-68dbae8e.js} +2 -2
  45. package/dist/cjs/{analytics-config-de93a689.js.map → analytics-config-68dbae8e.js.map} +1 -1
  46. package/dist/cjs/atomic-insight-history-toggle.cjs.entry.js +2 -2
  47. package/dist/cjs/atomic-insight-history-toggle.cjs.entry.js.map +1 -1
  48. package/dist/cjs/atomic-insight-interface.cjs.entry.js +1 -1
  49. package/dist/cjs/atomic-insight-search-box.cjs.entry.js +4 -30
  50. package/dist/cjs/atomic-insight-search-box.cjs.entry.js.map +1 -1
  51. package/dist/cjs/atomic-insight-user-actions-toggle.cjs.entry.js +2 -2
  52. package/dist/cjs/atomic-insight-user-actions-toggle.cjs.entry.js.map +1 -1
  53. package/dist/cjs/atomic-recs-interface.cjs.entry.js +1 -1
  54. package/dist/cjs/atomic-search-box-query-suggestions.cjs.entry.js +76 -0
  55. package/dist/cjs/atomic-search-box-query-suggestions.cjs.entry.js.map +1 -0
  56. package/dist/cjs/atomic-search-interface.cjs.entry.js +1 -1
  57. package/dist/cjs/atomic.cjs.js +1 -1
  58. package/dist/cjs/clock-7aeb19d0.js +7 -0
  59. package/dist/cjs/clock-7aeb19d0.js.map +1 -0
  60. package/dist/cjs/index-757bc886.js +2 -2
  61. package/dist/cjs/stencil-query-suggestions-03268ecc.js +38 -0
  62. package/dist/cjs/stencil-query-suggestions-03268ecc.js.map +1 -0
  63. package/dist/cjs/version.cjs.js +2 -2
  64. package/dist/esm/_loader.js +1 -1
  65. package/dist/esm/{analytics-config-018337bf.js → analytics-config-18d42f83.js} +2 -2
  66. package/dist/esm/{analytics-config-018337bf.js.map → analytics-config-18d42f83.js.map} +1 -1
  67. package/dist/esm/atomic-insight-history-toggle.entry.js +2 -2
  68. package/dist/esm/atomic-insight-history-toggle.entry.js.map +1 -1
  69. package/dist/esm/atomic-insight-interface.entry.js +1 -1
  70. package/dist/esm/atomic-insight-search-box.entry.js +3 -29
  71. package/dist/esm/atomic-insight-search-box.entry.js.map +1 -1
  72. package/dist/esm/atomic-insight-user-actions-toggle.entry.js +2 -2
  73. package/dist/esm/atomic-insight-user-actions-toggle.entry.js.map +1 -1
  74. package/dist/esm/atomic-recs-interface.entry.js +1 -1
  75. package/dist/esm/atomic-search-box-query-suggestions.entry.js +72 -0
  76. package/dist/esm/atomic-search-box-query-suggestions.entry.js.map +1 -0
  77. package/dist/esm/atomic-search-interface.entry.js +1 -1
  78. package/dist/esm/atomic.js +1 -1
  79. package/dist/esm/clock-b1f5d7f7.js +5 -0
  80. package/dist/esm/clock-b1f5d7f7.js.map +1 -0
  81. package/dist/esm/index-3f35faca.js +2 -2
  82. package/dist/esm/stencil-query-suggestions-5d6a46d7.js +33 -0
  83. package/dist/esm/stencil-query-suggestions-5d6a46d7.js.map +1 -0
  84. package/dist/esm/version.js +2 -2
  85. package/dist/types/components/commerce/atomic-commerce-breadbox/atomic-commerce-breadbox.d.ts +2 -1
  86. package/dist/types/components/commerce/atomic-commerce-interface/atomic-commerce-interface.d.ts +0 -1
  87. package/dist/types/components/commerce/atomic-commerce-layout/atomic-commerce-layout.d.ts +3 -3
  88. package/dist/types/components/common/layout/layout-styles-controller.d.ts +22 -0
  89. package/dist/types/components/common/layout/mobile-breakpoint-controller.d.ts +18 -0
  90. package/dist/types/components/search/{atomic-search-box-query-suggestions/atomic-search-box-query-suggestions.d.ts → atomic-search-box-recent-queries/atomic-search-box-recent-queries.d.ts} +14 -7
  91. package/dist/types/components/search/index.d.ts +1 -1
  92. package/dist/types/components/search/search-box-suggestions/{atomic-search-box-recent-queries/atomic-search-box-recent-queries.d.ts → atomic-search-box-query-suggestions/atomic-search-box-query-suggestions.d.ts} +3 -11
  93. package/dist/types/components.d.ts +14 -14
  94. package/docs/atomic-docs.json +13 -11
  95. package/package.json +3 -3
  96. package/dist/atomic/components/atomic-search-box-recent-queries.d.ts +0 -11
  97. package/dist/atomic/components/atomic-search-box-recent-queries.js +0 -8
  98. package/dist/atomic/components/atomic-search-box-recent-queries.js.map +0 -1
  99. package/dist/atomic/components/atomic-search-box-recent-queries2.js +0 -183
  100. package/dist/atomic/components/atomic-search-box-recent-queries2.js.map +0 -1
  101. package/dist/atomic/components/components/search/atomic-search-box-query-suggestions/atomic-search-box-query-suggestions.js +0 -111
  102. package/dist/atomic/p-7a06a356.entry.js +0 -2
  103. package/dist/atomic/p-7a06a356.entry.js.map +0 -1
  104. package/dist/atomic/p-d2b14ff1.entry.js +0 -2
  105. package/dist/atomic/p-d2b14ff1.entry.js.map +0 -1
  106. package/dist/cjs/atomic-search-box-recent-queries.cjs.entry.js +0 -171
  107. package/dist/cjs/atomic-search-box-recent-queries.cjs.entry.js.map +0 -1
  108. package/dist/cjs/clock-f03ff827.js +0 -7
  109. package/dist/cjs/clock-f03ff827.js.map +0 -1
  110. package/dist/esm/atomic-search-box-recent-queries.entry.js +0 -167
  111. package/dist/esm/atomic-search-box-recent-queries.entry.js.map +0 -1
  112. package/dist/esm/clock-add3e9a5.js +0 -5
  113. package/dist/esm/clock-add3e9a5.js.map +0 -1
  114. /package/dist/atomic/{p-e5352270.entry.js.map → p-0ce38b0d.entry.js.map} +0 -0
  115. /package/dist/atomic/{p-b24d432b.entry.js.map → p-299555fb.entry.js.map} +0 -0
  116. /package/dist/atomic/{p-b87dbae7.js.map → p-5bc31a30.js.map} +0 -0
  117. /package/dist/atomic/{p-6e6d686e.entry.js.map → p-7383fd32.entry.js.map} +0 -0
  118. /package/dist/atomic/{p-9d6b988d.entry.js.map → p-88d5e178.entry.js.map} +0 -0
  119. /package/dist/atomic/{p-6329ff94.entry.js.map → p-ba4bf29f.entry.js.map} +0 -0
  120. /package/dist/atomic/{p-c280cd05.js.map → p-e1cc5150.js.map} +0 -0
@@ -1,5 +1,5 @@
1
1
  {
2
- "timestamp": "2025-09-24T20:06:28",
2
+ "timestamp": "2025-09-26T17:49:39",
3
3
  "compiler": {
4
4
  "name": "@stencil/core",
5
5
  "version": "4.20.0",
@@ -12480,12 +12480,12 @@
12480
12480
  "dependents": [],
12481
12481
  "dependencies": [
12482
12482
  "atomic-suggestion-renderer",
12483
- "atomic-search-box-recent-queries"
12483
+ "atomic-search-box-query-suggestions"
12484
12484
  ],
12485
12485
  "dependencyGraph": {
12486
12486
  "atomic-search-box": [
12487
12487
  "atomic-suggestion-renderer",
12488
- "atomic-search-box-recent-queries"
12488
+ "atomic-search-box-query-suggestions"
12489
12489
  ]
12490
12490
  }
12491
12491
  },
@@ -12707,10 +12707,10 @@
12707
12707
  }
12708
12708
  },
12709
12709
  {
12710
- "filePath": "src/components/search/search-box-suggestions/atomic-search-box-recent-queries/atomic-search-box-recent-queries.tsx",
12710
+ "filePath": "src/components/search/search-box-suggestions/atomic-search-box-query-suggestions/atomic-search-box-query-suggestions.tsx",
12711
12711
  "encapsulation": "shadow",
12712
- "tag": "atomic-search-box-recent-queries",
12713
- "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.",
12712
+ "tag": "atomic-search-box-query-suggestions",
12713
+ "docs": "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.",
12714
12714
  "docsTags": [],
12715
12715
  "usage": {},
12716
12716
  "props": [
@@ -12740,10 +12740,10 @@
12740
12740
  },
12741
12741
  {
12742
12742
  "name": "maxWithQuery",
12743
- "type": "number",
12743
+ "type": "number | undefined",
12744
12744
  "complexType": {
12745
12745
  "original": "number",
12746
- "resolved": "number",
12746
+ "resolved": "number | undefined",
12747
12747
  "references": {}
12748
12748
  },
12749
12749
  "mutable": false,
@@ -12751,13 +12751,15 @@
12751
12751
  "reflectToAttr": true,
12752
12752
  "docs": "The maximum number of suggestions that will be displayed if the user has typed something into the input field.",
12753
12753
  "docsTags": [],
12754
- "default": "3",
12755
12754
  "values": [
12756
12755
  {
12757
12756
  "type": "number"
12757
+ },
12758
+ {
12759
+ "type": "undefined"
12758
12760
  }
12759
12761
  ],
12760
- "optional": false,
12762
+ "optional": true,
12761
12763
  "required": false
12762
12764
  },
12763
12765
  {
@@ -12797,7 +12799,7 @@
12797
12799
  "dependencies": [],
12798
12800
  "dependencyGraph": {
12799
12801
  "atomic-search-box": [
12800
- "atomic-search-box-recent-queries"
12802
+ "atomic-search-box-query-suggestions"
12801
12803
  ]
12802
12804
  }
12803
12805
  },
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@coveo/atomic",
3
3
  "type": "module",
4
- "version": "3.33.8-pre.f62f2d7753",
4
+ "version": "3.33.8-pre.f82c4ba7d3",
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": {
@@ -81,7 +81,7 @@
81
81
  },
82
82
  "dependencies": {
83
83
  "@coveo/bueno": "1.1.2",
84
- "@coveo/headless": "3.31.1-pre.f62f2d7753",
84
+ "@coveo/headless": "3.31.1-pre.f82c4ba7d3",
85
85
  "@lit/context": "1.1.6",
86
86
  "@open-wc/lit-helpers": "0.7.0",
87
87
  "@popperjs/core": "2.11.8",
@@ -153,7 +153,7 @@
153
153
  },
154
154
  "peerDependencies": {
155
155
  "@coveo/bueno": "1.1.2",
156
- "@coveo/headless": "3.31.1-pre.f62f2d7753",
156
+ "@coveo/headless": "3.31.1-pre.f82c4ba7d3",
157
157
  "typescript": ">=5.0.0"
158
158
  },
159
159
  "peerDependenciesMeta": {
@@ -1,11 +0,0 @@
1
- import type { Components, JSX } from "../../types/components";
2
-
3
- interface AtomicSearchBoxRecentQueries extends Components.AtomicSearchBoxRecentQueries, HTMLElement {}
4
- export const AtomicSearchBoxRecentQueries: {
5
- prototype: AtomicSearchBoxRecentQueries;
6
- new (): AtomicSearchBoxRecentQueries;
7
- };
8
- /**
9
- * Used to define this component and all nested components recursively.
10
- */
11
- export const defineCustomElement: () => void;
@@ -1,8 +0,0 @@
1
- import { A as AtomicSearchBoxRecentQueries$1, d as defineCustomElement$1 } from './atomic-search-box-recent-queries2.js';
2
-
3
- const AtomicSearchBoxRecentQueries = AtomicSearchBoxRecentQueries$1;
4
- const defineCustomElement = defineCustomElement$1;
5
-
6
- export { AtomicSearchBoxRecentQueries, defineCustomElement };
7
-
8
- //# sourceMappingURL=atomic-search-box-recent-queries.js.map
@@ -1 +0,0 @@
1
- {"file":"atomic-search-box-recent-queries.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}
@@ -1,183 +0,0 @@
1
- import { h, proxyCustomElement, HTMLElement } from '@stencil/core/internal/client';
2
- import { HighlightUtils, buildRecentQueriesList } from '@coveo/headless';
3
- import { C as Clock } from './clock.js';
4
- import { a as SafeStorage, S as StorageItems } from './local-storage-utils.js';
5
- import { o as once } from './utils.js';
6
- import { e as encodeForDomAttribute } from './string-utils.js';
7
- import { d as dispatchSearchBoxSuggestionsEvent } from './suggestions-events.js';
8
-
9
- const getPartialRecentQueryElement = (value, i18n) => {
10
- return {
11
- part: 'recent-query-item',
12
- query: value,
13
- key: `recent-${encodeForDomAttribute(value)}`,
14
- ariaLabel: i18n.t('recent-query-suggestion-label', {
15
- query: value,
16
- interpolation: { escapeValue: false },
17
- }),
18
- };
19
- };
20
- const getPartialRecentQueryClearElement = (i18n) => {
21
- return {
22
- key: 'recent-query-clear',
23
- ariaLabel: i18n.t('clear-recent-searches', {
24
- interpolation: { escapeValue: false },
25
- }),
26
- part: 'recent-query-title-item suggestion-divider',
27
- hideIfLast: true,
28
- };
29
- };
30
- const RecentQueriesContainer = (_, children) => {
31
- return (h("div", { part: "recent-query-content", class: "flex items-center text-left break-all" }, children));
32
- };
33
- const RecentQueryIcon = ({ icon, }) => {
34
- return (h("atomic-icon", { part: "recent-query-icon", icon: icon, class: "mr-2 h-4 w-4 shrink-0" }));
35
- };
36
- const RecentQueryText = ({ query, value, }) => {
37
- if (query === '') {
38
- return (h("span", { part: "recent-query-text", class: "line-clamp-2 break-all" }, value));
39
- }
40
- return (h("span", { part: "recent-query-text", class: "line-clamp-2 break-all", innerHTML: HighlightUtils.highlightString({
41
- content: value,
42
- openingDelimiter: '<span part="recent-query-text-highlight" class="font-bold">',
43
- closingDelimiter: '</span>',
44
- highlights: [
45
- {
46
- offset: query.length,
47
- length: value.length - query.length,
48
- },
49
- ],
50
- }) }));
51
- };
52
- const RecentQueryClear = ({ i18n, }) => {
53
- return (h("div", { part: "recent-query-title-content", class: "flex w-full justify-between" },
54
- h("span", { class: "font-bold", part: "recent-query-title" }, i18n.t('recent-searches')),
55
- h("span", { part: "recent-query-clear" }, i18n.t('clear'))));
56
- };
57
-
58
- const AtomicSearchBoxRecentQueries = /*@__PURE__*/ proxyCustomElement(class AtomicSearchBoxRecentQueries extends HTMLElement {
59
- constructor() {
60
- super();
61
- this.__registerHost();
62
- this.__attachShadow();
63
- /**
64
- * The maximum number of suggestions that will be displayed if the user has typed something into the input field.
65
- */
66
- this.maxWithQuery = 3;
67
- this.warnUser = once(() => this.bindings.engine.logger.warn('Because analytics are disabled, the recent queries feature is deactivated.'));
68
- this.error = undefined;
69
- this.icon = undefined;
70
- this.maxWithQuery = 3;
71
- this.maxWithoutQuery = undefined;
72
- }
73
- componentWillLoad() {
74
- try {
75
- dispatchSearchBoxSuggestionsEvent((bindings) => {
76
- this.bindings = bindings;
77
- return this.initialize();
78
- }, this.host, ['atomic-search-box']);
79
- }
80
- catch (error) {
81
- this.error = error;
82
- }
83
- }
84
- renderIcon() {
85
- return this.icon || Clock;
86
- }
87
- initialize() {
88
- this.storage = new SafeStorage();
89
- this.recentQueriesList = buildRecentQueriesList(this.bindings.engine, {
90
- initialState: { queries: this.retrieveLocalStorage() },
91
- options: { maxLength: 1000, clearFilters: this.bindings.clearFilters },
92
- });
93
- this.recentQueriesList.subscribe(() => this.updateLocalStorage());
94
- return {
95
- position: Array.from(this.host.parentNode.children).indexOf(this.host),
96
- renderItems: () => this.renderItems(),
97
- };
98
- }
99
- retrieveLocalStorage() {
100
- return this.storage.getParsedJSON(StorageItems.RECENT_QUERIES, []);
101
- }
102
- updateLocalStorage() {
103
- if (!this.recentQueriesList.state.analyticsEnabled) {
104
- return this.disableFeature();
105
- }
106
- return this.storage.setJSON(StorageItems.RECENT_QUERIES, this.recentQueriesList.state.queries);
107
- }
108
- disableFeature() {
109
- this.warnUser();
110
- this.storage.removeItem(StorageItems.RECENT_QUERIES);
111
- }
112
- renderItems() {
113
- if (!this.recentQueriesList.state.analyticsEnabled) {
114
- return [];
115
- }
116
- const query = this.bindings.searchBoxController.state.value;
117
- const hasQuery = query !== '';
118
- const max = hasQuery ? this.maxWithQuery : this.maxWithoutQuery;
119
- const filteredQueries = this.recentQueriesList.state.queries
120
- .filter((recentQuery) => recentQuery.toLowerCase().startsWith(query.toLowerCase()))
121
- .slice(0, max);
122
- const suggestionElements = filteredQueries.map((value) => this.renderItem(value));
123
- if (suggestionElements.length) {
124
- suggestionElements.unshift(this.renderClear());
125
- }
126
- return suggestionElements;
127
- }
128
- renderClear() {
129
- const partialItem = getPartialRecentQueryClearElement(this.bindings.i18n);
130
- return {
131
- ...partialItem,
132
- content: h(RecentQueryClear, { i18n: this.bindings.i18n }),
133
- onSelect: () => {
134
- this.recentQueriesList.clear();
135
- this.bindings.triggerSuggestions();
136
- },
137
- };
138
- }
139
- renderItem(value) {
140
- const query = this.bindings.searchBoxController.state.value;
141
- const partialItem = getPartialRecentQueryElement(value, this.bindings.i18n);
142
- return {
143
- ...partialItem,
144
- content: (h(RecentQueriesContainer, null, h(RecentQueryIcon, { icon: this.renderIcon() }), h(RecentQueryText, { query: query, value: value }))),
145
- onSelect: () => {
146
- if (this.bindings.isStandalone) {
147
- this.bindings.searchBoxController.updateText(value);
148
- this.bindings.searchBoxController.submit();
149
- return;
150
- }
151
- this.recentQueriesList.executeRecentQuery(this.recentQueriesList.state.queries.indexOf(value));
152
- },
153
- };
154
- }
155
- render() {
156
- if (this.error) {
157
- return (h("atomic-component-error", { key: 'e240230fed71d8dac541882bfc8efaf87405c966', element: this.host, error: this.error }));
158
- }
159
- }
160
- get host() { return this; }
161
- }, [1, "atomic-search-box-recent-queries", {
162
- "icon": [1],
163
- "maxWithQuery": [514, "max-with-query"],
164
- "maxWithoutQuery": [514, "max-without-query"],
165
- "error": [32]
166
- }]);
167
- function defineCustomElement() {
168
- if (typeof customElements === "undefined") {
169
- return;
170
- }
171
- const components = ["atomic-search-box-recent-queries"];
172
- components.forEach(tagName => { switch (tagName) {
173
- case "atomic-search-box-recent-queries":
174
- if (!customElements.get(tagName)) {
175
- customElements.define(tagName, AtomicSearchBoxRecentQueries);
176
- }
177
- break;
178
- } });
179
- }
180
-
181
- export { AtomicSearchBoxRecentQueries as A, defineCustomElement as d };
182
-
183
- //# sourceMappingURL=atomic-search-box-recent-queries2.js.map
@@ -1 +0,0 @@
1
- {"file":"atomic-search-box-recent-queries2.js","mappings":"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","names":[],"sources":["src/components/common/suggestions/stencil-recent-queries.tsx","src/components/search/search-box-suggestions/atomic-search-box-recent-queries/atomic-search-box-recent-queries.tsx"],"sourcesContent":["import {HighlightUtils} from '@coveo/headless';\nimport {FunctionalComponent, h} from '@stencil/core';\nimport {i18n} from 'i18next';\nimport {encodeForDomAttribute} from '../../../utils/string-utils';\nimport {SearchBoxSuggestionElement} from './suggestions-types';\n\nexport const getPartialRecentQueryElement = (\n value: string,\n i18n: i18n\n): Pick<SearchBoxSuggestionElement, 'ariaLabel' | 'key' | 'query' | 'part'> => {\n return {\n part: 'recent-query-item',\n query: value,\n key: `recent-${encodeForDomAttribute(value)}`,\n ariaLabel: i18n.t('recent-query-suggestion-label', {\n query: value,\n interpolation: {escapeValue: false},\n }),\n };\n};\n\nexport const getPartialRecentQueryClearElement = (\n i18n: i18n\n): Pick<\n SearchBoxSuggestionElement,\n 'ariaLabel' | 'key' | 'part' | 'hideIfLast'\n> => {\n return {\n key: 'recent-query-clear',\n ariaLabel: i18n.t('clear-recent-searches', {\n interpolation: {escapeValue: false},\n }),\n part: 'recent-query-title-item suggestion-divider',\n hideIfLast: true,\n };\n};\n\nexport const RecentQueriesContainer: FunctionalComponent = (_, children) => {\n return (\n <div\n part=\"recent-query-content\"\n class=\"flex items-center text-left break-all\"\n >\n {children}\n </div>\n );\n};\n\ninterface RecentQueryIconProps {\n icon: string;\n}\n\nexport const RecentQueryIcon: FunctionalComponent<RecentQueryIconProps> = ({\n icon,\n}) => {\n return (\n <atomic-icon\n part=\"recent-query-icon\"\n icon={icon}\n class=\"mr-2 h-4 w-4 shrink-0\"\n ></atomic-icon>\n );\n};\n\ninterface RecentQueryTextProps {\n query: string;\n value: string;\n}\n\nexport const RecentQueryText: FunctionalComponent<RecentQueryTextProps> = ({\n query,\n value,\n}) => {\n if (query === '') {\n return (\n <span part=\"recent-query-text\" class=\"line-clamp-2 break-all\">\n {value}\n </span>\n );\n }\n return (\n <span\n part=\"recent-query-text\"\n class=\"line-clamp-2 break-all\"\n innerHTML={HighlightUtils.highlightString({\n content: value,\n openingDelimiter:\n '<span part=\"recent-query-text-highlight\" class=\"font-bold\">',\n closingDelimiter: '</span>',\n highlights: [\n {\n offset: query.length,\n length: value.length - query.length,\n },\n ],\n })}\n ></span>\n );\n};\n\ninterface RecentQueryClearProps {\n i18n: i18n;\n}\n\nexport const RecentQueryClear: FunctionalComponent<RecentQueryClearProps> = ({\n i18n,\n}) => {\n return (\n <div part=\"recent-query-title-content\" class=\"flex w-full justify-between\">\n <span class=\"font-bold\" part=\"recent-query-title\">\n {i18n.t('recent-searches')}\n </span>\n <span part=\"recent-query-clear\">{i18n.t('clear')}</span>\n </div>\n );\n};\n","import {\n buildRecentQueriesList,\n RecentQueriesList,\n SearchBox,\n} from '@coveo/headless';\nimport {Component, Element, Prop, State, h} from '@stencil/core';\nimport Clock from '../../../../images/clock.svg';\nimport {SafeStorage, StorageItems} from '../../../../utils/local-storage-utils';\nimport {once} from '../../../../utils/utils';\nimport {\n getPartialRecentQueryClearElement,\n getPartialRecentQueryElement,\n RecentQueriesContainer,\n RecentQueryClear,\n RecentQueryIcon,\n RecentQueryText,\n} from '../../../common/suggestions/stencil-recent-queries';\nimport {\n dispatchSearchBoxSuggestionsEvent,\n} from '../../../common/suggestions/suggestions-events';\nimport type {\n SearchBoxSuggestionElement,\n SearchBoxSuggestions,\n SearchBoxSuggestionsBindings,\n} from '../../../common/suggestions/suggestions-types';\nimport {Bindings} from '../../atomic-search-interface/atomic-search-interface';\n\n/**\n * 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.\n */\n@Component({\n tag: 'atomic-search-box-recent-queries',\n shadow: true,\n})\nexport class AtomicSearchBoxRecentQueries {\n private bindings!: SearchBoxSuggestionsBindings<SearchBox, Bindings>;\n private recentQueriesList!: RecentQueriesList;\n private storage!: SafeStorage;\n\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 = 3;\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, Bindings>(\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 renderIcon() {\n return this.icon || Clock;\n }\n\n private initialize(): SearchBoxSuggestions {\n this.storage = new SafeStorage();\n this.recentQueriesList = buildRecentQueriesList(this.bindings.engine, {\n initialState: {queries: this.retrieveLocalStorage()},\n options: {maxLength: 1000, clearFilters: this.bindings.clearFilters},\n });\n\n this.recentQueriesList.subscribe(() => this.updateLocalStorage());\n\n return {\n position: Array.from(this.host.parentNode!.children).indexOf(this.host),\n renderItems: () => this.renderItems(),\n };\n }\n\n private retrieveLocalStorage() {\n return this.storage.getParsedJSON(StorageItems.RECENT_QUERIES, []);\n }\n\n private updateLocalStorage() {\n if (!this.recentQueriesList.state.analyticsEnabled) {\n return this.disableFeature();\n }\n\n return this.storage.setJSON(\n StorageItems.RECENT_QUERIES,\n this.recentQueriesList.state.queries\n );\n }\n\n private warnUser = once(() =>\n this.bindings.engine.logger.warn(\n 'Because analytics are disabled, the recent queries feature is deactivated.'\n )\n );\n\n private disableFeature() {\n this.warnUser();\n this.storage.removeItem(StorageItems.RECENT_QUERIES);\n }\n\n private renderItems(): SearchBoxSuggestionElement[] {\n if (!this.recentQueriesList.state.analyticsEnabled) {\n return [];\n }\n\n const query = this.bindings.searchBoxController.state.value;\n const hasQuery = query !== '';\n const max = hasQuery ? this.maxWithQuery : this.maxWithoutQuery;\n const filteredQueries = this.recentQueriesList.state.queries\n .filter((recentQuery) =>\n recentQuery.toLowerCase().startsWith(query.toLowerCase())\n )\n .slice(0, max);\n\n const suggestionElements: SearchBoxSuggestionElement[] =\n filteredQueries.map((value) => this.renderItem(value));\n if (suggestionElements.length) {\n suggestionElements.unshift(this.renderClear());\n }\n\n return suggestionElements;\n }\n\n private renderClear(): SearchBoxSuggestionElement {\n const partialItem = getPartialRecentQueryClearElement(this.bindings.i18n);\n\n return {\n ...partialItem,\n content: <RecentQueryClear i18n={this.bindings.i18n} />,\n onSelect: () => {\n this.recentQueriesList.clear();\n this.bindings.triggerSuggestions();\n },\n };\n }\n\n private renderItem(value: string): SearchBoxSuggestionElement {\n const query = this.bindings.searchBoxController.state.value;\n const partialItem = getPartialRecentQueryElement(value, this.bindings.i18n);\n return {\n ...partialItem,\n content: (\n <RecentQueriesContainer>\n <RecentQueryIcon icon={this.renderIcon()} />\n <RecentQueryText query={query} value={value} />\n </RecentQueriesContainer>\n ),\n\n onSelect: () => {\n if (this.bindings.isStandalone) {\n this.bindings.searchBoxController.updateText(value);\n this.bindings.searchBoxController.submit();\n return;\n }\n\n this.recentQueriesList.executeRecentQuery(\n this.recentQueriesList.state.queries.indexOf(value)\n );\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,111 +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 { loadQuerySuggestActions, } from '@coveo/headless';
8
- import { html, LitElement, nothing } from 'lit';
9
- import { customElement, property, state } from 'lit/decorators.js';
10
- import { getPartialSearchBoxSuggestionElement, renderQuerySuggestion, } from "../../common/suggestions/query-suggestions.js";
11
- import { dispatchSearchBoxSuggestionsEvent } from "../../common/suggestions/suggestions-events.js";
12
- import { errorGuard } from "../../../decorators/error-guard.js";
13
- const SearchIcon = "<svg viewBox=\"0 0 16 16\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"m6.4 0c3.5 0 6.4 2.9 6.4 6.4 0 1.4-.4 2.7-1.2 3.7l4 4c.4.4.4 1 .1 1.5l-.1.1c-.2.2-.5.3-.8.3s-.6-.1-.8-.3l-4-4c-1 .7-2.3 1.2-3.7 1.2-3.4-.1-6.3-3-6.3-6.5s2.9-6.4 6.4-6.4zm0 2.1c-2.3 0-4.3 1.9-4.3 4.3s1.9 4.3 4.3 4.3 4.3-1.9 4.3-4.3-1.9-4.3-4.3-4.3z\"/></svg>";
14
- /**
15
- * 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.
16
- */
17
- let AtomicSearchBoxQuerySuggestions = class AtomicSearchBoxQuerySuggestions extends LitElement {
18
- constructor() {
19
- super(...arguments);
20
- /**
21
- * The maximum number of suggestions that will be displayed if the user has typed something into the input field.
22
- */
23
- this.maxWithQuery = 3;
24
- /**
25
- * The maximum number of suggestions that will be displayed initially when the input field is empty.
26
- */
27
- this.maxWithoutQuery = 0;
28
- }
29
- connectedCallback() {
30
- super.connectedCallback();
31
- try {
32
- dispatchSearchBoxSuggestionsEvent((bindings) => {
33
- this.bindings = bindings;
34
- return this.initialize();
35
- }, this, ['atomic-search-box']);
36
- }
37
- catch (error) {
38
- this.error = error;
39
- }
40
- }
41
- initialize() {
42
- const engine = this.bindings.engine;
43
- const { registerQuerySuggest, fetchQuerySuggestions } = loadQuerySuggestActions(engine);
44
- const numberOfQueries = this.bindings.numberOfQueries;
45
- const maxWithQuery = this.maxWithQuery;
46
- if (numberOfQueries < maxWithQuery) {
47
- const logger = this.bindings.engine.logger;
48
- logger.warn(`Query suggestions configuration mismatch: atomic-search-box has number-of-queries="${numberOfQueries}" but atomic-search-box-query-suggestions has max-with-query="${maxWithQuery}". ` +
49
- `This may cause inconsistent behavior where the search box requests ${numberOfQueries} suggestions but the component tries to display up to ${maxWithQuery}. ` +
50
- `Consider updating max-with-query to ${numberOfQueries} or increasing number-of-queries to ${maxWithQuery}.`);
51
- }
52
- engine.dispatch(registerQuerySuggest({
53
- id: this.bindings.id,
54
- count: this.bindings.numberOfQueries,
55
- }));
56
- return {
57
- position: Array.from(this.parentNode.children).indexOf(this),
58
- onInput: () => engine.dispatch(fetchQuerySuggestions({
59
- id: this.bindings.id,
60
- })),
61
- renderItems: () => this.renderItems(),
62
- };
63
- }
64
- renderItems() {
65
- const hasQuery = this.bindings.searchBoxController.state.value !== '';
66
- const max = hasQuery ? this.maxWithQuery : this.maxWithoutQuery;
67
- return this.bindings.searchBoxController.state.suggestions
68
- .slice(0, max)
69
- .map((suggestion) => this.renderItem(suggestion));
70
- }
71
- renderItem(suggestion) {
72
- const partialItem = getPartialSearchBoxSuggestionElement(suggestion, this.bindings.i18n);
73
- const icon = this.icon || SearchIcon;
74
- const hasQuery = this.bindings.searchBoxController.state.value !== '';
75
- const hasMultipleKindOfSuggestions = this.bindings.getSuggestions().length > 1;
76
- return {
77
- ...partialItem,
78
- content: renderQuerySuggestion({
79
- icon,
80
- hasQuery,
81
- suggestion,
82
- hasMultipleKindOfSuggestions,
83
- }),
84
- onSelect: () => {
85
- this.bindings.searchBoxController.selectSuggestion(suggestion.rawValue);
86
- },
87
- };
88
- }
89
- render() {
90
- return html `${nothing}`;
91
- }
92
- };
93
- __decorate([
94
- state()
95
- ], AtomicSearchBoxQuerySuggestions.prototype, "error", void 0);
96
- __decorate([
97
- property()
98
- ], AtomicSearchBoxQuerySuggestions.prototype, "icon", void 0);
99
- __decorate([
100
- property({ type: Number, attribute: 'max-with-query', reflect: true })
101
- ], AtomicSearchBoxQuerySuggestions.prototype, "maxWithQuery", void 0);
102
- __decorate([
103
- property({ type: Number, attribute: 'max-without-query', reflect: true })
104
- ], AtomicSearchBoxQuerySuggestions.prototype, "maxWithoutQuery", void 0);
105
- __decorate([
106
- errorGuard()
107
- ], AtomicSearchBoxQuerySuggestions.prototype, "render", null);
108
- AtomicSearchBoxQuerySuggestions = __decorate([
109
- customElement('atomic-search-box-query-suggestions')
110
- ], AtomicSearchBoxQuerySuggestions);
111
- export { AtomicSearchBoxQuerySuggestions };
@@ -1,2 +0,0 @@
1
- import{h as e,r as t,g as r}from"./p-dc3df5ce.js";import{HighlightUtils as s,buildRecentQueriesList as i}from"@coveo/headless";import{C as n}from"./p-c280cd05.js";import{S as a,a as c}from"./p-946fe85f.js";import{o}from"./p-a12e1c59.js";import{e as h}from"./p-8f5830b4.js";import{d as l}from"./p-4b7a19db.js";import"./p-f284897c.js";import"./p-0462f723.js";import"./p-c9074946.js";import"./p-1580513b.js";const u=(e,t)=>({part:"recent-query-item",query:e,key:`recent-${h(e)}`,ariaLabel:t.t("recent-query-suggestion-label",{query:e,interpolation:{escapeValue:false}})});const p=e=>({key:"recent-query-clear",ariaLabel:e.t("clear-recent-searches",{interpolation:{escapeValue:false}}),part:"recent-query-title-item suggestion-divider",hideIfLast:true});const f=(t,r)=>e("div",{part:"recent-query-content",class:"flex items-center text-left break-all"},r);const m=({icon:t})=>e("atomic-icon",{part:"recent-query-icon",icon:t,class:"mr-2 h-4 w-4 shrink-0"});const d=({query:t,value:r})=>{if(t===""){return e("span",{part:"recent-query-text",class:"line-clamp-2 break-all"},r)}return e("span",{part:"recent-query-text",class:"line-clamp-2 break-all",innerHTML:s.highlightString({content:r,openingDelimiter:'<span part="recent-query-text-highlight" class="font-bold">',closingDelimiter:"</span>",highlights:[{offset:t.length,length:r.length-t.length}]})})};const y=({i18n:t})=>e("div",{part:"recent-query-title-content",class:"flex w-full justify-between"},e("span",{class:"font-bold",part:"recent-query-title"},t.t("recent-searches")),e("span",{part:"recent-query-clear"},t.t("clear")));const q=class{constructor(e){t(this,e);this.maxWithQuery=3;this.warnUser=o((()=>this.bindings.engine.logger.warn("Because analytics are disabled, the recent queries feature is deactivated.")));this.error=undefined;this.icon=undefined;this.maxWithQuery=3;this.maxWithoutQuery=undefined}componentWillLoad(){try{l((e=>{this.bindings=e;return this.initialize()}),this.host,["atomic-search-box"])}catch(e){this.error=e}}renderIcon(){return this.icon||n}initialize(){this.storage=new a;this.recentQueriesList=i(this.bindings.engine,{initialState:{queries:this.retrieveLocalStorage()},options:{maxLength:1e3,clearFilters:this.bindings.clearFilters}});this.recentQueriesList.subscribe((()=>this.updateLocalStorage()));return{position:Array.from(this.host.parentNode.children).indexOf(this.host),renderItems:()=>this.renderItems()}}retrieveLocalStorage(){return this.storage.getParsedJSON(c.RECENT_QUERIES,[])}updateLocalStorage(){if(!this.recentQueriesList.state.analyticsEnabled){return this.disableFeature()}return this.storage.setJSON(c.RECENT_QUERIES,this.recentQueriesList.state.queries)}disableFeature(){this.warnUser();this.storage.removeItem(c.RECENT_QUERIES)}renderItems(){if(!this.recentQueriesList.state.analyticsEnabled){return[]}const e=this.bindings.searchBoxController.state.value;const t=e!=="";const r=t?this.maxWithQuery:this.maxWithoutQuery;const s=this.recentQueriesList.state.queries.filter((t=>t.toLowerCase().startsWith(e.toLowerCase()))).slice(0,r);const i=s.map((e=>this.renderItem(e)));if(i.length){i.unshift(this.renderClear())}return i}renderClear(){const t=p(this.bindings.i18n);return{...t,content:e(y,{i18n:this.bindings.i18n}),onSelect:()=>{this.recentQueriesList.clear();this.bindings.triggerSuggestions()}}}renderItem(t){const r=this.bindings.searchBoxController.state.value;const s=u(t,this.bindings.i18n);return{...s,content:e(f,null,e(m,{icon:this.renderIcon()}),e(d,{query:r,value:t})),onSelect:()=>{if(this.bindings.isStandalone){this.bindings.searchBoxController.updateText(t);this.bindings.searchBoxController.submit();return}this.recentQueriesList.executeRecentQuery(this.recentQueriesList.state.queries.indexOf(t))}}}render(){if(this.error){return e("atomic-component-error",{key:"e240230fed71d8dac541882bfc8efaf87405c966",element:this.host,error:this.error})}}get host(){return r(this)}};export{q as atomic_search_box_recent_queries};
2
- //# sourceMappingURL=p-7a06a356.entry.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["getPartialRecentQueryElement","value","i18n","part","query","key","encodeForDomAttribute","ariaLabel","t","interpolation","escapeValue","getPartialRecentQueryClearElement","hideIfLast","RecentQueriesContainer","_","children","h","class","RecentQueryIcon","icon","RecentQueryText","innerHTML","HighlightUtils","highlightString","content","openingDelimiter","closingDelimiter","highlights","offset","length","RecentQueryClear","AtomicSearchBoxRecentQueries","this","maxWithQuery","warnUser","once","bindings","engine","logger","warn","componentWillLoad","dispatchSearchBoxSuggestionsEvent","initialize","host","error","renderIcon","Clock","storage","SafeStorage","recentQueriesList","buildRecentQueriesList","initialState","queries","retrieveLocalStorage","options","maxLength","clearFilters","subscribe","updateLocalStorage","position","Array","from","parentNode","indexOf","renderItems","getParsedJSON","StorageItems","RECENT_QUERIES","state","analyticsEnabled","disableFeature","setJSON","removeItem","searchBoxController","hasQuery","max","maxWithoutQuery","filteredQueries","filter","recentQuery","toLowerCase","startsWith","slice","suggestionElements","map","renderItem","unshift","renderClear","partialItem","onSelect","clear","triggerSuggestions","isStandalone","updateText","submit","executeRecentQuery","render","element"],"sources":["src/components/common/suggestions/stencil-recent-queries.tsx","src/components/search/search-box-suggestions/atomic-search-box-recent-queries/atomic-search-box-recent-queries.tsx"],"sourcesContent":["import {HighlightUtils} from '@coveo/headless';\nimport {FunctionalComponent, h} from '@stencil/core';\nimport {i18n} from 'i18next';\nimport {encodeForDomAttribute} from '../../../utils/string-utils';\nimport {SearchBoxSuggestionElement} from './suggestions-types';\n\nexport const getPartialRecentQueryElement = (\n value: string,\n i18n: i18n\n): Pick<SearchBoxSuggestionElement, 'ariaLabel' | 'key' | 'query' | 'part'> => {\n return {\n part: 'recent-query-item',\n query: value,\n key: `recent-${encodeForDomAttribute(value)}`,\n ariaLabel: i18n.t('recent-query-suggestion-label', {\n query: value,\n interpolation: {escapeValue: false},\n }),\n };\n};\n\nexport const getPartialRecentQueryClearElement = (\n i18n: i18n\n): Pick<\n SearchBoxSuggestionElement,\n 'ariaLabel' | 'key' | 'part' | 'hideIfLast'\n> => {\n return {\n key: 'recent-query-clear',\n ariaLabel: i18n.t('clear-recent-searches', {\n interpolation: {escapeValue: false},\n }),\n part: 'recent-query-title-item suggestion-divider',\n hideIfLast: true,\n };\n};\n\nexport const RecentQueriesContainer: FunctionalComponent = (_, children) => {\n return (\n <div\n part=\"recent-query-content\"\n class=\"flex items-center text-left break-all\"\n >\n {children}\n </div>\n );\n};\n\ninterface RecentQueryIconProps {\n icon: string;\n}\n\nexport const RecentQueryIcon: FunctionalComponent<RecentQueryIconProps> = ({\n icon,\n}) => {\n return (\n <atomic-icon\n part=\"recent-query-icon\"\n icon={icon}\n class=\"mr-2 h-4 w-4 shrink-0\"\n ></atomic-icon>\n );\n};\n\ninterface RecentQueryTextProps {\n query: string;\n value: string;\n}\n\nexport const RecentQueryText: FunctionalComponent<RecentQueryTextProps> = ({\n query,\n value,\n}) => {\n if (query === '') {\n return (\n <span part=\"recent-query-text\" class=\"line-clamp-2 break-all\">\n {value}\n </span>\n );\n }\n return (\n <span\n part=\"recent-query-text\"\n class=\"line-clamp-2 break-all\"\n innerHTML={HighlightUtils.highlightString({\n content: value,\n openingDelimiter:\n '<span part=\"recent-query-text-highlight\" class=\"font-bold\">',\n closingDelimiter: '</span>',\n highlights: [\n {\n offset: query.length,\n length: value.length - query.length,\n },\n ],\n })}\n ></span>\n );\n};\n\ninterface RecentQueryClearProps {\n i18n: i18n;\n}\n\nexport const RecentQueryClear: FunctionalComponent<RecentQueryClearProps> = ({\n i18n,\n}) => {\n return (\n <div part=\"recent-query-title-content\" class=\"flex w-full justify-between\">\n <span class=\"font-bold\" part=\"recent-query-title\">\n {i18n.t('recent-searches')}\n </span>\n <span part=\"recent-query-clear\">{i18n.t('clear')}</span>\n </div>\n );\n};\n","import {\n buildRecentQueriesList,\n RecentQueriesList,\n SearchBox,\n} from '@coveo/headless';\nimport {Component, Element, Prop, State, h} from '@stencil/core';\nimport Clock from '../../../../images/clock.svg';\nimport {SafeStorage, StorageItems} from '../../../../utils/local-storage-utils';\nimport {once} from '../../../../utils/utils';\nimport {\n getPartialRecentQueryClearElement,\n getPartialRecentQueryElement,\n RecentQueriesContainer,\n RecentQueryClear,\n RecentQueryIcon,\n RecentQueryText,\n} from '../../../common/suggestions/stencil-recent-queries';\nimport {\n dispatchSearchBoxSuggestionsEvent,\n} from '../../../common/suggestions/suggestions-events';\nimport type {\n SearchBoxSuggestionElement,\n SearchBoxSuggestions,\n SearchBoxSuggestionsBindings,\n} from '../../../common/suggestions/suggestions-types';\nimport {Bindings} from '../../atomic-search-interface/atomic-search-interface';\n\n/**\n * 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.\n */\n@Component({\n tag: 'atomic-search-box-recent-queries',\n shadow: true,\n})\nexport class AtomicSearchBoxRecentQueries {\n private bindings!: SearchBoxSuggestionsBindings<SearchBox, Bindings>;\n private recentQueriesList!: RecentQueriesList;\n private storage!: SafeStorage;\n\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 = 3;\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, Bindings>(\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 renderIcon() {\n return this.icon || Clock;\n }\n\n private initialize(): SearchBoxSuggestions {\n this.storage = new SafeStorage();\n this.recentQueriesList = buildRecentQueriesList(this.bindings.engine, {\n initialState: {queries: this.retrieveLocalStorage()},\n options: {maxLength: 1000, clearFilters: this.bindings.clearFilters},\n });\n\n this.recentQueriesList.subscribe(() => this.updateLocalStorage());\n\n return {\n position: Array.from(this.host.parentNode!.children).indexOf(this.host),\n renderItems: () => this.renderItems(),\n };\n }\n\n private retrieveLocalStorage() {\n return this.storage.getParsedJSON(StorageItems.RECENT_QUERIES, []);\n }\n\n private updateLocalStorage() {\n if (!this.recentQueriesList.state.analyticsEnabled) {\n return this.disableFeature();\n }\n\n return this.storage.setJSON(\n StorageItems.RECENT_QUERIES,\n this.recentQueriesList.state.queries\n );\n }\n\n private warnUser = once(() =>\n this.bindings.engine.logger.warn(\n 'Because analytics are disabled, the recent queries feature is deactivated.'\n )\n );\n\n private disableFeature() {\n this.warnUser();\n this.storage.removeItem(StorageItems.RECENT_QUERIES);\n }\n\n private renderItems(): SearchBoxSuggestionElement[] {\n if (!this.recentQueriesList.state.analyticsEnabled) {\n return [];\n }\n\n const query = this.bindings.searchBoxController.state.value;\n const hasQuery = query !== '';\n const max = hasQuery ? this.maxWithQuery : this.maxWithoutQuery;\n const filteredQueries = this.recentQueriesList.state.queries\n .filter((recentQuery) =>\n recentQuery.toLowerCase().startsWith(query.toLowerCase())\n )\n .slice(0, max);\n\n const suggestionElements: SearchBoxSuggestionElement[] =\n filteredQueries.map((value) => this.renderItem(value));\n if (suggestionElements.length) {\n suggestionElements.unshift(this.renderClear());\n }\n\n return suggestionElements;\n }\n\n private renderClear(): SearchBoxSuggestionElement {\n const partialItem = getPartialRecentQueryClearElement(this.bindings.i18n);\n\n return {\n ...partialItem,\n content: <RecentQueryClear i18n={this.bindings.i18n} />,\n onSelect: () => {\n this.recentQueriesList.clear();\n this.bindings.triggerSuggestions();\n },\n };\n }\n\n private renderItem(value: string): SearchBoxSuggestionElement {\n const query = this.bindings.searchBoxController.state.value;\n const partialItem = getPartialRecentQueryElement(value, this.bindings.i18n);\n return {\n ...partialItem,\n content: (\n <RecentQueriesContainer>\n <RecentQueryIcon icon={this.renderIcon()} />\n <RecentQueryText query={query} value={value} />\n </RecentQueriesContainer>\n ),\n\n onSelect: () => {\n if (this.bindings.isStandalone) {\n this.bindings.searchBoxController.updateText(value);\n this.bindings.searchBoxController.submit();\n return;\n }\n\n this.recentQueriesList.executeRecentQuery(\n this.recentQueriesList.state.queries.indexOf(value)\n );\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":"qZAMO,MAAMA,EAA+B,CAC1CC,EACAC,KAEO,CACLC,KAAM,oBACNC,MAAOH,EACPI,IAAK,UAAUC,EAAsBL,KACrCM,UAAWL,EAAKM,EAAE,gCAAiC,CACjDJ,MAAOH,EACPQ,cAAe,CAACC,YAAa,WAK5B,MAAMC,EACXT,IAKO,CACLG,IAAK,qBACLE,UAAWL,EAAKM,EAAE,wBAAyB,CACzCC,cAAe,CAACC,YAAa,SAE/BP,KAAM,6CACNS,WAAY,OAIT,MAAMC,EAA8C,CAACC,EAAGC,IAE3DC,EAAA,OACEb,KAAK,uBACLc,MAAM,yCAELF,GASA,MAAMG,EAA6D,EACxEC,UAGEH,EAAA,eACEb,KAAK,oBACLgB,KAAMA,EACNF,MAAM,0BAUL,MAAMG,EAA6D,EACxEhB,QACAH,YAEA,GAAIG,IAAU,GAAI,CAChB,OACEY,EAAA,QAAMb,KAAK,oBAAoBc,MAAM,0BAClChB,E,CAIP,OACEe,EAAA,QACEb,KAAK,oBACLc,MAAM,yBACNI,UAAWC,EAAeC,gBAAgB,CACxCC,QAASvB,EACTwB,iBACE,8DACFC,iBAAkB,UAClBC,WAAY,CACV,CACEC,OAAQxB,EAAMyB,OACdA,OAAQ5B,EAAM4B,OAASzB,EAAMyB,YAI7B,EAQL,MAAMC,EAA+D,EAC1E5B,UAGEc,EAAA,OAAKb,KAAK,6BAA6Bc,MAAM,+BAC3CD,EAAA,QAAMC,MAAM,YAAYd,KAAK,sBAC1BD,EAAKM,EAAE,oBAEVQ,EAAA,QAAMb,KAAK,sBAAsBD,EAAKM,EAAE,W,MC9EjCuB,EAA4B,M,yBAqBTC,KAAAC,aAAe,EAuDrCD,KAAAE,SAAWC,GAAK,IACtBH,KAAKI,SAASC,OAAOC,OAAOC,KAC1B,gF,2DAzDyC,E,+BAM7C,iBAAAC,GACE,IACEC,GACGL,IACCJ,KAAKI,SAAWA,EAChB,OAAOJ,KAAKU,YAAY,GAE1BV,KAAKW,KACL,CAAC,qB,CAEH,MAAOC,GACPZ,KAAKY,MAAQA,C,EAIT,UAAAC,GACN,OAAOb,KAAKb,MAAQ2B,C,CAGd,UAAAJ,GACNV,KAAKe,QAAU,IAAIC,EACnBhB,KAAKiB,kBAAoBC,EAAuBlB,KAAKI,SAASC,OAAQ,CACpEc,aAAc,CAACC,QAASpB,KAAKqB,wBAC7BC,QAAS,CAACC,UAAW,IAAMC,aAAcxB,KAAKI,SAASoB,gBAGzDxB,KAAKiB,kBAAkBQ,WAAU,IAAMzB,KAAK0B,uBAE5C,MAAO,CACLC,SAAUC,MAAMC,KAAK7B,KAAKW,KAAKmB,WAAY/C,UAAUgD,QAAQ/B,KAAKW,MAClEqB,YAAa,IAAMhC,KAAKgC,c,CAIpB,oBAAAX,GACN,OAAOrB,KAAKe,QAAQkB,cAAcC,EAAaC,eAAgB,G,CAGzD,kBAAAT,GACN,IAAK1B,KAAKiB,kBAAkBmB,MAAMC,iBAAkB,CAClD,OAAOrC,KAAKsC,gB,CAGd,OAAOtC,KAAKe,QAAQwB,QAClBL,EAAaC,eACbnC,KAAKiB,kBAAkBmB,MAAMhB,Q,CAUzB,cAAAkB,GACNtC,KAAKE,WACLF,KAAKe,QAAQyB,WAAWN,EAAaC,e,CAG/B,WAAAH,GACN,IAAKhC,KAAKiB,kBAAkBmB,MAAMC,iBAAkB,CAClD,MAAO,E,CAGT,MAAMjE,EAAQ4B,KAAKI,SAASqC,oBAAoBL,MAAMnE,MACtD,MAAMyE,EAAWtE,IAAU,GAC3B,MAAMuE,EAAMD,EAAW1C,KAAKC,aAAeD,KAAK4C,gBAChD,MAAMC,EAAkB7C,KAAKiB,kBAAkBmB,MAAMhB,QAClD0B,QAAQC,GACPA,EAAYC,cAAcC,WAAW7E,EAAM4E,iBAE5CE,MAAM,EAAGP,GAEZ,MAAMQ,EACJN,EAAgBO,KAAKnF,GAAU+B,KAAKqD,WAAWpF,KACjD,GAAIkF,EAAmBtD,OAAQ,CAC7BsD,EAAmBG,QAAQtD,KAAKuD,c,CAGlC,OAAOJ,C,CAGD,WAAAI,GACN,MAAMC,EAAc7E,EAAkCqB,KAAKI,SAASlC,MAEpE,MAAO,IACFsF,EACHhE,QAASR,EAACc,EAAgB,CAAC5B,KAAM8B,KAAKI,SAASlC,OAC/CuF,SAAU,KACRzD,KAAKiB,kBAAkByC,QACvB1D,KAAKI,SAASuD,oBAAoB,E,CAKhC,UAAAN,CAAWpF,GACjB,MAAMG,EAAQ4B,KAAKI,SAASqC,oBAAoBL,MAAMnE,MACtD,MAAMuF,EAAcxF,EAA6BC,EAAO+B,KAAKI,SAASlC,MACtE,MAAO,IACFsF,EACHhE,QACER,EAACH,EAAsB,KACrBG,EAACE,EAAe,CAACC,KAAMa,KAAKa,eAC5B7B,EAACI,EAAe,CAAChB,MAAOA,EAAOH,MAAOA,KAI1CwF,SAAU,KACR,GAAIzD,KAAKI,SAASwD,aAAc,CAC9B5D,KAAKI,SAASqC,oBAAoBoB,WAAW5F,GAC7C+B,KAAKI,SAASqC,oBAAoBqB,SAClC,M,CAGF9D,KAAKiB,kBAAkB8C,mBACrB/D,KAAKiB,kBAAkBmB,MAAMhB,QAAQW,QAAQ9D,GAC9C,E,CAKA,MAAA+F,GACL,GAAIhE,KAAKY,MAAO,CACd,OACE5B,EAAA,0BAAAX,IAAA,2CACE4F,QAASjE,KAAKW,KACdC,MAAOZ,KAAKY,O","ignoreList":[]}