npm - @searchcraft/javascript-sdk - Versions diffs - 0.1.8 → 0.1.9 - Mend

@searchcraft/javascript-sdk 0.1.8 → 0.1.9

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 (137) hide show

package/dist/collection/components/searchcraft-filters-list/searchcraft-filters-list.js ADDED Viewed

@@ -0,0 +1,131 @@
+import { h, } from "@stencil/core";
+import { useSearchcraftStore } from "../../provider/store";
+export class SearchcraftFiltersList {
+    constructor() {
+        this.searchStore = useSearchcraftStore.getState();
+        this.handleFilterChange = (value, checked) => {
+            if (checked) {
+                this.selectedFilters.add(value);
+            }
+            else {
+                this.selectedFilters.delete(value);
+            }
+            const selectedFiltersArray = Array.from(this.selectedFilters);
+            this.filtersUpdated.emit(selectedFiltersArray);
+            this.searchStore.setSelectedFilters(selectedFiltersArray);
+            this.searchStore.search();
+        };
+        this.filters = [];
+        this.dynamicFilters = [];
+        this.isRequesting = false;
+        this.selectedFilters = new Set();
+        this.originalFilterCounts = {};
+    }
+    connectedCallback() {
+        this.unsubscribe = useSearchcraftStore.subscribe((state) => {
+            var _a;
+            this.isRequesting = state.isRequesting;
+            const facets = (_a = state.searchResults) === null || _a === void 0 ? void 0 : _a.data.facets;
+            if (facets) {
+                this.populateFiltersFromFacets(facets);
+            }
+        });
+    }
+    disconnectedCallback() {
+        if (this.unsubscribe) {
+            this.unsubscribe();
+        }
+    }
+    populateFiltersFromFacets(facets) {
+        const newFilters = Object.entries(facets).flatMap(([facetKey, facetData]) => Object.entries(facetData.counts).map(([value, count]) => {
+            const filterValue = `${facetKey}:${value}`;
+            this.originalFilterCounts[filterValue] = `${count}`; // Store the original count
+            return {
+                label: `${facetKey}: ${value.replace(/^\//, '')} (${count})`,
+                value: filterValue,
+            };
+        }));
+        this.dynamicFilters = newFilters;
+    }
+    render() {
+        const checkedFilters = Array.from(this.selectedFilters).map((value) => {
+            const count = this.originalFilterCounts[value] || '0';
+            return {
+                label: `${value.split(':')[1]} (${count})`,
+                value,
+            };
+        });
+        const remainingDynamicFilters = this.dynamicFilters.filter((filter) => !this.selectedFilters.has(filter.value));
+        if (this.isRequesting) {
+            return h("div", null, "Loading facets");
+        }
+        return (h("div", { class: 'filtersList' }, checkedFilters.map((filter) => (h("label", { class: 'checkboxLabel', key: filter.value }, h("input", { class: 'filterListCheckbox', checked: true, onChange: (event) => this.handleFilterChange(filter.value, event.target.checked), type: 'checkbox', value: filter.value }), filter.label))), remainingDynamicFilters.map((filter) => {
+            const filterLabel = filter.label.split(':')[1] || filter.label;
+            return (h("label", { class: 'checkboxLabel', key: filter.value }, h("input", { class: 'filterListCheckbox', checked: this.selectedFilters.has(filter.value), onChange: (event) => this.handleFilterChange(filter.value, event.target.checked), type: 'checkbox', value: filter.value }), filterLabel));
+        })));
+    }
+    static get is() { return "searchcraft-filters-list"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["searchcraft-filters-list.module.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["searchcraft-filters-list.module.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "filters": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "Array<{ label: string; value: string }>",
+                    "resolved": "{ label: string; value: string; }[]",
+                    "references": {
+                        "Array": {
+                            "location": "global",
+                            "id": "global::Array"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "defaultValue": "[]"
+            }
+        };
+    }
+    static get states() {
+        return {
+            "dynamicFilters": {},
+            "isRequesting": {},
+            "selectedFilters": {},
+            "originalFilterCounts": {}
+        };
+    }
+    static get events() {
+        return [{
+                "method": "filtersUpdated",
+                "name": "filtersUpdated",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "string[]",
+                    "resolved": "string[]",
+                    "references": {}
+                }
+            }];
+    }
+}
+//# sourceMappingURL=searchcraft-filters-list.js.map

package/dist/collection/components/searchcraft-filters-list/searchcraft-filters-list.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"searchcraft-filters-list.js","sourceRoot":"","sources":["../../../src/components/searchcraft-filters-list/searchcraft-filters-list.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n h,\n State,\n Prop,\n Event,\n type EventEmitter,\n} from '@stencil/core';\nimport { useSearchcraftStore } from '@provider/store';\nimport type { Facets } from '@searchcraft/core';\n\n@Component({\n tag: 'searchcraft-filters-list',\n styleUrl: 'searchcraft-filters-list.module.scss',\n shadow: true,\n})\nexport class SearchcraftFiltersList {\n @Prop() filters: Array<{ label: string; value: string }> = [];\n @Event() filtersUpdated: EventEmitter<string[]>;\n\n @State() dynamicFilters: Array<{ label: string; value: string }> = [];\n @State() isRequesting = false;\n @State() selectedFilters: Set<string> = new Set();\n @State() originalFilterCounts: Record<string, string> = {};\n\n private searchStore = useSearchcraftStore.getState();\n unsubscribe: () => void;\n\n connectedCallback() {\n this.unsubscribe = useSearchcraftStore.subscribe((state) => {\n this.isRequesting = state.isRequesting;\n const facets = state.searchResults?.data.facets;\n if (facets) {\n this.populateFiltersFromFacets(facets);\n }\n });\n }\n\n disconnectedCallback() {\n if (this.unsubscribe) {\n this.unsubscribe();\n }\n }\n\n populateFiltersFromFacets(facets: Facets) {\n const newFilters = Object.entries(facets).flatMap(([facetKey, facetData]) =>\n Object.entries(facetData.counts).map(([value, count]) => {\n const filterValue = `${facetKey}:${value}`;\n this.originalFilterCounts[filterValue] = `${count}`; // Store the original count\n return {\n label: `${facetKey}: ${value.replace(/^\\//, '')} (${count})`,\n value: filterValue,\n };\n }),\n );\n this.dynamicFilters = newFilters;\n }\n\n handleFilterChange = (value: string, checked: boolean) => {\n if (checked) {\n this.selectedFilters.add(value);\n } else {\n this.selectedFilters.delete(value);\n }\n\n const selectedFiltersArray = Array.from(this.selectedFilters);\n this.filtersUpdated.emit(selectedFiltersArray);\n this.searchStore.setSelectedFilters(selectedFiltersArray);\n this.searchStore.search();\n };\n\n render() {\n const checkedFilters = Array.from(this.selectedFilters).map((value) => {\n const count = this.originalFilterCounts[value] || '0';\n return {\n label: `${value.split(':')[1]} (${count})`,\n value,\n };\n });\n\n const remainingDynamicFilters = this.dynamicFilters.filter(\n (filter) => !this.selectedFilters.has(filter.value),\n );\n\n if (this.isRequesting) {\n return <div>Loading facets</div>;\n }\n\n return (\n <div class='filtersList'>\n {checkedFilters.map((filter) => (\n <label class='checkboxLabel' key={filter.value}>\n <input\n class='filterListCheckbox'\n checked\n onChange={(event: Event) =>\n this.handleFilterChange(\n filter.value,\n (event.target as HTMLInputElement).checked,\n )\n }\n type='checkbox'\n value={filter.value}\n />\n {filter.label}\n </label>\n ))}\n {remainingDynamicFilters.map((filter) => {\n const filterLabel = filter.label.split(':')[1] || filter.label;\n return (\n <label class='checkboxLabel' key={filter.value}>\n <input\n class='filterListCheckbox'\n checked={this.selectedFilters.has(filter.value)}\n onChange={(event: Event) =>\n this.handleFilterChange(\n filter.value,\n (event.target as HTMLInputElement).checked,\n )\n }\n type='checkbox'\n value={filter.value}\n />\n {filterLabel}\n </label>\n );\n })}\n </div>\n );\n }\n}\n"]}

package/dist/collection/components/searchcraft-filters-list/searchcraft-filters-list.module.css ADDED Viewed

@@ -0,0 +1,35 @@
+@charset "UTF-8";
+.filtersList {
+  padding: 16px;
+}
+.checkboxLabel {
+  align-items: center;
+  color: #292929;
+  display: flex;
+  font-size: 14px;
+  font-weight: 600;
+  gap: 12px;
+}
+.checkboxLabel input[type=checkbox] {
+  align-items: center;
+  appearance: none;
+  background-color: #EDEDED;
+  border: 1px solid #D9D9D9;
+  cursor: pointer;
+  display: flex;
+  height: 24px;
+  justify-content: center;
+  width: 24px;
+}
+.checkboxLabel input[type=checkbox]:checked {
+  background-color: #000;
+}
+.checkboxLabel input[type=checkbox]:checked::before {
+  color: #fff;
+  content: "✔";
+  font-size: 14px;
+}

package/dist/collection/components/searchcraft-input/searchcraft-input.js CHANGED Viewed

@@ -24,6 +24,10 @@ export class SearchcraftInput {
         const input = event.target;
         this.searchInputChange.emit(input.value);
     }
+    handleInputKeyUp(event) {
+        const input = event.target;
+        this.inputKeyUp.emit(input.value);
+    }
     handleClearInput() {
         if (this.clearInput) {
             this.clearInput.emit();
@@ -44,11 +48,11 @@ export class SearchcraftInput {
         const placeholderStyle = {
             fontSize: validatedCustomStyles.placeholderFontSize || '16px',
         };
-        return (h("div", { key: '41f29f98e95d5811e81dd885cd282cd8f50cb776', class: classNames(containerClassName, this.formClassName, 'searchcraft-input-form') }, this.rightToLeftOrientation ? (h(Fragment, null, h("input", { class: classNames(inputClassName, 'searchcraft-input'), id: 'searchcraft-input-id', onChange: this.handleInputChange.bind(this), placeholder: this.placeholderValue, type: 'text', value: this.query, style: validatedCustomStyles }), h("style", null, `
+        return (h("div", { key: 'ca2698b808ef606d890817f6b8c133503663570e', class: classNames(containerClassName, this.formClassName, 'searchcraft-input-form') }, this.rightToLeftOrientation ? (h(Fragment, null, h("input", { class: classNames(inputClassName, 'searchcraft-input'), id: 'searchcraft-input-id', onChange: this.handleInputChange.bind(this), onKeyUp: this.handleInputKeyUp.bind(this), placeholder: this.placeholderValue, type: 'text', value: this.query, style: validatedCustomStyles }), h("style", null, `
                 #searchcraft-input-id::placeholder {
                   font-size: ${placeholderStyle.fontSize};
                 }
-              `), this.inputCaptionValue && (h("searchcraft-input-caption", { inputCaptionClassName: this.inputCaptionClassName, inputCaptionValue: this.inputCaptionValue, rightToLeftOrientation: this.rightToLeftOrientation })), this.query.length > 0 && (h("searchcraft-clear-input-button", { isRequesting: this.isRequesting, onClearInput: this.handleClearInput, rightToLeftOrientation: this.rightToLeftOrientation })), h("searchcraft-input-icon", { error: this.error, height: this.inputIconHeight, rightToLeftOrientation: this.rightToLeftOrientation, width: this.inputIconWidth }))) : (h("div", { class: 'inputWrapper' }, h("searchcraft-input-icon", { error: this.error, height: this.inputIconHeight, rightToLeftOrientation: this.rightToLeftOrientation, width: this.inputIconWidth }), h("input", { class: classNames(inputClassName, 'searchcraft-input'), id: 'searchcraft-input-id', onChange: this.handleInputChange.bind(this), placeholder: this.placeholderValue, type: 'text', value: this.query, style: validatedCustomStyles }), h("style", null, `
+              `), this.inputCaptionValue && (h("searchcraft-input-caption", { inputCaptionClassName: this.inputCaptionClassName, inputCaptionValue: this.inputCaptionValue, rightToLeftOrientation: this.rightToLeftOrientation })), this.query.length > 0 && (h("searchcraft-clear-input-button", { isRequesting: this.isRequesting, onClearInput: this.handleClearInput, rightToLeftOrientation: this.rightToLeftOrientation })), h("searchcraft-input-icon", { error: this.error, height: this.inputIconHeight, rightToLeftOrientation: this.rightToLeftOrientation, width: this.inputIconWidth }))) : (h("div", { class: 'inputWrapper' }, h("searchcraft-input-icon", { error: this.error, height: this.inputIconHeight, rightToLeftOrientation: this.rightToLeftOrientation, width: this.inputIconWidth }), h("input", { class: classNames(inputClassName, 'searchcraft-input'), id: 'searchcraft-input-id', onChange: this.handleInputChange.bind(this), onKeyUp: this.handleInputKeyUp.bind(this), placeholder: this.placeholderValue, type: 'text', value: this.query, style: validatedCustomStyles }), h("style", null, `
                 #searchcraft-input-id::placeholder {
                   font-size: ${placeholderStyle.fontSize};
                 }
@@ -327,6 +331,21 @@ export class SearchcraftInput {
                     "resolved": "string",
                     "references": {}
                 }
+            }, {
+                "method": "inputKeyUp",
+                "name": "inputKeyUp",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                }
             }];
     }
 }

package/dist/collection/components/searchcraft-input/searchcraft-input.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"searchcraft-input.js","sourceRoot":"","sources":["../../../src/components/searchcraft-input/searchcraft-input.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EACT,CAAC,EACD,IAAI,EACJ,KAAK,EACL,KAAK,EACL,QAAQ,GAET,MAAM,eAAe,CAAC;AACvB,OAAO,UAAU,MAAM,YAAY,CAAC;AAEpC,OAAO,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC;AAYjD,MAAM,OAAO,gBAAgB;;4BAC6B,EAAE;qBAC1C,KAAK;6BACG,EAAE;qCACM,EAAE;iCACN,EAAE;8BACL,EAAE;+BACD,EAAE;8BACH,EAAE;4BACJ,KAAK;gCACD,cAAc;sCACR,KAAK;qBACtB,EAAE;~~qBAKD~~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","sourcesContent":["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() inputIconHeight = 20;\n @Prop() inputIconWidth = 20;\n @Prop() isRequesting = false;\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 isRequesting={this.isRequesting}\n onClearInput={this.handleClearInput}\n rightToLeftOrientation={this.rightToLeftOrientation}\n />\n )}\n <searchcraft-input-icon\n error={this.error}\n height={this.inputIconHeight}\n rightToLeftOrientation={this.rightToLeftOrientation}\n width={this.inputIconWidth}\n />\n </Fragment>\n ) : (\n <div class='inputWrapper'>\n <searchcraft-input-icon\n error={this.error}\n height={this.inputIconHeight}\n rightToLeftOrientation={this.rightToLeftOrientation}\n width={this.inputIconWidth}\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 isRequesting={this.isRequesting}\n onClearInput={this.handleClearInput}\n rightToLeftOrientation={this.rightToLeftOrientation}\n />\n )}\n </div>\n )}\n </div>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"searchcraft-input.js","sourceRoot":"","sources":["../../../src/components/searchcraft-input/searchcraft-input.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EACT,CAAC,EACD,IAAI,EACJ,KAAK,EACL,KAAK,EACL,QAAQ,GAET,MAAM,eAAe,CAAC;AACvB,OAAO,UAAU,MAAM,YAAY,CAAC;AAEpC,OAAO,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC;AAYjD,MAAM,OAAO,gBAAgB;;4BAC6B,EAAE;qBAC1C,KAAK;6BACG,EAAE;qCACM,EAAE;iCACN,EAAE;8BACL,EAAE;+BACD,EAAE;8BACH,EAAE;4BACJ,KAAK;gCACD,cAAc;sCACR,KAAK;qBACtB,EAAE;qBAMD,OAAO;;IAExB,IAAY,YAAY;QACtB,OAAO,IAAI,CAAC,KAAK,KAAK,OAAO,CAAC;IAChC,CAAC;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;IAC3C,CAAC;IAED,gBAAgB,CAAC,KAAoB;QACnC,MAAM,KAAK,GAAG,KAAK,CAAC,MAA0B,CAAC;QAC/C,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;IACpC,CAAC;IAED,gBAAgB;QACd,IAAI,IAAI,CAAC,UAAU,EAAE,CAAC;YACpB,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,CAAC;QACzB,CAAC;IACH,CAAC;IAED,MAAM;QACJ,MAAM,kBAAkB,GAAG,IAAI,CAAC,sBAAsB;YACpD,CAAC,CAAC,mBAAmB;YACrB,CAAC,CAAC,mBAAmB,CAAC;QAExB,MAAM,cAAc,GAAG,UAAU,CAC/B,IAAI,CAAC,KAAK;YACR,CAAC,CAAC,IAAI,CAAC,YAAY;gBACjB,CAAC,CAAC,oBAAoB;gBACtB,CAAC,CAAC,mBAAmB;YACvB,CAAC,CAAC,IAAI,CAAC,YAAY;gBACjB,CAAC,CAAC,eAAe;gBACjB,CAAC,CAAC,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,OAAO,CACL,4DACE,KAAK,EAAE,UAAU,CACf,kBAAkB,EAClB,IAAI,CAAC,aAAa,EAClB,wBAAwB,CACzB,IAEA,IAAI,CAAC,sBAAsB,CAAC,CAAC,CAAC,CAC7B,EAAC,QAAQ;YACP,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,OAAO,EAAE,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,EACzC,WAAW,EAAE,IAAI,CAAC,gBAAgB,EAClC,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,KAAK,EAAE,qBAAqB,GAC5B;YACF,iBACG;;+BAEgB,gBAAgB,CAAC,QAAQ;;eAEzC,CACK;YACP,IAAI,CAAC,iBAAiB,IAAI,CACzB,iCACE,qBAAqB,EAAE,IAAI,CAAC,qBAAqB,EACjD,iBAAiB,EAAE,IAAI,CAAC,iBAAiB,EACzC,sBAAsB,EAAE,IAAI,CAAC,sBAAsB,GACnD,CACH;YACA,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,IAAI,CACxB,sCACE,YAAY,EAAE,IAAI,CAAC,YAAY,EAC/B,YAAY,EAAE,IAAI,CAAC,gBAAgB,EACnC,sBAAsB,EAAE,IAAI,CAAC,sBAAsB,GACnD,CACH;YACD,8BACE,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,MAAM,EAAE,IAAI,CAAC,eAAe,EAC5B,sBAAsB,EAAE,IAAI,CAAC,sBAAsB,EACnD,KAAK,EAAE,IAAI,CAAC,cAAc,GAC1B,CACO,CACZ,CAAC,CAAC,CAAC,CACF,WAAK,KAAK,EAAC,cAAc;YACvB,8BACE,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,MAAM,EAAE,IAAI,CAAC,eAAe,EAC5B,sBAAsB,EAAE,IAAI,CAAC,sBAAsB,EACnD,KAAK,EAAE,IAAI,CAAC,cAAc,GAC1B;YACF,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,OAAO,EAAE,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,EACzC,WAAW,EAAE,IAAI,CAAC,gBAAgB,EAClC,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,KAAK,EAAE,qBAAqB,GAC5B;YACF,iBACG;;+BAEgB,gBAAgB,CAAC,QAAQ;;eAEzC,CACK;YACP,IAAI,CAAC,iBAAiB,IAAI,CACzB,iCACE,qBAAqB,EAAE,IAAI,CAAC,qBAAqB,EACjD,iBAAiB,EAAE,IAAI,CAAC,iBAAiB,EACzC,sBAAsB,EAAE,IAAI,CAAC,sBAAsB,GACnD,CACH;YACA,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,IAAI,CACxB,sCACE,YAAY,EAAE,IAAI,CAAC,YAAY,EAC/B,YAAY,EAAE,IAAI,CAAC,gBAAgB,EACnC,sBAAsB,EAAE,IAAI,CAAC,sBAAsB,GACnD,CACH,CACG,CACP,CACG,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["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() inputIconHeight = 20;\n @Prop() inputIconWidth = 20;\n @Prop() isRequesting = false;\n @Prop() placeholderValue = 'Enter Search';\n @Prop() rightToLeftOrientation = false;\n @Prop() query = '';\n\n @Event() clearInput: EventEmitter<void>;\n @Event() searchInputChange: EventEmitter<string>;\n @Event() inputKeyUp: 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 handleInputKeyUp(event: KeyboardEvent) {\n const input = event.target as HTMLInputElement;\n this.inputKeyUp.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 onKeyUp={this.handleInputKeyUp.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 isRequesting={this.isRequesting}\n onClearInput={this.handleClearInput}\n rightToLeftOrientation={this.rightToLeftOrientation}\n />\n )}\n <searchcraft-input-icon\n error={this.error}\n height={this.inputIconHeight}\n rightToLeftOrientation={this.rightToLeftOrientation}\n width={this.inputIconWidth}\n />\n </Fragment>\n ) : (\n <div class='inputWrapper'>\n <searchcraft-input-icon\n error={this.error}\n height={this.inputIconHeight}\n rightToLeftOrientation={this.rightToLeftOrientation}\n width={this.inputIconWidth}\n />\n <input\n class={classNames(inputClassName, 'searchcraft-input')}\n id='searchcraft-input-id'\n onChange={this.handleInputChange.bind(this)}\n onKeyUp={this.handleInputKeyUp.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 isRequesting={this.isRequesting}\n onClearInput={this.handleClearInput}\n rightToLeftOrientation={this.rightToLeftOrientation}\n />\n )}\n </div>\n )}\n </div>\n );\n }\n}\n"]}

package/dist/collection/components/searchcraft-slider/searchcraft-slider.js ADDED Viewed

@@ -0,0 +1,97 @@
+import { h } from "@stencil/core";
+import { useSearchcraftStore } from "../../provider/store";
+export class SearchcraftSlider {
+    constructor() {
+        this.searchStore = useSearchcraftStore.getState();
+        this.updateYears = async () => {
+            const query = this.searchStore.query; // Get the query from the store
+            this.searchStore.setYearsRange([this.startYear, this.endYear]);
+            try {
+                if (!query || query.trim() === '') {
+                    console.warn('No query value, search request skipped.');
+                    return;
+                }
+                await this.searchStore.search();
+            }
+            catch (error) {
+                console.error('Search failed:', error);
+            }
+        };
+        this.handleStartYearChange = (event) => {
+            const value = Number.parseInt(event.target.value, 10);
+            this.startYear = Math.min(value, this.endYear);
+            this.updateYears();
+        };
+        this.handleEndYearChange = (event) => {
+            const value = Number.parseInt(event.target.value, 10);
+            this.endYear = Math.max(value, this.startYear);
+            this.updateYears();
+        };
+        this.minYear = 2000;
+        this.maxYear = new Date().getFullYear();
+        this.startYear = this.minYear;
+        this.endYear = this.maxYear;
+    }
+    render() {
+        return (h("div", { key: 'cc50ae827183ec2cbf1ab16f4a3514fbd581cf01', class: 'slider-container' }, h("label", { key: '96df103d7a04aa5e0364ddf51e13af653984b8a6' }, "Filter by Year"), h("div", { key: 'dc0b68f7cd3b9a3e2fd37b6204e1542ee9fb0478', class: 'range-container' }, h("input", { key: '8ed75b7de77448d8340a76224609345309c20fe4', type: 'range', min: this.minYear, max: this.maxYear, value: this.startYear, step: '1', onInput: this.handleStartYearChange, class: 'range-slider' }), h("input", { key: '12a3612f9245d6ea290007d094668625907c183d', type: 'range', min: this.minYear, max: this.maxYear, value: this.endYear, step: '1', onInput: this.handleEndYearChange, class: 'range-slider' })), h("div", { key: '3bf225797efb2c5e1d97275e2f012faba14d2550', class: 'year-labels' }, h("span", { key: '524c7f49dc52d68059373ecc1e95b425892f0144', class: 'year-label' }, this.startYear), h("span", { key: 'e7464b4154ab8d26a969b338a5a733a206502f29', class: 'year-label' }, this.endYear))));
+    }
+    static get is() { return "searchcraft-slider"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["searchcraft-slider.module.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["searchcraft-slider.module.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "minYear": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "min-year",
+                "reflect": false,
+                "defaultValue": "2000"
+            },
+            "maxYear": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "max-year",
+                "reflect": false,
+                "defaultValue": "new Date().getFullYear()"
+            }
+        };
+    }
+    static get states() {
+        return {
+            "startYear": {},
+            "endYear": {}
+        };
+    }
+}
+//# sourceMappingURL=searchcraft-slider.js.map

package/dist/collection/components/searchcraft-slider/searchcraft-slider.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"searchcraft-slider.js","sourceRoot":"","sources":["../../../src/components/searchcraft-slider/searchcraft-slider.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAC1D,OAAO,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AAOtD,MAAM,OAAO,iBAAiB;;QAOpB,gBAAW,GAAG,mBAAmB,CAAC,QAAQ,EAAE,CAAC;QAE7C,gBAAW,GAAG,KAAK,IAAI,EAAE;YAC/B,MAAM,KAAK,GAAG,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC,+BAA+B;YACrE,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,CAAC,IAAI,CAAC,SAAS,EAAE,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC;YAE/D,IAAI,CAAC;gBACH,IAAI,CAAC,KAAK,IAAI,KAAK,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAAC;oBAClC,OAAO,CAAC,IAAI,CAAC,yCAAyC,CAAC,CAAC;oBACxD,OAAO;gBACT,CAAC;gBACD,MAAM,IAAI,CAAC,WAAW,CAAC,MAAM,EAAE,CAAC;YAClC,CAAC;YAAC,OAAO,KAAK,EAAE,CAAC;gBACf,OAAO,CAAC,KAAK,CAAC,gBAAgB,EAAE,KAAK,CAAC,CAAC;YACzC,CAAC;QACH,CAAC,CAAC;QAEM,0BAAqB,GAAG,CAAC,KAAiB,EAAE,EAAE;YACpD,MAAM,KAAK,GAAG,MAAM,CAAC,QAAQ,CAAE,KAAK,CAAC,MAA2B,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC;YAC5E,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,GAAG,CAAC,KAAK,EAAE,IAAI,CAAC,OAAO,CAAC,CAAC;YAC/C,IAAI,CAAC,WAAW,EAAE,CAAC;QACrB,CAAC,CAAC;QAEM,wBAAmB,GAAG,CAAC,KAAiB,EAAE,EAAE;YAClD,MAAM,KAAK,GAAG,MAAM,CAAC,QAAQ,CAAE,KAAK,CAAC,MAA2B,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC;YAC5E,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,GAAG,CAAC,KAAK,EAAE,IAAI,CAAC,SAAS,CAAC,CAAC;YAC/C,IAAI,CAAC,WAAW,EAAE,CAAC;QACrB,CAAC,CAAC;uBAjCgB,IAAI;uBACJ,IAAI,IAAI,EAAE,CAAC,WAAW,EAAE;yBAErB,IAAI,CAAC,OAAO;uBACd,IAAI,CAAC,OAAO;;IA+B/B,MAAM;QACJ,OAAO,CACL,4DAAK,KAAK,EAAC,kBAAkB;YAC3B,iFAA6B;YAC7B,4DAAK,KAAK,EAAC,iBAAiB;gBAC1B,8DACE,IAAI,EAAC,OAAO,EACZ,GAAG,EAAE,IAAI,CAAC,OAAO,EACjB,GAAG,EAAE,IAAI,CAAC,OAAO,EACjB,KAAK,EAAE,IAAI,CAAC,SAAS,EACrB,IAAI,EAAC,GAAG,EACR,OAAO,EAAE,IAAI,CAAC,qBAAqB,EACnC,KAAK,EAAC,cAAc,GACpB;gBACF,8DACE,IAAI,EAAC,OAAO,EACZ,GAAG,EAAE,IAAI,CAAC,OAAO,EACjB,GAAG,EAAE,IAAI,CAAC,OAAO,EACjB,KAAK,EAAE,IAAI,CAAC,OAAO,EACnB,IAAI,EAAC,GAAG,EACR,OAAO,EAAE,IAAI,CAAC,mBAAmB,EACjC,KAAK,EAAC,cAAc,GACpB,CACE;YACN,4DAAK,KAAK,EAAC,aAAa;gBACtB,6DAAM,KAAK,EAAC,YAAY,IAAE,IAAI,CAAC,SAAS,CAAQ;gBAChD,6DAAM,KAAK,EAAC,YAAY,IAAE,IAAI,CAAC,OAAO,CAAQ,CAC1C,CACF,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, State, Prop } from '@stencil/core';\nimport { useSearchcraftStore } from '@provider/store';\n\n@Component({\n tag: 'searchcraft-slider',\n styleUrl: 'searchcraft-slider.module.scss',\n shadow: true,\n})\nexport class SearchcraftSlider {\n @Prop() minYear = 2000;\n @Prop() maxYear = new Date().getFullYear();\n\n @State() startYear = this.minYear;\n @State() endYear = this.maxYear;\n\n private searchStore = useSearchcraftStore.getState();\n\n private updateYears = async () => {\n const query = this.searchStore.query; // Get the query from the store\n this.searchStore.setYearsRange([this.startYear, this.endYear]);\n\n try {\n if (!query || query.trim() === '') {\n console.warn('No query value, search request skipped.');\n return;\n }\n await this.searchStore.search();\n } catch (error) {\n console.error('Search failed:', error);\n }\n };\n\n private handleStartYearChange = (event: InputEvent) => {\n const value = Number.parseInt((event.target as HTMLInputElement).value, 10);\n this.startYear = Math.min(value, this.endYear);\n this.updateYears();\n };\n\n private handleEndYearChange = (event: InputEvent) => {\n const value = Number.parseInt((event.target as HTMLInputElement).value, 10);\n this.endYear = Math.max(value, this.startYear);\n this.updateYears();\n };\n\n render() {\n return (\n <div class='slider-container'>\n <label>Filter by Year</label>\n <div class='range-container'>\n <input\n type='range'\n min={this.minYear}\n max={this.maxYear}\n value={this.startYear}\n step='1'\n onInput={this.handleStartYearChange}\n class='range-slider'\n />\n <input\n type='range'\n min={this.minYear}\n max={this.maxYear}\n value={this.endYear}\n step='1'\n onInput={this.handleEndYearChange}\n class='range-slider'\n />\n </div>\n <div class='year-labels'>\n <span class='year-label'>{this.startYear}</span>\n <span class='year-label'>{this.endYear}</span>\n </div>\n </div>\n );\n }\n}\n"]}

package/dist/collection/components/searchcraft-slider/searchcraft-slider.module.css ADDED Viewed

@@ -0,0 +1,75 @@
+.slider-container {
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+  font-family: Arial, sans-serif;
+  align-items: center;
+}
+label {
+  font-size: 14px;
+  font-weight: bold;
+  margin-bottom: 10px;
+}
+.range-container {
+  display: flex;
+  width: 100%;
+  align-items: center;
+}
+.range-slider {
+  width: 100%;
+  height: 4px;
+  background: #ddd;
+  border-radius: 2px;
+  outline: none;
+  margin: 0 -1px;
+  position: relative;
+}
+.range-slider::-webkit-slider-thumb {
+  -webkit-appearance: none;
+  appearance: none;
+  width: 20px;
+  height: 20px;
+  background: #007bff;
+  border-radius: 50%;
+  border: 2px solid #fff;
+  cursor: pointer;
+  position: relative;
+}
+.range-slider::-moz-range-thumb {
+  width: 20px;
+  height: 20px;
+  background: #007bff;
+  border-radius: 50%;
+  border: 2px solid #fff;
+  cursor: pointer;
+}
+.range-slider:before {
+  content: "";
+  position: absolute;
+  height: 4px;
+  background: #007bff;
+  border-radius: 2px;
+  left: 0;
+  right: 0;
+  z-index: -1;
+}
+.year-labels {
+  display: flex;
+  justify-content: space-between;
+  width: 100%;
+  margin-top: 10px;
+  font-size: 12px;
+  color: #555;
+}
+.year-label {
+  min-width: 30px;
+  text-align: center;
+}

package/dist/collection/components/searchcraft-spinner-dark/searchcraft-spinner-dark.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import { h } from "@stencil/core";
 export class SearchcraftSpinnerDark {
     render() {
-        return (h("div", { key: '76685b09609a42adbff41ee43ecb4b4e161d4598', class: 'spinnerContainer' }, h("div", { key: '7e7a01010f21e5b95358b7385d41a45e90a5b3bd', class: 'spinnerDark' })));
+        return (h("div", { key: 'fa6235c4bf182daac64d41cd04a995aa3476b59a', class: 'spinnerContainer' }, h("div", { key: '68532114a4f25a5d12c8514e5c6d2984a68573af', class: 'spinnerDark' })));
     }
     static get is() { return "searchcraft-spinner-dark"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/searchcraft-spinner-light/searchcraft-spinner-light.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import { h } from "@stencil/core";
 export class SearchcraftSpinnerLight {
     render() {
-        return (h("div", { key: '7bd4d997ef43d35ee60033a27b6bc46c6d693c33', class: 'spinnerContainer' }, h("div", { key: 'f8cc9948aa6a264719ffc54d25a10af27dc0f802', class: 'spinnerLight' })));
+        return (h("div", { key: 'f1c941149c07dac7ee09eff1ae98dca00dcdf924', class: 'spinnerContainer' }, h("div", { key: '2f93e299ef12f4f382d189ab58c743ee9e981ce2', class: 'spinnerLight' })));
     }
     static get is() { return "searchcraft-spinner-light"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/searchcraft-toggle-button/searchcraft-toggle-button.js ADDED Viewed

@@ -0,0 +1,79 @@
+import { h } from "@stencil/core";
+import { useSearchcraftStore } from "../../provider/store";
+export class SearchcraftToggleButton {
+    constructor() {
+        // Zustand store hook
+        this.searchStore = useSearchcraftStore.getState();
+        this.handleToggle = async () => {
+            this.isActive = !this.isActive;
+            if (this.type === 'mode') {
+                const mode = this.isActive ? 'normal' : 'fuzzy';
+                this.searchStore.setSearchParams({
+                    mode,
+                });
+            }
+            else if (this.type === 'sort') {
+                const sort = this.isActive ? 'asc' : 'desc';
+                this.searchStore.setSearchParams({
+                    sort,
+                });
+            }
+            try {
+                await this.searchStore.search();
+            }
+            catch (error) {
+                console.error('Search failed:', error);
+            }
+        };
+        this.type = 'mode';
+        this.isActive = false;
+    }
+    render() {
+        const label = this.type === 'mode'
+            ? 'Exact Match'
+            : this.type === 'sort'
+                ? 'Sort Order'
+                : '';
+        return (h("div", { key: '8bfbd9cf161d3dc285d7309ada79e9fb68624a45', class: 'toggle-container' }, h("span", { key: '99b5f67e53e45ebf97fef2bb2a52e50c804dec4d' }, label), h("button", { key: 'c6444cfcd24ef3558d0d93ebe0d4dcd4ceb8b29e', class: `toggle-wrapper ${this.isActive ? 'active' : ''}`, onClick: this.handleToggle, type: 'button' }, h("div", { key: '801f2e99c695449e161699fc874aa05ee1cf1e07', class: `toggle-switch ${this.isActive ? 'active' : ''}` }))));
+    }
+    static get is() { return "searchcraft-toggle-button"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["searchcraft-toggle-button.module.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["searchcraft-toggle-button.module.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "type": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'mode' | 'sort'",
+                    "resolved": "\"mode\" | \"sort\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Type of the toggle - determines what it controls\n'mode': toggles between 'fuzzy' and 'normal'\n'sort': toggles between 'asc' and 'desc'"
+                },
+                "attribute": "type",
+                "reflect": false,
+                "defaultValue": "'mode'"
+            }
+        };
+    }
+    static get states() {
+        return {
+            "isActive": {}
+        };
+    }
+}
+//# sourceMappingURL=searchcraft-toggle-button.js.map

package/dist/collection/components/searchcraft-toggle-button/searchcraft-toggle-button.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"searchcraft-toggle-button.js","sourceRoot":"","sources":["../../../src/components/searchcraft-toggle-button/searchcraft-toggle-button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAC1D,OAAO,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AAOtD,MAAM,OAAO,uBAAuB;;QAUlC,qBAAqB;QACb,gBAAW,GAAG,mBAAmB,CAAC,QAAQ,EAAE,CAAC;QAE7C,iBAAY,GAAG,KAAK,IAAI,EAAE;YAChC,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC;YAE/B,IAAI,IAAI,CAAC,IAAI,KAAK,MAAM,EAAE,CAAC;gBACzB,MAAM,IAAI,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC;gBAChD,IAAI,CAAC,WAAW,CAAC,eAAe,CAAC;oBAC/B,IAAI;iBACL,CAAC,CAAC;YACL,CAAC;iBAAM,IAAI,IAAI,CAAC,IAAI,KAAK,MAAM,EAAE,CAAC;gBAChC,MAAM,IAAI,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC;gBAC5C,IAAI,CAAC,WAAW,CAAC,eAAe,CAAC;oBAC/B,IAAI;iBACL,CAAC,CAAC;YACL,CAAC;YAED,IAAI,CAAC;gBACH,MAAM,IAAI,CAAC,WAAW,CAAC,MAAM,EAAE,CAAC;YAClC,CAAC;YAAC,OAAO,KAAK,EAAE,CAAC;gBACf,OAAO,CAAC,KAAK,CAAC,gBAAgB,EAAE,KAAK,CAAC,CAAC;YACzC,CAAC;QACH,CAAC,CAAC;oBA3B8B,MAAM;wBAElB,KAAK;;IA2BzB,MAAM;QACJ,MAAM,KAAK,GACT,IAAI,CAAC,IAAI,KAAK,MAAM;YAClB,CAAC,CAAC,aAAa;YACf,CAAC,CAAC,IAAI,CAAC,IAAI,KAAK,MAAM;gBACpB,CAAC,CAAC,YAAY;gBACd,CAAC,CAAC,EAAE,CAAC;QAEX,OAAO,CACL,4DAAK,KAAK,EAAC,kBAAkB;YAC3B,+DAAO,KAAK,CAAQ;YACpB,+DACE,KAAK,EAAE,kBAAkB,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,EAAE,EACxD,OAAO,EAAE,IAAI,CAAC,YAAY,EAC1B,IAAI,EAAC,QAAQ;gBAEb,4DAAK,KAAK,EAAE,iBAAiB,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,EAAE,GAAI,CACzD,CACL,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop, State } from '@stencil/core';\nimport { useSearchcraftStore } from '@provider/store';\n\n@Component({\n tag: 'searchcraft-toggle-button',\n styleUrl: 'searchcraft-toggle-button.module.scss',\n shadow: true,\n})\nexport class SearchcraftToggleButton {\n /**\n * Type of the toggle - determines what it controls\n * 'mode': toggles between 'fuzzy' and 'normal'\n * 'sort': toggles between 'asc' and 'desc'\n */\n @Prop() type: 'mode' | 'sort' = 'mode';\n\n @State() isActive = false;\n\n // Zustand store hook\n private searchStore = useSearchcraftStore.getState();\n\n private handleToggle = async () => {\n this.isActive = !this.isActive;\n\n if (this.type === 'mode') {\n const mode = this.isActive ? 'normal' : 'fuzzy';\n this.searchStore.setSearchParams({\n mode,\n });\n } else if (this.type === 'sort') {\n const sort = this.isActive ? 'asc' : 'desc';\n this.searchStore.setSearchParams({\n sort,\n });\n }\n\n try {\n await this.searchStore.search();\n } catch (error) {\n console.error('Search failed:', error);\n }\n };\n\n render() {\n const label =\n this.type === 'mode'\n ? 'Exact Match'\n : this.type === 'sort'\n ? 'Sort Order'\n : '';\n\n return (\n <div class='toggle-container'>\n <span>{label}</span>\n <button\n class={`toggle-wrapper ${this.isActive ? 'active' : ''}`}\n onClick={this.handleToggle}\n type='button'\n >\n <div class={`toggle-switch ${this.isActive ? 'active' : ''}`} />\n </button>\n </div>\n );\n }\n}\n"]}

package/dist/collection/components/searchcraft-toggle-button/searchcraft-toggle-button.module.css ADDED Viewed

@@ -0,0 +1,38 @@
+.toggle-container {
+  display: flex;
+  align-items: center;
+  font-size: 14px;
+  color: #333;
+}
+.toggle-wrapper {
+  box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.05);
+  margin-left: 10px;
+  border: none;
+  border-radius: 16px;
+  width: 44px;
+  height: 26px;
+  background: #ddd;
+  position: relative;
+  cursor: pointer;
+}
+.toggle-wrapper.active {
+  box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.05);
+  background: #007DB3;
+}
+.toggle-wrapper .toggle-switch {
+  width: 18px;
+  height: 18px;
+  background: #fff;
+  border-radius: 50%;
+  position: absolute;
+  top: calc(50% - 9px);
+  left: 4px;
+  transition: transform 0.3s ease;
+}
+.toggle-wrapper .toggle-switch.active {
+  transform: translateX(16px);
+}