@searchcraft/javascript-sdk 0.2.9 → 0.3.1

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 (225) hide show
  1. package/dist/cjs/{index-6c5282a0.js → index-264ebadc.js} +290 -9
  2. package/dist/cjs/index-264ebadc.js.map +1 -0
  3. package/dist/cjs/index.cjs.js +1 -1
  4. package/dist/cjs/loader.cjs.js +2 -2
  5. package/dist/cjs/package-35d3b670.js +68 -0
  6. package/dist/cjs/package-35d3b670.js.map +1 -0
  7. package/dist/cjs/{searchcraft-auto-search-form_19.cjs.entry.js → searchcraft-auto-search-form_17.cjs.entry.js} +144 -121
  8. package/dist/cjs/searchcraft-auto-search-form_17.cjs.entry.js.map +1 -0
  9. package/dist/cjs/searchcraft-base-search-form.cjs.entry.js +13 -5
  10. package/dist/cjs/searchcraft-base-search-form.cjs.entry.js.map +1 -1
  11. package/dist/cjs/searchcraft-button-icon.cjs.entry.js +1 -1
  12. package/dist/cjs/searchcraft-button.cjs.entry.js +4 -4
  13. package/dist/cjs/searchcraft-button.cjs.entry.js.map +1 -1
  14. package/dist/cjs/searchcraft-javascript-sdk.cjs.js +2 -2
  15. package/dist/cjs/searchcraft-spinner-dark.cjs.entry.js +22 -0
  16. package/dist/cjs/searchcraft-spinner-dark.cjs.entry.js.map +1 -0
  17. package/dist/cjs/searchcraft-spinner-light.cjs.entry.js +22 -0
  18. package/dist/cjs/searchcraft-spinner-light.cjs.entry.js.map +1 -0
  19. package/dist/cjs/store-e3bbdd49.js +1022 -0
  20. package/dist/cjs/store-e3bbdd49.js.map +1 -0
  21. package/dist/collection/assets/searchcraft-button-icons.js.map +1 -1
  22. package/dist/collection/assets/searchcraft-check-icon.js.map +1 -1
  23. package/dist/collection/assets/searchcraft-clear-icon-set.js.map +1 -1
  24. package/dist/collection/assets/searchcraft-dash-icon.js.map +1 -1
  25. package/dist/collection/assets/searchcraft-search-icon-set.js.map +1 -1
  26. package/dist/collection/components/searchcraft-auto-search-form/searchcraft-auto-search-form.js +21 -13
  27. package/dist/collection/components/searchcraft-auto-search-form/searchcraft-auto-search-form.js.map +1 -1
  28. package/dist/collection/components/searchcraft-base-search-form/searchcraft-base-search-form.js +17 -10
  29. package/dist/collection/components/searchcraft-base-search-form/searchcraft-base-search-form.js.map +1 -1
  30. package/dist/collection/components/searchcraft-base-search-result/searchcraft-base-search-result.js +76 -26
  31. package/dist/collection/components/searchcraft-base-search-result/searchcraft-base-search-result.js.map +1 -1
  32. package/dist/collection/components/searchcraft-base-search-result/searchcraft-base-search-result.module.css +42 -22
  33. package/dist/collection/components/searchcraft-base-search-results/searchcraft-base-search-results.js +50 -10
  34. package/dist/collection/components/searchcraft-base-search-results/searchcraft-base-search-results.js.map +1 -1
  35. package/dist/collection/components/searchcraft-button/searchcraft-button.js +2 -3
  36. package/dist/collection/components/searchcraft-button/searchcraft-button.js.map +1 -1
  37. package/dist/collection/components/searchcraft-button/searchcraft-button.module.css +4 -33
  38. package/dist/collection/components/searchcraft-clear-input-button/searchcraft-clear-input-button.js +4 -5
  39. package/dist/collection/components/searchcraft-clear-input-button/searchcraft-clear-input-button.js.map +1 -1
  40. package/dist/collection/components/searchcraft-clear-input-button/searchcraft-clear-input-button.module.css +3 -3
  41. package/dist/collection/components/searchcraft-error-message/searchcraft-error-message.js +3 -4
  42. package/dist/collection/components/searchcraft-error-message/searchcraft-error-message.js.map +1 -1
  43. package/dist/collection/components/searchcraft-filters-list/searchcraft-filters-list.js +6 -12
  44. package/dist/collection/components/searchcraft-filters-list/searchcraft-filters-list.js.map +1 -1
  45. package/dist/collection/components/searchcraft-filters-list/searchcraft-filters-list.module.css +35 -31
  46. package/dist/collection/components/searchcraft-input/searchcraft-input.js +20 -17
  47. package/dist/collection/components/searchcraft-input/searchcraft-input.js.map +1 -1
  48. package/dist/collection/components/searchcraft-input/searchcraft-input.module.css +28 -28
  49. package/dist/collection/components/searchcraft-input-caption/searchcraft-input-caption.js +2 -3
  50. package/dist/collection/components/searchcraft-input-caption/searchcraft-input-caption.js.map +1 -1
  51. package/dist/collection/components/searchcraft-input-icon/searchcraft-input-icon.js +2 -2
  52. package/dist/collection/components/searchcraft-input-icon/searchcraft-input-icon.js.map +1 -1
  53. package/dist/collection/components/searchcraft-input-icon/searchcraft-input-icon.module.css +2 -2
  54. package/dist/collection/components/searchcraft-input-label/searchcraft-input-label.js +1 -2
  55. package/dist/collection/components/searchcraft-input-label/searchcraft-input-label.js.map +1 -1
  56. package/dist/collection/components/searchcraft-input-label/searchcraft-input-label.module.css +1 -1
  57. package/dist/collection/components/searchcraft-results-info/searchcraft-results-info.js +5 -3
  58. package/dist/collection/components/searchcraft-results-info/searchcraft-results-info.js.map +1 -1
  59. package/dist/collection/components/searchcraft-results-info/searchcraft-results-info.module.css +14 -4
  60. package/dist/collection/components/searchcraft-slider/searchcraft-slider.js +34 -8
  61. package/dist/collection/components/searchcraft-slider/searchcraft-slider.js.map +1 -1
  62. package/dist/collection/components/searchcraft-slider/searchcraft-slider.module.css +39 -25
  63. package/dist/collection/components/searchcraft-spinner-dark/searchcraft-spinner-dark.js.map +1 -1
  64. package/dist/collection/components/searchcraft-spinner-light/searchcraft-spinner-light.js.map +1 -1
  65. package/dist/collection/components/searchcraft-toggle-button/searchcraft-toggle-button.js +19 -2
  66. package/dist/collection/components/searchcraft-toggle-button/searchcraft-toggle-button.js.map +1 -1
  67. package/dist/collection/components/searchcraft-toggle-button/searchcraft-toggle-button.module.css +7 -7
  68. package/dist/collection/index.js.map +1 -1
  69. package/dist/collection/provider/store.js +1 -0
  70. package/dist/collection/provider/store.js.map +1 -1
  71. package/dist/collection/utils/utils.js +3 -0
  72. package/dist/collection/utils/utils.js.map +1 -1
  73. package/dist/components/index.js +3 -3
  74. package/dist/components/{p-8c38185e.js → p-4f939ba2.js} +7 -7
  75. package/dist/components/p-4f939ba2.js.map +1 -0
  76. package/dist/components/{p-498c7ef9.js → p-5015a359.js} +4 -5
  77. package/dist/components/p-5015a359.js.map +1 -0
  78. package/dist/components/{p-dd2a4022.js → p-54848b4d.js} +35 -44
  79. package/dist/components/p-54848b4d.js.map +1 -0
  80. package/dist/components/{p-a3bd1bc8.js → p-5a872bdf.js} +2 -2
  81. package/dist/components/{p-a3bd1bc8.js.map → p-5a872bdf.js.map} +1 -1
  82. package/dist/components/{p-7d1bcd2d.js → p-62c40862.js} +5 -2
  83. package/dist/components/p-62c40862.js.map +1 -0
  84. package/dist/components/{p-70722ab2.js → p-62e6b69c.js} +2 -2
  85. package/dist/components/{p-70722ab2.js.map → p-62e6b69c.js.map} +1 -1
  86. package/dist/components/{p-6237f03e.js → p-69ee3b9a.js} +5 -6
  87. package/dist/components/p-69ee3b9a.js.map +1 -0
  88. package/dist/components/{p-7498e493.js → p-6b353c3e.js} +290 -9
  89. package/dist/components/p-6b353c3e.js.map +1 -0
  90. package/dist/components/p-727bfc38.js +925 -0
  91. package/dist/components/p-727bfc38.js.map +1 -0
  92. package/dist/components/{p-bc3f9025.js → p-7c280820.js} +2 -2
  93. package/dist/components/{p-bc3f9025.js.map → p-7c280820.js.map} +1 -1
  94. package/dist/components/{p-4468fba3.js → p-7d385ffb.js} +7 -8
  95. package/dist/components/p-7d385ffb.js.map +1 -0
  96. package/dist/components/p-8524c749.js +54 -0
  97. package/dist/components/p-8524c749.js.map +1 -0
  98. package/dist/components/{p-e5471fcf.js → p-aad03c2a.js} +2 -2
  99. package/dist/components/{p-e5471fcf.js.map → p-aad03c2a.js.map} +1 -1
  100. package/dist/components/p-b0c1fd63.js +66 -0
  101. package/dist/components/p-b0c1fd63.js.map +1 -0
  102. package/dist/components/{p-ae84b899.js → p-b38d171d.js} +5 -6
  103. package/dist/components/p-b38d171d.js.map +1 -0
  104. package/dist/components/{p-d3187f5a.js → p-bbf9973a.js} +2 -2
  105. package/dist/components/{p-d3187f5a.js.map → p-bbf9973a.js.map} +1 -1
  106. package/dist/components/p-cd9a038a.js +105 -0
  107. package/dist/components/p-cd9a038a.js.map +1 -0
  108. package/dist/components/searchcraft-auto-search-form.js +35 -39
  109. package/dist/components/searchcraft-auto-search-form.js.map +1 -1
  110. package/dist/components/searchcraft-base-search-form.js +34 -33
  111. package/dist/components/searchcraft-base-search-form.js.map +1 -1
  112. package/dist/components/searchcraft-base-search-result.js +1 -1
  113. package/dist/components/searchcraft-base-search-results.js +21 -15
  114. package/dist/components/searchcraft-base-search-results.js.map +1 -1
  115. package/dist/components/searchcraft-button-icon.js +1 -1
  116. package/dist/components/searchcraft-button.js +1 -1
  117. package/dist/components/searchcraft-check-icon.js +1 -1
  118. package/dist/components/searchcraft-clear-icon-set.js +1 -1
  119. package/dist/components/searchcraft-clear-input-button.js +1 -1
  120. package/dist/components/searchcraft-dash-icon.js +1 -1
  121. package/dist/components/searchcraft-error-message.js +1 -1
  122. package/dist/components/searchcraft-filters-list.js +12 -18
  123. package/dist/components/searchcraft-filters-list.js.map +1 -1
  124. package/dist/components/searchcraft-input-caption.js +1 -1
  125. package/dist/components/searchcraft-input-icon.js +1 -1
  126. package/dist/components/searchcraft-input-label.js +1 -1
  127. package/dist/components/searchcraft-input.js +1 -1
  128. package/dist/components/searchcraft-results-info.js +9 -7
  129. package/dist/components/searchcraft-results-info.js.map +1 -1
  130. package/dist/components/searchcraft-search-icon-set.js +1 -1
  131. package/dist/components/searchcraft-slider.js +20 -11
  132. package/dist/components/searchcraft-slider.js.map +1 -1
  133. package/dist/components/searchcraft-spinner-dark.js +1 -1
  134. package/dist/components/searchcraft-spinner-light.js +29 -1
  135. package/dist/components/searchcraft-spinner-light.js.map +1 -1
  136. package/dist/components/searchcraft-toggle-button.js +23 -6
  137. package/dist/components/searchcraft-toggle-button.js.map +1 -1
  138. package/dist/esm/{index-0ac5bb53.js → index-d851fb46.js} +290 -9
  139. package/dist/esm/index-d851fb46.js.map +1 -0
  140. package/dist/esm/index.js +1 -1
  141. package/dist/esm/loader.js +3 -3
  142. package/dist/esm/package-82baadd7.js +66 -0
  143. package/dist/esm/package-82baadd7.js.map +1 -0
  144. package/dist/esm/{searchcraft-auto-search-form_19.entry.js → searchcraft-auto-search-form_17.entry.js} +143 -118
  145. package/dist/esm/searchcraft-auto-search-form_17.entry.js.map +1 -0
  146. package/dist/esm/searchcraft-base-search-form.entry.js +13 -5
  147. package/dist/esm/searchcraft-base-search-form.entry.js.map +1 -1
  148. package/dist/esm/searchcraft-button-icon.entry.js +1 -1
  149. package/dist/esm/searchcraft-button.entry.js +4 -4
  150. package/dist/esm/searchcraft-button.entry.js.map +1 -1
  151. package/dist/esm/searchcraft-javascript-sdk.js +3 -3
  152. package/dist/esm/searchcraft-spinner-dark.entry.js +18 -0
  153. package/dist/esm/searchcraft-spinner-dark.entry.js.map +1 -0
  154. package/dist/esm/searchcraft-spinner-light.entry.js +18 -0
  155. package/dist/esm/searchcraft-spinner-light.entry.js.map +1 -0
  156. package/dist/esm/store-b519dd0b.js +1011 -0
  157. package/dist/esm/store-b519dd0b.js.map +1 -0
  158. package/dist/searchcraft-javascript-sdk/index.esm.js +1 -1
  159. package/dist/searchcraft-javascript-sdk/p-1f3ae7f3.entry.js +2 -0
  160. package/dist/searchcraft-javascript-sdk/p-1f3ae7f3.entry.js.map +1 -0
  161. package/dist/searchcraft-javascript-sdk/p-201cb2dc.entry.js +2 -0
  162. package/dist/searchcraft-javascript-sdk/p-201cb2dc.entry.js.map +1 -0
  163. package/dist/searchcraft-javascript-sdk/p-2c220368.entry.js +2 -0
  164. package/dist/searchcraft-javascript-sdk/p-2c220368.entry.js.map +1 -0
  165. package/dist/searchcraft-javascript-sdk/p-39c0ca33.entry.js +2 -0
  166. package/dist/searchcraft-javascript-sdk/p-39c0ca33.entry.js.map +1 -0
  167. package/dist/searchcraft-javascript-sdk/p-476829a4.entry.js +2 -0
  168. package/dist/searchcraft-javascript-sdk/p-476829a4.entry.js.map +1 -0
  169. package/dist/searchcraft-javascript-sdk/{p-5ec960bd.entry.js → p-99356c9a.entry.js} +2 -2
  170. package/dist/searchcraft-javascript-sdk/p-b0c1fd63.js +2 -0
  171. package/dist/searchcraft-javascript-sdk/p-b0c1fd63.js.map +1 -0
  172. package/dist/searchcraft-javascript-sdk/p-b42eaa55.js +3 -0
  173. package/dist/searchcraft-javascript-sdk/p-b42eaa55.js.map +1 -0
  174. package/dist/searchcraft-javascript-sdk/p-d5f8dda2.js +11 -0
  175. package/dist/searchcraft-javascript-sdk/p-d5f8dda2.js.map +1 -0
  176. package/dist/searchcraft-javascript-sdk/searchcraft-javascript-sdk.esm.js +1 -1
  177. package/dist/searchcraft-javascript-sdk/searchcraft-javascript-sdk.esm.js.map +1 -1
  178. package/dist/types/components/searchcraft-auto-search-form/searchcraft-auto-search-form.d.ts +2 -2
  179. package/dist/types/components/searchcraft-base-search-form/searchcraft-base-search-form.d.ts +2 -2
  180. package/dist/types/components/searchcraft-base-search-result/searchcraft-base-search-result.d.ts +6 -3
  181. package/dist/types/components/searchcraft-base-search-results/searchcraft-base-search-results.d.ts +3 -0
  182. package/dist/types/components/searchcraft-error-message/searchcraft-error-message.d.ts +0 -6
  183. package/dist/types/components/searchcraft-filters-list/searchcraft-filters-list.d.ts +1 -1
  184. package/dist/types/components/searchcraft-input/searchcraft-input.d.ts +3 -3
  185. package/dist/types/components/searchcraft-slider/searchcraft-slider.d.ts +5 -0
  186. package/dist/types/components/searchcraft-toggle-button/searchcraft-toggle-button.d.ts +3 -1
  187. package/dist/types/components.d.ts +48 -22
  188. package/dist/types/provider/store.d.ts +2 -1
  189. package/dist/types/utils/utils.d.ts +1 -0
  190. package/package.json +1 -1
  191. package/dist/cjs/index-6c5282a0.js.map +0 -1
  192. package/dist/cjs/searchcraft-auto-search-form_19.cjs.entry.js.map +0 -1
  193. package/dist/cjs/store-f3bec622.js +0 -406
  194. package/dist/cjs/store-f3bec622.js.map +0 -1
  195. package/dist/components/p-07edaa9b.js +0 -67
  196. package/dist/components/p-07edaa9b.js.map +0 -1
  197. package/dist/components/p-4468fba3.js.map +0 -1
  198. package/dist/components/p-498c7ef9.js.map +0 -1
  199. package/dist/components/p-6237f03e.js.map +0 -1
  200. package/dist/components/p-7498e493.js.map +0 -1
  201. package/dist/components/p-7d1bcd2d.js.map +0 -1
  202. package/dist/components/p-8c38185e.js.map +0 -1
  203. package/dist/components/p-ae84b899.js.map +0 -1
  204. package/dist/components/p-bfb22305.js +0 -33
  205. package/dist/components/p-bfb22305.js.map +0 -1
  206. package/dist/components/p-c31274dd.js +0 -89
  207. package/dist/components/p-c31274dd.js.map +0 -1
  208. package/dist/components/p-dd2a4022.js.map +0 -1
  209. package/dist/components/p-ff049f0a.js +0 -313
  210. package/dist/components/p-ff049f0a.js.map +0 -1
  211. package/dist/esm/index-0ac5bb53.js.map +0 -1
  212. package/dist/esm/searchcraft-auto-search-form_19.entry.js.map +0 -1
  213. package/dist/esm/store-6af9ea01.js +0 -396
  214. package/dist/esm/store-6af9ea01.js.map +0 -1
  215. package/dist/searchcraft-javascript-sdk/p-05416a3e.entry.js +0 -2
  216. package/dist/searchcraft-javascript-sdk/p-05416a3e.entry.js.map +0 -1
  217. package/dist/searchcraft-javascript-sdk/p-0880cfbb.js +0 -3
  218. package/dist/searchcraft-javascript-sdk/p-0880cfbb.js.map +0 -1
  219. package/dist/searchcraft-javascript-sdk/p-1ab836bf.js +0 -11
  220. package/dist/searchcraft-javascript-sdk/p-1ab836bf.js.map +0 -1
  221. package/dist/searchcraft-javascript-sdk/p-3cb77ee1.entry.js +0 -2
  222. package/dist/searchcraft-javascript-sdk/p-3cb77ee1.entry.js.map +0 -1
  223. package/dist/searchcraft-javascript-sdk/p-6c007e2e.entry.js +0 -2
  224. package/dist/searchcraft-javascript-sdk/p-6c007e2e.entry.js.map +0 -1
  225. /package/dist/searchcraft-javascript-sdk/{p-5ec960bd.entry.js.map → p-99356c9a.entry.js.map} +0 -0
@@ -1,6 +1,7 @@
1
- import { r as registerInstance, c as createEvent, h, F as Fragment } from './index-0ac5bb53.js';
2
- import { u as useSearchcraftStore, g, p as parseCustomStyles, a as parseSearchKeys, s as serializeStyles, e as extractDynamicProperties, c as getFormattedTimeFromNow, f as flattenFacets } from './store-6af9ea01.js';
1
+ import { r as registerInstance, c as createEvent, h, F as Fragment } from './index-d851fb46.js';
3
2
  import { c as classNames } from './index-72ac5051.js';
3
+ import { u as useSearchcraftStore, i as ie, p as parseCustomStyles, a as parseSearchKeys, s as serializeStyles, e as extractDynamicProperties, g as getFormattedTimeFromNow, f as flattenFacets, c as formatNumberWithCommas } from './store-b519dd0b.js';
4
+ import { p as packageJson } from './package-82baadd7.js';
4
5
 
5
6
  const searchcraftAutoSearchFormModuleCss = ":root{--font-stack:Helvetica, Arial, sans-serif}.formLTR{font-family:var(--font-stack);text-align:left;width:100%}.formRTL{font-family:var(--font-stack);text-align:right;width:100%}";
6
7
  const SearchcraftAutoSearchFormStyle0 = searchcraftAutoSearchFormModuleCss;
@@ -18,11 +19,9 @@ const SearchcraftAutoSearchForm = class {
18
19
  this.searchStore.setQuery(this.query);
19
20
  if (this.query.trim() === '') {
20
21
  this.searchResults = null;
22
+ this.inputClearedOrNoResults.emit();
21
23
  this.searchStore.setSearchResults(null);
22
24
  }
23
- else {
24
- this.querySubmit.emit(this.query);
25
- }
26
25
  };
27
26
  this.handleInputKeyUp = (event) => {
28
27
  const target = event.detail;
@@ -37,6 +36,7 @@ const SearchcraftAutoSearchForm = class {
37
36
  if (this.query.trim() === '') {
38
37
  this.searchResults = null;
39
38
  this.searchStore.setSearchResults(null);
39
+ this.inputClearedOrNoResults.emit();
40
40
  }
41
41
  else {
42
42
  this.searchStore.setQuery(this.query);
@@ -46,6 +46,9 @@ const SearchcraftAutoSearchForm = class {
46
46
  }, this.debounceDelay);
47
47
  };
48
48
  this.handleClearInput = () => {
49
+ if (this.query === '' && !this.searchResults) {
50
+ return;
51
+ }
49
52
  this.query = '';
50
53
  this.searchResults = null;
51
54
  this.searchStore.setQuery('');
@@ -84,9 +87,11 @@ const SearchcraftAutoSearchForm = class {
84
87
  this.autoSearchFormClass = '';
85
88
  this.clearInput = () => { };
86
89
  this.config = {
87
- apiKey: '',
90
+ readKey: '',
88
91
  endpointURL: '',
89
92
  index: [],
93
+ organizationId: '',
94
+ applicationId: '',
90
95
  };
91
96
  this.customStylesForInput = {};
92
97
  this.inputCaptionValue = '';
@@ -102,7 +107,10 @@ const SearchcraftAutoSearchForm = class {
102
107
  this.searchResults = null;
103
108
  }
104
109
  componentDidLoad() {
105
- const searchcraft = new g(this.config);
110
+ const searchcraft = new ie(this.config, {
111
+ sdkName: packageJson.name,
112
+ sdkVersion: packageJson.version,
113
+ });
106
114
  this.searchStore.initialize(searchcraft, true);
107
115
  this.unsubscribe = useSearchcraftStore.subscribe((state) => {
108
116
  this.isRequesting = state.isRequesting;
@@ -117,12 +125,12 @@ const SearchcraftAutoSearchForm = class {
117
125
  render() {
118
126
  const formClass = this.rightToLeftOrientation ? 'formRTL' : 'formLTR';
119
127
  const parsedCustomStyles = parseCustomStyles(this.customStylesForInput);
120
- return (h("form", { key: '2421495aa88b52a47658af9b682e172da7d23691', class: `${formClass}`, onSubmit: this.handleFormSubmit }, h("searchcraft-input-label", { key: '032e7e3a7f83af11422b64b023a38c2f433d3809', label: this.labelForInput }), h("searchcraft-input", { key: 'a3a286e6b5ade795a157a1a046278477731684b4', customStyles: parsedCustomStyles, "input-caption-value": this.inputCaptionValue, "input-icon-height": this.inputIconHeight, "input-icon-width": this.inputIconWidth, "is-requesting": this.isRequesting, onClearInput: this.handleClearInput, onInputKeyUp: this.handleInputKeyUp, onSearchInputChange: this.handleInputChange, "placeholder-value": this.placeholderValue, query: this.query, "right-to-left-orientation": this.rightToLeftOrientation }), this.error && (h("searchcraft-error-message", { key: '4588522cf331cc8165e789bb3d58f35ef5148f11', errorMessage: 'Please enter a search query.' }))));
128
+ return (h("form", { key: '3f8e9a36e827b3f1f8d591622a1c824e7ccc6f83', class: classNames(`${formClass}`, 'searchcraft-auto-search-form'), onSubmit: this.handleFormSubmit }, h("searchcraft-input-label", { key: 'daf9b6aab7185e045891a975ac70a3bf3b7ff75f', label: this.labelForInput }), h("searchcraft-input", { key: '655e92d562a73dcf9857f24075c65c6bbe2215f5', customStyles: parsedCustomStyles, "input-caption-value": this.inputCaptionValue, "input-icon-height": this.inputIconHeight, "input-icon-width": this.inputIconWidth, "is-requesting": this.isRequesting, onClearInput: this.handleClearInput, onInputKeyUp: this.handleInputKeyUp, onSearchInputChange: this.handleInputChange, "placeholder-value": this.placeholderValue, query: this.query, "right-to-left-orientation": this.rightToLeftOrientation }), this.error && (h("searchcraft-error-message", { key: '988624eb1ff71adde2a2e38ab8adb868a5a12469', errorMessage: 'Please enter a search query.' }))));
121
129
  }
122
130
  };
123
131
  SearchcraftAutoSearchForm.style = SearchcraftAutoSearchFormStyle0;
124
132
 
125
- const searchcraftBaseSearchResultModuleCss = "@charset \"UTF-8\";:root{--font-stack:Helvetica, Arial, sans-serif}.interactiveResultContainerLight{align-items:flex-start;border-radius:16px;display:flex;flex-direction:column;gap:16px;padding:8px;position:relative;background-color:#FAFAFA}@media (min-width: 600px){.interactiveResultContainerLight{flex-direction:row}}.interactiveResultContainerDark{align-items:flex-start;border-radius:16px;display:flex;flex-direction:column;gap:16px;padding:8px;position:relative;background-color:#2E2E2E}@media (min-width: 600px){.interactiveResultContainerDark{flex-direction:row}}.resultContainer{align-items:flex-start;display:flex;flex-direction:column;gap:16px}@media (min-width: 600px){.resultContainer{flex-direction:row}}.interactiveIconLarge{display:inline-block;position:absolute;right:5px;top:8px}@media (max-width: 600px){.interactiveIconLarge{display:none}}.interactiveIconSmall{display:inline-block;position:absolute;right:5px;top:-2px}@media (min-width: 600px){.interactiveIconSmall{display:none}}.imageContainer{max-width:100%}.contentContainer{max-height:100%;max-width:100%}@media (min-width: 600px){.contentContainer{max-width:50%}}.secondaryContentContainer{display:flex}.imageLight{border-radius:8px;max-height:100%;max-width:100%;border:1px solid #D9D9D9}.imageDark{border-radius:8px;max-height:100%;max-width:100%;border:1px solid #333}.headingLight{font-family:var(--font-stack);font-size:16px;font-weight:700;line-height:20px;margin-bottom:4px;margin-top:0;position:relative;-webkit-font-smoothing:antialiased;color:#292929}.headingDark{font-family:var(--font-stack);font-size:16px;font-weight:700;line-height:20px;margin-bottom:4px;margin-top:0;position:relative;-webkit-font-smoothing:antialiased;color:#FFF}.subheadingLight{font-family:var(--font-stack);font-size:12px;font-weight:400;line-height:16px;margin-bottom:4px;margin-top:0px;-webkit-font-smoothing:antialiased;color:#737373}.subheadingDark{font-family:var(--font-stack);font-size:12px;font-weight:400;line-height:16px;margin-bottom:4px;margin-top:0px;-webkit-font-smoothing:antialiased;color:#BFBFBF}.primaryContentLight{font-family:var(--font-stack);font-size:16px;font-weight:400;line-height:20px;margin-bottom:4px;margin-top:0px;-webkit-font-smoothing:antialiased;color:#404040}.primaryContentDark{font-family:var(--font-stack);font-size:16px;font-weight:400;line-height:20px;margin-bottom:4px;margin-top:0px;-webkit-font-smoothing:antialiased;color:#E6E6E6}.secondaryContentLight{font-family:var(--font-stack);font-size:16px;font-weight:400;line-height:20px;margin-bottom:4px;margin-top:0px;-webkit-font-smoothing:antialiased;color:#404040}.secondaryContentLight::after{content:\"•\";color:#404040;font-size:1em;margin-left:5px;margin-right:5px}.secondaryContentDark{font-family:var(--font-stack);font-size:16px;font-weight:400;line-height:20px;margin-bottom:4px;margin-top:0px;-webkit-font-smoothing:antialiased;color:#E6E6E6}.tertiaryContentLight{font-family:var(--font-stack);font-size:16px;font-weight:400;line-height:20px;margin-bottom:4px;margin-top:0px;-webkit-font-smoothing:antialiased;color:#404040}.tertiaryContentDark{font-family:var(--font-stack);font-size:16px;font-weight:400;line-height:20px;margin-bottom:4px;margin-top:0px;-webkit-font-smoothing:antialiased;color:#E6E6E6}";
133
+ const searchcraftBaseSearchResultModuleCss = "@charset \"UTF-8\";:root{--font-stack:Helvetica, Arial, sans-serif}.interactiveResultContainerLight{align-items:flex-start;border-radius:16px;display:flex;flex-direction:column;gap:16px;padding:8px;position:relative;background-color:#F7F7F7}@media (min-width: 900px){.interactiveResultContainerLight{flex-direction:row;justify-content:space-between}}.interactiveResultContainerDark{align-items:flex-start;border-radius:16px;display:flex;flex-direction:column;gap:16px;padding:8px;position:relative;background-color:#2E2E2E}@media (min-width: 900px){.interactiveResultContainerDark{flex-direction:row;justify-content:space-between}}.resultContainer{align-items:flex-start;display:flex;flex-direction:column;gap:16px;all:unset;display:inline;color:inherit;text-decoration:none}.resultContainer:hover{cursor:pointer}@media (min-width: 900px){.resultContainer{flex-direction:row}}.interactiveIconLarge{display:inline-block;position:absolute;right:5px;top:8px}@media (max-width: 900px){.interactiveIconLarge{display:none}}.interactiveIconSmall{display:inline-block;position:absolute;right:5px;top:-2px}@media (min-width: 900px){.interactiveIconSmall{display:none}}.imageContainer{max-width:100%}@media (min-width: 900px){.imageContainer{max-width:400px}}.contentContainer{max-height:100%;max-width:100%}@media (min-width: 900px){.contentContainer{max-width:50%}}.secondaryContentContainer{display:flex}.imageLight{border-radius:8px;max-height:100%;max-width:100%}.imageDark{border-radius:8px;max-height:100%;max-width:100%}.titleLight{font-family:var(--font-stack);font-size:16px;font-weight:700;line-height:20px;margin-bottom:4px;margin-top:0;position:relative;-webkit-font-smoothing:antialiased;color:#292929}.titleDark{font-family:var(--font-stack);font-size:16px;font-weight:700;line-height:20px;margin-bottom:4px;margin-top:0;position:relative;-webkit-font-smoothing:antialiased;color:#FFFFFF}.subtitleContentLight{font-family:var(--font-stack);font-size:12px;font-weight:400;line-height:16px;margin-bottom:4px;margin-top:0px;-webkit-font-smoothing:antialiased;color:#737373}.subtitleContentDark{font-family:var(--font-stack);font-size:12px;font-weight:400;line-height:16px;margin-bottom:4px;margin-top:0px;-webkit-font-smoothing:antialiased;color:#BFBFBF}.primaryContentLight{font-family:var(--font-stack);font-size:16px;font-weight:400;line-height:20px;margin-bottom:4px;margin-top:0px;-webkit-font-smoothing:antialiased;color:#404040}.primaryContentDark{font-family:var(--font-stack);font-size:16px;font-weight:400;line-height:20px;margin-bottom:4px;margin-top:0px;-webkit-font-smoothing:antialiased;color:#E6E6E6}.secondaryContentLight{font-family:var(--font-stack);font-size:16px;font-weight:400;line-height:20px;margin-bottom:4px;margin-top:0px;-webkit-font-smoothing:antialiased;color:#404040}.secondaryContentDark{font-family:var(--font-stack);font-size:16px;font-weight:400;line-height:20px;margin-bottom:4px;margin-top:0px;-webkit-font-smoothing:antialiased;color:#E6E6E6}.tertiaryContentLight{font-family:var(--font-stack);font-size:16px;font-weight:400;line-height:20px;margin-bottom:4px;margin-top:0px;-webkit-font-smoothing:antialiased;color:#404040}.tertiaryContentLight.hasContent::before{color:#404040;content:\"•\";font-size:10px;margin-left:5px;margin-right:5px}.tertiaryContentDark{font-family:var(--font-stack);font-size:16px;font-weight:400;line-height:20px;margin-bottom:4px;margin-top:0px;-webkit-font-smoothing:antialiased;color:#E6E6E6}.tertiaryContentDark.hasContent::before{color:#404040;content:\"•\";font-size:10px;margin-left:5px;margin-right:5px}";
126
134
  const SearchcraftBaseSearchResultStyle0 = searchcraftBaseSearchResultModuleCss;
127
135
 
128
136
  const SearchcraftBaseSearchResult = class {
@@ -131,49 +139,62 @@ const SearchcraftBaseSearchResult = class {
131
139
  this.buttonCallback = createEvent(this, "buttonCallback", 7);
132
140
  this.keyDownCallback = createEvent(this, "keyDownCallback", 7);
133
141
  this.resultCallback = createEvent(this, "resultCallback", 7);
134
- this.buttonCallback = () => { }; // Callback for button click
135
- this.keyDownCallback = () => { }; // Callback for key down event
136
- this.resultCallback = () => { }; // Callback for result container click
142
+ this.buttonCallback = () => { };
143
+ this.keyDownCallback = () => { };
144
+ this.resultCallback = () => { };
145
+ this.searchcraftStore = useSearchcraftStore.getState();
137
146
  this.handleButtonClick = () => {
138
147
  this.buttonCallback();
139
148
  };
140
- this.handleContainerClick = () => {
141
- if (this.isInteractive) {
142
- this.resultCallback();
149
+ this.handleClick = () => {
150
+ var _a, _b, _c;
151
+ const searchcraft = this.searchcraftStore.getSearchcraftInstance();
152
+ if (searchcraft) {
153
+ const document_position = this.documentPosition;
154
+ const search_term = this.searchcraftStore.query;
155
+ const number_of_documents = ((_c = (_b = (_a = this.searchcraftStore.searchResults) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.hits) === null || _c === void 0 ? void 0 : _c.length) || 0;
156
+ searchcraft.sendMeasureEvent('document_clicked', {
157
+ document_position,
158
+ number_of_documents,
159
+ search_term,
160
+ });
161
+ }
162
+ };
163
+ this.parseStyles = () => {
164
+ try {
165
+ return JSON.parse(this.customStyles);
166
+ }
167
+ catch (error) {
168
+ console.error('Error parsing custom styles:', error);
169
+ return {};
143
170
  }
144
171
  };
145
172
  this.buttonText = '';
146
173
  this.customStyles = '{}';
147
- this.headingText = '';
174
+ this.titleContent = '';
148
175
  this.imageDescription = '';
149
176
  this.imageSource = '';
150
177
  this.isInteractive = false;
178
+ this.linkHref = '';
151
179
  this.primaryContent = '';
152
180
  this.secondaryContent = '';
153
- this.subheadingText = '';
181
+ this.subtitleContent = '';
154
182
  this.tertiaryContent = '';
155
183
  this.themeMode = 'light';
156
184
  this.placeImageRight = false;
157
- }
158
- parseStyles() {
159
- try {
160
- return JSON.parse(this.customStyles);
161
- }
162
- catch (error) {
163
- console.error('Error parsing custom styles:', error);
164
- return {};
165
- }
185
+ this.documentPosition = 0;
166
186
  }
167
187
  render() {
168
188
  const isLightTheme = this.themeMode === 'light';
169
189
  const styles = this.parseStyles();
170
- const imageContainer = this.imageSource && (h("div", { key: '5446a636265cf330a7e67f7539dad7e25077ecda', class: 'imageContainer' }, h("img", { key: '59529cce35008eb171f4ee634ed94ff96e716dad', alt: this.imageDescription, class: isLightTheme ? 'imageLight' : 'imageDark', src: this.imageSource, style: styles.image || {} })));
171
- const contentContainer = (h("div", { key: 'fd052ef1e3dedcf5b1467b6b0760d0be349c1faf', class: 'contentContainer' }, h("h2", { key: '1d1eca475651641b34d477ea7e2ea2f3eb7a2c49', class: isLightTheme ? 'headingLight' : 'headingDark', style: styles.heading || {} }, this.headingText), h("h3", { key: '9fcf054f634d088b72b67a2675b67a89f651285b', class: isLightTheme ? 'subheadingLight' : 'subheadingDark', style: styles.subheading || {} }, this.subheadingText), h("p", { key: '477078081008771a462abb042232b84f1e72ddd5', class: isLightTheme ? 'primaryContentLight' : 'primaryContentDark', style: styles.primaryContent || {} }, this.primaryContent), h("div", { key: '716ea0fe1efbd18f0b6313baac80834fbab53001', class: 'secondaryContentContainer' }, h("p", { key: '340dad3f568e5cc2b0a1b412b92a335b9afb7a0f', class: isLightTheme ? 'secondaryContentLight' : 'secondaryContentDark', style: styles.secondaryContent || {} }, this.secondaryContent), h("p", { key: 'b0c940aab4b48d4e560aabe7551b3c1a0a4ef3ae', class: isLightTheme ? 'tertiaryContentLight' : 'tertiaryContentDark', style: styles.tertiaryContent || {} }, this.tertiaryContent)), this.buttonText && (h("button", { key: 'd9a08ff62c8bc7d2b13bb42872e2391290de0712', onClick: this.handleButtonClick, style: styles.button || {}, type: 'button' }, this.buttonText))));
172
- return (h("div", { key: '310676a0e48c3a3d76559b3e3012db1681a55499', class: this.isInteractive
190
+ const imageStyle = isLightTheme ? 'imageLight' : 'imageDark';
191
+ const imageContainer = this.imageSource && (h("div", { key: '53541a311548a653d43505356b9a4f25a417093f', class: classNames('imageContainer', 'searchcraft-base-search-result-image-container') }, h("img", { key: '919a46fd856b521a548c2ce6bab8b360507469c2', alt: this.imageDescription, class: classNames(imageStyle, 'searchcraft-search-result-image'), src: this.imageSource, style: styles.image || {} })));
192
+ const contentContainer = (h("div", { key: '944700daf2a0b683769bad992253a8482f71f685', class: classNames('contentContainer', 'searchcraft-base-search-result-content-container') }, h("h2", { key: '623096e2c7cf5f11bac7127cb00342386866089e', class: classNames(isLightTheme ? 'titleLight' : 'titleDark', 'searchcraft-base-search-result-title'), style: styles.title || {} }, this.titleContent), h("h3", { key: '2928f4d872e90d99fac31b75c9fecfee7e2a9a41', class: classNames(isLightTheme ? 'subtitleContentLight' : 'subtitleContentDark', 'searchcraft-base-search-result-subtitle'), style: styles.subtitle || {} }, this.subtitleContent), h("p", { key: '93bd00c9482d492a2d3d6262dba33044d4470d2c', class: classNames(isLightTheme ? 'primaryContentLight' : 'primaryContentDark', 'searchcraft-base-search-result-primary-content'), style: styles.primaryContent || {} }, this.primaryContent), h("div", { key: 'dc3bce7c0f75d121ba3068b3717fd5d934036012', class: classNames('secondaryContentContainer', 'searchcraft-base-search-result-secondary-content-container') }, h("p", { key: '80624ec83a0a7086142b6a35b4ac65d1fdb76a4e', class: classNames(isLightTheme ? 'secondaryContentLight' : 'secondaryContentDark', 'searchcraft-base-search-result-secondary-content'), style: styles.secondaryContent || {} }, this.secondaryContent), h("p", { key: '53bdb3471b16fd4a1f525d99472c3a4d5662b722', class: classNames(`${isLightTheme ? 'tertiaryContentLight' : 'tertiaryContentDark'}${this.tertiaryContent ? ' hasContent' : ''}`, 'searchcraft-base-search-result-tertiary-content'), style: styles.tertiaryContent || {} }, this.tertiaryContent)), this.buttonText && (h("button", { key: '442dc9aebe748ef06710e196382a80bf006a383e', onClick: this.handleButtonClick, style: styles.button || {}, type: 'button' }, this.buttonText))));
193
+ return (h("a", { key: '2cf6a6d3768266f6d46e700588083aade92142f7', class: classNames(this.isInteractive
173
194
  ? isLightTheme
174
195
  ? 'interactiveResultContainerLight'
175
196
  : 'interactiveResultContainerDark'
176
- : 'resultContainer', onKeyDown: this.keyDownCallback, onClick: this.handleContainerClick, style: styles.container || {}, tabindex: '0' }, this.placeImageRight ? (h(Fragment, null, contentContainer, imageContainer)) : (h(Fragment, null, imageContainer, contentContainer))));
197
+ : 'resultContainer', 'searchcraft-search-result-container'), onKeyDown: this.keyDownCallback, onClick: this.handleClick, href: this.linkHref, rel: 'noreferrer', style: styles.container || {}, tabindex: '0', target: '_blank' }, this.placeImageRight ? (h(Fragment, null, contentContainer, imageContainer)) : (h(Fragment, null, imageContainer, contentContainer))));
177
198
  }
178
199
  };
179
200
  SearchcraftBaseSearchResult.style = SearchcraftBaseSearchResultStyle0;
@@ -184,6 +205,7 @@ const SearchcraftBaseSearchResultsStyle0 = searchcraftBaseSearchResultsModuleCss
184
205
  const SearchcraftBaseSearchResults = class {
185
206
  constructor(hostRef) {
186
207
  registerInstance(this, hostRef);
208
+ this.noResults = createEvent(this, "noResults", 7);
187
209
  this.adInterval = 4;
188
210
  this.customStylesForResults = {};
189
211
  this.documentAttributesForDisplay = '';
@@ -192,6 +214,7 @@ const SearchcraftBaseSearchResults = class {
192
214
  this.placeAdAtEnd = false;
193
215
  this.placeAdAtStart = true;
194
216
  this.placeResultImageRight = false;
217
+ this.isInteractive = false;
195
218
  this.hasSearched = false;
196
219
  this.query = '';
197
220
  this.searchResults = null;
@@ -222,9 +245,9 @@ const SearchcraftBaseSearchResults = class {
222
245
  }
223
246
  }
224
247
  render() {
225
- var _a, _b, _c, _d, _e, _f, _g;
248
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
226
249
  if (!this.hasSearched) {
227
- return (h("div", { class: 'emptyState' }, h("slot", { name: 'empty-search' })));
250
+ return (h("div", { class: classNames('emptyState', 'searchcraft-search-results-empty-state-container') }, h("slot", { name: 'empty-search' })));
228
251
  }
229
252
  if (!((_a = this.searchResults) === null || _a === void 0 ? void 0 : _a.data)) {
230
253
  return;
@@ -247,17 +270,17 @@ const SearchcraftBaseSearchResults = class {
247
270
  }
248
271
  }
249
272
  }
250
- return (h("searchcraft-base-search-result", { "button-callback": () => console.log('button callback'), "custom-styles": serializedStyles, "image-source": dynamicProperties[parsedSearchKeys[parsedSearchKeys.length - 1]], "is-interactive": true, key: `${document.document_id}-${index}`, "keydown-callback": () => console.log('keydown'), "heading-text": dynamicProperties[parsedSearchKeys[0]], "place-image-right": this.placeResultImageRight, "primary-content": dynamicProperties[parsedSearchKeys[2]], "result-callback": () => console.log('interactive element'), "secondary-content": dynamicProperties[parsedSearchKeys[3]], "subheading-text": dynamicProperties[parsedSearchKeys[1]], "tertiary-content": dynamicProperties[parsedSearchKeys[4]] }));
273
+ return (h("searchcraft-base-search-result", { "button-callback": () => console.log('button callback'), "custom-styles": serializedStyles, "image-source": dynamicProperties[parsedSearchKeys[5]], "is-interactive": this.isInteractive, key: `${document.document_id}-${index}`, "keydown-callback": () => console.log('keydown'), linkHref: dynamicProperties[parsedSearchKeys[6]], "place-image-right": this.placeResultImageRight, "primary-content": dynamicProperties[parsedSearchKeys[2]], "result-callback": () => console.log('interactive element'), "secondary-content": dynamicProperties[parsedSearchKeys[3]], "subtitle-content": dynamicProperties[parsedSearchKeys[1]], "tertiary-content": dynamicProperties[parsedSearchKeys[4]], "title-content": dynamicProperties[parsedSearchKeys[0]], "document-position": index }));
251
274
  });
252
275
  const finalComponents = [];
253
276
  if (this.placeAdAtStart) {
254
- finalComponents.push(h("div", { key: 'ad-section-start', class: 'adSection' }, h("span", null, "##"), h("p", null, " Ad Impressions")));
277
+ finalComponents.push(h("div", { key: 'ad-section-start', class: classNames('adSection', 'searchcraft-beginning-injected-ad-section') }, h("span", null, "##"), h("p", null, " Ad Impressions")));
255
278
  }
256
279
  if (this.adInterval > 0) {
257
280
  resultsComponents.forEach((component, index) => {
258
281
  finalComponents.push(component);
259
282
  if ((index + 1) % this.adInterval === 0) {
260
- finalComponents.push(h("div", { key: `ad-section-${index + 1}`, class: 'adSection' }, h("span", null, "##"), h("p", null, " Ad Impressions")));
283
+ finalComponents.push(h("div", { key: `ad-section-${index + 1}`, class: classNames('adSection', 'searchcraft-dynamic-injected-ad-section') }, h("span", null, "##"), h("p", null, " Ad Impressions")));
261
284
  }
262
285
  });
263
286
  }
@@ -265,10 +288,13 @@ const SearchcraftBaseSearchResults = class {
265
288
  finalComponents.push(...resultsComponents);
266
289
  }
267
290
  if (this.placeAdAtEnd) {
268
- finalComponents.push(h("div", { key: 'ad-section-end', class: 'adSection' }, h("span", null, "##"), h("p", null, " Ad Impressions")));
291
+ finalComponents.push(h("div", { key: 'ad-section-end', class: classNames('adSection', 'searchcraft-end-injected-ad-section') }, h("span", null, "##"), h("p", null, " Ad Impressions")));
269
292
  }
270
- return (h("div", { class: 'resultsContainer' }, finalComponents, this.query.length > 0 &&
271
- ((_g = (_f = (_e = this.searchResults) === null || _e === void 0 ? void 0 : _e.data) === null || _f === void 0 ? void 0 : _f.hits) === null || _g === void 0 ? void 0 : _g.length) === 0 && (h("div", { class: 'errorMessageContainer' }, h("searchcraft-error-message", { "error-message": `No search results found for "${this.query}" query` })))));
293
+ if (this.query.length > 0 && ((_g = (_f = (_e = this.searchResults) === null || _e === void 0 ? void 0 : _e.data) === null || _f === void 0 ? void 0 : _f.hits) === null || _g === void 0 ? void 0 : _g.length) === 0) {
294
+ this.noResults.emit();
295
+ }
296
+ return (h("div", { class: classNames('resultsContainer', 'searchcraft-search-results-container') }, finalComponents, this.query.length > 0 &&
297
+ ((_k = (_j = (_h = this.searchResults) === null || _h === void 0 ? void 0 : _h.data) === null || _j === void 0 ? void 0 : _j.hits) === null || _k === void 0 ? void 0 : _k.length) === 0 && (h("div", { class: classNames('errorMessageContainer', 'searchcraft-search-results-error-message-container') }, h("searchcraft-error-message", { "error-message": `No search results found for "${this.query}" query` })))));
272
298
  }
273
299
  };
274
300
  SearchcraftBaseSearchResults.style = SearchcraftBaseSearchResultsStyle0;
@@ -303,13 +329,16 @@ const SearchcraftClearIconSet = class {
303
329
  }
304
330
  };
305
331
 
306
- const searchcraftClearInputButtonModuleCss = ":root{--font-stack:Helvetica, Arial, sans-serif}.inputClearButtonLTR{align-items:center;background:none;border:none;display:flex;height:20px;justify-content:center;padding:0;position:absolute;right:0;top:50%;transform:translateY(-50%);width:20px}.inputClearButtonRTL{align-items:center;background:none;border:none;display:flex;height:20px;justify-content:center;left:0px;padding:0;position:absolute;top:50%;transform:translateY(-50%);width:20px}";
332
+ const searchcraftClearInputButtonModuleCss = ":root{--font-stack:Helvetica, Arial, sans-serif}.inputClearButtonLTR{align-items:center;background:none;border:none;display:flex;height:20px;justify-content:center;padding:0;position:absolute;right:16px;top:52%;transform:translateY(-50%);width:20px}.inputClearButtonRTL{align-items:center;background:none;border:none;display:flex;height:20px;justify-content:center;left:0px;padding:0;position:absolute;top:52%;transform:translateY(-50%);width:20px}";
307
333
  const SearchcraftClearInputButtonStyle0 = searchcraftClearInputButtonModuleCss;
308
334
 
309
335
  const SearchcraftClearInputButton = class {
310
336
  constructor(hostRef) {
311
337
  registerInstance(this, hostRef);
312
338
  this.clearInput = createEvent(this, "clearInput", 7);
339
+ this.isLightTheme = () => {
340
+ return this.theme === 'light';
341
+ };
313
342
  this.handleClearClick = (event) => {
314
343
  event.preventDefault();
315
344
  this.clearInput.emit();
@@ -318,11 +347,8 @@ const SearchcraftClearInputButton = class {
318
347
  this.rightToLeftOrientation = false;
319
348
  this.theme = 'light';
320
349
  }
321
- isLightTheme() {
322
- return this.theme === 'light';
323
- }
324
350
  render() {
325
- return this.rightToLeftOrientation ? (h("button", { class: classNames('inputClearButtonRTL', '.sc-clear-input-button-rtl'), onClick: this.handleClearClick, type: 'button' }, this.isRequesting ? (this.isLightTheme ? (h("searchcraft-spinner-light", null)) : (h("searchcraft-spinner-dark", null))) : this.isLightTheme ? (h("searchcraft-clear-icon-set", { type: 'clear-light' })) : (h("searchcraft-clear-icon-set", { type: 'clear-dark' })))) : (h("button", { class: classNames('inputClearButtonLTR', '.sc-clear-input-button-ltr'), onClick: this.handleClearClick, type: 'button' }, this.isRequesting ? (this.isLightTheme ? (h("searchcraft-spinner-light", null)) : (h("searchcraft-spinner-dark", null))) : this.isLightTheme ? (h("searchcraft-clear-icon-set", { type: 'clear-light' })) : (h("searchcraft-clear-icon-set", { type: 'clear-dark' }))));
351
+ return this.rightToLeftOrientation ? (h("button", { class: classNames('inputClearButtonRTL', 'searchcraft-clear-input-button-rtl'), onClick: this.handleClearClick, type: 'button' }, this.isLightTheme ? (h("searchcraft-clear-icon-set", { type: 'clear-light' })) : (h("searchcraft-clear-icon-set", { type: 'clear-dark' })))) : (h("button", { class: classNames('inputClearButtonLTR', 'searchcraft-clear-input-button-ltr'), onClick: this.handleClearClick, type: 'button' }, this.isLightTheme ? (h("searchcraft-clear-icon-set", { type: 'clear-light' })) : (h("searchcraft-clear-icon-set", { type: 'clear-dark' }))));
326
352
  }
327
353
  };
328
354
  SearchcraftClearInputButton.style = SearchcraftClearInputButtonStyle0;
@@ -347,12 +373,12 @@ const SearchcraftErrorMessage = class {
347
373
  }
348
374
  render() {
349
375
  const errorMessageStyle = this.theme === 'light' ? 'errorMessageLight' : 'errorMessageDark';
350
- return (h("p", { key: '7c26f9a1b2589d57a81f7909c456e712d9b7fe79', class: classNames(errorMessageStyle) }, this.errorMessage || 'Search term is required.'));
376
+ return (h("p", { key: '877438178c5fe951ff4cd184de7130e4e46739a1', class: classNames(errorMessageStyle, 'searchcraft-error-message') }, this.errorMessage || 'Search term is required.'));
351
377
  }
352
378
  };
353
379
  SearchcraftErrorMessage.style = SearchcraftErrorMessageStyle0;
354
380
 
355
- const searchcraftFiltersListModuleCss = ".filtersList{width:100%}.checkboxLabel{align-items:center;color:#292929;display:flex;font-family:\"Source Sans Pro\";font-size:14px;font-weight:600;gap:14px;position:relative;-webkit-font-smoothing:antialiased}.checkboxLabel input[type=checkbox]{align-items:center;appearance:none;background-color:#EDEDED;border:1px solid #D9D9D9;cursor:pointer;display:flex;height:24px;justify-content:center;width:24px}.checkboxLabel input[type=checkbox]:checked{background-color:#000;position:relative}.checkboxLabel input[type=checkbox]:checked+.checkContainer{display:block}.checkboxLabel input[type=checkbox]:checked+.dashContainer{display:block}.remainingFilterListCheckbox{margin-left:16px}.childCheckboxLabel{align-items:center;color:#292929;display:flex;font-family:\"Source Sans Pro\";font-size:14px;font-weight:600;gap:12px;position:relative}.childCheckboxLabel input[type=checkbox]{align-items:center;appearance:none;background-color:#EDEDED;border:1px solid #D9D9D9;cursor:pointer;display:flex;height:24px;justify-content:center;position:relative;width:24px;-webkit-font-smoothing:antialiased}.childCheckboxLabel input[type=checkbox]:checked{background-color:#000;position:relative}.childCheckboxLabel input[type=checkbox]:checked+.checkContainer{display:block}.childCheckboxLabel input[type=checkbox]:checked+.dashContainer{display:block}.checkContainer{display:none;height:16px;width:16px;position:absolute;top:10px;left:7px}.dashContainer{display:none;height:3px;width:14px;position:absolute;top:5px;left:9px}.loading{align-items:center;display:flex;justify-content:center;margin:100px}";
381
+ const searchcraftFiltersListModuleCss = ":root{--font-stack:Helvetica, Arial, sans-serif}.filtersListContainer{width:100%}.filterCheckboxLabel{align-items:center;color:#292929;display:flex;font-family:var(--font-stack);font-size:14px;font-weight:600;gap:14px;position:relative;-webkit-font-smoothing:antialiased}.filterCheckboxLabel input[type=checkbox]{align-items:center;appearance:none;background-color:#EBEBEB;border:1px solid #D9D9D9;border-radius:8px;cursor:pointer;display:flex;height:24px;justify-content:center;width:24px}.filterCheckboxLabel input[type=checkbox]:focus{outline:2px solid #000000}.filterCheckboxLabel input[type=checkbox]:checked{background-color:#000000;position:relative}.filterCheckboxLabel input[type=checkbox]:checked+.checkContainer{display:block}.filterCheckboxLabel input[type=checkbox]:checked+.dashContainer{display:block}.childFilterCheckboxLabel{align-items:center;color:#292929;display:flex;font-family:var(--font-stack);font-size:14px;font-weight:600;gap:12px;margin-left:24px;position:relative}.childFilterCheckboxLabel input[type=checkbox]{align-items:center;appearance:none;background-color:#EBEBEB;border:1px solid #D9D9D9;border-radius:8px;cursor:pointer;display:flex;height:24px;justify-content:center;position:relative;width:24px;-webkit-font-smoothing:antialiased}.childFilterCheckboxLabel input[type=checkbox]:focus{outline:2px solid #000000}.childFilterCheckboxLabel input[type=checkbox]:checked{background-color:#000000;position:relative}.childFilterCheckboxLabel input[type=checkbox]:checked+.checkContainer{display:block}.childFilterCheckboxLabel input[type=checkbox]:checked+.dashContainer{display:block}.checkContainer{display:none;height:16px;width:16px;position:absolute;top:9px;left:8px}.dashContainer{display:none;height:3px;width:14px;position:absolute;top:3px;left:9px}";
356
382
  const SearchcraftFiltersListStyle0 = searchcraftFiltersListModuleCss;
357
383
 
358
384
  const SearchcraftFiltersList = class {
@@ -366,6 +392,7 @@ const SearchcraftFiltersList = class {
366
392
  this.searchStore.setSelectedFilters([]);
367
393
  this.emitFiltersUpdate();
368
394
  };
395
+ this.formatLabel = (label, count) => `${label.replace(/-/g, ' ').replace(/\b\w/g, (char) => char.toUpperCase())} (${count})`;
369
396
  this.filters = [];
370
397
  this.dynamicFilters = [];
371
398
  this.selectedFilters = [];
@@ -420,16 +447,13 @@ const SearchcraftFiltersList = class {
420
447
  const parentFilter = this.dynamicFilters.find((filter) => filter.value === value);
421
448
  const childValues = ((_a = parentFilter === null || parentFilter === void 0 ? void 0 : parentFilter.children) === null || _a === void 0 ? void 0 : _a.map((child) => child.value)) || [];
422
449
  if (!isChecked) {
423
- // Remove children from selectedFilters when parent is unchecked
424
450
  this.selectedFilters = this.selectedFilters.filter((filter) => filter !== value && !childValues.includes(filter));
425
451
  }
426
452
  else {
427
- // Add parent filter to selectedFilters
428
453
  this.selectedFilters = [...this.selectedFilters, value];
429
454
  }
430
455
  }
431
456
  else {
432
- // Update selectedFilters for child filters
433
457
  this.selectedFilters = isChecked
434
458
  ? [...this.selectedFilters, value]
435
459
  : this.selectedFilters.filter((filter) => filter !== value);
@@ -441,23 +465,19 @@ const SearchcraftFiltersList = class {
441
465
  this.searchStore.setSelectedFilters(this.selectedFilters);
442
466
  this.searchStore.search();
443
467
  }
444
- formatLabel(label, count) {
445
- return `${label.replace(/-/g, ' ').replace(/\b\w/g, (char) => char.toUpperCase())} (${count})`;
446
- }
447
468
  render() {
448
469
  if (!this.query || this.resultsCount === 0) {
449
470
  return null;
450
471
  }
451
- return (h("div", { class: 'filtersList' }, this.dynamicFilters.map((filter) => {
472
+ return (h("div", { class: classNames('filtersListContainer', 'searchcraft-filters-list-container') }, this.dynamicFilters.map((filter) => {
452
473
  const isChildSelected = filter.children
453
474
  ? filter.children.some((child) => this.selectedFilters.includes(child.value))
454
475
  : false;
455
- return (h("div", { key: filter.value, class: 'filterItem' }, h("label", { class: 'checkboxLabel' }, h("input", { type: 'checkbox', checked: this.selectedFilters.includes(filter.value), onChange: (event) => this.handleCheckboxChange(filter.value, event.target.checked, true) }), isChildSelected ? (h("div", { class: 'dashContainer' }, h("searchcraft-dash-icon", null))) : (h("div", { class: 'checkContainer' }, h("searchcraft-check-icon", null))), this.formatLabel(filter.label, filter.count)), filter.children && filter.children.length > 0 && (h("div", { class: 'childrenContainer' }, filter.children.map((child) => (h("label", { key: child.value, class: 'childCheckboxLabel', style: {
456
- marginLeft: '20px',
476
+ return (h("div", { key: filter.value, class: classNames('searchcraft-filters-list-item') }, h("label", { class: classNames('filterCheckboxLabel', 'searchcraft-filters-list-checkbox-label') }, h("input", { checked: this.selectedFilters.includes(filter.value), onChange: (event) => this.handleCheckboxChange(filter.value, event.target.checked, true), type: 'checkbox' }), isChildSelected ? (h("div", { class: classNames('dashContainer', 'searchcraft-filter-list-dash-container') }, h("searchcraft-dash-icon", null))) : (h("div", { class: classNames('checkContainer', 'searchcraft-filter-list-check-container') }, h("searchcraft-check-icon", null))), this.formatLabel(filter.label, filter.count)), filter.children && filter.children.length > 0 && (h(Fragment, null, filter.children.map((child) => (h("label", { key: child.value, class: classNames('childFilterCheckboxLabel', 'searchcraft-child-filter-checkbox-label'), style: {
457
477
  display: this.selectedFilters.includes(filter.value)
458
478
  ? 'flex'
459
479
  : 'none',
460
- } }, h("input", { type: 'checkbox', checked: this.selectedFilters.includes(child.value), onChange: (event) => this.handleCheckboxChange(child.value, event.target.checked) }), h("div", { class: 'checkContainer' }, h("searchcraft-check-icon", null)), this.formatLabel(child.label.includes('/')
480
+ } }, h("input", { checked: this.selectedFilters.includes(child.value), onChange: (event) => this.handleCheckboxChange(child.value, event.target.checked), type: 'checkbox' }), h("div", { class: classNames('checkContainer', 'searchcraft-filter-list-check-container') }, h("searchcraft-check-icon", null)), this.formatLabel(child.label.includes('/')
461
481
  ? child.label.split('/').pop() || child.label
462
482
  : child.label, child.count))))))));
463
483
  })));
@@ -465,7 +485,7 @@ const SearchcraftFiltersList = class {
465
485
  };
466
486
  SearchcraftFiltersList.style = SearchcraftFiltersListStyle0;
467
487
 
468
- const searchcraftInputModuleCss = ":root{--font-stack:Helvetica, Arial, sans-serif}.inputContainerLTR{position:relative;width:100%}.inputContainerRTL{position:relative;width:100%;margin-left:8px}.inputLightLTR{border:none;border-radius:8px;font-family:var(--font-stack);outline:none;padding-bottom:15px;padding-top:15px;width:100%;background-color:#EDEDED;color:#292929;margin-right:8px;padding-left:36px;padding-right:16px}.inputLightLTR::placeholder{font-family:var(--font-stack);font-size:16px}.inputLightLTR::placeholder{color:#737373}.inputLightLTR:focus{outline:2px solid #000}.inputDarkLTR{border:none;border-radius:8px;font-family:var(--font-stack);outline:none;padding-bottom:15px;padding-top:15px;width:100%;background-color:#1A1A1A;color:#FFF;margin-right:8px;padding-left:36px;padding-right:16px}.inputDarkLTR::placeholder{font-family:var(--font-stack);font-size:16px}.inputDarkLTR::placeholder{color:#BFBFBF}.inputDarkLTR:focus{outline:2px solid #FFF}.inputErrorLightLTR{border:none;border-radius:8px;font-family:var(--font-stack);outline:none;padding-bottom:15px;padding-top:15px;width:100%;background-color:#EDEDED;color:#292929;outline:2px solid #c00;margin-right:8px;padding-left:36px;padding-right:16px}.inputErrorLightLTR::placeholder{font-family:var(--font-stack);font-size:16px}.inputErrorLightLTR::placeholder{color:#737373}.inputErrorLightLTR:focus{outline:2px solid #000}.inputErrorLightLTR:focus-visible{outline:2px solid #c00}.inputErrorDarkLTR{border:none;border-radius:8px;font-family:var(--font-stack);outline:none;padding-bottom:15px;padding-top:15px;width:100%;background-color:#1A1A1A;color:#FFF;outline:2px solid #FFB3B3;margin-right:8px;padding-left:36px;padding-right:16px}.inputErrorDarkLTR::placeholder{font-family:var(--font-stack);font-size:16px}.inputErrorDarkLTR::placeholder{color:#BFBFBF}.inputErrorDarkLTR:focus{outline:2px solid #FFF}.inputErrorDarkLTR:focus-visible{outline:2px solid #FFB3B3}.inputLightRTL{border:none;border-radius:8px;font-family:var(--font-stack);outline:none;padding-bottom:15px;padding-top:15px;width:100%;background-color:#EDEDED;color:#292929;margin-left:8px;padding-left:16px;padding-right:36px;text-align:right}.inputLightRTL::placeholder{font-family:var(--font-stack);font-size:16px}.inputLightRTL::placeholder{color:#737373}.inputLightRTL:focus{outline:2px solid #000}.inputDarkRTL{border:none;border-radius:8px;font-family:var(--font-stack);outline:none;padding-bottom:15px;padding-top:15px;width:100%;background-color:#1A1A1A;color:#FFF;margin-left:8px;padding-left:16px;padding-right:36px;text-align:right}.inputDarkRTL::placeholder{font-family:var(--font-stack);font-size:16px}.inputDarkRTL::placeholder{color:#BFBFBF}.inputDarkRTL:focus{outline:2px solid #FFF}.inputErrorLightRTL{border:none;border-radius:8px;font-family:var(--font-stack);outline:none;padding-bottom:15px;padding-top:15px;width:100%;background-color:#EDEDED;color:#292929;outline:2px solid #c00;margin-left:8px;padding-left:16px;padding-right:36px;text-align:right}.inputErrorLightRTL::placeholder{font-family:var(--font-stack);font-size:16px}.inputErrorLightRTL::placeholder{color:#737373}.inputErrorLightRTL:focus{outline:2px solid #000}.inputErrorLightRTL:focus-visible{outline:2px solid #c00}.inputErrorDarkRTL{border:none;border-radius:8px;font-family:var(--font-stack);outline:none;padding-bottom:15px;padding-top:15px;width:100%;background-color:#1A1A1A;color:#FFF;outline:2px solid #FFB3B3;margin-left:8px;padding-left:16px;padding-right:36px;text-align:right}.inputErrorDarkRTL::placeholder{font-family:var(--font-stack);font-size:16px}.inputErrorDarkRTL::placeholder{color:#BFBFBF}.inputErrorDarkRTL:focus{outline:2px solid #FFF}.inputErrorDarkRTL:focus-visible{outline:2px solid #FFB3B3}.inputWrapper{align-items:center;display:flex;position:relative;width:100%}";
488
+ const searchcraftInputModuleCss = ":root{--font-stack:Helvetica, Arial, sans-serif}.inputContainerLTR{position:relative;width:100%}.inputContainerRTL{position:relative;width:100%;margin-left:8px}.inputLightLTR{border:none;border-radius:8px;font-family:var(--font-stack);outline:none;padding-bottom:15px;padding-top:15px;background-color:#F3F3F3;color:#292929;margin-right:8px;padding-left:36px;padding-right:16px}.inputLightLTR::placeholder{font-family:var(--font-stack);font-size:16px;font-weight:400}.inputLightLTR::placeholder{color:#737373}.inputLightLTR:focus{outline:2px solid #000000}.inputDarkLTR{border:none;border-radius:8px;font-family:var(--font-stack);outline:none;padding-bottom:15px;padding-top:15px;background-color:#1A1A1A;color:#FFFFFF;margin-right:8px;padding-left:36px;padding-right:16px}.inputDarkLTR::placeholder{font-family:var(--font-stack);font-size:16px;font-weight:400}.inputDarkLTR::placeholder{color:#BFBFBF}.inputDarkLTR:focus{outline:2px solid #FFFFFF}.inputErrorLightLTR{border:none;border-radius:8px;font-family:var(--font-stack);outline:none;padding-bottom:15px;padding-top:15px;background-color:#F3F3F3;color:#292929;outline:2px solid #CC0000;margin-right:8px;padding-left:36px;padding-right:16px}.inputErrorLightLTR::placeholder{font-family:var(--font-stack);font-size:16px;font-weight:400}.inputErrorLightLTR::placeholder{color:#737373}.inputErrorLightLTR:focus{outline:2px solid #000000}.inputErrorLightLTR:focus-visible{outline:2px solid #CC0000}.inputErrorDarkLTR{border:none;border-radius:8px;font-family:var(--font-stack);outline:none;padding-bottom:15px;padding-top:15px;background-color:#1A1A1A;color:#FFFFFF;outline:2px solid #FFB3B3;margin-right:8px;padding-left:36px;padding-right:16px}.inputErrorDarkLTR::placeholder{font-family:var(--font-stack);font-size:16px;font-weight:400}.inputErrorDarkLTR::placeholder{color:#BFBFBF}.inputErrorDarkLTR:focus{outline:2px solid #FFFFFF}.inputErrorDarkLTR:focus-visible{outline:2px solid #FFB3B3}.inputLightRTL{border:none;border-radius:8px;font-family:var(--font-stack);outline:none;padding-bottom:15px;padding-top:15px;background-color:#F3F3F3;color:#292929;margin-left:8px;padding-left:16px;padding-right:36px;text-align:right}.inputLightRTL::placeholder{font-family:var(--font-stack);font-size:16px;font-weight:400}.inputLightRTL::placeholder{color:#737373}.inputLightRTL:focus{outline:2px solid #000000}.inputDarkRTL{border:none;border-radius:8px;font-family:var(--font-stack);outline:none;padding-bottom:15px;padding-top:15px;background-color:#1A1A1A;color:#FFFFFF;margin-left:8px;padding-left:16px;padding-right:36px;text-align:right}.inputDarkRTL::placeholder{font-family:var(--font-stack);font-size:16px;font-weight:400}.inputDarkRTL::placeholder{color:#BFBFBF}.inputDarkRTL:focus{outline:2px solid #FFFFFF}.inputErrorLightRTL{border:none;border-radius:8px;font-family:var(--font-stack);outline:none;padding-bottom:15px;padding-top:15px;background-color:#F3F3F3;color:#292929;outline:2px solid #CC0000;margin-left:8px;padding-left:16px;padding-right:36px;text-align:right}.inputErrorLightRTL::placeholder{font-family:var(--font-stack);font-size:16px;font-weight:400}.inputErrorLightRTL::placeholder{color:#737373}.inputErrorLightRTL:focus{outline:2px solid #000000}.inputErrorLightRTL:focus-visible{outline:2px solid #CC0000}.inputErrorDarkRTL{border:none;border-radius:8px;font-family:var(--font-stack);outline:none;padding-bottom:15px;padding-top:15px;background-color:#1A1A1A;color:#FFFFFF;outline:2px solid #FFB3B3;margin-left:8px;padding-left:16px;padding-right:36px;text-align:right}.inputErrorDarkRTL::placeholder{font-family:var(--font-stack);font-size:16px;font-weight:400}.inputErrorDarkRTL::placeholder{color:#BFBFBF}.inputErrorDarkRTL:focus{outline:2px solid #FFFFFF}.inputErrorDarkRTL:focus-visible{outline:2px solid #FFB3B3}.inputWrapper{align-items:center;display:flex;position:relative;width:100%}";
469
489
  const SearchcraftInputStyle0 = searchcraftInputModuleCss;
470
490
 
471
491
  const SearchcraftInput = class {
@@ -474,6 +494,23 @@ const SearchcraftInput = class {
474
494
  this.clearInput = createEvent(this, "clearInput", 7);
475
495
  this.searchInputChange = createEvent(this, "searchInputChange", 7);
476
496
  this.inputKeyUp = createEvent(this, "inputKeyUp", 7);
497
+ this.handleInputChange = (event) => {
498
+ const input = event.target;
499
+ this.searchInputChange.emit(input.value);
500
+ };
501
+ this.handleInputKeyUp = (event) => {
502
+ const input = event.target;
503
+ this.inputKeyUp.emit(input.value);
504
+ };
505
+ this.handleClearInput = () => {
506
+ if (this.query === '') {
507
+ return;
508
+ }
509
+ this.query = '';
510
+ if (this.clearInput) {
511
+ this.clearInput.emit();
512
+ }
513
+ };
477
514
  this.customStyles = {};
478
515
  this.error = false;
479
516
  this.formClassName = '';
@@ -491,35 +528,22 @@ const SearchcraftInput = class {
491
528
  get isLightTheme() {
492
529
  return this.theme === 'light';
493
530
  }
494
- handleInputChange(event) {
495
- const input = event.target;
496
- this.searchInputChange.emit(input.value);
497
- }
498
- handleInputKeyUp(event) {
499
- const input = event.target;
500
- this.inputKeyUp.emit(input.value);
501
- }
502
- handleClearInput() {
503
- if (this.clearInput) {
504
- this.clearInput.emit();
505
- }
506
- }
507
531
  render() {
508
532
  const containerClassName = this.rightToLeftOrientation
509
533
  ? 'inputContainerRTL'
510
534
  : 'inputContainerLTR';
511
- const inputClassName = classNames(this.error
535
+ const inputClassName = this.error
512
536
  ? this.isLightTheme
513
537
  ? 'inputErrorLightRTL'
514
538
  : 'inputErrorDarkRTL'
515
539
  : this.isLightTheme
516
540
  ? 'inputLightLTR'
517
- : 'inputDarkLTR', 'searchcraft-input');
541
+ : 'inputDarkLTR';
518
542
  const validatedCustomStyles = parseCustomStyles(this.customStyles);
519
543
  const placeholderStyle = {
520
544
  fontSize: validatedCustomStyles.placeholderFontSize || '16px',
521
545
  };
522
- return (h("div", { key: '0eea589d7f78b4ae830b1950ab193f9c72797625', class: classNames(containerClassName, this.formClassName, 'searchcraft-input-form') }, this.rightToLeftOrientation ? (h(Fragment, null, h("input", { autoComplete: 'off', class: classNames(inputClassName, 'searchcraft-input'), id: 'searchcraft-input-id', onChange: this.handleInputChange.bind(this), onKeyUp: this.handleInputKeyUp.bind(this), placeholder: this.placeholderValue, type: 'text', value: this.query, style: validatedCustomStyles }), h("style", null, `
546
+ return (h("div", { key: '931c969802f73f4fa4d44ea591b506e5d1f9caf1', class: classNames(containerClassName, this.formClassName, 'searchcraft-input-form') }, this.rightToLeftOrientation ? (h(Fragment, null, h("input", { autoComplete: 'off', class: classNames(inputClassName, 'searchcraft-input'), id: 'searchcraft-input-id', onChange: this.handleInputChange.bind(this), onKeyUp: this.handleInputKeyUp.bind(this), placeholder: this.placeholderValue, style: validatedCustomStyles, type: 'text', value: this.query }), h("style", null, `
523
547
  #searchcraft-input-id::placeholder {
524
548
  font-size: ${placeholderStyle.fontSize};
525
549
  }
@@ -554,18 +578,18 @@ const SearchcraftInputCaption = class {
554
578
  : 'inputCaptionErrorDarkRTL'
555
579
  : this.isLightTheme
556
580
  ? 'inputCaptionLightRTL'
557
- : 'inputCaptionDarkRTL', this.inputCaptionClassName, '.searchcraft-input-caption') }, this.inputCaptionValue)) : (h("p", { class: classNames(this.error
581
+ : 'inputCaptionDarkRTL', this.inputCaptionClassName, 'searchcraft-input-caption') }, this.inputCaptionValue)) : (h("p", { class: classNames(this.error
558
582
  ? this.isLightTheme
559
583
  ? 'inputCaptionErrorLightLTR'
560
584
  : 'inputCaptionErrorDarkLTR'
561
585
  : this.isLightTheme
562
586
  ? 'inputCaptionLightLTR'
563
- : 'inputCaptionDarkLTR', this.inputCaptionClassName, '.searchcraft-input-caption') }, this.inputCaptionValue));
587
+ : 'inputCaptionDarkLTR', this.inputCaptionClassName, 'searchcraft-input-caption') }, this.inputCaptionValue));
564
588
  }
565
589
  };
566
590
  SearchcraftInputCaption.style = SearchcraftInputCaptionStyle0;
567
591
 
568
- const searchcraftInputIconModuleCss = ":root{--font-stack:Helvetica, Arial, sans-serif}.inputIconLTR{left:15px;position:absolute;top:50%;transform:translateY(-50%)}.inputIconRTL{position:absolute;right:15px;top:50%;transform:translateY(-50%)}";
592
+ const searchcraftInputIconModuleCss = ":root{--font-stack:Helvetica, Arial, sans-serif}.inputIconLTR{left:15px;position:absolute;top:52%;transform:translateY(-50%)}.inputIconRTL{position:absolute;right:15px;top:52%;transform:translateY(-50%)}";
569
593
  const SearchcraftInputIconStyle0 = searchcraftInputIconModuleCss;
570
594
 
571
595
  const SearchcraftInputIcon = class {
@@ -581,12 +605,12 @@ const SearchcraftInputIcon = class {
581
605
  return this.theme === 'light';
582
606
  }
583
607
  render() {
584
- return this.error ? (h("div", { class: this.rightToLeftOrientation ? 'inputIconRTL' : 'inputIconLTR' }, this.isLightTheme() ? (h("searchcraft-search-icon-set", { height: this.height, type: 'error-light', width: this.width })) : (h("searchcraft-search-icon-set", { height: this.height, type: 'error-dark', width: this.width })))) : (h("div", { class: this.rightToLeftOrientation ? 'inputIconRTL' : 'inputIconLTR' }, this.isLightTheme() ? (h("searchcraft-search-icon-set", { height: this.height, type: 'search-light', width: this.width })) : (h("searchcraft-search-icon-set", { height: this.height, type: 'search-dark', width: this.width }))));
608
+ return this.error ? (h("div", { class: classNames(this.rightToLeftOrientation ? 'inputIconRTL' : 'inputIconLTR', 'searchcraft-input-icon-container') }, this.isLightTheme() ? (h("searchcraft-search-icon-set", { height: this.height, type: 'error-light', width: this.width })) : (h("searchcraft-search-icon-set", { height: this.height, type: 'error-dark', width: this.width })))) : (h("div", { class: classNames(this.rightToLeftOrientation ? 'inputIconRTL' : 'inputIconLTR', 'searchcraft-input-icon-container') }, this.isLightTheme() ? (h("searchcraft-search-icon-set", { height: this.height, type: 'search-light', width: this.width })) : (h("searchcraft-search-icon-set", { height: this.height, type: 'search-dark', width: this.width }))));
585
609
  }
586
610
  };
587
611
  SearchcraftInputIcon.style = SearchcraftInputIconStyle0;
588
612
 
589
- const searchcraftInputLabelModuleCss = ":root{--font-stack:Helvetica, Arial, sans-serif}.labelLight{font-family:var(--font-stack);font-size:12px;font-weight:400;line-height:16px;margin-top:4px;color:#292929}.labelDark{font-family:var(--font-stack);font-size:12px;font-weight:400;line-height:16px;margin-top:4px;color:#FFF}";
613
+ const searchcraftInputLabelModuleCss = ":root{--font-stack:Helvetica, Arial, sans-serif}.labelLight{font-family:var(--font-stack);font-size:12px;font-weight:400;line-height:16px;margin-top:4px;color:#292929}.labelDark{font-family:var(--font-stack);font-size:12px;font-weight:400;line-height:16px;margin-top:4px;color:#FFFFFF}";
590
614
  const SearchcraftInputLabelStyle0 = searchcraftInputLabelModuleCss;
591
615
 
592
616
  const SearchcraftInputLabel = class {
@@ -604,12 +628,12 @@ const SearchcraftInputLabel = class {
604
628
  return null;
605
629
  }
606
630
  const labelStyle = this.isLightTheme() ? 'labelLight' : 'labelDark';
607
- return (h("label", { class: classNames(labelStyle, this.inputLabelClassName), htmlFor: 'searchcraft-input-id' }, this.label));
631
+ return (h("label", { class: classNames(labelStyle, this.inputLabelClassName, 'searchcraft-input-label'), htmlFor: 'searchcraft-input-id' }, this.label));
608
632
  }
609
633
  };
610
634
  SearchcraftInputLabel.style = SearchcraftInputLabelStyle0;
611
635
 
612
- const searchcraftResultsInfoModuleCss = ".container{border-bottom:1px solid #D9D9D9;display:flex;justify-content:flex-start;width:100%}.resultsInfo{color:#292929;font-size:18px;font-weight:600;line-height:20px;margin:0;margin-bottom:8px}";
636
+ const searchcraftResultsInfoModuleCss = ":root{--font-stack:Helvetica, Arial, sans-serif}.resultsInfoContainer{border-bottom:1px solid #D9D9D9;display:flex;justify-content:flex-start;width:100%}.resultsInfoContent{color:#292929;font-family:var(--font-stack);font-size:18px;font-weight:600;line-height:20px;margin:24px 0 8px}@media (max-width: 900px){.resultsInfoContent{margin:0;margin-bottom:8px}}";
613
637
  const SearchcraftResultsInfoStyle0 = searchcraftResultsInfoModuleCss;
614
638
 
615
639
  const SearchcraftResultsInfo = class {
@@ -626,7 +650,7 @@ const SearchcraftResultsInfo = class {
626
650
  this.isRequesting = state.isRequesting;
627
651
  this.resultsCount = ((_b = (_a = state.searchResults) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.count) || 0;
628
652
  this.responseTime = ((((_d = (_c = state.searchResults) === null || _c === void 0 ? void 0 : _c.data) === null || _d === void 0 ? void 0 : _d.time_taken) || 0) * 1000).toFixed(2);
629
- this.query = state.query || ''; // Update query from store
653
+ this.query = state.query || '';
630
654
  });
631
655
  }
632
656
  disconnectedCallback() {
@@ -638,7 +662,8 @@ const SearchcraftResultsInfo = class {
638
662
  if (!this.query || this.resultsCount === 0) {
639
663
  return null;
640
664
  }
641
- return (h("div", { class: 'container' }, h("p", { class: 'resultsInfo' }, this.resultsCount, " results found in ", this.responseTime, "ms")));
665
+ const formattedResults = formatNumberWithCommas(this.resultsCount);
666
+ return (h("div", { class: classNames('resultsInfoContainer', 'searchcraft-results-info-container') }, h("p", { class: classNames('resultsInfoContent', 'searchcraft-results-info-content') }, formattedResults, " results found in ", this.responseTime, "ms")));
642
667
  }
643
668
  };
644
669
  SearchcraftResultsInfo.style = SearchcraftResultsInfoStyle0;
@@ -667,15 +692,20 @@ const SearchcraftSearchIconSet = class {
667
692
  }
668
693
  };
669
694
 
670
- const searchcraftSliderModuleCss = ".sliderContainer{display:flex;flex-direction:column;gap:10px;font-family:Arial, sans-serif;align-items:center;width:100%}.rangeContainer{display:flex;position:relative;width:100%;align-items:center}.rangeContainer .activeRange{position:absolute;top:50%;transform:translateY(-50%);height:4px;background:#007DB3;z-index:0;border-radius:2px}.rangeContainer .rangeSlider{width:100%;height:4px;background:transparent;border-radius:2px;outline:none;-webkit-appearance:none;appearance:none;position:absolute;margin:0}.rangeContainer .rangeSlider::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;background-color:#FFF;border-radius:50%;border:2px solid #e6e6e6;cursor:pointer}.rangeContainer .rangeSlider::-moz-range-thumb{width:20px;height:20px;background-color:#FFF;border-radius:50%;border:2px solid #e6e6e6;cursor:pointer}.yearLabels{display:flex;justify-content:space-between;width:100%;margin-top:10px;font-size:15px;font-weight:600;font-family:\"Source Sans Pro\", sans-serif;color:#666}.yearLabel{min-width:30px;text-align:center}";
695
+ const searchcraftSliderModuleCss = ".sliderContainer{align-items:center;display:flex;flex-direction:column;gap:10px;width:100%}.rangeContainer{align-items:center;background-color:#D9D9D9;border-radius:999px;display:flex;position:relative;height:4px;width:100%}.rangeContainer::-webkit-slider-runnable-track{pointer-events:none}.rangeContainer .activeRange{background-color:#000000;border-radius:2px;height:4px;position:absolute;top:50%;transform:translateY(-50%);z-index:0}.rangeContainer .activeRange::-webkit-slider-runnable-track{pointer-events:none}.rangeContainer .activeRange::-moz-range-track{pointer-events:none}.rangeContainer .rangeSlider{appearance:none;background:transparent;border-radius:2px;height:4px;margin:0;outline:none;pointer-events:none;position:absolute;width:100%;-webkit-appearance:none}.rangeContainer .rangeSlider::-webkit-slider-thumb{background-color:#FFFFFF;border-radius:50%;border:2px solid #E6E6E6;cursor:pointer;height:20px;pointer-events:all;width:20px;-webkit-appearance:none}.rangeContainer .rangeSlider::-moz-range-thumb{background-color:#FFFFFF;border-radius:50%;border:2px solid #E6E6E6;cursor:pointer;height:20px;pointer-events:all;width:20px}.yearLabels{color:#292929;display:flex;font-family:\"Source Sans Pro\", sans-serif;font-size:15px;font-weight:600;justify-content:space-between;margin-top:10px;width:100%}.yearLabel{min-width:30px;text-align:center}";
671
696
  const SearchcraftSliderStyle0 = searchcraftSliderModuleCss;
672
697
 
673
698
  const SearchcraftSlider = class {
674
699
  constructor(hostRef) {
675
700
  registerInstance(this, hostRef);
701
+ this.rangeChanged = createEvent(this, "rangeChanged", 7);
676
702
  this.searchStore = useSearchcraftStore.getState();
677
703
  this.updateYears = async () => {
678
704
  this.searchStore.setYearsRange([this.startYear, this.endYear]);
705
+ this.rangeChanged.emit({
706
+ startYear: this.startYear,
707
+ endYear: this.endYear,
708
+ });
679
709
  try {
680
710
  if (typeof this.query === 'string' && this.query.trim() !== '') {
681
711
  await this.searchStore.search();
@@ -690,13 +720,17 @@ const SearchcraftSlider = class {
690
720
  };
691
721
  this.handleStartYearChange = (event) => {
692
722
  const value = Number.parseInt(event.target.value, 10);
693
- this.startYear = Math.min(value, this.endYear);
694
- this.updateYears();
723
+ if (value <= this.endYear) {
724
+ this.startYear = value;
725
+ this.updateYears();
726
+ }
695
727
  };
696
728
  this.handleEndYearChange = (event) => {
697
729
  const value = Number.parseInt(event.target.value, 10);
698
- this.endYear = Math.max(value, this.startYear);
699
- this.updateYears();
730
+ if (value >= this.startYear) {
731
+ this.endYear = value;
732
+ this.updateYears();
733
+ }
700
734
  };
701
735
  this.maxYear = new Date().getFullYear();
702
736
  this.minYear = 2014;
@@ -729,47 +763,29 @@ const SearchcraftSlider = class {
729
763
  const rangeMax = this.maxYear;
730
764
  const startPercent = ((this.startYear - rangeMin) / (rangeMax - rangeMin)) * 100;
731
765
  const endPercent = ((this.endYear - rangeMin) / (rangeMax - rangeMin)) * 100;
732
- return (h("div", { class: 'sliderContainer' }, h("div", { class: 'rangeContainer' }, h("div", { class: 'activeRange', style: {
766
+ return (h("div", { class: classNames('sliderContainer', 'searchcraft-slider-container') }, h("div", { class: classNames('rangeContainer', 'searchcraft-slider-range-container') }, h("div", { class: classNames('activeRange', 'searchcraft-slider-active-range'), style: {
733
767
  left: `${startPercent}%`,
734
768
  width: `${endPercent - startPercent}%`,
735
- } }), h("input", { class: 'rangeSlider', max: this.maxYear, min: this.minYear, onInput: this.handleStartYearChange, step: '1', type: 'range', value: this.startYear }), h("input", { class: 'rangeSlider', max: this.maxYear, min: this.minYear, onInput: this.handleEndYearChange, step: '1', type: 'range', value: this.endYear })), h("div", { class: 'yearLabels' }, h("span", { class: 'yearLabel' }, this.startYear), h("span", { class: 'yearLabel' }, this.endYear))));
769
+ } }), h("input", { class: classNames('rangeSlider', 'searchcraft-slider-range-slider-start-thumb'), max: this.maxYear, min: this.minYear, onInput: this.handleStartYearChange, step: '1', type: 'range', value: this.startYear }), h("input", { class: classNames('rangeSlider', 'searchcraft-slider-range-slider-end-thumb'), max: this.maxYear, min: this.minYear, onInput: this.handleEndYearChange, step: '1', type: 'range', value: this.endYear })), h("div", { class: classNames('yearLabels', 'searchcraft-slider-year-label-container') }, h("span", { class: classNames('yearLabel', 'searchcraft-slider-start-year-label') }, this.startYear), h("span", { class: classNames('yearLabel', 'searchcraft-slider-end-year-label') }, this.endYear))));
736
770
  }
737
771
  };
738
772
  SearchcraftSlider.style = SearchcraftSliderStyle0;
739
773
 
740
- const searchcraftSpinnerDarkModuleCss = ".spinnerContainer{background-color:transparent;height:20px;width:20px}.spinnerDark{animation:spinning 1s linear infinite;background:conic-gradient(#000 50%, #FFFFFF);clip-path:circle(50%);height:100%;mask-image:radial-gradient(circle at center, rgba(0, 0, 0, 0) 6.6666666667px, rgb(0, 0, 0) 6.6666666667px);width:100%}.spinnerLight{animation:spinning 1s linear infinite;background:conic-gradient(#737373 50%, #FFFFFF);clip-path:circle(50%);height:100%;mask-image:radial-gradient(circle at center, rgba(0, 0, 0, 0) 6.6666666667px, rgb(0, 0, 0) 6.6666666667px);width:100%}@keyframes spinning{0%{transform:rotate(0deg)}50%{transform:rotate(180deg)}100%{transform:rotate(360deg)}}";
741
- const SearchcraftSpinnerDarkStyle0 = searchcraftSpinnerDarkModuleCss;
742
-
743
- const SearchcraftSpinnerDark = class {
744
- constructor(hostRef) {
745
- registerInstance(this, hostRef);
746
- }
747
- render() {
748
- return (h("div", { key: 'be34b9a3ecec05fdc169145a5db5a4f37bbd404b', class: 'spinnerContainer' }, h("div", { key: 'b59ffd2fe8dd3ac990003bff3085cb571c08730e', class: 'spinnerDark' })));
749
- }
750
- };
751
- SearchcraftSpinnerDark.style = SearchcraftSpinnerDarkStyle0;
752
-
753
- const searchcraftSpinnerLightModuleCss = ".spinnerContainer{background-color:transparent;height:20px;width:20px}.spinnerLight{animation:spinning 1s linear infinite;background:conic-gradient(#737373 50%, #FFFFFF);clip-path:circle(50%);height:100%;mask-image:radial-gradient(circle at center, rgba(0, 0, 0, 0) 6.6666666667px, rgb(0, 0, 0) 6.6666666667px);width:100%}@keyframes spinning{0%{transform:rotate(0deg)}50%{transform:rotate(180deg)}100%{transform:rotate(360deg)}}";
754
- const SearchcraftSpinnerLightStyle0 = searchcraftSpinnerLightModuleCss;
755
-
756
- const SearchcraftSpinnerLight = class {
757
- constructor(hostRef) {
758
- registerInstance(this, hostRef);
759
- }
760
- render() {
761
- return (h("div", { key: 'a4f73eee03d4d7253c04c47995315bd121e8ded3', class: 'spinnerContainer' }, h("div", { key: '53e3486ef7a2fa6029a6107bae2c0655b1608a12', class: 'spinnerLight' })));
762
- }
763
- };
764
- SearchcraftSpinnerLight.style = SearchcraftSpinnerLightStyle0;
765
-
766
- const searchcraftToggleButtonModuleCss = ".toggle-wrapper{background:#ddd;border:none;border-radius:16px;box-shadow:0px 0px 0px 1px rgba(0, 0, 0, 0.05);cursor:pointer;height:26px;margin-left:10px;position:relative;width:44px}.toggle-wrapper.active{background:#007DB3;box-shadow:0px 0px 0px 1px rgba(0, 0, 0, 0.05)}.toggle-wrapper .toggle-switch{background:#fff;border-radius:50%;height:18px;left:4px;position:absolute;top:calc(50% - 9px);transition:transform 0.3s ease;width:18px}.toggle-wrapper .toggle-switch.active{transform:translateX(16px)}";
774
+ const searchcraftToggleButtonModuleCss = ".toggleWrapper{background:#D9D9D9;border:none;border-radius:16px;box-shadow:0px 0px 0px 1px rgba(0, 0, 0, 0.05);cursor:pointer;height:26px;margin-left:10px;position:relative;width:44px}.toggleWrapper.active{background:#000000;box-shadow:0px 0px 0px 1px rgba(0, 0, 0, 0.05)}.toggleWrapper .toggleSwitch{background:#FFFFFF;border-radius:50%;height:18px;left:4px;position:absolute;top:calc(50% - 9px);transition:transform 0.3s ease;width:18px}.toggleWrapper .toggleSwitch.active{transform:translateX(16px)}";
767
775
  const SearchcraftToggleButtonStyle0 = searchcraftToggleButtonModuleCss;
768
776
 
769
777
  const SearchcraftToggleButton = class {
770
778
  constructor(hostRef) {
771
779
  registerInstance(this, hostRef);
780
+ this.autoSearchFormElement = null;
772
781
  this.searchStore = useSearchcraftStore.getState();
782
+ this.handleSearchRequest = () => {
783
+ this.isActive = false;
784
+ this.searchStore.setSearchParams({
785
+ mode: 'fuzzy',
786
+ sort: 'asc',
787
+ });
788
+ };
773
789
  this.handleToggle = async () => {
774
790
  this.isActive = !this.isActive;
775
791
  if (this.type === 'mode') {
@@ -802,21 +818,30 @@ const SearchcraftToggleButton = class {
802
818
  this.query = state.query || '';
803
819
  this.resultsCount = ((_c = (_b = (_a = state.searchResults) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.hits) === null || _c === void 0 ? void 0 : _c.length) || 0;
804
820
  });
821
+ this.autoSearchFormElement = document.querySelector('searchcraft-auto-search-form');
822
+ if (this.autoSearchFormElement) {
823
+ this.autoSearchFormElement.addEventListener('querySubmit', this.handleSearchRequest);
824
+ }
805
825
  }
806
826
  disconnectedCallback() {
807
827
  if (this.unsubscribe) {
808
828
  this.unsubscribe();
809
829
  }
830
+ if (this.autoSearchFormElement) {
831
+ this.autoSearchFormElement.addEventListener('querySubmit', this.handleSearchRequest);
832
+ }
810
833
  }
811
834
  render() {
812
835
  if (!this.query || this.resultsCount === 0) {
813
836
  return null;
814
837
  }
815
- return (h("button", { class: `toggle-wrapper ${this.isActive ? 'active' : ''}`, onClick: this.handleToggle, type: 'button' }, h("div", { class: `toggle-switch ${this.isActive ? 'active' : ''}` })));
838
+ const toggleContainerStyle = `toggleWrapper ${this.isActive ? 'active' : ''}`;
839
+ const toggleSwitchStyle = `toggleSwitch ${this.isActive ? 'active' : ''}`;
840
+ return (h("button", { class: classNames(toggleContainerStyle, 'searchcraft-toggle-button-container'), onClick: this.handleToggle, type: 'button' }, h("div", { class: classNames(toggleSwitchStyle, 'searchcraft-toggle-switch') })));
816
841
  }
817
842
  };
818
843
  SearchcraftToggleButton.style = SearchcraftToggleButtonStyle0;
819
844
 
820
- export { SearchcraftAutoSearchForm as searchcraft_auto_search_form, SearchcraftBaseSearchResult as searchcraft_base_search_result, SearchcraftBaseSearchResults as searchcraft_base_search_results, SearchcraftCheckIcon as searchcraft_check_icon, SearchcraftClearIconSet as searchcraft_clear_icon_set, SearchcraftClearInputButton as searchcraft_clear_input_button, SearchcraftDashIcon as searchcraft_dash_icon, SearchcraftErrorMessage as searchcraft_error_message, SearchcraftFiltersList as searchcraft_filters_list, SearchcraftInput as searchcraft_input, SearchcraftInputCaption as searchcraft_input_caption, SearchcraftInputIcon as searchcraft_input_icon, SearchcraftInputLabel as searchcraft_input_label, SearchcraftResultsInfo as searchcraft_results_info, SearchcraftSearchIconSet as searchcraft_search_icon_set, SearchcraftSlider as searchcraft_slider, SearchcraftSpinnerDark as searchcraft_spinner_dark, SearchcraftSpinnerLight as searchcraft_spinner_light, SearchcraftToggleButton as searchcraft_toggle_button };
845
+ export { SearchcraftAutoSearchForm as searchcraft_auto_search_form, SearchcraftBaseSearchResult as searchcraft_base_search_result, SearchcraftBaseSearchResults as searchcraft_base_search_results, SearchcraftCheckIcon as searchcraft_check_icon, SearchcraftClearIconSet as searchcraft_clear_icon_set, SearchcraftClearInputButton as searchcraft_clear_input_button, SearchcraftDashIcon as searchcraft_dash_icon, SearchcraftErrorMessage as searchcraft_error_message, SearchcraftFiltersList as searchcraft_filters_list, SearchcraftInput as searchcraft_input, SearchcraftInputCaption as searchcraft_input_caption, SearchcraftInputIcon as searchcraft_input_icon, SearchcraftInputLabel as searchcraft_input_label, SearchcraftResultsInfo as searchcraft_results_info, SearchcraftSearchIconSet as searchcraft_search_icon_set, SearchcraftSlider as searchcraft_slider, SearchcraftToggleButton as searchcraft_toggle_button };
821
846
 
822
- //# sourceMappingURL=searchcraft-auto-search-form_19.entry.js.map
847
+ //# sourceMappingURL=searchcraft-auto-search-form_17.entry.js.map