@searchcraft/javascript-sdk 0.5.2 → 0.5.3

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.
@@ -8,7 +8,7 @@ const utils = require('./utils-a17279a2.js');
8
8
  const index$1 = require('./index-5b0b9d4c.js');
9
9
 
10
10
  const name = "@searchcraft/javascript-sdk";
11
- const version = "0.5.2";
11
+ const version = "0.5.3";
12
12
  const description = "Searchcraft Javascript SDK";
13
13
  const author = "Searchcraft";
14
14
  const license = "Apache-2.0";
@@ -23,10 +23,6 @@ const exports$1 = {
23
23
  require: "./dist/searchcraft-javascript-sdk/searchcraft-javascript-sdk.cjs.js",
24
24
  types: "./dist/types/index.d.ts"
25
25
  },
26
- "./dist/*": {
27
- "import": "./dist/*",
28
- types: "./dist/*"
29
- },
30
26
  "./components": {
31
27
  "import": "./dist/components/index.js",
32
28
  types: "./dist/components/index.d.ts"
@@ -35,6 +31,10 @@ const exports$1 = {
35
31
  "import": "./dist/loader/index.js",
36
32
  require: "./dist/loader/index.cjs",
37
33
  types: "./dist/loader/index.d.ts"
34
+ },
35
+ "./dist/components/*": {
36
+ "import": "./dist/components/*",
37
+ types: "./dist/components/*"
38
38
  }
39
39
  };
40
40
  const repository = {
@@ -7,7 +7,7 @@ import { d as defineCustomElement$3 } from './p-16983367.js';
7
7
  import { d as defineCustomElement$2 } from './p-bd5fede3.js';
8
8
 
9
9
  const name = "@searchcraft/javascript-sdk";
10
- const version = "0.5.2";
10
+ const version = "0.5.3";
11
11
  const description = "Searchcraft Javascript SDK";
12
12
  const author = "Searchcraft";
13
13
  const license = "Apache-2.0";
@@ -22,10 +22,6 @@ const exports = {
22
22
  require: "./dist/searchcraft-javascript-sdk/searchcraft-javascript-sdk.cjs.js",
23
23
  types: "./dist/types/index.d.ts"
24
24
  },
25
- "./dist/*": {
26
- "import": "./dist/*",
27
- types: "./dist/*"
28
- },
29
25
  "./components": {
30
26
  "import": "./dist/components/index.js",
31
27
  types: "./dist/components/index.d.ts"
@@ -34,6 +30,10 @@ const exports = {
34
30
  "import": "./dist/loader/index.js",
35
31
  require: "./dist/loader/index.cjs",
36
32
  types: "./dist/loader/index.d.ts"
33
+ },
34
+ "./dist/components/*": {
35
+ "import": "./dist/components/*",
36
+ types: "./dist/components/*"
37
37
  }
38
38
  };
39
39
  const repository = {
@@ -4,7 +4,7 @@ import { p as parseCustomStyles } from './utils-c2ce411f.js';
4
4
  import { c as classNames } from './index-72ac5051.js';
5
5
 
6
6
  const name = "@searchcraft/javascript-sdk";
7
- const version = "0.5.2";
7
+ const version = "0.5.3";
8
8
  const description = "Searchcraft Javascript SDK";
9
9
  const author = "Searchcraft";
10
10
  const license = "Apache-2.0";
@@ -19,10 +19,6 @@ const exports = {
19
19
  require: "./dist/searchcraft-javascript-sdk/searchcraft-javascript-sdk.cjs.js",
20
20
  types: "./dist/types/index.d.ts"
21
21
  },
22
- "./dist/*": {
23
- "import": "./dist/*",
24
- types: "./dist/*"
25
- },
26
22
  "./components": {
27
23
  "import": "./dist/components/index.js",
28
24
  types: "./dist/components/index.d.ts"
@@ -31,6 +27,10 @@ const exports = {
31
27
  "import": "./dist/loader/index.js",
32
28
  require: "./dist/loader/index.cjs",
33
29
  types: "./dist/loader/index.d.ts"
30
+ },
31
+ "./dist/components/*": {
32
+ "import": "./dist/components/*",
33
+ types: "./dist/components/*"
34
34
  }
35
35
  };
36
36
  const repository = {
@@ -0,0 +1,2 @@
1
+ import{r as t,c as e,h as s}from"./p-d7d0b88c.js";import{u as r,i as a}from"./p-ad4ebde0.js";import{p as c}from"./p-f308d05d.js";import{c as i}from"./p-5cdc6210.js";const n="@searchcraft/javascript-sdk";const o="0.5.3";const d="Searchcraft Javascript SDK";const p="Searchcraft";const h="Apache-2.0";const u="dist/index.cjs.js";const f="dist/index.js";const l="dist/types/index.d.ts";const b="dist/collection/collection-manifest.json";const g="dist/searchcraft-javascript-sdk/searchcraft-javascript-sdk.esm.js";const y={".":{import:"./dist/searchcraft-javascript-sdk/searchcraft-javascript-sdk.esm.js",require:"./dist/searchcraft-javascript-sdk/searchcraft-javascript-sdk.cjs.js",types:"./dist/types/index.d.ts"},"./components":{import:"./dist/components/index.js",types:"./dist/components/index.d.ts"},"./loader":{import:"./dist/loader/index.js",require:"./dist/loader/index.cjs",types:"./dist/loader/index.d.ts"},"./dist/components/*":{import:"./dist/components/*",types:"./dist/components/*"}};const m={type:"git",url:"https://bitbucket.org/madebychalk/searchcraft-javascript-sdks/"};const v=["dist/"];const w={build:"stencil build",dev:"stencil build --dev --watch",test:"stencil test --spec --e2e","test.watch":"stencil test --spec --e2e --watchAll",generate:"stencil generate"};const F={classnames:"^2.3.2"};const x={"@searchcraft/core":"*","@searchcraft/javascript-sdk":"*","@stencil/core":"^4.7.0","@stencil/react-output-target":"^0.8.2","@stencil/sass":"^3.0.12","@types/node":"^16.18.11",zustand:"^5.0.1"};const k={name:n,private:false,version:o,description:d,author:p,license:h,main:u,module:f,types:l,collection:b,"collection:main":"dist/collection/index.js",unpkg:g,exports:y,repository:m,files:v,scripts:w,dependencies:F,devDependencies:x};const C=":root{--sc-spinner-size:20px;--sc-input-border-radius:8px;--sc-input-search-icon-size:20px;--sc-input-clear-icon-size:20px;--sc-input-padding-left:44px;--sc-input-padding-right:44px;--sc-image-border-radius:8px}:root{--sc-surface-disabled:#D9D9D9;--sc-surface-neutral-primary:#FFFFFF;--sc-surface-neutral-secondary:#F3F3F3;--sc-surface-neutral-light:#FFFFFF;--sc-surface-neutral-primary-hover:#FAFAFA;--sc-surface-neutral-primary-active:#F7F7F7;--sc-surface-neutral-secondary-hover:#EDEDED;--sc-surface-neutral-secondary-active:#E6E6E6;--sc-surface-brand-primary:#000000;--sc-surface-brand-secondary:#E6E6E6;--sc-surface-brand-primary-hover:#2E2E2E;--sc-surface-brand-primary-active:#292929;--sc-surface-brand-secondary-hover:#EBEBEB;--sc-surface-brand-secondary-active:#E0E0E0;--sc-surface-success-primary:#008000;--sc-surface-success-secondary:#CCFFCC;--sc-surface-success-primary-hover:#009900;--sc-surface-success-primary-active:#006600;--sc-surface-success-secondary-hover:#E6FFE6;--sc-surface-success-secondary-active:#E6FFE6;--sc-surface-caution-primary:#CC6600;--sc-surface-caution-secondary:#FFD9B3;--sc-surface-caution-primary-hover:#E57300;--sc-surface-caution-primary-active:#B25A00;--sc-surface-caution-secondary-hover:#FFE5CC;--sc-surface-caution-secondary-active:#FFCC99;--sc-surface-danger-primary:#CC0000;--sc-surface-danger-secondary:#FFCCCC;--sc-surface-danger-primary-hover:#E50000;--sc-surface-danger-primary-active:#B30000;--sc-surface-danger-secondary-hover:#FFE7E7;--sc-surface-danger-secondary-active:#FFB3B3;--sc-content-brand:#000000;--sc-content-success:#008000;--sc-content-caution:#994D00;--sc-content-danger:#990000;--sc-content-disabled:#737373;--sc-content-neutral-primary:#292929;--sc-content-neutral-secondary:#404040;--sc-content-brand-on-primary:#FFFFFF;--sc-content-success-on-primary:#FFFFFF;--sc-content-caution-on-primary:#FFFFFF;--sc-content-danger-on-primary:#FFFFFF;--sc-content-disabled-on-disabled:#737373;--sc-border-neutral:rgba(0,0,0, 0.1);--sc-border-brand:#000000;--sc-border-success:#008000;--sc-border-caution:#CC6600;--sc-border-danger:#CC0000;--sc-border-disabled:#737373}:root{--sc-font-family:sans-serif;--sc-heading-1-font-size:32px;--sc-heading-1-line-height:36px;--sc-heading-1-font-weight:700;--sc-heading-2-font-size:29px;--sc-heading-2-line-height:32px;--sc-heading-2-font-weight:700;--sc-heading-3-font-size:26px;--sc-heading-3-line-height:28px;--sc-heading-3-font-weight:700;--sc-heading-4-font-size:23px;--sc-heading-4-line-height:24px;--sc-heading-4-font-weight:700;--sc-heading-5-font-size:20px;--sc-heading-5-line-height:24px;--sc-heading-5-font-weight:700;--sc-heading-6-font-size:10px;--sc-heading-6-line-height:12px;--sc-heading-6-font-weight:700;--sc-body-bold-font-size:16px;--sc-body-bold-line-height:20px;--sc-body-bold-font-weight:700;--sc-body-font-size:16px;--sc-body-line-height:20px;--sc-body-font-weight:400;--sc-body-small-bold-font-size:12px;--sc-body-small-bold-line-height:16px;--sc-body-small-bold-font-weight:700;--sc-body-small-font-size:12px;--sc-body-small-line-height:16px;--sc-body-small-font-weight:400}.searchcraft-input-wrapper{position:relative;display:flex}.searchcraft-input-grid{display:grid;gap:4px 8px}.searchcraft-input-grid-buttonLeft{grid-template-rows:repeat(3, auto);grid-template-columns:auto 1fr}.searchcraft-input-grid-buttonLeft .searchcraft-input-button-wrapper{grid-column:1/span 1;grid-row:2/span 1}.searchcraft-input-grid-buttonLeft .searchcraft-input-label-wrapper{grid-column:2/span 1;grid-row:1/span 1}.searchcraft-input-grid-buttonLeft .searchcraft-input-error-wrapper{grid-column:2/span 1;grid-row:3/span 1}.searchcraft-input-grid-buttonLeft .searchcraft-input-wrapper{grid-column:2/span 1;grid-row:2/span 1}.searchcraft-input-grid-buttonRight{grid-template-rows:repeat(3, auto);grid-template-columns:1fr auto}.searchcraft-input-grid-buttonRight .searchcraft-input-button-wrapper{grid-column:2/span 1;grid-row:2/span 1}.searchcraft-input-grid-buttonRight .searchcraft-input-label-wrapper{grid-column:1/span 1;grid-row:1/span 1}.searchcraft-input-grid-buttonRight .searchcraft-input-error-wrapper{grid-column:1/span 1;grid-row:3/span 1}.searchcraft-input-grid-buttonRight .searchcraft-input-wrapper{grid-column:1/span 1;grid-row:2/span 1}.searchcraft-input-grid-buttonNone{grid-template-rows:repeat(3, auto);grid-template-columns:auto}.searchcraft-input-grid-buttonNone .searchcraft-input-button-wrapper{display:none}.searchcraft-input-grid-buttonNone .searchcraft-input-label-wrapper{grid-column:1/span 1;grid-row:1/span 1}.searchcraft-input-grid-buttonNone .searchcraft-input-error-wrapper{grid-column:1/span 1;grid-row:3/span 1}.searchcraft-input-grid-buttonNone .searchcraft-input-wrapper{grid-column:1/span 1;grid-row:2/span 1}.searchcraft-input{font-family:var(--sc-font-family);-webkit-font-smoothing:antialiased;font-size:var(--sc-body-font-size);font-weight:var(--sc-body-font-weight);line-height:var(--sc-body-line-height);background-color:var(--sc-surface-neutral-secondary);border:none;border-radius:var(--sc-input-border-radius);color:var(--sc-content-neutral-primary);outline:none;padding-left:var(--sc-input-padding-left);padding-right:var(--sc-input-padding-right);padding-top:12px;padding-bottom:12px;flex:1}.searchcraft-input::placeholder{color:var(--sc-content-disabled)}.searchcraft-input:focus{outline:var(--sc-border-brand) solid 2px}.searchcraft-input:focus::placeholder{opacity:0}.searchcraft-input.error{color:var(--sc-content-danger);outline:var(--sc-border-danger) solid 2px}.searchcraft-input.error:focus{outline:var(--sc-border-danger) solid 2px}.searchcraft-input-search-icon-wrapper{align-items:center;justify-content:center;display:flex;position:absolute;pointer-events:none;bottom:0;left:0;top:0;width:var(--sc-input-padding-left)}.searchcraft-input-search-icon{pointer-events:none;width:var(--sc-input-search-icon-size);height:var(--sc-input-search-icon-size)}.searchcraft-input-clear-button{all:unset;align-items:center;justify-content:center;cursor:pointer;display:flex;position:absolute;border:none;outline:none;bottom:0;right:0;top:0;width:var(--sc-input-padding-right)}.searchcraft-input-clear-icon{width:var(--sc-input-clear-icon-size);height:var(--sc-input-clear-icon-size)}";const j=C;const E=class{constructor(s){t(this,s);this.inputCleared=e(this,"inputCleared",7);this.noResultsReceived=e(this,"noResultsReceived",7);this.querySubmit=e(this,"querySubmit",7);this.inputFocus=e(this,"inputFocus",7);this.inputBlur=e(this,"inputBlur",7);this.debounceTimeout=null;this.searchStore=r.getState();this.handleOnInput=t=>{const e=t.target;this.inputValue=e.value;if(e.value.trim()===""){this.inputCleared.emit();return}if(!this.autoSearch){return}if(this.debounceDelay>0){if(this.debounceTimeout){clearTimeout(this.debounceTimeout)}this.debounceTimeout=setTimeout((()=>this.performSearch(e.value)),this.debounceDelay)}else{this.performSearch(e.value)}};this.performSearch=async t=>{if(t===r.getState().query){return}this.querySubmit.emit(t);this.searchTerm=t.trim();this.error=false;this.searchStore.setQuery(this.searchTerm);try{await this.searchStore.search()}catch(t){this.error=true;this.inputCleared.emit()}};this.handleClearInput=()=>{this.inputValue="";if(this.debounceTimeout){clearTimeout(this.debounceTimeout)}this.searchTerm="";this.searchStore.setQuery("");this.searchStore.setSearchResults(null);this.error=false;if(this.inputCleared){this.inputCleared.emit()}};this.handleFormSubmit=async t=>{t.preventDefault();await this.performSearch(this.searchTerm)};this.config=undefined;this.autoSearch=true;this.buttonPlacement="none";this.buttonLabel=undefined;this.inputLabel=undefined;this.customStyles={};this.placeholderValue="Enter Search";this.searchTerm="";this.debounceDelay=0;this.inputValue=this.searchTerm;this.error=false;this.isSearchcraftInitialized=false}init(){if(this.config&&!this.isSearchcraftInitialized){const t=new a(this.config,{sdkName:k.name,sdkVersion:k.version});this.searchStore.initialize(t,true);this.isSearchcraftInitialized=true}}componentDidLoad(){this.init()}onConfigChange(){this.init()}render(){const t=c(this.customStyles);const e=this.inputValue.length>0;const r=i("searchcraft-input-grid",{"searchcraft-input-grid-buttonLeft":this.buttonPlacement==="left","searchcraft-input-grid-buttonRight":this.buttonPlacement==="right","searchcraft-input-grid-buttonNone":this.buttonPlacement==="none"});return s("form",{key:"7f224a10ab80d70660c9db97be5d68830932570b",class:"searchcraft-input-form",onSubmit:this.handleFormSubmit},s("div",{key:"6822a21a43e5be992b11ddb6c86370ddd68e1475",class:r},s("div",{key:"6022989ca876ea46de048398a076bc43d5213554",class:"searchcraft-input-button-wrapper"},s("searchcraft-button",{key:"d48b61729ef9a3f19049dfe751aefa22fdc85e9f",onButtonClick:this.handleFormSubmit,label:this.buttonLabel})),s("div",{key:"3465e467cbb965ad813b6c9c726173bb3fe828f2",class:"searchcraft-input-label-wrapper"},s("searchcraft-input-label",{key:"1026b7834358c6673a72ef8352830c9b4681020f",label:this.inputLabel})),this.error&&s("div",{key:"ff0d55cd88e1895f9b0bd4c0afc917127e76afa2",class:"searchcraft-input-error-wrapper"},s("searchcraft-error-message",{key:"57fc160411f21f45617e1a3b8677fb4c6e96c0f0",errorMessage:"Please enter a search query."})),s("div",{key:"b2783bf86177d22d4abedb4420fdb2a1807527ef",class:"searchcraft-input-wrapper"},s("input",{key:"e985da32be58ab3e200866e085b2acd25b54aa31",autoComplete:"off",class:"searchcraft-input",onFocus:()=>this.inputFocus.emit(),onBlur:()=>this.inputBlur.emit(),onInput:t=>{this.handleOnInput(t)},placeholder:this.placeholderValue,style:t,type:"text",value:this.inputValue}),s("div",{key:"d5277758ae26262f5f3b49e8763add412661e5cf",class:"searchcraft-input-search-icon-wrapper"},s("svg",{key:"79792740ea1207fad40786f555c63c4a26ff3fe2",class:"searchcraft-input-search-icon",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-labelledby":"searchcraft-title"},s("title",{key:"7a487bdf41babdafb802ebd79c34a6a5da300cd6",id:"searchcraft-title"},"Searchcraft Search Icon Light"),s("path",{key:"27c442bf412aca373cbc982b3a35a00fe7bb82ed",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"}))),e&&s("button",{key:"4c4bc21e9e87f4245ac38d7af269aae35876b6b0",type:"button",class:"searchcraft-input-clear-button",onClick:this.handleClearInput},s("svg",{key:"4b82e65987a8a8c296d2b9c279474c29607727e0",class:"searchcraft-input-clear-icon",viewBox:"0 0 22 22",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-labelledby":"icon-title"},s("title",{key:"9d64212798691a2f8c6c9c4f74ceca1d2fe39fd1",id:"icon-title"},"Searchcraft Clear Input Icon Light"),s("path",{key:"4c6c5b33fbd9ac02661996bb56e0902094e9b140",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"}))))))}static get watchers(){return{config:["onConfigChange"]}}};E.style=j;export{E as searchcraft_input_form};
2
+ //# sourceMappingURL=p-32068485.entry.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["searchcraftInputFormModuleCss","SearchcraftInputFormStyle0","SearchcraftInput","this","debounceTimeout","searchStore","useSearchcraftStore","getState","handleOnInput","event","input","target","inputValue","value","trim","inputCleared","emit","autoSearch","debounceDelay","clearTimeout","setTimeout","performSearch","async","query","querySubmit","searchTerm","error","setQuery","search","handleClearInput","setSearchResults","handleFormSubmit","preventDefault","init","config","isSearchcraftInitialized","searchcraft","SearchcraftCore","sdkName","packageJson","name","sdkVersion","version","initialize","componentDidLoad","onConfigChange","render","validatedCustomStyles","parseCustomStyles","customStyles","isShowingClearButton","length","inputGridClassNames","classNames","buttonPlacement","h","key","class","onSubmit","onButtonClick","label","buttonLabel","inputLabel","errorMessage","autoComplete","onFocus","inputFocus","onBlur","inputBlur","onInput","placeholder","placeholderValue","style","type","viewBox","fill","xmlns","id","d","stroke","onClick"],"sources":["src/components/searchcraft-input-form/searchcraft-input-form.module.scss?tag=searchcraft-input-form","src/components/searchcraft-input-form/searchcraft-input-form.tsx"],"sourcesContent":[".searchcraft-input-wrapper {\n position: relative;\n display: flex;\n}\n\n.searchcraft-input-grid {\n display: grid;\n gap: 4px 8px;\n}\n\n.searchcraft-input-grid-buttonLeft {\n grid-template-rows: repeat(3, auto);\n grid-template-columns: auto 1fr;\n\n & .searchcraft-input-button-wrapper {\n grid-column: 1 / span 1;\n grid-row: 2 / span 1;\n }\n\n & .searchcraft-input-label-wrapper {\n grid-column: 2 / span 1;\n grid-row: 1 / span 1;\n }\n\n & .searchcraft-input-error-wrapper {\n grid-column: 2 / span 1;\n grid-row: 3 / span 1;\n }\n\n & .searchcraft-input-wrapper {\n grid-column: 2 / span 1;\n grid-row: 2 / span 1;\n }\n}\n\n.searchcraft-input-grid-buttonRight {\n grid-template-rows: repeat(3, auto);\n grid-template-columns: 1fr auto;\n\n & .searchcraft-input-button-wrapper {\n grid-column: 2 / span 1;\n grid-row: 2 / span 1;\n }\n\n & .searchcraft-input-label-wrapper {\n grid-column: 1 / span 1;\n grid-row: 1 / span 1;\n }\n\n & .searchcraft-input-error-wrapper {\n grid-column: 1 / span 1;\n grid-row: 3 / span 1;\n }\n\n & .searchcraft-input-wrapper {\n grid-column: 1 / span 1;\n grid-row: 2 / span 1;\n }\n}\n\n.searchcraft-input-grid-buttonNone {\n grid-template-rows: repeat(3, auto);\n grid-template-columns: auto;\n\n & .searchcraft-input-button-wrapper {\n display: none;\n }\n\n & .searchcraft-input-label-wrapper {\n grid-column: 1 / span 1;\n grid-row: 1 / span 1;\n }\n\n & .searchcraft-input-error-wrapper {\n grid-column: 1 / span 1;\n grid-row: 3 / span 1;\n }\n\n & .searchcraft-input-wrapper {\n grid-column: 1 / span 1;\n grid-row: 2 / span 1;\n }\n}\n\n.searchcraft-input {\n @include body();\n background-color: var(--sc-surface-neutral-secondary);\n border: none;\n border-radius: var(--sc-input-border-radius);\n color: var(--sc-content-neutral-primary);\n outline: none;\n padding-left: var(--sc-input-padding-left);\n padding-right: var(--sc-input-padding-right);\n padding-top: 12px;\n padding-bottom: 12px;\n flex: 1;\n\n &::placeholder {\n color: var(--sc-content-disabled);\n }\n\n &:focus {\n outline: var(--sc-border-brand) solid 2px;\n }\n\n &:focus::placeholder {\n opacity: 0;\n }\n}\n\n.searchcraft-input.error {\n color: var(--sc-content-danger);\n outline: var(--sc-border-danger) solid 2px;\n\n &:focus {\n outline: var(--sc-border-danger) solid 2px;\n }\n}\n\n.searchcraft-input-search-icon-wrapper {\n align-items: center;\n justify-content: center;\n display: flex;\n position: absolute;\n pointer-events: none;\n bottom: 0;\n left: 0;\n top: 0;\n width: var(--sc-input-padding-left);\n}\n\n.searchcraft-input-search-icon {\n pointer-events: none;\n width: var(--sc-input-search-icon-size);\n height: var(--sc-input-search-icon-size);\n}\n\n.searchcraft-input-clear-button {\n all: unset;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n display: flex;\n position: absolute;\n border: none;\n outline: none;\n bottom: 0;\n right: 0;\n top: 0;\n width: var(--sc-input-padding-right);\n}\n\n.searchcraft-input-clear-icon {\n width: var(--sc-input-clear-icon-size);\n height: var(--sc-input-clear-icon-size);\n}\n","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/utils';\nimport { useSearchcraftStore } from '@provider/store';\nimport classNames from 'classnames';\n\nexport interface ScInputCustomEvent<T> extends CustomEvent<T> {\n detail: T;\n target: HTMLSearchcraftInputFormElement;\n}\n\n@Component({\n tag: 'searchcraft-input-form',\n styleUrl: 'searchcraft-input-form.module.scss',\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 * The duration to debounce the input's `inputChange` event.\n */\n @Prop() debounceDelay = 0;\n /**\n * Event emitted when the input element has been cleared.\n */\n @Event() inputCleared: EventEmitter<void>;\n /**\n * Event emitted when a query returns with no results received.\n */\n @Event() noResultsReceived: EventEmitter<void>;\n /**\n * Event emitted when a new search request has been submitted.\n */\n @Event() querySubmit: EventEmitter<string>;\n /**\n * Event emitted when the input has gained focus.\n */\n @Event() inputFocus: EventEmitter<void>;\n /**\n * Event emitted when the input has lost focus.\n */\n @Event() inputBlur: EventEmitter<void>;\n\n @State() inputValue = this.searchTerm;\n @State() error = false;\n @State() isSearchcraftInitialized = false;\n\n private debounceTimeout: ReturnType<typeof setTimeout> | null = null;\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 }\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 return;\n }\n\n if (!this.autoSearch) {\n return;\n }\n\n if (this.debounceDelay > 0) {\n if (this.debounceTimeout) {\n clearTimeout(this.debounceTimeout);\n }\n\n this.debounceTimeout = setTimeout(\n () => this.performSearch(input.value),\n this.debounceDelay,\n );\n } else {\n this.performSearch(input.value);\n }\n };\n\n private performSearch = async (value: string) => {\n if (value === useSearchcraftStore.getState().query) {\n return;\n }\n this.querySubmit.emit(value);\n this.searchTerm = value.trim();\n this.error = false;\n this.searchStore.setQuery(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\n if (this.debounceTimeout) {\n clearTimeout(this.debounceTimeout);\n }\n\n this.searchTerm = '';\n this.searchStore.setQuery('');\n this.searchStore.setSearchResults(null);\n this.error = false;\n\n if (this.inputCleared) {\n this.inputCleared.emit();\n }\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 return (\n <form class='searchcraft-input-form' onSubmit={this.handleFormSubmit}>\n <div class={inputGridClassNames}>\n <div class='searchcraft-input-button-wrapper'>\n <searchcraft-button\n onButtonClick={this.handleFormSubmit}\n label={this.buttonLabel}\n />\n </div>\n <div class='searchcraft-input-label-wrapper'>\n <searchcraft-input-label label={this.inputLabel} />\n </div>\n {this.error && (\n <div class='searchcraft-input-error-wrapper'>\n <searchcraft-error-message errorMessage='Please enter a search query.' />\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"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"names":["searchcraftInputFormModuleCss","SearchcraftInputFormStyle0","SearchcraftInput","this","debounceTimeout","searchStore","useSearchcraftStore","getState","handleOnInput","event","input","target","inputValue","value","trim","inputCleared","emit","autoSearch","debounceDelay","clearTimeout","setTimeout","performSearch","async","query","querySubmit","searchTerm","error","setQuery","search","handleClearInput","setSearchResults","handleFormSubmit","preventDefault","init","config","isSearchcraftInitialized","searchcraft","SearchcraftCore","sdkName","packageJson","name","sdkVersion","version","initialize","componentDidLoad","onConfigChange","render","validatedCustomStyles","parseCustomStyles","customStyles","isShowingClearButton","length","inputGridClassNames","classNames","buttonPlacement","h","key","class","onSubmit","onButtonClick","label","buttonLabel","inputLabel","errorMessage","autoComplete","onFocus","inputFocus","onBlur","inputBlur","onInput","placeholder","placeholderValue","style","type","viewBox","fill","xmlns","id","d","stroke","onClick"],"sources":["src/components/searchcraft-input-form/searchcraft-input-form.module.scss?tag=searchcraft-input-form","src/components/searchcraft-input-form/searchcraft-input-form.tsx"],"sourcesContent":[".searchcraft-input-wrapper {\n position: relative;\n display: flex;\n}\n\n.searchcraft-input-grid {\n display: grid;\n gap: 4px 8px;\n}\n\n.searchcraft-input-grid-buttonLeft {\n grid-template-rows: repeat(3, auto);\n grid-template-columns: auto 1fr;\n\n & .searchcraft-input-button-wrapper {\n grid-column: 1 / span 1;\n grid-row: 2 / span 1;\n }\n\n & .searchcraft-input-label-wrapper {\n grid-column: 2 / span 1;\n grid-row: 1 / span 1;\n }\n\n & .searchcraft-input-error-wrapper {\n grid-column: 2 / span 1;\n grid-row: 3 / span 1;\n }\n\n & .searchcraft-input-wrapper {\n grid-column: 2 / span 1;\n grid-row: 2 / span 1;\n }\n}\n\n.searchcraft-input-grid-buttonRight {\n grid-template-rows: repeat(3, auto);\n grid-template-columns: 1fr auto;\n\n & .searchcraft-input-button-wrapper {\n grid-column: 2 / span 1;\n grid-row: 2 / span 1;\n }\n\n & .searchcraft-input-label-wrapper {\n grid-column: 1 / span 1;\n grid-row: 1 / span 1;\n }\n\n & .searchcraft-input-error-wrapper {\n grid-column: 1 / span 1;\n grid-row: 3 / span 1;\n }\n\n & .searchcraft-input-wrapper {\n grid-column: 1 / span 1;\n grid-row: 2 / span 1;\n }\n}\n\n.searchcraft-input-grid-buttonNone {\n grid-template-rows: repeat(3, auto);\n grid-template-columns: auto;\n\n & .searchcraft-input-button-wrapper {\n display: none;\n }\n\n & .searchcraft-input-label-wrapper {\n grid-column: 1 / span 1;\n grid-row: 1 / span 1;\n }\n\n & .searchcraft-input-error-wrapper {\n grid-column: 1 / span 1;\n grid-row: 3 / span 1;\n }\n\n & .searchcraft-input-wrapper {\n grid-column: 1 / span 1;\n grid-row: 2 / span 1;\n }\n}\n\n.searchcraft-input {\n @include body();\n background-color: var(--sc-surface-neutral-secondary);\n border: none;\n border-radius: var(--sc-input-border-radius);\n color: var(--sc-content-neutral-primary);\n outline: none;\n padding-left: var(--sc-input-padding-left);\n padding-right: var(--sc-input-padding-right);\n padding-top: 12px;\n padding-bottom: 12px;\n flex: 1;\n\n &::placeholder {\n color: var(--sc-content-disabled);\n }\n\n &:focus {\n outline: var(--sc-border-brand) solid 2px;\n }\n\n &:focus::placeholder {\n opacity: 0;\n }\n}\n\n.searchcraft-input.error {\n color: var(--sc-content-danger);\n outline: var(--sc-border-danger) solid 2px;\n\n &:focus {\n outline: var(--sc-border-danger) solid 2px;\n }\n}\n\n.searchcraft-input-search-icon-wrapper {\n align-items: center;\n justify-content: center;\n display: flex;\n position: absolute;\n pointer-events: none;\n bottom: 0;\n left: 0;\n top: 0;\n width: var(--sc-input-padding-left);\n}\n\n.searchcraft-input-search-icon {\n pointer-events: none;\n width: var(--sc-input-search-icon-size);\n height: var(--sc-input-search-icon-size);\n}\n\n.searchcraft-input-clear-button {\n all: unset;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n display: flex;\n position: absolute;\n border: none;\n outline: none;\n bottom: 0;\n right: 0;\n top: 0;\n width: var(--sc-input-padding-right);\n}\n\n.searchcraft-input-clear-icon {\n width: var(--sc-input-clear-icon-size);\n height: var(--sc-input-clear-icon-size);\n}\n","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/utils';\nimport { useSearchcraftStore } from '@provider/store';\nimport classNames from 'classnames';\n\nexport interface ScInputCustomEvent<T> extends CustomEvent<T> {\n detail: T;\n target: HTMLSearchcraftInputFormElement;\n}\n\n@Component({\n tag: 'searchcraft-input-form',\n styleUrl: 'searchcraft-input-form.module.scss',\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 * The duration to debounce the input's `inputChange` event.\n */\n @Prop() debounceDelay = 0;\n /**\n * Event emitted when the input element has been cleared.\n */\n @Event() inputCleared: EventEmitter<void>;\n /**\n * Event emitted when a query returns with no results received.\n */\n @Event() noResultsReceived: EventEmitter<void>;\n /**\n * Event emitted when a new search request has been submitted.\n */\n @Event() querySubmit: EventEmitter<string>;\n /**\n * Event emitted when the input has gained focus.\n */\n @Event() inputFocus: EventEmitter<void>;\n /**\n * Event emitted when the input has lost focus.\n */\n @Event() inputBlur: EventEmitter<void>;\n\n @State() inputValue = this.searchTerm;\n @State() error = false;\n @State() isSearchcraftInitialized = false;\n\n private debounceTimeout: ReturnType<typeof setTimeout> | null = null;\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 }\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 return;\n }\n\n if (!this.autoSearch) {\n return;\n }\n\n if (this.debounceDelay > 0) {\n if (this.debounceTimeout) {\n clearTimeout(this.debounceTimeout);\n }\n\n this.debounceTimeout = setTimeout(\n () => this.performSearch(input.value),\n this.debounceDelay,\n );\n } else {\n this.performSearch(input.value);\n }\n };\n\n private performSearch = async (value: string) => {\n if (value === useSearchcraftStore.getState().query) {\n return;\n }\n this.querySubmit.emit(value);\n this.searchTerm = value.trim();\n this.error = false;\n this.searchStore.setQuery(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\n if (this.debounceTimeout) {\n clearTimeout(this.debounceTimeout);\n }\n\n this.searchTerm = '';\n this.searchStore.setQuery('');\n this.searchStore.setSearchResults(null);\n this.error = false;\n\n if (this.inputCleared) {\n this.inputCleared.emit();\n }\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 return (\n <form class='searchcraft-input-form' onSubmit={this.handleFormSubmit}>\n <div class={inputGridClassNames}>\n <div class='searchcraft-input-button-wrapper'>\n <searchcraft-button\n onButtonClick={this.handleFormSubmit}\n label={this.buttonLabel}\n />\n </div>\n <div class='searchcraft-input-label-wrapper'>\n <searchcraft-input-label label={this.inputLabel} />\n </div>\n {this.error && (\n <div class='searchcraft-input-error-wrapper'>\n <searchcraft-error-message errorMessage='Please enter a search query.' />\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"],"mappings":"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","ignoreList":[]}
@@ -1,2 +1,2 @@
1
- import{p as e,b as t}from"./p-d7d0b88c.js";export{s as setNonce}from"./p-d7d0b88c.js";import{g as a}from"./p-e1255160.js";var r=()=>{const t=import.meta.url;const a={};if(t!==""){a.resourcesUrl=new URL(".",t).href}return e(a)};r().then((async e=>{await a();return t([["p-a810aeae",[[0,"searchcraft-filter-panel",{items:[16],unsubscribe:[32],lastQuery:[32]}]]],["p-3e4a28e7",[[0,"searchcraft-input-form",{config:[16],autoSearch:[4,"auto-search"],buttonPlacement:[1,"button-placement"],buttonLabel:[1,"button-label"],inputLabel:[1,"input-label"],customStyles:[1,"custom-styles"],placeholderValue:[1,"placeholder-value"],searchTerm:[1,"search-term"],debounceDelay:[2,"debounce-delay"],inputValue:[32],error:[32],isSearchcraftInitialized:[32]},null,{config:["onConfigChange"]}]]],["p-4d3682a8",[[4,"searchcraft-base-search-results",{adInterval:[2,"ad-interval"],customStylesForResults:[1,"custom-styles-for-results"],searchResultMappings:[16],placeAdAtEnd:[4,"place-ad-at-end"],placeAdAtStart:[4,"place-ad-at-start"],resultImagePlacement:[1,"result-image-placement"],buttonLabel:[1,"button-label"],buttonTarget:[1,"button-target"],buttonRel:[1,"button-rel"],containerTarget:[1,"container-target"],containerRel:[1,"container-rel"],hasSearched:[32],query:[32],searchResults:[32]}]]],["p-61cf9d6c",[[0,"searchcraft-popover-form",{config:[16],type:[1],popoverResultMappings:[16]}]]],["p-a7a7b4e0",[[0,"searchcraft-popover-result"]]],["p-d57eba31",[[0,"searchcraft-results-info",{isRequesting:[32],resultsCount:[32],responseTime:[32],query:[32]}]]],["p-93b92b65",[[0,"searchcraft-base-search-result",{titleContent:[1,"title-content"],subtitleContent:[1,"subtitle-content"],bodyContent:[1,"body-content"],footerContent:[1,"footer-content"],buttonLabel:[1,"button-label"],buttonHref:[1,"button-href"],buttonTarget:[1,"button-target"],buttonRel:[1,"button-rel"],containerHref:[1,"container-href"],containerTarget:[1,"container-target"],containerRel:[1,"container-rel"],imageSrc:[1,"image-src"],imageAlt:[1,"image-alt"],imagePlacement:[1,"image-placement"],customStyles:[1,"custom-styles"],documentPosition:[2,"document-position"]}]]],["p-adadf38a",[[0,"searchcraft-popover-list-view",{popoverResultMappings:[16]}]]],["p-04300412",[[0,"searchcraft-button",{iconElement:[16],iconOnly:[4,"icon-only"],iconPosition:[1,"icon-position"],label:[1],isRequesting:[32]}],[0,"searchcraft-input-label",{inputLabelClassName:[1,"input-label-class-name"],label:[1]}]]],["p-09c7fbef",[[0,"searchcraft-error-message",{errorMessage:[1,"error-message"]}]]],["p-aa155194",[[0,"searchcraft-facet-list",{fieldName:[1,"field-name"],baseFacetRoot:[32],facetRoot:[32],selectedPaths:[32],lastTimeTaken:[32],hasNewSearchTerm:[32],lastQuery:[32],lastSearchMode:[32],lastSortType:[32],unsubscribe:[32]}],[0,"searchcraft-slider",{max:[2],min:[2],granularity:[2],dataType:[1,"data-type"],endValue:[32],startValue:[32],lastFocusedHandle:[32]}],[0,"searchcraft-toggle-button",{label:[1],subLabel:[1,"sub-label"],isActive:[32],unsubscribe:[32],lastQuery:[32]}]]]],e)}));
1
+ import{p as e,b as t}from"./p-d7d0b88c.js";export{s as setNonce}from"./p-d7d0b88c.js";import{g as a}from"./p-e1255160.js";var r=()=>{const t=import.meta.url;const a={};if(t!==""){a.resourcesUrl=new URL(".",t).href}return e(a)};r().then((async e=>{await a();return t([["p-a810aeae",[[0,"searchcraft-filter-panel",{items:[16],unsubscribe:[32],lastQuery:[32]}]]],["p-32068485",[[0,"searchcraft-input-form",{config:[16],autoSearch:[4,"auto-search"],buttonPlacement:[1,"button-placement"],buttonLabel:[1,"button-label"],inputLabel:[1,"input-label"],customStyles:[1,"custom-styles"],placeholderValue:[1,"placeholder-value"],searchTerm:[1,"search-term"],debounceDelay:[2,"debounce-delay"],inputValue:[32],error:[32],isSearchcraftInitialized:[32]},null,{config:["onConfigChange"]}]]],["p-4d3682a8",[[4,"searchcraft-base-search-results",{adInterval:[2,"ad-interval"],customStylesForResults:[1,"custom-styles-for-results"],searchResultMappings:[16],placeAdAtEnd:[4,"place-ad-at-end"],placeAdAtStart:[4,"place-ad-at-start"],resultImagePlacement:[1,"result-image-placement"],buttonLabel:[1,"button-label"],buttonTarget:[1,"button-target"],buttonRel:[1,"button-rel"],containerTarget:[1,"container-target"],containerRel:[1,"container-rel"],hasSearched:[32],query:[32],searchResults:[32]}]]],["p-61cf9d6c",[[0,"searchcraft-popover-form",{config:[16],type:[1],popoverResultMappings:[16]}]]],["p-a7a7b4e0",[[0,"searchcraft-popover-result"]]],["p-d57eba31",[[0,"searchcraft-results-info",{isRequesting:[32],resultsCount:[32],responseTime:[32],query:[32]}]]],["p-93b92b65",[[0,"searchcraft-base-search-result",{titleContent:[1,"title-content"],subtitleContent:[1,"subtitle-content"],bodyContent:[1,"body-content"],footerContent:[1,"footer-content"],buttonLabel:[1,"button-label"],buttonHref:[1,"button-href"],buttonTarget:[1,"button-target"],buttonRel:[1,"button-rel"],containerHref:[1,"container-href"],containerTarget:[1,"container-target"],containerRel:[1,"container-rel"],imageSrc:[1,"image-src"],imageAlt:[1,"image-alt"],imagePlacement:[1,"image-placement"],customStyles:[1,"custom-styles"],documentPosition:[2,"document-position"]}]]],["p-adadf38a",[[0,"searchcraft-popover-list-view",{popoverResultMappings:[16]}]]],["p-04300412",[[0,"searchcraft-button",{iconElement:[16],iconOnly:[4,"icon-only"],iconPosition:[1,"icon-position"],label:[1],isRequesting:[32]}],[0,"searchcraft-input-label",{inputLabelClassName:[1,"input-label-class-name"],label:[1]}]]],["p-09c7fbef",[[0,"searchcraft-error-message",{errorMessage:[1,"error-message"]}]]],["p-aa155194",[[0,"searchcraft-facet-list",{fieldName:[1,"field-name"],baseFacetRoot:[32],facetRoot:[32],selectedPaths:[32],lastTimeTaken:[32],hasNewSearchTerm:[32],lastQuery:[32],lastSearchMode:[32],lastSortType:[32],unsubscribe:[32]}],[0,"searchcraft-slider",{max:[2],min:[2],granularity:[2],dataType:[1,"data-type"],endValue:[32],startValue:[32],lastFocusedHandle:[32]}],[0,"searchcraft-toggle-button",{label:[1],subLabel:[1,"sub-label"],isActive:[32],unsubscribe:[32],lastQuery:[32]}]]]],e)}));
2
2
  //# sourceMappingURL=searchcraft-javascript-sdk.esm.js.map
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@searchcraft/javascript-sdk",
3
3
  "private": false,
4
- "version": "0.5.2",
4
+ "version": "0.5.3",
5
5
  "description": "Searchcraft Javascript SDK",
6
6
  "author": "Searchcraft",
7
7
  "license": "Apache-2.0",
@@ -17,10 +17,6 @@
17
17
  "require": "./dist/searchcraft-javascript-sdk/searchcraft-javascript-sdk.cjs.js",
18
18
  "types": "./dist/types/index.d.ts"
19
19
  },
20
- "./dist/*": {
21
- "import": "./dist/*",
22
- "types": "./dist/*"
23
- },
24
20
  "./components": {
25
21
  "import": "./dist/components/index.js",
26
22
  "types": "./dist/components/index.d.ts"
@@ -29,6 +25,10 @@
29
25
  "import": "./dist/loader/index.js",
30
26
  "require": "./dist/loader/index.cjs",
31
27
  "types": "./dist/loader/index.d.ts"
28
+ },
29
+ "./dist/components/*": {
30
+ "import": "./dist/components/*",
31
+ "types": "./dist/components/*"
32
32
  }
33
33
  },
34
34
  "repository": {
@@ -1,2 +0,0 @@
1
- import{r as t,c as e,h as s}from"./p-d7d0b88c.js";import{u as r,i as a}from"./p-ad4ebde0.js";import{p as c}from"./p-f308d05d.js";import{c as i}from"./p-5cdc6210.js";const n="@searchcraft/javascript-sdk";const o="0.5.2";const d="Searchcraft Javascript SDK";const p="Searchcraft";const h="Apache-2.0";const u="dist/index.cjs.js";const f="dist/index.js";const l="dist/types/index.d.ts";const b="dist/collection/collection-manifest.json";const g="dist/searchcraft-javascript-sdk/searchcraft-javascript-sdk.esm.js";const y={".":{import:"./dist/searchcraft-javascript-sdk/searchcraft-javascript-sdk.esm.js",require:"./dist/searchcraft-javascript-sdk/searchcraft-javascript-sdk.cjs.js",types:"./dist/types/index.d.ts"},"./dist/*":{import:"./dist/*",types:"./dist/*"},"./components":{import:"./dist/components/index.js",types:"./dist/components/index.d.ts"},"./loader":{import:"./dist/loader/index.js",require:"./dist/loader/index.cjs",types:"./dist/loader/index.d.ts"}};const m={type:"git",url:"https://bitbucket.org/madebychalk/searchcraft-javascript-sdks/"};const v=["dist/"];const w={build:"stencil build",dev:"stencil build --dev --watch",test:"stencil test --spec --e2e","test.watch":"stencil test --spec --e2e --watchAll",generate:"stencil generate"};const F={classnames:"^2.3.2"};const x={"@searchcraft/core":"*","@searchcraft/javascript-sdk":"*","@stencil/core":"^4.7.0","@stencil/react-output-target":"^0.8.2","@stencil/sass":"^3.0.12","@types/node":"^16.18.11",zustand:"^5.0.1"};const k={name:n,private:false,version:o,description:d,author:p,license:h,main:u,module:f,types:l,collection:b,"collection:main":"dist/collection/index.js",unpkg:g,exports:y,repository:m,files:v,scripts:w,dependencies:F,devDependencies:x};const C=":root{--sc-spinner-size:20px;--sc-input-border-radius:8px;--sc-input-search-icon-size:20px;--sc-input-clear-icon-size:20px;--sc-input-padding-left:44px;--sc-input-padding-right:44px;--sc-image-border-radius:8px}:root{--sc-surface-disabled:#D9D9D9;--sc-surface-neutral-primary:#FFFFFF;--sc-surface-neutral-secondary:#F3F3F3;--sc-surface-neutral-light:#FFFFFF;--sc-surface-neutral-primary-hover:#FAFAFA;--sc-surface-neutral-primary-active:#F7F7F7;--sc-surface-neutral-secondary-hover:#EDEDED;--sc-surface-neutral-secondary-active:#E6E6E6;--sc-surface-brand-primary:#000000;--sc-surface-brand-secondary:#E6E6E6;--sc-surface-brand-primary-hover:#2E2E2E;--sc-surface-brand-primary-active:#292929;--sc-surface-brand-secondary-hover:#EBEBEB;--sc-surface-brand-secondary-active:#E0E0E0;--sc-surface-success-primary:#008000;--sc-surface-success-secondary:#CCFFCC;--sc-surface-success-primary-hover:#009900;--sc-surface-success-primary-active:#006600;--sc-surface-success-secondary-hover:#E6FFE6;--sc-surface-success-secondary-active:#E6FFE6;--sc-surface-caution-primary:#CC6600;--sc-surface-caution-secondary:#FFD9B3;--sc-surface-caution-primary-hover:#E57300;--sc-surface-caution-primary-active:#B25A00;--sc-surface-caution-secondary-hover:#FFE5CC;--sc-surface-caution-secondary-active:#FFCC99;--sc-surface-danger-primary:#CC0000;--sc-surface-danger-secondary:#FFCCCC;--sc-surface-danger-primary-hover:#E50000;--sc-surface-danger-primary-active:#B30000;--sc-surface-danger-secondary-hover:#FFE7E7;--sc-surface-danger-secondary-active:#FFB3B3;--sc-content-brand:#000000;--sc-content-success:#008000;--sc-content-caution:#994D00;--sc-content-danger:#990000;--sc-content-disabled:#737373;--sc-content-neutral-primary:#292929;--sc-content-neutral-secondary:#404040;--sc-content-brand-on-primary:#FFFFFF;--sc-content-success-on-primary:#FFFFFF;--sc-content-caution-on-primary:#FFFFFF;--sc-content-danger-on-primary:#FFFFFF;--sc-content-disabled-on-disabled:#737373;--sc-border-neutral:rgba(0,0,0, 0.1);--sc-border-brand:#000000;--sc-border-success:#008000;--sc-border-caution:#CC6600;--sc-border-danger:#CC0000;--sc-border-disabled:#737373}:root{--sc-font-family:sans-serif;--sc-heading-1-font-size:32px;--sc-heading-1-line-height:36px;--sc-heading-1-font-weight:700;--sc-heading-2-font-size:29px;--sc-heading-2-line-height:32px;--sc-heading-2-font-weight:700;--sc-heading-3-font-size:26px;--sc-heading-3-line-height:28px;--sc-heading-3-font-weight:700;--sc-heading-4-font-size:23px;--sc-heading-4-line-height:24px;--sc-heading-4-font-weight:700;--sc-heading-5-font-size:20px;--sc-heading-5-line-height:24px;--sc-heading-5-font-weight:700;--sc-heading-6-font-size:10px;--sc-heading-6-line-height:12px;--sc-heading-6-font-weight:700;--sc-body-bold-font-size:16px;--sc-body-bold-line-height:20px;--sc-body-bold-font-weight:700;--sc-body-font-size:16px;--sc-body-line-height:20px;--sc-body-font-weight:400;--sc-body-small-bold-font-size:12px;--sc-body-small-bold-line-height:16px;--sc-body-small-bold-font-weight:700;--sc-body-small-font-size:12px;--sc-body-small-line-height:16px;--sc-body-small-font-weight:400}.searchcraft-input-wrapper{position:relative;display:flex}.searchcraft-input-grid{display:grid;gap:4px 8px}.searchcraft-input-grid-buttonLeft{grid-template-rows:repeat(3, auto);grid-template-columns:auto 1fr}.searchcraft-input-grid-buttonLeft .searchcraft-input-button-wrapper{grid-column:1/span 1;grid-row:2/span 1}.searchcraft-input-grid-buttonLeft .searchcraft-input-label-wrapper{grid-column:2/span 1;grid-row:1/span 1}.searchcraft-input-grid-buttonLeft .searchcraft-input-error-wrapper{grid-column:2/span 1;grid-row:3/span 1}.searchcraft-input-grid-buttonLeft .searchcraft-input-wrapper{grid-column:2/span 1;grid-row:2/span 1}.searchcraft-input-grid-buttonRight{grid-template-rows:repeat(3, auto);grid-template-columns:1fr auto}.searchcraft-input-grid-buttonRight .searchcraft-input-button-wrapper{grid-column:2/span 1;grid-row:2/span 1}.searchcraft-input-grid-buttonRight .searchcraft-input-label-wrapper{grid-column:1/span 1;grid-row:1/span 1}.searchcraft-input-grid-buttonRight .searchcraft-input-error-wrapper{grid-column:1/span 1;grid-row:3/span 1}.searchcraft-input-grid-buttonRight .searchcraft-input-wrapper{grid-column:1/span 1;grid-row:2/span 1}.searchcraft-input-grid-buttonNone{grid-template-rows:repeat(3, auto);grid-template-columns:auto}.searchcraft-input-grid-buttonNone .searchcraft-input-button-wrapper{display:none}.searchcraft-input-grid-buttonNone .searchcraft-input-label-wrapper{grid-column:1/span 1;grid-row:1/span 1}.searchcraft-input-grid-buttonNone .searchcraft-input-error-wrapper{grid-column:1/span 1;grid-row:3/span 1}.searchcraft-input-grid-buttonNone .searchcraft-input-wrapper{grid-column:1/span 1;grid-row:2/span 1}.searchcraft-input{font-family:var(--sc-font-family);-webkit-font-smoothing:antialiased;font-size:var(--sc-body-font-size);font-weight:var(--sc-body-font-weight);line-height:var(--sc-body-line-height);background-color:var(--sc-surface-neutral-secondary);border:none;border-radius:var(--sc-input-border-radius);color:var(--sc-content-neutral-primary);outline:none;padding-left:var(--sc-input-padding-left);padding-right:var(--sc-input-padding-right);padding-top:12px;padding-bottom:12px;flex:1}.searchcraft-input::placeholder{color:var(--sc-content-disabled)}.searchcraft-input:focus{outline:var(--sc-border-brand) solid 2px}.searchcraft-input:focus::placeholder{opacity:0}.searchcraft-input.error{color:var(--sc-content-danger);outline:var(--sc-border-danger) solid 2px}.searchcraft-input.error:focus{outline:var(--sc-border-danger) solid 2px}.searchcraft-input-search-icon-wrapper{align-items:center;justify-content:center;display:flex;position:absolute;pointer-events:none;bottom:0;left:0;top:0;width:var(--sc-input-padding-left)}.searchcraft-input-search-icon{pointer-events:none;width:var(--sc-input-search-icon-size);height:var(--sc-input-search-icon-size)}.searchcraft-input-clear-button{all:unset;align-items:center;justify-content:center;cursor:pointer;display:flex;position:absolute;border:none;outline:none;bottom:0;right:0;top:0;width:var(--sc-input-padding-right)}.searchcraft-input-clear-icon{width:var(--sc-input-clear-icon-size);height:var(--sc-input-clear-icon-size)}";const j=C;const E=class{constructor(s){t(this,s);this.inputCleared=e(this,"inputCleared",7);this.noResultsReceived=e(this,"noResultsReceived",7);this.querySubmit=e(this,"querySubmit",7);this.inputFocus=e(this,"inputFocus",7);this.inputBlur=e(this,"inputBlur",7);this.debounceTimeout=null;this.searchStore=r.getState();this.handleOnInput=t=>{const e=t.target;this.inputValue=e.value;if(e.value.trim()===""){this.inputCleared.emit();return}if(!this.autoSearch){return}if(this.debounceDelay>0){if(this.debounceTimeout){clearTimeout(this.debounceTimeout)}this.debounceTimeout=setTimeout((()=>this.performSearch(e.value)),this.debounceDelay)}else{this.performSearch(e.value)}};this.performSearch=async t=>{if(t===r.getState().query){return}this.querySubmit.emit(t);this.searchTerm=t.trim();this.error=false;this.searchStore.setQuery(this.searchTerm);try{await this.searchStore.search()}catch(t){this.error=true;this.inputCleared.emit()}};this.handleClearInput=()=>{this.inputValue="";if(this.debounceTimeout){clearTimeout(this.debounceTimeout)}this.searchTerm="";this.searchStore.setQuery("");this.searchStore.setSearchResults(null);this.error=false;if(this.inputCleared){this.inputCleared.emit()}};this.handleFormSubmit=async t=>{t.preventDefault();await this.performSearch(this.searchTerm)};this.config=undefined;this.autoSearch=true;this.buttonPlacement="none";this.buttonLabel=undefined;this.inputLabel=undefined;this.customStyles={};this.placeholderValue="Enter Search";this.searchTerm="";this.debounceDelay=0;this.inputValue=this.searchTerm;this.error=false;this.isSearchcraftInitialized=false}init(){if(this.config&&!this.isSearchcraftInitialized){const t=new a(this.config,{sdkName:k.name,sdkVersion:k.version});this.searchStore.initialize(t,true);this.isSearchcraftInitialized=true}}componentDidLoad(){this.init()}onConfigChange(){this.init()}render(){const t=c(this.customStyles);const e=this.inputValue.length>0;const r=i("searchcraft-input-grid",{"searchcraft-input-grid-buttonLeft":this.buttonPlacement==="left","searchcraft-input-grid-buttonRight":this.buttonPlacement==="right","searchcraft-input-grid-buttonNone":this.buttonPlacement==="none"});return s("form",{key:"7f224a10ab80d70660c9db97be5d68830932570b",class:"searchcraft-input-form",onSubmit:this.handleFormSubmit},s("div",{key:"6822a21a43e5be992b11ddb6c86370ddd68e1475",class:r},s("div",{key:"6022989ca876ea46de048398a076bc43d5213554",class:"searchcraft-input-button-wrapper"},s("searchcraft-button",{key:"d48b61729ef9a3f19049dfe751aefa22fdc85e9f",onButtonClick:this.handleFormSubmit,label:this.buttonLabel})),s("div",{key:"3465e467cbb965ad813b6c9c726173bb3fe828f2",class:"searchcraft-input-label-wrapper"},s("searchcraft-input-label",{key:"1026b7834358c6673a72ef8352830c9b4681020f",label:this.inputLabel})),this.error&&s("div",{key:"ff0d55cd88e1895f9b0bd4c0afc917127e76afa2",class:"searchcraft-input-error-wrapper"},s("searchcraft-error-message",{key:"57fc160411f21f45617e1a3b8677fb4c6e96c0f0",errorMessage:"Please enter a search query."})),s("div",{key:"b2783bf86177d22d4abedb4420fdb2a1807527ef",class:"searchcraft-input-wrapper"},s("input",{key:"e985da32be58ab3e200866e085b2acd25b54aa31",autoComplete:"off",class:"searchcraft-input",onFocus:()=>this.inputFocus.emit(),onBlur:()=>this.inputBlur.emit(),onInput:t=>{this.handleOnInput(t)},placeholder:this.placeholderValue,style:t,type:"text",value:this.inputValue}),s("div",{key:"d5277758ae26262f5f3b49e8763add412661e5cf",class:"searchcraft-input-search-icon-wrapper"},s("svg",{key:"79792740ea1207fad40786f555c63c4a26ff3fe2",class:"searchcraft-input-search-icon",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-labelledby":"searchcraft-title"},s("title",{key:"7a487bdf41babdafb802ebd79c34a6a5da300cd6",id:"searchcraft-title"},"Searchcraft Search Icon Light"),s("path",{key:"27c442bf412aca373cbc982b3a35a00fe7bb82ed",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"}))),e&&s("button",{key:"4c4bc21e9e87f4245ac38d7af269aae35876b6b0",type:"button",class:"searchcraft-input-clear-button",onClick:this.handleClearInput},s("svg",{key:"4b82e65987a8a8c296d2b9c279474c29607727e0",class:"searchcraft-input-clear-icon",viewBox:"0 0 22 22",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-labelledby":"icon-title"},s("title",{key:"9d64212798691a2f8c6c9c4f74ceca1d2fe39fd1",id:"icon-title"},"Searchcraft Clear Input Icon Light"),s("path",{key:"4c6c5b33fbd9ac02661996bb56e0902094e9b140",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"}))))))}static get watchers(){return{config:["onConfigChange"]}}};E.style=j;export{E as searchcraft_input_form};
2
- //# sourceMappingURL=p-3e4a28e7.entry.js.map