@searchspring/snap-preact-components 0.27.6 → 0.28.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.
Files changed (57) hide show
  1. package/dist/cjs/components/Molecules/Carousel/Carousel.d.ts.map +1 -1
  2. package/dist/cjs/components/Molecules/Carousel/Carousel.js +3 -1
  3. package/dist/cjs/components/Molecules/Result/Result.d.ts +3 -2
  4. package/dist/cjs/components/Molecules/Result/Result.d.ts.map +1 -1
  5. package/dist/cjs/components/Molecules/SearchInput/SearchInput.d.ts +11 -0
  6. package/dist/cjs/components/Molecules/SearchInput/SearchInput.d.ts.map +1 -0
  7. package/dist/cjs/components/Molecules/SearchInput/SearchInput.js +75 -0
  8. package/dist/cjs/components/Molecules/SearchInput/SearchInput.stories.d.ts +109 -0
  9. package/dist/cjs/components/Molecules/SearchInput/SearchInput.stories.d.ts.map +1 -0
  10. package/dist/cjs/components/Molecules/SearchInput/SearchInput.stories.js +70 -0
  11. package/dist/cjs/components/Molecules/SearchInput/index.d.ts +2 -0
  12. package/dist/cjs/components/Molecules/SearchInput/index.d.ts.map +1 -0
  13. package/dist/cjs/components/Molecules/SearchInput/index.js +17 -0
  14. package/dist/cjs/components/Organisms/Autocomplete/Autocomplete.js +6 -6
  15. package/dist/cjs/components/Organisms/Facet/Facet.d.ts +1 -0
  16. package/dist/cjs/components/Organisms/Facet/Facet.d.ts.map +1 -1
  17. package/dist/cjs/components/Organisms/Facet/Facet.js +24 -3
  18. package/dist/cjs/components/Organisms/Facet/Facet.stories.d.ts +15 -0
  19. package/dist/cjs/components/Organisms/Facet/Facet.stories.d.ts.map +1 -1
  20. package/dist/cjs/components/Organisms/Facet/Facet.stories.js +10 -0
  21. package/dist/cjs/components/Organisms/Recommendation/Recommendation.d.ts +3 -2
  22. package/dist/cjs/components/Organisms/Recommendation/Recommendation.d.ts.map +1 -1
  23. package/dist/cjs/components/Organisms/Recommendation/Recommendation.js +3 -1
  24. package/dist/cjs/components/Organisms/Results/Results.d.ts +3 -2
  25. package/dist/cjs/components/Organisms/Results/Results.d.ts.map +1 -1
  26. package/dist/cjs/types.d.ts +3 -9
  27. package/dist/cjs/types.d.ts.map +1 -1
  28. package/dist/cjs/types.js +1 -0
  29. package/dist/esm/components/Molecules/Carousel/Carousel.d.ts.map +1 -1
  30. package/dist/esm/components/Molecules/Carousel/Carousel.js +3 -1
  31. package/dist/esm/components/Molecules/Result/Result.d.ts +3 -2
  32. package/dist/esm/components/Molecules/Result/Result.d.ts.map +1 -1
  33. package/dist/esm/components/Molecules/SearchInput/SearchInput.d.ts +11 -0
  34. package/dist/esm/components/Molecules/SearchInput/SearchInput.d.ts.map +1 -0
  35. package/dist/esm/components/Molecules/SearchInput/SearchInput.js +65 -0
  36. package/dist/esm/components/Molecules/SearchInput/SearchInput.stories.d.ts +109 -0
  37. package/dist/esm/components/Molecules/SearchInput/SearchInput.stories.d.ts.map +1 -0
  38. package/dist/esm/components/Molecules/SearchInput/SearchInput.stories.js +58 -0
  39. package/dist/esm/components/Molecules/SearchInput/index.d.ts +2 -0
  40. package/dist/esm/components/Molecules/SearchInput/index.d.ts.map +1 -0
  41. package/dist/esm/components/Molecules/SearchInput/index.js +1 -0
  42. package/dist/esm/components/Organisms/Autocomplete/Autocomplete.js +3 -3
  43. package/dist/esm/components/Organisms/Facet/Facet.d.ts +1 -0
  44. package/dist/esm/components/Organisms/Facet/Facet.d.ts.map +1 -1
  45. package/dist/esm/components/Organisms/Facet/Facet.js +28 -1
  46. package/dist/esm/components/Organisms/Facet/Facet.stories.d.ts +15 -0
  47. package/dist/esm/components/Organisms/Facet/Facet.stories.d.ts.map +1 -1
  48. package/dist/esm/components/Organisms/Facet/Facet.stories.js +11 -0
  49. package/dist/esm/components/Organisms/Recommendation/Recommendation.d.ts +3 -2
  50. package/dist/esm/components/Organisms/Recommendation/Recommendation.d.ts.map +1 -1
  51. package/dist/esm/components/Organisms/Recommendation/Recommendation.js +3 -1
  52. package/dist/esm/components/Organisms/Results/Results.d.ts +3 -2
  53. package/dist/esm/components/Organisms/Results/Results.d.ts.map +1 -1
  54. package/dist/esm/types.d.ts +3 -9
  55. package/dist/esm/types.d.ts.map +1 -1
  56. package/dist/esm/types.js +1 -0
  57. package/package.json +27 -27
@@ -1 +1 @@
1
- {"version":3,"file":"Carousel.d.ts","sourceRoot":"","sources":["../../../../../src/components/Molecules/Carousel/Carousel.tsx"],"names":[],"mappings":";AAcA,OAAO,EAAE,cAAc,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AA8HlE,eAAO,MAAM,0BAA0B;;;;;;;;;;;;;;;;;;;;;;;;;;CA0BtC,CAAC;AAEF,eAAO,MAAM,kCAAkC;;;;;;CAM9C,CAAC;AAEF,eAAO,MAAM,QAAQ,gBAAyB,aAAa,KAAG,WAAW;;CA8IvE,CAAC;AAEH,MAAM,WAAW,aAAc,SAAQ,cAAc;IACpD,WAAW,CAAC,EAAE,gBAAgB,CAAC;IAC/B,UAAU,CAAC,EAAE,GAAG,CAAC,OAAO,GAAG,MAAM,CAAC;IAClC,UAAU,CAAC,EAAE,GAAG,CAAC,OAAO,GAAG,MAAM,CAAC;IAClC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,OAAO,CAAC,EAAE,CAAC,MAAM,KAAA,EAAE,CAAC,KAAA,KAAK,IAAI,CAAC;IAC9B,iBAAiB,CAAC,EAAE,CAAC,CAAC,KAAA,KAAK,IAAI,CAAC;IAChC,iBAAiB,CAAC,EAAE,CAAC,CAAC,KAAA,KAAK,IAAI,CAAC;IAChC,MAAM,CAAC,EAAE,CAAC,MAAM,KAAA,KAAK,IAAI,CAAC;IAC1B,QAAQ,CAAC,EAAE,GAAG,CAAC,OAAO,EAAE,CAAC;CACzB"}
1
+ {"version":3,"file":"Carousel.d.ts","sourceRoot":"","sources":["../../../../../src/components/Molecules/Carousel/Carousel.tsx"],"names":[],"mappings":";AAcA,OAAO,EAAE,cAAc,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AA8HlE,eAAO,MAAM,0BAA0B;;;;;;;;;;;;;;;;;;;;;;;;;;CA0BtC,CAAC;AAEF,eAAO,MAAM,kCAAkC;;;;;;CAM9C,CAAC;AAEF,eAAO,MAAM,QAAQ,gBAAyB,aAAa,KAAG,WAAW;;CAgJvE,CAAC;AAEH,MAAM,WAAW,aAAc,SAAQ,cAAc;IACpD,WAAW,CAAC,EAAE,gBAAgB,CAAC;IAC/B,UAAU,CAAC,EAAE,GAAG,CAAC,OAAO,GAAG,MAAM,CAAC;IAClC,UAAU,CAAC,EAAE,GAAG,CAAC,OAAO,GAAG,MAAM,CAAC;IAClC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,OAAO,CAAC,EAAE,CAAC,MAAM,KAAA,EAAE,CAAC,KAAA,KAAK,IAAI,CAAC;IAC9B,iBAAiB,CAAC,EAAE,CAAC,CAAC,KAAA,KAAK,IAAI,CAAC;IAChC,iBAAiB,CAAC,EAAE,CAAC,CAAC,KAAA,KAAK,IAAI,CAAC;IAChC,MAAM,CAAC,EAAE,CAAC,MAAM,KAAA,KAAK,IAAI,CAAC;IAC1B,QAAQ,CAAC,EAAE,GAAG,CAAC,OAAO,EAAE,CAAC;CACzB"}
@@ -220,7 +220,9 @@ exports.Carousel = (0, mobx_react_lite_1.observer)(function (properties) {
220
220
  var theme = __assign(__assign({}, globalTheme), properties.theme);
221
221
  var props = __assign(__assign(__assign({
222
222
  // default props
223
- breakpoints: properties.vertical ? exports.defaultVerticalCarouselBreakpoints : exports.defaultCarouselBreakpoints, pagination: false, loop: true, autoAdjustSlides: true }, (_a = globalTheme === null || globalTheme === void 0 ? void 0 : globalTheme.components) === null || _a === void 0 ? void 0 : _a.carousel), properties), (_c = (_b = properties.theme) === null || _b === void 0 ? void 0 : _b.components) === null || _c === void 0 ? void 0 : _c.carousel);
223
+ breakpoints: properties.vertical
224
+ ? JSON.parse(JSON.stringify(exports.defaultVerticalCarouselBreakpoints))
225
+ : JSON.parse(JSON.stringify(exports.defaultCarouselBreakpoints)), pagination: false, loop: true, autoAdjustSlides: true }, (_a = globalTheme === null || globalTheme === void 0 ? void 0 : globalTheme.components) === null || _a === void 0 ? void 0 : _a.carousel), properties), (_c = (_b = properties.theme) === null || _b === void 0 ? void 0 : _b.components) === null || _c === void 0 ? void 0 : _c.carousel);
224
226
  var displaySettings = (0, useDisplaySettings_1.useDisplaySettings)(props.breakpoints);
225
227
  if (displaySettings && Object.keys(displaySettings).length) {
226
228
  var theme_1 = (0, deepmerge_1.default)((props === null || props === void 0 ? void 0 : props.theme) || {}, (displaySettings === null || displaySettings === void 0 ? void 0 : displaySettings.theme) || {});
@@ -1,6 +1,7 @@
1
1
  /// <reference types="react" />
2
- import { ComponentProps, LayoutType, Result as ResultType } from '../../../types';
2
+ import { ComponentProps, LayoutType } from '../../../types';
3
3
  import type { SearchController, AutocompleteController, RecommendationController } from '@searchspring/snap-controller';
4
+ import type { Product } from '@searchspring/snap-store-mobx';
4
5
  export declare const Result: ((properties: ResultProps) => JSX.Element) & {
5
6
  displayName: string;
6
7
  };
@@ -9,7 +10,7 @@ interface TruncateTitleProps {
9
10
  append?: string;
10
11
  }
11
12
  export interface ResultProps extends ComponentProps {
12
- result: ResultType;
13
+ result: Product;
13
14
  hideBadge?: boolean;
14
15
  hideTitle?: boolean;
15
16
  hideImage?: boolean;
@@ -1 +1 @@
1
- {"version":3,"file":"Result.d.ts","sourceRoot":"","sources":["../../../../../src/components/Molecules/Result/Result.tsx"],"names":[],"mappings":";AAaA,OAAO,EAAE,cAAc,EAAE,UAAU,EAAU,MAAM,IAAI,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAC1F,OAAO,KAAK,EAAE,gBAAgB,EAAE,sBAAsB,EAAE,wBAAwB,EAAE,MAAM,+BAA+B,CAAC;AA4DxH,eAAO,MAAM,MAAM,gBAAyB,WAAW,KAAG,WAAW;;CA2HnE,CAAC;AAOH,UAAU,kBAAkB;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,WAAY,SAAQ,cAAc;IAClD,MAAM,EAAE,UAAU,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,UAAU,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IACzB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,aAAa,CAAC,EAAE,kBAAkB,CAAC;IACnC,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,EAAE,KAAK,CAAC,KAAK,IAAI,CAAC;IAClE,UAAU,CAAC,EAAE,gBAAgB,GAAG,sBAAsB,GAAG,wBAAwB,CAAC;CAClF"}
1
+ {"version":3,"file":"Result.d.ts","sourceRoot":"","sources":["../../../../../src/components/Molecules/Result/Result.tsx"],"names":[],"mappings":";AAaA,OAAO,EAAE,cAAc,EAAE,UAAU,EAAU,MAAM,gBAAgB,CAAC;AACpE,OAAO,KAAK,EAAE,gBAAgB,EAAE,sBAAsB,EAAE,wBAAwB,EAAE,MAAM,+BAA+B,CAAC;AACxH,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,+BAA+B,CAAC;AA4D7D,eAAO,MAAM,MAAM,gBAAyB,WAAW,KAAG,WAAW;;CA2HnE,CAAC;AAOH,UAAU,kBAAkB;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,WAAY,SAAQ,cAAc;IAClD,MAAM,EAAE,OAAO,CAAC;IAChB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,UAAU,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IACzB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,aAAa,CAAC,EAAE,kBAAkB,CAAC;IACnC,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,EAAE,KAAK,CAAC,KAAK,IAAI,CAAC;IAClE,UAAU,CAAC,EAAE,gBAAgB,GAAG,sBAAsB,GAAG,wBAAwB,CAAC;CAClF"}
@@ -0,0 +1,11 @@
1
+ /// <reference types="react" />
2
+ import { ComponentProps } from '../../../types';
3
+ export declare const SearchInput: ((properties: SearchInputProps) => JSX.Element) & {
4
+ displayName: string;
5
+ };
6
+ export interface SearchInputProps extends ComponentProps {
7
+ onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;
8
+ placeholder?: string;
9
+ hideIcon?: boolean;
10
+ }
11
+ //# sourceMappingURL=SearchInput.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"SearchInput.d.ts","sourceRoot":"","sources":["../../../../../src/components/Molecules/SearchInput/SearchInput.tsx"],"names":[],"mappings":";AAYA,OAAO,EAAE,cAAc,EAAoB,MAAM,gBAAgB,CAAC;AAwBlE,eAAO,MAAM,WAAW,gBAAyB,gBAAgB,KAAG,WAAW;;CAqD7E,CAAC;AAEH,MAAM,WAAW,gBAAiB,SAAQ,cAAc;IACvD,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IAC5D,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACnB"}
@@ -0,0 +1,75 @@
1
+ "use strict";
2
+ var __assign = (this && this.__assign) || function () {
3
+ __assign = Object.assign || function(t) {
4
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
5
+ s = arguments[i];
6
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
7
+ t[p] = s[p];
8
+ }
9
+ return t;
10
+ };
11
+ return __assign.apply(this, arguments);
12
+ };
13
+ var __importDefault = (this && this.__importDefault) || function (mod) {
14
+ return (mod && mod.__esModule) ? mod : { "default": mod };
15
+ };
16
+ Object.defineProperty(exports, "__esModule", { value: true });
17
+ exports.SearchInput = void 0;
18
+ var react_1 = require("@emotion/react");
19
+ var classnames_1 = __importDefault(require("classnames"));
20
+ var mobx_react_lite_1 = require("mobx-react-lite");
21
+ var Icon_1 = require("../../Atoms/Icon/Icon");
22
+ var utilities_1 = require("../../../utilities");
23
+ var providers_1 = require("../../../providers");
24
+ var CSS = {
25
+ searchInput: function (_a) {
26
+ var _b;
27
+ var theme = _a.theme, subProps = _a.subProps;
28
+ return (0, react_1.css)({
29
+ display: 'flex',
30
+ alignItems: 'center',
31
+ justifyContent: 'center',
32
+ border: "1px solid ".concat(((_b = theme.colors) === null || _b === void 0 ? void 0 : _b.primary) || '#ccc'),
33
+ '& .ss__icon': {
34
+ padding: '5px',
35
+ },
36
+ '& .ss__search-input__input': {
37
+ width: '100%',
38
+ outline: 'none',
39
+ border: '0',
40
+ boxSizing: 'border-box',
41
+ },
42
+ });
43
+ },
44
+ };
45
+ exports.SearchInput = (0, mobx_react_lite_1.observer)(function (properties) {
46
+ var _a, _b, _c, _d;
47
+ var globalTheme = (0, providers_1.useTheme)();
48
+ var theme = __assign(__assign({}, globalTheme), properties.theme);
49
+ var props = __assign(__assign(__assign({
50
+ // default props
51
+ placeholder: 'Search', hideIcon: false }, (_a = globalTheme === null || globalTheme === void 0 ? void 0 : globalTheme.components) === null || _a === void 0 ? void 0 : _a.searchInput), properties), (_c = (_b = properties.theme) === null || _b === void 0 ? void 0 : _b.components) === null || _c === void 0 ? void 0 : _c.searchInput);
52
+ var placeholder = props.placeholder, onChange = props.onChange, hideIcon = props.hideIcon, disableStyles = props.disableStyles, style = props.style, className = props.className;
53
+ var subProps = {
54
+ icon: __assign(__assign(__assign({
55
+ // default props
56
+ className: 'ss__search-input__icon' }, (_d = globalTheme === null || globalTheme === void 0 ? void 0 : globalTheme.components) === null || _d === void 0 ? void 0 : _d.icon), (0, utilities_1.defined)({
57
+ disableStyles: disableStyles,
58
+ })), {
59
+ // component theme overrides
60
+ theme: props.theme }),
61
+ };
62
+ var styling = {};
63
+ if (!disableStyles) {
64
+ styling.css = [CSS.searchInput({ theme: theme, subProps: subProps }), style];
65
+ }
66
+ else if (style) {
67
+ styling.css = [style];
68
+ }
69
+ return ((0, react_1.jsx)(providers_1.CacheProvider, null,
70
+ (0, react_1.jsx)("div", __assign({}, styling, { className: (0, classnames_1.default)('ss__search-input', className) }),
71
+ !hideIcon && (0, react_1.jsx)(Icon_1.Icon, __assign({}, subProps.icon, { icon: "search" })),
72
+ (0, react_1.jsx)("input", { type: "text", className: "ss__search-input__input", onChange: function (e) {
73
+ onChange && onChange(e);
74
+ }, placeholder: placeholder }))));
75
+ });
@@ -0,0 +1,109 @@
1
+ /// <reference types="react" />
2
+ import { h } from 'preact';
3
+ import { SearchInputProps } from './SearchInput';
4
+ declare const _default: {
5
+ title: string;
6
+ component: ((properties: SearchInputProps) => JSX.Element) & {
7
+ displayName: string;
8
+ };
9
+ parameters: {
10
+ docs: {
11
+ page: () => h.JSX.Element;
12
+ };
13
+ };
14
+ decorators: ((Story: any) => h.JSX.Element)[];
15
+ argTypes: {
16
+ className: {
17
+ description: string;
18
+ table: {
19
+ type: {
20
+ summary: string;
21
+ };
22
+ defaultValue: {
23
+ summary: string;
24
+ };
25
+ };
26
+ control: {
27
+ type: string;
28
+ };
29
+ };
30
+ disableStyles: {
31
+ defaultValue: boolean;
32
+ description: string;
33
+ table: {
34
+ type: {
35
+ summary: string;
36
+ };
37
+ defaultValue: {
38
+ summary: boolean;
39
+ };
40
+ };
41
+ control: {
42
+ type: string;
43
+ };
44
+ };
45
+ style: {
46
+ description: string;
47
+ table: {
48
+ type: {
49
+ summary: string;
50
+ };
51
+ };
52
+ control: {
53
+ type: string;
54
+ };
55
+ };
56
+ theme: {
57
+ description: string;
58
+ table: {
59
+ type: {
60
+ summary: string;
61
+ };
62
+ };
63
+ control: {
64
+ type: string;
65
+ };
66
+ };
67
+ onChange: {
68
+ description: string;
69
+ table: {
70
+ type: {
71
+ summary: string;
72
+ };
73
+ };
74
+ action: string;
75
+ };
76
+ hideIcon: {
77
+ description: string;
78
+ table: {
79
+ type: {
80
+ summary: string;
81
+ };
82
+ defaultValue: {
83
+ summary: boolean;
84
+ };
85
+ };
86
+ control: {
87
+ type: string;
88
+ };
89
+ };
90
+ placeholder: {
91
+ defaultValue: string;
92
+ description: string;
93
+ table: {
94
+ type: {
95
+ summary: string;
96
+ };
97
+ defaultValue: {
98
+ summary: string;
99
+ };
100
+ };
101
+ control: {
102
+ type: string;
103
+ };
104
+ };
105
+ };
106
+ };
107
+ export default _default;
108
+ export declare const Default: any;
109
+ //# sourceMappingURL=SearchInput.stories.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"SearchInput.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/Molecules/SearchInput/SearchInput.stories.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAY,CAAC,EAAE,MAAM,QAAQ,CAAC;AAIrC,OAAO,EAAe,gBAAgB,EAAE,MAAM,eAAe,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAK9D,wBA0DE;AAIF,eAAO,MAAM,OAAO,KAAoB,CAAC"}
@@ -0,0 +1,70 @@
1
+ "use strict";
2
+ var __assign = (this && this.__assign) || function () {
3
+ __assign = Object.assign || function(t) {
4
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
5
+ s = arguments[i];
6
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
7
+ t[p] = s[p];
8
+ }
9
+ return t;
10
+ };
11
+ return __assign.apply(this, arguments);
12
+ };
13
+ var __importDefault = (this && this.__importDefault) || function (mod) {
14
+ return (mod && mod.__esModule) ? mod : { "default": mod };
15
+ };
16
+ Object.defineProperty(exports, "__esModule", { value: true });
17
+ exports.Default = void 0;
18
+ var preact_1 = require("preact");
19
+ var blocks_1 = require("@storybook/addon-docs/blocks");
20
+ var SearchInput_1 = require("./SearchInput");
21
+ var utilities_1 = require("../../../utilities");
22
+ var readme_md_1 = __importDefault(require("./readme.md"));
23
+ exports.default = {
24
+ title: "Molecules/SearchInput",
25
+ component: SearchInput_1.SearchInput,
26
+ parameters: {
27
+ docs: {
28
+ page: function () { return ((0, preact_1.h)("div", null,
29
+ (0, preact_1.h)(readme_md_1.default, null),
30
+ (0, preact_1.h)(blocks_1.ArgsTable, { story: blocks_1.PRIMARY_STORY }))); },
31
+ },
32
+ },
33
+ decorators: [
34
+ function (Story) { return ((0, preact_1.h)("div", { style: {
35
+ maxWidth: '900px',
36
+ height: '300px',
37
+ } },
38
+ (0, preact_1.h)(Story, null))); },
39
+ ],
40
+ argTypes: __assign({ onChange: {
41
+ description: 'Onchange Callback',
42
+ table: {
43
+ type: {
44
+ summary: 'function',
45
+ },
46
+ },
47
+ action: 'onChange',
48
+ }, hideIcon: {
49
+ description: 'Hides icon',
50
+ table: {
51
+ type: {
52
+ summary: 'boolean',
53
+ },
54
+ defaultValue: { summary: false },
55
+ },
56
+ control: { type: 'boolean' },
57
+ }, placeholder: {
58
+ defaultValue: 'Search',
59
+ description: 'Display placeholder text',
60
+ table: {
61
+ type: {
62
+ summary: 'string',
63
+ },
64
+ defaultValue: { summary: 'Search' },
65
+ },
66
+ control: { type: 'text' },
67
+ } }, utilities_1.componentArgs),
68
+ };
69
+ var Template = function (args) { return (0, preact_1.h)(SearchInput_1.SearchInput, __assign({}, args)); };
70
+ exports.Default = Template.bind({});
@@ -0,0 +1,2 @@
1
+ export * from './SearchInput';
2
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Molecules/SearchInput/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC"}
@@ -0,0 +1,17 @@
1
+ "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __exportStar = (this && this.__exportStar) || function(m, exports) {
14
+ for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
15
+ };
16
+ Object.defineProperty(exports, "__esModule", { value: true });
17
+ __exportStar(require("./SearchInput"), exports);
@@ -137,7 +137,7 @@ var CSS = {
137
137
  },
138
138
  };
139
139
  exports.Autocomplete = (0, mobx_react_lite_1.observer)(function (properties) {
140
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
140
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
141
141
  var globalTheme = (0, providers_1.useTheme)();
142
142
  var props = __assign(__assign(__assign({
143
143
  // default props
@@ -246,7 +246,7 @@ exports.Autocomplete = (0, mobx_react_lite_1.observer)(function (properties) {
246
246
  // component theme overrides
247
247
  theme: props.theme }),
248
248
  };
249
- var _l = controller.store, search = _l.search, terms = _l.terms, trending = _l.trending, results = _l.results, merchandising = _l.merchandising, pagination = _l.pagination, loaded = _l.loaded, filters = _l.filters, facets = _l.facets, state = _l.state;
249
+ var _m = controller.store, search = _m.search, terms = _m.terms, trending = _m.trending, results = _m.results, merchandising = _m.merchandising, pagination = _m.pagination, loaded = _m.loaded, filters = _m.filters, facets = _m.facets, state = _m.state;
250
250
  // you can pass in a selector or the actual input element,
251
251
  // if its the selector, we need to bind it to the controller here.
252
252
  if (controller && typeof input == 'string') {
@@ -256,7 +256,7 @@ exports.Autocomplete = (0, mobx_react_lite_1.observer)(function (properties) {
256
256
  controller.bind();
257
257
  }, []);
258
258
  }
259
- var visible = Boolean(input === state.focusedInput) && (terms.length > 0 || (trending === null || trending === void 0 ? void 0 : trending.length) > 0);
259
+ var visible = Boolean(input === state.focusedInput) && (terms.length > 0 || (trending === null || trending === void 0 ? void 0 : trending.length) > 0 || state.input);
260
260
  var showTrending = !state.input && (trending === null || trending === void 0 ? void 0 : trending.length) && terms.length === 0;
261
261
  var facetsToShow = facets.length ? facets.filter(function (facet) { return facet.display !== types_1.FacetDisplay.SLIDER; }) : [];
262
262
  var onlyTerms = (trending === null || trending === void 0 ? void 0 : trending.length) && !loaded;
@@ -283,7 +283,7 @@ exports.Autocomplete = (0, mobx_react_lite_1.observer)(function (properties) {
283
283
  }
284
284
  return (visible && ((0, react_1.jsx)(providers_1.CacheProvider, null,
285
285
  (0, react_1.jsx)("div", __assign({}, styling, { className: (0, classnames_1.default)('ss__autocomplete', className, { 'ss__autocomplete--only-terms': onlyTerms }), onClick: function (e) { return e.stopPropagation(); } }),
286
- !hideTerms && ((0, react_1.jsx)("div", { className: (0, classnames_1.default)('ss__autocomplete__terms', { 'ss__autocomplete__terms-trending': showTrending }) }, termsSlot ? ((0, utilities_1.cloneWithProps)(termsSlot, { terms: terms, trending: trending, termsTitle: termsTitle, trendingTitle: trendingTitle, showTrending: showTrending, valueProps: valueProps, emIfy: emIfy, onTermClick: onTermClick, controller: controller })) : ((0, react_1.jsx)(preact_1.Fragment, null,
286
+ !hideTerms && (showTrending || terms.length > 0 || termsSlot) && ((0, react_1.jsx)("div", { className: (0, classnames_1.default)('ss__autocomplete__terms', { 'ss__autocomplete__terms-trending': showTrending }) }, termsSlot ? ((0, utilities_1.cloneWithProps)(termsSlot, { terms: terms, trending: trending, termsTitle: termsTitle, trendingTitle: trendingTitle, showTrending: showTrending, valueProps: valueProps, emIfy: emIfy, onTermClick: onTermClick, controller: controller })) : ((0, react_1.jsx)(preact_1.Fragment, null,
287
287
  terms.length > 0 ? ((0, react_1.jsx)(preact_1.Fragment, null,
288
288
  termsTitle ? ((0, react_1.jsx)("div", { className: "ss__autocomplete__title ss__autocomplete__title--terms" },
289
289
  (0, react_1.jsx)("h5", null, termsTitle))) : null,
@@ -316,11 +316,11 @@ exports.Autocomplete = (0, mobx_react_lite_1.observer)(function (properties) {
316
316
  (0, react_1.jsx)(Results_1.Results, __assign({ results: results }, subProps.results, { controller: controller })))))) : ((0, react_1.jsx)("div", { className: "ss__autocomplete__content__no-results" }, noResultsSlot ? ((0, preact_1.cloneElement)(noResultsSlot, { search: search, pagination: pagination, controller: controller })) : ((0, react_1.jsx)(preact_1.Fragment, null,
317
317
  (0, react_1.jsx)("p", null,
318
318
  "No results found for \"",
319
- search.query.string,
319
+ ((_k = search.originalQuery) === null || _k === void 0 ? void 0 : _k.string) || search.query.string,
320
320
  "\"."),
321
321
  (0, react_1.jsx)("p", null, "Please try another search."))))),
322
322
  !hideBanners ? (0, react_1.jsx)(Banner_1.Banner, __assign({}, subProps.banner, { content: merchandising.content, type: types_1.BannerType.FOOTER })) : null,
323
- !hideLink ? (linkSlot ? ((0, preact_1.cloneElement)(linkSlot, { search: search, results: results, pagination: pagination, filters: filters, controller: controller })) : ((_k = search === null || search === void 0 ? void 0 : search.query) === null || _k === void 0 ? void 0 : _k.string) && results.length > 0 ? ((0, react_1.jsx)("div", { className: "ss__autocomplete__content__info" },
323
+ !hideLink ? (linkSlot ? ((0, preact_1.cloneElement)(linkSlot, { search: search, results: results, pagination: pagination, filters: filters, controller: controller })) : ((_l = search === null || search === void 0 ? void 0 : search.query) === null || _l === void 0 ? void 0 : _l.string) && results.length > 0 ? ((0, react_1.jsx)("div", { className: "ss__autocomplete__content__info" },
324
324
  (0, react_1.jsx)("a", { href: state.url.href },
325
325
  "See ",
326
326
  pagination.totalResults,
@@ -24,6 +24,7 @@ interface OptionalFacetProps extends ComponentProps {
24
24
  iconOverflowMore?: string;
25
25
  iconOverflowLess?: string;
26
26
  fields?: FieldProps;
27
+ searchable?: boolean;
27
28
  }
28
29
  declare type FieldProps = {
29
30
  [variable: string]: FacetProps;
@@ -1 +1 @@
1
- {"version":3,"file":"Facet.d.ts","sourceRoot":"","sources":["../../../../../src/components/Organisms/Facet/Facet.tsx"],"names":[],"mappings":";AAYA,OAAO,EAAmB,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAE7D,OAAO,EAAE,cAAc,EAAgB,UAAU,EAAE,UAAU,EAAE,gBAAgB,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAmCnI,eAAO,MAAM,KAAK,gBAAyB,UAAU,KAAG,WAAW;;CA0OjE,CAAC;AAaH,MAAM,WAAW,UAAW,SAAQ,kBAAkB;IACrD,KAAK,EAAE,UAAU,GAAG,UAAU,GAAG,gBAAgB,GAAG,SAAS,GAAG,cAAc,CAAC;CAC/E;AAED,UAAU,kBAAmB,SAAQ,cAAc;IAClD,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,QAAQ,GAAG,MAAM,CAAC;IACjC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,QAAQ,GAAG,MAAM,CAAC;IAC/B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IAC3B,WAAW,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IAC1B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,UAAU,CAAC,EAAE,GAAG,CAAC;IACjB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,MAAM,CAAC,EAAE,UAAU,CAAC;CACpB;AAED,aAAK,UAAU,GAAG;IACjB,CAAC,QAAQ,EAAE,MAAM,GAAG,UAAU,CAAC;CAC/B,CAAC"}
1
+ {"version":3,"file":"Facet.d.ts","sourceRoot":"","sources":["../../../../../src/components/Organisms/Facet/Facet.tsx"],"names":[],"mappings":";AAaA,OAAO,EAAmB,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAE7D,OAAO,EAAE,cAAc,EAAgB,UAAU,EAAE,UAAU,EAAE,gBAAgB,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAsCnI,eAAO,MAAM,KAAK,gBAAyB,UAAU,KAAG,WAAW;;CAqQjE,CAAC;AAcH,MAAM,WAAW,UAAW,SAAQ,kBAAkB;IACrD,KAAK,EAAE,UAAU,GAAG,UAAU,GAAG,gBAAgB,GAAG,SAAS,GAAG,cAAc,CAAC;CAC/E;AAED,UAAU,kBAAmB,SAAQ,cAAc;IAClD,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,QAAQ,GAAG,MAAM,CAAC;IACjC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,QAAQ,GAAG,MAAM,CAAC;IAC/B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IAC3B,WAAW,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IAC1B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,UAAU,CAAC,EAAE,GAAG,CAAC;IACjB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,aAAK,UAAU,GAAG;IACjB,CAAC,QAAQ,EAAE,MAAM,GAAG,UAAU,CAAC;CAC/B,CAAC"}
@@ -25,6 +25,7 @@ var FacetGridOptions_1 = require("../../Molecules/FacetGridOptions");
25
25
  var FacetPaletteOptions_1 = require("../../Molecules/FacetPaletteOptions");
26
26
  var FacetHierarchyOptions_1 = require("../../Molecules/FacetHierarchyOptions");
27
27
  var FacetSlider_1 = require("../../Molecules/FacetSlider");
28
+ var SearchInput_1 = require("../../Molecules/SearchInput");
28
29
  var Icon_1 = require("../../Atoms/Icon");
29
30
  var Dropdown_1 = require("../../Atoms/Dropdown");
30
31
  var types_1 = require("../../../types");
@@ -60,21 +61,24 @@ var CSS = {
60
61
  marginRight: '8px',
61
62
  },
62
63
  },
64
+ '& .ss__search-input': {
65
+ margin: '16px 0 0 0',
66
+ },
63
67
  });
64
68
  },
65
69
  };
66
70
  exports.Facet = (0, mobx_react_lite_1.observer)(function (properties) {
67
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
71
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
68
72
  var globalTheme = (0, providers_1.useTheme)();
69
73
  var theme = __assign(__assign({}, globalTheme), properties.theme);
70
74
  var props = __assign(__assign(__assign({
71
75
  // default props
72
- limit: 12, disableOverflow: false, iconCollapse: 'angle-up', iconExpand: 'angle-down', showMoreText: 'Show More', showLessText: 'Show Less', iconOverflowMore: 'plus', iconOverflowLess: 'minus' }, (_a = globalTheme === null || globalTheme === void 0 ? void 0 : globalTheme.components) === null || _a === void 0 ? void 0 : _a.facet), properties), (_c = (_b = properties.theme) === null || _b === void 0 ? void 0 : _b.components) === null || _c === void 0 ? void 0 : _c.facet);
76
+ limit: 12, disableOverflow: false, iconCollapse: 'angle-up', iconExpand: 'angle-down', showMoreText: 'Show More', showLessText: 'Show Less', iconOverflowMore: 'plus', iconOverflowLess: 'minus', searchable: false }, (_a = globalTheme === null || globalTheme === void 0 ? void 0 : globalTheme.components) === null || _a === void 0 ? void 0 : _a.facet), properties), (_c = (_b = properties.theme) === null || _b === void 0 ? void 0 : _b.components) === null || _c === void 0 ? void 0 : _c.facet);
73
77
  //manual props override on a per facet level using the fields prop
74
78
  if (props.fields && props.fields[(_d = props.facet) === null || _d === void 0 ? void 0 : _d.field]) {
75
79
  props = __assign(__assign({}, props), props.fields[(_e = props.facet) === null || _e === void 0 ? void 0 : _e.field]);
76
80
  }
77
- var disableCollapse = props.disableCollapse, facet = props.facet, iconCollapse = props.iconCollapse, iconExpand = props.iconExpand, limit = props.limit, disableOverflow = props.disableOverflow, iconColor = props.iconColor, color = props.color, previewOnFocus = props.previewOnFocus, valueProps = props.valueProps, showMoreText = props.showMoreText, showLessText = props.showLessText, iconOverflowMore = props.iconOverflowMore, iconOverflowLess = props.iconOverflowLess, overflowSlot = props.overflowSlot, optionsSlot = props.optionsSlot, disableStyles = props.disableStyles, className = props.className, style = props.style;
81
+ var disableCollapse = props.disableCollapse, facet = props.facet, iconCollapse = props.iconCollapse, iconExpand = props.iconExpand, limit = props.limit, disableOverflow = props.disableOverflow, iconColor = props.iconColor, color = props.color, previewOnFocus = props.previewOnFocus, valueProps = props.valueProps, showMoreText = props.showMoreText, showLessText = props.showLessText, iconOverflowMore = props.iconOverflowMore, iconOverflowLess = props.iconOverflowLess, overflowSlot = props.overflowSlot, optionsSlot = props.optionsSlot, disableStyles = props.disableStyles, className = props.className, style = props.style, searchable = props.searchable;
78
82
  var subProps = {
79
83
  dropdown: __assign(__assign(__assign({
80
84
  // default props
@@ -140,6 +144,13 @@ exports.Facet = (0, mobx_react_lite_1.observer)(function (properties) {
140
144
  })), {
141
145
  // component theme overrides
142
146
  theme: props.theme }),
147
+ searchInput: __assign(__assign(__assign({
148
+ // default props
149
+ className: 'ss__facet__search-input' }, (_p = globalTheme === null || globalTheme === void 0 ? void 0 : globalTheme.components) === null || _p === void 0 ? void 0 : _p.searchInput), (0, utilities_1.defined)({
150
+ disableStyles: disableStyles,
151
+ })), {
152
+ // component theme overrides
153
+ theme: props.theme }),
143
154
  };
144
155
  var limitedValues;
145
156
  if ((facet === null || facet === void 0 ? void 0 : facet.overflow) && Number.isInteger(limit) && !disableOverflow) {
@@ -159,11 +170,21 @@ exports.Facet = (0, mobx_react_lite_1.observer)(function (properties) {
159
170
  else if (style) {
160
171
  styling.css = [style];
161
172
  }
173
+ // Search within facet
174
+ var searchableFacet = {
175
+ allowableTypes: ['list', 'grid', 'palette'],
176
+ searchFilter: function (e) {
177
+ if (facet === null || facet === void 0 ? void 0 : facet.search) {
178
+ facet.search.input = e.target.value;
179
+ }
180
+ },
181
+ };
162
182
  return (facet && ((0, react_1.jsx)(providers_1.CacheProvider, null,
163
183
  (0, react_1.jsx)("div", __assign({}, styling, { className: (0, classnames_1.default)('ss__facet', "ss__facet--".concat(facet.display), "ss__facet--".concat(facet.field), className) }),
164
184
  (0, react_1.jsx)(Dropdown_1.Dropdown, __assign({}, subProps.dropdown, { open: disableCollapse || !(facet === null || facet === void 0 ? void 0 : facet.collapsed), onClick: function (e) { return !disableCollapse && (facet === null || facet === void 0 ? void 0 : facet.toggleCollapse()); }, button: (0, react_1.jsx)("div", { className: "ss__facet__header" }, facet === null || facet === void 0 ? void 0 :
165
185
  facet.label,
166
186
  !disableCollapse && (0, react_1.jsx)(Icon_1.Icon, __assign({}, subProps.icon, { icon: (facet === null || facet === void 0 ? void 0 : facet.collapsed) ? iconExpand : iconCollapse }))) }),
187
+ searchable && searchableFacet.allowableTypes.includes(facet.display) && ((0, react_1.jsx)(SearchInput_1.SearchInput, __assign({}, subProps.searchInput, { onChange: searchableFacet.searchFilter, placeholder: "Search ".concat(facet.label) }))),
167
188
  (0, react_1.jsx)("div", { className: (0, classnames_1.default)('ss__facet__options', className) }, (function () {
168
189
  //manual options component
169
190
  if (optionsSlot) {
@@ -108,6 +108,21 @@ declare const _default: {
108
108
  type: string;
109
109
  };
110
110
  };
111
+ searchable: {
112
+ defaultValue: boolean;
113
+ description: string;
114
+ table: {
115
+ type: {
116
+ summary: string;
117
+ };
118
+ defaultValue: {
119
+ summary: boolean;
120
+ };
121
+ };
122
+ control: {
123
+ type: string;
124
+ };
125
+ };
111
126
  color: {
112
127
  description: string;
113
128
  table: {
@@ -1 +1 @@
1
- {"version":3,"file":"Facet.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/Organisms/Facet/Facet.stories.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,QAAQ,CAAC;AAK3B,OAAO,EAAS,UAAU,EAAE,MAAM,SAAS,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAO5C,wBA8LE;AAYF,eAAO,MAAM,IAAI,KAAwB,CAAC;AAkB1C,eAAO,MAAM,MAAM,KAA0B,CAAC;AAoB9C,eAAO,MAAM,OAAO,KAA2B,CAAC;AAiBhD,eAAO,MAAM,IAAI,KAAwB,CAAC;AAkB1C,eAAO,MAAM,SAAS,KAA6B,CAAC"}
1
+ {"version":3,"file":"Facet.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/Organisms/Facet/Facet.stories.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,QAAQ,CAAC;AAK3B,OAAO,EAAS,UAAU,EAAE,MAAM,SAAS,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAO5C,wBAyME;AAYF,eAAO,MAAM,IAAI,KAAwB,CAAC;AAkB1C,eAAO,MAAM,MAAM,KAA0B,CAAC;AAoB9C,eAAO,MAAM,OAAO,KAA2B,CAAC;AAiBhD,eAAO,MAAM,IAAI,KAAwB,CAAC;AAkB1C,eAAO,MAAM,SAAS,KAA6B,CAAC"}
@@ -112,6 +112,16 @@ exports.default = {
112
112
  defaultValue: { summary: false },
113
113
  },
114
114
  control: { type: 'boolean' },
115
+ }, searchable: {
116
+ defaultValue: false,
117
+ description: 'Enables facet search within functionality',
118
+ table: {
119
+ type: {
120
+ summary: 'boolean',
121
+ },
122
+ defaultValue: { summary: false },
123
+ },
124
+ control: { type: 'boolean' },
115
125
  }, color: {
116
126
  description: 'Select color',
117
127
  table: {
@@ -1,6 +1,7 @@
1
1
  /// <reference types="react" />
2
2
  import type { RecommendationController } from '@searchspring/snap-controller';
3
- import { ComponentProps, BreakpointsProps, Result as ResultType, InlineBannerContent } from '../../../types';
3
+ import type { ResultStore } from '@searchspring/snap-store-mobx';
4
+ import { ComponentProps, BreakpointsProps } from '../../../types';
4
5
  export declare const Recommendation: ((properties: RecommendationProps) => JSX.Element) & {
5
6
  displayName: string;
6
7
  };
@@ -11,7 +12,7 @@ export interface RecommendationProps extends ComponentProps {
11
12
  nextButton?: JSX.Element | string;
12
13
  hideButtons?: boolean;
13
14
  loop?: boolean;
14
- results?: ResultType[] | InlineBannerContent[];
15
+ results?: ResultStore;
15
16
  pagination?: boolean;
16
17
  controller: RecommendationController;
17
18
  children?: JSX.Element[];
@@ -1 +1 @@
1
- {"version":3,"file":"Recommendation.d.ts","sourceRoot":"","sources":["../../../../../src/components/Organisms/Recommendation/Recommendation.tsx"],"names":[],"mappings":";AAQA,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,+BAA+B,CAAC;AAM9E,OAAO,EAAE,cAAc,EAAE,gBAAgB,EAAE,MAAM,IAAI,UAAU,EAAE,mBAAmB,EAAE,MAAM,gBAAgB,CAAC;AAc7G,eAAO,MAAM,cAAc,gBAAyB,mBAAmB,KAAG,WAAW;;CAuKnF,CAAC;AAEH,MAAM,WAAW,mBAAoB,SAAQ,cAAc;IAC1D,KAAK,CAAC,EAAE,GAAG,CAAC,OAAO,GAAG,MAAM,CAAC;IAC7B,WAAW,CAAC,EAAE,gBAAgB,CAAC;IAC/B,UAAU,CAAC,EAAE,GAAG,CAAC,OAAO,GAAG,MAAM,CAAC;IAClC,UAAU,CAAC,EAAE,GAAG,CAAC,OAAO,GAAG,MAAM,CAAC;IAClC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,OAAO,CAAC,EAAE,UAAU,EAAE,GAAG,mBAAmB,EAAE,CAAC;IAC/C,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,EAAE,wBAAwB,CAAC;IACrC,QAAQ,CAAC,EAAE,GAAG,CAAC,OAAO,EAAE,CAAC;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACnB"}
1
+ {"version":3,"file":"Recommendation.d.ts","sourceRoot":"","sources":["../../../../../src/components/Organisms/Recommendation/Recommendation.tsx"],"names":[],"mappings":";AAQA,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,+BAA+B,CAAC;AAC9E,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,+BAA+B,CAAC;AAMjE,OAAO,EAAE,cAAc,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAclE,eAAO,MAAM,cAAc,gBAAyB,mBAAmB,KAAG,WAAW;;CAyKnF,CAAC;AAEH,MAAM,WAAW,mBAAoB,SAAQ,cAAc;IAC1D,KAAK,CAAC,EAAE,GAAG,CAAC,OAAO,GAAG,MAAM,CAAC;IAC7B,WAAW,CAAC,EAAE,gBAAgB,CAAC;IAC/B,UAAU,CAAC,EAAE,GAAG,CAAC,OAAO,GAAG,MAAM,CAAC;IAClC,UAAU,CAAC,EAAE,GAAG,CAAC,OAAO,GAAG,MAAM,CAAC;IAClC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,OAAO,CAAC,EAAE,WAAW,CAAC;IACtB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,EAAE,wBAAwB,CAAC;IACrC,QAAQ,CAAC,EAAE,GAAG,CAAC,OAAO,EAAE,CAAC;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACnB"}
@@ -53,7 +53,9 @@ exports.Recommendation = (0, mobx_react_lite_1.observer)(function (properties) {
53
53
  var globalTheme = (0, providers_1.useTheme)();
54
54
  var props = __assign(__assign(__assign({
55
55
  // default props
56
- breakpoints: properties.vertical ? Carousel_1.defaultVerticalCarouselBreakpoints : Carousel_1.defaultCarouselBreakpoints, pagination: false, loop: true }, (_a = globalTheme === null || globalTheme === void 0 ? void 0 : globalTheme.components) === null || _a === void 0 ? void 0 : _a.recommendation), properties), (_c = (_b = properties.theme) === null || _b === void 0 ? void 0 : _b.components) === null || _c === void 0 ? void 0 : _c.recommendation);
56
+ breakpoints: properties.vertical
57
+ ? JSON.parse(JSON.stringify(Carousel_1.defaultVerticalCarouselBreakpoints))
58
+ : JSON.parse(JSON.stringify(Carousel_1.defaultCarouselBreakpoints)), pagination: false, loop: true }, (_a = globalTheme === null || globalTheme === void 0 ? void 0 : globalTheme.components) === null || _a === void 0 ? void 0 : _a.recommendation), properties), (_c = (_b = properties.theme) === null || _b === void 0 ? void 0 : _b.components) === null || _c === void 0 ? void 0 : _c.recommendation);
57
59
  var displaySettings = (0, useDisplaySettings_1.useDisplaySettings)(props.breakpoints);
58
60
  if (displaySettings && Object.keys(displaySettings).length) {
59
61
  var theme = (0, deepmerge_1.default)((props === null || props === void 0 ? void 0 : props.theme) || {}, (displaySettings === null || displaySettings === void 0 ? void 0 : displaySettings.theme) || {});
@@ -1,10 +1,11 @@
1
1
  import type { SearchController, AutocompleteController, RecommendationController } from '@searchspring/snap-controller';
2
- import { ComponentProps, Result as ResultType, LayoutType, InlineBannerContent, BreakpointsProps } from '../../../types';
2
+ import type { ResultStore } from '@searchspring/snap-store-mobx';
3
+ import { ComponentProps, LayoutType, BreakpointsProps } from '../../../types';
3
4
  export declare const Results: ((properties: ResultsProp) => JSX.Element) & {
4
5
  displayName: string;
5
6
  };
6
7
  export interface ResultsProp extends ComponentProps {
7
- results?: ResultType[] | InlineBannerContent[];
8
+ results?: ResultStore;
8
9
  columns?: number;
9
10
  rows?: number;
10
11
  gapSize?: string;
@@ -1 +1 @@
1
- {"version":3,"file":"Results.d.ts","sourceRoot":"","sources":["../../../../../src/components/Organisms/Results/Results.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,gBAAgB,EAAE,sBAAsB,EAAE,wBAAwB,EAAE,MAAM,+BAA+B,CAAC;AAIxH,OAAO,EAAE,cAAc,EAAU,MAAM,IAAI,UAAU,EAAE,UAAU,EAAE,mBAAmB,EAAc,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAuC7I,eAAO,MAAM,OAAO,gBAAyB,WAAW,KAAG,WAAW;;CAmGpE,CAAC;AAEH,MAAM,WAAW,WAAY,SAAQ,cAAc;IAClD,OAAO,CAAC,EAAE,UAAU,EAAE,GAAG,mBAAmB,EAAE,CAAC;IAC/C,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,WAAW,CAAC,EAAE,gBAAgB,CAAC;IAC/B,UAAU,CAAC,EAAE,gBAAgB,GAAG,sBAAsB,GAAG,wBAAwB,CAAC;CAClF"}
1
+ {"version":3,"file":"Results.d.ts","sourceRoot":"","sources":["../../../../../src/components/Organisms/Results/Results.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,gBAAgB,EAAE,sBAAsB,EAAE,wBAAwB,EAAE,MAAM,+BAA+B,CAAC;AACxH,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,+BAA+B,CAAC;AAIjE,OAAO,EAAE,cAAc,EAAU,UAAU,EAAc,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAuClG,eAAO,MAAM,OAAO,gBAAyB,WAAW,KAAG,WAAW;;CAmGpE,CAAC;AAEH,MAAM,WAAW,WAAY,SAAQ,cAAc;IAClD,OAAO,CAAC,EAAE,WAAW,CAAC;IACtB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,WAAW,CAAC,EAAE,gBAAgB,CAAC;IAC/B,UAAU,CAAC,EAAE,gBAAgB,GAAG,sBAAsB,GAAG,wBAAwB,CAAC;CAClF"}
@@ -6,15 +6,6 @@ export interface ComponentProps extends RenderableProps<any> {
6
6
  style?: string | Record<string, string>;
7
7
  theme?: Theme;
8
8
  }
9
- export interface Result {
10
- id: string;
11
- mappings: Mappings;
12
- attributes: any;
13
- type?: string;
14
- track?: {
15
- click: (e?: any) => void;
16
- };
17
- }
18
9
  export declare enum BannerType {
19
10
  HEADER = "header",
20
11
  FOOTER = "footer",
@@ -140,6 +131,9 @@ export interface ValueFacet extends BaseFacet {
140
131
  limit: number;
141
132
  setLimit: (limit: number) => any;
142
133
  };
134
+ search?: {
135
+ input: string;
136
+ };
143
137
  }
144
138
  export interface HierarchyFacet extends BaseFacet {
145
139
  values: HierarchyFacetValue[];