angular-instantsearch
Version:
Lightning-fast search for Angular apps, by Algolia.
128 lines (126 loc) • 13.2 kB
JavaScript
import { Component, Input, Inject, forwardRef, Optional } from '@angular/core';
import { connectRefinementList } from 'instantsearch.js/es/connectors';
import { TypedBaseWidget } from '../typed-base-widget';
import { NgAisInstantSearch } from '../instantsearch/instantsearch';
import { NgAisIndex } from '../index-widget/index-widget';
import { noop, parseNumberInput } from '../utils';
export class NgAisRefinementList extends TypedBaseWidget {
constructor(parentIndex, instantSearchInstance) {
super('RefinementList');
this.parentIndex = parentIndex;
this.instantSearchInstance = instantSearchInstance;
// rendering options
this.showMoreLabel = 'Show more';
this.showLessLabel = 'Show less';
this.searchPlaceholder = 'Search here...';
this.state = {
canRefine: false,
canToggleShowMore: false,
createURL: () => '',
isShowingMore: false,
items: [],
refine: noop,
toggleShowMore: noop,
searchForItems: noop,
isFromSearch: false,
hasExhaustiveItems: false,
sendEvent: noop,
};
}
get isHidden() {
return this.state.items.length === 0 && this.autoHideContainer;
}
ngOnInit() {
this.createWidget(connectRefinementList, {
showMore: this.showMore,
limit: parseNumberInput(this.limit),
showMoreLimit: parseNumberInput(this.showMoreLimit),
attribute: this.attribute,
operator: this.operator,
sortBy: this.sortBy,
escapeFacetValues: true,
transformItems: this.transformItems,
}, {
$$widgetType: 'ais.refinementList',
});
super.ngOnInit();
}
refine(event, item) {
event.preventDefault();
event.stopPropagation();
if (this.state.canRefine) {
// update UI directly, it will update the checkbox state
item.isRefined = !item.isRefined;
// refine through Algolia API
this.state.refine(item.value);
}
}
}
NgAisRefinementList.decorators = [
{ type: Component, args: [{
selector: 'ais-refinement-list',
template: `
<div
[class]="cx()"
*ngIf="!isHidden"
>
<div
*ngIf="searchable"
[class]="cx('searchBox')"
>
<ais-facets-search
[search]="state.searchForItems"
[searchPlaceholder]="searchPlaceholder"
>
</ais-facets-search>
</div>
<ul [class]="cx('list')">
<li
[class]="getItemClass(item)"
*ngFor="let item of state.items"
(click)="refine($event, item)"
>
<label [class]="cx('label')">
<input
[class]="cx('checkbox')"
type="checkbox"
value="{{item.value}}"
[checked]="item.isRefined"
/>
<span [class]="cx('labelText')">
<ais-highlight attribute="highlighted" [hit]="item"></ais-highlight>
</span>
<span [class]="cx('count')">{{item.count}}</span>
</label>
</li>
</ul>
<button
[class]="cx('showMore')"
*ngIf="showMore"
(click)="state.toggleShowMore()"
[disabled]="!state.canToggleShowMore"
>
{{state.isShowingMore ? showLessLabel : showMoreLabel}}
</button>
</div>
`
},] }
];
NgAisRefinementList.ctorParameters = () => [
{ type: NgAisIndex, decorators: [{ type: Inject, args: [forwardRef(() => NgAisIndex),] }, { type: Optional }] },
{ type: NgAisInstantSearch, decorators: [{ type: Inject, args: [forwardRef(() => NgAisInstantSearch),] }] }
];
NgAisRefinementList.propDecorators = {
showMoreLabel: [{ type: Input }],
showLessLabel: [{ type: Input }],
searchable: [{ type: Input }],
searchPlaceholder: [{ type: Input }],
attribute: [{ type: Input }],
operator: [{ type: Input }],
limit: [{ type: Input }],
showMore: [{ type: Input }],
showMoreLimit: [{ type: Input }],
sortBy: [{ type: Input }],
transformItems: [{ type: Input }]
};
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicmVmaW5lbWVudC1saXN0LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL3JlZmluZW1lbnQtbGlzdC9yZWZpbmVtZW50LWxpc3QudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxLQUFLLEVBQUUsTUFBTSxFQUFFLFVBQVUsRUFBRSxRQUFRLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDL0UsT0FBTyxFQUFFLHFCQUFxQixFQUFFLE1BQU0sZ0NBQWdDLENBQUM7QUFDdkUsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLHNCQUFzQixDQUFDO0FBQ3ZELE9BQU8sRUFBRSxrQkFBa0IsRUFBRSxNQUFNLGdDQUFnQyxDQUFDO0FBQ3BFLE9BQU8sRUFBRSxVQUFVLEVBQUUsTUFBTSw4QkFBOEIsQ0FBQztBQUMxRCxPQUFPLEVBQUUsSUFBSSxFQUFFLGdCQUFnQixFQUFFLE1BQU0sVUFBVSxDQUFDO0FBMERsRCxNQUFNLE9BQU8sbUJBQW9CLFNBQVEsZUFHeEM7SUFtQ0MsWUFHUyxXQUF1QixFQUV2QixxQkFBeUM7UUFFaEQsS0FBSyxDQUFDLGdCQUFnQixDQUFDLENBQUM7UUFKakIsZ0JBQVcsR0FBWCxXQUFXLENBQVk7UUFFdkIsMEJBQXFCLEdBQXJCLHFCQUFxQixDQUFvQjtRQXZDbEQsb0JBQW9CO1FBQ0osa0JBQWEsR0FBVyxXQUFXLENBQUM7UUFDcEMsa0JBQWEsR0FBVyxXQUFXLENBQUM7UUFFcEMsc0JBQWlCLEdBQVcsZ0JBQWdCLENBQUM7UUFZdEQsVUFBSyxHQUE4QjtZQUN4QyxTQUFTLEVBQUUsS0FBSztZQUNoQixpQkFBaUIsRUFBRSxLQUFLO1lBQ3hCLFNBQVMsRUFBRSxHQUFHLEVBQUUsQ0FBQyxFQUFFO1lBQ25CLGFBQWEsRUFBRSxLQUFLO1lBQ3BCLEtBQUssRUFBRSxFQUFFO1lBQ1QsTUFBTSxFQUFFLElBQUk7WUFDWixjQUFjLEVBQUUsSUFBSTtZQUNwQixjQUFjLEVBQUUsSUFBSTtZQUNwQixZQUFZLEVBQUUsS0FBSztZQUNuQixrQkFBa0IsRUFBRSxLQUFLO1lBQ3pCLFNBQVMsRUFBRSxJQUFJO1NBQ2hCLENBQUM7SUFjRixDQUFDO0lBWkQsSUFBSSxRQUFRO1FBQ1YsT0FBTyxJQUFJLENBQUMsS0FBSyxDQUFDLEtBQUssQ0FBQyxNQUFNLEtBQUssQ0FBQyxJQUFJLElBQUksQ0FBQyxpQkFBaUIsQ0FBQztJQUNqRSxDQUFDO0lBWU0sUUFBUTtRQUNiLElBQUksQ0FBQyxZQUFZLENBQ2YscUJBQXFCLEVBQ3JCO1lBQ0UsUUFBUSxFQUFFLElBQUksQ0FBQyxRQUFRO1lBQ3ZCLEtBQUssRUFBRSxnQkFBZ0IsQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDO1lBQ25DLGFBQWEsRUFBRSxnQkFBZ0IsQ0FBQyxJQUFJLENBQUMsYUFBYSxDQUFDO1lBQ25ELFNBQVMsRUFBRSxJQUFJLENBQUMsU0FBUztZQUN6QixRQUFRLEVBQUUsSUFBSSxDQUFDLFFBQVE7WUFDdkIsTUFBTSxFQUFFLElBQUksQ0FBQyxNQUFNO1lBQ25CLGlCQUFpQixFQUFFLElBQUk7WUFDdkIsY0FBYyxFQUFFLElBQUksQ0FBQyxjQUFjO1NBQ3BDLEVBQ0Q7WUFDRSxZQUFZLEVBQUUsb0JBQW9CO1NBQ25DLENBQ0YsQ0FBQztRQUVGLEtBQUssQ0FBQyxRQUFRLEVBQUUsQ0FBQztJQUNuQixDQUFDO0lBRU0sTUFBTSxDQUFDLEtBQWlCLEVBQUUsSUFBd0I7UUFDdkQsS0FBSyxDQUFDLGNBQWMsRUFBRSxDQUFDO1FBQ3ZCLEtBQUssQ0FBQyxlQUFlLEVBQUUsQ0FBQztRQUV4QixJQUFJLElBQUksQ0FBQyxLQUFLLENBQUMsU0FBUyxFQUFFO1lBQ3hCLHdEQUF3RDtZQUN4RCxJQUFJLENBQUMsU0FBUyxHQUFHLENBQUMsSUFBSSxDQUFDLFNBQVMsQ0FBQztZQUVqQyw2QkFBNkI7WUFDN0IsSUFBSSxDQUFDLEtBQUssQ0FBQyxNQUFNLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxDQUFDO1NBQy9CO0lBQ0gsQ0FBQzs7O1lBbElGLFNBQVMsU0FBQztnQkFDVCxRQUFRLEVBQUUscUJBQXFCO2dCQUMvQixRQUFRLEVBQUU7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7R0E4Q1Q7YUFDRjs7O1lBMURRLFVBQVUsdUJBa0dkLE1BQU0sU0FBQyxVQUFVLENBQUMsR0FBRyxFQUFFLENBQUMsVUFBVSxDQUFDLGNBQ25DLFFBQVE7WUFwR0osa0JBQWtCLHVCQXNHdEIsTUFBTSxTQUFDLFVBQVUsQ0FBQyxHQUFHLEVBQUUsQ0FBQyxrQkFBa0IsQ0FBQzs7OzRCQXJDN0MsS0FBSzs0QkFDTCxLQUFLO3lCQUNMLEtBQUs7Z0NBQ0wsS0FBSzt3QkFHTCxLQUFLO3VCQUNMLEtBQUs7b0JBQ0wsS0FBSzt1QkFDTCxLQUFLOzRCQUNMLEtBQUs7cUJBQ0wsS0FBSzs2QkFDTCxLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBJbnB1dCwgSW5qZWN0LCBmb3J3YXJkUmVmLCBPcHRpb25hbCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgY29ubmVjdFJlZmluZW1lbnRMaXN0IH0gZnJvbSAnaW5zdGFudHNlYXJjaC5qcy9lcy9jb25uZWN0b3JzJztcbmltcG9ydCB7IFR5cGVkQmFzZVdpZGdldCB9IGZyb20gJy4uL3R5cGVkLWJhc2Utd2lkZ2V0JztcbmltcG9ydCB7IE5nQWlzSW5zdGFudFNlYXJjaCB9IGZyb20gJy4uL2luc3RhbnRzZWFyY2gvaW5zdGFudHNlYXJjaCc7XG5pbXBvcnQgeyBOZ0Fpc0luZGV4IH0gZnJvbSAnLi4vaW5kZXgtd2lkZ2V0L2luZGV4LXdpZGdldCc7XG5pbXBvcnQgeyBub29wLCBwYXJzZU51bWJlcklucHV0IH0gZnJvbSAnLi4vdXRpbHMnO1xuaW1wb3J0IHtcbiAgUmVmaW5lbWVudExpc3RDb25uZWN0b3JQYXJhbXMsXG4gIFJlZmluZW1lbnRMaXN0V2lkZ2V0RGVzY3JpcHRpb24sXG4gIFJlZmluZW1lbnRMaXN0UmVuZGVyU3RhdGUsXG4gIFJlZmluZW1lbnRMaXN0SXRlbSxcbn0gZnJvbSAnaW5zdGFudHNlYXJjaC5qcy9lcy9jb25uZWN0b3JzL3JlZmluZW1lbnQtbGlzdC9jb25uZWN0UmVmaW5lbWVudExpc3QnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdhaXMtcmVmaW5lbWVudC1saXN0JyxcbiAgdGVtcGxhdGU6IGBcbiAgICA8ZGl2XG4gICAgICBbY2xhc3NdPVwiY3goKVwiXG4gICAgICAqbmdJZj1cIiFpc0hpZGRlblwiXG4gICAgPlxuICAgICAgPGRpdlxuICAgICAgICAqbmdJZj1cInNlYXJjaGFibGVcIlxuICAgICAgICBbY2xhc3NdPVwiY3goJ3NlYXJjaEJveCcpXCJcbiAgICAgID5cbiAgICAgICAgPGFpcy1mYWNldHMtc2VhcmNoXG4gICAgICAgICAgW3NlYXJjaF09XCJzdGF0ZS5zZWFyY2hGb3JJdGVtc1wiXG4gICAgICAgICAgW3NlYXJjaFBsYWNlaG9sZGVyXT1cInNlYXJjaFBsYWNlaG9sZGVyXCJcbiAgICAgICAgPlxuICAgICAgICA8L2Fpcy1mYWNldHMtc2VhcmNoPlxuICAgICAgPC9kaXY+XG5cbiAgICAgIDx1bCBbY2xhc3NdPVwiY3goJ2xpc3QnKVwiPlxuICAgICAgICA8bGlcbiAgICAgICAgICBbY2xhc3NdPVwiZ2V0SXRlbUNsYXNzKGl0ZW0pXCJcbiAgICAgICAgICAqbmdGb3I9XCJsZXQgaXRlbSBvZiBzdGF0ZS5pdGVtc1wiXG4gICAgICAgICAgKGNsaWNrKT1cInJlZmluZSgkZXZlbnQsIGl0ZW0pXCJcbiAgICAgICAgPlxuICAgICAgICAgIDxsYWJlbCBbY2xhc3NdPVwiY3goJ2xhYmVsJylcIj5cbiAgICAgICAgICAgIDxpbnB1dFxuICAgICAgICAgICAgICBbY2xhc3NdPVwiY3goJ2NoZWNrYm94JylcIlxuICAgICAgICAgICAgICB0eXBlPVwiY2hlY2tib3hcIlxuICAgICAgICAgICAgICB2YWx1ZT1cInt7aXRlbS52YWx1ZX19XCJcbiAgICAgICAgICAgICAgW2NoZWNrZWRdPVwiaXRlbS5pc1JlZmluZWRcIlxuICAgICAgICAgICAgLz5cbiAgICAgICAgICAgIDxzcGFuIFtjbGFzc109XCJjeCgnbGFiZWxUZXh0JylcIj5cbiAgICAgICAgICAgICAgPGFpcy1oaWdobGlnaHQgYXR0cmlidXRlPVwiaGlnaGxpZ2h0ZWRcIiBbaGl0XT1cIml0ZW1cIj48L2Fpcy1oaWdobGlnaHQ+XG4gICAgICAgICAgICA8L3NwYW4+XG4gICAgICAgICAgICA8c3BhbiBbY2xhc3NdPVwiY3goJ2NvdW50JylcIj57e2l0ZW0uY291bnR9fTwvc3Bhbj5cbiAgICAgICAgICA8L2xhYmVsPlxuICAgICAgICA8L2xpPlxuICAgICAgPC91bD5cblxuICAgICAgPGJ1dHRvblxuICAgICAgICBbY2xhc3NdPVwiY3goJ3Nob3dNb3JlJylcIlxuICAgICAgICAqbmdJZj1cInNob3dNb3JlXCJcbiAgICAgICAgKGNsaWNrKT1cInN0YXRlLnRvZ2dsZVNob3dNb3JlKClcIlxuICAgICAgICBbZGlzYWJsZWRdPVwiIXN0YXRlLmNhblRvZ2dsZVNob3dNb3JlXCJcbiAgICAgID5cbiAgICAgICAge3tzdGF0ZS5pc1Nob3dpbmdNb3JlID8gc2hvd0xlc3NMYWJlbCA6IHNob3dNb3JlTGFiZWx9fVxuICAgICAgPC9idXR0b24+XG4gICAgPC9kaXY+XG4gIGAsXG59KVxuZXhwb3J0IGNsYXNzIE5nQWlzUmVmaW5lbWVudExpc3QgZXh0ZW5kcyBUeXBlZEJhc2VXaWRnZXQ8XG4gIFJlZmluZW1lbnRMaXN0V2lkZ2V0RGVzY3JpcHRpb24sXG4gIFJlZmluZW1lbnRMaXN0Q29ubmVjdG9yUGFyYW1zXG4+IHtcbiAgLy8gcmVuZGVyaW5nIG9wdGlvbnNcbiAgQElucHV0KCkgcHVibGljIHNob3dNb3JlTGFiZWw6IHN0cmluZyA9ICdTaG93IG1vcmUnO1xuICBASW5wdXQoKSBwdWJsaWMgc2hvd0xlc3NMYWJlbDogc3RyaW5nID0gJ1Nob3cgbGVzcyc7XG4gIEBJbnB1dCgpIHB1YmxpYyBzZWFyY2hhYmxlPzogYm9vbGVhbjtcbiAgQElucHV0KCkgcHVibGljIHNlYXJjaFBsYWNlaG9sZGVyOiBzdHJpbmcgPSAnU2VhcmNoIGhlcmUuLi4nO1xuXG4gIC8vIGluc3RhbmNlIG9wdGlvbnNcbiAgQElucHV0KCkgcHVibGljIGF0dHJpYnV0ZTogUmVmaW5lbWVudExpc3RDb25uZWN0b3JQYXJhbXNbJ2F0dHJpYnV0ZSddO1xuICBASW5wdXQoKSBwdWJsaWMgb3BlcmF0b3I6IFJlZmluZW1lbnRMaXN0Q29ubmVjdG9yUGFyYW1zWydvcGVyYXRvciddO1xuICBASW5wdXQoKSBwdWJsaWMgbGltaXQ6IFJlZmluZW1lbnRMaXN0Q29ubmVjdG9yUGFyYW1zWydsaW1pdCddO1xuICBASW5wdXQoKSBwdWJsaWMgc2hvd01vcmU6IFJlZmluZW1lbnRMaXN0Q29ubmVjdG9yUGFyYW1zWydzaG93TW9yZSddO1xuICBASW5wdXQoKSBwdWJsaWMgc2hvd01vcmVMaW1pdDogUmVmaW5lbWVudExpc3RDb25uZWN0b3JQYXJhbXNbJ3Nob3dNb3JlTGltaXQnXTtcbiAgQElucHV0KCkgcHVibGljIHNvcnRCeTogUmVmaW5lbWVudExpc3RDb25uZWN0b3JQYXJhbXNbJ3NvcnRCeSddO1xuICBASW5wdXQoKVxuICBwdWJsaWMgdHJhbnNmb3JtSXRlbXM/OiBSZWZpbmVtZW50TGlzdENvbm5lY3RvclBhcmFtc1sndHJhbnNmb3JtSXRlbXMnXTtcblxuICBwdWJsaWMgc3RhdGU6IFJlZmluZW1lbnRMaXN0UmVuZGVyU3RhdGUgPSB7XG4gICAgY2FuUmVmaW5lOiBmYWxzZSxcbiAgICBjYW5Ub2dnbGVTaG93TW9yZTogZmFsc2UsXG4gICAgY3JlYXRlVVJMOiAoKSA9PiAnJyxcbiAgICBpc1Nob3dpbmdNb3JlOiBmYWxzZSxcbiAgICBpdGVtczogW10sXG4gICAgcmVmaW5lOiBub29wLFxuICAgIHRvZ2dsZVNob3dNb3JlOiBub29wLFxuICAgIHNlYXJjaEZvckl0ZW1zOiBub29wLFxuICAgIGlzRnJvbVNlYXJjaDogZmFsc2UsXG4gICAgaGFzRXhoYXVzdGl2ZUl0ZW1zOiBmYWxzZSxcbiAgICBzZW5kRXZlbnQ6IG5vb3AsXG4gIH07XG5cbiAgZ2V0IGlzSGlkZGVuKCkge1xuICAgIHJldHVybiB0aGlzLnN0YXRlLml0ZW1zLmxlbmd0aCA9PT0gMCAmJiB0aGlzLmF1dG9IaWRlQ29udGFpbmVyO1xuICB9XG5cbiAgY29uc3RydWN0b3IoXG4gICAgQEluamVjdChmb3J3YXJkUmVmKCgpID0+IE5nQWlzSW5kZXgpKVxuICAgIEBPcHRpb25hbCgpXG4gICAgcHVibGljIHBhcmVudEluZGV4OiBOZ0Fpc0luZGV4LFxuICAgIEBJbmplY3QoZm9yd2FyZFJlZigoKSA9PiBOZ0Fpc0luc3RhbnRTZWFyY2gpKVxuICAgIHB1YmxpYyBpbnN0YW50U2VhcmNoSW5zdGFuY2U6IE5nQWlzSW5zdGFudFNlYXJjaFxuICApIHtcbiAgICBzdXBlcignUmVmaW5lbWVudExpc3QnKTtcbiAgfVxuXG4gIHB1YmxpYyBuZ09uSW5pdCgpIHtcbiAgICB0aGlzLmNyZWF0ZVdpZGdldChcbiAgICAgIGNvbm5lY3RSZWZpbmVtZW50TGlzdCxcbiAgICAgIHtcbiAgICAgICAgc2hvd01vcmU6IHRoaXMuc2hvd01vcmUsXG4gICAgICAgIGxpbWl0OiBwYXJzZU51bWJlcklucHV0KHRoaXMubGltaXQpLFxuICAgICAgICBzaG93TW9yZUxpbWl0OiBwYXJzZU51bWJlcklucHV0KHRoaXMuc2hvd01vcmVMaW1pdCksXG4gICAgICAgIGF0dHJpYnV0ZTogdGhpcy5hdHRyaWJ1dGUsXG4gICAgICAgIG9wZXJhdG9yOiB0aGlzLm9wZXJhdG9yLFxuICAgICAgICBzb3J0Qnk6IHRoaXMuc29ydEJ5LFxuICAgICAgICBlc2NhcGVGYWNldFZhbHVlczogdHJ1ZSxcbiAgICAgICAgdHJhbnNmb3JtSXRlbXM6IHRoaXMudHJhbnNmb3JtSXRlbXMsXG4gICAgICB9LFxuICAgICAge1xuICAgICAgICAkJHdpZGdldFR5cGU6ICdhaXMucmVmaW5lbWVudExpc3QnLFxuICAgICAgfVxuICAgICk7XG5cbiAgICBzdXBlci5uZ09uSW5pdCgpO1xuICB9XG5cbiAgcHVibGljIHJlZmluZShldmVudDogTW91c2VFdmVudCwgaXRlbTogUmVmaW5lbWVudExpc3RJdGVtKSB7XG4gICAgZXZlbnQucHJldmVudERlZmF1bHQoKTtcbiAgICBldmVudC5zdG9wUHJvcGFnYXRpb24oKTtcblxuICAgIGlmICh0aGlzLnN0YXRlLmNhblJlZmluZSkge1xuICAgICAgLy8gdXBkYXRlIFVJIGRpcmVjdGx5LCBpdCB3aWxsIHVwZGF0ZSB0aGUgY2hlY2tib3ggc3RhdGVcbiAgICAgIGl0ZW0uaXNSZWZpbmVkID0gIWl0ZW0uaXNSZWZpbmVkO1xuXG4gICAgICAvLyByZWZpbmUgdGhyb3VnaCBBbGdvbGlhIEFQSVxuICAgICAgdGhpcy5zdGF0ZS5yZWZpbmUoaXRlbS52YWx1ZSk7XG4gICAgfVxuICB9XG59XG4iXX0=