react-instantsearch 6.40.3 → 7.0.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/README.md +113 -2
- package/dist/cjs/index.js +27 -0
- package/dist/cjs/package.json +1 -0
- package/dist/cjs/types/PartialKeys.js +1 -0
- package/dist/cjs/types/Translatable.js +1 -0
- package/dist/cjs/types/index.js +27 -0
- package/dist/cjs/ui/Breadcrumb.js +59 -0
- package/dist/cjs/ui/ClearRefinements.js +30 -0
- package/dist/cjs/ui/CurrentRefinements.js +53 -0
- package/dist/cjs/ui/HierarchicalMenu.js +82 -0
- package/dist/cjs/ui/Highlight.js +27 -0
- package/dist/cjs/ui/Hits.js +49 -0
- package/dist/cjs/ui/HitsPerPage.js +36 -0
- package/dist/cjs/ui/InfiniteHits.js +62 -0
- package/dist/cjs/ui/InternalHighlight.js +56 -0
- package/dist/cjs/ui/Menu.js +54 -0
- package/dist/cjs/ui/Pagination.js +127 -0
- package/dist/cjs/ui/PoweredBy.js +39 -0
- package/dist/cjs/ui/RangeInput.js +124 -0
- package/dist/cjs/ui/RefinementList.js +69 -0
- package/dist/cjs/ui/SearchBox.js +153 -0
- package/dist/cjs/ui/ShowMoreButton.js +19 -0
- package/dist/cjs/ui/Snippet.js +27 -0
- package/dist/cjs/ui/SortBy.js +37 -0
- package/dist/cjs/ui/Stats.js +34 -0
- package/dist/cjs/ui/ToggleRefinement.js +35 -0
- package/dist/cjs/ui/lib/cx.js +12 -0
- package/dist/cjs/ui/lib/isModifierClick.js +10 -0
- package/dist/cjs/widgets/Breadcrumb.js +49 -0
- package/dist/cjs/widgets/ClearRefinements.js +44 -0
- package/dist/cjs/widgets/CurrentRefinements.js +36 -0
- package/dist/cjs/widgets/HierarchicalMenu.js +70 -0
- package/dist/cjs/widgets/Highlight.js +33 -0
- package/dist/cjs/widgets/Hits.js +32 -0
- package/dist/cjs/widgets/HitsPerPage.js +40 -0
- package/dist/cjs/widgets/InfiniteHits.js +57 -0
- package/dist/cjs/widgets/Menu.js +64 -0
- package/dist/cjs/widgets/Pagination.js +76 -0
- package/dist/cjs/widgets/PoweredBy.js +19 -0
- package/dist/cjs/widgets/RangeInput.js +53 -0
- package/dist/cjs/widgets/RefinementList.js +124 -0
- package/dist/cjs/widgets/SearchBox.js +91 -0
- package/dist/cjs/widgets/Snippet.js +33 -0
- package/dist/cjs/widgets/SortBy.js +34 -0
- package/dist/cjs/widgets/Stats.js +43 -0
- package/dist/cjs/widgets/ToggleRefinement.js +40 -0
- package/dist/cjs/widgets/index.js +203 -0
- package/dist/es/index.d.ts +2 -0
- package/dist/es/index.js +2 -1
- package/dist/es/types/PartialKeys.d.ts +4 -0
- package/dist/es/types/PartialKeys.js +1 -0
- package/dist/es/types/Translatable.d.ts +5 -0
- package/dist/es/types/Translatable.js +1 -0
- package/dist/es/types/index.d.ts +2 -0
- package/dist/es/types/index.js +2 -0
- package/dist/es/ui/Breadcrumb.d.ts +48 -0
- package/dist/es/ui/Breadcrumb.js +52 -0
- package/dist/es/ui/ClearRefinements.d.ts +26 -0
- package/dist/es/ui/ClearRefinements.js +23 -0
- package/dist/es/ui/CurrentRefinements.d.ts +47 -0
- package/dist/es/ui/CurrentRefinements.js +46 -0
- package/dist/es/ui/HierarchicalMenu.d.ts +73 -0
- package/dist/es/ui/HierarchicalMenu.js +75 -0
- package/dist/es/ui/Highlight.d.ts +6 -0
- package/dist/es/ui/Highlight.js +20 -0
- package/dist/es/ui/Hits.d.ts +31 -0
- package/dist/es/ui/Hits.js +42 -0
- package/dist/es/ui/HitsPerPage.d.ts +23 -0
- package/dist/es/ui/HitsPerPage.js +29 -0
- package/dist/es/ui/InfiniteHits.d.ts +56 -0
- package/dist/es/ui/InfiniteHits.js +55 -0
- package/dist/es/ui/InternalHighlight.d.ts +32 -0
- package/dist/es/ui/InternalHighlight.js +47 -0
- package/dist/es/ui/Menu.d.ts +59 -0
- package/dist/es/ui/Menu.js +47 -0
- package/dist/es/ui/Pagination.d.ts +121 -0
- package/dist/es/ui/Pagination.js +120 -0
- package/dist/es/ui/PoweredBy.d.ts +29 -0
- package/dist/es/ui/PoweredBy.js +32 -0
- package/dist/es/ui/RangeInput.d.ts +60 -0
- package/dist/es/ui/RangeInput.js +115 -0
- package/dist/es/ui/RefinementList.d.ts +73 -0
- package/dist/es/ui/RefinementList.js +62 -0
- package/dist/es/ui/SearchBox.d.ts +64 -0
- package/dist/es/ui/SearchBox.js +146 -0
- package/dist/es/ui/ShowMoreButton.d.ts +19 -0
- package/dist/es/ui/ShowMoreButton.js +12 -0
- package/dist/es/ui/Snippet.d.ts +6 -0
- package/dist/es/ui/Snippet.js +20 -0
- package/dist/es/ui/SortBy.d.ts +21 -0
- package/dist/es/ui/SortBy.js +30 -0
- package/dist/es/ui/Stats.d.ts +20 -0
- package/dist/es/ui/Stats.js +27 -0
- package/dist/es/ui/ToggleRefinement.d.ts +25 -0
- package/dist/es/ui/ToggleRefinement.js +28 -0
- package/dist/es/ui/lib/cx.d.ts +1 -0
- package/dist/es/ui/lib/cx.js +6 -0
- package/dist/es/ui/lib/isModifierClick.d.ts +2 -0
- package/dist/es/ui/lib/isModifierClick.js +4 -0
- package/dist/es/widgets/Breadcrumb.d.ts +8 -0
- package/dist/es/widgets/Breadcrumb.js +42 -0
- package/dist/es/widgets/ClearRefinements.d.ts +8 -0
- package/dist/es/widgets/ClearRefinements.js +37 -0
- package/dist/es/widgets/CurrentRefinements.d.ts +6 -0
- package/dist/es/widgets/CurrentRefinements.js +29 -0
- package/dist/es/widgets/HierarchicalMenu.d.ts +8 -0
- package/dist/es/widgets/HierarchicalMenu.js +63 -0
- package/dist/es/widgets/Highlight.d.ts +8 -0
- package/dist/es/widgets/Highlight.js +26 -0
- package/dist/es/widgets/Hits.d.ts +7 -0
- package/dist/es/widgets/Hits.js +25 -0
- package/dist/es/widgets/HitsPerPage.d.ts +6 -0
- package/dist/es/widgets/HitsPerPage.js +33 -0
- package/dist/es/widgets/InfiniteHits.d.ts +15 -0
- package/dist/es/widgets/InfiniteHits.js +50 -0
- package/dist/es/widgets/Menu.d.ts +8 -0
- package/dist/es/widgets/Menu.js +57 -0
- package/dist/es/widgets/Pagination.d.ts +8 -0
- package/dist/es/widgets/Pagination.js +69 -0
- package/dist/es/widgets/PoweredBy.d.ts +5 -0
- package/dist/es/widgets/PoweredBy.js +12 -0
- package/dist/es/widgets/RangeInput.d.ts +8 -0
- package/dist/es/widgets/RangeInput.js +46 -0
- package/dist/es/widgets/RefinementList.d.ts +15 -0
- package/dist/es/widgets/RefinementList.js +116 -0
- package/dist/es/widgets/SearchBox.d.ts +13 -0
- package/dist/es/widgets/SearchBox.js +83 -0
- package/dist/es/widgets/Snippet.d.ts +8 -0
- package/dist/es/widgets/Snippet.js +26 -0
- package/dist/es/widgets/SortBy.d.ts +6 -0
- package/dist/es/widgets/SortBy.js +27 -0
- package/dist/es/widgets/Stats.d.ts +8 -0
- package/dist/es/widgets/Stats.js +36 -0
- package/dist/es/widgets/ToggleRefinement.d.ts +7 -0
- package/dist/es/widgets/ToggleRefinement.js +33 -0
- package/dist/es/widgets/index.d.ts +18 -0
- package/dist/es/widgets/index.js +18 -0
- package/dist/umd/ReactInstantSearch.js +19990 -0
- package/dist/umd/ReactInstantSearch.js.map +1 -0
- package/dist/umd/ReactInstantSearch.min.js +3 -0
- package/dist/umd/ReactInstantSearch.min.js.map +1 -0
- package/package.json +28 -24
- package/connectors.js +0 -29
- package/dist/README.md +0 -101
- package/dist/connectors.js +0 -168
- package/dist/dom.js +0 -198
- package/dist/es/connectors.js +0 -26
- package/dist/es/dom.js +0 -31
- package/dist/es/native.js +0 -5
- package/dist/es/server.js +0 -1
- package/dist/index.js +0 -12
- package/dist/native.js +0 -42
- package/dist/package.json +0 -56
- package/dist/server.js +0 -12
- package/dist/umd/Connectors.js +0 -11198
- package/dist/umd/Connectors.js.map +0 -1
- package/dist/umd/Connectors.min.js +0 -3
- package/dist/umd/Connectors.min.js.map +0 -1
- package/dist/umd/Core.js +0 -650
- package/dist/umd/Core.js.map +0 -1
- package/dist/umd/Core.min.js +0 -3
- package/dist/umd/Core.min.js.map +0 -1
- package/dist/umd/Dom.js +0 -18919
- package/dist/umd/Dom.js.map +0 -1
- package/dist/umd/Dom.min.js +0 -3
- package/dist/umd/Dom.min.js.map +0 -1
- package/dom.js +0 -34
- package/index.js +0 -1
- package/native.js +0 -8
- package/server.js +0 -1
|
@@ -0,0 +1,120 @@
|
|
|
1
|
+
var _excluded = ["pages", "currentPage", "nbPages", "isFirstPage", "isLastPage", "showFirst", "showPrevious", "showNext", "showLast", "createURL", "onNavigate", "translations", "classNames"],
|
|
2
|
+
_excluded2 = ["isDisabled", "className", "classNames", "href", "onClick"];
|
|
3
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
4
|
+
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
5
|
+
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
6
|
+
import React from 'react';
|
|
7
|
+
import { cx } from "./lib/cx.js";
|
|
8
|
+
import { isModifierClick } from "./lib/isModifierClick.js";
|
|
9
|
+
export function Pagination(_ref) {
|
|
10
|
+
var pages = _ref.pages,
|
|
11
|
+
currentPage = _ref.currentPage,
|
|
12
|
+
nbPages = _ref.nbPages,
|
|
13
|
+
isFirstPage = _ref.isFirstPage,
|
|
14
|
+
isLastPage = _ref.isLastPage,
|
|
15
|
+
_ref$showFirst = _ref.showFirst,
|
|
16
|
+
showFirst = _ref$showFirst === void 0 ? true : _ref$showFirst,
|
|
17
|
+
_ref$showPrevious = _ref.showPrevious,
|
|
18
|
+
showPrevious = _ref$showPrevious === void 0 ? true : _ref$showPrevious,
|
|
19
|
+
_ref$showNext = _ref.showNext,
|
|
20
|
+
showNext = _ref$showNext === void 0 ? true : _ref$showNext,
|
|
21
|
+
_ref$showLast = _ref.showLast,
|
|
22
|
+
showLast = _ref$showLast === void 0 ? true : _ref$showLast,
|
|
23
|
+
createURL = _ref.createURL,
|
|
24
|
+
onNavigate = _ref.onNavigate,
|
|
25
|
+
translations = _ref.translations,
|
|
26
|
+
_ref$classNames = _ref.classNames,
|
|
27
|
+
classNames = _ref$classNames === void 0 ? {} : _ref$classNames,
|
|
28
|
+
props = _objectWithoutProperties(_ref, _excluded);
|
|
29
|
+
var firstPageIndex = 0;
|
|
30
|
+
var previousPageIndex = currentPage - 1;
|
|
31
|
+
var nextPageIndex = currentPage + 1;
|
|
32
|
+
var lastPageIndex = nbPages - 1;
|
|
33
|
+
return /*#__PURE__*/React.createElement("div", _extends({}, props, {
|
|
34
|
+
className: cx('ais-Pagination', classNames.root, nbPages <= 1 && cx('ais-Pagination--noRefinement', classNames.noRefinementRoot), props.className)
|
|
35
|
+
}), /*#__PURE__*/React.createElement("ul", {
|
|
36
|
+
className: cx('ais-Pagination-list', classNames.list)
|
|
37
|
+
}, showFirst && /*#__PURE__*/React.createElement(PaginationItem, {
|
|
38
|
+
isDisabled: isFirstPage,
|
|
39
|
+
className: cx('ais-Pagination-item--firstPage', classNames.firstPageItem),
|
|
40
|
+
classNames: classNames,
|
|
41
|
+
"aria-label": translations.firstPageItemAriaLabel,
|
|
42
|
+
href: createURL(firstPageIndex),
|
|
43
|
+
onClick: function onClick() {
|
|
44
|
+
return onNavigate(firstPageIndex);
|
|
45
|
+
}
|
|
46
|
+
}, translations.firstPageItemText), showPrevious && /*#__PURE__*/React.createElement(PaginationItem, {
|
|
47
|
+
isDisabled: isFirstPage,
|
|
48
|
+
className: cx('ais-Pagination-item--previousPage', classNames.previousPageItem),
|
|
49
|
+
classNames: classNames,
|
|
50
|
+
"aria-label": translations.previousPageItemAriaLabel,
|
|
51
|
+
href: createURL(previousPageIndex),
|
|
52
|
+
onClick: function onClick() {
|
|
53
|
+
return onNavigate(previousPageIndex);
|
|
54
|
+
}
|
|
55
|
+
}, translations.previousPageItemText), pages.map(function (page) {
|
|
56
|
+
return /*#__PURE__*/React.createElement(PaginationItem, {
|
|
57
|
+
key: page,
|
|
58
|
+
isDisabled: false,
|
|
59
|
+
className: cx('ais-Pagination-item--page', classNames.pageItem, page === currentPage && cx('ais-Pagination-item--selected', classNames.selectedItem)),
|
|
60
|
+
classNames: classNames,
|
|
61
|
+
"aria-label": translations.pageItemAriaLabel({
|
|
62
|
+
currentPage: page + 1,
|
|
63
|
+
nbPages: nbPages
|
|
64
|
+
}),
|
|
65
|
+
href: createURL(page),
|
|
66
|
+
onClick: function onClick() {
|
|
67
|
+
return onNavigate(page);
|
|
68
|
+
}
|
|
69
|
+
}, translations.pageItemText({
|
|
70
|
+
currentPage: page + 1,
|
|
71
|
+
nbPages: nbPages
|
|
72
|
+
}));
|
|
73
|
+
}), showNext && /*#__PURE__*/React.createElement(PaginationItem, {
|
|
74
|
+
isDisabled: isLastPage,
|
|
75
|
+
className: cx('ais-Pagination-item--nextPage', classNames.nextPageItem),
|
|
76
|
+
classNames: classNames,
|
|
77
|
+
"aria-label": translations.nextPageItemAriaLabel,
|
|
78
|
+
href: createURL(nextPageIndex),
|
|
79
|
+
onClick: function onClick() {
|
|
80
|
+
return onNavigate(nextPageIndex);
|
|
81
|
+
}
|
|
82
|
+
}, translations.nextPageItemText), showLast && /*#__PURE__*/React.createElement(PaginationItem, {
|
|
83
|
+
isDisabled: isLastPage,
|
|
84
|
+
className: cx('ais-Pagination-item--lastPage', classNames.lastPageItem),
|
|
85
|
+
classNames: classNames,
|
|
86
|
+
"aria-label": translations.lastPageItemAriaLabel,
|
|
87
|
+
href: createURL(lastPageIndex),
|
|
88
|
+
onClick: function onClick() {
|
|
89
|
+
return onNavigate(lastPageIndex);
|
|
90
|
+
}
|
|
91
|
+
}, translations.lastPageItemText)));
|
|
92
|
+
}
|
|
93
|
+
function PaginationItem(_ref2) {
|
|
94
|
+
var isDisabled = _ref2.isDisabled,
|
|
95
|
+
className = _ref2.className,
|
|
96
|
+
classNames = _ref2.classNames,
|
|
97
|
+
href = _ref2.href,
|
|
98
|
+
_onClick = _ref2.onClick,
|
|
99
|
+
props = _objectWithoutProperties(_ref2, _excluded2);
|
|
100
|
+
if (isDisabled) {
|
|
101
|
+
return /*#__PURE__*/React.createElement("li", {
|
|
102
|
+
className: cx('ais-Pagination-item', classNames.item, 'ais-Pagination-item--disabled', classNames.disabledItem, className)
|
|
103
|
+
}, /*#__PURE__*/React.createElement("span", _extends({
|
|
104
|
+
className: cx('ais-Pagination-link', classNames.link)
|
|
105
|
+
}, props)));
|
|
106
|
+
}
|
|
107
|
+
return /*#__PURE__*/React.createElement("li", {
|
|
108
|
+
className: cx('ais-Pagination-item', classNames.item, className)
|
|
109
|
+
}, /*#__PURE__*/React.createElement("a", _extends({
|
|
110
|
+
className: cx('ais-Pagination-link', classNames.link),
|
|
111
|
+
href: href,
|
|
112
|
+
onClick: function onClick(event) {
|
|
113
|
+
if (isModifierClick(event)) {
|
|
114
|
+
return;
|
|
115
|
+
}
|
|
116
|
+
event.preventDefault();
|
|
117
|
+
_onClick(event);
|
|
118
|
+
}
|
|
119
|
+
}, props)));
|
|
120
|
+
}
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
export type PoweredByClassNames = {
|
|
3
|
+
/**
|
|
4
|
+
* Class names to apply to the root element
|
|
5
|
+
*/
|
|
6
|
+
root: string;
|
|
7
|
+
/**
|
|
8
|
+
* Class names to apply to the root element with the light theme
|
|
9
|
+
*/
|
|
10
|
+
light: string;
|
|
11
|
+
/**
|
|
12
|
+
* Class names to apply to the root element with the dark theme
|
|
13
|
+
*/
|
|
14
|
+
dark: string;
|
|
15
|
+
/**
|
|
16
|
+
* Class names to apply to the link element
|
|
17
|
+
*/
|
|
18
|
+
link: string;
|
|
19
|
+
/**
|
|
20
|
+
* Class names to apply to the SVG logo
|
|
21
|
+
*/
|
|
22
|
+
logo: string;
|
|
23
|
+
};
|
|
24
|
+
export type PoweredByProps = React.ComponentProps<'div'> & {
|
|
25
|
+
classNames?: Partial<PoweredByClassNames>;
|
|
26
|
+
url: string;
|
|
27
|
+
theme?: 'light' | 'dark';
|
|
28
|
+
};
|
|
29
|
+
export declare function PoweredBy({ classNames, url, theme, ...props }: PoweredByProps): JSX.Element;
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
var _excluded = ["classNames", "url", "theme"];
|
|
2
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
3
|
+
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
4
|
+
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
5
|
+
import React from 'react';
|
|
6
|
+
import { cx } from "./lib/cx.js";
|
|
7
|
+
export function PoweredBy(_ref) {
|
|
8
|
+
var _ref$classNames = _ref.classNames,
|
|
9
|
+
classNames = _ref$classNames === void 0 ? {} : _ref$classNames,
|
|
10
|
+
url = _ref.url,
|
|
11
|
+
_ref$theme = _ref.theme,
|
|
12
|
+
theme = _ref$theme === void 0 ? 'light' : _ref$theme,
|
|
13
|
+
props = _objectWithoutProperties(_ref, _excluded);
|
|
14
|
+
return /*#__PURE__*/React.createElement("div", _extends({}, props, {
|
|
15
|
+
className: cx('ais-PoweredBy', theme === 'dark' ? cx('ais-PoweredBy--dark', classNames.dark) : cx('ais-PoweredBy--light', classNames.light), classNames.root, props.className)
|
|
16
|
+
}), /*#__PURE__*/React.createElement("a", {
|
|
17
|
+
href: url,
|
|
18
|
+
target: "_blank",
|
|
19
|
+
className: cx('ais-PoweredBy-link', classNames.link),
|
|
20
|
+
"aria-label": "Search by Algolia",
|
|
21
|
+
rel: "noopener noreferrer"
|
|
22
|
+
}, /*#__PURE__*/React.createElement("svg", {
|
|
23
|
+
viewBox: "0 0 572 64",
|
|
24
|
+
className: cx('ais-PoweredBy-logo', classNames.logo)
|
|
25
|
+
}, /*#__PURE__*/React.createElement("path", {
|
|
26
|
+
fill: theme === 'dark' ? '#FFF' : '#36395A',
|
|
27
|
+
d: "M16 48.3c-3.4 0-6.3-.6-8.7-1.7A12.4 12.4 0 0 1 1.9 42C.6 40 0 38 0 35.4h6.5a6.7 6.7 0 0 0 3.9 6c1.4.7 3.3 1.1 5.6 1.1 2.2 0 4-.3 5.4-1a7 7 0 0 0 3-2.4 6 6 0 0 0 1-3.4c0-1.5-.6-2.8-1.9-3.7-1.3-1-3.3-1.6-5.9-1.8l-4-.4c-3.7-.3-6.6-1.4-8.8-3.4a10 10 0 0 1-3.3-7.9c0-2.4.6-4.6 1.8-6.4a12 12 0 0 1 5-4.3c2.2-1 4.7-1.6 7.5-1.6s5.5.5 7.6 1.6a12 12 0 0 1 5 4.4c1.2 1.8 1.8 4 1.8 6.7h-6.5a6.4 6.4 0 0 0-3.5-5.9c-1-.6-2.6-1-4.4-1s-3.2.3-4.4 1c-1.1.6-2 1.4-2.6 2.4-.5 1-.8 2-.8 3.1a5 5 0 0 0 1.5 3.6c1 1 2.6 1.7 4.7 1.9l4 .3c2.8.2 5.2.8 7.2 1.8 2.1 1 3.7 2.2 4.9 3.8a9.7 9.7 0 0 1 1.7 5.8c0 2.5-.7 4.7-2 6.6a13 13 0 0 1-5.6 4.4c-2.4 1-5.2 1.6-8.4 1.6Zm35.6 0c-2.6 0-4.8-.4-6.7-1.3a13 13 0 0 1-4.7-3.5 17.1 17.1 0 0 1-3.6-10.4v-1c0-2 .3-3.8 1-5.6a13 13 0 0 1 7.3-8.3 15 15 0 0 1 6.3-1.4A13.2 13.2 0 0 1 64 24.3c1 2.2 1.6 4.6 1.6 7.2V34H39.4v-4.3h21.8l-1.8 2.2c0-2-.3-3.7-.9-5.1a7.3 7.3 0 0 0-2.7-3.4c-1.2-.7-2.7-1.1-4.6-1.1s-3.4.4-4.7 1.3a8 8 0 0 0-2.9 3.6c-.6 1.5-.9 3.3-.9 5.4 0 2 .3 3.7 1 5.3a7.9 7.9 0 0 0 2.8 3.7c1.3.8 3 1.3 5 1.3s3.8-.5 5.1-1.3c1.3-1 2.1-2 2.4-3.2h6a11.8 11.8 0 0 1-7 8.7 16 16 0 0 1-6.4 1.2ZM80 48c-2.2 0-4-.3-5.7-1a8.4 8.4 0 0 1-3.7-3.3 9.7 9.7 0 0 1-1.3-5.2c0-2 .5-3.8 1.5-5.2a9 9 0 0 1 4.3-3.1c1.8-.7 4-1 6.7-1H89v4.1h-7.5c-2 0-3.4.5-4.4 1.4-1 1-1.6 2.1-1.6 3.6s.5 2.7 1.6 3.6c1 1 2.5 1.4 4.4 1.4 1.1 0 2.2-.2 3.2-.7 1-.4 1.9-1 2.6-2 .6-1 1-2.4 1-4.2l1.7 2.1c-.2 2-.7 3.8-1.5 5.2a9 9 0 0 1-3.4 3.3 12 12 0 0 1-5.3 1Zm9.5-.7v-8.8h-1v-10c0-1.8-.5-3.2-1.4-4.1-1-1-2.4-1.4-4.2-1.4a142.9 142.9 0 0 0-10.2.4v-5.6a74.8 74.8 0 0 1 8.6-.4c3 0 5.5.4 7.5 1.2s3.4 2 4.4 3.6c1 1.7 1.4 4 1.4 6.7v18.4h-5Zm12.9 0V17.8h5v12.3h-.2c0-4.2 1-7.4 2.8-9.5a11 11 0 0 1 8.3-3.1h1v5.6h-2a9 9 0 0 0-6.3 2.2c-1.5 1.5-2.2 3.6-2.2 6.4v15.6h-6.4Zm34.4 1a15 15 0 0 1-6.6-1.3c-1.9-.9-3.4-2-4.7-3.5a15.5 15.5 0 0 1-2.7-5c-.6-1.7-1-3.6-1-5.4v-1c0-2 .4-3.8 1-5.6a15 15 0 0 1 2.8-4.9c1.3-1.5 2.8-2.6 4.6-3.5a16.4 16.4 0 0 1 13.3.2c2 1 3.5 2.3 4.8 4a12 12 0 0 1 2 6H144c-.2-1.6-1-3-2.2-4.1a7.5 7.5 0 0 0-5.2-1.7 8 8 0 0 0-4.7 1.3 8 8 0 0 0-2.8 3.6 13.8 13.8 0 0 0 0 10.3c.6 1.5 1.5 2.7 2.8 3.6s2.8 1.3 4.8 1.3c1.5 0 2.7-.2 3.8-.8a7 7 0 0 0 2.6-2c.7-1 1-2 1.2-3.2h6.2a11 11 0 0 1-2 6.2 15.1 15.1 0 0 1-11.8 5.5Zm19.7-1v-40h6.4V31h-1.3c0-3 .4-5.5 1.1-7.6a9.7 9.7 0 0 1 3.5-4.8A9.9 9.9 0 0 1 172 17h.3c3.5 0 6 1.1 7.9 3.5 1.7 2.3 2.6 5.7 2.6 10v16.8h-6.4V29.6c0-2.1-.6-3.8-1.8-5a6.4 6.4 0 0 0-4.8-1.8c-2 0-3.7.7-5 2a7.8 7.8 0 0 0-1.9 5.5v17h-6.4Zm63.8 1a12.2 12.2 0 0 1-10.9-6.2 19 19 0 0 1-1.8-7.3h1.4v12.5h-5.1v-40h6.4v19.8l-2 3.5c.2-3.1.8-5.7 1.9-7.7a11 11 0 0 1 4.4-4.5c1.8-1 3.9-1.5 6.1-1.5a13.4 13.4 0 0 1 12.8 9.1c.7 1.9 1 3.8 1 6v1c0 2.2-.3 4.1-1 6a13.6 13.6 0 0 1-13.2 9.4Zm-1.2-5.5a8.4 8.4 0 0 0 7.9-5c.7-1.5 1.1-3.3 1.1-5.3s-.4-3.8-1.1-5.3a8.7 8.7 0 0 0-3.2-3.6 9.6 9.6 0 0 0-9.2-.2 8.5 8.5 0 0 0-3.3 3.2c-.8 1.4-1.3 3-1.3 5v2.3a9 9 0 0 0 1.3 4.8 9 9 0 0 0 3.4 3c1.4.7 2.8 1 4.4 1Zm27.3 3.9-10-28.9h6.5l9.5 28.9h-6Zm-7.5 12.2v-5.7h4.9c1 0 2-.1 2.9-.4a4 4 0 0 0 2-1.4c.4-.7.9-1.6 1.2-2.7l8.6-30.9h6.2l-9.3 32.4a14 14 0 0 1-2.5 5 8.9 8.9 0 0 1-4 2.8c-1.5.6-3.4.9-5.6.9h-4.4Zm9-12.2v-5.2h6.4v5.2H248Z"
|
|
28
|
+
}), /*#__PURE__*/React.createElement("path", {
|
|
29
|
+
fill: theme === 'dark' ? '#FFF' : '#003DFF',
|
|
30
|
+
d: "M534.4 9.1H528a.8.8 0 0 1-.7-.7V1.8c0-.4.2-.7.6-.8l6.5-1c.4 0 .8.2.9.6v7.8c0 .4-.4.7-.8.7zM428 35.2V.8c0-.5-.3-.8-.7-.8h-.2l-6.4 1c-.4 0-.7.4-.7.8v35c0 1.6 0 11.8 12.3 12.2.5 0 .8-.4.8-.8V43c0-.4-.3-.7-.6-.8-4.5-.5-4.5-6-4.5-7zm106.5-21.8H528c-.4 0-.7.4-.7.8v34c0 .4.3.8.7.8h6.5c.4 0 .8-.4.8-.8v-34c0-.5-.4-.8-.8-.8zm-17.7 21.8V.8c0-.5-.3-.8-.8-.8l-6.5 1c-.4 0-.7.4-.7.8v35c0 1.6 0 11.8 12.3 12.2.4 0 .8-.4.8-.8V43c0-.4-.3-.7-.7-.8-4.4-.5-4.4-6-4.4-7zm-22.2-20.6a16.5 16.5 0 0 1 8.6 9.3c.8 2.2 1.3 4.8 1.3 7.5a19.4 19.4 0 0 1-4.6 12.6 14.8 14.8 0 0 1-5.2 3.6c-2 .9-5.2 1.4-6.8 1.4a21 21 0 0 1-6.7-1.4 15.4 15.4 0 0 1-8.6-9.3 21.3 21.3 0 0 1 0-14.4 15.2 15.2 0 0 1 8.6-9.3c2-.8 4.3-1.2 6.7-1.2s4.6.4 6.7 1.2zm-6.7 27.6c2.7 0 4.7-1 6.2-3s2.2-4.3 2.2-7.8-.7-6.3-2.2-8.3-3.5-3-6.2-3-4.7 1-6.1 3c-1.5 2-2.2 4.8-2.2 8.3s.7 5.8 2.2 7.8 3.5 3 6.2 3zm-88.8-28.8c-6.2 0-11.7 3.3-14.8 8.2a18.6 18.6 0 0 0 4.8 25.2c1.8 1.2 4 1.8 6.2 1.7s.1 0 .1 0h.9c4.2-.7 8-4 9.1-8.1v7.4c0 .4.3.7.8.7h6.4a.7.7 0 0 0 .7-.7V14.2c0-.5-.3-.8-.7-.8h-13.5zm6.3 26.5a9.8 9.8 0 0 1-5.7 2h-.5a10 10 0 0 1-9.2-14c1.4-3.7 5-6.3 9-6.3h6.4v18.3zm152.3-26.5h13.5c.5 0 .8.3.8.7v33.7c0 .4-.3.7-.8.7h-6.4a.7.7 0 0 1-.8-.7v-7.4c-1.2 4-4.8 7.4-9 8h-.1a4.2 4.2 0 0 1-.5.1h-.9a10.3 10.3 0 0 1-7-2.6c-4-3.3-6.5-8.4-6.5-14.2 0-3.7 1-7.2 3-10 3-5 8.5-8.3 14.7-8.3zm.6 28.4c2.2-.1 4.2-.6 5.7-2V21.7h-6.3a9.8 9.8 0 0 0-9 6.4 10.2 10.2 0 0 0 9.1 13.9h.5zM452.8 13.4c-6.2 0-11.7 3.3-14.8 8.2a18.5 18.5 0 0 0 3.6 24.3 10.4 10.4 0 0 0 13 .6c2.2-1.5 3.8-3.7 4.5-6.1v7.8c0 2.8-.8 5-2.2 6.3-1.5 1.5-4 2.2-7.5 2.2l-6-.3c-.3 0-.7.2-.8.5l-1.6 5.5c-.1.4.1.8.5 1h.1c2.8.4 5.5.6 7 .6 6.3 0 11-1.4 14-4.1 2.7-2.5 4.2-6.3 4.5-11.4V14.2c0-.5-.4-.8-.8-.8h-13.5zm6.3 8.2v18.3a9.6 9.6 0 0 1-5.6 2h-1a10.3 10.3 0 0 1-8.8-14c1.4-3.7 5-6.3 9-6.3h6.4zM291 31.5A32 32 0 0 1 322.8 0h30.8c.6 0 1.2.5 1.2 1.2v61.5c0 1.1-1.3 1.7-2.2 1l-19.2-17a18 18 0 0 1-11 3.4 18.1 18.1 0 1 1 18.2-14.8c-.1.4-.5.7-.9.6-.1 0-.3 0-.4-.2l-3.8-3.4c-.4-.3-.6-.8-.7-1.4a12 12 0 1 0-2.4 8.3c.4-.4 1-.5 1.6-.2l14.7 13.1v-46H323a26 26 0 1 0 10 49.7c.8-.4 1.6-.2 2.3.3l3 2.7c.3.2.3.7 0 1l-.2.2a32 32 0 0 1-47.2-28.6z"
|
|
31
|
+
}))));
|
|
32
|
+
}
|
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { useRange } from 'react-instantsearch-core';
|
|
3
|
+
type RangeRenderState = ReturnType<typeof useRange>;
|
|
4
|
+
export type RangeInputProps = Omit<React.ComponentProps<'div'>, 'onSubmit'> & Pick<RangeRenderState, 'range' | 'start'> & {
|
|
5
|
+
classNames?: Partial<RangeInputClassNames>;
|
|
6
|
+
disabled: boolean;
|
|
7
|
+
onSubmit: RangeRenderState['refine'];
|
|
8
|
+
step?: number;
|
|
9
|
+
translations: RangeInputTranslations;
|
|
10
|
+
};
|
|
11
|
+
export type RangeInputClassNames = {
|
|
12
|
+
/**
|
|
13
|
+
* Class names to apply to the root element
|
|
14
|
+
*/
|
|
15
|
+
root: string;
|
|
16
|
+
/**
|
|
17
|
+
* Class names to apply to the root element when there are no refinements possible
|
|
18
|
+
*/
|
|
19
|
+
noRefinementRoot: string;
|
|
20
|
+
/**
|
|
21
|
+
* Class names to apply to the form element
|
|
22
|
+
*/
|
|
23
|
+
form: string;
|
|
24
|
+
/**
|
|
25
|
+
* Class names to apply to each label element
|
|
26
|
+
*/
|
|
27
|
+
label: string;
|
|
28
|
+
/**
|
|
29
|
+
* Class names to apply to each input element
|
|
30
|
+
*/
|
|
31
|
+
input: string;
|
|
32
|
+
/**
|
|
33
|
+
* Class names to apply to the minimum input element
|
|
34
|
+
*/
|
|
35
|
+
inputMin: string;
|
|
36
|
+
/**
|
|
37
|
+
* Class names to apply to the maximum input element
|
|
38
|
+
*/
|
|
39
|
+
inputMax: string;
|
|
40
|
+
/**
|
|
41
|
+
* Class names to apply to the separator element
|
|
42
|
+
*/
|
|
43
|
+
separator: string;
|
|
44
|
+
/**
|
|
45
|
+
* Class names to apply to the submit button
|
|
46
|
+
*/
|
|
47
|
+
submit: string;
|
|
48
|
+
};
|
|
49
|
+
export type RangeInputTranslations = {
|
|
50
|
+
/**
|
|
51
|
+
* The label of the separator, between the minimum and maximum inputs
|
|
52
|
+
*/
|
|
53
|
+
separatorElementText: string;
|
|
54
|
+
/**
|
|
55
|
+
* The label of the submit button
|
|
56
|
+
*/
|
|
57
|
+
submitButtonText: string;
|
|
58
|
+
};
|
|
59
|
+
export declare function RangeInput({ classNames, range: { min, max }, start: [minValue, maxValue], step, disabled, onSubmit, translations, ...props }: RangeInputProps): JSX.Element;
|
|
60
|
+
export {};
|
|
@@ -0,0 +1,115 @@
|
|
|
1
|
+
var _excluded = ["classNames", "range", "start", "step", "disabled", "onSubmit", "translations"];
|
|
2
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
3
|
+
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
4
|
+
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
5
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
6
|
+
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
7
|
+
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
8
|
+
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
|
|
9
|
+
function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
|
|
10
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
11
|
+
import React, { useState } from 'react';
|
|
12
|
+
import { cx } from "./lib/cx.js";
|
|
13
|
+
// if the default value is undefined, React considers the component uncontrolled initially, which we don't want 0 or NaN as the default value
|
|
14
|
+
var unsetNumberInputValue = '';
|
|
15
|
+
|
|
16
|
+
// Strips leading `0` from a positive number value
|
|
17
|
+
function stripLeadingZeroFromInput(value) {
|
|
18
|
+
return value.replace(/^(0+)\d/, function (part) {
|
|
19
|
+
return Number(part).toString();
|
|
20
|
+
});
|
|
21
|
+
}
|
|
22
|
+
export function RangeInput(_ref) {
|
|
23
|
+
var _values$min, _values$max;
|
|
24
|
+
var _ref$classNames = _ref.classNames,
|
|
25
|
+
classNames = _ref$classNames === void 0 ? {} : _ref$classNames,
|
|
26
|
+
_ref$range = _ref.range,
|
|
27
|
+
min = _ref$range.min,
|
|
28
|
+
max = _ref$range.max,
|
|
29
|
+
_ref$start = _slicedToArray(_ref.start, 2),
|
|
30
|
+
minValue = _ref$start[0],
|
|
31
|
+
maxValue = _ref$start[1],
|
|
32
|
+
_ref$step = _ref.step,
|
|
33
|
+
step = _ref$step === void 0 ? 1 : _ref$step,
|
|
34
|
+
disabled = _ref.disabled,
|
|
35
|
+
_onSubmit = _ref.onSubmit,
|
|
36
|
+
translations = _ref.translations,
|
|
37
|
+
props = _objectWithoutProperties(_ref, _excluded);
|
|
38
|
+
var values = {
|
|
39
|
+
min: minValue !== -Infinity && minValue !== min ? minValue : unsetNumberInputValue,
|
|
40
|
+
max: maxValue !== Infinity && maxValue !== max ? maxValue : unsetNumberInputValue
|
|
41
|
+
};
|
|
42
|
+
var _useState = useState(values),
|
|
43
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
44
|
+
prevValues = _useState2[0],
|
|
45
|
+
setPrevValues = _useState2[1];
|
|
46
|
+
var _useState3 = useState({
|
|
47
|
+
from: (_values$min = values.min) === null || _values$min === void 0 ? void 0 : _values$min.toString(),
|
|
48
|
+
to: (_values$max = values.max) === null || _values$max === void 0 ? void 0 : _values$max.toString()
|
|
49
|
+
}),
|
|
50
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
51
|
+
_useState4$ = _useState4[0],
|
|
52
|
+
from = _useState4$.from,
|
|
53
|
+
to = _useState4$.to,
|
|
54
|
+
setRange = _useState4[1];
|
|
55
|
+
if (values.min !== prevValues.min || values.max !== prevValues.max) {
|
|
56
|
+
var _values$min2, _values$max2;
|
|
57
|
+
setRange({
|
|
58
|
+
from: (_values$min2 = values.min) === null || _values$min2 === void 0 ? void 0 : _values$min2.toString(),
|
|
59
|
+
to: (_values$max2 = values.max) === null || _values$max2 === void 0 ? void 0 : _values$max2.toString()
|
|
60
|
+
});
|
|
61
|
+
setPrevValues(values);
|
|
62
|
+
}
|
|
63
|
+
return /*#__PURE__*/React.createElement("div", _extends({}, props, {
|
|
64
|
+
className: cx(cx('ais-RangeInput', classNames.root), disabled && cx('ais-RangeInput--noRefinement', classNames.noRefinementRoot), props.className)
|
|
65
|
+
}), /*#__PURE__*/React.createElement("form", {
|
|
66
|
+
className: cx('ais-RangeInput-form', classNames.form),
|
|
67
|
+
onSubmit: function onSubmit(event) {
|
|
68
|
+
event.preventDefault();
|
|
69
|
+
_onSubmit([from ? Number(from) : undefined, to ? Number(to) : undefined]);
|
|
70
|
+
}
|
|
71
|
+
}, /*#__PURE__*/React.createElement("label", {
|
|
72
|
+
className: cx('ais-RangeInput-label', classNames.label)
|
|
73
|
+
}, /*#__PURE__*/React.createElement("input", {
|
|
74
|
+
className: cx('ais-RangeInput-input', classNames.input, 'ais-RangeInput-input--min', classNames.inputMin),
|
|
75
|
+
type: "number",
|
|
76
|
+
min: min,
|
|
77
|
+
max: max,
|
|
78
|
+
value: stripLeadingZeroFromInput(from || unsetNumberInputValue),
|
|
79
|
+
step: step,
|
|
80
|
+
placeholder: min === null || min === void 0 ? void 0 : min.toString(),
|
|
81
|
+
disabled: disabled,
|
|
82
|
+
onInput: function onInput(_ref2) {
|
|
83
|
+
var currentTarget = _ref2.currentTarget;
|
|
84
|
+
var value = currentTarget.value;
|
|
85
|
+
setRange({
|
|
86
|
+
from: value || unsetNumberInputValue,
|
|
87
|
+
to: to
|
|
88
|
+
});
|
|
89
|
+
}
|
|
90
|
+
})), /*#__PURE__*/React.createElement("span", {
|
|
91
|
+
className: cx('ais-RangeInput-separator', classNames.separator)
|
|
92
|
+
}, translations.separatorElementText), /*#__PURE__*/React.createElement("label", {
|
|
93
|
+
className: cx('ais-RangeInput-label', classNames.label)
|
|
94
|
+
}, /*#__PURE__*/React.createElement("input", {
|
|
95
|
+
className: cx('ais-RangeInput-input', classNames.input, 'ais-RangeInput-input--max', classNames.inputMax),
|
|
96
|
+
type: "number",
|
|
97
|
+
min: min,
|
|
98
|
+
max: max,
|
|
99
|
+
value: stripLeadingZeroFromInput(to || unsetNumberInputValue),
|
|
100
|
+
step: step,
|
|
101
|
+
placeholder: max === null || max === void 0 ? void 0 : max.toString(),
|
|
102
|
+
disabled: disabled,
|
|
103
|
+
onInput: function onInput(_ref3) {
|
|
104
|
+
var currentTarget = _ref3.currentTarget;
|
|
105
|
+
var value = currentTarget.value;
|
|
106
|
+
setRange({
|
|
107
|
+
from: from,
|
|
108
|
+
to: value || unsetNumberInputValue
|
|
109
|
+
});
|
|
110
|
+
}
|
|
111
|
+
})), /*#__PURE__*/React.createElement("button", {
|
|
112
|
+
className: cx('ais-RangeInput-submit', classNames.submit),
|
|
113
|
+
type: "submit"
|
|
114
|
+
}, translations.submitButtonText)));
|
|
115
|
+
}
|
|
@@ -0,0 +1,73 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { ShowMoreButtonTranslations } from './ShowMoreButton';
|
|
3
|
+
import type { RefinementListItem } from 'instantsearch.js/es/connectors/refinement-list/connectRefinementList';
|
|
4
|
+
export type RefinementListProps = React.ComponentProps<'div'> & {
|
|
5
|
+
canRefine: boolean;
|
|
6
|
+
items: RefinementListItem[];
|
|
7
|
+
onRefine: (item: RefinementListItem) => void;
|
|
8
|
+
query: string;
|
|
9
|
+
searchBox?: React.ReactNode;
|
|
10
|
+
noResults?: React.ReactNode;
|
|
11
|
+
showMore?: boolean;
|
|
12
|
+
canToggleShowMore: boolean;
|
|
13
|
+
onToggleShowMore: () => void;
|
|
14
|
+
isShowingMore: boolean;
|
|
15
|
+
classNames?: Partial<RefinementListClassNames>;
|
|
16
|
+
translations: RefinementListTranslations;
|
|
17
|
+
};
|
|
18
|
+
export type RefinementListClassNames = {
|
|
19
|
+
/**
|
|
20
|
+
* Class names to apply to the root element
|
|
21
|
+
*/
|
|
22
|
+
root: string;
|
|
23
|
+
/**
|
|
24
|
+
* Class names to apply to the root element when there are no refinements possible
|
|
25
|
+
*/
|
|
26
|
+
noRefinementRoot: string;
|
|
27
|
+
/**
|
|
28
|
+
* Class names to apply to the search box wrapper element
|
|
29
|
+
*/
|
|
30
|
+
searchBox: string;
|
|
31
|
+
/**
|
|
32
|
+
* Class names to apply to the root element
|
|
33
|
+
*/
|
|
34
|
+
noResults: string;
|
|
35
|
+
/**
|
|
36
|
+
* Class names to apply to the list element
|
|
37
|
+
*/
|
|
38
|
+
list: string;
|
|
39
|
+
/**
|
|
40
|
+
* Class names to apply to each item element
|
|
41
|
+
*/
|
|
42
|
+
item: string;
|
|
43
|
+
/**
|
|
44
|
+
* Class names to apply to each selected item element
|
|
45
|
+
*/
|
|
46
|
+
selectedItem: string;
|
|
47
|
+
/**
|
|
48
|
+
* Class names to apply to each label element
|
|
49
|
+
*/
|
|
50
|
+
label: string;
|
|
51
|
+
/**
|
|
52
|
+
* Class names to apply to each checkbox element
|
|
53
|
+
*/
|
|
54
|
+
checkbox: string;
|
|
55
|
+
/**
|
|
56
|
+
* Class names to apply to the text for each label
|
|
57
|
+
*/
|
|
58
|
+
labelText: string;
|
|
59
|
+
/**
|
|
60
|
+
* Class names to apply to the facet count of each item
|
|
61
|
+
*/
|
|
62
|
+
count: string;
|
|
63
|
+
/**
|
|
64
|
+
* Class names to apply to the "Show more" button
|
|
65
|
+
*/
|
|
66
|
+
showMore: string;
|
|
67
|
+
/**
|
|
68
|
+
* Class names to apply to the "Show more" button if it's disabled
|
|
69
|
+
*/
|
|
70
|
+
disabledShowMore: string;
|
|
71
|
+
};
|
|
72
|
+
export type RefinementListTranslations = ShowMoreButtonTranslations;
|
|
73
|
+
export declare function RefinementList({ canRefine, items, onRefine, query, searchBox, noResults, showMore, canToggleShowMore, onToggleShowMore, isShowingMore, className, classNames, translations, ...props }: RefinementListProps): JSX.Element;
|
|
@@ -0,0 +1,62 @@
|
|
|
1
|
+
var _excluded = ["canRefine", "items", "onRefine", "query", "searchBox", "noResults", "showMore", "canToggleShowMore", "onToggleShowMore", "isShowingMore", "className", "classNames", "translations"];
|
|
2
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
3
|
+
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
4
|
+
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
5
|
+
import { getHighlightedParts, unescape } from "instantsearch.js/es/lib/utils/index.js";
|
|
6
|
+
import React from 'react';
|
|
7
|
+
import { Highlight } from "./Highlight.js";
|
|
8
|
+
import { cx } from "./lib/cx.js";
|
|
9
|
+
import { ShowMoreButton } from "./ShowMoreButton.js";
|
|
10
|
+
export function RefinementList(_ref) {
|
|
11
|
+
var canRefine = _ref.canRefine,
|
|
12
|
+
items = _ref.items,
|
|
13
|
+
onRefine = _ref.onRefine,
|
|
14
|
+
query = _ref.query,
|
|
15
|
+
searchBox = _ref.searchBox,
|
|
16
|
+
noResults = _ref.noResults,
|
|
17
|
+
showMore = _ref.showMore,
|
|
18
|
+
canToggleShowMore = _ref.canToggleShowMore,
|
|
19
|
+
onToggleShowMore = _ref.onToggleShowMore,
|
|
20
|
+
isShowingMore = _ref.isShowingMore,
|
|
21
|
+
className = _ref.className,
|
|
22
|
+
_ref$classNames = _ref.classNames,
|
|
23
|
+
classNames = _ref$classNames === void 0 ? {} : _ref$classNames,
|
|
24
|
+
translations = _ref.translations,
|
|
25
|
+
props = _objectWithoutProperties(_ref, _excluded);
|
|
26
|
+
return /*#__PURE__*/React.createElement("div", _extends({}, props, {
|
|
27
|
+
className: cx('ais-RefinementList', classNames.root, !canRefine && cx('ais-RefinementList--noRefinement', classNames.noRefinementRoot), className)
|
|
28
|
+
}), searchBox && /*#__PURE__*/React.createElement("div", {
|
|
29
|
+
className: cx('ais-RefinementList-searchBox', classNames.searchBox)
|
|
30
|
+
}, searchBox), noResults ? /*#__PURE__*/React.createElement("div", {
|
|
31
|
+
className: cx('ais-RefinementList-noResults', classNames.noResults)
|
|
32
|
+
}, noResults) : /*#__PURE__*/React.createElement("ul", {
|
|
33
|
+
className: cx('ais-RefinementList-list', classNames.list)
|
|
34
|
+
}, items.map(function (item) {
|
|
35
|
+
return /*#__PURE__*/React.createElement("li", {
|
|
36
|
+
key: item.value,
|
|
37
|
+
className: cx('ais-RefinementList-item', classNames.item, item.isRefined && cx('ais-RefinementList-item--selected', classNames.selectedItem))
|
|
38
|
+
}, /*#__PURE__*/React.createElement("label", {
|
|
39
|
+
className: cx('ais-RefinementList-label', classNames.label)
|
|
40
|
+
}, /*#__PURE__*/React.createElement("input", {
|
|
41
|
+
checked: item.isRefined,
|
|
42
|
+
className: cx('ais-RefinementList-checkbox', classNames.checkbox),
|
|
43
|
+
type: "checkbox",
|
|
44
|
+
value: item.value,
|
|
45
|
+
onChange: function onChange() {
|
|
46
|
+
onRefine(item);
|
|
47
|
+
}
|
|
48
|
+
}), /*#__PURE__*/React.createElement("span", {
|
|
49
|
+
className: cx('ais-RefinementList-labelText', classNames.labelText)
|
|
50
|
+
}, query.length > 0 ? /*#__PURE__*/React.createElement(Highlight, {
|
|
51
|
+
parts: [getHighlightedParts(unescape(item.highlighted || ''))]
|
|
52
|
+
}) : item.label), /*#__PURE__*/React.createElement("span", {
|
|
53
|
+
className: cx('ais-RefinementList-count', classNames.count)
|
|
54
|
+
}, item.count)));
|
|
55
|
+
})), showMore && /*#__PURE__*/React.createElement(ShowMoreButton, {
|
|
56
|
+
className: cx('ais-RefinementList-showMore', classNames.showMore, !canToggleShowMore && cx('ais-RefinementList-showMore--disabled', classNames.disabledShowMore)),
|
|
57
|
+
disabled: !canToggleShowMore,
|
|
58
|
+
onClick: onToggleShowMore,
|
|
59
|
+
isShowingMore: isShowingMore,
|
|
60
|
+
translations: translations
|
|
61
|
+
}));
|
|
62
|
+
}
|
|
@@ -0,0 +1,64 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
export type IconProps = {
|
|
3
|
+
classNames: Partial<SearchBoxClassNames>;
|
|
4
|
+
};
|
|
5
|
+
export type SearchBoxClassNames = {
|
|
6
|
+
/**
|
|
7
|
+
* Class names to apply to the root element
|
|
8
|
+
*/
|
|
9
|
+
root: string;
|
|
10
|
+
/**
|
|
11
|
+
* Class names to apply to the form element
|
|
12
|
+
*/
|
|
13
|
+
form: string;
|
|
14
|
+
/**
|
|
15
|
+
* Class names to apply to the input element
|
|
16
|
+
*/
|
|
17
|
+
input: string;
|
|
18
|
+
/**
|
|
19
|
+
* Class names to apply to the submit button
|
|
20
|
+
*/
|
|
21
|
+
submit: string;
|
|
22
|
+
/**
|
|
23
|
+
* Class names to apply to the reset button
|
|
24
|
+
*/
|
|
25
|
+
reset: string;
|
|
26
|
+
/**
|
|
27
|
+
* Class names to apply to the loading indicator element
|
|
28
|
+
*/
|
|
29
|
+
loadingIndicator: string;
|
|
30
|
+
/**
|
|
31
|
+
* Class names to apply to the submit icon
|
|
32
|
+
*/
|
|
33
|
+
submitIcon: string;
|
|
34
|
+
/**
|
|
35
|
+
* Class names to apply to the reset icon
|
|
36
|
+
*/
|
|
37
|
+
resetIcon: string;
|
|
38
|
+
/**
|
|
39
|
+
* Class names to apply to the loading icon
|
|
40
|
+
*/
|
|
41
|
+
loadingIcon: string;
|
|
42
|
+
};
|
|
43
|
+
export type SearchBoxTranslations = {
|
|
44
|
+
/**
|
|
45
|
+
* The alternative text of the submit button.
|
|
46
|
+
*/
|
|
47
|
+
submitButtonTitle: string;
|
|
48
|
+
/**
|
|
49
|
+
* The alternative text of the reset button.
|
|
50
|
+
*/
|
|
51
|
+
resetButtonTitle: string;
|
|
52
|
+
};
|
|
53
|
+
export type SearchBoxProps = Omit<React.ComponentProps<'div'>, 'onSubmit' | 'onReset' | 'onChange'> & Pick<React.ComponentProps<'form'>, 'onSubmit'> & Required<Pick<React.ComponentProps<'form'>, 'onReset'>> & Pick<React.ComponentProps<'input'>, 'placeholder' | 'onChange' | 'autoFocus'> & {
|
|
54
|
+
formRef?: React.RefObject<HTMLFormElement>;
|
|
55
|
+
inputRef: React.RefObject<HTMLInputElement>;
|
|
56
|
+
isSearchStalled: boolean;
|
|
57
|
+
value: string;
|
|
58
|
+
resetIconComponent?: React.JSXElementConstructor<IconProps>;
|
|
59
|
+
submitIconComponent?: React.JSXElementConstructor<IconProps>;
|
|
60
|
+
loadingIconComponent?: React.JSXElementConstructor<IconProps>;
|
|
61
|
+
classNames?: Partial<SearchBoxClassNames>;
|
|
62
|
+
translations: SearchBoxTranslations;
|
|
63
|
+
};
|
|
64
|
+
export declare function SearchBox({ formRef, inputRef, isSearchStalled, onChange, onReset, onSubmit, placeholder, value, autoFocus, resetIconComponent: ResetIcon, submitIconComponent: SubmitIcon, loadingIconComponent: LoadingIcon, classNames, translations, ...props }: SearchBoxProps): JSX.Element;
|