ublo-lib 1.24.4 → 1.25.0

package/es/common/components/instant-search/links.js

@@ -1,30 +1,81 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
 import Link from "ublo/link";
 import Loader from "dt-design-system/es/loader";
 import * as Icons from "dt-design-system/es/icons";
 import * as Ripple from "dt-design-system/es/ripple";
 import * as Utils from "./services/utils";
 import css from "./links.module.css";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
 const PLACEHOLDERS = [...new Array(3)];
-export default function Links({ icon, linksTitle, links, pageTitleAsTitle, loading, sendPlausibleGoal, }) {
-    const Icon = Icons[icon];
-    const noResult = !loading && !links.length;
-    const createRipple = (e) => {
-        Ripple.create(e);
-    };
-    if (noResult)
-        return null;
-    return (_jsxs("div", { className: css.linksSection, children: [_jsx("div", { className: css.linksTitle, children: linksTitle }), _jsxs("div", { className: css.links, children: [loading &&
-                        PLACEHOLDERS.map((_, i) => {
-                            return (_jsx("div", { className: css.loaderContainer, children: _jsx(Loader, { className: css.loader, variant: "overlay" }) }, i));
-                        }), !loading &&
-                        links.map((link) => {
-                            const { id, text, parentTitle, path } = link.document;
-                            const decodedPath = decodeURIComponent(path);
-                            const titleProperty = pageTitleAsTitle ? "pageTitle" : "title";
-                            const linkTitle = Utils.getHighlight(titleProperty, link.highlight) ||
-                                link.document[titleProperty];
-                            const linkText = Utils.getHighlight("text", link.highlight, true) || text;
-                            return (_jsxs(Link, { href: decodedPath, className: css.link, onClick: sendPlausibleGoal(decodedPath), onMouseDown: createRipple, children: [_jsx(Icon, { className: css.linkIcon }), _jsxs("div", { className: css.linkContent, children: [parentTitle && (_jsx("div", { className: css.linkParent, dangerouslySetInnerHTML: { __html: parentTitle } })), _jsx("div", { className: css.linkTitle, dangerouslySetInnerHTML: { __html: linkTitle } }), linkText && (_jsx("div", { className: css.linkText, dangerouslySetInnerHTML: { __html: linkText } }))] })] }, id));
-                        })] })] }));
-}
+export default function Links({
+  icon,
+  linksTitle,
+  links,
+  pageTitleAsTitle,
+  loading,
+  sendPlausibleGoal
+}) {
+  const Icon = Icons[icon];
+  const noResult = !loading && !links.length;
+  const createRipple = e => {
+    Ripple.create(e);
+  };
+  if (noResult) return null;
+  return _jsxs("div", {
+    className: css.linksSection,
+    children: [_jsx("div", {
+      className: css.linksTitle,
+      children: linksTitle
+    }), _jsxs("div", {
+      className: css.links,
+      children: [loading && PLACEHOLDERS.map((_, i) => {
+        return _jsx("div", {
+          className: css.loaderContainer,
+          children: _jsx(Loader, {
+            className: css.loader,
+            variant: "overlay"
+          })
+        }, i);
+      }), !loading && links.map(link => {
+        const {
+          id,
+          text,
+          parentTitle,
+          path
+        } = link.document;
+        const decodedPath = decodeURIComponent(path);
+        const titleProperty = pageTitleAsTitle ? "pageTitle" : "title";
+        const linkTitle = Utils.getHighlight(titleProperty, link.highlight) || link.document[titleProperty];
+        const linkText = Utils.getHighlight("text", link.highlight, true) || text;
+        return _jsxs(Link, {
+          href: decodedPath,
+          className: css.link,
+          onClick: sendPlausibleGoal(decodedPath),
+          onMouseDown: createRipple,
+          children: [_jsx(Icon, {
+            className: css.linkIcon
+          }), _jsxs("div", {
+            className: css.linkContent,
+            children: [parentTitle && _jsx("div", {
+              className: css.linkParent,
+              dangerouslySetInnerHTML: {
+                __html: parentTitle
+              }
+            }), _jsx("div", {
+              className: css.linkTitle,
+              dangerouslySetInnerHTML: {
+                __html: linkTitle
+              }
+            }), linkText && _jsx("div", {
+              className: css.linkText,
+              dangerouslySetInnerHTML: {
+                __html: linkText
+              }
+            })]
+          })]
+        }, id);
+      })]
+    })]
+  });
+}

package/es/common/components/instant-search/no-product.js

@@ -1,4 +1,81 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-export default function NoProduct({ className }) {
-    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" })] }));
-}
+import * as React from "react";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+export default function NoProduct({
+  className
+}) {
+  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"
+    })]
+  });
+}

package/es/common/components/instant-search/products.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import * as React from "react";
 import Image from "next/image";
 import Link from "ublo/link";
 import Loader from "dt-design-system/es/loader";
@@ -9,34 +9,121 @@ import * as Utils from "./services/utils";
 import message from "./services/messages";
 import NoProduct from "./no-product";
 import css from "./products.module.css";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
 const PLACEHOLDERS = [...new Array(5)];
-export default function Products({ lang, products, weekNumber, loading, sendPlausibleGoal, otherResultsRef, isOtherResultsEmpty, }) {
-    const filteredProducts = Utils.filterProducts(products, weekNumber);
-    const noProduct = !loading && !filteredProducts.length;
-    const scrollToOtherResults = () => {
-        if (otherResultsRef.current) {
-            otherResultsRef.current.scrollIntoView({
-                behavior: "smooth",
-                block: "start",
-            });
-        }
-    };
-    const createRipple = (e) => {
-        Ripple.create(e);
-    };
-    return (_jsxs(_Fragment, { children: [noProduct && (_jsxs("div", { className: css.noProduct, children: [_jsx(NoProduct, { className: css.noProductIcon }), message(lang, "noProducts")] })), loading &&
-                PLACEHOLDERS.map((_, i) => {
-                    return (_jsx("div", { className: css.loaderContainer, children: _jsx(Loader, { className: css.loader, variant: "overlay" }) }, i));
-                }), !loading &&
-                filteredProducts.map((product) => {
-                    const { id, pageTitle, title, parentTitle, image = "", imagePlaceholder, price, time, text, path, } = product.document;
-                    const decodedPath = decodeURIComponent(path);
-                    const productPageTitle = Utils.getHighlight("pageTitle", product.highlight) || pageTitle;
-                    const productTitle = Utils.getHighlight("title", product.highlight) || title;
-                    const productTime = Utils.getHighlight("time", product.highlight) || time;
-                    const productText = Utils.getHighlight("text", product.highlight) || text;
-                    const showPrice = price !== undefined && weekNumber !== null;
-                    const imagePlaceholderStategy = imagePlaceholder ? "blur" : "empty";
-                    return (_jsxs(Link, { className: css.product, href: decodedPath, onClick: sendPlausibleGoal(decodedPath), onMouseDown: createRipple, children: [_jsx(Image, { className: css.productImage, src: image, alt: title, width: 220, height: 180, placeholder: imagePlaceholderStategy, blurDataURL: imagePlaceholder }), _jsxs("div", { className: css.productContent, children: [parentTitle && (_jsx("div", { className: css.productParent, dangerouslySetInnerHTML: { __html: parentTitle } })), _jsx("div", { className: css.productPageTitle, dangerouslySetInnerHTML: { __html: productPageTitle } }), _jsx("div", { className: css.productTitle, dangerouslySetInnerHTML: { __html: productTitle } }), _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));
-                }), !noProduct && !isOtherResultsEmpty && (_jsx("div", { className: css.otherProducts, children: _jsxs(Button, { className: css.otherProductsButton, onClick: scrollToOtherResults, children: [message(lang, "showOtherResults"), _jsx(Icons.ArrowDown, {})] }) }))] }));
-}
+export default function Products({
+  lang,
+  products,
+  weekNumber,
+  loading,
+  sendPlausibleGoal,
+  otherResultsRef,
+  isOtherResultsEmpty
+}) {
+  const filteredProducts = Utils.filterProducts(products, weekNumber);
+  const noProduct = !loading && !filteredProducts.length;
+  const scrollToOtherResults = () => {
+    if (otherResultsRef.current) {
+      otherResultsRef.current.scrollIntoView({
+        behavior: "smooth",
+        block: "start"
+      });
+    }
+  };
+  const createRipple = e => {
+    Ripple.create(e);
+  };
+  return _jsxs(_Fragment, {
+    children: [noProduct && _jsxs("div", {
+      className: css.noProduct,
+      children: [_jsx(NoProduct, {
+        className: css.noProductIcon
+      }), message(lang, "noProducts")]
+    }), loading && PLACEHOLDERS.map((_, i) => {
+      return _jsx("div", {
+        className: css.loaderContainer,
+        children: _jsx(Loader, {
+          className: css.loader,
+          variant: "overlay"
+        })
+      }, i);
+    }), !loading && filteredProducts.map(product => {
+      const {
+        id,
+        pageTitle,
+        title,
+        parentTitle,
+        image = "",
+        imagePlaceholder,
+        price,
+        time,
+        text,
+        path
+      } = product.document;
+      const decodedPath = decodeURIComponent(path);
+      const productPageTitle = Utils.getHighlight("pageTitle", product.highlight) || pageTitle;
+      const productTitle = Utils.getHighlight("title", product.highlight) || title;
+      const productTime = Utils.getHighlight("time", product.highlight) || time;
+      const productText = Utils.getHighlight("text", product.highlight) || text;
+      const showPrice = price !== undefined && weekNumber !== null;
+      const imagePlaceholderStategy = imagePlaceholder ? "blur" : "empty";
+      return _jsxs(Link, {
+        className: css.product,
+        href: decodedPath,
+        onClick: sendPlausibleGoal(decodedPath),
+        onMouseDown: createRipple,
+        children: [_jsx(Image, {
+          className: css.productImage,
+          src: image,
+          alt: title,
+          width: 220,
+          height: 180,
+          placeholder: imagePlaceholderStategy,
+          blurDataURL: imagePlaceholder
+        }), _jsxs("div", {
+          className: css.productContent,
+          children: [parentTitle && _jsx("div", {
+            className: css.productParent,
+            dangerouslySetInnerHTML: {
+              __html: parentTitle
+            }
+          }), _jsx("div", {
+            className: css.productPageTitle,
+            dangerouslySetInnerHTML: {
+              __html: productPageTitle
+            }
+          }), _jsx("div", {
+            className: css.productTitle,
+            dangerouslySetInnerHTML: {
+              __html: productTitle
+            }
+          }), _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);
+    }), !noProduct && !isOtherResultsEmpty && _jsx("div", {
+      className: css.otherProducts,
+      children: _jsxs(Button, {
+        className: css.otherProductsButton,
+        onClick: scrollToOtherResults,
+        children: [message(lang, "showOtherResults"), _jsx(Icons.ArrowDown, {})]
+      })
+    })]
+  });
+}

package/es/common/components/instant-search/results.js

@@ -1,4 +1,3 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import * as React from "react";
 import getConfig from "next/config";
 import Button from "dt-design-system/es/button";
@@ -8,34 +7,124 @@ import Products from "./products";
 import * as Dates from "./services/dates";
 import message from "./services/messages";
 import css from "./results.module.css";
-const { publicRuntimeConfig } = getConfig();
-const { season } = publicRuntimeConfig;
-export default function Results({ lang, text, results, weekNumber, openPeriodPicker, loading, sendPlausibleGoal, }) {
-    const ref = React.useRef(null);
-    const { grouped_hits: groupedHits = [] } = results || {};
-    const flattenedHits = groupedHits.reduce((acc, group) => {
-        return [...acc, ...group.hits];
-    }, []);
-    const sortedHits = flattenedHits.reduce((acc, hit) => {
-        const { type } = hit.document;
-        return { ...acc, [type]: [...acc[type], hit] };
-    }, { page: [], product: [], information: [], faq: [], instructor: [] });
-    const { page: pages, product: products, information, faq: faqs, instructor: instructors, } = sortedHits;
-    const filteredFaqs = faqs.reduce((acc, faq) => {
-        const isAlreadyInAcc = acc.some((item) => {
-            const hasSameTitle = item.document.title === faq.document.title;
-            const hasSameParentTitle = item.document.parentTitle === faq.document.parentTitle;
-            return hasSameTitle && hasSameParentTitle;
-        });
-        if (isAlreadyInAcc)
-            return acc;
-        return [...acc, faq];
-    }, []);
-    const weekSystemEnabled = Boolean(season);
-    const showProductsTitle = weekNumber !== null;
-    const isOtherResultsEmpty = !(pages.length ||
-        instructors.length ||
-        filteredFaqs.length ||
-        information.length);
-    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, "pages"), icon: "FileText", links: pages, loading: loading, sendPlausibleGoal: sendPlausibleGoal }), _jsx(Links, { linksTitle: message(lang, "instructors"), icon: "User", links: instructors, loading: loading, sendPlausibleGoal: sendPlausibleGoal }), _jsx(Links, { linksTitle: message(lang, "faqs"), icon: "Question", links: filteredFaqs, loading: loading, sendPlausibleGoal: sendPlausibleGoal }), _jsx(Links, { linksTitle: message(lang, "information"), icon: "Info", links: information, loading: loading, sendPlausibleGoal: sendPlausibleGoal, pageTitleAsTitle: true })] }), _jsxs("div", { className: css.right, children: [!loading && products.length > 0 && weekSystemEnabled && (_jsx(_Fragment, { children: showProductsTitle ? (_jsxs("div", { className: css.resultsWithWeekTitle, children: [message(lang, "productTitleWithWeek"), Dates.weekToLongDate(weekNumber, season.end, season.forceSeasonSwitch), _jsxs(Button, { onClick: openPeriodPicker, children: [_jsx(Icons.Calendar, {}), message(lang, "updateWeek")] })] })) : (_jsxs("div", { className: css.resultsWithoutWeekTitle, children: [message(lang, "productTitleWithoutWeek"), _jsxs(Button, { onClick: openPeriodPicker, children: [_jsx(Icons.Calendar, {}), message(lang, "chooseWeek")] })] })) })), _jsx(Products, { lang: lang, products: products, weekNumber: weekNumber, loading: loading, sendPlausibleGoal: sendPlausibleGoal, otherResultsRef: ref, isOtherResultsEmpty: isOtherResultsEmpty })] })] })) }));
-}
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
+const {
+  publicRuntimeConfig
+} = getConfig();
+const {
+  season
+} = publicRuntimeConfig;
+export default function Results({
+  lang,
+  text,
+  results,
+  weekNumber,
+  openPeriodPicker,
+  loading,
+  sendPlausibleGoal
+}) {
+  const ref = React.useRef(null);
+  const {
+    grouped_hits: groupedHits = []
+  } = results || {};
+  const flattenedHits = groupedHits.reduce((acc, group) => {
+    return [...acc, ...group.hits];
+  }, []);
+  const sortedHits = flattenedHits.reduce((acc, hit) => {
+    const {
+      type
+    } = hit.document;
+    return {
+      ...acc,
+      [type]: [...acc[type], hit]
+    };
+  }, {
+    page: [],
+    product: [],
+    information: [],
+    faq: [],
+    instructor: []
+  });
+  const {
+    page: pages,
+    product: products,
+    information,
+    faq: faqs,
+    instructor: instructors
+  } = sortedHits;
+  const filteredFaqs = faqs.reduce((acc, faq) => {
+    const isAlreadyInAcc = acc.some(item => {
+      const hasSameTitle = item.document.title === faq.document.title;
+      const hasSameParentTitle = item.document.parentTitle === faq.document.parentTitle;
+      return hasSameTitle && hasSameParentTitle;
+    });
+    if (isAlreadyInAcc) return acc;
+    return [...acc, faq];
+  }, []);
+  const weekSystemEnabled = Boolean(season);
+  const showProductsTitle = weekNumber !== null;
+  const isOtherResultsEmpty = !(pages.length || instructors.length || filteredFaqs.length || information.length);
+  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, "pages"),
+          icon: "FileText",
+          links: pages,
+          loading: loading,
+          sendPlausibleGoal: sendPlausibleGoal
+        }), _jsx(Links, {
+          linksTitle: message(lang, "instructors"),
+          icon: "User",
+          links: instructors,
+          loading: loading,
+          sendPlausibleGoal: sendPlausibleGoal
+        }), _jsx(Links, {
+          linksTitle: message(lang, "faqs"),
+          icon: "Question",
+          links: filteredFaqs,
+          loading: loading,
+          sendPlausibleGoal: sendPlausibleGoal
+        }), _jsx(Links, {
+          linksTitle: message(lang, "information"),
+          icon: "Info",
+          links: information,
+          loading: loading,
+          sendPlausibleGoal: sendPlausibleGoal,
+          pageTitleAsTitle: true
+        })]
+      }), _jsxs("div", {
+        className: css.right,
+        children: [!loading && products.length > 0 && weekSystemEnabled && _jsx(_Fragment, {
+          children: showProductsTitle ? _jsxs("div", {
+            className: css.resultsWithWeekTitle,
+            children: [message(lang, "productTitleWithWeek"), Dates.weekToLongDate(weekNumber, season.end, season.forceSeasonSwitch), _jsxs(Button, {
+              onClick: openPeriodPicker,
+              children: [_jsx(Icons.Calendar, {}), message(lang, "updateWeek")]
+            })]
+          }) : _jsxs("div", {
+            className: css.resultsWithoutWeekTitle,
+            children: [message(lang, "productTitleWithoutWeek"), _jsxs(Button, {
+              onClick: openPeriodPicker,
+              children: [_jsx(Icons.Calendar, {}), message(lang, "chooseWeek")]
+            })]
+          })
+        }), _jsx(Products, {
+          lang: lang,
+          products: products,
+          weekNumber: weekNumber,
+          loading: loading,
+          sendPlausibleGoal: sendPlausibleGoal,
+          otherResultsRef: ref,
+          isOtherResultsEmpty: isOtherResultsEmpty
+        })]
+      })]
+    })
+  });
+}

package/es/common/components/instant-search/services/api.js

@@ -1,13 +1,15 @@
-// import * as Fetcher from "ublo-lib/es/common/utils/fetcher";
 import * as Fetcher from "../../../utils/fetcher";
 const api = "https://search.ublo.app/api";
 export function fetchResults(site, lang, query, groupLimit = 8, queryBy = "title,text,pageTitle,seoKeywords,parentTitle,seoTitle", queryByWeights) {
-    const endpoint = `${api}/search`;
-    return Fetcher.post(endpoint, {
-        q: query,
-        query_by: queryBy,
-        query_by_weights: queryByWeights,
-        group_limit: groupLimit,
-        per_page: 30,
-    }, { site, lang });
-}
+  const endpoint = `${api}/search`;
+  return Fetcher.post(endpoint, {
+    q: query,
+    query_by: queryBy,
+    query_by_weights: queryByWeights,
+    group_limit: groupLimit,
+    per_page: 30
+  }, {
+    site,
+    lang
+  });
+}

package/es/common/components/instant-search/services/messages.js

@@ -1,5 +1,5 @@
 import locales from "../i18n.json";
 export default function message(lang, id) {
-    const messages = locales[lang] || locales.en;
-    return messages[id] || `??${id}??`;
-}
+  const messages = locales[lang] || locales.en;
+  return messages[id] || `??${id}??`;
+}

package/es/common/components/instant-search/services/utils.js

@@ -1,39 +1,39 @@
 export function getHighlight(property, highlight, withExtractQuotes = false) {
-    if (!highlight[property]?.snippet)
-        return;
-    let snippet = highlight[property].snippet;
-    if (!withExtractQuotes)
-        return snippet;
-    const startsWithMaj = /[A-Z]/.test(snippet);
-    const endsWithDot = snippet[snippet.length - 1] === ".";
-    if (!startsWithMaj) {
-        snippet = `...${snippet}`;
-    }
-    if (!endsWithDot) {
-        snippet = `${snippet}...`;
-    }
-    return snippet;
+  if (!highlight[property]?.snippet) return;
+  let snippet = highlight[property].snippet;
+  if (!withExtractQuotes) return snippet;
+  const startsWithMaj = /[A-Z]/.test(snippet);
+  const endsWithDot = snippet[snippet.length - 1] === ".";
+  if (!startsWithMaj) {
+    snippet = `...${snippet}`;
+  }
+  if (!endsWithDot) {
+    snippet = `${snippet}...`;
+  }
+  return snippet;
 }
 export function filterProducts(products, weekNumber) {
-    if (weekNumber !== null) {
-        return products.filter((product) => {
-            const { weeks = [] } = product.document;
-            return weeks.length === 0 || weeks.includes(weekNumber);
-        });
-    }
-    return products.reduce((acc, product) => {
-        const { image, pageTitle } = product.document;
-        const isAlreadyInAcc = acc.some((item) => {
-            return (normalizeImage(item.document.image) === normalizeImage(image) &&
-                item.document.pageTitle === pageTitle);
-        });
-        if (isAlreadyInAcc)
-            return acc;
-        return [...acc, product];
-    }, []);
+  if (weekNumber !== null) {
+    return products.filter(product => {
+      const {
+        weeks = []
+      } = product.document;
+      return weeks.length === 0 || weeks.includes(weekNumber);
+    });
+  }
+  return products.reduce((acc, product) => {
+    const {
+      image,
+      pageTitle
+    } = product.document;
+    const isAlreadyInAcc = acc.some(item => {
+      return normalizeImage(item.document.image) === normalizeImage(image) && item.document.pageTitle === pageTitle;
+    });
+    if (isAlreadyInAcc) return acc;
+    return [...acc, product];
+  }, []);
 }
 function normalizeImage(image) {
-    if (!image)
-        return "";
-    return image.replace(/(-[0-9]+)?.(jpg|jpeg|png|gif)/, "");
-}
+  if (!image) return "";
+  return image.replace(/(-[0-9]+)?.(jpg|jpeg|png|gif)/, "");
+}