vue-instantsearch 4.14.0 → 4.16.0
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.
- package/package.json +5 -5
- package/src/__tests__/common-widgets.test.js +16 -0
- package/src/components/RefinementList.vue +3 -2
- package/src/components/SearchInput.vue +0 -1
- package/src/components/__tests__/NumericMenu.js +0 -51
- package/vue2/cjs/index.js +1 -1
- package/vue2/cjs/index.js.map +1 -1
- package/vue2/es/package.json.js +1 -1
- package/vue2/es/src/components/RefinementList.vue.js +1 -1
- package/vue2/es/src/components/RefinementList.vue_rollup-plugin-vue=script.js.map +1 -1
- package/vue2/umd/index.js +1 -1
- package/vue2/umd/index.js.map +1 -1
- package/vue3/cjs/index.js +1 -1
- package/vue3/cjs/index.js.map +1 -1
- package/vue3/es/package.json.js +1 -1
- package/vue3/es/src/components/RefinementList.vue.js +1 -1
- package/vue3/es/src/components/RefinementList.vue_vue&type=script&lang.js.map +1 -1
- package/vue3/es/src/components/RefinementList.vue_vue&type=template&id=e39e9d16&lang.js +2 -0
- package/vue3/es/src/components/RefinementList.vue_vue&type=template&id=e39e9d16&lang.js.map +1 -0
- package/vue3/es/src/components/SearchInput.vue.js +1 -1
- package/vue3/es/src/components/SearchInput.vue_vue&type=script&lang.js.map +1 -1
- package/vue3/es/src/components/{SearchInput.vue_vue&type=template&id=02fb82e2&lang.js → SearchInput.vue_vue&type=template&id=79e30e4e&lang.js} +1 -1
- package/vue3/es/src/components/SearchInput.vue_vue&type=template&id=79e30e4e&lang.js.map +1 -0
- package/vue3/umd/index.js +1 -1
- package/vue3/umd/index.js.map +1 -1
- package/src/components/__tests__/RefinementList.js +0 -199
- package/src/components/__tests__/__snapshots__/RefinementList.js.snap +0 -405
- package/vue3/es/src/components/RefinementList.vue_vue&type=template&id=80c1baee&lang.js +0 -2
- package/vue3/es/src/components/RefinementList.vue_vue&type=template&id=80c1baee&lang.js.map +0 -1
- package/vue3/es/src/components/SearchInput.vue_vue&type=template&id=02fb82e2&lang.js.map +0 -1
package/vue3/es/package.json.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
var r="4.
|
|
1
|
+
var r="4.16.0";export{r as version};
|
|
2
2
|
//# sourceMappingURL=package.json.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import e from"./RefinementList.vue_vue&type=script&lang.js";import{render as t}from"./RefinementList.vue_vue&type=template&id=
|
|
1
|
+
import e from"./RefinementList.vue_vue&type=script&lang.js";import{render as t}from"./RefinementList.vue_vue&type=template&id=e39e9d16&lang.js";e.render=t;export default e;
|
|
2
2
|
//# sourceMappingURL=RefinementList.vue.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RefinementList.vue_vue&type=script&lang.js","sources":["../../../../src/components/RefinementList.vue"],"sourcesContent":["<template>\n <div\n :class=\"[suit(),
|
|
1
|
+
{"version":3,"file":"RefinementList.vue_vue&type=script&lang.js","sources":["../../../../src/components/RefinementList.vue"],"sourcesContent":["<template>\n <div\n :class=\"[suit(), items.length === 0 && suit('', 'noRefinement')]\"\n v-if=\"state\"\n >\n <slot\n :items=\"items\"\n :refine=\"refine\"\n :search-for-items=\"state.searchForItems\"\n :search-for-items-query=\"searchForFacetValuesQuery\"\n :toggle-show-more=\"toggleShowMore\"\n :can-toggle-show-more=\"state.canToggleShowMore\"\n :is-showing-more=\"state.isShowingMore\"\n :createURL=\"state.createURL\"\n :is-from-search=\"state.isFromSearch\"\n :can-refine=\"state.canRefine\"\n :send-event=\"state.sendEvent\"\n >\n <div :class=\"suit('searchBox')\" v-if=\"searchable\">\n <search-input\n v-model=\"searchForFacetValues\"\n :show-loading-indicator=\"true\"\n :placeholder=\"searchablePlaceholder\"\n :class-names=\"classNames\"\n />\n </div>\n <slot\n name=\"noResults\"\n :query=\"searchForFacetValues\"\n v-if=\"state.isFromSearch && items.length === 0\"\n >\n <div :class=\"suit('noResults')\">No results.</div>\n </slot>\n <ul v-if=\"items.length > 0\" :class=\"suit('list')\">\n <li\n :class=\"[suit('item'), item.isRefined && suit('item', 'selected')]\"\n v-for=\"item in items\"\n :key=\"item.value\"\n >\n <slot\n name=\"item\"\n :item=\"item\"\n :refine=\"refine\"\n :createURL=\"state.createURL\"\n >\n <label :class=\"suit('label')\">\n <input\n :class=\"suit('checkbox')\"\n type=\"checkbox\"\n :value=\"item.value\"\n :checked=\"item.isRefined\"\n @change=\"refine(item.value)\"\n />\n <span v-if=\"searchable\" :class=\"suit('labelText')\">\n <ais-highlight attribute=\"item\" :hit=\"item\" />\n </span>\n <span v-else :class=\"suit('labelText')\">{{ item.label }}</span>\n <span :class=\"suit('count')\">{{ item.count }}</span>\n </label>\n </slot>\n </li>\n </ul>\n <button\n :class=\"[\n suit('showMore'),\n {\n [suit('showMore', 'disabled')]: !state.canToggleShowMore,\n },\n ]\"\n @click=\"toggleShowMore\"\n v-if=\"showMore\"\n :disabled=\"!state.canToggleShowMore\"\n >\n <slot name=\"showMoreLabel\" :is-showing-more=\"state.isShowingMore\">\n Show {{ state.isShowingMore ? 'less' : 'more' }}\n </slot>\n </button>\n </slot>\n </div>\n</template>\n\n<script>\nimport { connectRefinementList } from 'instantsearch.js/es/connectors';\n\nimport { createPanelConsumerMixin } from '../mixins/panel';\nimport { createSuitMixin } from '../mixins/suit';\nimport { createWidgetMixin } from '../mixins/widget';\n\nimport AisHighlight from './Highlight.vue';\nimport SearchInput from './SearchInput.vue';\n\nconst noop = () => {};\n\nexport default {\n name: 'AisRefinementList',\n components: { SearchInput, AisHighlight },\n mixins: [\n createSuitMixin({ name: 'RefinementList' }),\n createWidgetMixin(\n {\n connector: connectRefinementList,\n },\n {\n $$widgetType: 'ais.refinementList',\n }\n ),\n createPanelConsumerMixin(),\n ],\n props: {\n attribute: {\n type: String,\n required: true,\n },\n searchable: {\n type: Boolean,\n default: undefined,\n },\n searchablePlaceholder: {\n type: String,\n required: false,\n default: 'Search here…',\n },\n operator: {\n default: 'or',\n validator(value) {\n return value === 'and' || value === 'or';\n },\n required: false,\n },\n limit: {\n type: Number,\n required: false,\n default: undefined,\n },\n showMoreLimit: {\n type: Number,\n required: false,\n default: undefined,\n },\n showMore: {\n type: Boolean,\n required: false,\n default: false,\n },\n sortBy: {\n type: [Array, Function],\n required: false,\n default: undefined,\n },\n transformItems: {\n type: Function,\n required: false,\n default: undefined,\n },\n },\n data() {\n return {\n searchForFacetValuesQuery: '',\n };\n },\n computed: {\n searchForFacetValues: {\n get() {\n return this.searchForFacetValuesQuery;\n },\n set(value) {\n this.state.searchForItems(value);\n this.searchForFacetValuesQuery = value;\n },\n },\n toggleShowMore() {\n return this.state.toggleShowMore || noop;\n },\n items() {\n return this.state.items.map((item) =>\n Object.assign({}, item, {\n _highlightResult: {\n item: {\n value: item.highlighted,\n },\n },\n })\n );\n },\n widgetParams() {\n return {\n attribute: this.attribute,\n operator: this.operator,\n limit: this.limit,\n showMore: this.showMore,\n showMoreLimit: this.showMoreLimit,\n sortBy: this.sortBy,\n escapeFacetValues: true,\n transformItems: this.transformItems,\n };\n },\n },\n methods: {\n refine(value) {\n this.state.refine(value);\n this.searchForFacetValuesQuery = '';\n },\n },\n};\n</script>\n"],"names":["const","noop","name","components","SearchInput","AisHighlight","mixins","createSuitMixin","createWidgetMixin","connector","connectRefinementList","$$widgetType","createPanelConsumerMixin","props","attribute","type","String","required","searchable","Boolean","default","undefined","searchablePlaceholder","operator","validator","value","limit","Number","showMoreLimit","showMore","sortBy","Array","Function","transformItems","data","searchForFacetValuesQuery","computed","searchForFacetValues","get","this","set","state","searchForItems","toggleShowMore","items","map","item","Object","assign","_highlightResult","highlighted","widgetParams","escapeFacetValues","methods","refine"],"mappings":"gUA2FAA,IAAMC,6BAES,CACbC,KAAM,oBACNC,WAAY,aAAEC,eAAaC,GAC3BC,OAAQ,CACNC,EAAgB,CAAEL,KAAM,mBACxBM,EACE,CACEC,UAAWC,GAEb,CACEC,aAAc,uBAGlBC,KAEFC,MAAO,CACLC,UAAW,CACTC,KAAMC,OACNC,UAAU,GAEZC,WAAY,CACVH,KAAMI,QACNC,aAASC,GAEXC,sBAAuB,CACrBP,KAAMC,OACNC,UAAU,EACVG,QAAS,gBAEXG,SAAU,CACRH,QAAS,KACTI,mBAAUC,GACR,MAAiB,QAAVA,GAA6B,OAAVA,GAE5BR,UAAU,GAEZS,MAAO,CACLX,KAAMY,OACNV,UAAU,EACVG,aAASC,GAEXO,cAAe,CACbb,KAAMY,OACNV,UAAU,EACVG,aAASC,GAEXQ,SAAU,CACRd,KAAMI,QACNF,UAAU,EACVG,SAAS,GAEXU,OAAQ,CACNf,KAAM,CAACgB,MAAOC,UACdf,UAAU,EACVG,aAASC,GAEXY,eAAgB,CACdlB,KAAMiB,SACNf,UAAU,EACVG,aAASC,IAGba,gBACE,MAAO,CACLC,0BAA2B,KAG/BC,SAAU,CACRC,qBAAsB,CACpBC,eACE,OAAOC,KAAKJ,2BAEdK,aAAIf,GACFc,KAAKE,MAAMC,eAAejB,GAC1Bc,KAAKJ,0BAA4BV,IAGrCkB,0BACE,OAAOJ,KAAKE,MAAME,gBAAkB1C,GAEtC2C,iBACE,OAAOL,KAAKE,MAAMG,MAAMC,aAAKC,UAC3BC,OAAOC,OAAO,GAAIF,EAAM,CACtBG,iBAAkB,CAChBH,KAAM,CACJrB,MAAOqB,EAAKI,mBAMtBC,wBACE,MAAO,CACLrC,UAAWyB,KAAKzB,UAChBS,SAAUgB,KAAKhB,SACfG,MAAOa,KAAKb,MACZG,SAAUU,KAAKV,SACfD,cAAeW,KAAKX,cACpBE,OAAQS,KAAKT,OACbsB,mBAAmB,EACnBnB,eAAgBM,KAAKN,kBAI3BoB,QAAS,CACPC,gBAAO7B,GACLc,KAAKE,MAAMa,OAAO7B,GAClBc,KAAKJ,0BAA4B"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{resolveComponent as e,openBlock as s,createElementBlock as t,normalizeClass as a,renderSlot as o,createVNode as l,createCommentVNode as r,createElementVNode as n,Fragment as i,renderList as c,toDisplayString as u,createTextVNode as h}from"vue";var g=["value","checked","onChange"],m=["disabled"];function d(d,f,w,M,S,b){var v=e("search-input"),F=e("ais-highlight");return d.state?(s(),t("div",{key:0,class:a([d.suit(),0===b.items.length&&d.suit("","noRefinement")])},[o(d.$slots,"default",{items:b.items,refine:b.refine,searchForItems:d.state.searchForItems,searchForItemsQuery:S.searchForFacetValuesQuery,toggleShowMore:b.toggleShowMore,canToggleShowMore:d.state.canToggleShowMore,isShowingMore:d.state.isShowingMore,createURL:d.state.createURL,isFromSearch:d.state.isFromSearch,canRefine:d.state.canRefine,sendEvent:d.state.sendEvent},function(){var e;return[w.searchable?(s(),t("div",{key:0,class:a(d.suit("searchBox"))},[l(v,{modelValue:b.searchForFacetValues,"onUpdate:modelValue":f[0]||(f[0]=function(e){return b.searchForFacetValues=e}),"show-loading-indicator":!0,placeholder:w.searchablePlaceholder,"class-names":d.classNames},null,8,["modelValue","placeholder","class-names"])],2)):r("",!0),d.state.isFromSearch&&0===b.items.length?o(d.$slots,"noResults",{key:1,query:b.searchForFacetValues},function(){return[n("div",{class:a(d.suit("noResults"))},"No results.",2)]}):r("",!0),b.items.length>0?(s(),t("ul",{key:2,class:a(d.suit("list"))},[(s(!0),t(i,null,c(b.items,function(e){return s(),t("li",{class:a([d.suit("item"),e.isRefined&&d.suit("item","selected")]),key:e.value},[o(d.$slots,"item",{item:e,refine:b.refine,createURL:d.state.createURL},function(){return[n("label",{class:a(d.suit("label"))},[n("input",{class:a(d.suit("checkbox")),type:"checkbox",value:e.value,checked:e.isRefined,onChange:function(s){return b.refine(e.value)}},null,42,g),w.searchable?(s(),t("span",{key:0,class:a(d.suit("labelText"))},[l(F,{attribute:"item",hit:e},null,8,["hit"])],2)):(s(),t("span",{key:1,class:a(d.suit("labelText"))},u(e.label),3)),n("span",{class:a(d.suit("count"))},u(e.count),3)],2)]})],2)}),128))],2)):r("",!0),w.showMore?(s(),t("button",{key:3,class:a([d.suit("showMore"),(e={},e[d.suit("showMore","disabled")]=!d.state.canToggleShowMore,e)]),onClick:f[1]||(f[1]=function(){for(var e=[],s=arguments.length;s--;)e[s]=arguments[s];return b.toggleShowMore&&b.toggleShowMore.apply(b,e)}),disabled:!d.state.canToggleShowMore},[o(d.$slots,"showMoreLabel",{isShowingMore:d.state.isShowingMore},function(){return[h(" Show "+u(d.state.isShowingMore?"less":"more"),1)]})],10,m)):r("",!0)]})],2)):r("",!0)}export{d as render};
|
|
2
|
+
//# sourceMappingURL=RefinementList.vue_vue&type=template&id=e39e9d16&lang.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"RefinementList.vue_vue&type=template&id=e39e9d16&lang.js","sources":["../../../../src/components/RefinementList.vue?vue&type=template&id=e39e9d16&lang.js"],"sourcesContent":["<template>\n <div\n :class=\"[suit(), items.length === 0 && suit('', 'noRefinement')]\"\n v-if=\"state\"\n >\n <slot\n :items=\"items\"\n :refine=\"refine\"\n :search-for-items=\"state.searchForItems\"\n :search-for-items-query=\"searchForFacetValuesQuery\"\n :toggle-show-more=\"toggleShowMore\"\n :can-toggle-show-more=\"state.canToggleShowMore\"\n :is-showing-more=\"state.isShowingMore\"\n :createURL=\"state.createURL\"\n :is-from-search=\"state.isFromSearch\"\n :can-refine=\"state.canRefine\"\n :send-event=\"state.sendEvent\"\n >\n <div :class=\"suit('searchBox')\" v-if=\"searchable\">\n <search-input\n v-model=\"searchForFacetValues\"\n :show-loading-indicator=\"true\"\n :placeholder=\"searchablePlaceholder\"\n :class-names=\"classNames\"\n />\n </div>\n <slot\n name=\"noResults\"\n :query=\"searchForFacetValues\"\n v-if=\"state.isFromSearch && items.length === 0\"\n >\n <div :class=\"suit('noResults')\">No results.</div>\n </slot>\n <ul v-if=\"items.length > 0\" :class=\"suit('list')\">\n <li\n :class=\"[suit('item'), item.isRefined && suit('item', 'selected')]\"\n v-for=\"item in items\"\n :key=\"item.value\"\n >\n <slot\n name=\"item\"\n :item=\"item\"\n :refine=\"refine\"\n :createURL=\"state.createURL\"\n >\n <label :class=\"suit('label')\">\n <input\n :class=\"suit('checkbox')\"\n type=\"checkbox\"\n :value=\"item.value\"\n :checked=\"item.isRefined\"\n @change=\"refine(item.value)\"\n />\n <span v-if=\"searchable\" :class=\"suit('labelText')\">\n <ais-highlight attribute=\"item\" :hit=\"item\" />\n </span>\n <span v-else :class=\"suit('labelText')\">{{ item.label }}</span>\n <span :class=\"suit('count')\">{{ item.count }}</span>\n </label>\n </slot>\n </li>\n </ul>\n <button\n :class=\"[\n suit('showMore'),\n {\n [suit('showMore', 'disabled')]: !state.canToggleShowMore,\n },\n ]\"\n @click=\"toggleShowMore\"\n v-if=\"showMore\"\n :disabled=\"!state.canToggleShowMore\"\n >\n <slot name=\"showMoreLabel\" :is-showing-more=\"state.isShowingMore\">\n Show {{ state.isShowingMore ? 'less' : 'more' }}\n </slot>\n </button>\n </slot>\n </div>\n</template>\n\n<script>\nimport { connectRefinementList } from 'instantsearch.js/es/connectors';\n\nimport { createPanelConsumerMixin } from '../mixins/panel';\nimport { createSuitMixin } from '../mixins/suit';\nimport { createWidgetMixin } from '../mixins/widget';\n\nimport AisHighlight from './Highlight.vue';\nimport SearchInput from './SearchInput.vue';\n\nconst noop = () => {};\n\nexport default {\n name: 'AisRefinementList',\n components: { SearchInput, AisHighlight },\n mixins: [\n createSuitMixin({ name: 'RefinementList' }),\n createWidgetMixin(\n {\n connector: connectRefinementList,\n },\n {\n $$widgetType: 'ais.refinementList',\n }\n ),\n createPanelConsumerMixin(),\n ],\n props: {\n attribute: {\n type: String,\n required: true,\n },\n searchable: {\n type: Boolean,\n default: undefined,\n },\n searchablePlaceholder: {\n type: String,\n required: false,\n default: 'Search here…',\n },\n operator: {\n default: 'or',\n validator(value) {\n return value === 'and' || value === 'or';\n },\n required: false,\n },\n limit: {\n type: Number,\n required: false,\n default: undefined,\n },\n showMoreLimit: {\n type: Number,\n required: false,\n default: undefined,\n },\n showMore: {\n type: Boolean,\n required: false,\n default: false,\n },\n sortBy: {\n type: [Array, Function],\n required: false,\n default: undefined,\n },\n transformItems: {\n type: Function,\n required: false,\n default: undefined,\n },\n },\n data() {\n return {\n searchForFacetValuesQuery: '',\n };\n },\n computed: {\n searchForFacetValues: {\n get() {\n return this.searchForFacetValuesQuery;\n },\n set(value) {\n this.state.searchForItems(value);\n this.searchForFacetValuesQuery = value;\n },\n },\n toggleShowMore() {\n return this.state.toggleShowMore || noop;\n },\n items() {\n return this.state.items.map((item) =>\n Object.assign({}, item, {\n _highlightResult: {\n item: {\n value: item.highlighted,\n },\n },\n })\n );\n },\n widgetParams() {\n return {\n attribute: this.attribute,\n operator: this.operator,\n limit: this.limit,\n showMore: this.showMore,\n showMoreLimit: this.showMoreLimit,\n sortBy: this.sortBy,\n escapeFacetValues: true,\n transformItems: this.transformItems,\n };\n },\n },\n methods: {\n refine(value) {\n this.state.refine(value);\n this.searchForFacetValuesQuery = '';\n },\n },\n};\n</script>\n"],"names":["_ctx","_createElementBlock","class","$options","length","_renderSlot","items","refine","searchForItems","searchForItemsQuery","$data","toggleShowMore","canToggleShowMore","isShowingMore","createURL","isFromSearch","canRefine","sendEvent","$props","_createVNode","show-loading-indicator","placeholder","class-names","query","_createElementVNode","item","isRefined","key","value","type","checked","onChange","attribute","hit","label","count","onClick","disabled"],"mappings":"2XAGUA,aAFRC,eACGC,SAAQF,aAAQG,QAAMC,QAAgBJ,8BAGvCK,sBACGC,MAAOH,QACPI,OAAQJ,SACRK,eAAkBR,QAAMQ,eACxBC,oBAAwBC,4BACxBC,eAAkBR,iBAClBS,kBAAsBZ,QAAMY,kBAC5BC,cAAiBb,QAAMa,cACvBC,UAAWd,QAAMc,UACjBC,aAAgBf,QAAMe,aACtBC,UAAYhB,QAAMgB,UAClBC,UAAYjB,QAAMiB,mCAEmBC,kBAAtCjB,eAAMC,QAAOF,uBACXmB,gBACWhB,4EAAAA,2BACRiB,0BAAwB,EACxBC,YAAaH,wBACbI,cAAatB,+EAMVA,QAAMe,kBAAgBZ,QAAMC,OAHpCC,8BAEGkB,MAAOpB,0CAGRqB,SAAMtB,QAAOF,sBAAmB,6BAExBG,QAAMC,cAAhBH,cAA6BC,QAAOF,yBAClCC,WAEiBE,iBAARsB,cAFTxB,QACGC,SAAQF,eAAcyB,EAAKC,WAAa1B,4BAExC2B,IAAKF,EAAKG,QAEXvB,mBAEGoB,KAAMA,EACNlB,OAAQJ,SACRW,UAAWd,QAAMc,6BAElBU,WAAQtB,QAAOF,mBACbwB,WACGtB,QAAOF,oBACR6B,KAAK,WACJD,MAAOH,EAAKG,MACZE,QAASL,EAAKC,UACdK,4BAAQ5B,SAAOsB,EAAKG,oBAEXV,kBAAZjB,gBAAyBC,QAAOF,uBAC9BmB,KAAea,UAAU,OAAQC,IAAKR,6BAExCxB,gBAAcC,QAAOF,wBAAsByB,EAAKS,WAChDV,UAAOtB,QAAOF,oBAAkByB,EAAKU,2CAarCjB,gBARRjB,kBACGC,mGAMAkC,6FAAOjC,gDAEPkC,UAAWrC,QAAMY,oBAElBP,4BAA4BQ,cAAiBb,QAAMa,8CACzCb,QAAMa"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import e from"./SearchInput.vue_vue&type=script&lang.js";import{render as t}from"./SearchInput.vue_vue&type=template&id=
|
|
1
|
+
import e from"./SearchInput.vue_vue&type=script&lang.js";import{render as t}from"./SearchInput.vue_vue&type=template&id=79e30e4e&lang.js";e.render=t;export default e;
|
|
2
2
|
//# sourceMappingURL=SearchInput.vue.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SearchInput.vue_vue&type=script&lang.js","sources":["../../../../src/components/SearchInput.vue"],"sourcesContent":["<template>\n <form\n action=\"\"\n role=\"search\"\n novalidate\n :class=\"suit('form')\"\n @submit.prevent=\"onFormSubmit\"\n @reset.prevent=\"onFormReset\"\n >\n <!-- :value/@input allows us to pass v-model to the component in v2 -->\n <!-- :modelValue/@update:modelValue allows us to pass v-model to the component in v3 -->\n <input\n type=\"search\"\n autocorrect=\"off\"\n autocapitalize=\"off\"\n autocomplete=\"off\"\n spellcheck=\"false\"\n maxlength=\"512\"\n aria-label=\"Search\"\n :placeholder=\"placeholder\"\n :autofocus=\"autofocus\"\n :class=\"suit('input')\"\n :value=\"value || modelValue\"\n @focus=\"$emit('focus', $event)\"\n @blur=\"$emit('blur', $event)\"\n @input=\"onInput($event)\"\n @compositionend=\"onInput($event)\"\n ref=\"input\"\n />\n <button\n type=\"submit\"\n :title=\"submitTitle\"\n :class=\"suit('submit')\"\n :hidden=\"showLoadingIndicator && shouldShowLoadingIndicator\"\n >\n <slot name=\"submit-icon\">\n <svg\n aria-hidden=\"true\"\n width=\"10\"\n height=\"10\"\n viewBox=\"0 0 40 40\"\n :class=\"suit('submitIcon')\"\n >\n <path\n d=\"M26.804 29.01c-2.832 2.34-6.465 3.746-10.426 3.746C7.333 32.756 0 25.424 0 16.378 0 7.333 7.333 0 16.378 0c9.046 0 16.378 7.333 16.378 16.378 0 3.96-1.406 7.594-3.746 10.426l10.534 10.534c.607.607.61 1.59-.004 2.202-.61.61-1.597.61-2.202.004L26.804 29.01zm-10.426.627c7.323 0 13.26-5.936 13.26-13.26 0-7.32-5.937-13.257-13.26-13.257C9.056 3.12 3.12 9.056 3.12 16.378c0 7.323 5.936 13.26 13.258 13.26z\"\n />\n </svg>\n </slot>\n </button>\n
|
|
1
|
+
{"version":3,"file":"SearchInput.vue_vue&type=script&lang.js","sources":["../../../../src/components/SearchInput.vue"],"sourcesContent":["<template>\n <form\n action=\"\"\n role=\"search\"\n novalidate\n :class=\"suit('form')\"\n @submit.prevent=\"onFormSubmit\"\n @reset.prevent=\"onFormReset\"\n >\n <!-- :value/@input allows us to pass v-model to the component in v2 -->\n <!-- :modelValue/@update:modelValue allows us to pass v-model to the component in v3 -->\n <input\n type=\"search\"\n autocorrect=\"off\"\n autocapitalize=\"off\"\n autocomplete=\"off\"\n spellcheck=\"false\"\n maxlength=\"512\"\n aria-label=\"Search\"\n :placeholder=\"placeholder\"\n :autofocus=\"autofocus\"\n :class=\"suit('input')\"\n :value=\"value || modelValue\"\n @focus=\"$emit('focus', $event)\"\n @blur=\"$emit('blur', $event)\"\n @input=\"onInput($event)\"\n @compositionend=\"onInput($event)\"\n ref=\"input\"\n />\n <button\n type=\"submit\"\n :title=\"submitTitle\"\n :class=\"suit('submit')\"\n :hidden=\"showLoadingIndicator && shouldShowLoadingIndicator\"\n >\n <slot name=\"submit-icon\">\n <svg\n aria-hidden=\"true\"\n width=\"10\"\n height=\"10\"\n viewBox=\"0 0 40 40\"\n :class=\"suit('submitIcon')\"\n >\n <path\n d=\"M26.804 29.01c-2.832 2.34-6.465 3.746-10.426 3.746C7.333 32.756 0 25.424 0 16.378 0 7.333 7.333 0 16.378 0c9.046 0 16.378 7.333 16.378 16.378 0 3.96-1.406 7.594-3.746 10.426l10.534 10.534c.607.607.61 1.59-.004 2.202-.61.61-1.597.61-2.202.004L26.804 29.01zm-10.426.627c7.323 0 13.26-5.936 13.26-13.26 0-7.32-5.937-13.257-13.26-13.257C9.056 3.12 3.12 9.056 3.12 16.378c0 7.323 5.936 13.26 13.258 13.26z\"\n />\n </svg>\n </slot>\n </button>\n <button\n type=\"reset\"\n :title=\"resetTitle\"\n :class=\"suit('reset')\"\n :hidden=\"\n (!value && !modelValue) ||\n (showLoadingIndicator && shouldShowLoadingIndicator)\n \"\n >\n <slot name=\"reset-icon\">\n <svg\n aria-hidden=\"true\"\n height=\"10\"\n viewBox=\"0 0 20 20\"\n :class=\"suit('resetIcon')\"\n width=\"10\"\n >\n <path\n d=\"M8.114 10L.944 2.83 0 1.885 1.886 0l.943.943L10 8.113l7.17-7.17.944-.943L20 1.886l-.943.943-7.17 7.17 7.17 7.17.943.944L18.114 20l-.943-.943-7.17-7.17-7.17 7.17-.944.943L0 18.114l.943-.943L8.113 10z\"\n />\n </svg>\n </slot>\n </button>\n\n <span\n v-if=\"showLoadingIndicator\"\n :hidden=\"!shouldShowLoadingIndicator\"\n :class=\"suit('loadingIndicator')\"\n >\n <slot name=\"loading-indicator\">\n <svg\n :aria-hidden=\"!shouldShowLoadingIndicator\"\n aria-label=\"Results are loading\"\n width=\"16\"\n height=\"16\"\n stroke=\"#444\"\n viewBox=\"0 0 38 38\"\n :class=\"suit('loadingIcon')\"\n >\n <g fill=\"none\" fill-rule=\"evenodd\">\n <g transform=\"translate(1 1)\" stroke-width=\"2\">\n <circle stroke-opacity=\".5\" cx=\"18\" cy=\"18\" r=\"18\" />\n <path d=\"M36 18c0-9.94-8.06-18-18-18\">\n <animateTransform\n attributeName=\"transform\"\n type=\"rotate\"\n from=\"0 18 18\"\n to=\"360 18 18\"\n dur=\"1s\"\n repeatCount=\"indefinite\"\n />\n </path>\n </g>\n </g>\n </svg>\n </slot>\n </span>\n </form>\n</template>\n\n<script>\nimport { createSuitMixin } from '../mixins/suit';\n\nexport default {\n name: 'SearchInput',\n mixins: [createSuitMixin({ name: 'SearchBox' })],\n props: {\n placeholder: {\n type: String,\n default: 'Search here…',\n },\n autofocus: {\n type: Boolean,\n default: false,\n },\n showLoadingIndicator: {\n type: Boolean,\n default: false,\n },\n shouldShowLoadingIndicator: {\n type: Boolean,\n default: false,\n },\n ignoreCompositionEvents: {\n type: Boolean,\n default: false,\n },\n submitTitle: {\n type: String,\n default: 'Search',\n },\n resetTitle: {\n type: String,\n default: 'Clear',\n },\n value: {\n type: String,\n required: false,\n default: undefined,\n },\n modelValue: {\n type: String,\n required: false,\n default: undefined,\n },\n },\n emits: ['input', 'update:modelValue', 'blur', 'focus', 'reset'],\n data() {\n return {\n query: '',\n };\n },\n methods: {\n isFocused() {\n return document.activeElement === this.$refs.input;\n },\n onInput(event) {\n if (!(this.ignoreCompositionEvents && event.isComposing)) {\n this.$emit('input', event.target.value);\n this.$emit('update:modelValue', event.target.value);\n }\n },\n onFormSubmit() {\n const input = this.$refs.input;\n input.blur();\n },\n onFormReset() {\n this.$emit('input', '');\n this.$emit('update:modelValue', '');\n this.$emit('reset');\n },\n },\n};\n</script>\n"],"names":["name","mixins","createSuitMixin","props","placeholder","type","String","default","autofocus","Boolean","showLoadingIndicator","shouldShowLoadingIndicator","ignoreCompositionEvents","submitTitle","resetTitle","value","required","undefined","modelValue","emits","data","query","methods","isFocused","document","activeElement","this","$refs","input","onInput","event","isComposing","$emit","target","onFormSubmit","blur","onFormReset"],"mappings":"kEAgHe,CACbA,KAAM,cACNC,OAAQ,CAACC,EAAgB,CAAEF,KAAM,eACjCG,MAAO,CACLC,YAAa,CACXC,KAAMC,OACNC,QAAS,gBAEXC,UAAW,CACTH,KAAMI,QACNF,SAAS,GAEXG,qBAAsB,CACpBL,KAAMI,QACNF,SAAS,GAEXI,2BAA4B,CAC1BN,KAAMI,QACNF,SAAS,GAEXK,wBAAyB,CACvBP,KAAMI,QACNF,SAAS,GAEXM,YAAa,CACXR,KAAMC,OACNC,QAAS,UAEXO,WAAY,CACVT,KAAMC,OACNC,QAAS,SAEXQ,MAAO,CACLV,KAAMC,OACNU,UAAU,EACVT,aAASU,GAEXC,WAAY,CACVb,KAAMC,OACNU,UAAU,EACVT,aAASU,IAGbE,MAAO,CAAC,QAAS,oBAAqB,OAAQ,QAAS,SACvDC,gBACE,MAAO,CACLC,MAAO,KAGXC,QAAS,CACPC,qBACE,OAAOC,SAASC,gBAAkBC,KAAKC,MAAMC,OAE/CC,iBAAQC,GACAJ,KAAKd,yBAA2BkB,EAAMC,cAC1CL,KAAKM,MAAM,QAASF,EAAMG,OAAOlB,OACjCW,KAAKM,MAAM,oBAAqBF,EAAMG,OAAOlB,SAGjDmB,wBACgBR,KAAKC,MAAMC,MACnBO,QAERC,uBACEV,KAAKM,MAAM,QAAS,IACpBN,KAAKM,MAAM,oBAAqB,IAChCN,KAAKM,MAAM"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import{openBlock as t,createElementBlock as o,normalizeClass as e,withModifiers as n,createElementVNode as i,renderSlot as a,createCommentVNode as r,createStaticVNode as l}from"vue";var u=["placeholder","autofocus","value"],s=["title","hidden"],c=[i("path",{d:"M26.804 29.01c-2.832 2.34-6.465 3.746-10.426 3.746C7.333 32.756 0 25.424 0 16.378 0 7.333 7.333 0 16.378 0c9.046 0 16.378 7.333 16.378 16.378 0 3.96-1.406 7.594-3.746 10.426l10.534 10.534c.607.607.61 1.59-.004 2.202-.61.61-1.597.61-2.202.004L26.804 29.01zm-10.426.627c7.323 0 13.26-5.936 13.26-13.26 0-7.32-5.937-13.257-13.26-13.257C9.056 3.12 3.12 9.056 3.12 16.378c0 7.323 5.936 13.26 13.258 13.26z"},null,-1)],d=["title","hidden"],h=[i("path",{d:"M8.114 10L.944 2.83 0 1.885 1.886 0l.943.943L10 8.113l7.17-7.17.944-.943L20 1.886l-.943.943-7.17 7.17 7.17 7.17.943.944L18.114 20l-.943-.943-7.17-7.17-7.17 7.17-.944.943L0 18.114l.943-.943L8.113 10z"},null,-1)],f=["hidden"],m=["aria-hidden"],p=[l('<g fill="none" fill-rule="evenodd"><g transform="translate(1 1)" stroke-width="2"><circle stroke-opacity=".5" cx="18" cy="18" r="18"></circle><path d="M36 18c0-9.94-8.06-18-18-18"><animateTransform attributeName="transform" type="rotate" from="0 18 18" to="360 18 18" dur="1s" repeatCount="indefinite"></animateTransform></path></g></g>',1)];function g(l,g,v,b,w,I){return t(),o("form",{action:"",role:"search",novalidate:"",class:e(l.suit("form")),onSubmit:g[4]||(g[4]=n(function(){for(var t=[],o=arguments.length;o--;)t[o]=arguments[o];return I.onFormSubmit&&I.onFormSubmit.apply(I,t)},["prevent"])),onReset:g[5]||(g[5]=n(function(){for(var t=[],o=arguments.length;o--;)t[o]=arguments[o];return I.onFormReset&&I.onFormReset.apply(I,t)},["prevent"]))},[i("input",{type:"search",autocorrect:"off",autocapitalize:"off",autocomplete:"off",spellcheck:"false",maxlength:"512","aria-label":"Search",placeholder:v.placeholder,autofocus:v.autofocus,class:e(l.suit("input")),value:v.value||v.modelValue,onFocus:g[0]||(g[0]=function(t){return l.$emit("focus",t)}),onBlur:g[1]||(g[1]=function(t){return l.$emit("blur",t)}),onInput:g[2]||(g[2]=function(t){return I.onInput(t)}),onCompositionend:g[3]||(g[3]=function(t){return I.onInput(t)}),ref:"input"},null,42,u),i("button",{type:"submit",title:v.submitTitle,class:e(l.suit("submit")),hidden:v.showLoadingIndicator&&v.shouldShowLoadingIndicator},[a(l.$slots,"submit-icon",{},function(){return[(t(),o("svg",{"aria-hidden":"true",width:"10",height:"10",viewBox:"0 0 40 40",class:e(l.suit("submitIcon"))},c,2))]})],10,s),i("button",{type:"reset",title:v.resetTitle,class:e(l.suit("reset")),hidden:!v.value&&!v.modelValue||v.showLoadingIndicator&&v.shouldShowLoadingIndicator},[a(l.$slots,"reset-icon",{},function(){return[(t(),o("svg",{"aria-hidden":"true",height:"10",viewBox:"0 0 20 20",class:e(l.suit("resetIcon")),width:"10"},h,2))]})],10,d),v.showLoadingIndicator?(t(),o("span",{key:0,hidden:!v.shouldShowLoadingIndicator,class:e(l.suit("loadingIndicator"))},[a(l.$slots,"loading-indicator",{},function(){return[(t(),o("svg",{"aria-hidden":!v.shouldShowLoadingIndicator,"aria-label":"Results are loading",width:"16",height:"16",stroke:"#444",viewBox:"0 0 38 38",class:e(l.suit("loadingIcon"))},p,10,m))]})],10,f)):r("",!0)],34)}export{g as render};
|
|
2
|
-
//# sourceMappingURL=SearchInput.vue_vue&type=template&id=
|
|
2
|
+
//# sourceMappingURL=SearchInput.vue_vue&type=template&id=79e30e4e&lang.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SearchInput.vue_vue&type=template&id=79e30e4e&lang.js","sources":["../../../../src/components/SearchInput.vue?vue&type=template&id=79e30e4e&lang.js"],"sourcesContent":["<template>\n <form\n action=\"\"\n role=\"search\"\n novalidate\n :class=\"suit('form')\"\n @submit.prevent=\"onFormSubmit\"\n @reset.prevent=\"onFormReset\"\n >\n <!-- :value/@input allows us to pass v-model to the component in v2 -->\n <!-- :modelValue/@update:modelValue allows us to pass v-model to the component in v3 -->\n <input\n type=\"search\"\n autocorrect=\"off\"\n autocapitalize=\"off\"\n autocomplete=\"off\"\n spellcheck=\"false\"\n maxlength=\"512\"\n aria-label=\"Search\"\n :placeholder=\"placeholder\"\n :autofocus=\"autofocus\"\n :class=\"suit('input')\"\n :value=\"value || modelValue\"\n @focus=\"$emit('focus', $event)\"\n @blur=\"$emit('blur', $event)\"\n @input=\"onInput($event)\"\n @compositionend=\"onInput($event)\"\n ref=\"input\"\n />\n <button\n type=\"submit\"\n :title=\"submitTitle\"\n :class=\"suit('submit')\"\n :hidden=\"showLoadingIndicator && shouldShowLoadingIndicator\"\n >\n <slot name=\"submit-icon\">\n <svg\n aria-hidden=\"true\"\n width=\"10\"\n height=\"10\"\n viewBox=\"0 0 40 40\"\n :class=\"suit('submitIcon')\"\n >\n <path\n d=\"M26.804 29.01c-2.832 2.34-6.465 3.746-10.426 3.746C7.333 32.756 0 25.424 0 16.378 0 7.333 7.333 0 16.378 0c9.046 0 16.378 7.333 16.378 16.378 0 3.96-1.406 7.594-3.746 10.426l10.534 10.534c.607.607.61 1.59-.004 2.202-.61.61-1.597.61-2.202.004L26.804 29.01zm-10.426.627c7.323 0 13.26-5.936 13.26-13.26 0-7.32-5.937-13.257-13.26-13.257C9.056 3.12 3.12 9.056 3.12 16.378c0 7.323 5.936 13.26 13.258 13.26z\"\n />\n </svg>\n </slot>\n </button>\n <button\n type=\"reset\"\n :title=\"resetTitle\"\n :class=\"suit('reset')\"\n :hidden=\"\n (!value && !modelValue) ||\n (showLoadingIndicator && shouldShowLoadingIndicator)\n \"\n >\n <slot name=\"reset-icon\">\n <svg\n aria-hidden=\"true\"\n height=\"10\"\n viewBox=\"0 0 20 20\"\n :class=\"suit('resetIcon')\"\n width=\"10\"\n >\n <path\n d=\"M8.114 10L.944 2.83 0 1.885 1.886 0l.943.943L10 8.113l7.17-7.17.944-.943L20 1.886l-.943.943-7.17 7.17 7.17 7.17.943.944L18.114 20l-.943-.943-7.17-7.17-7.17 7.17-.944.943L0 18.114l.943-.943L8.113 10z\"\n />\n </svg>\n </slot>\n </button>\n\n <span\n v-if=\"showLoadingIndicator\"\n :hidden=\"!shouldShowLoadingIndicator\"\n :class=\"suit('loadingIndicator')\"\n >\n <slot name=\"loading-indicator\">\n <svg\n :aria-hidden=\"!shouldShowLoadingIndicator\"\n aria-label=\"Results are loading\"\n width=\"16\"\n height=\"16\"\n stroke=\"#444\"\n viewBox=\"0 0 38 38\"\n :class=\"suit('loadingIcon')\"\n >\n <g fill=\"none\" fill-rule=\"evenodd\">\n <g transform=\"translate(1 1)\" stroke-width=\"2\">\n <circle stroke-opacity=\".5\" cx=\"18\" cy=\"18\" r=\"18\" />\n <path d=\"M36 18c0-9.94-8.06-18-18-18\">\n <animateTransform\n attributeName=\"transform\"\n type=\"rotate\"\n from=\"0 18 18\"\n to=\"360 18 18\"\n dur=\"1s\"\n repeatCount=\"indefinite\"\n />\n </path>\n </g>\n </g>\n </svg>\n </slot>\n </span>\n </form>\n</template>\n\n<script>\nimport { createSuitMixin } from '../mixins/suit';\n\nexport default {\n name: 'SearchInput',\n mixins: [createSuitMixin({ name: 'SearchBox' })],\n props: {\n placeholder: {\n type: String,\n default: 'Search here…',\n },\n autofocus: {\n type: Boolean,\n default: false,\n },\n showLoadingIndicator: {\n type: Boolean,\n default: false,\n },\n shouldShowLoadingIndicator: {\n type: Boolean,\n default: false,\n },\n ignoreCompositionEvents: {\n type: Boolean,\n default: false,\n },\n submitTitle: {\n type: String,\n default: 'Search',\n },\n resetTitle: {\n type: String,\n default: 'Clear',\n },\n value: {\n type: String,\n required: false,\n default: undefined,\n },\n modelValue: {\n type: String,\n required: false,\n default: undefined,\n },\n },\n emits: ['input', 'update:modelValue', 'blur', 'focus', 'reset'],\n data() {\n return {\n query: '',\n };\n },\n methods: {\n isFocused() {\n return document.activeElement === this.$refs.input;\n },\n onInput(event) {\n if (!(this.ignoreCompositionEvents && event.isComposing)) {\n this.$emit('input', event.target.value);\n this.$emit('update:modelValue', event.target.value);\n }\n },\n onFormSubmit() {\n const input = this.$refs.input;\n input.blur();\n },\n onFormReset() {\n this.$emit('input', '');\n this.$emit('update:modelValue', '');\n this.$emit('reset');\n },\n },\n};\n</script>\n"],"names":["_createElementVNode","d","_createElementBlock","action","role","novalidate","class","_ctx","onSubmit","$options","onReset","type","autocorrect","autocapitalize","autocomplete","spellcheck","maxlength","aria-label","placeholder","$props","autofocus","value","onFocus","$event","onBlur","onInput","onCompositionend","ref","title","hidden","_renderSlot","aria-hidden","width","height","viewBox","stroke"],"mappings":"wPA2CUA,UACEC,EAAE,sbAsBJD,UACEC,EAAE,knBAlEZC,UACEC,OAAO,GACPC,KAAK,SACLC,WAAA,GACCC,QAAOC,gBACPC,gGAAgBC,yDAChBC,+FAAeD,yDAIhBT,WACEW,KAAK,SACLC,YAAY,MACZC,eAAe,MACfC,aAAa,MACbC,WAAW,QACXC,UAAU,MACVC,aAAW,SACVC,YAAaC,cACbC,UAAWD,YACXb,QAAOC,iBACPc,MAAOF,SAASA,aAChBG,uCAAOf,gBAAegB,KACtBC,sCAAMjB,eAAcgB,KACpBE,uCAAOhB,UAAQc,KACfG,gDAAgBjB,UAAQc,KACzBI,IAAI,oBAEN3B,YACEW,KAAK,SACJiB,MAAOT,cACPb,QAAOC,kBACPsB,OAAQV,wBAAwBA,+BAEjCW,mDACE5B,SACE6B,cAAY,OACZC,MAAM,KACNC,OAAO,KACPC,QAAQ,YACP5B,QAAOC,uCAQdP,YACEW,KAAK,QACJiB,MAAOT,aACPb,QAAOC,iBACPsB,uFAKDC,kDACE5B,SACE6B,cAAY,OACZE,OAAO,KACPC,QAAQ,YACP5B,QAAOC,qBACRyB,MAAM,sBAUJb,4BADRjB,gBAEG2B,QAASV,6BACTb,QAAOC,8BAERuB,yDACE5B,SACG6B,eAAcZ,6BACfF,aAAW,sBACXe,MAAM,KACNC,OAAO,KACPE,OAAO,OACPD,QAAQ,YACP5B,QAAOC"}
|