ublo-lib 1.38.45 → 1.39.1

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 (58) hide show
  1. package/es/common/components/gesco-contact-form/gesco-contact-form.d.ts +1 -2
  2. package/es/common/components/gesco-contact-form/gesco-contact-form.d.ts.map +1 -1
  3. package/es/common/components/gesco-contact-form/gesco-contact-form.js +7 -7
  4. package/es/market-place/components/instant-search/google-results.d.ts +9 -0
  5. package/es/market-place/components/instant-search/google-results.d.ts.map +1 -0
  6. package/es/market-place/components/instant-search/google-results.js +24 -0
  7. package/es/market-place/components/instant-search/google-results.module.css +109 -0
  8. package/es/market-place/components/instant-search/hooks/use-constant.d.ts +2 -0
  9. package/es/market-place/components/instant-search/hooks/use-constant.d.ts.map +1 -0
  10. package/es/market-place/components/instant-search/hooks/use-constant.js +8 -0
  11. package/es/market-place/components/instant-search/hooks/use-debounced-search.d.ts +7 -0
  12. package/es/market-place/components/instant-search/hooks/use-debounced-search.d.ts.map +1 -0
  13. package/es/market-place/components/instant-search/hooks/use-debounced-search.js +11 -0
  14. package/es/market-place/components/instant-search/hooks/use-google-search.d.ts +7 -0
  15. package/es/market-place/components/instant-search/hooks/use-google-search.d.ts.map +1 -0
  16. package/es/market-place/components/instant-search/hooks/use-google-search.js +7 -0
  17. package/es/market-place/components/instant-search/hooks/use-search.d.ts +17 -0
  18. package/es/market-place/components/instant-search/hooks/use-search.d.ts.map +1 -0
  19. package/es/market-place/components/instant-search/hooks/use-search.js +10 -0
  20. package/es/market-place/components/instant-search/i18n.json +67 -0
  21. package/es/market-place/components/instant-search/images/lodging-placeholder.png +0 -0
  22. package/es/market-place/components/instant-search/images/page-placeholder.png +0 -0
  23. package/es/market-place/components/instant-search/index.d.ts +3 -0
  24. package/es/market-place/components/instant-search/index.d.ts.map +1 -0
  25. package/es/market-place/components/instant-search/index.js +2 -0
  26. package/es/market-place/components/instant-search/instant-search.d.ts +14 -0
  27. package/es/market-place/components/instant-search/instant-search.d.ts.map +1 -0
  28. package/es/market-place/components/instant-search/instant-search.js +66 -0
  29. package/es/market-place/components/instant-search/instant-search.module.css +16 -0
  30. package/es/market-place/components/instant-search/links.d.ts +11 -0
  31. package/es/market-place/components/instant-search/links.d.ts.map +1 -0
  32. package/es/market-place/components/instant-search/links.js +31 -0
  33. package/es/market-place/components/instant-search/links.module.css +97 -0
  34. package/es/market-place/components/instant-search/no-product.d.ts +6 -0
  35. package/es/market-place/components/instant-search/no-product.d.ts.map +1 -0
  36. package/es/market-place/components/instant-search/no-product.js +4 -0
  37. package/es/market-place/components/instant-search/products.d.ts +13 -0
  38. package/es/market-place/components/instant-search/products.d.ts.map +1 -0
  39. package/es/market-place/components/instant-search/products.js +54 -0
  40. package/es/market-place/components/instant-search/products.module.css +169 -0
  41. package/es/market-place/components/instant-search/results.d.ts +20 -0
  42. package/es/market-place/components/instant-search/results.d.ts.map +1 -0
  43. package/es/market-place/components/instant-search/results.js +47 -0
  44. package/es/market-place/components/instant-search/results.module.css +95 -0
  45. package/es/market-place/components/instant-search/search-input.d.ts +15 -0
  46. package/es/market-place/components/instant-search/search-input.d.ts.map +1 -0
  47. package/es/market-place/components/instant-search/search-input.js +56 -0
  48. package/es/market-place/components/instant-search/search-input.module.css +87 -0
  49. package/es/market-place/components/instant-search/services/api.d.ts +17 -0
  50. package/es/market-place/components/instant-search/services/api.d.ts.map +1 -0
  51. package/es/market-place/components/instant-search/services/api.js +24 -0
  52. package/es/market-place/components/instant-search/services/messages.d.ts +2 -0
  53. package/es/market-place/components/instant-search/services/messages.d.ts.map +1 -0
  54. package/es/market-place/components/instant-search/services/messages.js +5 -0
  55. package/es/market-place/components/instant-search/services/utils.d.ts +4 -0
  56. package/es/market-place/components/instant-search/services/utils.d.ts.map +1 -0
  57. package/es/market-place/components/instant-search/services/utils.js +44 -0
  58. package/package.json +2 -2
@@ -0,0 +1,6 @@
1
+ type Props = {
2
+ className?: string;
3
+ };
4
+ export default function NoProduct({ className }: Props): import("react/jsx-runtime").JSX.Element;
5
+ export {};
6
+ //# sourceMappingURL=no-product.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"no-product.d.ts","sourceRoot":"","sources":["../../../../src/market-place/components/instant-search/no-product.tsx"],"names":[],"mappings":"AAAA,KAAK,KAAK,GAAG;IACX,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAAE,SAAS,EAAE,EAAE,KAAK,2CA2FrD"}
@@ -0,0 +1,4 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ export default function NoProduct({ className }) {
3
+ return (_jsxs("svg", { width: "200", height: "200", viewBox: "0 0 200 200", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className, children: [_jsx("path", { d: "M100.5 184.3a85.8 85.8 0 1 0 0-171.5 85.8 85.8 0 0 0 0 171.5Z", fill: "#EDEDED" }), _jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M100.5 11a87.5 87.5 0 1 0 0 175 87.5 87.5 0 0 0 0-175Zm0 3.5a84 84 0 1 1 0 168 84 84 0 0 1 0-168Z", fill: "#D7D7D7" }), _jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M161.4 61.5c1 0 1.8-.8 1.8-1.8V46.1a4.7 4.7 0 0 0-4.7-4.7H26a4.7 4.7 0 0 0-4.7 4.7v34.3c0 1 .8 1.8 1.8 1.8h61.5c.4 0 .8-.1 1.1-.4l26.4-20.3h49.3Z", fill: "#D7D7D7" }), _jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M138.4 59.7h-25.5L84.6 80.4H45.3V25.7a3 3 0 0 1 2.9-2.9h64.7l25.5 27.5v9.4Z", fill: "#fff" }), _jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M112.9 21H48.2a4.7 4.7 0 0 0-4.7 4.7v54.7c0 1 .8 1.8 1.8 1.8h39.3c.4 0 .8-.1 1-.3l27.8-20.4h25c1 0 1.8-.8 1.8-1.8V50l-.1-.3-.2-.3v-.2l-.2-.1L114 21.6l-.1-.2-.4-.2h-.1l-.3-.1H113Zm-1.8 3.6H48.2c-.6 0-1.2.5-1.2 1.1v53h37l27.8-20.4c.3-.2.7-.3 1-.3h23.8v-6H113c-1 0-1.8-.8-1.8-1.7V24.6Zm-51 44.8h25.7a1.8 1.8 0 0 0 0-3.5H60.2a1.8 1.8 0 0 0 0 3.5Zm0-16h22a1.8 1.8 0 0 0 0-3.5H60a1.8 1.8 0 0 0 0 3.5Zm0-8.4h37.4a1.8 1.8 0 0 0 0-3.6H60.2a1.8 1.8 0 0 0 0 3.6Z", fill: "#D7D7D7" }), _jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M4.8 84a3 3 0 0 1 2.9-3.6h76.5a3 3 0 0 0 1.7-.5l26.4-19.6a3 3 0 0 1 1.8-.6h64.7a3 3 0 0 1 3 3.5c-2.9 16-14.4 83-16.8 96.7a3 3 0 0 1-2.9 2.4H25.4a3 3 0 0 1-2.9-2.2L4.8 84Z", fill: "#EDEDED" }), _jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "m3.1 84.4 17.7 76a4.7 4.7 0 0 0 4.6 3.7h136.7c2.3 0 4.2-1.7 4.6-4l16.7-96.6a4.7 4.7 0 0 0-4.6-5.5h-64.7c-1 0-2 .3-2.8.9a1130716.6 1130716.6 0 0 1-27.1 19.8H7.7a4.7 4.7 0 0 0-4.6 5.7Zm3.5-.8a1.2 1.2 0 0 1 1.1-1.4h76.5c1 0 2-.3 2.8-1a724489.6 724489.6 0 0 1 27-19.7h64.8a1.2 1.2 0 0 1 1.2 1.4l-16.7 96.7c-.1.6-.6 1-1.2 1H25.4c-.5 0-1-.4-1.1-1l-17.7-76Z", fill: "#D7D7D7" }), _jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M159.7 161a36.5 36.5 0 0 1-46.5-4 36.6 36.6 0 0 1 .4-51.8 36.6 36.6 0 0 1 51.7-.4 36.5 36.5 0 0 1 4 46.5l25 24.9c2.6 2.6 2.6 7 0 9.6a6.8 6.8 0 0 1-9.7 0l-25-24.9Z", fill: "#fff" }), _jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "m159.5 163.2 23.8 23.9a8.6 8.6 0 0 0 12.2 0 8.6 8.6 0 0 0 0-12.2L171.6 151a38.2 38.2 0 0 0-5-47.4 38.3 38.3 0 0 0-54.2.4 38.3 38.3 0 0 0-.4 54.2 38.2 38.2 0 0 0 47.5 5Zm1.4-3.5c-.6-.6-1.5-.7-2.2-.2a34.7 34.7 0 0 1-44.2-3.8 34.8 34.8 0 0 1 .4-49.2 34.8 34.8 0 0 1 49.2-.4c12 11.9 13.1 30.5 3.8 44.2-.5.7-.4 1.6.2 2.2l24.9 25c2 1.9 2 5.1 0 7a5 5 0 0 1-7.2 0L161 159.8Z", fill: "#D7D7D7" }), _jsx("path", { d: "M163.5 130.8a24.4 24.4 0 0 0-24.2-24.6c-13.4 0-24.3 11-24.3 24.6a24.4 24.4 0 0 0 24.3 24.6c13.3 0 24.2-11 24.2-24.6Z", fill: "#EDEDED" }), _jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M113.3 130.8a26.2 26.2 0 0 0 26 26.4c14.3 0 26-11.8 26-26.4a26.2 26.2 0 0 0-26-26.4c-14.4 0-26 11.8-26 26.4Zm3.5 0c0-12.6 10-22.8 22.5-22.8a22.7 22.7 0 0 1 22.4 22.8c0 12.6-10 22.9-22.4 22.9a22.7 22.7 0 0 1-22.5-22.9Z", fill: "#D7D7D7" }), _jsx("path", { opacity: ".7", fillRule: "evenodd", clipRule: "evenodd", d: "M117 121c.7-1.4 13.9 1.6 22.3 9.9 8.1 8 11.4 21.4 10.2 22-9.1 4.3-20.2 2.7-27.6-4.7-7.4-7.3-9-18.3-4.8-27.3Z", fill: "#fff" }), _jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M120.9 112.5a26.2 26.2 0 0 0-.3 37 26.2 26.2 0 0 0 37-.2 26.2 26.2 0 0 0 .3-37 26.2 26.2 0 0 0-37 .2Zm2.5 2.5c9-9 23.3-9 32-.3a22.7 22.7 0 0 1-.2 32c-9 9-23.3 9.1-32 .3a22.7 22.7 0 0 1 .2-32Z", fill: "#D7D7D7" }), _jsx("path", { d: "M140.2 142.1c1.4 0 2.4 1 2.4 2.4 0 1.3-1 2.3-2.4 2.3-1.3 0-2.3-1-2.3-2.3 0-1.3 1-2.4 2.3-2.4Zm.1-20.5V117a9.5 9.5 0 0 0-9.4 6.8v.2l4.5 1v.1l-4.6-1.1c-.3 1.2.5 2.5 1.8 2.8 1.2.3 2.5-.5 2.8-1.7l.2-.5.7-1.2c.7-.8 1.8-1.7 4-1.7Zm9.4 5.1a9.3 9.3 0 0 0-9.4-9.8v4.7c.6 0 1.8.2 2.9 1 .9.6 1.8 1.7 1.8 4.1 0 .5-.2 1-.7 1.6-.5.6-1.3 1.2-2.2 1.7a18.4 18.4 0 0 1-3.4 1.5h-.3c-1.2.4-2 1.8-1.6 3 .4 1.3 1.7 2 3 1.6l-.7-2.2-.4-1.4-.2-.6V131.6l.6 2.3.6 2.2h.2a11.6 11.6 0 0 0 1.3-.5c.9-.3 2-.8 3.2-1.5 1.2-.6 2.4-1.5 3.4-2.7a7 7 0 0 0 2-4.7Z", fill: "#D7D7D7" })] }));
4
+ }
@@ -0,0 +1,13 @@
1
+ import * as React from "react";
2
+ type Props = {
3
+ lang: string;
4
+ products: Hit[];
5
+ weekNumber: number | null;
6
+ loading: boolean;
7
+ sendPlausibleGoal: (path: string) => void;
8
+ otherResultsRef: React.RefObject<HTMLDivElement>;
9
+ isOtherResultsEmpty: boolean;
10
+ };
11
+ export default function Products({ lang, products, weekNumber, loading, sendPlausibleGoal, otherResultsRef, isOtherResultsEmpty, }: Props): import("react/jsx-runtime").JSX.Element;
12
+ export {};
13
+ //# sourceMappingURL=products.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"products.d.ts","sourceRoot":"","sources":["../../../../src/market-place/components/instant-search/products.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAc/B,KAAK,KAAK,GAAG;IACX,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,GAAG,EAAE,CAAC;IAChB,UAAU,EAAE,MAAM,GAAG,IAAI,CAAC;IAC1B,OAAO,EAAE,OAAO,CAAC;IAEjB,iBAAiB,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,eAAe,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;IACjD,mBAAmB,EAAE,OAAO,CAAC;CAC9B,CAAC;AASF,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,EAC/B,IAAI,EACJ,QAAQ,EACR,UAAU,EACV,OAAO,EACP,iBAAiB,EACjB,eAAe,EACf,mBAAmB,GACpB,EAAE,KAAK,2CAoIP"}
@@ -0,0 +1,54 @@
1
+ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
2
+ import Image from "next/image";
3
+ import Link from "ublo/link";
4
+ import Loader from "dt-design-system/es/loader";
5
+ import Button from "dt-design-system/es/button";
6
+ import * as Icons from "dt-design-system/es/icons";
7
+ import * as Ripple from "dt-design-system/es/ripple";
8
+ import * as Utils from "./services/utils";
9
+ import message from "./services/messages";
10
+ import NoProduct from "./no-product";
11
+ import pagePlaceholder from "./images/page-placeholder.png";
12
+ import lodgingPlaceholder from "./images/lodging-placeholder.png";
13
+ import css from "./products.module.css";
14
+ const PLACEHOLDERS = [...new Array(5)];
15
+ export default function Products({ lang, products, weekNumber, loading, sendPlausibleGoal, otherResultsRef, isOtherResultsEmpty, }) {
16
+ const filteredProducts = Utils.filterProducts(products, weekNumber);
17
+ const noProduct = !loading && !filteredProducts.length;
18
+ const scrollToOtherResults = () => {
19
+ if (otherResultsRef.current) {
20
+ otherResultsRef.current.scrollIntoView({
21
+ behavior: "smooth",
22
+ block: "start",
23
+ });
24
+ }
25
+ };
26
+ const createRipple = (e) => {
27
+ Ripple.create(e);
28
+ };
29
+ return (_jsxs(_Fragment, { children: [noProduct && (_jsxs("div", { className: css.noProduct, children: [_jsx(NoProduct, { className: css.noProductIcon }), message(lang, "noProducts")] })), loading &&
30
+ PLACEHOLDERS.map((_, i) => {
31
+ return (_jsx("div", { className: css.loaderContainer, children: _jsx(Loader, { className: css.loader, variant: "overlay" }) }, i));
32
+ }), !loading &&
33
+ filteredProducts.map((product) => {
34
+ const { id, title, subtitle, parentTitle, image = "", imagePlaceholder, price, time, text, path, target, type, } = product.document;
35
+ const decodedPath = decodeURIComponent(target || path);
36
+ const productTitle = Utils.getHighlight("title", product.highlight) || title;
37
+ const productSubTitle = Utils.getHighlight("subtitle", product.highlight) || subtitle;
38
+ const productTime = Utils.getHighlight("time", product.highlight) || time;
39
+ const productText = Utils.getHighlight("text", product.highlight) || text;
40
+ const showPrice = price !== undefined;
41
+ const imagePlaceholderStategy = imagePlaceholder ? "blur" : "empty";
42
+ const showImage = Boolean(image);
43
+ return (_jsxs(Link, { className: css.product, href: decodedPath, onClick: sendPlausibleGoal(decodedPath), onMouseDown: createRipple, children: [showImage ? (_jsx(Image, { className: css.productImage, src: image, alt: title, width: 220, height: 180, placeholder: imagePlaceholderStategy, blurDataURL: imagePlaceholder })) : (_jsx(Placeholder, { lang: lang, type: type })), _jsxs("div", { className: css.productContent, children: [parentTitle && (_jsx("div", { className: css.productParent, dangerouslySetInnerHTML: { __html: parentTitle } })), _jsx("div", { className: css.productTitle, dangerouslySetInnerHTML: { __html: productTitle } }), _jsx("div", { className: css.productSubtitle, dangerouslySetInnerHTML: { __html: productSubTitle } }), _jsx("div", { className: css.productTime, dangerouslySetInnerHTML: { __html: productTime } }), _jsx("div", { className: css.productText, dangerouslySetInnerHTML: { __html: productText } }), showPrice && (_jsx("div", { className: css.productPrice, dangerouslySetInnerHTML: { __html: price } }))] })] }, id));
44
+ }), !noProduct && !isOtherResultsEmpty && (_jsx("div", { className: css.otherProducts, children: _jsxs(Button, { className: css.otherProductsButton, onClick: scrollToOtherResults, children: [message(lang, "showOtherResults"), _jsx(Icons.ArrowDown, {})] }) }))] }));
45
+ }
46
+ function Placeholder({ type }) {
47
+ const icons = {
48
+ lodging: "Home",
49
+ page: "File",
50
+ };
51
+ const Icon = Icons[icons[type]];
52
+ const image = type === "lodging" ? lodgingPlaceholder : pagePlaceholder;
53
+ return (_jsxs("div", { className: css.placeholder, children: [_jsx(Image, { className: css.productImage, src: image, width: 220, height: 180, alt: "placeholder" }), _jsx(Icon, { className: css.icon })] }));
54
+ }
@@ -0,0 +1,169 @@
1
+ .noProduct {
2
+ grid-column: 1 / -1;
3
+ display: flex;
4
+ flex-direction: column;
5
+ align-items: center;
6
+ justify-content: center;
7
+ gap: 18px;
8
+ color: var(--ds-grey-500, #484848);
9
+ text-align: center;
10
+ font-size: 17px;
11
+ }
12
+
13
+ .noProductIcon {
14
+ flex: 0 0 140px;
15
+ width: 140px;
16
+ height: 140px;
17
+ }
18
+
19
+ .loaderContainer {
20
+ position: relative;
21
+ width: 100%;
22
+ height: 290px;
23
+ border-radius: var(--ds-radius-100, 6px);
24
+ }
25
+
26
+ .loader {
27
+ background: linear-gradient(
28
+ -45deg,
29
+ var(--ds-grey-300, #d4d4d4),
30
+ var(--ds-grey-400, #d2d2d2),
31
+ var(--ds-grey-200, #efefef),
32
+ var(--ds-grey-400, #d2d2d2)
33
+ );
34
+ background-size: 400% 400%;
35
+ background-position: 0% 50%;
36
+ }
37
+
38
+ .product {
39
+ position: relative;
40
+ display: flex;
41
+ flex-direction: column;
42
+ color: var(--ds-grey-500, #484848);
43
+ border-radius: var(--ds-radius-100, 6px);
44
+ background-color: var(--ds-grey-000, #fff);
45
+ }
46
+
47
+ .product mark {
48
+ position: relative;
49
+ display: inline-block;
50
+ font-weight: 700;
51
+ color: var(--ds-primary, var(--ds-blue-500, #002dcc));
52
+ background-color: transparent;
53
+ }
54
+
55
+ .product mark::before {
56
+ content: "";
57
+ position: absolute;
58
+ top: 0;
59
+ left: 0;
60
+ width: 100%;
61
+ height: 100%;
62
+ background-color: var(--ds-primary, var(--ds-blue-500, #002dcc));
63
+ border-radius: calc(var(--ds-radius-100, 6px) / 3);
64
+ opacity: 0.15;
65
+ }
66
+
67
+ .placeholder {
68
+ position: relative;
69
+ color: var(--ds-grey-000, #fff);
70
+ }
71
+
72
+ .placeholder,
73
+ .productImage {
74
+ width: 100%;
75
+ height: 180px;
76
+ object-fit: cover;
77
+ border-radius: var(--ds-radius-100, 6px) var(--ds-radius-100, 6px) 0 0;
78
+ }
79
+
80
+ .placeholder::after {
81
+ content: "";
82
+ position: absolute;
83
+ top: 0;
84
+ left: 0;
85
+ height: 100%;
86
+ width: 100%;
87
+ background-color: var(--ds-primary, var(--ds-blue-500, #002dcc));
88
+ opacity: 0.7;
89
+ pointer-events: none;
90
+ touch-action: none;
91
+ z-index: 1;
92
+ }
93
+
94
+ .icon {
95
+ position: absolute;
96
+ top: 50%;
97
+ left: 50%;
98
+ transform: translate(-50%, -50%);
99
+ width: 33px;
100
+ height: 33px;
101
+ fill: currentColor;
102
+ z-index: 2;
103
+ }
104
+
105
+ .productContent {
106
+ flex: 1 1 auto;
107
+ display: flex;
108
+ flex-direction: column;
109
+ gap: 6px;
110
+ padding: 8px;
111
+ }
112
+
113
+ .productParent {
114
+ text-transform: uppercase;
115
+ font-size: 10px;
116
+ }
117
+
118
+ .productPageTitle {
119
+ font-weight: 700;
120
+ font-size: 14px;
121
+ line-height: 1;
122
+ }
123
+
124
+ .productTitle {
125
+ font-weight: 700;
126
+ font-size: 16px;
127
+ line-height: 1;
128
+ }
129
+
130
+ .productSubtitle {
131
+ font-size: 14px;
132
+ line-height: 1;
133
+ }
134
+
135
+ .productText {
136
+ font-size: 11px;
137
+ }
138
+
139
+ .productPrice {
140
+ position: absolute;
141
+ top: 6px;
142
+ left: 6px;
143
+ padding: 4px;
144
+ color: var(--ds-grey-100, #f5f5f5);
145
+ background-color: var(--ds-secondary, var(--ds-blue-400, #4177f6));
146
+ font-weight: 700;
147
+ font-size: 12px;
148
+ border-radius: var(--ds-radius-100, 6px);
149
+ }
150
+
151
+ .productTime {
152
+ font-size: 8px;
153
+ text-transform: uppercase;
154
+ font-weight: 700;
155
+ }
156
+
157
+ .otherProducts {
158
+ grid-column: 1 / -1;
159
+ position: sticky;
160
+ bottom: 16px;
161
+ display: flex;
162
+ justify-content: center;
163
+ }
164
+
165
+ @media (min-width: 730px) {
166
+ .otherProducts {
167
+ display: none;
168
+ }
169
+ }
@@ -0,0 +1,20 @@
1
+ type Props = {
2
+ lang: string;
3
+ text: string;
4
+ results: {
5
+ facet_counts?: any[];
6
+ found?: number;
7
+ grouped_hits?: GroupedHit[];
8
+ out_of?: number;
9
+ page?: number;
10
+ request_params?: RequestParams;
11
+ search_cutoff?: boolean;
12
+ search_time_ms?: number;
13
+ };
14
+ weekNumber: number | null;
15
+ sendPlausibleGoal: (path: string) => void;
16
+ loading: boolean;
17
+ };
18
+ export default function Results({ lang, text, results, weekNumber, loading, sendPlausibleGoal, }: Props): import("react/jsx-runtime").JSX.Element;
19
+ export {};
20
+ //# sourceMappingURL=results.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"results.d.ts","sourceRoot":"","sources":["../../../../src/market-place/components/instant-search/results.tsx"],"names":[],"mappings":"AAQA,KAAK,KAAK,GAAG;IACX,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE;QACP,YAAY,CAAC,EAAE,GAAG,EAAE,CAAC;QACrB,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,YAAY,CAAC,EAAE,UAAU,EAAE,CAAC;QAC5B,MAAM,CAAC,EAAE,MAAM,CAAC;QAChB,IAAI,CAAC,EAAE,MAAM,CAAC;QACd,cAAc,CAAC,EAAE,aAAa,CAAC;QAC/B,aAAa,CAAC,EAAE,OAAO,CAAC;QACxB,cAAc,CAAC,EAAE,MAAM,CAAC;KACzB,CAAC;IACF,UAAU,EAAE,MAAM,GAAG,IAAI,CAAC;IAE1B,iBAAiB,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,OAAO,EAAE,OAAO,CAAC;CAClB,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,OAAO,CAAC,EAC9B,IAAI,EACJ,IAAI,EACJ,OAAO,EACP,UAAU,EACV,OAAO,EACP,iBAAiB,GAClB,EAAE,KAAK,2CA0GP"}
@@ -0,0 +1,47 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import * as React from "react";
3
+ import Links from "./links";
4
+ import OTLinks from "./google-results";
5
+ import Products from "./products";
6
+ import useGoogleSearch from "./hooks/use-google-search";
7
+ import message from "./services/messages";
8
+ import css from "./results.module.css";
9
+ export default function Results({ lang, text, results, weekNumber, loading, sendPlausibleGoal, }) {
10
+ const ref = React.useRef(null);
11
+ const { setText: setGoogleText, search: googleSearch } = useGoogleSearch(lang);
12
+ const { grouped_hits: groupedHits = [] } = results || {};
13
+ const flattenedHits = groupedHits.reduce((acc, group) => {
14
+ return [...acc, ...group.hits];
15
+ }, []);
16
+ const sortedHits = flattenedHits.reduce((acc, hit) => {
17
+ const { type } = hit.document;
18
+ return { ...acc, [type]: [...acc[type], hit] };
19
+ }, { page: [], product: [], information: [], faq: [], lodging: [] });
20
+ React.useEffect(() => {
21
+ const runEffect = () => {
22
+ if (sortedHits.product.length < 4) {
23
+ setGoogleText(text);
24
+ }
25
+ else {
26
+ setGoogleText("");
27
+ }
28
+ };
29
+ runEffect();
30
+ }, [text, sortedHits, setGoogleText]);
31
+ const { page: pages, product: products, information, faq: faqs, lodging: lodgings, } = sortedHits;
32
+ const filteredFaqs = faqs.reduce((acc, faq) => {
33
+ const isAlreadyInAcc = acc.some((item) => {
34
+ const hasSameTitle = item.document.title === faq.document.title;
35
+ const hasSameParentTitle = item.document.parentTitle === faq.document.parentTitle;
36
+ return hasSameTitle && hasSameParentTitle;
37
+ });
38
+ if (isAlreadyInAcc)
39
+ return acc;
40
+ return [...acc, faq];
41
+ }, []);
42
+ const isOtherResultsEmpty = !(pages.length ||
43
+ filteredFaqs.length ||
44
+ information.length);
45
+ const allProducts = [...products, ...pages, ...lodgings];
46
+ return (_jsx("div", { className: css.results, children: (loading || text.length > 0) && (_jsxs("div", { className: css.inner, children: [_jsxs("div", { ref: ref, className: css.left, children: [_jsx(Links, { linksTitle: message(lang, "faqs"), icon: "Question", links: filteredFaqs, loading: loading, sendPlausibleGoal: sendPlausibleGoal }), _jsx(OTLinks, { links: googleSearch.result, loading: googleSearch.loading, sendPlausibleGoal: sendPlausibleGoal }), _jsx(Links, { linksTitle: message(lang, "information"), icon: "Info", links: information, loading: loading, sendPlausibleGoal: sendPlausibleGoal, pageTitleAsTitle: true })] }), _jsx("div", { className: css.right, children: _jsx(Products, { lang: lang, products: allProducts, weekNumber: weekNumber, loading: loading, sendPlausibleGoal: sendPlausibleGoal, otherResultsRef: ref, isOtherResultsEmpty: isOtherResultsEmpty }) })] })) }));
47
+ }
@@ -0,0 +1,95 @@
1
+ .results {
2
+ width: calc(100% - 20px);
3
+ height: 600px;
4
+ max-height: 70vh;
5
+ display: flex;
6
+ flex-direction: column;
7
+ margin: 0 10px 10px 10px;
8
+ padding: 10px;
9
+ }
10
+
11
+ .results:not(:empty) {
12
+ padding: 0;
13
+ background-color: var(--ds-grey-000, #fff);
14
+ border-radius: var(--ds-radius-100, 6px);
15
+ box-shadow: var(--ds-shadow-200, 0 5px 10px rgba(0, 0, 0, 0.12));
16
+ }
17
+
18
+ .inner {
19
+ width: 100%;
20
+ height: 100%;
21
+ display: flex;
22
+ flex-direction: column;
23
+ border-radius: var(--ds-radius-100, 6px);
24
+ overflow: auto;
25
+ overscroll-behavior: contain;
26
+ -webkit-overflow-scrolling: touch;
27
+ }
28
+
29
+ @media (min-width: 730px) {
30
+ .inner {
31
+ flex-direction: row;
32
+ overflow: visible;
33
+ }
34
+ }
35
+
36
+ .left {
37
+ display: flex;
38
+ flex-direction: column;
39
+ gap: 10px;
40
+ padding: 16px;
41
+ order: 1;
42
+ }
43
+
44
+ .left:empty {
45
+ display: none;
46
+ }
47
+
48
+ @media (min-width: 730px) {
49
+ .left {
50
+ flex: 0 0 330px;
51
+ order: 0;
52
+ overflow: auto;
53
+ overscroll-behavior: contain;
54
+ -webkit-overflow-scrolling: touch;
55
+ }
56
+ }
57
+
58
+ .right {
59
+ position: relative;
60
+ flex: 1 1 auto;
61
+ display: grid;
62
+ grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
63
+ align-content: flex-start;
64
+ background-color: var(--ds-grey-100, #f5f5f5);
65
+ border-radius: var(--ds-radius-100, 6px) var(--ds-radius-100, 6px) 0 0;
66
+ gap: 16px;
67
+ padding: 16px;
68
+ }
69
+
70
+ @media (min-width: 730px) {
71
+ .right {
72
+ border-radius: 0 var(--ds-radius-100, 6px) var(--ds-radius-100, 6px) 0;
73
+ overflow: auto;
74
+ overscroll-behavior: contain;
75
+ -webkit-overflow-scrolling: touch;
76
+ }
77
+ }
78
+
79
+ .resultsWithWeekTitle,
80
+ .resultsWithoutWeekTitle {
81
+ --ds-button-text-transform: none;
82
+
83
+ grid-column: 1 / -1;
84
+ display: flex;
85
+ align-items: center;
86
+ justify-content: center;
87
+ flex-wrap: wrap;
88
+ gap: 10px;
89
+ padding: 12px 8px;
90
+ text-align: center;
91
+ font-size: 15px;
92
+ background-color: var(--ds-grey-000, #fff);
93
+ border-radius: var(--ds-radius-100, 6px);
94
+ z-index: 1;
95
+ }
@@ -0,0 +1,15 @@
1
+ type Suggestions = {
2
+ fr?: string[];
3
+ en?: string[];
4
+ };
5
+ type Props = {
6
+ lang: string;
7
+ text: string;
8
+ setText: (value: string) => void;
9
+ loading: boolean;
10
+ closeSearch: () => void;
11
+ suggestions?: Suggestions;
12
+ };
13
+ export default function SearchInput({ lang, text, setText, closeSearch, loading, suggestions, }: Props): import("react/jsx-runtime").JSX.Element;
14
+ export {};
15
+ //# sourceMappingURL=search-input.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"search-input.d.ts","sourceRoot":"","sources":["../../../../src/market-place/components/instant-search/search-input.tsx"],"names":[],"mappings":"AASA,KAAK,WAAW,GAAG;IACjB,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC;IACd,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC;CACf,CAAC;AAEF,KAAK,KAAK,GAAG;IACX,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IAEb,OAAO,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,OAAO,EAAE,OAAO,CAAC;IACjB,WAAW,EAAE,MAAM,IAAI,CAAC;IACxB,WAAW,CAAC,EAAE,WAAW,CAAC;CAC3B,CAAC;AAIF,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAClC,IAAI,EACJ,IAAI,EACJ,OAAO,EACP,WAAW,EACX,OAAO,EACP,WAAW,GACZ,EAAE,KAAK,2CAkFP"}
@@ -0,0 +1,56 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import * as React from "react";
3
+ import classNames from "classnames";
4
+ import Input from "dt-design-system/es/input";
5
+ import Button from "dt-design-system/es/button";
6
+ import * as Icons from "dt-design-system/es/icons";
7
+ import * as Ripple from "dt-design-system/es/ripple";
8
+ import message from "./services/messages";
9
+ import css from "./search-input.module.css";
10
+ const TRANSITION_DURATION = 1800;
11
+ export default function SearchInput({ lang, text, setText, closeSearch, loading, suggestions, }) {
12
+ const [currentSuggestion, setCurrentSuggestion] = React.useState(0);
13
+ const updateText = (value) => () => {
14
+ setText(value);
15
+ };
16
+ const classes = classNames(css.input, {
17
+ [css.inputLoading]: loading,
18
+ });
19
+ const inputIcon = loading ? "Loader2" : "Search";
20
+ const suggestionsSet = getSuggestions(suggestions)[lang];
21
+ const enableSuggestion = Boolean(suggestionsSet);
22
+ const createRipple = (e) => {
23
+ Ripple.create(e);
24
+ };
25
+ React.useEffect(() => {
26
+ if (enableSuggestion && !text) {
27
+ const interval = setInterval(() => {
28
+ setCurrentSuggestion((current) => {
29
+ const nextSuggestion = current >= suggestionsSet.length - 1 ? 0 : current + 1;
30
+ return nextSuggestion;
31
+ });
32
+ }, TRANSITION_DURATION);
33
+ return () => {
34
+ clearInterval(interval);
35
+ };
36
+ }
37
+ }, [enableSuggestion, suggestionsSet, text]);
38
+ return (_jsxs("div", { className: css.container, children: [_jsx(Input, { value: text, onValueChange: setText, icon: inputIcon, className: classes }), enableSuggestion && !text && (_jsxs("div", { className: css.suggestion, children: [message(lang, "try"), _jsx("div", { className: css.buttons, children: suggestionsSet.map((suggestion, i) => {
39
+ const isCurrent = i === currentSuggestion;
40
+ const isPrev = currentSuggestion === 0
41
+ ? i === suggestionsSet.length - 1
42
+ : i === currentSuggestion - 1;
43
+ const classes = classNames(css.button, {
44
+ [css.buttonCurrent]: isCurrent,
45
+ [css.buttonPrev]: isPrev,
46
+ });
47
+ return (_jsxs("button", { className: classes, onClick: updateText(suggestion), onMouseDown: createRipple, children: ["\u00AB ", suggestion, " \u00BB"] }, suggestion));
48
+ }) })] })), _jsx(Button, { variant: "transparent", className: css.close, onClick: () => closeSearch(), children: _jsx(Icons.Cross, {}) })] }));
49
+ }
50
+ function getSuggestions(suggestions = {}) {
51
+ return {
52
+ fr: ["cours de ski", "cours privés", "compétition", "cours débutants"],
53
+ en: ["ski lessons", "private lessons", "competition"],
54
+ ...suggestions,
55
+ };
56
+ }
@@ -0,0 +1,87 @@
1
+ .container {
2
+ position: relative;
3
+ padding: 10px;
4
+ }
5
+
6
+ .input {
7
+ --ds-input-padding: 14px;
8
+ --ds-input-background: var(--ds-grey-000, #fff);
9
+
10
+ width: 100%;
11
+ border-radius: var(--ds-radius-200, 10px);
12
+ box-shadow: var(--ds-shadow-200, 0 5px 10px rgba(0, 0, 0, 0.12));
13
+ }
14
+
15
+ .inputLoading svg {
16
+ animation: search-loader-spinning 1280ms
17
+ var(--ds-transition-easing, cubic-bezier(0.4, 0.1, 0.2, 0.9)) infinite;
18
+ }
19
+
20
+ @keyframes search-loader-spinning {
21
+ 100% {
22
+ transform: rotate(1turn);
23
+ }
24
+ }
25
+
26
+ .suggestion {
27
+ position: absolute;
28
+ top: 50%;
29
+ left: 54px;
30
+ height: 21px;
31
+ display: flex;
32
+ align-items: center;
33
+ line-height: 1;
34
+ color: var(--ds-grey-600, #484848);
35
+ transform: translateY(-50%);
36
+ pointer-events: none;
37
+ }
38
+
39
+ .buttons {
40
+ position: relative;
41
+ height: inherit;
42
+ color: inherit;
43
+ }
44
+
45
+ .button {
46
+ position: absolute;
47
+ top: 0;
48
+ left: 0;
49
+ width: max-content;
50
+ height: 100%;
51
+ padding: 2px 5px 4px 5px;
52
+ color: inherit;
53
+ line-height: 1;
54
+ font-weight: 700;
55
+ cursor: pointer;
56
+ pointer-events: auto;
57
+ border-radius: var(--ds-radius-100, 6px);
58
+ transform: translateY(100%);
59
+ opacity: 0;
60
+ pointer-events: none;
61
+ transition: background-color 160ms
62
+ var(--ds-transition-easing, cubic-bezier(0.4, 0.1, 0.2, 0.9)),
63
+ opacity 320ms var(--ds-transition-easing, cubic-bezier(0.4, 0.1, 0.2, 0.9)),
64
+ transform 320ms
65
+ var(--ds-transition-easing, cubic-bezier(0.4, 0.1, 0.2, 0.9));
66
+ }
67
+
68
+ .buttonPrev {
69
+ transform: translateY(-100%);
70
+ }
71
+
72
+ .buttonCurrent {
73
+ opacity: 1;
74
+ transform: none;
75
+ pointer-events: auto;
76
+ }
77
+
78
+ .button:is(:hover, :focus) {
79
+ background-color: var(--ds-grey-100, #f5f5f5);
80
+ }
81
+
82
+ button.close {
83
+ position: absolute;
84
+ top: 17px;
85
+ right: 14px;
86
+ color: inherit;
87
+ }
@@ -0,0 +1,17 @@
1
+ export declare function fetchResults(site: string, lang: string, query: string, groupLimit?: number, queryBy?: string, queryByWeights?: string, semantic?: boolean): Promise<any>;
2
+ export type GoogleSearchResult = {
3
+ htmlTitle: string;
4
+ link: string;
5
+ displayLink: string;
6
+ htmlSnippet: string;
7
+ pagemap?: {
8
+ cse_image: {
9
+ src: string;
10
+ }[];
11
+ cse_thumbnail: {
12
+ src: string;
13
+ }[];
14
+ };
15
+ };
16
+ export declare function fetchOTResults(query: string, lang: string): Promise<GoogleSearchResult[]>;
17
+ //# sourceMappingURL=api.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"api.d.ts","sourceRoot":"","sources":["../../../../../src/market-place/components/instant-search/services/api.ts"],"names":[],"mappings":"AAMA,wBAAgB,YAAY,CAC1B,IAAI,EAAE,MAAM,EACZ,IAAI,EAAE,MAAM,EACZ,KAAK,EAAE,MAAM,EACb,UAAU,GAAE,MAAU,EACtB,OAAO,GAAE,MAAgE,EACzE,cAAc,CAAC,EAAE,MAAM,EACvB,QAAQ,CAAC,EAAE,OAAO,gBAmBnB;AAED,MAAM,MAAM,kBAAkB,GAAG;IAC/B,SAAS,EAAE,MAAM,CAAC;IAClB,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,EAAE,MAAM,CAAC;IACpB,WAAW,EAAE,MAAM,CAAC;IACpB,OAAO,CAAC,EAAE;QACR,SAAS,EAAE;YACT,GAAG,EAAE,MAAM,CAAC;SACb,EAAE,CAAC;QACJ,aAAa,EAAE;YACb,GAAG,EAAE,MAAM,CAAC;SACb,EAAE,CAAC;KACL,CAAC;CACH,CAAC;AAEF,wBAAsB,cAAc,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,iCAM/D"}
@@ -0,0 +1,24 @@
1
+ import getConfig from "next/config";
2
+ import * as Fetcher from "../../../../future/utils/fetcher";
3
+ const { publicRuntimeConfig } = getConfig();
4
+ const { searchApi: api, googleSites } = publicRuntimeConfig;
5
+ export function fetchResults(site, lang, query, groupLimit = 8, queryBy = "title,text,pageTitle,seoKeywords,parentTitle,seoTitle", queryByWeights, semantic) {
6
+ const endpoint = `${api}/ublo-search/search/market-place${semantic ? "/semantic" : ""}`;
7
+ return Fetcher.post(endpoint, {
8
+ q: query,
9
+ query_by: queryBy + (semantic ? ",embedding" : ""),
10
+ query_by_weights: semantic ? undefined : queryByWeights,
11
+ vector_query: semantic
12
+ ? "embedding:([], distance_threshold:0.50, alpha: 0.8)"
13
+ : undefined,
14
+ group_limit: groupLimit,
15
+ per_page: 30,
16
+ }, { site, lang });
17
+ }
18
+ export async function fetchOTResults(query, lang) {
19
+ const endpoint = `${api}/ublo-search/google-search`;
20
+ return Fetcher.get(endpoint, {
21
+ query,
22
+ siteSearch: googleSites[lang][0],
23
+ });
24
+ }
@@ -0,0 +1,2 @@
1
+ export default function message(lang: string, id: string): any;
2
+ //# sourceMappingURL=messages.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"messages.d.ts","sourceRoot":"","sources":["../../../../../src/market-place/components/instant-search/services/messages.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,OAAO,UAAU,OAAO,CAAC,IAAI,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,OAGvD"}
@@ -0,0 +1,5 @@
1
+ import locales from "../i18n.json";
2
+ export default function message(lang, id) {
3
+ const messages = locales[lang] || locales.en;
4
+ return messages[id] || `??${id}??`;
5
+ }
@@ -0,0 +1,4 @@
1
+ export declare function getHighlight(property: string, highlight: PurpleHighlight, withExtractQuotes?: boolean): any;
2
+ export declare function filterProducts(products: Hit[], weekNumber: number | null): Hit[];
3
+ export declare function sliceText(text: string): string;
4
+ //# sourceMappingURL=utils.d.ts.map