@searchcraft/javascript-sdk 0.1.1 → 0.1.2

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 (134) hide show
  1. package/dist/cjs/{index-e7bd239c.js → index-e7e9ab69.js} +4 -3
  2. package/dist/cjs/index-e7e9ab69.js.map +1 -0
  3. package/dist/cjs/index.cjs.js +4 -2
  4. package/dist/cjs/index.cjs.js.map +1 -1
  5. package/dist/cjs/loader.cjs.js +2 -2
  6. package/dist/cjs/searchcraft-auto-search-form_13.cjs.entry.js +55 -29
  7. package/dist/cjs/searchcraft-auto-search-form_13.cjs.entry.js.map +1 -1
  8. package/dist/cjs/searchcraft-base-search-form.cjs.entry.js +2 -2
  9. package/dist/cjs/searchcraft-button-icon.cjs.entry.js +1 -1
  10. package/dist/cjs/searchcraft-button.cjs.entry.js +2 -2
  11. package/dist/cjs/searchcraft-javascript-sdk.cjs.js +2 -2
  12. package/dist/cjs/{store-6c259dd0.js → store-ab3978ce.js} +2 -2
  13. package/dist/cjs/{store-6c259dd0.js.map → store-ab3978ce.js.map} +1 -1
  14. package/dist/cjs/utils-57b6c18f.js +48 -0
  15. package/dist/cjs/utils-57b6c18f.js.map +1 -0
  16. package/dist/collection/components/searchcraft-base-search-result/searchcraft-base-search-result.js +126 -65
  17. package/dist/collection/components/searchcraft-base-search-result/searchcraft-base-search-result.js.map +1 -1
  18. package/dist/collection/components/searchcraft-base-search-result/searchcraft-base-search-result.module.css +42 -2
  19. package/dist/collection/components/searchcraft-base-search-results/searchcraft-base-search-results.js +69 -4
  20. package/dist/collection/components/searchcraft-base-search-results/searchcraft-base-search-results.js.map +1 -1
  21. package/dist/collection/components/searchcraft-button/searchcraft-button.js +1 -1
  22. package/dist/collection/components/searchcraft-error-message/searchcraft-error-message.js +1 -1
  23. package/dist/collection/components/searchcraft-input-icon/searchcraft-input-icon.module.css +6 -4
  24. package/dist/collection/components/searchcraft-spinner-dark/searchcraft-spinner-dark.js +1 -1
  25. package/dist/collection/components/searchcraft-spinner-light/searchcraft-spinner-light.js +1 -1
  26. package/dist/collection/index.js +1 -1
  27. package/dist/collection/index.js.map +1 -1
  28. package/dist/collection/provider/store.js.map +1 -1
  29. package/dist/collection/utils/utils.js +23 -0
  30. package/dist/collection/utils/utils.js.map +1 -1
  31. package/dist/components/index.js +3 -3
  32. package/dist/components/{p-c69651f6.js → p-066c8210.js} +3 -3
  33. package/dist/components/p-066c8210.js.map +1 -0
  34. package/dist/components/p-1912bbbd.js +83 -0
  35. package/dist/components/p-1912bbbd.js.map +1 -0
  36. package/dist/components/{p-a18c4969.js → p-1bd04bac.js} +10 -10
  37. package/dist/components/{p-a18c4969.js.map → p-1bd04bac.js.map} +1 -1
  38. package/dist/components/{p-6f0eaec6.js → p-36c95064.js} +2 -2
  39. package/dist/components/{p-6f0eaec6.js.map → p-36c95064.js.map} +1 -1
  40. package/dist/components/p-5e3152c4.js +44 -0
  41. package/dist/components/p-5e3152c4.js.map +1 -0
  42. package/dist/components/{p-8646a603.js → p-63035c6a.js} +4 -4
  43. package/dist/components/p-63035c6a.js.map +1 -0
  44. package/dist/components/{p-0c25e95d.js → p-6f2a72d3.js} +3 -3
  45. package/dist/components/{p-0c25e95d.js.map → p-6f2a72d3.js.map} +1 -1
  46. package/dist/components/{p-e8e40447.js → p-8d9551ce.js} +3 -3
  47. package/dist/components/{p-e8e40447.js.map → p-8d9551ce.js.map} +1 -1
  48. package/dist/components/{p-2cc8c074.js → p-b1ff2296.js} +5 -5
  49. package/dist/components/{p-2cc8c074.js.map → p-b1ff2296.js.map} +1 -1
  50. package/dist/components/{p-f83f2b59.js → p-c3838435.js} +4 -4
  51. package/dist/components/{p-f83f2b59.js.map → p-c3838435.js.map} +1 -1
  52. package/dist/components/{p-199065b5.js → p-cb75ba7a.js} +2 -2
  53. package/dist/components/{p-199065b5.js.map → p-cb75ba7a.js.map} +1 -1
  54. package/dist/components/{p-04e7305e.js → p-d0edf961.js} +2 -2
  55. package/dist/components/{p-04e7305e.js.map → p-d0edf961.js.map} +1 -1
  56. package/dist/components/{p-155f7a59.js → p-d446eda4.js} +2 -2
  57. package/dist/components/{p-155f7a59.js.map → p-d446eda4.js.map} +1 -1
  58. package/dist/components/{p-9283a3c2.js → p-d54bca75.js} +2 -2
  59. package/dist/components/{p-9283a3c2.js.map → p-d54bca75.js.map} +1 -1
  60. package/dist/components/{p-16a533e3.js → p-d6616aa5.js} +3 -3
  61. package/dist/components/{p-16a533e3.js.map → p-d6616aa5.js.map} +1 -1
  62. package/dist/components/searchcraft-auto-search-form.js +13 -13
  63. package/dist/components/searchcraft-base-search-form.js +13 -13
  64. package/dist/components/searchcraft-base-search-result.js +1 -1
  65. package/dist/components/searchcraft-base-search-results.js +31 -9
  66. package/dist/components/searchcraft-base-search-results.js.map +1 -1
  67. package/dist/components/searchcraft-button-icon.js +1 -1
  68. package/dist/components/searchcraft-button.js +1 -1
  69. package/dist/components/searchcraft-clear-icon-set.js +1 -1
  70. package/dist/components/searchcraft-clear-input-button.js +1 -1
  71. package/dist/components/searchcraft-error-message.js +1 -1
  72. package/dist/components/searchcraft-input-caption.js +1 -1
  73. package/dist/components/searchcraft-input-icon.js +1 -1
  74. package/dist/components/searchcraft-input-label.js +1 -1
  75. package/dist/components/searchcraft-input.js +1 -1
  76. package/dist/components/searchcraft-search-icon-set.js +1 -1
  77. package/dist/components/searchcraft-spinner-dark.js +1 -1
  78. package/dist/components/searchcraft-spinner-light.js +1 -1
  79. package/dist/esm/{index-0d9f850d.js → index-eace3343.js} +4 -4
  80. package/dist/esm/index-eace3343.js.map +1 -0
  81. package/dist/esm/index.js +2 -2
  82. package/dist/esm/loader.js +3 -3
  83. package/dist/esm/searchcraft-auto-search-form_13.entry.js +55 -29
  84. package/dist/esm/searchcraft-auto-search-form_13.entry.js.map +1 -1
  85. package/dist/esm/searchcraft-base-search-form.entry.js +2 -2
  86. package/dist/esm/searchcraft-button-icon.entry.js +1 -1
  87. package/dist/esm/searchcraft-button.entry.js +2 -2
  88. package/dist/esm/searchcraft-javascript-sdk.js +3 -3
  89. package/dist/esm/{store-2370857c.js → store-e55b12aa.js} +2 -2
  90. package/dist/esm/{store-2370857c.js.map → store-e55b12aa.js.map} +1 -1
  91. package/dist/esm/utils-02b18bb5.js +44 -0
  92. package/dist/esm/utils-02b18bb5.js.map +1 -0
  93. package/dist/searchcraft-javascript-sdk/index.esm.js +1 -1
  94. package/dist/searchcraft-javascript-sdk/{p-329c3f66.js → p-0ba9029b.js} +3 -3
  95. package/dist/searchcraft-javascript-sdk/p-0ba9029b.js.map +1 -0
  96. package/dist/searchcraft-javascript-sdk/{p-6f0eaec6.js → p-36c95064.js} +1 -1
  97. package/dist/searchcraft-javascript-sdk/p-36c95064.js.map +1 -0
  98. package/dist/searchcraft-javascript-sdk/p-437c6ef9.entry.js +2 -0
  99. package/dist/searchcraft-javascript-sdk/p-437c6ef9.entry.js.map +1 -0
  100. package/dist/searchcraft-javascript-sdk/{p-0a8c2538.entry.js → p-562e923d.entry.js} +2 -2
  101. package/dist/searchcraft-javascript-sdk/{p-40791ead.entry.js → p-5959cd6a.entry.js} +2 -2
  102. package/dist/searchcraft-javascript-sdk/p-5e3152c4.js +2 -0
  103. package/dist/searchcraft-javascript-sdk/p-5e3152c4.js.map +1 -0
  104. package/dist/searchcraft-javascript-sdk/{p-4d18a44a.entry.js → p-eb632a89.entry.js} +2 -2
  105. package/dist/searchcraft-javascript-sdk/searchcraft-javascript-sdk.esm.js +1 -1
  106. package/dist/searchcraft-javascript-sdk/searchcraft-javascript-sdk.esm.js.map +1 -1
  107. package/dist/types/components/searchcraft-base-search-result/searchcraft-base-search-result.d.ts +14 -11
  108. package/dist/types/components/searchcraft-base-search-results/searchcraft-base-search-results.d.ts +13 -2
  109. package/dist/types/components.d.ts +58 -22
  110. package/dist/types/index.d.ts +1 -1
  111. package/dist/types/provider/store.d.ts +3 -3
  112. package/dist/types/utils/utils.d.ts +2 -0
  113. package/package.json +1 -1
  114. package/dist/cjs/index-e7bd239c.js.map +0 -1
  115. package/dist/cjs/utils-cbbed1f7.js +0 -23
  116. package/dist/cjs/utils-cbbed1f7.js.map +0 -1
  117. package/dist/components/p-1ef23e15.js +0 -21
  118. package/dist/components/p-1ef23e15.js.map +0 -1
  119. package/dist/components/p-83c9df48.js +0 -76
  120. package/dist/components/p-83c9df48.js.map +0 -1
  121. package/dist/components/p-8646a603.js.map +0 -1
  122. package/dist/components/p-c69651f6.js.map +0 -1
  123. package/dist/esm/index-0d9f850d.js.map +0 -1
  124. package/dist/esm/utils-f221d91f.js +0 -21
  125. package/dist/esm/utils-f221d91f.js.map +0 -1
  126. package/dist/searchcraft-javascript-sdk/p-1ef23e15.js +0 -2
  127. package/dist/searchcraft-javascript-sdk/p-1ef23e15.js.map +0 -1
  128. package/dist/searchcraft-javascript-sdk/p-329c3f66.js.map +0 -1
  129. package/dist/searchcraft-javascript-sdk/p-6f0eaec6.js.map +0 -1
  130. package/dist/searchcraft-javascript-sdk/p-c0cb5bb1.entry.js +0 -2
  131. package/dist/searchcraft-javascript-sdk/p-c0cb5bb1.entry.js.map +0 -1
  132. /package/dist/searchcraft-javascript-sdk/{p-0a8c2538.entry.js.map → p-562e923d.entry.js.map} +0 -0
  133. /package/dist/searchcraft-javascript-sdk/{p-40791ead.entry.js.map → p-5959cd6a.entry.js.map} +0 -0
  134. /package/dist/searchcraft-javascript-sdk/{p-4d18a44a.entry.js.map → p-eb632a89.entry.js.map} +0 -0
@@ -1,6 +1,6 @@
1
- import { r as registerInstance, c as createEvent, h, F as Fragment } from './index-0d9f850d.js';
2
- import { u as useSearchcraftStore, g } from './store-2370857c.js';
3
- import { p as parseCustomStyles } from './utils-f221d91f.js';
1
+ import { r as registerInstance, c as createEvent, h, g as getElement, F as Fragment } from './index-eace3343.js';
2
+ import { u as useSearchcraftStore, g } from './store-e55b12aa.js';
3
+ import { p as parseCustomStyles, a as parseSearchKeys, e as extractDynamicProperties } from './utils-02b18bb5.js';
4
4
  import { c as classNames } from './index-72ac5051.js';
5
5
 
6
6
  const searchcraftAutoSearchFormModuleCss = ":root{--font-stack:Helvetica, Arial, sans-serif}.formLTR{text-align:left;width:100%}.formRTL{text-align:right;width:100%}.searchContainer{align-items:center;display:flex;width:100%}";
@@ -89,39 +89,46 @@ const SearchcraftAutoSearchForm = class {
89
89
  };
90
90
  SearchcraftAutoSearchForm.style = SearchcraftAutoSearchFormStyle0;
91
91
 
92
- const searchcraftBaseSearchResultModuleCss = ":root{--font-stack:Helvetica, Arial, sans-serif}.interactiveResultContainerLight{background-color:#FAFAFA;align-items:flex-start;border-radius:16px;display:flex;position:relative;flex-direction:column;gap:16px;padding:8px}@media (min-width: 600px){.interactiveResultContainerLight{flex-direction:row}}.interactiveResultContainerDark{background-color:#2E2E2E;align-items:flex-start;border-radius:16px;display:flex;position:relative;flex-direction:column;gap:16px;padding:8px}@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{position:absolute;right:5px;top:-2px;display:inline-block}@media (min-width: 600px){.interactiveIconSmall{display:none}}.imageContainer{max-height:540px;max-width:100%}@media (min-width: 600px){.imageContainer{max-height:100%;max-width:50%}}.contentContainer{max-height:100%;max-width:100%}@media (min-width: 600px){.contentContainer{max-width:50%}}.imageLight{aspect-ratio:2/1;border-radius:8px;max-height:100%;max-width:100%;border:1px solid #D9D9D9}.imageDark{aspect-ratio:2/1;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:0px;position:relative;color:#292929}.headingDark{font-family:var(--font-stack);font-size:16px;font-weight:700;line-height:20px;margin-bottom:4px;margin-top:0px;position:relative;color:#FFF}.subheadingLight{font-family:var(--font-stack);font-size:12px;font-weight:400;line-height:16px;margin-bottom:4px;margin-top:0px;color:#737373}.subheadingDark{font-family:var(--font-stack);font-size:12px;font-weight:400;line-height:16px;margin-bottom:4px;margin-top:0px;color:#BFBFBF}.bodyContentLight{font-family:var(--font-stack);font-size:16px;font-weight:400;line-height:20px;margin-bottom:4px;margin-top:0px;color:#404040}.bodyContentDark{font-family:var(--font-stack);font-size:16px;font-weight:400;line-height:20px;margin-bottom:4px;margin-top:0px;color:#E6E6E6}";
92
+ const searchcraftBaseSearchResultModuleCss = ":root{--font-stack:Helvetica, Arial, sans-serif}.interactiveResultContainerLight{background-color:#FAFAFA;align-items:flex-start;border-radius:16px;display:flex;position:relative;flex-direction:column;gap:16px;padding:8px}@media (min-width: 600px){.interactiveResultContainerLight{flex-direction:row}}.interactiveResultContainerDark{background-color:#2E2E2E;align-items:flex-start;border-radius:16px;display:flex;position:relative;flex-direction:column;gap:16px;padding:8px}@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{position:absolute;right:5px;top:-2px;display:inline-block}@media (min-width: 600px){.interactiveIconSmall{display:none}}.imageContainer{max-height:540px;max-width:100%}@media (min-width: 600px){.imageContainer{max-height:100%;max-width:50%}}.contentContainer{max-height:100%;max-width:100%}@media (min-width: 600px){.contentContainer{max-width:50%}}.imageLight{aspect-ratio:2/1;border-radius:8px;max-height:100%;max-width:100%;border:1px solid #D9D9D9}.imageDark{aspect-ratio:2/1;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:0px;position:relative;color:#292929}.headingDark{font-family:var(--font-stack);font-size:16px;font-weight:700;line-height:20px;margin-bottom:4px;margin-top:0px;position:relative;color:#FFF}.subheadingLight{font-family:var(--font-stack);font-size:12px;font-weight:400;line-height:16px;margin-bottom:4px;margin-top:0px;color:#737373}.subheadingDark{font-family:var(--font-stack);font-size:12px;font-weight:400;line-height:16px;margin-bottom:4px;margin-top:0px;color:#BFBFBF}.primaryContentLight{font-family:var(--font-stack);font-size:16px;font-weight:400;line-height:20px;margin-bottom:4px;margin-top:0px;color:#404040}.primaryContentDark{font-family:var(--font-stack);font-size:16px;font-weight:400;line-height:20px;margin-bottom:4px;margin-top:0px;color:#E6E6E6}.secondaryContentLight{font-family:var(--font-stack);font-size:16px;font-weight:400;line-height:20px;margin-bottom:4px;margin-top:0px;color:#404040}.secondaryContentDark{font-family:var(--font-stack);font-size:16px;font-weight:400;line-height:20px;margin-bottom:4px;margin-top:0px;color:#E6E6E6}.tertiaryContentLight{font-family:var(--font-stack);font-size:16px;font-weight:400;line-height:20px;margin-bottom:4px;margin-top:0px;color:#404040}.tertiaryContentDark{font-family:var(--font-stack);font-size:16px;font-weight:400;line-height:20px;margin-bottom:4px;margin-top:0px;color:#E6E6E6}";
93
93
  const SearchcraftBaseSearchResultStyle0 = searchcraftBaseSearchResultModuleCss;
94
94
 
95
95
  const SearchcraftBaseSearchResult = class {
96
96
  constructor(hostRef) {
97
97
  registerInstance(this, hostRef);
98
+ this.buttonCallback = createEvent(this, "buttonCallback", 7);
99
+ this.keyDownCallback = createEvent(this, "keyDownCallback", 7);
100
+ this.resultCallback = createEvent(this, "resultCallback", 7);
101
+ this.buttonCallback = () => { }; // Callback for button click
102
+ this.keyDownCallback = () => { }; // Callback for key down event
103
+ this.resultCallback = () => { }; // Callback for result container click
98
104
  this.handleButtonClick = () => {
99
- this.buttonCallbackFn();
105
+ this.buttonCallback();
100
106
  };
101
107
  this.handleContainerClick = () => {
102
- if (this.interactiveResult) {
103
- this.callbackFn();
108
+ if (this.isInteractive) {
109
+ this.resultCallback();
104
110
  }
105
111
  };
106
- this.buttonCallbackFn = () => { };
107
- this.buttonLabel = '';
108
- this.callbackFn = () => { };
109
- this.imageAltText = '';
110
- this.imageSrc = '';
111
- this.interactiveResult = false;
112
- this.keyDownCallbackFn = () => { };
113
- this.resultBodyContent = '';
114
- this.resultHeading = '';
115
- this.resultSubheading = '';
116
- this.theme = 'light';
112
+ this.buttonText = '';
113
+ this.imageDescription = '';
114
+ this.imageSource = '';
115
+ this.isInteractive = false;
116
+ this.primaryContent = '';
117
+ this.secondaryContent = '';
118
+ this.tertiaryContent = '';
119
+ this.headingText = '';
120
+ this.subheadingText = '';
121
+ this.themeMode = 'light';
122
+ this.customStyles = {};
117
123
  }
118
124
  render() {
119
- const isLightTheme = this.theme === 'light';
120
- return (h("div", { key: '26e04a559c37ac68f1dc33d3810c66abc9755871', class: this.interactiveResult
125
+ const isLightTheme = this.themeMode === 'light';
126
+ const containerStyle = Object.assign({}, this.customStyles);
127
+ return (h("div", { key: '512b19a2637993cd71fe9b0ac1557106f8501cf2', class: this.isInteractive
121
128
  ? isLightTheme
122
129
  ? 'interactiveResultContainerLight'
123
130
  : 'interactiveResultContainerDark'
124
- : 'resultContainer', id: 'searchcraft-item', onClick: this.handleContainerClick, onKeyDown: this.keyDownCallbackFn, tabindex: '0' }, this.interactiveResult && (h("div", { key: '7d71fd1402fdafe67370eab10ca78ed385fb58d0', class: 'interactiveIconLarge' }, isLightTheme ? (h("searchcraft-clear-icon-set", { type: 'arrow-light' })) : (h("searchcraft-clear-icon-set", { type: 'arrow-dark' })))), h("div", { key: 'def02c3134ae8a756f196d9b9e4d90180767c8f8', class: 'imageContainer' }, h("img", { key: '5fb695256132b8b53f7008d67e2f5808bf3b6d28', alt: this.imageAltText, class: isLightTheme ? 'imageLight' : 'imageDark', src: this.imageSrc })), h("div", { key: 'cf533a08bcd15832ef6f7fd385c829ce8817435d', class: 'contentContainer' }, h("h2", { key: '9d9968ab969950008e1049177fb68d5d7ae00659', class: isLightTheme ? 'headingLight' : 'headingDark' }, this.resultHeading, this.interactiveResult && (h("div", { key: '56271a305c8290ebab89eeab75a466d666f26a2c', class: 'interactiveIconSmall' }, isLightTheme ? (h("searchcraft-clear-icon-set", { type: 'arrow-light' })) : (h("searchcraft-clear-icon-set", { type: 'arrow-dark' }))))), h("h3", { key: 'ea68f1f16f6b89979b3ba90a6e061809024e3498', class: isLightTheme ? 'subheadingLight' : 'subheadingDark' }, this.resultSubheading), h("p", { key: '0584a3077ff4f417e0d20d0acc28a624f5966e1c', class: isLightTheme ? 'bodyContentLight' : 'bodyContentDark' }, this.resultBodyContent), h("button", { key: '83ec2e81bd6dbe24d468cdee553c0c5a021f991b', onClick: this.handleButtonClick, type: 'button' }, this.buttonLabel))));
131
+ : 'resultContainer', id: 'searchcraft-item', onClick: this.handleContainerClick, onKeyDown: this.keyDownCallback, style: containerStyle, tabindex: '0' }, this.isInteractive && (h("div", { key: '735b5c931e6bb209cb948d1a4834f689c836528c', class: 'interactiveIconLarge' }, isLightTheme ? (h("searchcraft-clear-icon-set", { type: 'arrow-light' })) : (h("searchcraft-clear-icon-set", { type: 'arrow-dark' })))), h("div", { key: 'd864f312cc779cb52f7f4529691f32b2460a38c1', class: 'imageContainer' }, h("img", { key: 'b705f3ebaa1c02e0a80c181c0cb9e6c5afd1b10c', alt: this.imageDescription, class: isLightTheme ? 'imageLight' : 'imageDark', src: this.imageSource })), h("div", { key: 'da90f1ba12456a8a25c5983e1061fba917632ebf', class: 'contentContainer' }, h("h2", { key: '27af1079e7b12025a96cc0ac890dc9a2516bfa4a', class: isLightTheme ? 'headingLight' : 'headingDark' }, this.headingText, this.isInteractive && (h("div", { key: 'da3f8e81bb039fb68b1afb8e3656ce04adc552ba', class: 'interactiveIconSmall' }, isLightTheme ? (h("searchcraft-clear-icon-set", { type: 'arrow-light' })) : (h("searchcraft-clear-icon-set", { type: 'arrow-dark' }))))), h("h3", { key: 'f62cd5e67cdf03286387061ed944504ac1b0e0d2', class: isLightTheme ? 'subheadingLight' : 'subheadingDark' }, this.subheadingText), h("p", { key: 'b8024831da3be09abfb758370e25b42a7d9e8517', class: isLightTheme ? 'primaryContentLight' : 'primaryContentDark' }, this.primaryContent), h("p", { key: 'b9a847323f17b8cda2c8de170c9308359f113cfd', class: isLightTheme ? 'secondaryContentLight' : 'secondaryContentDark' }, this.secondaryContent), h("p", { key: 'cda9259099171541f59fcf6ab4524d4ba3d40f29', class: isLightTheme ? 'tertiaryContentLight' : 'tertiaryContentDark' }, this.tertiaryContent), this.buttonText && (h("button", { key: 'f527dad1a614f3bf54d8ce724f374423013f8ca2', onClick: this.handleButtonClick, type: 'button' }, this.buttonText)))));
125
132
  }
126
133
  };
127
134
  SearchcraftBaseSearchResult.style = SearchcraftBaseSearchResultStyle0;
@@ -134,17 +141,22 @@ const SearchcraftBaseSearchResults = class {
134
141
  registerInstance(this, hostRef);
135
142
  this.query = '';
136
143
  this.searchResults = null;
144
+ this.searchKeys = '';
145
+ this.customStylesForResults = {};
137
146
  }
138
147
  componentDidLoad() {
148
+ // Initialize searchKeys if not provided
149
+ if (!this.searchKeys || this.searchKeys.length === 0) {
150
+ console.warn('No searchKeys provided; using empty keys array.');
151
+ this.searchKeys = ''; // Ensure it's explicitly set as an empty array
152
+ }
139
153
  // Subscribe to state changes
140
154
  this.unsubscribe = useSearchcraftStore.subscribe((state) => {
141
- console.log('Store updated:', state);
142
155
  this.searchResults = Object.assign({}, state.searchResults);
143
156
  this.query = state.query;
144
157
  });
145
158
  // Fetch initial state
146
159
  const { searchResults, query } = useSearchcraftStore.getState();
147
- console.log('Initial state:', searchResults, query);
148
160
  this.searchResults = searchResults;
149
161
  this.query = query;
150
162
  }
@@ -159,13 +171,27 @@ const SearchcraftBaseSearchResults = class {
159
171
  console.warn('No search results data available');
160
172
  return h("div", null, "No results to display.");
161
173
  }
174
+ const parsedSearchKeys = parseSearchKeys(this.searchKeys);
175
+ const parsedCustomStyles = parseCustomStyles(this.customStylesForResults);
162
176
  return (h("div", { class: 'resultsContainer' }, (_d = (_c = (_b = this.searchResults) === null || _b === void 0 ? void 0 : _b.data) === null || _c === void 0 ? void 0 : _c.hits) === null || _d === void 0 ? void 0 :
163
177
  _d.map((document, index) => {
164
178
  const { doc: result } = document;
165
- return (h("searchcraft-base-search-result", { key: `${result === null || result === void 0 ? void 0 : result.id}-${index}`, "button-label": 'View More', "callback-fn": () => console.log('interactive element'), "button-callback-fn": () => console.log('button callback'), "interactive-result": true, "image-src": result === null || result === void 0 ? void 0 : result.poster, "result-body-content": result === null || result === void 0 ? void 0 : result.overview, "result-heading": result === null || result === void 0 ? void 0 : result.title, "result-subheading": result === null || result === void 0 ? void 0 : result.release_date }));
179
+ const dynamicProperties = extractDynamicProperties(result, parsedSearchKeys);
180
+ // Render the custom element if present, otherwise fallback to default
181
+ const customElement = this.hostElement.querySelector('[slot="result-template"]');
182
+ if (customElement) {
183
+ // Clone the custom element and pass data to it
184
+ const customElementClone = customElement.cloneNode(true);
185
+ customElementClone.removeAttribute('slot'); // Remove the slot attribute
186
+ customElementClone.setAttribute('data-result', JSON.stringify(result));
187
+ return (h("div", { key: `${dynamicProperties.id}-${index}` }, customElementClone.outerHTML));
188
+ }
189
+ // Fallback to the default element
190
+ return (h("searchcraft-base-search-result", { key: `${dynamicProperties.id}-${index}`, "button-callback": () => console.log('button callback'), "result-callback": () => console.log('interactive element'), "keydown-callback": () => console.log('keydown'), "is-interactive": true, "heading-text": dynamicProperties[parsedSearchKeys[0]], "subheading-text": dynamicProperties[parsedSearchKeys[1]], "primary-content": dynamicProperties[parsedSearchKeys[2]], "secondary-content": dynamicProperties[parsedSearchKeys[3]], "tertiary-content": dynamicProperties[parsedSearchKeys[4]], "image-source": dynamicProperties[parsedSearchKeys[parsedSearchKeys.length - 1]], customStyles: parsedCustomStyles }));
166
191
  }), this.query.length > 0 &&
167
- ((_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("searchcraft-error-message", { "error-message": `No search results found for "${this.query}" query` }))));
192
+ ((_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("searchcraft-error-message", { "error-message": `No search results found for "${this.query}" query` })), h("slot", { name: 'result-template' })));
168
193
  }
194
+ get hostElement() { return getElement(this); }
169
195
  };
170
196
  SearchcraftBaseSearchResults.style = SearchcraftBaseSearchResultsStyle0;
171
197
 
@@ -226,7 +252,7 @@ const SearchcraftErrorMessage = class {
226
252
  }
227
253
  render() {
228
254
  const errorMessageStyle = this.theme === 'light' ? 'errorMessageLight' : 'errorMessageDark';
229
- return (h("p", { key: '544903d700810ed5d6efdefedab646cafed2376d', class: classNames(errorMessageStyle) }, this.errorMessage || 'Search term is required.'));
255
+ return (h("p", { key: '4e0b94cb24f940e8c404fd752e6f02f977190043', class: classNames(errorMessageStyle) }, this.errorMessage || 'Search term is required.'));
230
256
  }
231
257
  };
232
258
  SearchcraftErrorMessage.style = SearchcraftErrorMessageStyle0;
@@ -323,7 +349,7 @@ const SearchcraftInputCaption = class {
323
349
  };
324
350
  SearchcraftInputCaption.style = SearchcraftInputCaptionStyle0;
325
351
 
326
- const searchcraftInputIconModuleCss = ":root{--font-stack:Helvetica, Arial, sans-serif}.inputIconLTR{height:20px;left:10px;position:absolute;top:11px;width:20px}.inputIconRTL{height:20px;position:absolute;right:10px;top:11px;width:20px}";
352
+ const searchcraftInputIconModuleCss = ":root{--font-stack:Helvetica, Arial, sans-serif}.inputIconLTR{height:20px;left:15px;position:absolute;top:50%;transform:translateY(-50%);width:20px}.inputIconRTL{height:20px;position:absolute;right:15px;top:50%;transform:translateY(-50%);width:20px}";
327
353
  const SearchcraftInputIconStyle0 = searchcraftInputIconModuleCss;
328
354
 
329
355
  const SearchcraftInputIcon = class {
@@ -395,7 +421,7 @@ const SearchcraftSpinnerDark = class {
395
421
  registerInstance(this, hostRef);
396
422
  }
397
423
  render() {
398
- return (h("div", { key: '60b629930c2e2795236f6768b40c95ce9390e882', class: 'spinnerContainer' }, h("div", { key: 'bfef3329f2e81ecf6538738ac0213da6259dd1c3', class: 'spinnerDark' })));
424
+ return (h("div", { key: 'fc32dd86414502f1895b157d8aa28645a5391ff9', class: 'spinnerContainer' }, h("div", { key: '260233361f9ff5a17d05b92e41ec2fc13adc2dbf', class: 'spinnerDark' })));
399
425
  }
400
426
  };
401
427
  SearchcraftSpinnerDark.style = SearchcraftSpinnerDarkStyle0;
@@ -408,7 +434,7 @@ const SearchcraftSpinnerLight = class {
408
434
  registerInstance(this, hostRef);
409
435
  }
410
436
  render() {
411
- return (h("div", { key: 'ad5224c97faf7e329d2a8904488c17dfd7414b9e', class: 'spinnerContainer' }, h("div", { key: '6336ce7737af65eedac46ee290b20291ce5b6096', class: 'spinnerLight' })));
437
+ return (h("div", { key: '0e0faa615a1548868153b07bb467ee85eabcdd09', class: 'spinnerContainer' }, h("div", { key: 'a9aac4d029d9072e01cc643da62f3338622f0ef0', class: 'spinnerLight' })));
412
438
  }
413
439
  };
414
440
  SearchcraftSpinnerLight.style = SearchcraftSpinnerLightStyle0;
@@ -1 +1 @@
1
- {"file":"searchcraft-auto-search-form.searchcraft-base-search-result.searchcraft-base-search-results.searchcraft-clear-icon-set.searchcraft-clear-input-button.searchcraft-error-message.searchcraft-input.searchcraft-input-caption.searchcraft-input-icon.searchcraft-input-label.searchcraft-search-icon-set.searchcraft-spinner-dark.searchcraft-spinner-light.entry.js","mappings":"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","names":["SearchcraftCore"],"sources":["src/components/searchcraft-auto-search-form/searchcraft-auto-search-form.module.scss?tag=searchcraft-auto-search-form&encapsulation=shadow","src/components/searchcraft-auto-search-form/searchcraft-auto-search-form.tsx","src/components/searchcraft-base-search-result/searchcraft-base-search-result.module.scss?tag=searchcraft-base-search-result&encapsulation=shadow","src/components/searchcraft-base-search-result/searchcraft-base-search-result.tsx","src/components/searchcraft-base-search-results/searchcraft-base-search-results.module.scss?tag=searchcraft-base-search-results&encapsulation=shadow","src/components/searchcraft-base-search-results/searchcraft-base-search-results.tsx","src/assets/searchcraft-clear-icon-set.tsx","src/components/searchcraft-clear-input-button/searchcraft-clear-input-button.module.scss?tag=searchcraft-clear-input-button&encapsulation=shadow","src/components/searchcraft-clear-input-button/searchcraft-clear-input-button.tsx","src/components/searchcraft-error-message/searchcraft-error-message.module.scss?tag=searchcraft-error-message&encapsulation=shadow","src/components/searchcraft-error-message/searchcraft-error-message.tsx","src/components/searchcraft-input/searchcraft-input.module.scss?tag=searchcraft-input&encapsulation=shadow","src/components/searchcraft-input/searchcraft-input.tsx","src/components/searchcraft-input-caption/searchcraft-input-caption.module.scss?tag=searchcraft-input-caption&encapsulation=shadow","src/components/searchcraft-input-caption/searchcraft-input-caption.tsx","src/components/searchcraft-input-icon/searchcraft-input-icon.module.scss?tag=searchcraft-input-icon&encapsulation=shadow","src/components/searchcraft-input-icon/searchcraft-input-icon.tsx","src/components/searchcraft-input-label/searchcraft-input-label.module.scss?tag=searchcraft-input-label&encapsulation=shadow","src/components/searchcraft-input-label/searchcraft-input-label.tsx","src/assets/searchcraft-search-icon-set.tsx","src/components/searchcraft-spinner-dark/searchcraft-spinner-dark.module.scss?tag=searchcraft-spinner-dark&encapsulation=shadow","src/components/searchcraft-spinner-dark/searchcraft-spinner-dark.tsx","src/components/searchcraft-spinner-light/searchcraft-spinner-light.module.scss?tag=searchcraft-spinner-light&encapsulation=shadow","src/components/searchcraft-spinner-light/searchcraft-spinner-light.tsx"],"sourcesContent":[":root {\n --font-stack: Helvetica, Arial, sans-serif;\n}\n\n.formLTR {\n text-align: left;\n width: 100%;\n}\n\n.formRTL {\n text-align: right;\n width: 100%;\n}\n\n.searchContainer {\n align-items: center;\n display: flex;\n width: 100%;\n}","import {\n Component,\n Prop,\n State,\n Event,\n type EventEmitter,\n h,\n} from '@stencil/core';\nimport {\n type CoreConfigSDK,\n CoreSDK as SearchcraftCore,\n} from '@searchcraft/core';\n\nimport type { ScInputCustomEvent } from '@components/searchcraft-input/searchcraft-input';\nimport { parseCustomStyles } from '@utils/utils';\nimport { useSearchcraftStore } from '@provider/store';\n\n@Component({\n tag: 'searchcraft-auto-search-form',\n styleUrl: 'searchcraft-auto-search-form.module.scss',\n shadow: true,\n})\nexport class SearchcraftAutoSearchForm {\n @Prop() autoSearchFormClass = '';\n @Prop() clearInput: () => void = () => {};\n @Prop() config: CoreConfigSDK = {\n apiKey: '',\n endpointURL: '',\n index: [],\n };\n @Prop() customStylesForInput: string | Record<string, string> = {};\n @Prop() inputCaptionValue = '';\n @Prop() labelForInput = '';\n @Prop() placeholderValue = 'Search here';\n @Prop() rightToLeftOrientation = false;\n @Prop() searchContainerClass = '';\n\n @Event() querySubmit: EventEmitter<string>;\n\n @State() error = false;\n @State() query = '';\n @State() searchResults = '';\n\n private debounceTimeout: ReturnType<typeof setTimeout> | null = null;\n private debounceDelay = 300; // 300ms debounce delay\n private searchStore = useSearchcraftStore.getState();\n\n componentDidLoad() {\n const searchcraft = new SearchcraftCore(this.config);\n this.searchStore.initialize(searchcraft, true);\n console.log('Component initialized');\n }\n\n handleInputChange = (event: ScInputCustomEvent<string>) => {\n this.query = event.detail;\n this.querySubmit.emit(this.query);\n\n // Clear the previous debounce timeout\n if (this.debounceTimeout) {\n clearTimeout(this.debounceTimeout);\n }\n\n // Set a new debounce timeout\n this.debounceTimeout = setTimeout(() => {\n console.log('Debounced search triggered');\n this.runSearch();\n }, this.debounceDelay);\n };\n\n handleClearInput = () => {\n this.query = '';\n console.log('Input cleared');\n\n if (typeof this.clearInput === 'function') {\n this.clearInput();\n }\n\n if (this.debounceTimeout) {\n clearTimeout(this.debounceTimeout);\n }\n\n this.error = false;\n this.searchResults = '';\n };\n\n private runSearch = async () => {\n if (this.query.trim() === '') {\n this.error = true;\n this.searchResults = '';\n } else {\n this.error = false;\n this.searchStore.setQuery(this.query);\n\n try {\n await this.searchStore.search();\n this.searchResults = JSON.stringify(this.searchStore.searchResults);\n } catch (error) {\n this.error = true;\n }\n }\n };\n\n handleFormSubmit = async (event: Event) => {\n event.preventDefault();\n await this.runSearch();\n };\n\n render() {\n const formClass = this.rightToLeftOrientation ? 'formRTL' : 'formLTR';\n const parsedCustomStyles = parseCustomStyles(this.customStylesForInput);\n return (\n <form class={`${formClass}`} onSubmit={this.handleFormSubmit}>\n <searchcraft-input-label label={this.labelForInput} />\n <div class='searchContainer'>\n <searchcraft-input\n customStyles={parsedCustomStyles}\n input-caption-value={this.inputCaptionValue}\n onClearInput={this.handleClearInput}\n onSearchInputChange={this.handleInputChange}\n placeholder-value={this.placeholderValue}\n query={this.query}\n right-to-left-orientation={this.rightToLeftOrientation}\n />\n </div>\n {this.error && (\n <searchcraft-error-message errorMessage='Please enter a search query.' />\n )}\n </form>\n );\n }\n}\n","@import '../../utils/theme';\n\n:root {\n --font-stack: Helvetica, Arial, sans-serif;\n}\n\n@mixin interactive-result-container-base {\n align-items: flex-start;\n border-radius: 16px;\n display: flex;\n position: relative;\n flex-direction: column;\n gap: 16px;\n padding: 8px;\n\n @media (min-width: 600px) {\n flex-direction: row;\n }\n}\n\n.interactiveResultContainerLight {\n background-color: $light-search-result-container-background;\n @include interactive-result-container-base;\n}\n\n.interactiveResultContainerDark {\n background-color: $dark-search-result-container-background;\n @include interactive-result-container-base;\n}\n\n.resultContainer {\n align-items: flex-start;\n display: flex;\n flex-direction: column;\n gap: 16px;\n\n @media (min-width: 600px) {\n flex-direction: row;\n }\n}\n\n.interactiveIconLarge {\n display: inline-block;\n position: absolute;\n right: 5px;\n top: 8px;\n\n\n @media (max-width: 600px) {\n display: none;\n }\n}\n\n.interactiveIconSmall {\n position: absolute;\n right: 5px;\n top: -2px;\n display: inline-block;\n\n\n @media (min-width: 600px) {\n display: none;\n }\n}\n\n.imageContainer {\n max-height: 540px;\n max-width: 100%;\n\n @media (min-width: 600px) {\n max-height: 100%;\n max-width: 50%;\n }\n}\n\n.contentContainer {\n max-height: 100%;\n max-width: 100%;\n\n @media (min-width: 600px) {\n max-width: 50%;\n }\n}\n\n@mixin image-base {\n aspect-ratio: 2 / 1;\n border-radius: 8px;\n max-height: 100%;\n max-width: 100%;\n}\n\n.imageLight {\n @include image-base;\n border: 1px solid $light-search-result-image-border;\n}\n\n.imageDark {\n @include image-base;\n border: 1px solid $dark-search-result-image-border;\n}\n\n@mixin heading-base {\n font-family: var(--font-stack);\n font-size: 16px;\n font-weight: 700;\n line-height: 20px;\n margin-bottom: 4px;\n margin-top: 0px;\n position: relative;\n}\n\n.headingLight {\n @include heading-base;\n color: $light-search-result-heading-color;\n}\n\n.headingDark {\n @include heading-base;\n color: $dark-search-result-heading-color;\n}\n\n@mixin subheading-base {\n font-family: var(--font-stack);\n font-size: 12px;\n font-weight: 400;\n line-height: 16px;\n margin-bottom: 4px;\n margin-top: 0px;\n}\n\n.subheadingLight {\n @include subheading-base;\n color: $light-search-result-subheading-color;\n}\n\n.subheadingDark {\n @include subheading-base;\n color: $dark-search-result-subheading-color\n}\n\n@mixin body-content-base {\n font-family: var(--font-stack);\n font-size: 16px;\n font-weight: 400;\n line-height: 20px;\n margin-bottom: 4px;\n margin-top: 0px;\n}\n\n.bodyContentLight {\n @include body-content-base;\n color: $light-search-result-body-content-color;\n}\n\n.bodyContentDark {\n @include body-content-base;\n color: $dark-search-result-body-content-color;\n}","import { Component, h, Prop } from '@stencil/core';\n\n@Component({\n tag: 'searchcraft-base-search-result',\n styleUrl: 'searchcraft-base-search-result.module.scss',\n shadow: true,\n})\nexport class SearchcraftBaseSearchResult {\n @Prop() buttonCallbackFn: () => void = () => {};\n @Prop() buttonLabel = '';\n @Prop() callbackFn: () => void = () => {};\n @Prop() imageAltText = '';\n @Prop() imageSrc = '';\n @Prop() interactiveResult = false;\n @Prop() keyDownCallbackFn: () => void = () => {};\n @Prop() resultBodyContent = '';\n @Prop() resultHeading = '';\n @Prop() resultSubheading = '';\n @Prop() theme: 'light' | 'dark' = 'light'; // Simulating theme context.\n\n private handleButtonClick = () => {\n this.buttonCallbackFn();\n };\n\n private handleContainerClick = () => {\n if (this.interactiveResult) {\n this.callbackFn();\n }\n };\n\n render() {\n const isLightTheme = this.theme === 'light';\n\n return (\n <div\n class={\n this.interactiveResult\n ? isLightTheme\n ? 'interactiveResultContainerLight'\n : 'interactiveResultContainerDark'\n : 'resultContainer'\n }\n id='searchcraft-item'\n onClick={this.handleContainerClick}\n onKeyDown={this.keyDownCallbackFn}\n tabindex='0'\n >\n {this.interactiveResult && (\n <div class='interactiveIconLarge'>\n {isLightTheme ? (\n <searchcraft-clear-icon-set type='arrow-light' />\n ) : (\n <searchcraft-clear-icon-set type='arrow-dark' />\n )}\n </div>\n )}\n <div class='imageContainer'>\n <img\n alt={this.imageAltText}\n class={isLightTheme ? 'imageLight' : 'imageDark'}\n src={this.imageSrc}\n />\n </div>\n <div class='contentContainer'>\n <h2 class={isLightTheme ? 'headingLight' : 'headingDark'}>\n {this.resultHeading}\n {this.interactiveResult && (\n <div class='interactiveIconSmall'>\n {isLightTheme ? (\n <searchcraft-clear-icon-set type='arrow-light' />\n ) : (\n <searchcraft-clear-icon-set type='arrow-dark' />\n )}\n </div>\n )}\n </h2>\n <h3 class={isLightTheme ? 'subheadingLight' : 'subheadingDark'}>\n {this.resultSubheading}\n </h3>\n <p class={isLightTheme ? 'bodyContentLight' : 'bodyContentDark'}>\n {this.resultBodyContent}\n </p>\n <button onClick={this.handleButtonClick} type='button'>\n {this.buttonLabel}\n </button>\n </div>\n </div>\n );\n }\n}\n",":root {\n --font-stack: Helvetica, Arial, sans-serif;\n}\n\n.resultsContainer {\n display: flex;\n flex-direction: column;\n justify-content: center;\n margin: 100px 20px;\n\n & > p {\n align-self: center;\n }\n\n & > div {\n margin-bottom: 20px;\n img {\n height: 300px;\n width: 200px;\n }\n }\n}\n","import { Component, h, State } from '@stencil/core';\nimport type { SearchResult } from '@searchcraft/core';\n\nimport { useSearchcraftStore } from '@provider/store';\n\n@Component({\n tag: 'searchcraft-base-search-results',\n styleUrl: 'searchcraft-base-search-results.module.scss',\n shadow: true,\n})\nexport class SearchcraftBaseSearchResults {\n @State() query = '';\n @State() searchResults: SearchResult | null = null;\n private unsubscribe: () => void;\n\n componentDidLoad() {\n // Subscribe to state changes\n this.unsubscribe = useSearchcraftStore.subscribe((state) => {\n console.log('Store updated:', state);\n this.searchResults = { ...state.searchResults };\n this.query = state.query;\n });\n\n // Fetch initial state\n const { searchResults, query } = useSearchcraftStore.getState();\n console.log('Initial state:', searchResults, query);\n this.searchResults = searchResults;\n this.query = query;\n }\n\n disconnectedCallback() {\n if (this.unsubscribe) {\n this.unsubscribe();\n }\n }\n\n render() {\n if (!this.searchResults?.data) {\n console.warn('No search results data available');\n return <div>No results to display.</div>;\n }\n return (\n <div class='resultsContainer'>\n {this.searchResults?.data?.hits?.map((document, index) => {\n const { doc: result } = document;\n return (\n <searchcraft-base-search-result\n key={`${result?.id}-${index}`}\n button-label='View More'\n callback-fn={() => console.log('interactive element')}\n button-callback-fn={() => console.log('button callback')}\n interactive-result={true}\n image-src={result?.poster}\n result-body-content={result?.overview}\n result-heading={result?.title}\n result-subheading={result?.release_date}\n />\n );\n })}\n {this.query.length > 0 &&\n this.searchResults?.data?.hits?.length === 0 && (\n <searchcraft-error-message\n error-message={`No search results found for \"${this.query}\" query`}\n />\n )}\n </div>\n );\n }\n}\n","import { Component, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'searchcraft-clear-icon-set',\n shadow: true,\n})\nexport class SearchcraftClearIconSet {\n /**\n * Type of the icon to display.\n * Options: 'clear-light', 'clear-dark', 'arrow-light', 'arrow-dark'\n */\n @Prop() type: 'clear-light' | 'clear-dark' | 'arrow-light' | 'arrow-dark' =\n 'clear-light';\n\n render() {\n switch (this.type) {\n case 'clear-light':\n return (\n <svg\n width='22'\n height='22'\n viewBox='0 0 22 22'\n fill='none'\n xmlns='http://www.w3.org/2000/svg'\n aria-labelledby='icon-title'\n >\n <title id='icon-title'>Searchcraft Clear Input Icon Light</title>\n <path\n d='M14 8L8 14M8 8L14 14M21 11C21 16.5228 16.5228 21 11 21C5.47715 21 1 16.5228 1 11C1 5.47715 5.47715 1 11 1C16.5228 1 21 5.47715 21 11Z'\n stroke='black'\n stroke-width='1.5'\n stroke-linecap='round'\n stroke-linejoin='round'\n />\n </svg>\n );\n case 'clear-dark':\n return (\n <svg\n width='22'\n height='22'\n viewBox='0 0 22 22'\n fill='none'\n xmlns='http://www.w3.org/2000/svg'\n aria-labelledby='icon-title'\n >\n <title id='icon-title'>Searchcraft Clear Input Icon Dark</title>\n <path\n d='M14 8L8 14M8 8L14 14M21 11C21 16.5228 16.5228 21 11 21C5.47715 21 1 16.5228 1 11C1 5.47715 5.47715 1 11 1C16.5228 1 21 5.47715 21 11Z'\n stroke='white'\n stroke-width='1.5'\n stroke-linecap='round'\n stroke-linejoin='round'\n />\n </svg>\n );\n case 'arrow-light':\n return (\n <svg\n width='20'\n height='21'\n viewBox='0 0 20 21'\n fill='none'\n xmlns='http://www.w3.org/2000/svg'\n aria-labelledby='icon-title'\n >\n <title id='icon-title'>Searchcraft Arrow Right Icon Light</title>\n <path\n d='M7.5 15.0444L12.5 10.0444L7.5 5.04443'\n stroke='#737373'\n stroke-width='1.5'\n stroke-linecap='round'\n stroke-linejoin='round'\n />\n </svg>\n );\n case 'arrow-dark':\n return (\n <svg\n width='8'\n height='12'\n viewBox='0 0 8 12'\n fill='none'\n xmlns='http://www.w3.org/2000/svg'\n aria-labelledby='icon-title'\n >\n <title id='icon-title'>Searchcraft Arrow Right Icon Dark</title>\n <path\n d='M1.5 11L6.5 6L1.5 1'\n stroke='#BFBFBF'\n stroke-width='1.5'\n stroke-linecap='round'\n stroke-linejoin='round'\n />\n </svg>\n );\n\n default:\n return null;\n }\n }\n}\n",":root {\n --font-stack: Helvetica, Arial, sans-serif;\n}\n\n.inputClearButtonLTR {\n align-items: center;\n background: none;\n border: none;\n display: flex;\n height: 20px;\n justify-content: center;\n padding: 0;\n position: absolute;\n right: 25px;\n top: 50%;\n transform: translateY(-50%);\n width: 20px;\n}\n\n.inputClearButtonRTL {\n align-items: center;\n background: none;\n border: none;\n display: flex;\n height: 20px;\n justify-content: center;\n left: 25px;\n padding: 0;\n position: absolute;\n top: 50%;\n transform: translateY(-50%);\n width: 20px;\n}","import {\n Component,\n Event,\n type EventEmitter,\n Prop,\n h,\n State,\n} from '@stencil/core';\nimport classNames from 'classnames';\n\n@Component({\n tag: 'searchcraft-clear-input-button',\n styleUrl: 'searchcraft-clear-input-button.module.scss',\n shadow: true,\n})\nexport class SearchcraftClearInputButton {\n @Prop() isRequesting? = false;\n @Prop() rightToLeftOrientation = false;\n\n // Updated `clearInput` to an EventEmitter\n @Event() clearInput: EventEmitter<void>;\n\n @State() theme = 'light';\n\n private isLightTheme() {\n return this.theme === 'light';\n }\n\n // Added a click handler to emit the event\n private handleClearClick = (event: MouseEvent) => {\n event.preventDefault(); // Prevent default if necessary\n this.clearInput.emit(); // Emit the event\n };\n\n render() {\n return this.rightToLeftOrientation ? (\n <button\n class={classNames('inputClearButtonRTL', '.sc-clear-input-button-rtl')}\n onClick={this.handleClearClick}\n type='button'\n >\n {this.isRequesting ? (\n this.isLightTheme ? (\n <searchcraft-spinner-light />\n ) : (\n <searchcraft-spinner-dark />\n )\n ) : this.isLightTheme ? (\n <searchcraft-clear-icon-set type='clear-light' />\n ) : (\n <searchcraft-clear-icon-set type='clear-dark' />\n )}\n </button>\n ) : (\n <button\n class={classNames('inputClearButtonLTR', '.sc-clear-input-button-ltr')}\n onClick={this.handleClearClick}\n type='button'\n >\n {this.isRequesting ? (\n this.isLightTheme ? (\n <searchcraft-spinner-light />\n ) : (\n <searchcraft-spinner-dark />\n )\n ) : this.isLightTheme ? (\n <searchcraft-clear-icon-set type='clear-light' />\n ) : (\n <searchcraft-clear-icon-set type='clear-dark' />\n )}\n </button>\n );\n }\n}\n","@import '../../utils/theme';\n\n:root {\n --font-stack: Helvetica, Arial, sans-serif;\n}\n\n@mixin error-message-base {\n font-family: var(--font-stack);\n font-size: 12px;\n font-weight: 400;\n line-height: 16px;\n margin-top: 4px;\n}\n\n.errorMessageLight {\n @include error-message-base;\n color: $light-input-caption-color-error;\n}\n\n.errorMessageDark {\n @include error-message-base;\n color: $dark-input-caption-color-error;\n}","import { Component, Prop, h } from '@stencil/core';\nimport classNames from 'classnames';\n\n@Component({\n tag: 'searchcraft-error-message',\n styleUrl: 'searchcraft-error-message.module.scss',\n shadow: true,\n})\nexport class SearchcraftErrorMessage {\n /**\n * The error message to display. Defaults to a standard message if not provided.\n */\n @Prop() errorMessage?: string;\n\n /**\n * The theme, which determines the style (light or dark).\n */\n @Prop() theme: 'light' | 'dark' = 'light';\n\n render() {\n const errorMessageStyle =\n this.theme === 'light' ? 'errorMessageLight' : 'errorMessageDark';\n\n return (\n <p class={classNames(errorMessageStyle)}>\n {this.errorMessage || 'Search term is required.'}\n </p>\n );\n }\n}\n","@import '../../utils/theme';\n\n:root {\n --font-stack: Helvetica, Arial, sans-serif;\n}\n\n@mixin input-container-base {\n position: relative;\n width: 100%;\n}\n\n@mixin input-base {\n border: none;\n border-radius: 8px;\n font-family: var(--font-stack);\n outline: none;\n padding-bottom: 15px;\n padding-top: 15px;\n width: 100%;\n\n &::placeholder {\n font-family: var(--font-stack);\n font-size: 16px;\n }\n}\n\n@mixin input-base-light {\n @include input-base;\n background-color: $light-input-background-color;\n color: $light-input-label-color;\n\n &::placeholder {\n color: $light-input-placeholder-color;\n }\n\n &:focus {\n outline: 2px solid $light-input-outline-focus;\n }\n}\n\n@mixin input-base-dark {\n @include input-base;\n background-color: $dark-input-background-color;\n color: $dark-input-label-color;\n\n &::placeholder {\n color: $dark-input-placeholder-color;\n }\n\n &:focus {\n outline: 2px solid $dark-input-outline-focus;\n }\n}\n\n@mixin input-error-base-light {\n @include input-base-light;\n outline: 2px solid $light-input-error-outline;\n\n &:focus-visible {\n outline: 2px solid $light-input-error-outline,\n }\n}\n\n@mixin input-error-base-dark {\n @include input-base-dark;\n outline: 2px solid $dark-input-error-outline;\n\n &:focus-visible {\n outline: 2px solid $dark-input-error-outline;\n }\n}\n\n.inputContainerLTR {\n @include input-container-base;\n}\n\n.inputContainerRTL {\n @include input-container-base;\n margin-left: 8px;\n}\n\n@mixin align-LTR {\n margin-right: 8px;\n padding-left: 36px;\n padding-right: 16px;\n}\n\n.inputLightLTR {\n @include input-base-light;\n @include align-LTR;\n}\n\n.inputDarkLTR {\n @include input-base-dark;\n @include align-LTR;\n}\n\n.inputErrorLightLTR {\n @include input-error-base-light;\n @include align-LTR;\n}\n\n.inputErrorDarkLTR {\n @include input-error-base-dark;\n @include align-LTR;\n}\n\n@mixin align-RTL {\n margin-left: 8px;\n padding-left: 16px;\n padding-right: 36px;\n text-align: right;\n}\n\n.inputLightRTL {\n @include input-base-light;\n @include align-RTL;\n}\n\n.inputDarkRTL {\n @include input-base-dark;\n @include align-RTL;\n}\n\n.inputErrorLightRTL {\n @include input-error-base-light;\n @include align-RTL;\n}\n\n.inputErrorDarkRTL {\n @include input-error-base-dark;\n @include align-RTL;\n}\n\n.inputWrapper {\n align-items: center;\n display: flex;\n position: relative;\n width: 100%;\n}\n","import {\n Component,\n h,\n Prop,\n State,\n Event,\n Fragment,\n type EventEmitter,\n} from '@stencil/core';\nimport classNames from 'classnames';\n\nimport { parseCustomStyles } from '@utils/utils';\n\nexport interface ScInputCustomEvent<T> extends CustomEvent<T> {\n detail: T;\n target: HTMLSearchcraftInputElement;\n}\n\n@Component({\n tag: 'searchcraft-input',\n styleUrl: 'searchcraft-input.module.scss',\n shadow: true,\n})\nexport class SearchcraftInput {\n @Prop() customStyles: string | Record<string, string> = {};\n @Prop() error = false;\n @Prop() formClassName = '';\n @Prop() inputCaptionClassName = '';\n @Prop() inputCaptionValue = '';\n @Prop() inputClassName = '';\n @Prop() placeholderValue = 'Enter Search';\n @Prop() rightToLeftOrientation = false;\n @Prop() query = '';\n\n @Event() clearInput: EventEmitter<void>;\n @Event() searchInputChange: EventEmitter<string>;\n\n @State() theme = 'light';\n\n private get isLightTheme() {\n return this.theme === 'light';\n }\n\n handleInputChange(event: Event) {\n const input = event.target as HTMLInputElement;\n this.searchInputChange.emit(input.value);\n }\n\n handleClearInput() {\n if (this.clearInput) {\n this.clearInput.emit();\n }\n }\n\n render() {\n const containerClassName = this.rightToLeftOrientation\n ? 'inputContainerRTL'\n : 'inputContainerLTR';\n\n const inputClassName = classNames(\n this.error\n ? this.isLightTheme\n ? 'inputErrorLightRTL'\n : 'inputErrorDarkRTL'\n : this.isLightTheme\n ? 'inputLightLTR'\n : 'inputDarkLTR',\n 'searchcraft-input',\n );\n\n const validatedCustomStyles = parseCustomStyles(this.customStyles);\n\n const placeholderStyle = {\n fontSize: validatedCustomStyles.placeholderFontSize || '16px',\n };\n return (\n <div\n class={classNames(\n containerClassName,\n this.formClassName,\n 'searchcraft-input-form',\n )}\n >\n {this.rightToLeftOrientation ? (\n <Fragment>\n <input\n class={classNames(inputClassName, 'searchcraft-input')}\n id='searchcraft-input-id'\n onChange={this.handleInputChange.bind(this)}\n placeholder={this.placeholderValue}\n type='text'\n value={this.query}\n style={validatedCustomStyles}\n />\n <style>\n {`\n #searchcraft-input-id::placeholder {\n font-size: ${placeholderStyle.fontSize};\n }\n `}\n </style>\n {this.inputCaptionValue && (\n <searchcraft-input-caption\n inputCaptionClassName={this.inputCaptionClassName}\n inputCaptionValue={this.inputCaptionValue}\n rightToLeftOrientation={this.rightToLeftOrientation}\n />\n )}\n {this.query.length > 0 && (\n <searchcraft-clear-input-button\n onClearInput={this.handleClearInput}\n rightToLeftOrientation={this.rightToLeftOrientation}\n />\n )}\n <searchcraft-input-icon\n error={this.error}\n rightToLeftOrientation={this.rightToLeftOrientation}\n />\n </Fragment>\n ) : (\n <div class='inputWrapper'>\n <searchcraft-input-icon\n error={this.error}\n rightToLeftOrientation={this.rightToLeftOrientation}\n />\n <input\n class={classNames(inputClassName, 'searchcraft-input')}\n id='searchcraft-input-id'\n onChange={this.handleInputChange.bind(this)}\n placeholder={this.placeholderValue}\n type='text'\n value={this.query}\n style={validatedCustomStyles}\n />\n <style>\n {`\n #searchcraft-input-id::placeholder {\n font-size: ${placeholderStyle.fontSize};\n }\n `}\n </style>\n {this.inputCaptionValue && (\n <searchcraft-input-caption\n inputCaptionClassName={this.inputCaptionClassName}\n inputCaptionValue={this.inputCaptionValue}\n rightToLeftOrientation={this.rightToLeftOrientation}\n />\n )}\n {this.query.length > 0 && (\n <searchcraft-clear-input-button\n onClearInput={this.handleClearInput}\n rightToLeftOrientation={this.rightToLeftOrientation}\n />\n )}\n </div>\n )}\n </div>\n );\n }\n}\n","@import '../../utils/theme';\n\n:root {\n --font-stack: Helvetica, Arial, sans-serif;\n}\n\n@mixin input-caption-base {\n font-family: var(--font-stack);\n font-size: 12px;\n font-weight: 400;\n line-height: 16px;\n margin-top: 4px;\n}\n\n@mixin input-caption-base-light {\n @include input-caption-base;\n color: $light-input-caption-color;\n}\n\n@mixin input-caption-base-dark {\n @include input-caption-base;\n color: $dark-input-caption-color;\n}\n\n.inputCaptionLightLTR {\n @include input-caption-base-light;\n}\n\n.inputCaptionDarkLTR {\n @include input-caption-base-dark;\n}\n\n.inputCaptionErrorLightLTR {\n @include input-caption-base;\n color: $light-input-caption-color-error;\n}\n\n.inputCaptionErrorDarkLTR {\n @include input-caption-base;\n color: $dark-input-caption-color-error;\n}\n\n.inputCaptionLightRTL {\n @include input-caption-base-light;\n text-align: right;\n}\n\n.inputCaptionDarkRTL {\n @include input-caption-base-dark;\n text-align: right;\n}\n\n.inputCaptionErrorLightRTL {\n @include input-caption-base;\n color: $light-input-caption-color-error;\n text-align: right;\n}\n\n.inputCaptionErrorDarkRTL {\n @include input-caption-base;\n color: $dark-input-caption-color-error;\n text-align: right;\n}","import { Component, Prop, h, State } from '@stencil/core';\nimport classNames from 'classnames';\n\n@Component({\n tag: 'searchcraft-input-caption',\n styleUrl: 'searchcraft-input-caption.module.scss',\n shadow: true,\n})\nexport class SearchcraftInputCaption {\n @Prop() error?: boolean;\n @Prop() inputCaptionClassName? = '';\n @Prop() inputCaptionValue = 'Enter Search';\n @Prop() rightToLeftOrientation = false;\n @State() theme = 'light';\n\n private isLightTheme() {\n return this.theme === 'light';\n }\n\n render() {\n return this.rightToLeftOrientation ? (\n <p\n class={classNames(\n this.error\n ? this.isLightTheme\n ? 'inputCaptionErrorLightRTL'\n : 'inputCaptionErrorDarkRTL'\n : this.isLightTheme\n ? 'inputCaptionLightRTL'\n : 'inputCaptionDarkRTL',\n this.inputCaptionClassName,\n '.searchcraft-input-caption',\n )}\n >\n {this.inputCaptionValue}\n </p>\n ) : (\n <p\n class={classNames(\n this.error\n ? this.isLightTheme\n ? 'inputCaptionErrorLightLTR'\n : 'inputCaptionErrorDarkLTR'\n : this.isLightTheme\n ? 'inputCaptionLightLTR'\n : 'inputCaptionDarkLTR',\n this.inputCaptionClassName,\n '.searchcraft-input-caption',\n )}\n >\n {this.inputCaptionValue}\n </p>\n );\n }\n}\n",":root {\n --font-stack: Helvetica, Arial, sans-serif;\n}\n\n.inputIconLTR {\n height: 20px;\n left: 10px;\n position: absolute;\n top: 11px;\n width: 20px;\n}\n\n.inputIconRTL {\n height: 20px;\n position: absolute;\n right: 10px;\n top: 11px;\n width: 20px;\n}","import { Component, Prop, h, State } from '@stencil/core';\n\n@Component({\n tag: 'searchcraft-input-icon',\n styleUrl: 'searchcraft-input-icon.module.scss',\n shadow: true,\n})\nexport class SearchcraftInputIcon {\n @Prop() error?: boolean;\n @Prop() rightToLeftOrientation = false;\n @State() theme = 'light';\n\n private isLightTheme() {\n return this.theme === 'light';\n }\n\n render() {\n return this.error ? (\n <div\n class={this.rightToLeftOrientation ? 'inputIconRTL' : 'inputIconLTR'}\n >\n {this.isLightTheme ? (\n <searchcraft-search-icon-set type='error-light' />\n ) : (\n <searchcraft-search-icon-set type='error-dark' />\n )}\n </div>\n ) : (\n <div\n class={this.rightToLeftOrientation ? 'inputIconRTL' : 'inputIconLTR'}\n >\n {this.isLightTheme ? (\n <searchcraft-search-icon-set type='search-light' />\n ) : (\n <searchcraft-search-icon-set type='search-dark' />\n )}\n </div>\n );\n }\n}\n","@import '../../utils/theme';\n\n:root {\n --font-stack: Helvetica, Arial, sans-serif;\n}\n\n@mixin input-label-base {\n font-family: var(--font-stack);\n font-size: 12px;\n font-weight: 400;\n line-height: 16px;\n margin-top: 4px;\n}\n\n.labelLight {\n @include input-label-base;\n color: $light-input-label-color;\n}\n\n.labelDark {\n @include input-label-base;\n color: $dark-input-label-color;\n}","import { Component, Prop, h, State } from '@stencil/core';\nimport classNames from 'classnames';\n\n@Component({\n tag: 'searchcraft-input-label',\n styleUrl: 'searchcraft-input-label.module.scss',\n shadow: true,\n})\nexport class SearchcraftInputLabel {\n @Prop() inputLabelClassName? = '';\n @Prop() label?: string; // Make label optional\n @State() theme = 'light';\n\n private isLightTheme() {\n return this.theme === 'light';\n }\n\n render() {\n // Render nothing if no label prop is provided\n if (!this.label) {\n return null;\n }\n\n const labelStyle = this.isLightTheme() ? 'labelLight' : 'labelDark';\n\n return (\n <label\n class={classNames(labelStyle, this.inputLabelClassName)}\n htmlFor='searchcraft-input-id'\n >\n {this.label}\n </label>\n );\n }\n}\n","import { Component, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'searchcraft-search-icon-set',\n shadow: true,\n})\nexport class SearchcraftSearchIconSet {\n /**\n * Type of the icon to display.\n * Options: ''search-light', search-dark', 'error-light', 'error-dark'\n */\n @Prop() type: 'search-light' | 'search-dark' | 'error-light' | 'error-dark' =\n 'search-dark';\n\n render() {\n switch (this.type) {\n case 'search-light':\n return (\n <svg\n width='20'\n height='20'\n viewBox='0 0 20 20'\n fill='none'\n xmlns='http://www.w3.org/2000/svg'\n aria-labelledby='searchcraft-title'\n >\n <title id='searchcraft-title'>Searchcraft Search Icon Light</title>\n <path\n d='M17.5 17.5L13.875 13.875M15.8333 9.16667C15.8333 12.8486 12.8486 15.8333 9.16667 15.8333C5.48477 15.8333 2.5 12.8486 2.5 9.16667C2.5 5.48477 5.48477 2.5 9.16667 2.5C12.8486 2.5 15.8333 5.48477 15.8333 9.16667Z'\n stroke='#404040'\n stroke-width='1.5'\n stroke-linecap='round'\n stroke-linejoin='round'\n />\n </svg>\n );\n case 'search-dark':\n return (\n <svg\n width='18'\n height='18'\n viewBox='0 0 18 18'\n fill='none'\n xmlns='http://www.w3.org/2000/svg'\n aria-labelledby='searchcraft-title'\n >\n <title id='searchcraft-title'>Searchcraft Search Icon Dark</title>\n <path\n d='M16.5 16.5L12.875 12.875M14.8333 8.16667C14.8333 11.8486 11.8486 14.8333 8.16667 14.8333C4.48477 14.8333 1.5 11.8486 1.5 8.16667C1.5 4.48477 4.48477 1.5 8.16667 1.5C11.8486 1.5 14.8333 4.48477 14.8333 8.16667Z'\n stroke='#E6E6E6'\n stroke-width='1.5'\n stroke-linecap='round'\n stroke-linejoin='round'\n />\n </svg>\n );\n case 'error-light':\n return (\n <svg\n width='20'\n height='20'\n viewBox='0 0 20 20'\n fill='none'\n xmlns='http://www.w3.org/2000/svg'\n aria-labelledby='searchcraft-title'\n >\n <title id='searchcraft-title'>\n Searchcraft Error Search Icon Light\n </title>\n <path\n d='M17.5 17.5L13.875 13.875M15.8333 9.16667C15.8333 12.8486 12.8486 15.8333 9.16667 15.8333C5.48477 15.8333 2.5 12.8486 2.5 9.16667C2.5 5.48477 5.48477 2.5 9.16667 2.5C12.8486 2.5 15.8333 5.48477 15.8333 9.16667Z'\n stroke='#737373'\n stroke-width='1.5'\n stroke-linecap='round'\n stroke-linejoin='round'\n />\n </svg>\n );\n case 'error-dark':\n return (\n <svg\n width='18'\n height='18'\n viewBox='0 0 18 18'\n fill='none'\n xmlns='http://www.w3.org/2000/svg'\n aria-labelledby='searchcraft-title'\n >\n <title id='searchcraft-title'>\n Searchcraft Error Search Icon Dark\n </title>\n <path\n d='M16.5 16.5L12.875 12.875M14.8333 8.16667C14.8333 11.8486 11.8486 14.8333 8.16667 14.8333C4.48477 14.8333 1.5 11.8486 1.5 8.16667C1.5 4.48477 4.48477 1.5 8.16667 1.5C11.8486 1.5 14.8333 4.48477 14.8333 8.16667Z'\n stroke='#BFBFBF'\n stroke-width='1.5'\n stroke-linecap='round'\n stroke-linejoin='round'\n />\n </svg>\n );\n default:\n return null;\n }\n }\n}\n","$spinner-size: 20px;\n\n.spinnerContainer {\n background-color: transparent;\n height: $spinner-size;\n width: $spinner-size;\n}\n\n.spinnerDark {\n height: 100%;\n width: 100%;\n background: conic-gradient(#000 50%, #FFFFFF);\n clip-path: circle(50%);\n mask-image: radial-gradient(circle at center, rgba(0,0,0,0) calc($spinner-size/3), rgba(0,0,0,1) calc($spinner-size/3));\n animation: spinning 1s linear infinite;\n}\n\n.spinnerLight {\n height: 100%;\n width: 100%;\n background: conic-gradient(#737373 50%, #FFFFFF);\n clip-path: circle(50%);\n mask-image: radial-gradient(circle at center, rgba(0,0,0,0) calc($spinner-size/3), rgba(0,0,0,1) calc($spinner-size/3));\n animation: spinning 1s linear infinite;\n}\n\n@keyframes spinning {\n 0% { transform: rotate(0deg); }\n 50% {transform: rotate(180deg);}\n 100% { transform: rotate(360deg); }\n}","import { Component, h } from '@stencil/core';\n\n@Component({\n tag: 'searchcraft-spinner-dark',\n styleUrl: 'searchcraft-spinner-dark.module.scss',\n shadow: true,\n})\nexport class SearchcraftSpinnerDark {\n render() {\n return (\n <div class='spinnerContainer'>\n <div class='spinnerDark' />\n </div>\n );\n }\n}\n","$spinner-size: 20px;\n\n.spinnerContainer {\n background-color: transparent;\n height: $spinner-size;\n width: $spinner-size;\n}\n\n.spinnerLight {\n height: 100%;\n width: 100%;\n background: conic-gradient(#737373 50%, #FFFFFF);\n clip-path: circle(50%);\n mask-image: radial-gradient(circle at center, rgba(0,0,0,0) calc($spinner-size/3), rgba(0,0,0,1) calc($spinner-size/3));\n animation: spinning 1s linear infinite;\n}\n\n@keyframes spinning {\n 0% { transform: rotate(0deg); }\n 50% {transform: rotate(180deg);}\n 100% { transform: rotate(360deg); }\n}","import { Component, h } from '@stencil/core';\n\n@Component({\n tag: 'searchcraft-spinner-light',\n styleUrl: 'searchcraft-spinner-light.module.scss',\n shadow: true,\n})\nexport class SearchcraftSpinnerLight {\n render() {\n return (\n <div class='spinnerContainer'>\n <div class='spinnerLight' />\n </div>\n );\n }\n}\n"],"version":3}
1
+ {"file":"searchcraft-auto-search-form.searchcraft-base-search-result.searchcraft-base-search-results.searchcraft-clear-icon-set.searchcraft-clear-input-button.searchcraft-error-message.searchcraft-input.searchcraft-input-caption.searchcraft-input-icon.searchcraft-input-label.searchcraft-search-icon-set.searchcraft-spinner-dark.searchcraft-spinner-light.entry.js","mappings":";;;;;AAAA,MAAM,kCAAkC,GAAG,uLAAuL,CAAC;AACnO,wCAAe,kCAAkC;;MCqBpC,yBAAyB;;;;QAqB5B,oBAAe,GAAyC,IAAI,CAAC;QAC7D,kBAAa,GAAG,GAAG,CAAC;QACpB,gBAAW,GAAG,mBAAmB,CAAC,QAAQ,EAAE,CAAC;QAQrD,sBAAiB,GAAG,CAAC,KAAiC;YACpD,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC;YAC1B,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;;YAGlC,IAAI,IAAI,CAAC,eAAe,EAAE;gBACxB,YAAY,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;aACpC;;YAGD,IAAI,CAAC,eAAe,GAAG,UAAU,CAAC;gBAChC,OAAO,CAAC,GAAG,CAAC,4BAA4B,CAAC,CAAC;gBAC1C,IAAI,CAAC,SAAS,EAAE,CAAC;aAClB,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;SACxB,CAAC;QAEF,qBAAgB,GAAG;YACjB,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC;YAChB,OAAO,CAAC,GAAG,CAAC,eAAe,CAAC,CAAC;YAE7B,IAAI,OAAO,IAAI,CAAC,UAAU,KAAK,UAAU,EAAE;gBACzC,IAAI,CAAC,UAAU,EAAE,CAAC;aACnB;YAED,IAAI,IAAI,CAAC,eAAe,EAAE;gBACxB,YAAY,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;aACpC;YAED,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;YACnB,IAAI,CAAC,aAAa,GAAG,EAAE,CAAC;SACzB,CAAC;QAEM,cAAS,GAAG;YAClB,IAAI,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;gBAC5B,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC;gBAClB,IAAI,CAAC,aAAa,GAAG,EAAE,CAAC;aACzB;iBAAM;gBACL,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;gBACnB,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;gBAEtC,IAAI;oBACF,MAAM,IAAI,CAAC,WAAW,CAAC,MAAM,EAAE,CAAC;oBAChC,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,CAAC;iBACrE;gBAAC,OAAO,KAAK,EAAE;oBACd,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC;iBACnB;aACF;SACF,CAAC;QAEF,qBAAgB,GAAG,OAAO,KAAY;YACpC,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,MAAM,IAAI,CAAC,SAAS,EAAE,CAAC;SACxB,CAAC;mCAlF4B,EAAE;0BACC,SAAQ;sBACT;YAC9B,MAAM,EAAE,EAAE;YACV,WAAW,EAAE,EAAE;YACf,KAAK,EAAE,EAAE;SACV;oCAC+D,EAAE;iCACtC,EAAE;6BACN,EAAE;gCACC,aAAa;sCACP,KAAK;oCACP,EAAE;qBAIhB,KAAK;qBACL,EAAE;6BACM,EAAE;;IAM3B,gBAAgB;QACd,MAAM,WAAW,GAAG,IAAIA,CAAe,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;QACrD,IAAI,CAAC,WAAW,CAAC,UAAU,CAAC,WAAW,EAAE,IAAI,CAAC,CAAC;QAC/C,OAAO,CAAC,GAAG,CAAC,uBAAuB,CAAC,CAAC;KACtC;IAwDD,MAAM;QACJ,MAAM,SAAS,GAAG,IAAI,CAAC,sBAAsB,GAAG,SAAS,GAAG,SAAS,CAAC;QACtE,MAAM,kBAAkB,GAAG,iBAAiB,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAC;QACxE,QACE,6DAAM,KAAK,EAAE,GAAG,SAAS,EAAE,EAAE,QAAQ,EAAE,IAAI,CAAC,gBAAgB,IAC1D,gFAAyB,KAAK,EAAE,IAAI,CAAC,aAAa,GAAI,EACtD,4DAAK,KAAK,EAAC,iBAAiB,IAC1B,0EACE,YAAY,EAAE,kBAAkB,yBACX,IAAI,CAAC,iBAAiB,EAC3C,YAAY,EAAE,IAAI,CAAC,gBAAgB,EACnC,mBAAmB,EAAE,IAAI,CAAC,iBAAiB,uBACxB,IAAI,CAAC,gBAAgB,EACxC,KAAK,EAAE,IAAI,CAAC,KAAK,+BACU,IAAI,CAAC,sBAAsB,GACtD,CACE,EACL,IAAI,CAAC,KAAK,KACT,kFAA2B,YAAY,EAAC,8BAA8B,GAAG,CAC1E,CACI,EACP;KACH;;;;ACjIH,MAAM,oCAAoC,GAAG,u0FAAu0F,CAAC;AACr3F,0CAAe,oCAAoC;;MCMtC,2BAA2B;;;;;;QAa7B,mBAAc,GAAe,SAAQ,CAAC;QACtC,oBAAe,GAAe,SAAQ,CAAC;QACvC,mBAAc,GAAe,SAAQ,CAAC;QAEvC,sBAAiB,GAAG;YAC1B,IAAI,CAAC,cAAc,EAAE,CAAC;SACvB,CAAC;QAEM,yBAAoB,GAAG;YAC7B,IAAI,IAAI,CAAC,aAAa,EAAE;gBACtB,IAAI,CAAC,cAAc,EAAE,CAAC;aACvB;SACF,CAAC;0BAxBmB,EAAE;gCACI,EAAE;2BACP,EAAE;6BACA,KAAK;8BACJ,EAAE;gCACA,EAAE;+BACH,EAAE;2BACN,EAAE;8BACC,EAAE;yBACW,OAAO;4BACE,EAAE;;IAgBjD,MAAM;QACJ,MAAM,YAAY,GAAG,IAAI,CAAC,SAAS,KAAK,OAAO,CAAC;QAChD,MAAM,cAAc,qBAAQ,IAAI,CAAC,YAAY,CAAE,CAAC;QAChD,QACE,4DACE,KAAK,EACH,IAAI,CAAC,aAAa;kBACd,YAAY;sBACV,iCAAiC;sBACjC,gCAAgC;kBAClC,iBAAiB,EAEvB,EAAE,EAAC,kBAAkB,EACrB,OAAO,EAAE,IAAI,CAAC,oBAAoB,EAClC,SAAS,EAAE,IAAI,CAAC,eAAe,EAC/B,KAAK,EAAE,cAAc,EACrB,QAAQ,EAAC,GAAG,IAEX,IAAI,CAAC,aAAa,KACjB,4DAAK,KAAK,EAAC,sBAAsB,IAC9B,YAAY,IACX,kCAA4B,IAAI,EAAC,aAAa,GAAG,KAEjD,kCAA4B,IAAI,EAAC,YAAY,GAAG,CACjD,CACG,CACP,EACD,4DAAK,KAAK,EAAC,gBAAgB,IACzB,4DACE,GAAG,EAAE,IAAI,CAAC,gBAAgB,EAC1B,KAAK,EAAE,YAAY,GAAG,YAAY,GAAG,WAAW,EAChD,GAAG,EAAE,IAAI,CAAC,WAAW,GACrB,CACE,EACN,4DAAK,KAAK,EAAC,kBAAkB,IAC3B,2DAAI,KAAK,EAAE,YAAY,GAAG,cAAc,GAAG,aAAa,IACrD,IAAI,CAAC,WAAW,EAChB,IAAI,CAAC,aAAa,KACjB,4DAAK,KAAK,EAAC,sBAAsB,IAC9B,YAAY,IACX,kCAA4B,IAAI,EAAC,aAAa,GAAG,KAEjD,kCAA4B,IAAI,EAAC,YAAY,GAAG,CACjD,CACG,CACP,CACE,EACL,2DAAI,KAAK,EAAE,YAAY,GAAG,iBAAiB,GAAG,gBAAgB,IAC3D,IAAI,CAAC,cAAc,CACjB,EACL,0DACE,KAAK,EAAE,YAAY,GAAG,qBAAqB,GAAG,oBAAoB,IAEjE,IAAI,CAAC,cAAc,CAClB,EACJ,0DACE,KAAK,EACH,YAAY,GAAG,uBAAuB,GAAG,sBAAsB,IAGhE,IAAI,CAAC,gBAAgB,CACpB,EACJ,0DACE,KAAK,EACH,YAAY,GAAG,sBAAsB,GAAG,qBAAqB,IAG9D,IAAI,CAAC,eAAe,CACnB,EACH,IAAI,CAAC,UAAU,KACd,+DAAQ,OAAO,EAAE,IAAI,CAAC,iBAAiB,EAAE,IAAI,EAAC,QAAQ,IACnD,IAAI,CAAC,UAAU,CACT,CACV,CACG,CACF,EACN;KACH;;;;AC/GH,MAAM,qCAAqC,GAAG,kRAAkR,CAAC;AACjU,2CAAe,qCAAqC;;MCcvC,4BAA4B;;;qBACtB,EAAE;6BACkC,IAAI;0BAMpC,EAAE;sCAM2C,EAAE;;IAMpE,gBAAgB;;QAEd,IAAI,CAAC,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,UAAU,CAAC,MAAM,KAAK,CAAC,EAAE;YACpD,OAAO,CAAC,IAAI,CAAC,iDAAiD,CAAC,CAAC;YAChE,IAAI,CAAC,UAAU,GAAG,EAAE,CAAC;SACtB;;QAGD,IAAI,CAAC,WAAW,GAAG,mBAAmB,CAAC,SAAS,CAAC,CAAC,KAAK;YACrD,IAAI,CAAC,aAAa,qBAAQ,KAAK,CAAC,aAAa,CAAE,CAAC;YAChD,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC,KAAK,CAAC;SAC1B,CAAC,CAAC;;QAGH,MAAM,EAAE,aAAa,EAAE,KAAK,EAAE,GAAG,mBAAmB,CAAC,QAAQ,EAAE,CAAC;QAChE,IAAI,CAAC,aAAa,GAAG,aAAa,CAAC;QACnC,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;KACpB;IAED,oBAAoB;QAClB,IAAI,IAAI,CAAC,WAAW,EAAE;YACpB,IAAI,CAAC,WAAW,EAAE,CAAC;SACpB;KACF;IAED,MAAM;;QACJ,IAAI,EAAC,MAAA,IAAI,CAAC,aAAa,0CAAE,IAAI,CAAA,EAAE;YAC7B,OAAO,CAAC,IAAI,CAAC,kCAAkC,CAAC,CAAC;YACjD,OAAO,wCAAiC,CAAC;SAC1C;QAED,MAAM,gBAAgB,GAAG,eAAe,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;QAC1D,MAAM,kBAAkB,GAAG,iBAAiB,CAAC,IAAI,CAAC,sBAAsB,CAAC,CAAC;QAC1E,QACE,WAAK,KAAK,EAAC,kBAAkB,IAC1B,MAAA,MAAA,MAAA,IAAI,CAAC,aAAa,0CAAE,IAAI,0CAAE,IAAI;eAAE,GAAG,CAAC,CAAC,QAAQ,EAAE,KAAK;gBACnD,MAAM,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,QAAQ,CAAC;gBACjC,MAAM,iBAAiB,GAAG,wBAAwB,CAChD,MAAM,EACN,gBAAgB,CACjB,CAAC;;gBAGF,MAAM,aAAa,GAAG,IAAI,CAAC,WAAW,CAAC,aAAa,CAClD,0BAA0B,CAC3B,CAAC;gBACF,IAAI,aAAa,EAAE;;oBAEjB,MAAM,kBAAkB,GAAG,aAAa,CAAC,SAAS,CAChD,IAAI,CACU,CAAC;oBACjB,kBAAkB,CAAC,eAAe,CAAC,MAAM,CAAC,CAAC;oBAC3C,kBAAkB,CAAC,YAAY,CAC7B,aAAa,EACb,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,CACvB,CAAC;oBACF,QACE,WAAK,GAAG,EAAE,GAAG,iBAAiB,CAAC,EAAE,IAAI,KAAK,EAAE,IACzC,kBAAkB,CAAC,SAAS,CACzB,EACN;iBACH;;gBAED,QACE,sCACE,GAAG,EAAE,GAAG,iBAAiB,CAAC,EAAE,IAAI,KAAK,EAAE,qBACtB,MAAM,OAAO,CAAC,GAAG,CAAC,iBAAiB,CAAC,qBACpC,MAAM,OAAO,CAAC,GAAG,CAAC,qBAAqB,CAAC,sBACvC,MAAM,OAAO,CAAC,GAAG,CAAC,SAAS,CAAC,oBAC9B,IAAI,kBACN,iBAAiB,CAAC,gBAAgB,CAAC,CAAC,CAAC,CAAC,qBACnC,iBAAiB,CAAC,gBAAgB,CAAC,CAAC,CAAC,CAAC,qBACtC,iBAAiB,CAAC,gBAAgB,CAAC,CAAC,CAAC,CAAC,uBACpC,iBAAiB,CAAC,gBAAgB,CAAC,CAAC,CAAC,CAAC,sBACvC,iBAAiB,CAAC,gBAAgB,CAAC,CAAC,CAAC,CAAC,kBAEtD,iBAAiB,CAAC,gBAAgB,CAAC,gBAAgB,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,EAElE,YAAY,EAAE,kBAAkB,GAChC,EACF;aACH,CAAC,EAED,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC;YACpB,CAAA,MAAA,MAAA,MAAA,IAAI,CAAC,aAAa,0CAAE,IAAI,0CAAE,IAAI,0CAAE,MAAM,MAAK,CAAC,KAC1C,kDACiB,gCAAgC,IAAI,CAAC,KAAK,SAAS,GAClE,CACH,EAGH,YAAM,IAAI,EAAC,iBAAiB,GAAG,CAC3B,EACN;KACH;;;;;MC3HU,uBAAuB;;;oBAMhC,aAAa;;IAEf,MAAM;QACJ,QAAQ,IAAI,CAAC,IAAI;YACf,KAAK,aAAa;gBAChB,QACE,WACE,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B,qBAClB,YAAY,IAE5B,aAAO,EAAE,EAAC,YAAY,yCAA2C,EACjE,YACE,CAAC,EAAC,uIAAuI,EACzI,MAAM,EAAC,OAAO,kBACD,KAAK,oBACH,OAAO,qBACN,OAAO,GACvB,CACE,EACN;YACJ,KAAK,YAAY;gBACf,QACE,WACE,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B,qBAClB,YAAY,IAE5B,aAAO,EAAE,EAAC,YAAY,wCAA0C,EAChE,YACE,CAAC,EAAC,uIAAuI,EACzI,MAAM,EAAC,OAAO,kBACD,KAAK,oBACH,OAAO,qBACN,OAAO,GACvB,CACE,EACN;YACJ,KAAK,aAAa;gBAChB,QACE,WACE,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B,qBAClB,YAAY,IAE5B,aAAO,EAAE,EAAC,YAAY,yCAA2C,EACjE,YACE,CAAC,EAAC,uCAAuC,EACzC,MAAM,EAAC,SAAS,kBACH,KAAK,oBACH,OAAO,qBACN,OAAO,GACvB,CACE,EACN;YACJ,KAAK,YAAY;gBACf,QACE,WACE,KAAK,EAAC,GAAG,EACT,MAAM,EAAC,IAAI,EACX,OAAO,EAAC,UAAU,EAClB,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B,qBAClB,YAAY,IAE5B,aAAO,EAAE,EAAC,YAAY,wCAA0C,EAChE,YACE,CAAC,EAAC,qBAAqB,EACvB,MAAM,EAAC,SAAS,kBACH,KAAK,oBACH,OAAO,qBACN,OAAO,GACvB,CACE,EACN;YAEJ;gBACE,OAAO,IAAI,CAAC;SACf;KACF;;;ACpGH,MAAM,oCAAoC,GAAG,mcAAmc,CAAC;AACjf,0CAAe,oCAAoC;;MCctC,2BAA2B;;;;;QAc9B,qBAAgB,GAAG,CAAC,KAAiB;YAC3C,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,CAAC;SACxB,CAAC;4BAhBsB,KAAK;sCACI,KAAK;qBAKrB,OAAO;;IAEhB,YAAY;QAClB,OAAO,IAAI,CAAC,KAAK,KAAK,OAAO,CAAC;KAC/B;IAQD,MAAM;QACJ,OAAO,IAAI,CAAC,sBAAsB,IAChC,cACE,KAAK,EAAE,UAAU,CAAC,qBAAqB,EAAE,4BAA4B,CAAC,EACtE,OAAO,EAAE,IAAI,CAAC,gBAAgB,EAC9B,IAAI,EAAC,QAAQ,IAEZ,IAAI,CAAC,YAAY,IAChB,IAAI,CAAC,YAAY,IACf,oCAA6B,KAE7B,mCAA4B,CAC7B,IACC,IAAI,CAAC,YAAY,IACnB,kCAA4B,IAAI,EAAC,aAAa,GAAG,KAEjD,kCAA4B,IAAI,EAAC,YAAY,GAAG,CACjD,CACM,KAET,cACE,KAAK,EAAE,UAAU,CAAC,qBAAqB,EAAE,4BAA4B,CAAC,EACtE,OAAO,EAAE,IAAI,CAAC,gBAAgB,EAC9B,IAAI,EAAC,QAAQ,IAEZ,IAAI,CAAC,YAAY,IAChB,IAAI,CAAC,YAAY,IACf,oCAA6B,KAE7B,mCAA4B,CAC7B,IACC,IAAI,CAAC,YAAY,IACnB,kCAA4B,IAAI,EAAC,aAAa,GAAG,KAEjD,kCAA4B,IAAI,EAAC,YAAY,GAAG,CACjD,CACM,CACV,CAAC;KACH;;;;ACxEH,MAAM,gCAAgC,GAAG,6SAA6S,CAAC;AACvV,sCAAe,gCAAgC;;MCOlC,uBAAuB;;;;qBASA,OAAO;;IAEzC,MAAM;QACJ,MAAM,iBAAiB,GACrB,IAAI,CAAC,KAAK,KAAK,OAAO,GAAG,mBAAmB,GAAG,kBAAkB,CAAC;QAEpE,QACE,0DAAG,KAAK,EAAE,UAAU,CAAC,iBAAiB,CAAC,IACpC,IAAI,CAAC,YAAY,IAAI,0BAA0B,CAC9C,EACJ;KACH;;;;AC5BH,MAAM,yBAAyB,GAAG,2sHAA2sH,CAAC;AAC9uH,+BAAe,yBAAyB;;MCsB3B,gBAAgB;;;;;4BAC6B,EAAE;qBAC1C,KAAK;6BACG,EAAE;qCACM,EAAE;iCACN,EAAE;8BACL,EAAE;gCACA,cAAc;sCACR,KAAK;qBACtB,EAAE;qBAKD,OAAO;;IAExB,IAAY,YAAY;QACtB,OAAO,IAAI,CAAC,KAAK,KAAK,OAAO,CAAC;KAC/B;IAED,iBAAiB,CAAC,KAAY;QAC5B,MAAM,KAAK,GAAG,KAAK,CAAC,MAA0B,CAAC;QAC/C,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;KAC1C;IAED,gBAAgB;QACd,IAAI,IAAI,CAAC,UAAU,EAAE;YACnB,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,CAAC;SACxB;KACF;IAED,MAAM;QACJ,MAAM,kBAAkB,GAAG,IAAI,CAAC,sBAAsB;cAClD,mBAAmB;cACnB,mBAAmB,CAAC;QAExB,MAAM,cAAc,GAAG,UAAU,CAC/B,IAAI,CAAC,KAAK;cACN,IAAI,CAAC,YAAY;kBACf,oBAAoB;kBACpB,mBAAmB;cACrB,IAAI,CAAC,YAAY;kBACf,eAAe;kBACf,cAAc,EACpB,mBAAmB,CACpB,CAAC;QAEF,MAAM,qBAAqB,GAAG,iBAAiB,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;QAEnE,MAAM,gBAAgB,GAAG;YACvB,QAAQ,EAAE,qBAAqB,CAAC,mBAAmB,IAAI,MAAM;SAC9D,CAAC;QACF,QACE,4DACE,KAAK,EAAE,UAAU,CACf,kBAAkB,EAClB,IAAI,CAAC,aAAa,EAClB,wBAAwB,CACzB,IAEA,IAAI,CAAC,sBAAsB,IAC1B,EAAC,QAAQ,QACP,aACE,KAAK,EAAE,UAAU,CAAC,cAAc,EAAE,mBAAmB,CAAC,EACtD,EAAE,EAAC,sBAAsB,EACzB,QAAQ,EAAE,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,IAAI,CAAC,EAC3C,WAAW,EAAE,IAAI,CAAC,gBAAgB,EAClC,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,KAAK,EAAE,qBAAqB,GAC5B,EACF,iBACG;;+BAEgB,gBAAgB,CAAC,QAAQ;;eAEzC,CACK,EACP,IAAI,CAAC,iBAAiB,KACrB,iCACE,qBAAqB,EAAE,IAAI,CAAC,qBAAqB,EACjD,iBAAiB,EAAE,IAAI,CAAC,iBAAiB,EACzC,sBAAsB,EAAE,IAAI,CAAC,sBAAsB,GACnD,CACH,EACA,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,KACpB,sCACE,YAAY,EAAE,IAAI,CAAC,gBAAgB,EACnC,sBAAsB,EAAE,IAAI,CAAC,sBAAsB,GACnD,CACH,EACD,8BACE,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,sBAAsB,EAAE,IAAI,CAAC,sBAAsB,GACnD,CACO,KAEX,WAAK,KAAK,EAAC,cAAc,IACvB,8BACE,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,sBAAsB,EAAE,IAAI,CAAC,sBAAsB,GACnD,EACF,aACE,KAAK,EAAE,UAAU,CAAC,cAAc,EAAE,mBAAmB,CAAC,EACtD,EAAE,EAAC,sBAAsB,EACzB,QAAQ,EAAE,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,IAAI,CAAC,EAC3C,WAAW,EAAE,IAAI,CAAC,gBAAgB,EAClC,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,KAAK,EAAE,qBAAqB,GAC5B,EACF,iBACG;;+BAEgB,gBAAgB,CAAC,QAAQ;;eAEzC,CACK,EACP,IAAI,CAAC,iBAAiB,KACrB,iCACE,qBAAqB,EAAE,IAAI,CAAC,qBAAqB,EACjD,iBAAiB,EAAE,IAAI,CAAC,iBAAiB,EACzC,sBAAsB,EAAE,IAAI,CAAC,sBAAsB,GACnD,CACH,EACA,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,KACpB,sCACE,YAAY,EAAE,IAAI,CAAC,gBAAgB,EACnC,sBAAsB,EAAE,IAAI,CAAC,sBAAsB,GACnD,CACH,CACG,CACP,CACG,EACN;KACH;;;;AC9JH,MAAM,gCAAgC,GAAG,8oCAA8oC,CAAC;AACxrC,sCAAe,gCAAgC;;MCOlC,uBAAuB;;;;qCAED,EAAE;iCACP,cAAc;sCACT,KAAK;qBACrB,OAAO;;IAEhB,YAAY;QAClB,OAAO,IAAI,CAAC,KAAK,KAAK,OAAO,CAAC;KAC/B;IAED,MAAM;QACJ,OAAO,IAAI,CAAC,sBAAsB,IAChC,SACE,KAAK,EAAE,UAAU,CACf,IAAI,CAAC,KAAK;kBACN,IAAI,CAAC,YAAY;sBACf,2BAA2B;sBAC3B,0BAA0B;kBAC5B,IAAI,CAAC,YAAY;sBACf,sBAAsB;sBACtB,qBAAqB,EAC3B,IAAI,CAAC,qBAAqB,EAC1B,4BAA4B,CAC7B,IAEA,IAAI,CAAC,iBAAiB,CACrB,KAEJ,SACE,KAAK,EAAE,UAAU,CACf,IAAI,CAAC,KAAK;kBACN,IAAI,CAAC,YAAY;sBACf,2BAA2B;sBAC3B,0BAA0B;kBAC5B,IAAI,CAAC,YAAY;sBACf,sBAAsB;sBACtB,qBAAqB,EAC3B,IAAI,CAAC,qBAAqB,EAC1B,4BAA4B,CAC7B,IAEA,IAAI,CAAC,iBAAiB,CACrB,CACL,CAAC;KACH;;;;ACrDH,MAAM,6BAA6B,GAAG,2PAA2P,CAAC;AAClS,mCAAe,6BAA6B;;MCM/B,oBAAoB;;;;sCAEE,KAAK;qBACrB,OAAO;;IAEhB,YAAY;QAClB,OAAO,IAAI,CAAC,KAAK,KAAK,OAAO,CAAC;KAC/B;IAED,MAAM;QACJ,OAAO,IAAI,CAAC,KAAK,IACf,WACE,KAAK,EAAE,IAAI,CAAC,sBAAsB,GAAG,cAAc,GAAG,cAAc,IAEnE,IAAI,CAAC,YAAY,IAChB,mCAA6B,IAAI,EAAC,aAAa,GAAG,KAElD,mCAA6B,IAAI,EAAC,YAAY,GAAG,CAClD,CACG,KAEN,WACE,KAAK,EAAE,IAAI,CAAC,sBAAsB,GAAG,cAAc,GAAG,cAAc,IAEnE,IAAI,CAAC,YAAY,IAChB,mCAA6B,IAAI,EAAC,cAAc,GAAG,KAEnD,mCAA6B,IAAI,EAAC,aAAa,GAAG,CACnD,CACG,CACP,CAAC;KACH;;;;ACtCH,MAAM,8BAA8B,GAAG,4RAA4R,CAAC;AACpU,oCAAe,8BAA8B;;MCOhC,qBAAqB;;;mCACD,EAAE;;qBAEhB,OAAO;;IAEhB,YAAY;QAClB,OAAO,IAAI,CAAC,KAAK,KAAK,OAAO,CAAC;KAC/B;IAED,MAAM;;QAEJ,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE;YACf,OAAO,IAAI,CAAC;SACb;QAED,MAAM,UAAU,GAAG,IAAI,CAAC,YAAY,EAAE,GAAG,YAAY,GAAG,WAAW,CAAC;QAEpE,QACE,aACE,KAAK,EAAE,UAAU,CAAC,UAAU,EAAE,IAAI,CAAC,mBAAmB,CAAC,EACvD,OAAO,EAAC,sBAAsB,IAE7B,IAAI,CAAC,KAAK,CACL,EACR;KACH;;;;MC3BU,wBAAwB;;;oBAMjC,aAAa;;IAEf,MAAM;QACJ,QAAQ,IAAI,CAAC,IAAI;YACf,KAAK,cAAc;gBACjB,QACE,WACE,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B,qBAClB,mBAAmB,IAEnC,aAAO,EAAE,EAAC,mBAAmB,oCAAsC,EACnE,YACE,CAAC,EAAC,mNAAmN,EACrN,MAAM,EAAC,SAAS,kBACH,KAAK,oBACH,OAAO,qBACN,OAAO,GACvB,CACE,EACN;YACJ,KAAK,aAAa;gBAChB,QACE,WACE,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B,qBAClB,mBAAmB,IAEnC,aAAO,EAAE,EAAC,mBAAmB,mCAAqC,EAClE,YACE,CAAC,EAAC,mNAAmN,EACrN,MAAM,EAAC,SAAS,kBACH,KAAK,oBACH,OAAO,qBACN,OAAO,GACvB,CACE,EACN;YACJ,KAAK,aAAa;gBAChB,QACE,WACE,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B,qBAClB,mBAAmB,IAEnC,aAAO,EAAE,EAAC,mBAAmB,0CAErB,EACR,YACE,CAAC,EAAC,mNAAmN,EACrN,MAAM,EAAC,SAAS,kBACH,KAAK,oBACH,OAAO,qBACN,OAAO,GACvB,CACE,EACN;YACJ,KAAK,YAAY;gBACf,QACE,WACE,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B,qBAClB,mBAAmB,IAEnC,aAAO,EAAE,EAAC,mBAAmB,yCAErB,EACR,YACE,CAAC,EAAC,mNAAmN,EACrN,MAAM,EAAC,SAAS,kBACH,KAAK,oBACH,OAAO,qBACN,OAAO,GACvB,CACE,EACN;YACJ;gBACE,OAAO,IAAI,CAAC;SACf;KACF;;;ACvGH,MAAM,+BAA+B,GAAG,sqBAAsqB,CAAC;AAC/sB,qCAAe,+BAA+B;;MCMjC,sBAAsB;;;;IACjC,MAAM;QACJ,QACE,4DAAK,KAAK,EAAC,kBAAkB,IAC3B,4DAAK,KAAK,EAAC,aAAa,GAAG,CACvB,EACN;KACH;;;;ACdH,MAAM,gCAAgC,GAAG,8aAA8a,CAAC;AACxd,sCAAe,gCAAgC;;MCMlC,uBAAuB;;;;IAClC,MAAM;QACJ,QACE,4DAAK,KAAK,EAAC,kBAAkB,IAC3B,4DAAK,KAAK,EAAC,cAAc,GAAG,CACxB,EACN;KACH;;;;;;","names":["SearchcraftCore"],"sources":["src/components/searchcraft-auto-search-form/searchcraft-auto-search-form.module.scss?tag=searchcraft-auto-search-form&encapsulation=shadow","src/components/searchcraft-auto-search-form/searchcraft-auto-search-form.tsx","src/components/searchcraft-base-search-result/searchcraft-base-search-result.module.scss?tag=searchcraft-base-search-result&encapsulation=shadow","src/components/searchcraft-base-search-result/searchcraft-base-search-result.tsx","src/components/searchcraft-base-search-results/searchcraft-base-search-results.module.scss?tag=searchcraft-base-search-results&encapsulation=shadow","src/components/searchcraft-base-search-results/searchcraft-base-search-results.tsx","src/assets/searchcraft-clear-icon-set.tsx","src/components/searchcraft-clear-input-button/searchcraft-clear-input-button.module.scss?tag=searchcraft-clear-input-button&encapsulation=shadow","src/components/searchcraft-clear-input-button/searchcraft-clear-input-button.tsx","src/components/searchcraft-error-message/searchcraft-error-message.module.scss?tag=searchcraft-error-message&encapsulation=shadow","src/components/searchcraft-error-message/searchcraft-error-message.tsx","src/components/searchcraft-input/searchcraft-input.module.scss?tag=searchcraft-input&encapsulation=shadow","src/components/searchcraft-input/searchcraft-input.tsx","src/components/searchcraft-input-caption/searchcraft-input-caption.module.scss?tag=searchcraft-input-caption&encapsulation=shadow","src/components/searchcraft-input-caption/searchcraft-input-caption.tsx","src/components/searchcraft-input-icon/searchcraft-input-icon.module.scss?tag=searchcraft-input-icon&encapsulation=shadow","src/components/searchcraft-input-icon/searchcraft-input-icon.tsx","src/components/searchcraft-input-label/searchcraft-input-label.module.scss?tag=searchcraft-input-label&encapsulation=shadow","src/components/searchcraft-input-label/searchcraft-input-label.tsx","src/assets/searchcraft-search-icon-set.tsx","src/components/searchcraft-spinner-dark/searchcraft-spinner-dark.module.scss?tag=searchcraft-spinner-dark&encapsulation=shadow","src/components/searchcraft-spinner-dark/searchcraft-spinner-dark.tsx","src/components/searchcraft-spinner-light/searchcraft-spinner-light.module.scss?tag=searchcraft-spinner-light&encapsulation=shadow","src/components/searchcraft-spinner-light/searchcraft-spinner-light.tsx"],"sourcesContent":[":root {\n --font-stack: Helvetica, Arial, sans-serif;\n}\n\n.formLTR {\n text-align: left;\n width: 100%;\n}\n\n.formRTL {\n text-align: right;\n width: 100%;\n}\n\n.searchContainer {\n align-items: center;\n display: flex;\n width: 100%;\n}","import {\n Component,\n Prop,\n State,\n Event,\n type EventEmitter,\n h,\n} from '@stencil/core';\nimport {\n type CoreConfigSDK,\n CoreSDK as SearchcraftCore,\n} from '@searchcraft/core';\n\nimport type { ScInputCustomEvent } from '@components/searchcraft-input/searchcraft-input';\nimport { parseCustomStyles } from '@utils/utils';\nimport { useSearchcraftStore } from '@provider/store';\n\n@Component({\n tag: 'searchcraft-auto-search-form',\n styleUrl: 'searchcraft-auto-search-form.module.scss',\n shadow: true,\n})\nexport class SearchcraftAutoSearchForm {\n @Prop() autoSearchFormClass = '';\n @Prop() clearInput: () => void = () => {};\n @Prop() config: CoreConfigSDK = {\n apiKey: '',\n endpointURL: '',\n index: [],\n };\n @Prop() customStylesForInput: string | Record<string, string> = {};\n @Prop() inputCaptionValue = '';\n @Prop() labelForInput = '';\n @Prop() placeholderValue = 'Search here';\n @Prop() rightToLeftOrientation = false;\n @Prop() searchContainerClass = '';\n\n @Event() querySubmit: EventEmitter<string>;\n\n @State() error = false;\n @State() query = '';\n @State() searchResults = '';\n\n private debounceTimeout: ReturnType<typeof setTimeout> | null = null;\n private debounceDelay = 300; // 300ms debounce delay\n private searchStore = useSearchcraftStore.getState();\n\n componentDidLoad() {\n const searchcraft = new SearchcraftCore(this.config);\n this.searchStore.initialize(searchcraft, true);\n console.log('Component initialized');\n }\n\n handleInputChange = (event: ScInputCustomEvent<string>) => {\n this.query = event.detail;\n this.querySubmit.emit(this.query);\n\n // Clear the previous debounce timeout\n if (this.debounceTimeout) {\n clearTimeout(this.debounceTimeout);\n }\n\n // Set a new debounce timeout\n this.debounceTimeout = setTimeout(() => {\n console.log('Debounced search triggered');\n this.runSearch();\n }, this.debounceDelay);\n };\n\n handleClearInput = () => {\n this.query = '';\n console.log('Input cleared');\n\n if (typeof this.clearInput === 'function') {\n this.clearInput();\n }\n\n if (this.debounceTimeout) {\n clearTimeout(this.debounceTimeout);\n }\n\n this.error = false;\n this.searchResults = '';\n };\n\n private runSearch = async () => {\n if (this.query.trim() === '') {\n this.error = true;\n this.searchResults = '';\n } else {\n this.error = false;\n this.searchStore.setQuery(this.query);\n\n try {\n await this.searchStore.search();\n this.searchResults = JSON.stringify(this.searchStore.searchResults);\n } catch (error) {\n this.error = true;\n }\n }\n };\n\n handleFormSubmit = async (event: Event) => {\n event.preventDefault();\n await this.runSearch();\n };\n\n render() {\n const formClass = this.rightToLeftOrientation ? 'formRTL' : 'formLTR';\n const parsedCustomStyles = parseCustomStyles(this.customStylesForInput);\n return (\n <form class={`${formClass}`} onSubmit={this.handleFormSubmit}>\n <searchcraft-input-label label={this.labelForInput} />\n <div class='searchContainer'>\n <searchcraft-input\n customStyles={parsedCustomStyles}\n input-caption-value={this.inputCaptionValue}\n onClearInput={this.handleClearInput}\n onSearchInputChange={this.handleInputChange}\n placeholder-value={this.placeholderValue}\n query={this.query}\n right-to-left-orientation={this.rightToLeftOrientation}\n />\n </div>\n {this.error && (\n <searchcraft-error-message errorMessage='Please enter a search query.' />\n )}\n </form>\n );\n }\n}\n","@import '../../utils/theme';\n\n:root {\n --font-stack: Helvetica, Arial, sans-serif;\n}\n\n@mixin interactive-result-container-base {\n align-items: flex-start;\n border-radius: 16px;\n display: flex;\n position: relative;\n flex-direction: column;\n gap: 16px;\n padding: 8px;\n\n @media (min-width: 600px) {\n flex-direction: row;\n }\n}\n\n.interactiveResultContainerLight {\n background-color: $light-search-result-container-background;\n @include interactive-result-container-base;\n}\n\n.interactiveResultContainerDark {\n background-color: $dark-search-result-container-background;\n @include interactive-result-container-base;\n}\n\n.resultContainer {\n align-items: flex-start;\n display: flex;\n flex-direction: column;\n gap: 16px;\n\n @media (min-width: 600px) {\n flex-direction: row;\n }\n}\n\n.interactiveIconLarge {\n display: inline-block;\n position: absolute;\n right: 5px;\n top: 8px;\n\n\n @media (max-width: 600px) {\n display: none;\n }\n}\n\n.interactiveIconSmall {\n position: absolute;\n right: 5px;\n top: -2px;\n display: inline-block;\n\n\n @media (min-width: 600px) {\n display: none;\n }\n}\n\n.imageContainer {\n max-height: 540px;\n max-width: 100%;\n\n @media (min-width: 600px) {\n max-height: 100%;\n max-width: 50%;\n }\n}\n\n.contentContainer {\n max-height: 100%;\n max-width: 100%;\n\n @media (min-width: 600px) {\n max-width: 50%;\n }\n}\n\n@mixin image-base {\n aspect-ratio: 2 / 1;\n border-radius: 8px;\n max-height: 100%;\n max-width: 100%;\n}\n\n.imageLight {\n @include image-base;\n border: 1px solid $light-search-result-image-border;\n}\n\n.imageDark {\n @include image-base;\n border: 1px solid $dark-search-result-image-border;\n}\n\n@mixin heading-base {\n font-family: var(--font-stack);\n font-size: 16px;\n font-weight: 700;\n line-height: 20px;\n margin-bottom: 4px;\n margin-top: 0px;\n position: relative;\n}\n\n.headingLight {\n @include heading-base;\n color: $light-search-result-heading-color;\n}\n\n.headingDark {\n @include heading-base;\n color: $dark-search-result-heading-color;\n}\n\n@mixin subheading-base {\n font-family: var(--font-stack);\n font-size: 12px;\n font-weight: 400;\n line-height: 16px;\n margin-bottom: 4px;\n margin-top: 0px;\n}\n\n.subheadingLight {\n @include subheading-base;\n color: $light-search-result-subheading-color;\n}\n\n.subheadingDark {\n @include subheading-base;\n color: $dark-search-result-subheading-color\n}\n\n@mixin body-content-base {\n font-family: var(--font-stack);\n font-size: 16px;\n font-weight: 400;\n line-height: 20px;\n margin-bottom: 4px;\n margin-top: 0px;\n}\n\n.primaryContentLight {\n @include body-content-base;\n color: $light-search-result-body-content-color;\n}\n\n.primaryContentDark {\n @include body-content-base;\n color: $dark-search-result-body-content-color;\n}\n\n.secondaryContentLight {\n @include body-content-base;\n color: $light-search-result-body-content-color;\n}\n\n.secondaryContentDark {\n @include body-content-base;\n color: $dark-search-result-body-content-color;\n}\n\n.tertiaryContentLight {\n @include body-content-base;\n color: $light-search-result-body-content-color;\n}\n\n.tertiaryContentDark {\n @include body-content-base;\n color: $dark-search-result-body-content-color;\n}","import { Component, Event, h, Prop } from '@stencil/core';\n\n@Component({\n tag: 'searchcraft-base-search-result',\n styleUrl: 'searchcraft-base-search-result.module.scss',\n shadow: true,\n})\nexport class SearchcraftBaseSearchResult {\n @Prop() buttonText = ''; // Label for the button\n @Prop() imageDescription = ''; // Alternative text for the image\n @Prop() imageSource = ''; // Source URL for the image\n @Prop() isInteractive = false; // Determines if the result is interactive\n @Prop() primaryContent = ''; // Primary body content\n @Prop() secondaryContent = ''; // Secondary body content\n @Prop() tertiaryContent = ''; // Tertiary body content\n @Prop() headingText = ''; // Text for the heading\n @Prop() subheadingText = ''; // Text for the subheading\n @Prop() themeMode: 'light' | 'dark' = 'light'; // Light or dark theme context\n @Prop() customStyles: Record<string, string> = {}; // Custom styles passed from parent\n\n @Event() buttonCallback: () => void = () => {}; // Callback for button click\n @Event() keyDownCallback: () => void = () => {}; // Callback for key down event\n @Event() resultCallback: () => void = () => {}; // Callback for result container click\n\n private handleButtonClick = () => {\n this.buttonCallback();\n };\n\n private handleContainerClick = () => {\n if (this.isInteractive) {\n this.resultCallback();\n }\n };\n\n render() {\n const isLightTheme = this.themeMode === 'light';\n const containerStyle = { ...this.customStyles };\n return (\n <div\n class={\n this.isInteractive\n ? isLightTheme\n ? 'interactiveResultContainerLight'\n : 'interactiveResultContainerDark'\n : 'resultContainer'\n }\n id='searchcraft-item'\n onClick={this.handleContainerClick}\n onKeyDown={this.keyDownCallback}\n style={containerStyle}\n tabindex='0'\n >\n {this.isInteractive && (\n <div class='interactiveIconLarge'>\n {isLightTheme ? (\n <searchcraft-clear-icon-set type='arrow-light' />\n ) : (\n <searchcraft-clear-icon-set type='arrow-dark' />\n )}\n </div>\n )}\n <div class='imageContainer'>\n <img\n alt={this.imageDescription}\n class={isLightTheme ? 'imageLight' : 'imageDark'}\n src={this.imageSource}\n />\n </div>\n <div class='contentContainer'>\n <h2 class={isLightTheme ? 'headingLight' : 'headingDark'}>\n {this.headingText}\n {this.isInteractive && (\n <div class='interactiveIconSmall'>\n {isLightTheme ? (\n <searchcraft-clear-icon-set type='arrow-light' />\n ) : (\n <searchcraft-clear-icon-set type='arrow-dark' />\n )}\n </div>\n )}\n </h2>\n <h3 class={isLightTheme ? 'subheadingLight' : 'subheadingDark'}>\n {this.subheadingText}\n </h3>\n <p\n class={isLightTheme ? 'primaryContentLight' : 'primaryContentDark'}\n >\n {this.primaryContent}\n </p>\n <p\n class={\n isLightTheme ? 'secondaryContentLight' : 'secondaryContentDark'\n }\n >\n {this.secondaryContent}\n </p>\n <p\n class={\n isLightTheme ? 'tertiaryContentLight' : 'tertiaryContentDark'\n }\n >\n {this.tertiaryContent}\n </p>\n {this.buttonText && (\n <button onClick={this.handleButtonClick} type='button'>\n {this.buttonText}\n </button>\n )}\n </div>\n </div>\n );\n }\n}\n",":root {\n --font-stack: Helvetica, Arial, sans-serif;\n}\n\n.resultsContainer {\n display: flex;\n flex-direction: column;\n justify-content: center;\n margin: 100px 20px;\n\n & > p {\n align-self: center;\n }\n\n & > div {\n margin-bottom: 20px;\n img {\n height: 300px;\n width: 200px;\n }\n }\n}\n","import { Component, h, Prop, State, Element } from '@stencil/core';\nimport type { SearchcraftResponse } from '@searchcraft/core';\n\nimport { useSearchcraftStore } from '@provider/store';\nimport {\n extractDynamicProperties,\n parseCustomStyles,\n parseSearchKeys,\n} from '@utils/utils';\n\n@Component({\n tag: 'searchcraft-base-search-results',\n styleUrl: 'searchcraft-base-search-results.module.scss',\n shadow: true,\n})\nexport class SearchcraftBaseSearchResults {\n @State() query = '';\n @State() searchResults: SearchcraftResponse | null = null;\n\n /**\n * Array of keys to dynamically extract properties from each document.\n * Must be explicitly set by the parent component.\n */\n @Prop() searchKeys = '';\n\n /**\n * Custom styles to apply to search results.\n * Expected format: JSON string, e.g., '{\"borderRadius\": \"10px\", \"padding\": \"16px\"}'\n */\n @Prop() customStylesForResults: string | Record<string, string> = {};\n\n @Element() hostElement: HTMLElement; // Reference to the host element\n\n private unsubscribe: () => void;\n\n componentDidLoad() {\n // Initialize searchKeys if not provided\n if (!this.searchKeys || this.searchKeys.length === 0) {\n console.warn('No searchKeys provided; using empty keys array.');\n this.searchKeys = ''; // Ensure it's explicitly set as an empty array\n }\n\n // Subscribe to state changes\n this.unsubscribe = useSearchcraftStore.subscribe((state) => {\n this.searchResults = { ...state.searchResults };\n this.query = state.query;\n });\n\n // Fetch initial state\n const { searchResults, query } = useSearchcraftStore.getState();\n this.searchResults = searchResults;\n this.query = query;\n }\n\n disconnectedCallback() {\n if (this.unsubscribe) {\n this.unsubscribe();\n }\n }\n\n render() {\n if (!this.searchResults?.data) {\n console.warn('No search results data available');\n return <div>No results to display.</div>;\n }\n\n const parsedSearchKeys = parseSearchKeys(this.searchKeys);\n const parsedCustomStyles = parseCustomStyles(this.customStylesForResults);\n return (\n <div class='resultsContainer'>\n {this.searchResults?.data?.hits?.map((document, index) => {\n const { doc: result } = document;\n const dynamicProperties = extractDynamicProperties(\n result,\n parsedSearchKeys,\n );\n\n // Render the custom element if present, otherwise fallback to default\n const customElement = this.hostElement.querySelector(\n '[slot=\"result-template\"]',\n );\n if (customElement) {\n // Clone the custom element and pass data to it\n const customElementClone = customElement.cloneNode(\n true,\n ) as HTMLElement;\n customElementClone.removeAttribute('slot'); // Remove the slot attribute\n customElementClone.setAttribute(\n 'data-result',\n JSON.stringify(result),\n );\n return (\n <div key={`${dynamicProperties.id}-${index}`}>\n {customElementClone.outerHTML}\n </div>\n );\n }\n // Fallback to the default element\n return (\n <searchcraft-base-search-result\n key={`${dynamicProperties.id}-${index}`}\n button-callback={() => console.log('button callback')}\n result-callback={() => console.log('interactive element')}\n keydown-callback={() => console.log('keydown')}\n is-interactive={true}\n heading-text={dynamicProperties[parsedSearchKeys[0]]}\n subheading-text={dynamicProperties[parsedSearchKeys[1]]}\n primary-content={dynamicProperties[parsedSearchKeys[2]]}\n secondary-content={dynamicProperties[parsedSearchKeys[3]]}\n tertiary-content={dynamicProperties[parsedSearchKeys[4]]}\n image-source={\n dynamicProperties[parsedSearchKeys[parsedSearchKeys.length - 1]]\n }\n customStyles={parsedCustomStyles}\n />\n );\n })}\n\n {this.query.length > 0 &&\n this.searchResults?.data?.hits?.length === 0 && (\n <searchcraft-error-message\n error-message={`No search results found for \"${this.query}\" query`}\n />\n )}\n\n {/* Slot for custom element */}\n <slot name='result-template' />\n </div>\n );\n }\n}\n","import { Component, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'searchcraft-clear-icon-set',\n shadow: true,\n})\nexport class SearchcraftClearIconSet {\n /**\n * Type of the icon to display.\n * Options: 'clear-light', 'clear-dark', 'arrow-light', 'arrow-dark'\n */\n @Prop() type: 'clear-light' | 'clear-dark' | 'arrow-light' | 'arrow-dark' =\n 'clear-light';\n\n render() {\n switch (this.type) {\n case 'clear-light':\n return (\n <svg\n width='22'\n height='22'\n viewBox='0 0 22 22'\n fill='none'\n xmlns='http://www.w3.org/2000/svg'\n aria-labelledby='icon-title'\n >\n <title id='icon-title'>Searchcraft Clear Input Icon Light</title>\n <path\n d='M14 8L8 14M8 8L14 14M21 11C21 16.5228 16.5228 21 11 21C5.47715 21 1 16.5228 1 11C1 5.47715 5.47715 1 11 1C16.5228 1 21 5.47715 21 11Z'\n stroke='black'\n stroke-width='1.5'\n stroke-linecap='round'\n stroke-linejoin='round'\n />\n </svg>\n );\n case 'clear-dark':\n return (\n <svg\n width='22'\n height='22'\n viewBox='0 0 22 22'\n fill='none'\n xmlns='http://www.w3.org/2000/svg'\n aria-labelledby='icon-title'\n >\n <title id='icon-title'>Searchcraft Clear Input Icon Dark</title>\n <path\n d='M14 8L8 14M8 8L14 14M21 11C21 16.5228 16.5228 21 11 21C5.47715 21 1 16.5228 1 11C1 5.47715 5.47715 1 11 1C16.5228 1 21 5.47715 21 11Z'\n stroke='white'\n stroke-width='1.5'\n stroke-linecap='round'\n stroke-linejoin='round'\n />\n </svg>\n );\n case 'arrow-light':\n return (\n <svg\n width='20'\n height='21'\n viewBox='0 0 20 21'\n fill='none'\n xmlns='http://www.w3.org/2000/svg'\n aria-labelledby='icon-title'\n >\n <title id='icon-title'>Searchcraft Arrow Right Icon Light</title>\n <path\n d='M7.5 15.0444L12.5 10.0444L7.5 5.04443'\n stroke='#737373'\n stroke-width='1.5'\n stroke-linecap='round'\n stroke-linejoin='round'\n />\n </svg>\n );\n case 'arrow-dark':\n return (\n <svg\n width='8'\n height='12'\n viewBox='0 0 8 12'\n fill='none'\n xmlns='http://www.w3.org/2000/svg'\n aria-labelledby='icon-title'\n >\n <title id='icon-title'>Searchcraft Arrow Right Icon Dark</title>\n <path\n d='M1.5 11L6.5 6L1.5 1'\n stroke='#BFBFBF'\n stroke-width='1.5'\n stroke-linecap='round'\n stroke-linejoin='round'\n />\n </svg>\n );\n\n default:\n return null;\n }\n }\n}\n",":root {\n --font-stack: Helvetica, Arial, sans-serif;\n}\n\n.inputClearButtonLTR {\n align-items: center;\n background: none;\n border: none;\n display: flex;\n height: 20px;\n justify-content: center;\n padding: 0;\n position: absolute;\n right: 25px;\n top: 50%;\n transform: translateY(-50%);\n width: 20px;\n}\n\n.inputClearButtonRTL {\n align-items: center;\n background: none;\n border: none;\n display: flex;\n height: 20px;\n justify-content: center;\n left: 25px;\n padding: 0;\n position: absolute;\n top: 50%;\n transform: translateY(-50%);\n width: 20px;\n}","import {\n Component,\n Event,\n type EventEmitter,\n Prop,\n h,\n State,\n} from '@stencil/core';\nimport classNames from 'classnames';\n\n@Component({\n tag: 'searchcraft-clear-input-button',\n styleUrl: 'searchcraft-clear-input-button.module.scss',\n shadow: true,\n})\nexport class SearchcraftClearInputButton {\n @Prop() isRequesting? = false;\n @Prop() rightToLeftOrientation = false;\n\n // Updated `clearInput` to an EventEmitter\n @Event() clearInput: EventEmitter<void>;\n\n @State() theme = 'light';\n\n private isLightTheme() {\n return this.theme === 'light';\n }\n\n // Added a click handler to emit the event\n private handleClearClick = (event: MouseEvent) => {\n event.preventDefault(); // Prevent default if necessary\n this.clearInput.emit(); // Emit the event\n };\n\n render() {\n return this.rightToLeftOrientation ? (\n <button\n class={classNames('inputClearButtonRTL', '.sc-clear-input-button-rtl')}\n onClick={this.handleClearClick}\n type='button'\n >\n {this.isRequesting ? (\n this.isLightTheme ? (\n <searchcraft-spinner-light />\n ) : (\n <searchcraft-spinner-dark />\n )\n ) : this.isLightTheme ? (\n <searchcraft-clear-icon-set type='clear-light' />\n ) : (\n <searchcraft-clear-icon-set type='clear-dark' />\n )}\n </button>\n ) : (\n <button\n class={classNames('inputClearButtonLTR', '.sc-clear-input-button-ltr')}\n onClick={this.handleClearClick}\n type='button'\n >\n {this.isRequesting ? (\n this.isLightTheme ? (\n <searchcraft-spinner-light />\n ) : (\n <searchcraft-spinner-dark />\n )\n ) : this.isLightTheme ? (\n <searchcraft-clear-icon-set type='clear-light' />\n ) : (\n <searchcraft-clear-icon-set type='clear-dark' />\n )}\n </button>\n );\n }\n}\n","@import '../../utils/theme';\n\n:root {\n --font-stack: Helvetica, Arial, sans-serif;\n}\n\n@mixin error-message-base {\n font-family: var(--font-stack);\n font-size: 12px;\n font-weight: 400;\n line-height: 16px;\n margin-top: 4px;\n}\n\n.errorMessageLight {\n @include error-message-base;\n color: $light-input-caption-color-error;\n}\n\n.errorMessageDark {\n @include error-message-base;\n color: $dark-input-caption-color-error;\n}","import { Component, Prop, h } from '@stencil/core';\nimport classNames from 'classnames';\n\n@Component({\n tag: 'searchcraft-error-message',\n styleUrl: 'searchcraft-error-message.module.scss',\n shadow: true,\n})\nexport class SearchcraftErrorMessage {\n /**\n * The error message to display. Defaults to a standard message if not provided.\n */\n @Prop() errorMessage?: string;\n\n /**\n * The theme, which determines the style (light or dark).\n */\n @Prop() theme: 'light' | 'dark' = 'light';\n\n render() {\n const errorMessageStyle =\n this.theme === 'light' ? 'errorMessageLight' : 'errorMessageDark';\n\n return (\n <p class={classNames(errorMessageStyle)}>\n {this.errorMessage || 'Search term is required.'}\n </p>\n );\n }\n}\n","@import '../../utils/theme';\n\n:root {\n --font-stack: Helvetica, Arial, sans-serif;\n}\n\n@mixin input-container-base {\n position: relative;\n width: 100%;\n}\n\n@mixin input-base {\n border: none;\n border-radius: 8px;\n font-family: var(--font-stack);\n outline: none;\n padding-bottom: 15px;\n padding-top: 15px;\n width: 100%;\n\n &::placeholder {\n font-family: var(--font-stack);\n font-size: 16px;\n }\n}\n\n@mixin input-base-light {\n @include input-base;\n background-color: $light-input-background-color;\n color: $light-input-label-color;\n\n &::placeholder {\n color: $light-input-placeholder-color;\n }\n\n &:focus {\n outline: 2px solid $light-input-outline-focus;\n }\n}\n\n@mixin input-base-dark {\n @include input-base;\n background-color: $dark-input-background-color;\n color: $dark-input-label-color;\n\n &::placeholder {\n color: $dark-input-placeholder-color;\n }\n\n &:focus {\n outline: 2px solid $dark-input-outline-focus;\n }\n}\n\n@mixin input-error-base-light {\n @include input-base-light;\n outline: 2px solid $light-input-error-outline;\n\n &:focus-visible {\n outline: 2px solid $light-input-error-outline,\n }\n}\n\n@mixin input-error-base-dark {\n @include input-base-dark;\n outline: 2px solid $dark-input-error-outline;\n\n &:focus-visible {\n outline: 2px solid $dark-input-error-outline;\n }\n}\n\n.inputContainerLTR {\n @include input-container-base;\n}\n\n.inputContainerRTL {\n @include input-container-base;\n margin-left: 8px;\n}\n\n@mixin align-LTR {\n margin-right: 8px;\n padding-left: 36px;\n padding-right: 16px;\n}\n\n.inputLightLTR {\n @include input-base-light;\n @include align-LTR;\n}\n\n.inputDarkLTR {\n @include input-base-dark;\n @include align-LTR;\n}\n\n.inputErrorLightLTR {\n @include input-error-base-light;\n @include align-LTR;\n}\n\n.inputErrorDarkLTR {\n @include input-error-base-dark;\n @include align-LTR;\n}\n\n@mixin align-RTL {\n margin-left: 8px;\n padding-left: 16px;\n padding-right: 36px;\n text-align: right;\n}\n\n.inputLightRTL {\n @include input-base-light;\n @include align-RTL;\n}\n\n.inputDarkRTL {\n @include input-base-dark;\n @include align-RTL;\n}\n\n.inputErrorLightRTL {\n @include input-error-base-light;\n @include align-RTL;\n}\n\n.inputErrorDarkRTL {\n @include input-error-base-dark;\n @include align-RTL;\n}\n\n.inputWrapper {\n align-items: center;\n display: flex;\n position: relative;\n width: 100%;\n}\n","import {\n Component,\n h,\n Prop,\n State,\n Event,\n Fragment,\n type EventEmitter,\n} from '@stencil/core';\nimport classNames from 'classnames';\n\nimport { parseCustomStyles } from '@utils/utils';\n\nexport interface ScInputCustomEvent<T> extends CustomEvent<T> {\n detail: T;\n target: HTMLSearchcraftInputElement;\n}\n\n@Component({\n tag: 'searchcraft-input',\n styleUrl: 'searchcraft-input.module.scss',\n shadow: true,\n})\nexport class SearchcraftInput {\n @Prop() customStyles: string | Record<string, string> = {};\n @Prop() error = false;\n @Prop() formClassName = '';\n @Prop() inputCaptionClassName = '';\n @Prop() inputCaptionValue = '';\n @Prop() inputClassName = '';\n @Prop() placeholderValue = 'Enter Search';\n @Prop() rightToLeftOrientation = false;\n @Prop() query = '';\n\n @Event() clearInput: EventEmitter<void>;\n @Event() searchInputChange: EventEmitter<string>;\n\n @State() theme = 'light';\n\n private get isLightTheme() {\n return this.theme === 'light';\n }\n\n handleInputChange(event: Event) {\n const input = event.target as HTMLInputElement;\n this.searchInputChange.emit(input.value);\n }\n\n handleClearInput() {\n if (this.clearInput) {\n this.clearInput.emit();\n }\n }\n\n render() {\n const containerClassName = this.rightToLeftOrientation\n ? 'inputContainerRTL'\n : 'inputContainerLTR';\n\n const inputClassName = classNames(\n this.error\n ? this.isLightTheme\n ? 'inputErrorLightRTL'\n : 'inputErrorDarkRTL'\n : this.isLightTheme\n ? 'inputLightLTR'\n : 'inputDarkLTR',\n 'searchcraft-input',\n );\n\n const validatedCustomStyles = parseCustomStyles(this.customStyles);\n\n const placeholderStyle = {\n fontSize: validatedCustomStyles.placeholderFontSize || '16px',\n };\n return (\n <div\n class={classNames(\n containerClassName,\n this.formClassName,\n 'searchcraft-input-form',\n )}\n >\n {this.rightToLeftOrientation ? (\n <Fragment>\n <input\n class={classNames(inputClassName, 'searchcraft-input')}\n id='searchcraft-input-id'\n onChange={this.handleInputChange.bind(this)}\n placeholder={this.placeholderValue}\n type='text'\n value={this.query}\n style={validatedCustomStyles}\n />\n <style>\n {`\n #searchcraft-input-id::placeholder {\n font-size: ${placeholderStyle.fontSize};\n }\n `}\n </style>\n {this.inputCaptionValue && (\n <searchcraft-input-caption\n inputCaptionClassName={this.inputCaptionClassName}\n inputCaptionValue={this.inputCaptionValue}\n rightToLeftOrientation={this.rightToLeftOrientation}\n />\n )}\n {this.query.length > 0 && (\n <searchcraft-clear-input-button\n onClearInput={this.handleClearInput}\n rightToLeftOrientation={this.rightToLeftOrientation}\n />\n )}\n <searchcraft-input-icon\n error={this.error}\n rightToLeftOrientation={this.rightToLeftOrientation}\n />\n </Fragment>\n ) : (\n <div class='inputWrapper'>\n <searchcraft-input-icon\n error={this.error}\n rightToLeftOrientation={this.rightToLeftOrientation}\n />\n <input\n class={classNames(inputClassName, 'searchcraft-input')}\n id='searchcraft-input-id'\n onChange={this.handleInputChange.bind(this)}\n placeholder={this.placeholderValue}\n type='text'\n value={this.query}\n style={validatedCustomStyles}\n />\n <style>\n {`\n #searchcraft-input-id::placeholder {\n font-size: ${placeholderStyle.fontSize};\n }\n `}\n </style>\n {this.inputCaptionValue && (\n <searchcraft-input-caption\n inputCaptionClassName={this.inputCaptionClassName}\n inputCaptionValue={this.inputCaptionValue}\n rightToLeftOrientation={this.rightToLeftOrientation}\n />\n )}\n {this.query.length > 0 && (\n <searchcraft-clear-input-button\n onClearInput={this.handleClearInput}\n rightToLeftOrientation={this.rightToLeftOrientation}\n />\n )}\n </div>\n )}\n </div>\n );\n }\n}\n","@import '../../utils/theme';\n\n:root {\n --font-stack: Helvetica, Arial, sans-serif;\n}\n\n@mixin input-caption-base {\n font-family: var(--font-stack);\n font-size: 12px;\n font-weight: 400;\n line-height: 16px;\n margin-top: 4px;\n}\n\n@mixin input-caption-base-light {\n @include input-caption-base;\n color: $light-input-caption-color;\n}\n\n@mixin input-caption-base-dark {\n @include input-caption-base;\n color: $dark-input-caption-color;\n}\n\n.inputCaptionLightLTR {\n @include input-caption-base-light;\n}\n\n.inputCaptionDarkLTR {\n @include input-caption-base-dark;\n}\n\n.inputCaptionErrorLightLTR {\n @include input-caption-base;\n color: $light-input-caption-color-error;\n}\n\n.inputCaptionErrorDarkLTR {\n @include input-caption-base;\n color: $dark-input-caption-color-error;\n}\n\n.inputCaptionLightRTL {\n @include input-caption-base-light;\n text-align: right;\n}\n\n.inputCaptionDarkRTL {\n @include input-caption-base-dark;\n text-align: right;\n}\n\n.inputCaptionErrorLightRTL {\n @include input-caption-base;\n color: $light-input-caption-color-error;\n text-align: right;\n}\n\n.inputCaptionErrorDarkRTL {\n @include input-caption-base;\n color: $dark-input-caption-color-error;\n text-align: right;\n}","import { Component, Prop, h, State } from '@stencil/core';\nimport classNames from 'classnames';\n\n@Component({\n tag: 'searchcraft-input-caption',\n styleUrl: 'searchcraft-input-caption.module.scss',\n shadow: true,\n})\nexport class SearchcraftInputCaption {\n @Prop() error?: boolean;\n @Prop() inputCaptionClassName? = '';\n @Prop() inputCaptionValue = 'Enter Search';\n @Prop() rightToLeftOrientation = false;\n @State() theme = 'light';\n\n private isLightTheme() {\n return this.theme === 'light';\n }\n\n render() {\n return this.rightToLeftOrientation ? (\n <p\n class={classNames(\n this.error\n ? this.isLightTheme\n ? 'inputCaptionErrorLightRTL'\n : 'inputCaptionErrorDarkRTL'\n : this.isLightTheme\n ? 'inputCaptionLightRTL'\n : 'inputCaptionDarkRTL',\n this.inputCaptionClassName,\n '.searchcraft-input-caption',\n )}\n >\n {this.inputCaptionValue}\n </p>\n ) : (\n <p\n class={classNames(\n this.error\n ? this.isLightTheme\n ? 'inputCaptionErrorLightLTR'\n : 'inputCaptionErrorDarkLTR'\n : this.isLightTheme\n ? 'inputCaptionLightLTR'\n : 'inputCaptionDarkLTR',\n this.inputCaptionClassName,\n '.searchcraft-input-caption',\n )}\n >\n {this.inputCaptionValue}\n </p>\n );\n }\n}\n",":root {\n --font-stack: Helvetica, Arial, sans-serif;\n}\n\n.inputIconLTR {\n height: 20px;\n left: 15px;\n position: absolute;\n top: 50%;\n transform: translateY(-50%);\n width: 20px;\n}\n\n.inputIconRTL {\n height: 20px;\n position: absolute;\n right: 15px;\n top: 50%;\n transform: translateY(-50%);\n width: 20px;\n}","import { Component, Prop, h, State } from '@stencil/core';\n\n@Component({\n tag: 'searchcraft-input-icon',\n styleUrl: 'searchcraft-input-icon.module.scss',\n shadow: true,\n})\nexport class SearchcraftInputIcon {\n @Prop() error?: boolean;\n @Prop() rightToLeftOrientation = false;\n @State() theme = 'light';\n\n private isLightTheme() {\n return this.theme === 'light';\n }\n\n render() {\n return this.error ? (\n <div\n class={this.rightToLeftOrientation ? 'inputIconRTL' : 'inputIconLTR'}\n >\n {this.isLightTheme ? (\n <searchcraft-search-icon-set type='error-light' />\n ) : (\n <searchcraft-search-icon-set type='error-dark' />\n )}\n </div>\n ) : (\n <div\n class={this.rightToLeftOrientation ? 'inputIconRTL' : 'inputIconLTR'}\n >\n {this.isLightTheme ? (\n <searchcraft-search-icon-set type='search-light' />\n ) : (\n <searchcraft-search-icon-set type='search-dark' />\n )}\n </div>\n );\n }\n}\n","@import '../../utils/theme';\n\n:root {\n --font-stack: Helvetica, Arial, sans-serif;\n}\n\n@mixin input-label-base {\n font-family: var(--font-stack);\n font-size: 12px;\n font-weight: 400;\n line-height: 16px;\n margin-top: 4px;\n}\n\n.labelLight {\n @include input-label-base;\n color: $light-input-label-color;\n}\n\n.labelDark {\n @include input-label-base;\n color: $dark-input-label-color;\n}","import { Component, Prop, h, State } from '@stencil/core';\nimport classNames from 'classnames';\n\n@Component({\n tag: 'searchcraft-input-label',\n styleUrl: 'searchcraft-input-label.module.scss',\n shadow: true,\n})\nexport class SearchcraftInputLabel {\n @Prop() inputLabelClassName? = '';\n @Prop() label?: string; // Make label optional\n @State() theme = 'light';\n\n private isLightTheme() {\n return this.theme === 'light';\n }\n\n render() {\n // Render nothing if no label prop is provided\n if (!this.label) {\n return null;\n }\n\n const labelStyle = this.isLightTheme() ? 'labelLight' : 'labelDark';\n\n return (\n <label\n class={classNames(labelStyle, this.inputLabelClassName)}\n htmlFor='searchcraft-input-id'\n >\n {this.label}\n </label>\n );\n }\n}\n","import { Component, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'searchcraft-search-icon-set',\n shadow: true,\n})\nexport class SearchcraftSearchIconSet {\n /**\n * Type of the icon to display.\n * Options: ''search-light', search-dark', 'error-light', 'error-dark'\n */\n @Prop() type: 'search-light' | 'search-dark' | 'error-light' | 'error-dark' =\n 'search-dark';\n\n render() {\n switch (this.type) {\n case 'search-light':\n return (\n <svg\n width='20'\n height='20'\n viewBox='0 0 20 20'\n fill='none'\n xmlns='http://www.w3.org/2000/svg'\n aria-labelledby='searchcraft-title'\n >\n <title id='searchcraft-title'>Searchcraft Search Icon Light</title>\n <path\n d='M17.5 17.5L13.875 13.875M15.8333 9.16667C15.8333 12.8486 12.8486 15.8333 9.16667 15.8333C5.48477 15.8333 2.5 12.8486 2.5 9.16667C2.5 5.48477 5.48477 2.5 9.16667 2.5C12.8486 2.5 15.8333 5.48477 15.8333 9.16667Z'\n stroke='#404040'\n stroke-width='1.5'\n stroke-linecap='round'\n stroke-linejoin='round'\n />\n </svg>\n );\n case 'search-dark':\n return (\n <svg\n width='18'\n height='18'\n viewBox='0 0 18 18'\n fill='none'\n xmlns='http://www.w3.org/2000/svg'\n aria-labelledby='searchcraft-title'\n >\n <title id='searchcraft-title'>Searchcraft Search Icon Dark</title>\n <path\n d='M16.5 16.5L12.875 12.875M14.8333 8.16667C14.8333 11.8486 11.8486 14.8333 8.16667 14.8333C4.48477 14.8333 1.5 11.8486 1.5 8.16667C1.5 4.48477 4.48477 1.5 8.16667 1.5C11.8486 1.5 14.8333 4.48477 14.8333 8.16667Z'\n stroke='#E6E6E6'\n stroke-width='1.5'\n stroke-linecap='round'\n stroke-linejoin='round'\n />\n </svg>\n );\n case 'error-light':\n return (\n <svg\n width='20'\n height='20'\n viewBox='0 0 20 20'\n fill='none'\n xmlns='http://www.w3.org/2000/svg'\n aria-labelledby='searchcraft-title'\n >\n <title id='searchcraft-title'>\n Searchcraft Error Search Icon Light\n </title>\n <path\n d='M17.5 17.5L13.875 13.875M15.8333 9.16667C15.8333 12.8486 12.8486 15.8333 9.16667 15.8333C5.48477 15.8333 2.5 12.8486 2.5 9.16667C2.5 5.48477 5.48477 2.5 9.16667 2.5C12.8486 2.5 15.8333 5.48477 15.8333 9.16667Z'\n stroke='#737373'\n stroke-width='1.5'\n stroke-linecap='round'\n stroke-linejoin='round'\n />\n </svg>\n );\n case 'error-dark':\n return (\n <svg\n width='18'\n height='18'\n viewBox='0 0 18 18'\n fill='none'\n xmlns='http://www.w3.org/2000/svg'\n aria-labelledby='searchcraft-title'\n >\n <title id='searchcraft-title'>\n Searchcraft Error Search Icon Dark\n </title>\n <path\n d='M16.5 16.5L12.875 12.875M14.8333 8.16667C14.8333 11.8486 11.8486 14.8333 8.16667 14.8333C4.48477 14.8333 1.5 11.8486 1.5 8.16667C1.5 4.48477 4.48477 1.5 8.16667 1.5C11.8486 1.5 14.8333 4.48477 14.8333 8.16667Z'\n stroke='#BFBFBF'\n stroke-width='1.5'\n stroke-linecap='round'\n stroke-linejoin='round'\n />\n </svg>\n );\n default:\n return null;\n }\n }\n}\n","$spinner-size: 20px;\n\n.spinnerContainer {\n background-color: transparent;\n height: $spinner-size;\n width: $spinner-size;\n}\n\n.spinnerDark {\n height: 100%;\n width: 100%;\n background: conic-gradient(#000 50%, #FFFFFF);\n clip-path: circle(50%);\n mask-image: radial-gradient(circle at center, rgba(0,0,0,0) calc($spinner-size/3), rgba(0,0,0,1) calc($spinner-size/3));\n animation: spinning 1s linear infinite;\n}\n\n.spinnerLight {\n height: 100%;\n width: 100%;\n background: conic-gradient(#737373 50%, #FFFFFF);\n clip-path: circle(50%);\n mask-image: radial-gradient(circle at center, rgba(0,0,0,0) calc($spinner-size/3), rgba(0,0,0,1) calc($spinner-size/3));\n animation: spinning 1s linear infinite;\n}\n\n@keyframes spinning {\n 0% { transform: rotate(0deg); }\n 50% {transform: rotate(180deg);}\n 100% { transform: rotate(360deg); }\n}","import { Component, h } from '@stencil/core';\n\n@Component({\n tag: 'searchcraft-spinner-dark',\n styleUrl: 'searchcraft-spinner-dark.module.scss',\n shadow: true,\n})\nexport class SearchcraftSpinnerDark {\n render() {\n return (\n <div class='spinnerContainer'>\n <div class='spinnerDark' />\n </div>\n );\n }\n}\n","$spinner-size: 20px;\n\n.spinnerContainer {\n background-color: transparent;\n height: $spinner-size;\n width: $spinner-size;\n}\n\n.spinnerLight {\n height: 100%;\n width: 100%;\n background: conic-gradient(#737373 50%, #FFFFFF);\n clip-path: circle(50%);\n mask-image: radial-gradient(circle at center, rgba(0,0,0,0) calc($spinner-size/3), rgba(0,0,0,1) calc($spinner-size/3));\n animation: spinning 1s linear infinite;\n}\n\n@keyframes spinning {\n 0% { transform: rotate(0deg); }\n 50% {transform: rotate(180deg);}\n 100% { transform: rotate(360deg); }\n}","import { Component, h } from '@stencil/core';\n\n@Component({\n tag: 'searchcraft-spinner-light',\n styleUrl: 'searchcraft-spinner-light.module.scss',\n shadow: true,\n})\nexport class SearchcraftSpinnerLight {\n render() {\n return (\n <div class='spinnerContainer'>\n <div class='spinnerLight' />\n </div>\n );\n }\n}\n"],"version":3}
@@ -1,5 +1,5 @@
1
- import { r as registerInstance, c as createEvent, h } from './index-0d9f850d.js';
2
- import { u as useSearchcraftStore, a as useThemeStore, g } from './store-2370857c.js';
1
+ import { r as registerInstance, c as createEvent, h } from './index-eace3343.js';
2
+ import { u as useSearchcraftStore, a as useThemeStore, g } from './store-e55b12aa.js';
3
3
 
4
4
  const searchcraftBaseSearchFormModuleCss = ".formLTR{font-family:Helvetica, Arial, sans-serif;text-align:left}.formRTL{font-family:Helvetica, Arial, sans-serif;text-align:right}.searchContainer{align-items:center;display:flex}";
5
5
  const SearchcraftBaseSearchFormStyle0 = searchcraftBaseSearchFormModuleCss;
@@ -1,4 +1,4 @@
1
- import { r as registerInstance, h } from './index-0d9f850d.js';
1
+ import { r as registerInstance, h } from './index-eace3343.js';
2
2
 
3
3
  const SearchcraftButtonIcon = class {
4
4
  constructor(hostRef) {
@@ -1,4 +1,4 @@
1
- import { r as registerInstance, c as createEvent, h, F as Fragment } from './index-0d9f850d.js';
1
+ import { r as registerInstance, c as createEvent, h, F as Fragment } from './index-eace3343.js';
2
2
  import { c as classNames } from './index-72ac5051.js';
3
3
 
4
4
  const searchcraftButtonModuleCss = ":root{--font-stack:Helvetica, Arial, sans-serif}.buttonLight{border-radius:8px;display:flex;font-family:var(--font-stack);font-size:16px;font-weight:700;line-height:20px;padding:11px 20px;position:relative;background-color:#000;border:1px solid #E6E6E6;color:#FFF}.buttonLight:hover{cursor:pointer}.buttonLight:hover{background-color:#2E2E2E}.buttonLight:focus{outline:2px solid #000000}.buttonDark{border-radius:8px;display:flex;font-family:var(--font-stack);font-size:16px;font-weight:700;line-height:20px;padding:11px 20px;position:relative;background-color:#FFF;border:1px solid #404040;color:#292929}.buttonDark:hover{cursor:pointer}.buttonDark:hover{background-color:#FAFAFA}.buttonDark:focus{outline:2px solid #404040}.spinnerMarginRight{left:4px;margin-right:4px;position:absolute}.spinnerMarginLeft{left:4px;margin-left:4px;position:absolute}.buttonLabel{animation:right-and-back 0.2s;margin-left:4px;position:relative}@keyframes right-and-back{0%{right:-6px}50%{right:-12px}75%{right:-6px}100%{right:0px}}";
@@ -23,7 +23,7 @@ const SearchcraftButton = class {
23
23
  }
24
24
  render() {
25
25
  const buttonStyle = this.getButtonStyle();
26
- return (h(Fragment, { key: 'f10a9faa6357ef626c4e5414a5c8bdc1fe0b63a1' }, this.iconOnly ? (h("button", { class: classNames(buttonStyle, 'searchcraft-button'), onClick: this.handleClick, type: 'submit' }, this.isRequesting ? (h("searchcraft-spinner-dark", null)) : (this.iconElement))) : (h("button", { class: classNames(buttonStyle, 'searchcraft-button'), onClick: this.handleClick, type: 'submit' }, this.iconPosition === 'left' && this.isRequesting ? (h("div", { class: 'spinner-margin-right' }, h("searchcraft-spinner-dark", null))) : (this.iconElement), h("span", { class: classNames(this.isRequesting && 'button-label', 'searchcraft-button-label') }, this.label)))));
26
+ return (h(Fragment, { key: 'd95f39680caa437650f45f089c25273ddf24e076' }, this.iconOnly ? (h("button", { class: classNames(buttonStyle, 'searchcraft-button'), onClick: this.handleClick, type: 'submit' }, this.isRequesting ? (h("searchcraft-spinner-dark", null)) : (this.iconElement))) : (h("button", { class: classNames(buttonStyle, 'searchcraft-button'), onClick: this.handleClick, type: 'submit' }, this.iconPosition === 'left' && this.isRequesting ? (h("div", { class: 'spinner-margin-right' }, h("searchcraft-spinner-dark", null))) : (this.iconElement), h("span", { class: classNames(this.isRequesting && 'button-label', 'searchcraft-button-label') }, this.label)))));
27
27
  }
28
28
  };
29
29
  SearchcraftButton.style = SearchcraftButtonStyle0;
@@ -1,5 +1,5 @@
1
- import { p as promiseResolve, b as bootstrapLazy } from './index-0d9f850d.js';
2
- export { s as setNonce } from './index-0d9f850d.js';
1
+ import { p as promiseResolve, b as bootstrapLazy } from './index-eace3343.js';
2
+ export { s as setNonce } from './index-eace3343.js';
3
3
  import { g as globalScripts } from './app-globals-0f993ce5.js';
4
4
 
5
5
  /*
@@ -16,7 +16,7 @@ var patchBrowser = () => {
16
16
 
17
17
  patchBrowser().then(async (options) => {
18
18
  await globalScripts();
19
- return bootstrapLazy([["searchcraft-auto-search-form_13",[[1,"searchcraft-auto-search-form",{"autoSearchFormClass":[1,"auto-search-form-class"],"clearInput":[16],"config":[16],"customStylesForInput":[1,"custom-styles-for-input"],"inputCaptionValue":[1,"input-caption-value"],"labelForInput":[1,"label-for-input"],"placeholderValue":[1,"placeholder-value"],"rightToLeftOrientation":[4,"right-to-left-orientation"],"searchContainerClass":[1,"search-container-class"],"error":[32],"query":[32],"searchResults":[32]}],[1,"searchcraft-base-search-results",{"query":[32],"searchResults":[32]}],[1,"searchcraft-base-search-result",{"buttonCallbackFn":[16],"buttonLabel":[1,"button-label"],"callbackFn":[16],"imageAltText":[1,"image-alt-text"],"imageSrc":[1,"image-src"],"interactiveResult":[4,"interactive-result"],"keyDownCallbackFn":[16],"resultBodyContent":[1,"result-body-content"],"resultHeading":[1,"result-heading"],"resultSubheading":[1,"result-subheading"],"theme":[1]}],[1,"searchcraft-input",{"customStyles":[1,"custom-styles"],"error":[4],"formClassName":[1,"form-class-name"],"inputCaptionClassName":[1,"input-caption-class-name"],"inputCaptionValue":[1,"input-caption-value"],"inputClassName":[1,"input-class-name"],"placeholderValue":[1,"placeholder-value"],"rightToLeftOrientation":[4,"right-to-left-orientation"],"query":[1],"theme":[32]}],[1,"searchcraft-input-label",{"inputLabelClassName":[1,"input-label-class-name"],"label":[1],"theme":[32]}],[1,"searchcraft-clear-input-button",{"isRequesting":[4,"is-requesting"],"rightToLeftOrientation":[4,"right-to-left-orientation"],"theme":[32]}],[1,"searchcraft-input-icon",{"error":[4],"rightToLeftOrientation":[4,"right-to-left-orientation"],"theme":[32]}],[1,"searchcraft-error-message",{"errorMessage":[1,"error-message"],"theme":[1]}],[1,"searchcraft-input-caption",{"error":[4],"inputCaptionClassName":[1,"input-caption-class-name"],"inputCaptionValue":[1,"input-caption-value"],"rightToLeftOrientation":[4,"right-to-left-orientation"],"theme":[32]}],[1,"searchcraft-search-icon-set",{"type":[1]}],[1,"searchcraft-spinner-light"],[1,"searchcraft-spinner-dark"],[1,"searchcraft-clear-icon-set",{"type":[1]}]]],["searchcraft-base-search-form",[[1,"searchcraft-base-search-form",{"config":[16],"errorMessage":[1,"error-message"],"labelForInput":[1,"label-for-input"],"rightToLeftOrientation":[4,"right-to-left-orientation"],"error":[32],"query":[32],"searchResults":[32]}]]],["searchcraft-button-icon",[[1,"searchcraft-button-icon"]]],["searchcraft-button",[[1,"searchcraft-button",{"iconElement":[16],"iconOnly":[4,"icon-only"],"iconPosition":[1,"icon-position"],"label":[1],"isRequesting":[32],"theme":[32]}]]]], options);
19
+ return bootstrapLazy([["searchcraft-auto-search-form_13",[[1,"searchcraft-auto-search-form",{"autoSearchFormClass":[1,"auto-search-form-class"],"clearInput":[16],"config":[16],"customStylesForInput":[1,"custom-styles-for-input"],"inputCaptionValue":[1,"input-caption-value"],"labelForInput":[1,"label-for-input"],"placeholderValue":[1,"placeholder-value"],"rightToLeftOrientation":[4,"right-to-left-orientation"],"searchContainerClass":[1,"search-container-class"],"error":[32],"query":[32],"searchResults":[32]}],[1,"searchcraft-base-search-results",{"searchKeys":[1,"search-keys"],"customStylesForResults":[1,"custom-styles-for-results"],"query":[32],"searchResults":[32]}],[1,"searchcraft-base-search-result",{"buttonText":[1,"button-text"],"imageDescription":[1,"image-description"],"imageSource":[1,"image-source"],"isInteractive":[4,"is-interactive"],"primaryContent":[1,"primary-content"],"secondaryContent":[1,"secondary-content"],"tertiaryContent":[1,"tertiary-content"],"headingText":[1,"heading-text"],"subheadingText":[1,"subheading-text"],"themeMode":[1,"theme-mode"],"customStyles":[16]}],[1,"searchcraft-input",{"customStyles":[1,"custom-styles"],"error":[4],"formClassName":[1,"form-class-name"],"inputCaptionClassName":[1,"input-caption-class-name"],"inputCaptionValue":[1,"input-caption-value"],"inputClassName":[1,"input-class-name"],"placeholderValue":[1,"placeholder-value"],"rightToLeftOrientation":[4,"right-to-left-orientation"],"query":[1],"theme":[32]}],[1,"searchcraft-input-label",{"inputLabelClassName":[1,"input-label-class-name"],"label":[1],"theme":[32]}],[1,"searchcraft-clear-input-button",{"isRequesting":[4,"is-requesting"],"rightToLeftOrientation":[4,"right-to-left-orientation"],"theme":[32]}],[1,"searchcraft-input-icon",{"error":[4],"rightToLeftOrientation":[4,"right-to-left-orientation"],"theme":[32]}],[1,"searchcraft-error-message",{"errorMessage":[1,"error-message"],"theme":[1]}],[1,"searchcraft-input-caption",{"error":[4],"inputCaptionClassName":[1,"input-caption-class-name"],"inputCaptionValue":[1,"input-caption-value"],"rightToLeftOrientation":[4,"right-to-left-orientation"],"theme":[32]}],[1,"searchcraft-search-icon-set",{"type":[1]}],[1,"searchcraft-spinner-light"],[1,"searchcraft-spinner-dark"],[1,"searchcraft-clear-icon-set",{"type":[1]}]]],["searchcraft-base-search-form",[[1,"searchcraft-base-search-form",{"config":[16],"errorMessage":[1,"error-message"],"labelForInput":[1,"label-for-input"],"rightToLeftOrientation":[4,"right-to-left-orientation"],"error":[32],"query":[32],"searchResults":[32]}]]],["searchcraft-button-icon",[[1,"searchcraft-button-icon"]]],["searchcraft-button",[[1,"searchcraft-button",{"iconElement":[16],"iconOnly":[4,"icon-only"],"iconPosition":[1,"icon-position"],"label":[1],"isRequesting":[32],"theme":[32]}]]]], options);
20
20
  });
21
21
 
22
22
  //# sourceMappingURL=searchcraft-javascript-sdk.js.map
@@ -117,7 +117,7 @@ class g {
117
117
  s(this, "config");
118
118
  /**
119
119
  * @param {SearchParams} searchParams - The parameters for the search.
120
- * @returns {Promise<SearchResult>} - Returns a `SearchResult` object with the results from the search or throws an error.
120
+ * @returns {Promise<SearchcraftResponse>} - Returns a `SearchResult` object with the results from the search or throws an error.
121
121
  */
122
122
  s(this, "search", async (t) => {
123
123
  if ((t.query.match(/"/g) || []).length % 2 !== 0)
@@ -244,4 +244,4 @@ const useThemeStore = zustand.create((set) => ({
244
244
 
245
245
  export { useThemeStore as a, g, useSearchcraftStore as u };
246
246
 
247
- //# sourceMappingURL=store-2370857c.js.map
247
+ //# sourceMappingURL=store-e55b12aa.js.map