instantsearch-ui-components
Version:
Common UI components for InstantSearch.
81 lines (79 loc) • 3.4 kB
JavaScript
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.createHitsComponent = createHitsComponent;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
var _lib = require("../lib");
var _excluded = ["classNames", "hits", "itemComponent", "sendEvent", "emptyComponent", "banner", "bannerComponent"];
// Should be imported from a shared package in the future
function createDefaultBannerComponent(_ref) {
var createElement = _ref.createElement;
return function DefaultBanner(_ref2) {
var classNames = _ref2.classNames,
banner = _ref2.banner;
if (!banner.image.urls[0].url) {
return null;
}
return createElement("aside", {
className: (0, _lib.cx)('ais-Hits-banner', classNames.bannerRoot)
}, banner.link ? createElement("a", {
className: (0, _lib.cx)('ais-Hits-banner-link', classNames.bannerLink),
href: banner.link.url,
target: banner.link.target
}, createElement("img", {
className: (0, _lib.cx)('ais-Hits-banner-image', classNames.bannerImage),
src: banner.image.urls[0].url,
alt: banner.image.title
})) : createElement("img", {
className: (0, _lib.cx)('ais-Hits-banner-image', classNames.bannerImage),
src: banner.image.urls[0].url,
alt: banner.image.title
}));
};
}
function createHitsComponent(_ref3) {
var createElement = _ref3.createElement,
Fragment = _ref3.Fragment;
var DefaultBannerComponent = createDefaultBannerComponent({
createElement: createElement,
Fragment: Fragment
});
return function Hits(userProps) {
var _userProps$classNames = userProps.classNames,
classNames = _userProps$classNames === void 0 ? {} : _userProps$classNames,
hits = userProps.hits,
ItemComponent = userProps.itemComponent,
sendEvent = userProps.sendEvent,
EmptyComponent = userProps.emptyComponent,
banner = userProps.banner,
BannerComponent = userProps.bannerComponent,
props = (0, _objectWithoutProperties2.default)(userProps, _excluded);
return createElement("div", (0, _extends2.default)({}, props, {
className: (0, _lib.cx)('ais-Hits', classNames.root, hits.length === 0 && (0, _lib.cx)('ais-Hits--empty', classNames.emptyRoot), props.className)
}), banner && (BannerComponent ? createElement(BannerComponent, {
className: (0, _lib.cx)('ais-Hits-banner', classNames.bannerRoot),
banner: banner
}) : createElement(DefaultBannerComponent, {
classNames: classNames,
banner: banner
})), hits.length === 0 && EmptyComponent ? createElement(EmptyComponent, null) : createElement("ol", {
className: (0, _lib.cx)('ais-Hits-list', classNames.list)
}, hits.map(function (hit, index) {
return createElement(ItemComponent, {
key: hit.objectID,
hit: hit,
index: index,
className: (0, _lib.cx)('ais-Hits-item', classNames.item),
onClick: function onClick() {
sendEvent('click:internal', hit, 'Hit Clicked');
},
onAuxClick: function onAuxClick() {
sendEvent('click:internal', hit, 'Hit Clicked');
}
});
})));
};
}