@searchcraft/javascript-sdk 0.2.2 → 0.2.4

package/dist/collection/components/searchcraft-clear-input-button/searchcraft-clear-input-button.js.map

@@ -1 +1 @@
-{"version":3,"file":"searchcraft-clear-input-button.js","sourceRoot":"","sources":["../../../src/components/searchcraft-clear-input-button/searchcraft-clear-input-button.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EACT,KAAK,EAEL,IAAI,EACJ,CAAC,EACD,KAAK,GACN,MAAM,eAAe,CAAC;AACvB,OAAO,UAAU,MAAM,YAAY,CAAC;AAOpC,MAAM,OAAO,2BAA2B;;QAatC,0CAA0C;QAClC,qBAAgB,GAAG,CAAC,KAAiB,EAAE,EAAE;YAC/C,KAAK,CAAC,cAAc,EAAE,CAAC,CAAC,+BAA+B;YACvD,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,CAAC,CAAC,iBAAiB;QAC3C,CAAC,CAAC;4BAhBsB,KAAK;sCACI,KAAK;qBAKrB,OAAO;;IAEhB,YAAY;QAClB,OAAO,IAAI,CAAC,KAAK,KAAK,OAAO,CAAC;IAChC,CAAC;IAQD,MAAM;QACJ,OAAO,IAAI,CAAC,sBAAsB,CAAC,CAAC,CAAC,CACnC,cACE,KAAK,EAAE,UAAU,CAAC,qBAAqB,EAAE,4BAA4B,CAAC,EACtE,OAAO,EAAE,IAAI,CAAC,gBAAgB,EAC9B,IAAI,EAAC,QAAQ,IAEZ,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,CACnB,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,CAClB,oCAA6B,CAC9B,CAAC,CAAC,CAAC,CACF,mCAA4B,CAC7B,CACF,CAAC,CAAC,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,CACtB,kCAA4B,IAAI,EAAC,aAAa,GAAG,CAClD,CAAC,CAAC,CAAC,CACF,kCAA4B,IAAI,EAAC,YAAY,GAAG,CACjD,CACM,CACV,CAAC,CAAC,CAAC,CACF,cACE,KAAK,EAAE,UAAU,CAAC,qBAAqB,EAAE,4BAA4B,CAAC,EACtE,OAAO,EAAE,IAAI,CAAC,gBAAgB,EAC9B,IAAI,EAAC,QAAQ,IAEZ,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,CACnB,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,CAClB,oCAA6B,CAC9B,CAAC,CAAC,CAAC,CACF,mCAA4B,CAC7B,CACF,CAAC,CAAC,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,CACtB,kCAA4B,IAAI,EAAC,aAAa,GAAG,CAClD,CAAC,CAAC,CAAC,CACF,kCAA4B,IAAI,EAAC,YAAY,GAAG,CACjD,CACM,CACV,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["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"]}
+{"version":3,"file":"searchcraft-clear-input-button.js","sourceRoot":"","sources":["../../../src/components/searchcraft-clear-input-button/searchcraft-clear-input-button.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EACT,KAAK,EAEL,IAAI,EACJ,CAAC,EACD,KAAK,GACN,MAAM,eAAe,CAAC;AACvB,OAAO,UAAU,MAAM,YAAY,CAAC;AAOpC,MAAM,OAAO,2BAA2B;;QAY9B,qBAAgB,GAAG,CAAC,KAAiB,EAAE,EAAE;YAC/C,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,CAAC;QACzB,CAAC,CAAC;4BAdsB,KAAK;sCACI,KAAK;qBAIrB,OAAO;;IAEhB,YAAY;QAClB,OAAO,IAAI,CAAC,KAAK,KAAK,OAAO,CAAC;IAChC,CAAC;IAOD,MAAM;QACJ,OAAO,IAAI,CAAC,sBAAsB,CAAC,CAAC,CAAC,CACnC,cACE,KAAK,EAAE,UAAU,CAAC,qBAAqB,EAAE,4BAA4B,CAAC,EACtE,OAAO,EAAE,IAAI,CAAC,gBAAgB,EAC9B,IAAI,EAAC,QAAQ,IAEZ,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,CACnB,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,CAClB,oCAA6B,CAC9B,CAAC,CAAC,CAAC,CACF,mCAA4B,CAC7B,CACF,CAAC,CAAC,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,CACtB,kCAA4B,IAAI,EAAC,aAAa,GAAG,CAClD,CAAC,CAAC,CAAC,CACF,kCAA4B,IAAI,EAAC,YAAY,GAAG,CACjD,CACM,CACV,CAAC,CAAC,CAAC,CACF,cACE,KAAK,EAAE,UAAU,CAAC,qBAAqB,EAAE,4BAA4B,CAAC,EACtE,OAAO,EAAE,IAAI,CAAC,gBAAgB,EAC9B,IAAI,EAAC,QAAQ,IAEZ,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,CACnB,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,CAClB,oCAA6B,CAC9B,CAAC,CAAC,CAAC,CACF,mCAA4B,CAC7B,CACF,CAAC,CAAC,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,CACtB,kCAA4B,IAAI,EAAC,aAAa,GAAG,CAClD,CAAC,CAAC,CAAC,CACF,kCAA4B,IAAI,EAAC,YAAY,GAAG,CACjD,CACM,CACV,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["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  @Event() clearInput: EventEmitter<void>;\n\n  @State() theme = 'light';\n\n  private isLightTheme() {\n    return this.theme === 'light';\n  }\n\n  private handleClearClick = (event: MouseEvent) => {\n    event.preventDefault();\n    this.clearInput.emit();\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"]}

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

@@ -19,10 +19,10 @@ export class SearchcraftFiltersList {
         this.dynamicFilters = [];
         this.initialFilters = [];
         this.isRequesting = false;
-        this.selectedFilters = new Set();
         this.originalFilterCounts = {};
         this.query = '';
         this.resultsCount = 0;
+        this.selectedFilters = new Set();
     }
     connectedCallback() {
         this.unsubscribe = useSearchcraftStore.subscribe((state) => {
@@ -64,10 +64,10 @@ export class SearchcraftFiltersList {
     }
     formatLabel(label) {
         return label
-            .replace(/-/g, ' ') // Replace dashes with spaces
-            .split(' ') // Split words
-            .map((word) => word.charAt(0).toUpperCase() + word.slice(1)) // Capitalize the first letter
-            .join(' '); // Join words back into a single string
+            .replace(/-/g, ' ')
+            .split(' ')
+            .map((word) => word.charAt(0).toUpperCase() + word.slice(1))
+            .join(' ');
     }
     render() {
         if (!this.query || this.resultsCount === 0) {
@@ -81,7 +81,7 @@ export class SearchcraftFiltersList {
         });
         return (h("div", { class: 'filtersList' }, filtersToRender.map((filter) => (h("div", { key: filter.value }, h("label", { class: 'checkboxLabel' }, h("input", { class: 'filterCheckbox', checked: filter.isChecked, onChange: (event) => this.handleFilterChange(filter.value, event.target.checked), type: 'checkbox', value: filter.value }), this.formatLabel(filter.label)), filter.isChecked &&
             filter.children.map((childFilter) => {
-                const childLabel = childFilter.label.split('/').pop(); // Get only the part after the last '/'
+                const childLabel = childFilter.label.split('/').pop();
                 return (h("label", { class: 'childCheckboxLabel', key: childFilter.value, style: { marginLeft: '20px' } }, h("input", { class: 'childFilterCheckbox', checked: this.selectedFilters.has(childFilter.value), onChange: (event) => this.handleFilterChange(childFilter.value, event.target.checked), type: 'checkbox', value: childFilter.value }), this.formatLabel(childLabel || '')));
             }))))));
     }
@@ -127,10 +127,10 @@ export class SearchcraftFiltersList {
             "dynamicFilters": {},
             "initialFilters": {},
             "isRequesting": {},
-            "selectedFilters": {},
             "originalFilterCounts": {},
             "query": {},
-            "resultsCount": {}
+            "resultsCount": {},
+            "selectedFilters": {}
         };
     }
     static get events() {

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

@@ -1 +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() initialFilters: Array<{ label: string; value: string }> = [];\n  @State() isRequesting = false;\n  @State() selectedFilters: Set<string> = new Set();\n  @State() originalFilterCounts: Record<string, string> = {};\n  @State() query = '';\n  @State() resultsCount = 0;\n\n  private searchStore = useSearchcraftStore.getState();\n  unsubscribe: () => void;\n\n  connectedCallback() {\n    this.unsubscribe = useSearchcraftStore.subscribe((state) => {\n      this.isRequesting = state.isRequesting;\n      this.query = state.query || '';\n      this.resultsCount = state.searchResults?.data?.hits?.length || 0;\n\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.section?.counts || {}).map(\n      ([key, count]) => {\n        const filterValue = key;\n        this.originalFilterCounts[filterValue] = `${count}`;\n        return {\n          label: `${key.replace(/^\\//, '')} (${count})`,\n          value: filterValue,\n        };\n      },\n    );\n\n    // Update dynamic filters while preserving the initial filters\n    const updatedFilters = [\n      ...this.initialFilters,\n      ...newFilters.filter(\n        (filter) =>\n          !this.initialFilters.some(\n            (initial) => initial.value === filter.value,\n          ),\n      ),\n    ];\n\n    this.dynamicFilters = updatedFilters;\n\n    // Store the initial filters only once\n    if (this.initialFilters.length === 0) {\n      this.initialFilters = [...updatedFilters];\n    }\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\n    this.filtersUpdated.emit(selectedFiltersArray);\n    this.searchStore.setSelectedFilters(selectedFiltersArray);\n    this.searchStore.search();\n  };\n\n  formatLabel(label: string): string {\n    return label\n      .replace(/-/g, ' ') // Replace dashes with spaces\n      .split(' ') // Split words\n      .map((word) => word.charAt(0).toUpperCase() + word.slice(1)) // Capitalize the first letter\n      .join(' '); // Join words back into a single string\n  }\n\n  render() {\n    if (!this.query || this.resultsCount === 0) {\n      return null;\n    }\n\n    const filtersToRender = this.initialFilters.map((initialFilter) => {\n      const isChecked = this.selectedFilters.has(initialFilter.value);\n      const dynamicChildren = this.dynamicFilters.filter(\n        (dynamicFilter) =>\n          dynamicFilter.value.startsWith(initialFilter.value) &&\n          dynamicFilter.value !== initialFilter.value, // Exclude parent itself\n      );\n      return {\n        ...initialFilter,\n        isChecked,\n        children: dynamicChildren,\n      };\n    });\n\n    return (\n      <div class='filtersList'>\n        {filtersToRender.map((filter) => (\n          <div key={filter.value}>\n            {/* Render the parent filter */}\n            <label class='checkboxLabel'>\n              <input\n                class='filterCheckbox'\n                checked={filter.isChecked}\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              {this.formatLabel(filter.label)}\n            </label>\n\n            {/* Render dynamic child filters underneath the checked parent */}\n            {filter.isChecked &&\n              filter.children.map((childFilter) => {\n                const childLabel = childFilter.label.split('/').pop(); // Get only the part after the last '/'\n                return (\n                  <label\n                    class='childCheckboxLabel'\n                    key={childFilter.value}\n                    style={{ marginLeft: '20px' }} // Add indentation for child filters\n                  >\n                    <input\n                      class='childFilterCheckbox'\n                      checked={this.selectedFilters.has(childFilter.value)}\n                      onChange={(event: Event) =>\n                        this.handleFilterChange(\n                          childFilter.value,\n                          (event.target as HTMLInputElement).checked,\n                        )\n                      }\n                      type='checkbox'\n                      value={childFilter.value}\n                    />\n                    {this.formatLabel(childLabel || '')}\n                  </label>\n                );\n              })}\n          </div>\n        ))}\n      </div>\n    );\n  }\n}\n"]}
+{"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';\n\nimport type { Facets } from '@searchcraft/core';\n\nimport { useSearchcraftStore } from '@provider/store';\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\n  @Event() filtersUpdated: EventEmitter<string[]>;\n\n  @State() dynamicFilters: Array<{ label: string; value: string }> = [];\n  @State() initialFilters: Array<{ label: string; value: string }> = [];\n  @State() isRequesting = false;\n  @State() originalFilterCounts: Record<string, string> = {};\n  @State() query = '';\n  @State() resultsCount = 0;\n  @State() selectedFilters: Set<string> = new Set();\n\n  private searchStore = useSearchcraftStore.getState();\n  unsubscribe: () => void;\n\n  connectedCallback() {\n    this.unsubscribe = useSearchcraftStore.subscribe((state) => {\n      this.isRequesting = state.isRequesting;\n      this.query = state.query || '';\n      this.resultsCount = state.searchResults?.data?.hits?.length || 0;\n\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.section?.counts || {}).map(\n      ([key, count]) => {\n        const filterValue = key;\n        this.originalFilterCounts[filterValue] = `${count}`;\n        return {\n          label: `${key.replace(/^\\//, '')} (${count})`,\n          value: filterValue,\n        };\n      },\n    );\n\n    // Update dynamic filters while preserving the initial filters\n    const updatedFilters = [\n      ...this.initialFilters,\n      ...newFilters.filter(\n        (filter) =>\n          !this.initialFilters.some(\n            (initial) => initial.value === filter.value,\n          ),\n      ),\n    ];\n\n    this.dynamicFilters = updatedFilters;\n\n    // Store the initial filters only once\n    if (this.initialFilters.length === 0) {\n      this.initialFilters = [...updatedFilters];\n    }\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\n    this.filtersUpdated.emit(selectedFiltersArray);\n    this.searchStore.setSelectedFilters(selectedFiltersArray);\n    this.searchStore.search();\n  };\n\n  formatLabel(label: string): string {\n    return label\n      .replace(/-/g, ' ')\n      .split(' ')\n      .map((word) => word.charAt(0).toUpperCase() + word.slice(1))\n      .join(' ');\n  }\n\n  render() {\n    if (!this.query || this.resultsCount === 0) {\n      return null;\n    }\n\n    const filtersToRender = this.initialFilters.map((initialFilter) => {\n      const isChecked = this.selectedFilters.has(initialFilter.value);\n      const dynamicChildren = this.dynamicFilters.filter(\n        (dynamicFilter) =>\n          dynamicFilter.value.startsWith(initialFilter.value) &&\n          dynamicFilter.value !== initialFilter.value, // Exclude parent itself\n      );\n      return {\n        ...initialFilter,\n        isChecked,\n        children: dynamicChildren,\n      };\n    });\n\n    return (\n      <div class='filtersList'>\n        {filtersToRender.map((filter) => (\n          <div key={filter.value}>\n            {/* Render the parent filter */}\n            <label class='checkboxLabel'>\n              <input\n                class='filterCheckbox'\n                checked={filter.isChecked}\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              {this.formatLabel(filter.label)}\n            </label>\n            {filter.isChecked &&\n              filter.children.map((childFilter) => {\n                const childLabel = childFilter.label.split('/').pop();\n                return (\n                  <label\n                    class='childCheckboxLabel'\n                    key={childFilter.value}\n                    style={{ marginLeft: '20px' }}\n                  >\n                    <input\n                      class='childFilterCheckbox'\n                      checked={this.selectedFilters.has(childFilter.value)}\n                      onChange={(event: Event) =>\n                        this.handleFilterChange(\n                          childFilter.value,\n                          (event.target as HTMLInputElement).checked,\n                        )\n                      }\n                      type='checkbox'\n                      value={childFilter.value}\n                    />\n                    {this.formatLabel(childLabel || '')}\n                  </label>\n                );\n              })}\n          </div>\n        ))}\n      </div>\n    );\n  }\n}\n"]}

package/dist/collection/components/searchcraft-input-icon/searchcraft-input-icon.js

@@ -2,8 +2,8 @@ import { h } from "@stencil/core";
 export class SearchcraftInputIcon {
     constructor() {
         this.error = undefined;
-        this.rightToLeftOrientation = false;
         this.height = 20;
+        this.rightToLeftOrientation = false;
         this.width = 20;
         this.theme = 'light';
     }
@@ -39,35 +39,35 @@ export class SearchcraftInputIcon {
                 "optional": true,
                 "docs": {
                     "tags": [],
-                    "text": "Determines if an error icon should be displayed."
+                    "text": ""
                 },
                 "attribute": "error",
                 "reflect": false
             },
-            "rightToLeftOrientation": {
-                "type": "boolean",
+            "height": {
+                "type": "number",
                 "mutable": false,
                 "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
+                    "original": "number",
+                    "resolved": "number",
                     "references": {}
                 },
                 "required": false,
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "Determines if the layout should be right-to-left."
+                    "text": ""
                 },
-                "attribute": "right-to-left-orientation",
+                "attribute": "height",
                 "reflect": false,
-                "defaultValue": "false"
+                "defaultValue": "20"
             },
-            "height": {
-                "type": "number",
+            "rightToLeftOrientation": {
+                "type": "boolean",
                 "mutable": false,
                 "complexType": {
-                    "original": "number",
-                    "resolved": "number",
+                    "original": "boolean",
+                    "resolved": "boolean",
                     "references": {}
                 },
                 "required": false,
@@ -76,9 +76,9 @@ export class SearchcraftInputIcon {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "height",
+                "attribute": "right-to-left-orientation",
                 "reflect": false,
-                "defaultValue": "20"
+                "defaultValue": "false"
             },
             "width": {
                 "type": "number",

package/dist/collection/components/searchcraft-input-icon/searchcraft-input-icon.js.map

@@ -1 +1 @@
-{"version":3,"file":"searchcraft-input-icon.js","sourceRoot":"","sources":["../../../src/components/searchcraft-input-icon/searchcraft-input-icon.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAO1D,MAAM,OAAO,oBAAoB;;;sCASE,KAAK;sBACrB,EAAE;qBACH,EAAE;qBAED,OAAO;;IAEhB,YAAY;QAClB,OAAO,IAAI,CAAC,KAAK,KAAK,OAAO,CAAC;IAChC,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAClB,WACE,KAAK,EAAE,IAAI,CAAC,sBAAsB,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,cAAc,IAEnE,IAAI,CAAC,YAAY,EAAE,CAAC,CAAC,CAAC,CACrB,mCACE,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,IAAI,EAAC,aAAa,EAClB,KAAK,EAAE,IAAI,CAAC,KAAK,GACjB,CACH,CAAC,CAAC,CAAC,CACF,mCACE,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,IAAI,EAAC,YAAY,EACjB,KAAK,EAAE,IAAI,CAAC,KAAK,GACjB,CACH,CACG,CACP,CAAC,CAAC,CAAC,CACF,WACE,KAAK,EAAE,IAAI,CAAC,sBAAsB,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,cAAc,IAEnE,IAAI,CAAC,YAAY,EAAE,CAAC,CAAC,CAAC,CACrB,mCACE,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,IAAI,EAAC,cAAc,EACnB,KAAK,EAAE,IAAI,CAAC,KAAK,GACjB,CACH,CAAC,CAAC,CAAC,CACF,mCACE,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,IAAI,EAAC,aAAa,EAClB,KAAK,EAAE,IAAI,CAAC,KAAK,GACjB,CACH,CACG,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["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  /**\n   * Determines if an error icon should be displayed.\n   */\n  @Prop() error?: boolean;\n\n  /**\n   * Determines if the layout should be right-to-left.\n   */\n  @Prop() rightToLeftOrientation = false;\n  @Prop() height = 20;\n  @Prop() width = 20;\n\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\n            height={this.height}\n            type='error-light'\n            width={this.width}\n          />\n        ) : (\n          <searchcraft-search-icon-set\n            height={this.height}\n            type='error-dark'\n            width={this.width}\n          />\n        )}\n      </div>\n    ) : (\n      <div\n        class={this.rightToLeftOrientation ? 'inputIconRTL' : 'inputIconLTR'}\n      >\n        {this.isLightTheme() ? (\n          <searchcraft-search-icon-set\n            height={this.height}\n            type='search-light'\n            width={this.width}\n          />\n        ) : (\n          <searchcraft-search-icon-set\n            height={this.height}\n            type='search-dark'\n            width={this.width}\n          />\n        )}\n      </div>\n    );\n  }\n}\n"]}
+{"version":3,"file":"searchcraft-input-icon.js","sourceRoot":"","sources":["../../../src/components/searchcraft-input-icon/searchcraft-input-icon.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAO1D,MAAM,OAAO,oBAAoB;;;sBAEd,EAAE;sCACc,KAAK;qBACtB,EAAE;qBAED,OAAO;;IAEhB,YAAY;QAClB,OAAO,IAAI,CAAC,KAAK,KAAK,OAAO,CAAC;IAChC,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAClB,WACE,KAAK,EAAE,IAAI,CAAC,sBAAsB,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,cAAc,IAEnE,IAAI,CAAC,YAAY,EAAE,CAAC,CAAC,CAAC,CACrB,mCACE,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,IAAI,EAAC,aAAa,EAClB,KAAK,EAAE,IAAI,CAAC,KAAK,GACjB,CACH,CAAC,CAAC,CAAC,CACF,mCACE,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,IAAI,EAAC,YAAY,EACjB,KAAK,EAAE,IAAI,CAAC,KAAK,GACjB,CACH,CACG,CACP,CAAC,CAAC,CAAC,CACF,WACE,KAAK,EAAE,IAAI,CAAC,sBAAsB,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,cAAc,IAEnE,IAAI,CAAC,YAAY,EAAE,CAAC,CAAC,CAAC,CACrB,mCACE,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,IAAI,EAAC,cAAc,EACnB,KAAK,EAAE,IAAI,CAAC,KAAK,GACjB,CACH,CAAC,CAAC,CAAC,CACF,mCACE,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,IAAI,EAAC,aAAa,EAClB,KAAK,EAAE,IAAI,CAAC,KAAK,GACjB,CACH,CACG,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["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() height = 20;\n  @Prop() rightToLeftOrientation = false;\n  @Prop() width = 20;\n\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\n            height={this.height}\n            type='error-light'\n            width={this.width}\n          />\n        ) : (\n          <searchcraft-search-icon-set\n            height={this.height}\n            type='error-dark'\n            width={this.width}\n          />\n        )}\n      </div>\n    ) : (\n      <div\n        class={this.rightToLeftOrientation ? 'inputIconRTL' : 'inputIconLTR'}\n      >\n        {this.isLightTheme() ? (\n          <searchcraft-search-icon-set\n            height={this.height}\n            type='search-light'\n            width={this.width}\n          />\n        ) : (\n          <searchcraft-search-icon-set\n            height={this.height}\n            type='search-dark'\n            width={this.width}\n          />\n        )}\n      </div>\n    );\n  }\n}\n"]}

package/dist/collection/components/searchcraft-input-label/searchcraft-input-label.js

@@ -10,7 +10,6 @@ export class SearchcraftInputLabel {
         return this.theme === 'light';
     }
     render() {
-        // Render nothing if no label prop is provided
         if (!this.label) {
             return null;
         }

package/dist/collection/components/searchcraft-input-label/searchcraft-input-label.js.map

@@ -1 +1 @@
-{"version":3,"file":"searchcraft-input-label.js","sourceRoot":"","sources":["../../../src/components/searchcraft-input-label/searchcraft-input-label.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAC1D,OAAO,UAAU,MAAM,YAAY,CAAC;AAOpC,MAAM,OAAO,qBAAqB;;mCACD,EAAE;;qBAEhB,OAAO;;IAEhB,YAAY;QAClB,OAAO,IAAI,CAAC,KAAK,KAAK,OAAO,CAAC;IAChC,CAAC;IAED,MAAM;QACJ,8CAA8C;QAC9C,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC;YAChB,OAAO,IAAI,CAAC;QACd,CAAC;QAED,MAAM,UAAU,GAAG,IAAI,CAAC,YAAY,EAAE,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,WAAW,CAAC;QAEpE,OAAO,CACL,aACE,KAAK,EAAE,UAAU,CAAC,UAAU,EAAE,IAAI,CAAC,mBAAmB,CAAC,EACvD,OAAO,EAAC,sBAAsB,IAE7B,IAAI,CAAC,KAAK,CACL,CACT,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["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"]}
+{"version":3,"file":"searchcraft-input-label.js","sourceRoot":"","sources":["../../../src/components/searchcraft-input-label/searchcraft-input-label.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAC1D,OAAO,UAAU,MAAM,YAAY,CAAC;AAOpC,MAAM,OAAO,qBAAqB;;mCACD,EAAE;;qBAEhB,OAAO;;IAEhB,YAAY;QAClB,OAAO,IAAI,CAAC,KAAK,KAAK,OAAO,CAAC;IAChC,CAAC;IAED,MAAM;QACJ,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC;YAChB,OAAO,IAAI,CAAC;QACd,CAAC;QACD,MAAM,UAAU,GAAG,IAAI,CAAC,YAAY,EAAE,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,WAAW,CAAC;QACpE,OAAO,CACL,aACE,KAAK,EAAE,UAAU,CAAC,UAAU,EAAE,IAAI,CAAC,mBAAmB,CAAC,EACvD,OAAO,EAAC,sBAAsB,IAE7B,IAAI,CAAC,KAAK,CACL,CACT,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["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;\n  @State() theme = 'light';\n\n  private isLightTheme() {\n    return this.theme === 'light';\n  }\n\n  render() {\n    if (!this.label) {\n      return null;\n    }\n    const labelStyle = this.isLightTheme() ? 'labelLight' : 'labelDark';\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"]}

package/dist/collection/components/searchcraft-results-info/searchcraft-results-info.module.css

@@ -7,7 +7,6 @@
 
 .resultsInfo {
   color: #292929;
-  font-family: "Brygada 1918";
   font-size: 18px;
   font-weight: 600;
   line-height: 20px;

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

@@ -27,13 +27,13 @@ export class SearchcraftSlider {
             this.endYear = Math.max(value, this.startYear);
             this.updateYears();
         };
-        this.minYear = 2000;
         this.maxYear = new Date().getFullYear();
+        this.minYear = 2014;
         this.endYear = this.maxYear;
-        this.query = '';
-        this.startYear = this.minYear;
         this.hasSearched = false;
+        this.query = '';
         this.resultsCount = 0;
+        this.startYear = this.minYear;
     }
     componentDidLoad() {
         this.unsubscribe = useSearchcraftStore.subscribe((state) => {
@@ -54,7 +54,14 @@ export class SearchcraftSlider {
         if (!this.query || this.resultsCount === 0) {
             return null;
         }
-        return (h("div", { class: 'slider-container' }, h("div", { class: 'range-container' }, h("input", { class: 'range-slider', max: this.maxYear, min: this.minYear, onInput: this.handleStartYearChange, step: '1', type: 'range', value: this.startYear }), h("input", { class: 'range-slider', max: this.maxYear, min: this.minYear, onInput: this.handleEndYearChange, step: '1', type: 'range', value: this.endYear })), h("div", { class: 'year-labels' }, h("span", { class: 'year-label' }, this.startYear), h("span", { class: 'year-label' }, this.endYear))));
+        const rangeMin = this.minYear;
+        const rangeMax = this.maxYear;
+        const startPercent = ((this.startYear - rangeMin) / (rangeMax - rangeMin)) * 100;
+        const endPercent = ((this.endYear - rangeMin) / (rangeMax - rangeMin)) * 100;
+        return (h("div", { class: 'sliderContainer' }, h("div", { class: 'rangeContainer' }, h("div", { class: 'activeRange', style: {
+                left: `${startPercent}%`,
+                width: `${endPercent - startPercent}%`,
+            } }), h("input", { class: 'rangeSlider', max: this.maxYear, min: this.minYear, onInput: this.handleStartYearChange, step: '1', type: 'range', value: this.startYear }), h("input", { class: 'rangeSlider', max: this.maxYear, min: this.minYear, onInput: this.handleEndYearChange, step: '1', type: 'range', value: this.endYear })), h("div", { class: 'yearLabels' }, h("span", { class: 'yearLabel' }, this.startYear), h("span", { class: 'yearLabel' }, this.endYear))));
     }
     static get is() { return "searchcraft-slider"; }
     static get encapsulation() { return "shadow"; }
@@ -70,7 +77,7 @@ export class SearchcraftSlider {
     }
     static get properties() {
         return {
-            "minYear": {
+            "maxYear": {
                 "type": "number",
                 "mutable": false,
                 "complexType": {
@@ -84,11 +91,11 @@ export class SearchcraftSlider {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "min-year",
+                "attribute": "max-year",
                 "reflect": false,
-                "defaultValue": "2000"
+                "defaultValue": "new Date().getFullYear()"
             },
-            "maxYear": {
+            "minYear": {
                 "type": "number",
                 "mutable": false,
                 "complexType": {
@@ -102,19 +109,19 @@ export class SearchcraftSlider {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "max-year",
+                "attribute": "min-year",
                 "reflect": false,
-                "defaultValue": "new Date().getFullYear()"
+                "defaultValue": "2014"
             }
         };
     }
     static get states() {
         return {
             "endYear": {},
-            "query": {},
-            "startYear": {},
             "hasSearched": {},
-            "resultsCount": {}
+            "query": {},
+            "resultsCount": {},
+            "startYear": {}
         };
     }
 }

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

@@ -1 +1 @@
-{"version":3,"file":"searchcraft-slider.js","sourceRoot":"","sources":["../../../src/components/searchcraft-slider/searchcraft-slider.tsx"],"names":[],"mappings":"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","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() endYear = this.maxYear;\n  @State() query = '';\n  @State() startYear = this.minYear;\n  @State() hasSearched = false;\n  unsubscribe: () => void;\n  private searchStore = useSearchcraftStore.getState();\n  @State() resultsCount = 0; // Track the count of search results\n\n  componentDidLoad() {\n    this.unsubscribe = useSearchcraftStore.subscribe((state) => {\n      if (state.query.length > 0) {\n        this.hasSearched = true;\n        this.resultsCount = state.searchResults?.data?.hits?.length || 0;\n      }\n      this.query = state.query;\n    });\n  }\n\n  disconnectedCallback() {\n    if (this.unsubscribe) {\n      this.unsubscribe();\n    }\n  }\n\n  private updateYears = async () => {\n    this.searchStore.setYearsRange([this.startYear, this.endYear]);\n\n    try {\n      if (typeof this.query === 'string' && this.query.trim() !== '') {\n        await this.searchStore.search();\n      } else {\n        console.warn('Query is missing or empty, skipping search request.');\n      }\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    if (!this.query || this.resultsCount === 0) {\n      return null;\n    }\n    return (\n      <div class='slider-container'>\n        <div class='range-container'>\n          <input\n            class='range-slider'\n            max={this.maxYear}\n            min={this.minYear}\n            onInput={this.handleStartYearChange}\n            step='1'\n            type='range'\n            value={this.startYear}\n          />\n          <input\n            class='range-slider'\n            max={this.maxYear}\n            min={this.minYear}\n            onInput={this.handleEndYearChange}\n            step='1'\n            type='range'\n            value={this.endYear}\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"]}
+{"version":3,"file":"searchcraft-slider.js","sourceRoot":"","sources":["../../../src/components/searchcraft-slider/searchcraft-slider.tsx"],"names":[],"mappings":"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","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() maxYear = new Date().getFullYear();\n  @Prop() minYear = 2014;\n\n  @State() endYear = this.maxYear;\n  @State() hasSearched = false;\n  @State() query = '';\n  @State() resultsCount = 0;\n  @State() startYear = this.minYear;\n\n  private searchStore = useSearchcraftStore.getState();\n\n  unsubscribe: () => void;\n\n  componentDidLoad() {\n    this.unsubscribe = useSearchcraftStore.subscribe((state) => {\n      if (state.query.length > 0) {\n        this.hasSearched = true;\n        this.resultsCount = state.searchResults?.data?.hits?.length || 0;\n      }\n      this.query = state.query;\n    });\n  }\n\n  disconnectedCallback() {\n    if (this.unsubscribe) {\n      this.unsubscribe();\n    }\n  }\n\n  private updateYears = async () => {\n    this.searchStore.setYearsRange([this.startYear, this.endYear]);\n\n    try {\n      if (typeof this.query === 'string' && this.query.trim() !== '') {\n        await this.searchStore.search();\n      } else {\n        console.warn('Query is missing or empty, skipping search request.');\n      }\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    if (!this.query || this.resultsCount === 0) {\n      return null;\n    }\n\n    const rangeMin = this.minYear;\n    const rangeMax = this.maxYear;\n    const startPercent =\n      ((this.startYear - rangeMin) / (rangeMax - rangeMin)) * 100;\n    const endPercent =\n      ((this.endYear - rangeMin) / (rangeMax - rangeMin)) * 100;\n\n    return (\n      <div class='sliderContainer'>\n        <div class='rangeContainer'>\n          <div\n            class='activeRange'\n            style={{\n              left: `${startPercent}%`,\n              width: `${endPercent - startPercent}%`,\n            }}\n          />\n          <input\n            class='rangeSlider'\n            max={this.maxYear}\n            min={this.minYear}\n            onInput={this.handleStartYearChange}\n            step='1'\n            type='range'\n            value={this.startYear}\n          />\n          <input\n            class='rangeSlider'\n            max={this.maxYear}\n            min={this.minYear}\n            onInput={this.handleEndYearChange}\n            step='1'\n            type='range'\n            value={this.endYear}\n          />\n        </div>\n        <div class='yearLabels'>\n          <span class='yearLabel'>{this.startYear}</span>\n          <span class='yearLabel'>{this.endYear}</span>\n        </div>\n      </div>\n    );\n  }\n}\n"]}

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

@@ -1,77 +1,68 @@
-.slider-container {
+.sliderContainer {
   display: flex;
   flex-direction: column;
   gap: 10px;
   font-family: Arial, sans-serif;
   align-items: center;
+  width: 100%;
 }
 
-label {
-  font-size: 14px;
-  font-weight: bold;
-  margin-bottom: 10px;
-}
-
-.range-container {
+.rangeContainer {
   display: flex;
+  position: relative;
   width: 100%;
   align-items: center;
 }
-
-.range-slider {
+.rangeContainer .activeRange {
+  position: absolute;
+  top: 50%;
+  transform: translateY(-50%);
+  height: 4px;
+  background: #007DB3;
+  z-index: 0;
+  border-radius: 2px;
+}
+.rangeContainer .rangeSlider {
   width: 100%;
   height: 4px;
-  background: #ddd;
+  background: transparent;
   border-radius: 2px;
   outline: none;
-  margin: 0 -1px;
-  position: relative;
-}
-
-.range-slider::-webkit-slider-thumb {
   -webkit-appearance: none;
   appearance: none;
+  position: absolute;
+  margin: 0;
+}
+.rangeContainer .rangeSlider::-webkit-slider-thumb {
+  -webkit-appearance: none;
   width: 20px;
   height: 20px;
   background-color: #FFF;
   border-radius: 50%;
-  border: 1px solid #E6E6E6;
+  border: 2px solid #e6e6e6;
   cursor: pointer;
-  position: relative;
 }
-
-.range-slider::-moz-range-thumb {
+.rangeContainer .rangeSlider::-moz-range-thumb {
   width: 20px;
   height: 20px;
   background-color: #FFF;
   border-radius: 50%;
-  border: 1px solid #E6E6E6;
+  border: 2px solid #e6e6e6;
   cursor: pointer;
 }
 
-.range-slider:before {
-  content: "";
-  position: absolute;
-  height: 4px;
-  background-color: #FFF;
-  border-radius: 2px;
-  left: 0;
-  right: 0;
-  z-index: -1;
-}
-
-.year-labels {
+.yearLabels {
   display: flex;
   justify-content: space-between;
   width: 100%;
   margin-top: 10px;
   font-size: 15px;
   font-weight: 600;
-  font-family: "Source Sans Pro";
+  font-family: "Source Sans Pro", sans-serif;
   color: #666;
 }
 
-.year-label {
+.yearLabel {
   min-width: 30px;
   text-align: center;
 }

package/dist/collection/components/searchcraft-spinner-dark/searchcraft-spinner-dark.module.css

@@ -5,21 +5,21 @@
 }
 
 .spinnerDark {
-  height: 100%;
-  width: 100%;
+  animation: spinning 1s linear infinite;
   background: conic-gradient(#000 50%, #FFFFFF);
   clip-path: circle(50%);
+  height: 100%;
   mask-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 6.6666666667px, rgb(0, 0, 0) 6.6666666667px);
-  animation: spinning 1s linear infinite;
+  width: 100%;
 }
 
 .spinnerLight {
-  height: 100%;
-  width: 100%;
+  animation: spinning 1s linear infinite;
   background: conic-gradient(#737373 50%, #FFFFFF);
   clip-path: circle(50%);
+  height: 100%;
   mask-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 6.6666666667px, rgb(0, 0, 0) 6.6666666667px);
-  animation: spinning 1s linear infinite;
+  width: 100%;
 }
 
 @keyframes spinning {

package/dist/collection/components/searchcraft-spinner-light/searchcraft-spinner-light.module.css

@@ -5,12 +5,12 @@
 }
 
 .spinnerLight {
-  height: 100%;
-  width: 100%;
+  animation: spinning 1s linear infinite;
   background: conic-gradient(#737373 50%, #FFFFFF);
   clip-path: circle(50%);
+  height: 100%;
   mask-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 6.6666666667px, rgb(0, 0, 0) 6.6666666667px);
-  animation: spinning 1s linear infinite;
+  width: 100%;
 }
 
 @keyframes spinning {

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

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

package/dist/collection/index.js

@@ -7,8 +7,6 @@
  * DO NOT use this file to export your components. Instead, use the recommended approaches
  * to consume components of this package as outlined in the `README.md`.
  */
-// Export utility functions
 export { extractDynamicProperties, parseCustomStyles, parseSearchKeys, serializeStyles, } from './utils/utils';
-// Export Zustand store and useTheme hook
 export { useSearchcraftStore, useThemeStore } from './provider/store';
 //# sourceMappingURL=index.js.map

package/dist/collection/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAIH,2BAA2B;AAC3B,OAAO,EACL,wBAAwB,EACxB,iBAAiB,EACjB,eAAe,EACf,eAAe,GAChB,MAAM,eAAe,CAAC;AAEvB,yCAAyC;AACzC,OAAO,EAAE,mBAAmB,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC","sourcesContent":["/**\n * @fileoverview entry point for your component library\n *\n * This is the entry point for your component library. Use this file to export utilities,\n * constants or data structure that accompany your components.\n *\n * DO NOT use this file to export your components. Instead, use the recommended approaches\n * to consume components of this package as outlined in the `README.md`.\n */\n\nexport type * from './components';\n\n// Export utility functions\nexport {\n  extractDynamicProperties,\n  parseCustomStyles,\n  parseSearchKeys,\n  serializeStyles,\n} from './utils/utils';\n\n// Export Zustand store and useTheme hook\nexport { useSearchcraftStore, useThemeStore } from './provider/store';\n\nexport { Components } from './components';\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAIH,OAAO,EACL,wBAAwB,EACxB,iBAAiB,EACjB,eAAe,EACf,eAAe,GAChB,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,mBAAmB,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC","sourcesContent":["/**\n * @fileoverview entry point for your component library\n *\n * This is the entry point for your component library. Use this file to export utilities,\n * constants or data structure that accompany your components.\n *\n * DO NOT use this file to export your components. Instead, use the recommended approaches\n * to consume components of this package as outlined in the `README.md`.\n */\n\nexport type * from './components';\n\nexport {\n  extractDynamicProperties,\n  parseCustomStyles,\n  parseSearchKeys,\n  serializeStyles,\n} from './utils/utils';\n\nexport { useSearchcraftStore, useThemeStore } from './provider/store';\n\nexport { Components } from './components';\n"]}

package/dist/collection/provider/store.js

@@ -27,7 +27,7 @@ const useSearchcraftStore = create((set, get) => {
         isRequesting: false,
         searchResults: null,
         facets: null,
-        selectedFilters: [], // Initialize selected filters as an empty array
+        selectedFilters: [],
         searchParams: {
             mode: 'fuzzy',
             sort: 'asc',
@@ -35,7 +35,7 @@ const useSearchcraftStore = create((set, get) => {
         setQuery: (query) => set({ query }),
         setSearchResults: (results) => set({ searchResults: results }),
         setFacets: (facets) => set({ facets }),
-        setSelectedFilters: (filters) => set({ selectedFilters: filters }), // Update the selected filters
+        setSelectedFilters: (filters) => set({ selectedFilters: filters }),
         setIsRequesting: (isRequesting) => set({ isRequesting }),
         setSearchParams: (params) => set((state) => ({
             searchParams: Object.assign(Object.assign({}, state.searchParams), params),
@@ -87,11 +87,9 @@ const useSearchcraftStore = create((set, get) => {
         },
     };
 });
-// Zustand store for Theme state
 const useThemeStore = create((set) => ({
     theme: 'light',
     toggleTheme: () => set((state) => ({ theme: state.theme === 'light' ? 'dark' : 'light' })),
 }));
-// Export the Zustand stores for use in Stencil components
 export { useSearchcraftStore, useThemeStore };
 //# sourceMappingURL=store.js.map