npm - @searchcraft/javascript-sdk - Versions diffs - 0.7.2 → 0.8.1 - Mend

@searchcraft/javascript-sdk 0.7.2 → 0.8.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (306) hide show

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

	@@ -1 +1 @@
1	- {"version":3,"file":"searchcraft-facet-list.js","sourceRoot":"","sources":["../../../../src/components/searchcraft-facet-list/searchcraft-facet-list.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n h,\n State,\n Prop,\n Event,\n type EventEmitter,\n Fragment,\n} from '@stencil/core';\nimport classNames from 'classnames';\n\nimport type { FacetChild, FacetRoot } from '@searchcraft/core';\n\nimport { useSearchcraftStore, type SearchcraftState } from '@provider/store';\nimport { mergeFacetRoots, removeSubstringMatches } from '@utils';\n\n/*\n This web component is designed to display facets in a search interface, allowing users to refine their search results by applying filters based on various attributes.\n * It is consumed within the `searchcraft-filter-panel`.\n \n ## Usage\n * ```html\n * <!-- index.html -->\n * <searchcraft-facet-list field-name=\"title\" />\n * ```\n \n ```js\n * // index.js\n * const facetList = document.querySelector('searchcraft-facet-list');\n \n facetList.addEventListener('facetSelectionUpdated', () => {\n * console.log('Facet selection updated');\n * });\n * ```\n /\n@Component({\n tag: 'searchcraft-facet-list',\n shadow: false,\n})\nexport class SearchcraftFacetList {\n /\n The name of the field where facets are applied.\n /\n @Prop() fieldName = '';\n\n /\n When the facets are updated.\n /\n @Event() facetSelectionUpdated?: EventEmitter<{ paths: string[] }>;\n\n @State() baseFacetRoot: FacetRoot \| undefined;\n @State() facetRoot: FacetRoot \| undefined;\n @State() selectedPaths: Record<string, boolean> = {};\n @State() lastTimeTaken: number \| undefined;\n @State() hasNewSearchTerm = false;\n\n @State() lastQuery: string \| undefined;\n @State() lastSearchMode: string \| undefined;\n @State() lastSortType: string \| undefined;\n\n @State() unsubscribe: (() => void) \| undefined;\n\n private searchStore = useSearchcraftStore.getState();\n\n handleStateUpdate(state: SearchcraftState) {\n const facetPrime = state.searchResults?.data.facets;\n const timeTaken = state.searchResults?.data.time_taken;\n\n if (!this.fieldName) {\n return;\n }\n\n /* Things to do when the state's search term has changed, but before the response received /\n if (\n state.query !== this.lastQuery \|\|\n state.searchMode !== this.lastSearchMode \|\|\n state.sortType !== this.lastSortType\n ) {\n this.selectedPaths = {};\n this.hasNewSearchTerm = true;\n }\n\n /* Things to do when a new response with a new facet prime has been received /\n if (timeTaken !== this.lastTimeTaken && facetPrime) {\n this.facetRoot = undefined;\n const incomingFacetRoot: FacetRoot \| undefined = facetPrime.find(\n (facet) => this.fieldName === Object.keys(facet)[0],\n );\n\n /* Data is from a new search term: completely override our facets /\n if (this.hasNewSearchTerm) {\n this.baseFacetRoot = incomingFacetRoot;\n this.facetRoot = incomingFacetRoot;\n this.hasNewSearchTerm = false;\n } else if (this.baseFacetRoot && incomingFacetRoot) {\n /* Data is from an existing search term, merge the facets together /\n this.facetRoot = mergeFacetRoots(\n this.fieldName,\n this.baseFacetRoot,\n incomingFacetRoot,\n );\n }\n }\n\n this.lastQuery = state.query;\n this.lastSearchMode = state.searchMode;\n this.lastSortType = state.sortType;\n this.lastTimeTaken = timeTaken;\n }\n\n connectedCallback() {\n this.handleStateUpdate(this.searchStore);\n\n this.unsubscribe = useSearchcraftStore.subscribe((state) => {\n this.handleStateUpdate(state);\n });\n }\n\n disconnectedCallback() {\n this.unsubscribe?.();\n }\n\n handleCheckboxChange(path: string) {\n const isCheckboxChecked = !this.selectedPaths[path];\n\n if (isCheckboxChecked) {\n /\n Checkbox Checked: Add to the selectedPaths record\n * Uses spread operator here so UI updates.\n /\n this.selectedPaths = {\n ...this.selectedPaths,\n [path]: true,\n };\n } else {\n /\n Checkbox Uncheck: Remove any paths and sub-paths\n /\n const updatedPaths = Object.keys(this.selectedPaths).filter(\n (testPath) => !testPath.includes(path),\n );\n\n this.selectedPaths = updatedPaths.reduce(\n (acc, str) => {\n acc[str] = true;\n return acc;\n },\n {} as Record<string, boolean>,\n );\n }\n\n /\n Emit the paths array, with parent paths removed.\n */\n const paths = Object.keys(this.selectedPaths).filter(\n (path) => this.selectedPaths[path],\n );\n const pathsWithParentPathsRemoved = removeSubstringMatches(paths);\n\n this.facetSelectionUpdated?.emit({ paths: pathsWithParentPathsRemoved });\n }\n\n formatLabel = (facetChild: FacetChild): string => {\n const label = facetChild.path.replace(/^\\//, '');\n const count = facetChild.count;\n return `${label.replace(/-/g, ' ').replace(/\\b\\w/g, (char) => char.toUpperCase())} (${count})`;\n };\n\n formatSubLabel = (\n facetChild: FacetChild,\n facetChildAncestor: FacetChild,\n ): string => {\n const facetChildPath = facetChild.path.substring(\n facetChildAncestor.path.length,\n );\n const label = facetChildPath.replace(/^\\//, '');\n const count = facetChild.count;\n return `${label.replace(/-/g, ' ').replace(/\\b\\w/g, (char) => char.toUpperCase())} (${count})`;\n };\n\n render() {\n if (!this.fieldName) {\n return;\n }\n\n const firstFacet = this.facetRoot?.[this.fieldName];\n\n return (\n <div\n class={classNames(\n 'filtersListContainer',\n 'searchcraft-filters-list-container',\n )}\n >\n {!firstFacet && (\n <p class='searchcraft-facet-message'>\n Enter a search to view facets.\n </p>\n )}\n {firstFacet?.map((facetChild: FacetChild) => {\n const isChildSelected = facetChild.children\n ? facetChild.children?.some(\n (child) => this.selectedPaths[child.path],\n )\n : false;\n\n return (\n <div\n key={facetChild.path}\n class={classNames('searchcraft-filters-list-item')}\n >\n <label\n class={classNames(\n 'filterCheckboxLabel',\n 'searchcraft-filters-list-checkbox-label',\n )}\n >\n <input\n checked={this.selectedPaths[facetChild.path]}\n onChange={(_event: Event) =>\n this.handleCheckboxChange(facetChild.path)\n }\n type='checkbox'\n />\n {isChildSelected ? (\n <div\n class={classNames(\n 'dashContainer',\n 'searchcraft-filter-list-dash-container',\n )}\n >\n <searchcraft-dash-icon />\n </div>\n ) : (\n <div\n class={classNames(\n 'checkContainer',\n 'searchcraft-filter-list-check-container',\n )}\n >\n <searchcraft-check-icon />\n </div>\n )}\n {this.formatLabel(facetChild)}\n </label>\n {facetChild.children && facetChild.children.length > 0 && (\n <Fragment>\n {facetChild.children.map((grandchild) => (\n <label\n key={grandchild.path}\n class={classNames(\n 'childFilterCheckboxLabel',\n 'searchcraft-child-filter-checkbox-label',\n )}\n style={{\n display: this.selectedPaths[facetChild.path]\n ? 'flex'\n : 'none',\n }}\n >\n <input\n checked={this.selectedPaths[grandchild.path]}\n onChange={(_event: Event) => {\n this.handleCheckboxChange(grandchild.path);\n }}\n type='checkbox'\n />\n <div\n class={classNames(\n 'checkContainer',\n 'searchcraft-filter-list-check-container',\n )}\n >\n <searchcraft-check-icon />\n </div>\n {this.formatSubLabel(grandchild, facetChild)}\n </label>\n ))}\n </Fragment>\n )}\n </div>\n );\n })}\n </div>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"searchcraft-facet-list.js","sourceRoot":"","sources":["../../../../src/components/searchcraft-facet-list/searchcraft-facet-list.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n h,\n State,\n Prop,\n Event,\n type EventEmitter,\n Fragment,\n} from '@stencil/core';\nimport classNames from 'classnames';\n\nimport type { FacetChild, FacetRoot } from '@searchcraft/core';\n\nimport { useSearchcraftStore, type SearchcraftState } from '@provider/store';\nimport { mergeFacetRoots, removeSubstringMatches } from '@utils';\n\n/*\n This web component is designed to display facets in a search interface, allowing users to refine their search results by applying filters based on various attributes.\n * It is consumed within the `searchcraft-filter-panel`.\n \n ## Usage\n * ```html\n * <!-- index.html -->\n * <searchcraft-facet-list field-name=\"title\" />\n * ```\n \n ```js\n * // index.js\n * const facetList = document.querySelector('searchcraft-facet-list');\n \n facetList.addEventListener('facetSelectionUpdated', () => {\n * console.log('Facet selection updated');\n * });\n * ```\n /\n@Component({\n tag: 'searchcraft-facet-list',\n shadow: false,\n})\nexport class SearchcraftFacetList {\n /\n The name of the field where facets are applied.\n /\n @Prop() fieldName = '';\n\n /\n When the facets are updated.\n /\n @Event() facetSelectionUpdated?: EventEmitter<{ paths: string[] }>;\n\n @State() baseFacetRoot: FacetRoot \| undefined;\n @State() facetRoot: FacetRoot \| undefined;\n @State() selectedPaths: Record<string, boolean> = {};\n @State() lastTimeTaken: number \| undefined;\n @State() hasNewSearchTerm = false;\n\n @State() lastSearchTerm: string \| undefined;\n @State() lastSearchMode: string \| undefined;\n @State() lastSortType: string \| undefined;\n\n @State() unsubscribe: (() => void) \| undefined;\n\n private searchStore = useSearchcraftStore.getState();\n\n handleStateUpdate(state: SearchcraftState) {\n const facetPrime = state.searchResponseFacetPrime;\n const timeTaken = state.searchResponseTimeTaken;\n\n if (!this.fieldName) {\n return;\n }\n\n /* Things to do when the state's search term has changed, but before the response received /\n if (\n state.searchTerm !== this.lastSearchTerm \|\|\n state.searchMode !== this.lastSearchMode \|\|\n state.sortType !== this.lastSortType\n ) {\n this.selectedPaths = {};\n this.hasNewSearchTerm = true;\n }\n\n /* Things to do when a new response with a new facet prime has been received /\n if (timeTaken !== this.lastTimeTaken && facetPrime) {\n this.facetRoot = undefined;\n const incomingFacetRoot: FacetRoot \| undefined = facetPrime.find(\n (facet) => this.fieldName === Object.keys(facet)[0],\n );\n\n /* Data is from a new search term: completely override our facets /\n if (this.hasNewSearchTerm) {\n this.baseFacetRoot = incomingFacetRoot;\n this.facetRoot = incomingFacetRoot;\n this.hasNewSearchTerm = false;\n } else if (this.baseFacetRoot && incomingFacetRoot) {\n /* Data is from an existing search term, merge the facets together /\n this.facetRoot = mergeFacetRoots(\n this.fieldName,\n this.baseFacetRoot,\n incomingFacetRoot,\n );\n }\n }\n\n this.lastSearchTerm = state.searchTerm;\n this.lastSearchMode = state.searchMode;\n this.lastSortType = state.sortType;\n this.lastTimeTaken = timeTaken;\n }\n\n connectedCallback() {\n this.handleStateUpdate(this.searchStore);\n\n this.unsubscribe = useSearchcraftStore.subscribe((state) => {\n this.handleStateUpdate(state);\n });\n }\n\n disconnectedCallback() {\n this.unsubscribe?.();\n }\n\n handleCheckboxChange(path: string) {\n const isCheckboxChecked = !this.selectedPaths[path];\n\n if (isCheckboxChecked) {\n /\n Checkbox Checked: Add to the selectedPaths record\n * Uses spread operator here so UI updates.\n /\n this.selectedPaths = {\n ...this.selectedPaths,\n [path]: true,\n };\n } else {\n /\n Checkbox Uncheck: Remove any paths and sub-paths\n /\n const updatedPaths = Object.keys(this.selectedPaths).filter(\n (testPath) => !testPath.includes(path),\n );\n\n this.selectedPaths = updatedPaths.reduce(\n (acc, str) => {\n acc[str] = true;\n return acc;\n },\n {} as Record<string, boolean>,\n );\n }\n\n /\n Emit the paths array, with parent paths removed.\n */\n const paths = Object.keys(this.selectedPaths).filter(\n (path) => this.selectedPaths[path],\n );\n const pathsWithParentPathsRemoved = removeSubstringMatches(paths);\n\n this.facetSelectionUpdated?.emit({ paths: pathsWithParentPathsRemoved });\n }\n\n formatLabel = (facetChild: FacetChild): string => {\n const label = facetChild.path.replace(/^\\//, '');\n const count = facetChild.count;\n return `${label.replace(/-/g, ' ').replace(/\\b\\w/g, (char) => char.toUpperCase())} (${count})`;\n };\n\n formatSubLabel = (\n facetChild: FacetChild,\n facetChildAncestor: FacetChild,\n ): string => {\n const facetChildPath = facetChild.path.substring(\n facetChildAncestor.path.length,\n );\n const label = facetChildPath.replace(/^\\//, '');\n const count = facetChild.count;\n return `${label.replace(/-/g, ' ').replace(/\\b\\w/g, (char) => char.toUpperCase())} (${count})`;\n };\n\n render() {\n if (!this.fieldName) {\n return;\n }\n\n const firstFacet = this.facetRoot?.[this.fieldName];\n\n return (\n <div\n class={classNames(\n 'filtersListContainer',\n 'searchcraft-filters-list-container',\n )}\n >\n {!firstFacet && (\n <p class='searchcraft-facet-message'>\n Enter a search to view facets.\n </p>\n )}\n {firstFacet?.map((facetChild: FacetChild) => {\n const isChildSelected = facetChild.children\n ? facetChild.children?.some(\n (child) => this.selectedPaths[child.path],\n )\n : false;\n\n return (\n <div\n key={facetChild.path}\n class={classNames('searchcraft-filters-list-item')}\n >\n <label\n class={classNames(\n 'filterCheckboxLabel',\n 'searchcraft-filters-list-checkbox-label',\n )}\n >\n <input\n checked={this.selectedPaths[facetChild.path]}\n onChange={(_event: Event) =>\n this.handleCheckboxChange(facetChild.path)\n }\n type='checkbox'\n />\n {isChildSelected ? (\n <div\n class={classNames(\n 'dashContainer',\n 'searchcraft-filter-list-dash-container',\n )}\n >\n <svg width='14' height='3' viewBox='0 0 14 3' fill='none'>\n <title>Checkbox Dash</title>\n <line\n x1='1.5'\n y1='1.5'\n x2='12.5'\n y2='1.5'\n stroke='white'\n stroke-width='3'\n stroke-linecap='round'\n />\n </svg>\n </div>\n ) : (\n <div\n class={classNames(\n 'checkContainer',\n 'searchcraft-filter-list-check-container',\n )}\n >\n <svg width='16' height='16' viewBox='0 0 16 16' fill='none'>\n <title>Checkbox Check</title>\n <path\n d='M13.9999 2L5.74988 10L1.99988 6.36364'\n stroke='white'\n stroke-width='3'\n stroke-linecap='round'\n stroke-linejoin='round'\n />\n </svg>\n </div>\n )}\n {this.formatLabel(facetChild)}\n </label>\n {facetChild.children && facetChild.children.length > 0 && (\n <Fragment>\n {facetChild.children.map((grandchild) => (\n <label\n key={grandchild.path}\n class={classNames(\n 'childFilterCheckboxLabel',\n 'searchcraft-child-filter-checkbox-label',\n )}\n style={{\n display: this.selectedPaths[facetChild.path]\n ? 'flex'\n : 'none',\n }}\n >\n <input\n checked={this.selectedPaths[grandchild.path]}\n onChange={(_event: Event) => {\n this.handleCheckboxChange(grandchild.path);\n }}\n type='checkbox'\n />\n <div\n class={classNames(\n 'checkContainer',\n 'searchcraft-filter-list-check-container',\n )}\n >\n <svg\n width='16'\n height='16'\n viewBox='0 0 16 16'\n fill='none'\n >\n <title>Checkbox Check</title>\n <path\n d='M13.9999 2L5.74988 10L1.99988 6.36364'\n stroke='white'\n stroke-width='3'\n stroke-linecap='round'\n stroke-linejoin='round'\n />\n </svg>\n </div>\n {this.formatSubLabel(grandchild, facetChild)}\n </label>\n ))}\n </Fragment>\n )}\n </div>\n );\n })}\n </div>\n );\n }\n}\n"]}

package/dist/collection/components/searchcraft-filter-panel/searchcraft-filter-panel.js CHANGED Viewed

@@ -16,14 +16,14 @@ export class SearchcraftFilterPanel {
      */
     items = [];
     unsubscribe;
-    lastQuery;
+    lastSearchTerm;
     searchStore = useSearchcraftStore.getState();
     componentDidLoad() {
         this.unsubscribe = useSearchcraftStore.subscribe((state) => {
-            if (this.lastQuery !== state.query) {
+            if (this.lastSearchTerm !== state.searchTerm) {
                 // A place to put actions to do when the query changes
             }
-            this.lastQuery = state.query || '';
+            this.lastSearchTerm = state.searchTerm || '';
         });
     }
     disconnectedCallback() {
@@ -69,7 +69,7 @@ export class SearchcraftFilterPanel {
      * Iterate through `items` and render them based on `type`
      */
     render() {
-        return (h("div", { key: '9b9fcc79913da68b49909965eb75f9a5b1701acb', class: 'searchcraft-filter-panel' }, this.items.map((filterItem) => {
+        return (h("div", { key: '7e3e39a09d392e6da9c387d8cd641a50171ddc59', class: 'searchcraft-filter-panel' }, this.items.map((filterItem) => {
             switch (filterItem.type) {
                 case 'dateRange': {
                     const item = filterItem;
@@ -122,8 +122,8 @@ export class SearchcraftFilterPanel {
                     "references": {
                         "FilterItem": {
                             "location": "import",
-                            "path": "../../types/searchcraft-filter-panel.types",
-                            "id": "src/types/searchcraft-filter-panel.types.ts::FilterItem"
+                            "path": "@searchcraft/core",
+                            "id": "../core-sdk/dist/index.d.ts::FilterItem"
                         }
                     }
                 },
@@ -142,7 +142,7 @@ export class SearchcraftFilterPanel {
     static get states() {
         return {
             "unsubscribe": {},
-            "lastQuery": {}
+            "lastSearchTerm": {}
         };
     }
 }

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

	@@ -1 +1 @@
1	- {"version":3,"file":"searchcraft-filter-panel.js","sourceRoot":"","sources":["../../../../src/components/searchcraft-filter-panel/searchcraft-filter-panel.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Prop, State } from '@stencil/core';\nimport type {\n FilterItem,\n DateRangeFilterItem,\n NumericFilterItem,\n ExactMatchToggleFilterItem,\n FacetsFilterItem,\n} from '../../types/searchcraft-filter-panel.types';\nimport { useSearchcraftStore } from '@provider/store';\nimport { getMillis } from '@utils';\n\n/*\n This web component represents a series of filters that allows users to refine and control their search queries by applying various filter criteria.\n \n ## Usage\n * ```html\n * <!-- index.html -->\n * <searchcraft-filter-panel />\n * ```\n /\n@Component({\n tag: 'searchcraft-filter-panel',\n shadow: false,\n})\nexport class SearchcraftFilterPanel {\n /\n The items to filter.\n /\n @Prop() items: FilterItem[] = [];\n\n @State() unsubscribe: (() => void) \| undefined;\n @State() lastQuery: string \| undefined;\n\n private searchStore = useSearchcraftStore.getState();\n\n componentDidLoad() {\n this.unsubscribe = useSearchcraftStore.subscribe((state) => {\n if (this.lastQuery !== state.query) {\n // A place to put actions to do when the query changes\n }\n this.lastQuery = state.query \|\| '';\n });\n }\n\n disconnectedCallback() {\n this.unsubscribe?.();\n }\n\n handleDateRangeChanged(fieldName: string, min: number, max: number) {\n const start = new Date(min);\n const end = new Date(max);\n this.searchStore.addRangeValueForIndexField({\n fieldName,\n value: `${fieldName}:[${start.toISOString()} TO ${end.toISOString()}]`,\n });\n\n this.searchStore.search();\n }\n\n handleNumericRangeChanged(fieldName: string, min: number, max: number) {\n this.searchStore.addRangeValueForIndexField({\n fieldName,\n value: `${fieldName}:[${min} TO ${max}]`,\n });\n this.searchStore.search();\n }\n\n handleFacetSelectionUpdated(fieldName: string, paths: string[]) {\n if (paths.length > 0) {\n this.searchStore.addFacetPathsForIndexField({\n fieldName,\n value: `${fieldName}: IN [${paths.join(' ')}]`,\n });\n } else {\n this.searchStore.removeFacetPathsForIndexField(fieldName);\n }\n this.searchStore.search();\n }\n\n handleExactMatchToggleUpdated(isActive: boolean) {\n this.searchStore.setSearchMode(isActive ? 'exact' : 'fuzzy');\n this.searchStore.search();\n }\n\n handleMostRecentToggleUpdated(isActive: boolean) {\n this.searchStore.setSortType(isActive ? 'desc' : 'asc');\n this.searchStore.search();\n }\n\n /\n Iterate through `items` and render them based on `type`\n */\n render() {\n return (\n <div class='searchcraft-filter-panel'>\n {this.items.map((filterItem) => {\n switch (filterItem.type) {\n case 'dateRange': {\n const item = filterItem as DateRangeFilterItem;\n const min = new Date(item.options.minDate).getTime();\n const max = new Date(item.options.maxDate).getTime();\n const granularityValue = getMillis(item.options.granularity);\n // return date range slider\n return (\n <div class='searchcraft-filter-panel-section'>\n <p class='searchcraft-filter-panel-label'>\n {filterItem.label}\n </p>\n <searchcraft-slider\n min={min}\n max={max}\n granularity={granularityValue}\n dataType='date'\n onRangeChanged={(event) => {\n this.handleDateRangeChanged(\n item.fieldName,\n event.detail.startValue,\n event.detail.endValue,\n );\n }}\n />\n </div>\n );\n }\n case 'numericRange': {\n const item = filterItem as NumericFilterItem;\n // return date range slider\n return (\n <div class='searchcraft-filter-panel-section'>\n <p class='searchcraft-filter-panel-label'>\n {filterItem.label}\n </p>\n <searchcraft-slider\n min={item.options.min}\n max={item.options.max}\n granularity={item.options.granularity}\n onRangeChanged={(event) => {\n this.handleNumericRangeChanged(\n item.fieldName,\n event.detail.startValue,\n event.detail.endValue,\n );\n }}\n />\n </div>\n );\n }\n case 'facets': {\n const item = filterItem as FacetsFilterItem;\n // return \"filters-list\"\n return (\n <div class='searchcraft-filter-panel-section'>\n <p class='searchcraft-filter-panel-label'>\n {filterItem.label}\n </p>\n <searchcraft-facet-list\n fieldName={item.fieldName}\n onFacetSelectionUpdated={(event) => {\n this.handleFacetSelectionUpdated(\n item.fieldName,\n event.detail.paths,\n );\n }}\n />\n </div>\n );\n }\n case 'exactMatchToggle': {\n const item = filterItem as ExactMatchToggleFilterItem;\n return (\n <searchcraft-toggle-button\n label={item.label}\n subLabel={item.options.subLabel}\n onToggleUpdated={(event) => {\n this.handleExactMatchToggleUpdated(event.detail);\n }}\n />\n );\n }\n case 'mostRecentToggle': {\n const item = filterItem as ExactMatchToggleFilterItem;\n return (\n <searchcraft-toggle-button\n label={item.label}\n subLabel={item.options.subLabel}\n onToggleUpdated={(event) => {\n this.handleMostRecentToggleUpdated(event.detail);\n }}\n />\n );\n }\n }\n })}\n </div>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"searchcraft-filter-panel.js","sourceRoot":"","sources":["../../../../src/components/searchcraft-filter-panel/searchcraft-filter-panel.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Prop, State } from '@stencil/core';\nimport type {\n FilterItem,\n DateRangeFilterItem,\n NumericFilterItem,\n ExactMatchToggleFilterItem,\n FacetsFilterItem,\n} from '@searchcraft/core';\nimport { useSearchcraftStore } from '@provider/store';\nimport { getMillis } from '@utils';\n\n/*\n This web component represents a series of filters that allows users to refine and control their search queries by applying various filter criteria.\n \n ## Usage\n * ```html\n * <!-- index.html -->\n * <searchcraft-filter-panel />\n * ```\n /\n@Component({\n tag: 'searchcraft-filter-panel',\n shadow: false,\n})\nexport class SearchcraftFilterPanel {\n /\n The items to filter.\n /\n @Prop() items: FilterItem[] = [];\n\n @State() unsubscribe: (() => void) \| undefined;\n @State() lastSearchTerm: string \| undefined;\n\n private searchStore = useSearchcraftStore.getState();\n\n componentDidLoad() {\n this.unsubscribe = useSearchcraftStore.subscribe((state) => {\n if (this.lastSearchTerm !== state.searchTerm) {\n // A place to put actions to do when the query changes\n }\n this.lastSearchTerm = state.searchTerm \|\| '';\n });\n }\n\n disconnectedCallback() {\n this.unsubscribe?.();\n }\n\n handleDateRangeChanged(fieldName: string, min: number, max: number) {\n const start = new Date(min);\n const end = new Date(max);\n this.searchStore.addRangeValueForIndexField({\n fieldName,\n value: `${fieldName}:[${start.toISOString()} TO ${end.toISOString()}]`,\n });\n\n this.searchStore.search();\n }\n\n handleNumericRangeChanged(fieldName: string, min: number, max: number) {\n this.searchStore.addRangeValueForIndexField({\n fieldName,\n value: `${fieldName}:[${min} TO ${max}]`,\n });\n this.searchStore.search();\n }\n\n handleFacetSelectionUpdated(fieldName: string, paths: string[]) {\n if (paths.length > 0) {\n this.searchStore.addFacetPathsForIndexField({\n fieldName,\n value: `${fieldName}: IN [${paths.join(' ')}]`,\n });\n } else {\n this.searchStore.removeFacetPathsForIndexField(fieldName);\n }\n this.searchStore.search();\n }\n\n handleExactMatchToggleUpdated(isActive: boolean) {\n this.searchStore.setSearchMode(isActive ? 'exact' : 'fuzzy');\n this.searchStore.search();\n }\n\n handleMostRecentToggleUpdated(isActive: boolean) {\n this.searchStore.setSortType(isActive ? 'desc' : 'asc');\n this.searchStore.search();\n }\n\n /\n Iterate through `items` and render them based on `type`\n */\n render() {\n return (\n <div class='searchcraft-filter-panel'>\n {this.items.map((filterItem) => {\n switch (filterItem.type) {\n case 'dateRange': {\n const item = filterItem as DateRangeFilterItem;\n const min = new Date(item.options.minDate).getTime();\n const max = new Date(item.options.maxDate).getTime();\n const granularityValue = getMillis(item.options.granularity);\n // return date range slider\n return (\n <div class='searchcraft-filter-panel-section'>\n <p class='searchcraft-filter-panel-label'>\n {filterItem.label}\n </p>\n <searchcraft-slider\n min={min}\n max={max}\n granularity={granularityValue}\n dataType='date'\n onRangeChanged={(event) => {\n this.handleDateRangeChanged(\n item.fieldName,\n event.detail.startValue,\n event.detail.endValue,\n );\n }}\n />\n </div>\n );\n }\n case 'numericRange': {\n const item = filterItem as NumericFilterItem;\n // return date range slider\n return (\n <div class='searchcraft-filter-panel-section'>\n <p class='searchcraft-filter-panel-label'>\n {filterItem.label}\n </p>\n <searchcraft-slider\n min={item.options.min}\n max={item.options.max}\n granularity={item.options.granularity}\n onRangeChanged={(event) => {\n this.handleNumericRangeChanged(\n item.fieldName,\n event.detail.startValue,\n event.detail.endValue,\n );\n }}\n />\n </div>\n );\n }\n case 'facets': {\n const item = filterItem as FacetsFilterItem;\n // return \"filters-list\"\n return (\n <div class='searchcraft-filter-panel-section'>\n <p class='searchcraft-filter-panel-label'>\n {filterItem.label}\n </p>\n <searchcraft-facet-list\n fieldName={item.fieldName}\n onFacetSelectionUpdated={(event) => {\n this.handleFacetSelectionUpdated(\n item.fieldName,\n event.detail.paths,\n );\n }}\n />\n </div>\n );\n }\n case 'exactMatchToggle': {\n const item = filterItem as ExactMatchToggleFilterItem;\n return (\n <searchcraft-toggle-button\n label={item.label}\n subLabel={item.options.subLabel}\n onToggleUpdated={(event) => {\n this.handleExactMatchToggleUpdated(event.detail);\n }}\n />\n );\n }\n case 'mostRecentToggle': {\n const item = filterItem as ExactMatchToggleFilterItem;\n return (\n <searchcraft-toggle-button\n label={item.label}\n subLabel={item.options.subLabel}\n onToggleUpdated={(event) => {\n this.handleMostRecentToggleUpdated(event.detail);\n }}\n />\n );\n }\n }\n })}\n </div>\n );\n }\n}\n"]}

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

@@ -18,7 +18,7 @@ import classNames from "classnames";
  * // index.js
  * const searchInputForm = document.querySelector('searchcraft-input-form');
  *
- * seardchInputForm.config = {
+ * searchInputForm.config = {
  *   index: [],
  *   readKey: '',
  *   endpointUrl: '',
@@ -110,25 +110,21 @@ export class SearchcraftInput {
     handleOnInput = (event) => {
         const input = event.target;
         this.inputValue = input.value;
-        if (input.value.trim() === '') {
-            this.inputCleared?.emit();
-            this.searchTerm = '';
-            this.searchStore.setQuery('');
-            this.searchStore.setSearchResults(null);
-            return;
-        }
         if (!this.autoSearch) {
             return;
         }
+        if (input.value.trim() === '') {
+            this.inputCleared?.emit();
+        }
         this.performSearch(input.value);
     };
     performSearch = async (value) => {
-        if (value === useSearchcraftStore.getState().query) {
+        if (value === useSearchcraftStore.getState().searchTerm) {
             return;
         }
         this.searchTerm = value.trim();
         this.error = false;
-        this.searchStore.setQuery(this.searchTerm);
+        this.searchStore.setSearchTerm(this.searchTerm);
         this.querySubmit?.emit(this.searchTerm);
         try {
             await this.searchStore.search();
@@ -141,8 +137,8 @@ export class SearchcraftInput {
     handleClearInput = () => {
         this.inputValue = '';
         this.searchTerm = '';
-        this.searchStore.setQuery('');
-        this.searchStore.setSearchResults(null);
+        this.searchStore.setSearchTerm('');
+        this.searchStore.setSearchClientResponseItems([]);
         this.error = false;
         this.inputCleared?.emit();
     };
@@ -162,9 +158,9 @@ export class SearchcraftInput {
         const inputGridStyles = {
             gap: shouldHaveVerticalGap ? '4px 8px' : '0px 8px',
         };
-        return (h("form", { key: 'b23e712102e03332d5958b736133ac5222c571ed', class: 'searchcraft-input-form', onSubmit: this.handleFormSubmit }, h("div", { key: '62e1666b20e3901565241c83cb6b398afbaf14bf', class: inputGridClassNames, style: inputGridStyles }, h("div", { key: '1f78f96f48e354ba434bcd6c8eb20f6940d2281c', class: 'searchcraft-input-button-wrapper' }, h("searchcraft-button", { key: '0e89a333f3d489dccb05d978dde8622ee24a2508', onButtonClick: this.handleFormSubmit, label: this.buttonLabel })), this.inputLabel && (h("div", { key: '1b75214db1a0a9d7144e8974e3467da9a94cc845', class: 'searchcraft-input-label-wrapper' }, h("searchcraft-input-label", { key: 'd7edaa9b980eae47628747488e4966ef62fab574', label: this.inputLabel }))), this.error && (h("div", { key: '936858e238d96838caa3aa34dbb4d86b3f6ad839', class: 'searchcraft-input-error-wrapper' }, h("searchcraft-error-message", { key: '75400c0a6f9d20f5c58ef0125f70a0ba8f2da920', errorMessage: 'Something went wrong.' }))), h("div", { key: '0978f74e9a83c78604c494fca9d8a885f73b5fff', class: 'searchcraft-input-wrapper' }, h("input", { key: '4a9f69a9e21c89c97daea9e4c19e41523c71e0f2', autoComplete: 'off', class: 'searchcraft-input', onFocus: () => this.inputFocus?.emit(), onBlur: () => this.inputBlur?.emit(), onInput: (event) => {
+        return (h("form", { key: 'bc665c50db8de601a3c95266bdf063ebb988d6a8', class: 'searchcraft-input-form', onSubmit: this.handleFormSubmit }, h("div", { key: 'a6936858c08d866b66b887c7ae03b35961cf04a1', class: inputGridClassNames, style: inputGridStyles }, h("div", { key: '915ac892fccb771f1c5338cd2d52f16f1793615d', class: 'searchcraft-input-button-wrapper' }, h("searchcraft-button", { key: '81447da28dcb9cb80a8cdf0c6765c909c2746585', onButtonClick: this.handleFormSubmit, label: this.buttonLabel })), this.inputLabel && (h("div", { key: '939c3407d16075be25ff23bf9b379c05ba1a66d4', class: 'searchcraft-input-label-wrapper' }, h("searchcraft-input-label", { key: '9d9c4043c04132b27710cca47abf102a188a80b9', label: this.inputLabel }))), this.error && (h("div", { key: '7e309f8a5c81a41bdd593f4e4ee1ba30c531c97d', class: 'searchcraft-input-error-wrapper' }, h("searchcraft-error-message", { key: 'de947c04f0948e36786f50ac65720eeb598ae7bf', errorMessage: 'Something went wrong.' }))), h("div", { key: 'bcf774e3fa5164ab838b634badf2002495437fe7', class: 'searchcraft-input-wrapper' }, h("input", { key: 'fd9759559712a39d3493e069ddddf7c267879c84', autoComplete: 'off', class: 'searchcraft-input', onFocus: () => this.inputFocus?.emit(), onBlur: () => this.inputBlur?.emit(), onInput: (event) => {
                 this.handleOnInput(event);
-            }, placeholder: this.placeholderValue, style: validatedCustomStyles, type: 'text', value: this.inputValue }), h("div", { key: '9c215722544c132dc9e302c522d0f7c36c205b74', class: 'searchcraft-input-search-icon-wrapper' }, h("svg", { key: '4f6dfc2a89a888eafcd4aee6d02e40635c2fb78a', class: 'searchcraft-input-search-icon', viewBox: '0 0 20 20', fill: 'none', xmlns: 'http://www.w3.org/2000/svg', "aria-labelledby": 'searchcraft-title' }, h("title", { key: '6be4ba3b739aeebd27e2ba0f3b7766c1ac6cf2e3', id: 'searchcraft-title' }, "Searchcraft Search Icon Light"), h("path", { key: 'd62f785b5bb2f261a3dbf8e4d91f2db405e36dc4', d: 'M17.5 17.5L13.875 13.875M15.8333 9.16667C15.8333 12.8486 12.8486 15.8333 9.16667 15.8333C5.48477 15.8333 2.5 12.8486 2.5 9.16667C2.5 5.48477 5.48477 2.5 9.16667 2.5C12.8486 2.5 15.8333 5.48477 15.8333 9.16667Z', stroke: '#404040', "stroke-width": '1.5', "stroke-linecap": 'round', "stroke-linejoin": 'round' }))), isShowingClearButton && (h("button", { key: '8ca5193982311991eb0bf30a200b5bee25688c54', type: 'button', class: 'searchcraft-input-clear-button', onClick: this.handleClearInput }, h("svg", { key: 'a929aee41d677e850a2568ee08a047f35711b4bf', class: 'searchcraft-input-clear-icon', viewBox: '0 0 22 22', fill: 'none', xmlns: 'http://www.w3.org/2000/svg', "aria-labelledby": 'icon-title' }, h("title", { key: '60b50c641ab494c1e8f02f3e1fa19d0a41162859', id: 'icon-title' }, "Searchcraft Clear Input Icon Light"), h("path", { key: '6d47a20770f51f069efe06ee29c1451fd78de357', d: 'M14 8L8 14M8 8L14 14M21 11C21 16.5228 16.5228 21 11 21C5.47715 21 1 16.5228 1 11C1 5.47715 5.47715 1 11 1C16.5228 1 21 5.47715 21 11Z', stroke: 'black', "stroke-width": '1.5', "stroke-linecap": 'round', "stroke-linejoin": 'round' }))))))));
+            }, placeholder: this.placeholderValue, style: validatedCustomStyles, type: 'text', value: this.inputValue }), h("div", { key: '8564b18962feeea8d9ab8bb46af4ba28a089d8f4', class: 'searchcraft-input-search-icon-wrapper' }, h("svg", { key: '90c3636ea306ed70887d76deaf058ab3ace61134', class: 'searchcraft-input-search-icon', viewBox: '0 0 20 20', fill: 'none', xmlns: 'http://www.w3.org/2000/svg', "aria-labelledby": 'searchcraft-title' }, h("title", { key: 'c9921263b87df28e06bab9990e324aa1bebac767', id: 'searchcraft-title' }, "Searchcraft Search Icon Light"), h("path", { key: 'bb82073fd722ff4a74e1a86c74cdf0dd9a8080b4', d: 'M17.5 17.5L13.875 13.875M15.8333 9.16667C15.8333 12.8486 12.8486 15.8333 9.16667 15.8333C5.48477 15.8333 2.5 12.8486 2.5 9.16667C2.5 5.48477 5.48477 2.5 9.16667 2.5C12.8486 2.5 15.8333 5.48477 15.8333 9.16667Z', stroke: 'currentColor', "stroke-width": '1.5', "stroke-linecap": 'round', "stroke-linejoin": 'round' }))), isShowingClearButton && (h("button", { key: 'e708cb9426171bfdfb29e0a98206d086fa14e15e', type: 'button', class: 'searchcraft-input-clear-button', onClick: this.handleClearInput }, h("svg", { key: '243b6eacc68fa8cc57d5e11b9b317d7fe581406f', class: 'searchcraft-input-clear-icon', viewBox: '0 0 22 22', fill: 'none', xmlns: 'http://www.w3.org/2000/svg', "aria-labelledby": 'icon-title' }, h("title", { key: 'd8a8b44fe04345b5b27ba33ec4ba510500eab3bf', id: 'icon-title' }, "Searchcraft Clear Input Icon Light"), h("path", { key: '0602cbff7aac6755dabb496b84e6ef3e4e2ac7a6', d: 'M14 8L8 14M8 8L14 14M21 11C21 16.5228 16.5228 21 11 21C5.47715 21 1 16.5228 1 11C1 5.47715 5.47715 1 11 1C16.5228 1 21 5.47715 21 11Z', stroke: 'currentColor', "stroke-width": '1.5', "stroke-linecap": 'round', "stroke-linejoin": 'round' }))))))));
     }
     static get is() { return "searchcraft-input-form"; }
     static get properties() {

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

	@@ -1 +1 @@
1	- {"version":3,"file":"searchcraft-input-form.js","sourceRoot":"","sources":["../../../../src/components/searchcraft-input-form/searchcraft-input-form.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n h,\n Prop,\n State,\n Event,\n type EventEmitter,\n Watch,\n} from '@stencil/core';\n\nimport { type SearchcraftConfig, SearchcraftCore } from '@searchcraft/core';\nimport packageJson from '../../../package.json';\n\nimport { parseCustomStyles } from '@utils';\nimport { useSearchcraftStore } from '@provider/store';\nimport classNames from 'classnames';\n\n/*\n This web component provides a user-friendly interface for querying an indexed dataset, enabling users to easily search large collections of data.\n * It abstracts the complexities of index-based searching, making it accessible to users of all technical levels.\n \n ## Usage\n * ```html\n * <!-- index.html -->\n * <searchcraft-input-form placeholder-value=\"Search here\" />\n * ```\n \n ```js\n * // index.js\n * const searchInputForm = document.querySelector('searchcraft-input-form');\n \n seardchInputForm.config = {\n * index: [],\n * readKey: '',\n * endpointUrl: '',\n * };\n \n searchForm.addEventListener('querySubmit', (event) => {\n * console.log('Query submitted', event.detail);\n * });\n * ```\n /\n@Component({\n tag: 'searchcraft-input-form',\n shadow: false,\n})\nexport class SearchcraftInput {\n /\n The Searchcraft config object.\n /\n @Prop() config: SearchcraftConfig \| undefined;\n /\n Whether or not to automatically submit the search term when the input changes.\n /\n @Prop() autoSearch = true;\n /\n Where to place the search button.\n /\n @Prop() buttonPlacement: 'left' \| 'right' \| 'none' = 'none';\n /\n The label for the submit button.\n /\n @Prop() buttonLabel: string \| undefined;\n /\n The label rendered above the input.\n /\n @Prop() inputLabel: string \| undefined;\n /\n A custom styles object to be applied to the input element.\n /\n @Prop() customStyles: string \| Record<string, string> = {};\n /\n The input element's placeholder value.\n /\n @Prop() placeholderValue = 'Enter Search';\n /\n The starting value of the input element.\n /\n @Prop() searchTerm = '';\n /\n When the input is cleared.\n /\n @Event() inputCleared?: EventEmitter<void>;\n /\n When no results are returned.\n /\n @Event() noResultsReceived?: EventEmitter<void>;\n /\n When the input becomes focused.\n /\n @Event() inputFocus?: EventEmitter<void>;\n /\n When the input becomes unfocused.\n /\n @Event() inputBlur?: EventEmitter<void>;\n /\n Event emitted when input initializes.\n /\n @Event() inputInit?: EventEmitter<void>;\n /\n Event emitted when a query has been submitted.\n */\n @Event() querySubmit?: EventEmitter<string>;\n\n @State() inputValue = this.searchTerm;\n @State() error = false;\n @State() isSearchcraftInitialized = false;\n\n private searchStore = useSearchcraftStore.getState();\n\n init() {\n if (this.config && !this.isSearchcraftInitialized) {\n const searchcraft = new SearchcraftCore(this.config, {\n sdkName: packageJson.name,\n sdkVersion: packageJson.version,\n });\n this.searchStore.initialize(searchcraft, true);\n this.isSearchcraftInitialized = true;\n this.inputInit?.emit();\n }\n }\n\n componentDidLoad() {\n this.init();\n }\n\n @Watch('config')\n onConfigChange() {\n this.init();\n }\n\n handleOnInput = (event: Event) => {\n const input = event.target as HTMLInputElement;\n this.inputValue = input.value;\n\n if (input.value.trim() === '') {\n this.inputCleared?.emit();\n this.searchTerm = '';\n this.searchStore.setQuery('');\n this.searchStore.setSearchResults(null);\n return;\n }\n\n if (!this.autoSearch) {\n return;\n }\n\n this.performSearch(input.value);\n };\n\n private performSearch = async (value: string) => {\n if (value === useSearchcraftStore.getState().query) {\n return;\n }\n\n this.searchTerm = value.trim();\n this.error = false;\n this.searchStore.setQuery(this.searchTerm);\n this.querySubmit?.emit(this.searchTerm);\n\n try {\n await this.searchStore.search();\n } catch (error) {\n this.error = true;\n this.inputCleared?.emit();\n }\n };\n\n handleClearInput = () => {\n this.inputValue = '';\n this.searchTerm = '';\n this.searchStore.setQuery('');\n this.searchStore.setSearchResults(null);\n this.error = false;\n\n this.inputCleared?.emit();\n };\n\n handleFormSubmit = async (event: Event) => {\n event.preventDefault();\n await this.performSearch(this.searchTerm);\n };\n\n render() {\n const validatedCustomStyles = parseCustomStyles(this.customStyles);\n\n const isShowingClearButton = this.inputValue.length > 0;\n\n const inputGridClassNames = classNames('searchcraft-input-grid', {\n 'searchcraft-input-grid-buttonLeft': this.buttonPlacement === 'left',\n 'searchcraft-input-grid-buttonRight': this.buttonPlacement === 'right',\n 'searchcraft-input-grid-buttonNone': this.buttonPlacement === 'none',\n });\n\n const shouldHaveVerticalGap = this.inputLabel \|\| this.error;\n const inputGridStyles = {\n gap: shouldHaveVerticalGap ? '4px 8px' : '0px 8px',\n };\n\n return (\n <form class='searchcraft-input-form' onSubmit={this.handleFormSubmit}>\n <div class={inputGridClassNames} style={inputGridStyles}>\n <div class='searchcraft-input-button-wrapper'>\n <searchcraft-button\n onButtonClick={this.handleFormSubmit}\n label={this.buttonLabel}\n />\n </div>\n {this.inputLabel && (\n <div class='searchcraft-input-label-wrapper'>\n <searchcraft-input-label label={this.inputLabel} />\n </div>\n )}\n {this.error && (\n <div class='searchcraft-input-error-wrapper'>\n <searchcraft-error-message errorMessage='Something went wrong.' />\n </div>\n )}\n <div class='searchcraft-input-wrapper'>\n <input\n autoComplete='off'\n class='searchcraft-input'\n onFocus={() => this.inputFocus?.emit()}\n onBlur={() => this.inputBlur?.emit()}\n onInput={(event) => {\n this.handleOnInput(event);\n }}\n placeholder={this.placeholderValue}\n style={validatedCustomStyles}\n type='text'\n value={this.inputValue}\n />\n <div class='searchcraft-input-search-icon-wrapper'>\n <svg\n class='searchcraft-input-search-icon'\n viewBox='0 0 20 20'\n fill='none'\n xmlns='http://www.w3.org/2000/svg'\n aria-labelledby='searchcraft-title'\n >\n <title id='searchcraft-title'>\n Searchcraft Search Icon Light\n </title>\n <path\n d='M17.5 17.5L13.875 13.875M15.8333 9.16667C15.8333 12.8486 12.8486 15.8333 9.16667 15.8333C5.48477 15.8333 2.5 12.8486 2.5 9.16667C2.5 5.48477 5.48477 2.5 9.16667 2.5C12.8486 2.5 15.8333 5.48477 15.8333 9.16667Z'\n stroke='#404040'\n stroke-width='1.5'\n stroke-linecap='round'\n stroke-linejoin='round'\n />\n </svg>\n </div>\n {isShowingClearButton && (\n <button\n type='button'\n class='searchcraft-input-clear-button'\n onClick={this.handleClearInput}\n >\n <svg\n class='searchcraft-input-clear-icon'\n viewBox='0 0 22 22'\n fill='none'\n xmlns='http://www.w3.org/2000/svg'\n aria-labelledby='icon-title'\n >\n <title id='icon-title'>\n Searchcraft Clear Input Icon Light\n </title>\n <path\n d='M14 8L8 14M8 8L14 14M21 11C21 16.5228 16.5228 21 11 21C5.47715 21 1 16.5228 1 11C1 5.47715 5.47715 1 11 1C16.5228 1 21 5.47715 21 11Z'\n stroke='black'\n stroke-width='1.5'\n stroke-linecap='round'\n stroke-linejoin='round'\n />\n </svg>\n </button>\n )}\n </div>\n </div>\n </form>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"searchcraft-input-form.js","sourceRoot":"","sources":["../../../../src/components/searchcraft-input-form/searchcraft-input-form.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n h,\n Prop,\n State,\n Event,\n type EventEmitter,\n Watch,\n} from '@stencil/core';\n\nimport { type SearchcraftConfig, SearchcraftCore } from '@searchcraft/core';\nimport packageJson from '../../../package.json';\n\nimport { parseCustomStyles } from '@utils';\nimport { useSearchcraftStore } from '@provider/store';\nimport classNames from 'classnames';\n\n/*\n This web component provides a user-friendly interface for querying an indexed dataset, enabling users to easily search large collections of data.\n * It abstracts the complexities of index-based searching, making it accessible to users of all technical levels.\n \n ## Usage\n * ```html\n * <!-- index.html -->\n * <searchcraft-input-form placeholder-value=\"Search here\" />\n * ```\n \n ```js\n * // index.js\n * const searchInputForm = document.querySelector('searchcraft-input-form');\n \n searchInputForm.config = {\n * index: [],\n * readKey: '',\n * endpointUrl: '',\n * };\n \n searchForm.addEventListener('querySubmit', (event) => {\n * console.log('Query submitted', event.detail);\n * });\n * ```\n /\n@Component({\n tag: 'searchcraft-input-form',\n shadow: false,\n})\nexport class SearchcraftInput {\n /\n The Searchcraft config object.\n /\n @Prop() config: SearchcraftConfig \| undefined;\n /\n Whether or not to automatically submit the search term when the input changes.\n /\n @Prop() autoSearch = true;\n /\n Where to place the search button.\n /\n @Prop() buttonPlacement: 'left' \| 'right' \| 'none' = 'none';\n /\n The label for the submit button.\n /\n @Prop() buttonLabel: string \| undefined;\n /\n The label rendered above the input.\n /\n @Prop() inputLabel: string \| undefined;\n /\n A custom styles object to be applied to the input element.\n /\n @Prop() customStyles: string \| Record<string, string> = {};\n /\n The input element's placeholder value.\n /\n @Prop() placeholderValue = 'Enter Search';\n /\n The starting value of the input element.\n /\n @Prop() searchTerm = '';\n /\n When the input is cleared.\n /\n @Event() inputCleared?: EventEmitter<void>;\n /\n When no results are returned.\n /\n @Event() noResultsReceived?: EventEmitter<void>;\n /\n When the input becomes focused.\n /\n @Event() inputFocus?: EventEmitter<void>;\n /\n When the input becomes unfocused.\n /\n @Event() inputBlur?: EventEmitter<void>;\n /\n Event emitted when input initializes.\n /\n @Event() inputInit?: EventEmitter<void>;\n /\n Event emitted when a query has been submitted.\n */\n @Event() querySubmit?: EventEmitter<string>;\n\n @State() inputValue = this.searchTerm;\n @State() error = false;\n @State() isSearchcraftInitialized = false;\n\n private searchStore = useSearchcraftStore.getState();\n\n init() {\n if (this.config && !this.isSearchcraftInitialized) {\n const searchcraft = new SearchcraftCore(this.config, {\n sdkName: packageJson.name,\n sdkVersion: packageJson.version,\n });\n this.searchStore.initialize(searchcraft, true);\n this.isSearchcraftInitialized = true;\n this.inputInit?.emit();\n }\n }\n\n componentDidLoad() {\n this.init();\n }\n\n @Watch('config')\n onConfigChange() {\n this.init();\n }\n\n handleOnInput = (event: Event) => {\n const input = event.target as HTMLInputElement;\n this.inputValue = input.value;\n\n if (!this.autoSearch) {\n return;\n }\n\n if (input.value.trim() === '') {\n this.inputCleared?.emit();\n }\n\n this.performSearch(input.value);\n };\n\n private performSearch = async (value: string) => {\n if (value === useSearchcraftStore.getState().searchTerm) {\n return;\n }\n\n this.searchTerm = value.trim();\n this.error = false;\n this.searchStore.setSearchTerm(this.searchTerm);\n this.querySubmit?.emit(this.searchTerm);\n\n try {\n await this.searchStore.search();\n } catch (error) {\n this.error = true;\n this.inputCleared?.emit();\n }\n };\n\n handleClearInput = () => {\n this.inputValue = '';\n this.searchTerm = '';\n this.searchStore.setSearchTerm('');\n this.searchStore.setSearchClientResponseItems([]);\n this.error = false;\n\n this.inputCleared?.emit();\n };\n\n handleFormSubmit = async (event: Event) => {\n event.preventDefault();\n await this.performSearch(this.searchTerm);\n };\n\n render() {\n const validatedCustomStyles = parseCustomStyles(this.customStyles);\n\n const isShowingClearButton = this.inputValue.length > 0;\n\n const inputGridClassNames = classNames('searchcraft-input-grid', {\n 'searchcraft-input-grid-buttonLeft': this.buttonPlacement === 'left',\n 'searchcraft-input-grid-buttonRight': this.buttonPlacement === 'right',\n 'searchcraft-input-grid-buttonNone': this.buttonPlacement === 'none',\n });\n\n const shouldHaveVerticalGap = this.inputLabel \|\| this.error;\n const inputGridStyles = {\n gap: shouldHaveVerticalGap ? '4px 8px' : '0px 8px',\n };\n\n return (\n <form class='searchcraft-input-form' onSubmit={this.handleFormSubmit}>\n <div class={inputGridClassNames} style={inputGridStyles}>\n <div class='searchcraft-input-button-wrapper'>\n <searchcraft-button\n onButtonClick={this.handleFormSubmit}\n label={this.buttonLabel}\n />\n </div>\n {this.inputLabel && (\n <div class='searchcraft-input-label-wrapper'>\n <searchcraft-input-label label={this.inputLabel} />\n </div>\n )}\n {this.error && (\n <div class='searchcraft-input-error-wrapper'>\n <searchcraft-error-message errorMessage='Something went wrong.' />\n </div>\n )}\n <div class='searchcraft-input-wrapper'>\n <input\n autoComplete='off'\n class='searchcraft-input'\n onFocus={() => this.inputFocus?.emit()}\n onBlur={() => this.inputBlur?.emit()}\n onInput={(event) => {\n this.handleOnInput(event);\n }}\n placeholder={this.placeholderValue}\n style={validatedCustomStyles}\n type='text'\n value={this.inputValue}\n />\n <div class='searchcraft-input-search-icon-wrapper'>\n <svg\n class='searchcraft-input-search-icon'\n viewBox='0 0 20 20'\n fill='none'\n xmlns='http://www.w3.org/2000/svg'\n aria-labelledby='searchcraft-title'\n >\n <title id='searchcraft-title'>\n Searchcraft Search Icon Light\n </title>\n <path\n d='M17.5 17.5L13.875 13.875M15.8333 9.16667C15.8333 12.8486 12.8486 15.8333 9.16667 15.8333C5.48477 15.8333 2.5 12.8486 2.5 9.16667C2.5 5.48477 5.48477 2.5 9.16667 2.5C12.8486 2.5 15.8333 5.48477 15.8333 9.16667Z'\n stroke='currentColor'\n stroke-width='1.5'\n stroke-linecap='round'\n stroke-linejoin='round'\n />\n </svg>\n </div>\n {isShowingClearButton && (\n <button\n type='button'\n class='searchcraft-input-clear-button'\n onClick={this.handleClearInput}\n >\n <svg\n class='searchcraft-input-clear-icon'\n viewBox='0 0 22 22'\n fill='none'\n xmlns='http://www.w3.org/2000/svg'\n aria-labelledby='icon-title'\n >\n <title id='icon-title'>\n Searchcraft Clear Input Icon Light\n </title>\n <path\n d='M14 8L8 14M8 8L14 14M21 11C21 16.5228 16.5228 21 11 21C5.47715 21 1 16.5228 1 11C1 5.47715 5.47715 1 11 1C16.5228 1 21 5.47715 21 11Z'\n stroke='currentColor'\n stroke-width='1.5'\n stroke-linecap='round'\n stroke-linejoin='round'\n />\n </svg>\n </button>\n )}\n </div>\n </div>\n </form>\n );\n }\n}\n"]}

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

@@ -16,7 +16,7 @@ export class SearchcraftInputLabel {
     inputLabelClassName = '';
     label = '';
     render() {
-        return (h("label", { key: '9c71dc7429d7289ed59e7effacb91e040a9ac6a1', class: classNames('searchcraft-input-label', this.inputLabelClassName), htmlFor: 'searchcraft-input-id' }, this.label));
+        return (h("label", { key: '528396d4be9f22ff0c02d95d8bcea056576aed41', class: classNames('searchcraft-input-label', this.inputLabelClassName), htmlFor: 'searchcraft-input-id' }, this.label));
     }
     static get is() { return "searchcraft-input-label"; }
     static get properties() {

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

@@ -0,0 +1,141 @@
+import { useSearchcraftStore } from "../../provider/store";
+import { h } from "@stencil/core";
+import classNames from "classnames";
+import { parseCustomStyles } from "../../utils/index";
+/**
+ * This web component is designed to facilitate pagination of search results.
+ * Once a query is submitted, calculates the number for pages.
+ *
+ * ## Usage
+ * ```html
+ * <!-- index.html -->
+ * <searchcraft-pagination />
+ * ```
+ */
+export class SearchcraftPagination {
+    /**
+     * The custom styles object.
+     */
+    customStyles;
+    // store vars
+    searchTerm;
+    searchResultsPerPage;
+    searchResultsPage;
+    searchResultsCount;
+    // local vars
+    searchResultsPagesCount = 1;
+    searchResultsRangeMin = 1;
+    searchResultsRangeMax = 1;
+    // store functions
+    setSearchResultsPage = () => { };
+    unsubscribe = () => { };
+    componentDidLoad() {
+        this.unsubscribe = useSearchcraftStore.subscribe((state) => {
+            // store vars
+            this.searchTerm = state.searchTerm;
+            this.searchResultsPerPage = state.searchResultsPerPage;
+            this.searchResultsPage = state.searchResultsPage;
+            this.searchResultsCount = state.searchResultsCount;
+            // local vars
+            this.searchResultsPagesCount = Math.ceil(this.searchResultsCount / this.searchResultsPerPage);
+            this.searchResultsRangeMin =
+                (this.searchResultsPage - 1) * this.searchResultsPerPage + 1;
+            this.searchResultsRangeMax =
+                (this.searchResultsPerPage - 1) * this.searchResultsPerPage +
+                    this.searchResultsPerPage;
+            // store functions
+            this.setSearchResultsPage = state.setSearchResultsPage;
+        });
+    }
+    disconnectedCallback() {
+        this.unsubscribe?.();
+    }
+    handleGoToPage(page) {
+        this.setSearchResultsPage(page);
+    }
+    renderOddPaginationItem(page) {
+        return (h("li", null, h("button", { class: classNames('searchcraft-pagination-item', {
+                'searchcraft-pagination-item-active': this.searchResultsPage === page,
+            }), onClick: () => this.handleGoToPage(page), type: 'button' }, page)));
+    }
+    renderEvenPaginationItem(page) {
+        if (this.searchResultsPagesCount <= page) {
+            return;
+        }
+        if (this.searchResultsPagesCount <= 5 ||
+            page < Math.ceil(this.searchResultsPagesCount / 2) // is the first or second even pagination item
+            ? this.searchResultsPage <= page + 1
+            : this.searchResultsPage >= page - 1) {
+            return (h("li", null, h("button", { class: classNames('searchcraft-pagination-item', {
+                    'searchcraft-pagination-item-active': this.searchResultsPage === page,
+                }), onClick: () => this.handleGoToPage(page), type: 'button' }, page)));
+        }
+        return (h("li", null, h("span", { class: 'searchcraft-pagination-item' }, "...")));
+    }
+    renderMiddlePaginationItem() {
+        if (this.searchResultsPagesCount <= 3) {
+            return;
+        }
+        if (this.searchResultsPagesCount <= 5 ||
+            this.searchResultsPage <= 3 ||
+            this.searchResultsPage >= this.searchResultsPagesCount - 2) {
+            return (h("li", null, h("button", { class: classNames('searchcraft-pagination-item', {
+                    'searchcraft-pagination-item-active': this.searchResultsPage === 3 ||
+                        this.searchResultsPage === this.searchResultsPagesCount - 2,
+                }), type: 'button', onClick: () => this.handleGoToPage(this.searchResultsPage >= this.searchResultsPagesCount - 2
+                    ? this.searchResultsPagesCount - 2
+                    : 3) }, this.searchResultsPage >= this.searchResultsPagesCount - 2
+                ? this.searchResultsPagesCount - 2
+                : 3)));
+        }
+        return (h("li", null, h("span", { class: 'searchcraft-pagination-item searchcraft-pagination-item-active' }, this.searchResultsPage)));
+    }
+    render() {
+        // early return if there isn't a searchTerm or there is 1 or fewer pages of results
+        if (!this.searchTerm || this.searchResultsPagesCount <= 1) {
+            return;
+        }
+        return (h("div", { class: classNames('searchcraft-pagination', parseCustomStyles(this.customStyles || {})) }, h("div", { class: 'searchcraft-pagination-control' }, h("searchcraft-button", { disabled: this.searchResultsPage === 1, hierarchy: 'tertiary', onButtonClick: () => this.handleGoToPage(Math.max(1, this.searchResultsPage - 1)), label: 'PREVIOUS', iconPosition: 'left', icon: h("svg", { width: '20', height: '20', viewBox: '0 0 20 20', fill: 'none', xmlns: 'http://www.w3.org/2000/svg' }, h("title", null, "Previous page icon"), h("path", { d: 'M12.5 15L7.5 10L12.5 5', stroke: 'currentColor', "stroke-width": '1.5', "stroke-linecap": 'round', "stroke-linejoin": 'round' })) })), h("ul", { class: 'searchcraft-pagination-list' }, this.renderOddPaginationItem(1), this.renderEvenPaginationItem(2), this.renderMiddlePaginationItem(), this.renderEvenPaginationItem(this.searchResultsPagesCount > 4
+            ? this.searchResultsPagesCount - 1
+            : 4), this.renderOddPaginationItem(this.searchResultsPagesCount)), h("div", { class: 'searchcraft-pagination-control' }, h("searchcraft-button", { disabled: this.searchResultsPage === this.searchResultsPagesCount, hierarchy: 'tertiary', onButtonClick: () => {
+                this.handleGoToPage(Math.min(this.searchResultsPagesCount, this.searchResultsPage + 1));
+            }, label: 'NEXT', iconPosition: 'right', icon: h("svg", { width: '20', height: '20', viewBox: '0 0 20 20', fill: 'none', xmlns: 'http://www.w3.org/2000/svg' }, h("title", null, "Next page icon"), h("path", { d: 'M7.5 15L12.5 10L7.5 5', stroke: 'currentColor', "stroke-width": '1.5', "stroke-linecap": 'round', "stroke-linejoin": 'round' })) }))));
+    }
+    static get is() { return "searchcraft-pagination"; }
+    static get properties() {
+        return {
+            "customStyles": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "The custom styles object."
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "custom-styles",
+                "reflect": false
+            }
+        };
+    }
+    static get states() {
+        return {
+            "searchTerm": {},
+            "searchResultsPerPage": {},
+            "searchResultsPage": {},
+            "searchResultsCount": {},
+            "searchResultsPagesCount": {},
+            "searchResultsRangeMin": {},
+            "searchResultsRangeMax": {},
+            "setSearchResultsPage": {}
+        };
+    }
+}
+//# sourceMappingURL=searchcraft-pagination.js.map

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

@@ -0,0 +1 @@

+ {"version":3,"file":"searchcraft-pagination.js","sourceRoot":"","sources":["../../../../src/components/searchcraft-pagination/searchcraft-pagination.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useSearchcraftStore } from '@provider/store';\nimport { Component, h, State, Prop } from '@stencil/core';\nimport classNames from 'classnames';\n\nimport { parseCustomStyles } from '@utils';\n\n/**\n * This web component is designed to facilitate pagination of search results.\n * Once a query is submitted, calculates the number for pages.\n *\n * ## Usage\n * ```html\n * \n * <searchcraft-pagination />\n * ```\n */\n@Component({\n tag: 'searchcraft-pagination',\n shadow: false,\n})\nexport class SearchcraftPagination {\n /**\n * The custom styles object.\n */\n @Prop() customStyles?: string;\n\n // store vars\n @State() searchTerm;\n @State() searchResultsPerPage;\n @State() searchResultsPage;\n @State() searchResultsCount;\n\n // local vars\n @State() searchResultsPagesCount = 1;\n @State() searchResultsRangeMin = 1;\n @State() searchResultsRangeMax = 1;\n\n // store functions\n @State() setSearchResultsPage: (page: number) => void = () => {};\n\n private unsubscribe: () => void = () => {};\n\n componentDidLoad() {\n this.unsubscribe = useSearchcraftStore.subscribe((state) => {\n // store vars\n this.searchTerm = state.searchTerm;\n this.searchResultsPerPage = state.searchResultsPerPage;\n this.searchResultsPage = state.searchResultsPage;\n this.searchResultsCount = state.searchResultsCount;\n\n // local vars\n this.searchResultsPagesCount = Math.ceil(\n this.searchResultsCount / this.searchResultsPerPage,\n );\n this.searchResultsRangeMin =\n (this.searchResultsPage - 1) * this.searchResultsPerPage + 1;\n this.searchResultsRangeMax =\n (this.searchResultsPerPage - 1) * this.searchResultsPerPage +\n this.searchResultsPerPage;\n\n // store functions\n this.setSearchResultsPage = state.setSearchResultsPage;\n });\n }\n\n disconnectedCallback() {\n this.unsubscribe?.();\n }\n\n handleGoToPage(page: number) {\n this.setSearchResultsPage(page);\n }\n\n renderOddPaginationItem(page: number) {\n return (\n <li>\n <button\n class={classNames('searchcraft-pagination-item', {\n 'searchcraft-pagination-item-active':\n this.searchResultsPage === page,\n })}\n onClick={() => this.handleGoToPage(page)}\n type='button'\n >\n {page}\n </button>\n </li>\n );\n }\n\n renderEvenPaginationItem(page: number) {\n if (this.searchResultsPagesCount <= page) {\n return;\n }\n\n if (\n this.searchResultsPagesCount <= 5 ||\n page < Math.ceil(this.searchResultsPagesCount / 2) // is the first or second even pagination item\n ? this.searchResultsPage <= page + 1\n : this.searchResultsPage >= page - 1\n ) {\n return (\n <li>\n <button\n class={classNames('searchcraft-pagination-item', {\n 'searchcraft-pagination-item-active':\n this.searchResultsPage === page,\n })}\n onClick={() => this.handleGoToPage(page)}\n type='button'\n >\n {page}\n </button>\n </li>\n );\n }\n\n return (\n <li>\n <span class='searchcraft-pagination-item'>...</span>\n </li>\n );\n }\n\n renderMiddlePaginationItem() {\n if (this.searchResultsPagesCount <= 3) {\n return;\n }\n\n if (\n this.searchResultsPagesCount <= 5 ||\n this.searchResultsPage <= 3 ||\n this.searchResultsPage >= this.searchResultsPagesCount - 2\n ) {\n return (\n <li>\n <button\n class={classNames('searchcraft-pagination-item', {\n 'searchcraft-pagination-item-active':\n this.searchResultsPage === 3 ||\n this.searchResultsPage === this.searchResultsPagesCount - 2,\n })}\n type='button'\n onClick={() =>\n this.handleGoToPage(\n this.searchResultsPage >= this.searchResultsPagesCount - 2\n ? this.searchResultsPagesCount - 2\n : 3,\n )\n }\n >\n {this.searchResultsPage >= this.searchResultsPagesCount - 2\n ? this.searchResultsPagesCount - 2\n : 3}\n </button>\n </li>\n );\n }\n\n return (\n <li>\n <span class='searchcraft-pagination-item searchcraft-pagination-item-active'>\n {this.searchResultsPage}\n </span>\n </li>\n );\n }\n\n render() {\n // early return if there isn't a searchTerm or there is 1 or fewer pages of results\n if (!this.searchTerm || this.searchResultsPagesCount <= 1) {\n return;\n }\n\n return (\n <div\n class={classNames(\n 'searchcraft-pagination',\n parseCustomStyles(this.customStyles || {}),\n )}\n >\n <div class='searchcraft-pagination-control'>\n <searchcraft-button\n disabled={this.searchResultsPage === 1}\n hierarchy='tertiary'\n onButtonClick={() =>\n this.handleGoToPage(Math.max(1, this.searchResultsPage - 1))\n }\n label='PREVIOUS'\n iconPosition='left'\n icon={\n <svg\n width='20'\n height='20'\n viewBox='0 0 20 20'\n fill='none'\n xmlns='http://www.w3.org/2000/svg'\n >\n <title>Previous page icon</title>\n <path\n d='M12.5 15L7.5 10L12.5 5'\n stroke='currentColor'\n stroke-width='1.5'\n stroke-linecap='round'\n stroke-linejoin='round'\n />\n </svg>\n }\n />\n </div>\n <ul class='searchcraft-pagination-list'>\n {this.renderOddPaginationItem(1)}\n {this.renderEvenPaginationItem(2)}\n {this.renderMiddlePaginationItem()}\n {this.renderEvenPaginationItem(\n this.searchResultsPagesCount > 4\n ? this.searchResultsPagesCount - 1\n : 4,\n )}\n {this.renderOddPaginationItem(this.searchResultsPagesCount)}\n </ul>\n <div class='searchcraft-pagination-control'>\n <searchcraft-button\n disabled={this.searchResultsPage === this.searchResultsPagesCount}\n hierarchy='tertiary'\n onButtonClick={() => {\n this.handleGoToPage(\n Math.min(\n this.searchResultsPagesCount,\n this.searchResultsPage + 1,\n ),\n );\n }}\n label='NEXT'\n iconPosition='right'\n icon={\n <svg\n width='20'\n height='20'\n viewBox='0 0 20 20'\n fill='none'\n xmlns='http://www.w3.org/2000/svg'\n >\n <title>Next page icon</title>\n <path\n d='M7.5 15L12.5 10L7.5 5'\n stroke='currentColor'\n stroke-width='1.5'\n stroke-linecap='round'\n stroke-linejoin='round'\n />\n </svg>\n }\n />\n </div>\n </div>\n );\n }\n}\n"]}

package/dist/collection/components/searchcraft-popover-button/searchcraft-popover-button.js CHANGED Viewed

@@ -8,7 +8,7 @@ export class SearchcraftPopoverButton {
         useSearchcraftStore.getState().setPopoverVisibility(true);
     }
     render() {
-        return (h("button", { key: '3907a514a85a79c320f529840fda06474721871a', type: 'button', onClick: this.handleOnClick.bind(this) }, h("slot", { key: '91bedc41efb5c17a774eab7a95e0abac39497408' })));
+        return (h("button", { key: '538e1e8506bea196e6ba45482f9daa75d032462f', type: 'button', onClick: this.handleOnClick.bind(this) }, h("slot", { key: '788b70da6edcbfb283d373ada36709582ad16e51' })));
     }
     static get is() { return "searchcraft-popover-button"; }
 }