ublo-lib 1.35.19 → 1.36.1

package/es/common/components/msem-preset-linker/hooks/use-msem-presets.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-msem-presets.d.ts","sourceRoot":"","sources":["../../../../../src/common/components/msem-preset-linker/hooks/use-msem-presets.ts"],"names":[],"mappings":"AAOA,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EAAE,IAAI,EAAE,cAAc,EAAE;;;CAAA,QAyC9D"}
+{"version":3,"file":"use-msem-presets.d.ts","sourceRoot":"","sources":["../../../../../src/common/components/msem-preset-linker/hooks/use-msem-presets.ts"],"names":[],"mappings":"AAOA,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EAAE,IAAI,EAAE,cAAc,EAAE;;;CAAA,QA0C9D"}

package/es/common/components/msem-preset-linker/hooks/use-msem-presets.js

@@ -5,6 +5,7 @@ import * as UrlParams from "../services/url-params";
 import * as MseM from "../../../utils/msem-widget";
 export default function useMsemPresets({ mode, defaultOptions }) {
     const { lang, cmsMode, path } = useUbloContext();
+    const widgetLang = lang === "fr" ? "fr" : "en";
     const isEnabled = cmsMode !== "editing" && cmsMode !== "info" && mode !== MODES.EDITING;
     const handleSectionClick = React.useCallback((e) => {
         const target = e.target;
@@ -13,7 +14,7 @@ export default function useMsemPresets({ mode, defaultOptions }) {
         if (!preset)
             return;
         const { widget, options = {}, presets, url } = JSON.parse(preset);
-        const allOptions = { ...defaultOptions, ...options };
+        const allOptions = { ...defaultOptions, ...options, lang: widgetLang };
         e.preventDefault();
         e.stopPropagation();
         if (url) {
@@ -23,7 +24,7 @@ export default function useMsemPresets({ mode, defaultOptions }) {
             return;
         }
         MseM.loadWidget(widget, allOptions, presets);
-    }, [defaultOptions]);
+    }, [defaultOptions, widgetLang]);
     React.useEffect(() => {
         const container = document.getElementById("__next");
         if (isEnabled && container) {

package/es/common/components/scrolling-carousel/scrolling-carousel.module.css

@@ -53,3 +53,7 @@ svg.controlIcon {
 .inner > :global(.cms) > :global(section) {
   scroll-snap-align: start;
 }
+
+.inner > :global(.cms) > :global(section:last-child) {
+  scroll-snap-align: end;
+}

package/es/lbm/components/instant-search/facet-switch.d.ts

@@ -0,0 +1,8 @@
+type Props = {
+    lang: string;
+    facet: number;
+    setFacet: (facet: number) => void;
+};
+export default function ThemeSwitch({ lang, facet, setFacet }: Props): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=facet-switch.d.ts.map

package/es/lbm/components/instant-search/facet-switch.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"facet-switch.d.ts","sourceRoot":"","sources":["../../../../src/lbm/components/instant-search/facet-switch.tsx"],"names":[],"mappings":"AAgBA,KAAK,KAAK,GAAG;IACX,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IAEd,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACnC,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,KAAK,2CAsBnE"}

package/es/lbm/components/instant-search/facet-switch.js

@@ -0,0 +1,15 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import Select from "dt-design-system/es/select";
+import message from "./services/messages";
+import styles from "./facet-switch.module.css";
+export default function ThemeSwitch({ lang, facet, setFacet }) {
+    const facets = {
+        0: { icon: "Snowflake", label: message(lang, "winter") },
+        1: { icon: "Sun", label: message(lang, "summer") },
+    };
+    const options = Object.keys(facets).map((key) => {
+        return { value: key, label: facets[key].label };
+    });
+    const icon = facets[facet].icon;
+    return (_jsx(Select, { className: styles.select, icon: icon, options: options, value: facet.toString(), onValueChange: (value) => setFacet(Number(value)), compact: true }));
+}

package/es/lbm/components/instant-search/facet-switch.module.css

@@ -0,0 +1,19 @@
+.select {
+}
+
+.select label > span {
+  display: none;
+}
+
+.label {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+}
+
+.icon {
+  flex: 0 0 16px;
+  width: 16px;
+  height: 16px;
+  fill: currentColor;
+}

package/es/lbm/components/instant-search/faqs.d.ts

@@ -0,0 +1,12 @@
+import type { Hit } from "./results";
+type Props = {
+    lang: string;
+    faqs: Hit[];
+    loading: boolean;
+    sendPlausibleGoal: (path: string) => void;
+    maximized: boolean;
+    setMaximized: (maximized: boolean) => void;
+};
+export default function Faqs({ lang, faqs, loading, sendPlausibleGoal, maximized, setMaximized, }: Props): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=faqs.d.ts.map

package/es/lbm/components/instant-search/faqs.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"faqs.d.ts","sourceRoot":"","sources":["../../../../src/lbm/components/instant-search/faqs.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,WAAW,CAAC;AAGrC,KAAK,KAAK,GAAG;IACX,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,GAAG,EAAE,CAAC;IACZ,OAAO,EAAE,OAAO,CAAC;IAEjB,iBAAiB,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,SAAS,EAAE,OAAO,CAAC;IAEnB,YAAY,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;CAC5C,CAAC;AAIF,MAAM,CAAC,OAAO,UAAU,IAAI,CAAC,EAC3B,IAAI,EACJ,IAAI,EACJ,OAAO,EACP,iBAAiB,EACjB,SAAS,EACT,YAAY,GACb,EAAE,KAAK,2CA4DP"}

package/es/lbm/components/instant-search/faqs.js

@@ -0,0 +1,44 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import classNames from "classnames";
+import Link from "ublo/link";
+import Loader from "dt-design-system/es/loader";
+import Button from "dt-design-system/es/button";
+import * as Icons from "dt-design-system/es/icons";
+import * as Ripple from "dt-design-system/es/ripple";
+import message from "./services/messages";
+import * as Utils from "./services/utils";
+import styles from "./faqs.module.css";
+const PLACEHOLDERS = [...new Array(1)];
+export default function Faqs({ lang, faqs, loading, sendPlausibleGoal, maximized, setMaximized, }) {
+    const noResult = !loading && !faqs.length;
+    if (noResult)
+        return null;
+    const toggleMaximized = () => {
+        setMaximized(!maximized);
+    };
+    const hasMultipleFaqs = faqs.length > 1;
+    const ButtonIcon = Icons[maximized ? "ChevronsDown" : "ChevronsUp"];
+    const buttonLabel = message(lang, maximized ? "hideAllFAQs" : "showAllFAQs");
+    const firstFaq = faqs?.[0];
+    const otherFaqs = faqs.slice(1);
+    const classes = classNames(styles.faqs, {
+        [styles.maximized]: maximized,
+    });
+    return (_jsxs("div", { className: classes, children: [_jsxs("div", { className: styles.header, children: [_jsx("div", { className: styles.title, children: message(lang, "faqs") }), hasMultipleFaqs && (_jsxs(Button, { onClick: toggleMaximized, compact: true, children: [_jsx(ButtonIcon, {}), buttonLabel, " (", faqs.length, ")", _jsx(ButtonIcon, {})] }))] }), _jsxs("div", { className: styles.preview, children: [loading &&
+                        PLACEHOLDERS.map((_, i) => {
+                            return (_jsx("div", { className: styles.loaderContainer, children: _jsx(Loader, { className: styles.loader, variant: "overlay" }) }, i));
+                        }), !loading && firstFaq && (_jsx(Faq, { faq: firstFaq, sendPlausibleGoal: sendPlausibleGoal }))] }), maximized && (_jsx("div", { className: styles.list, children: otherFaqs.map((faq) => {
+                    return (_jsx(Faq, { faq: faq, sendPlausibleGoal: sendPlausibleGoal }, faq.document.path));
+                }) }))] }));
+}
+function Faq({ faq, sendPlausibleGoal }) {
+    const { document, highlight } = faq;
+    const { title, text, path } = document;
+    const decodedPath = decodeURIComponent(path);
+    const faqTitle = Utils.wrapWithMark(title, highlight.title?.matched_tokens);
+    const faqText = Utils.wrapWithMark(text, highlight.text?.matched_tokens);
+    const createRipple = (e) => {
+        Ripple.create(e);
+    };
+    return (_jsxs(Link, { className: styles.faq, href: decodedPath, onClick: sendPlausibleGoal(decodedPath), onMouseDown: createRipple, children: [_jsx("div", { className: styles.faqTitle, dangerouslySetInnerHTML: { __html: faqTitle } }), _jsx("div", { className: styles.faqText, dangerouslySetInnerHTML: { __html: faqText } })] }));
+}

package/es/lbm/components/instant-search/faqs.module.css

@@ -0,0 +1,102 @@
+.faqs {
+  position: sticky;
+  bottom: 0;
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+  margin-top: auto;
+  padding: 12px;
+  background-color: var(--ds-grey-000, #fff);
+  border-top: var(--ds-input-border, 1px solid var(--ds-grey-300, #d7d7d7));
+}
+
+.faqs.maximized {
+  flex: 1 1 100%;
+  transform: translateY(-1px);
+}
+
+.header {
+  align-self: flex-start;
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+.title {
+  font-size: 17px;
+  font-weight: 700;
+  padding: 3px 8px;
+  background-color: var(--ds-grey-200, #efefef);
+  border-radius: var(--ds-radius-100, 6px);
+}
+
+.list {
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+}
+
+.loaderContainer {
+  position: relative;
+  width: 100%;
+  height: 52px;
+  border-radius: var(--ds-radius-100, 6px);
+}
+
+.faq {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  padding: 6px 6px 6px 12px;
+  color: var(--ds-grey-500, #484848);
+  border-radius: var(--ds-radius-100, 6px);
+  transition: background-color 160ms
+    var(--ds-transition-easing, cubic-bezier(0.4, 0, 0.2, 1));
+}
+
+.faq:is(:hover, :focus) {
+  background-color: var(--ds-grey-100, #f5f5f5);
+}
+
+.faq::before {
+  content: "";
+  position: absolute;
+  top: 15%;
+  left: 0;
+  height: 70%;
+  width: 2px;
+  background-color: var(--ds-secondary, var(--ds-blue-400, #4177f6));
+  opacity: 0.5;
+}
+
+.faqTitle {
+  font-size: 15px;
+  font-weight: 700;
+}
+
+.faqText {
+  font-size: 14px;
+}
+
+.faqTitle mark,
+.faqText mark {
+  position: relative;
+  display: inline-block;
+  font-weight: 700;
+  color: var(--ds-secondary, var(--ds-blue-400, #4177f6));
+  background-color: transparent;
+}
+
+.faqTitle mark::before,
+.faqText mark::before {
+  content: "";
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background-color: var(--ds-secondary, var(--ds-blue-400, #4177f6));
+  border-radius: calc(var(--ds-radius-100, 6px) / 3);
+  opacity: 0.15;
+}

package/es/lbm/components/instant-search/hooks/use-constant.d.ts

@@ -0,0 +1,2 @@
+export default function useConstant(fn: any): any;
+//# sourceMappingURL=use-constant.d.ts.map

package/es/lbm/components/instant-search/hooks/use-constant.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-constant.d.ts","sourceRoot":"","sources":["../../../../../src/lbm/components/instant-search/hooks/use-constant.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAAE,EAAE,GAAG,OAQ1C"}

package/es/lbm/components/instant-search/hooks/use-constant.js

@@ -0,0 +1,8 @@
+import * as React from "react";
+export default function useConstant(fn) {
+    const ref = React.useRef();
+    if (!ref.current) {
+        ref.current = { v: fn() };
+    }
+    return ref.current.v;
+}

package/es/lbm/components/instant-search/hooks/use-debounced-search.d.ts

@@ -0,0 +1,11 @@
+import * as React from "react";
+type SearchFunction = (text: string, facet: number) => Promise<any>;
+export default function useDebouncedSearch(searchFunction: SearchFunction): {
+    text: string;
+    setText: React.Dispatch<React.SetStateAction<string>>;
+    facet: number;
+    setFacet: React.Dispatch<React.SetStateAction<number>>;
+    search: import("react-async-hook").UseAsyncReturn<any, any[]>;
+};
+export {};
+//# sourceMappingURL=use-debounced-search.d.ts.map

package/es/lbm/components/instant-search/hooks/use-debounced-search.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-debounced-search.d.ts","sourceRoot":"","sources":["../../../../../src/lbm/components/instant-search/hooks/use-debounced-search.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAQ/B,KAAK,cAAc,GAAG,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,OAAO,CAAC,GAAG,CAAC,CAAC;AAEpE,MAAM,CAAC,OAAO,UAAU,kBAAkB,CAAC,cAAc,EAAE,cAAc;;;;;;EAcxE"}

package/es/lbm/components/instant-search/hooks/use-debounced-search.js

@@ -0,0 +1,12 @@
+import * as React from "react";
+import debouncePromise from "awesome-debounce-promise";
+import { useAsync } from "react-async-hook";
+import useConstant from "./use-constant";
+const DEBOUNCE_AMOUNT = 400;
+export default function useDebouncedSearch(searchFunction) {
+    const [text, setText] = React.useState("");
+    const [facet, setFacet] = React.useState(0);
+    const debouncedSearchFunction = useConstant(() => debouncePromise(searchFunction, DEBOUNCE_AMOUNT));
+    const search = useAsync(async () => text.length === 0 ? undefined : debouncedSearchFunction(text, facet), [debouncedSearchFunction, text, facet], { setLoading: (state) => ({ ...state, loading: true }) });
+    return { text, setText, facet, setFacet, search };
+}

package/es/lbm/components/instant-search/hooks/use-search.d.ts

@@ -0,0 +1,17 @@
+/// <reference types="react" />
+export type SearchOptions = {
+    groupLimit?: number;
+    page?: number;
+    perPage?: number;
+    queryBy?: string;
+    queryByWeights?: string;
+    sortBy?: string;
+};
+export default function useSearch(lang: string, options?: SearchOptions): {
+    text: string;
+    setText: import("react").Dispatch<import("react").SetStateAction<string>>;
+    facet: number;
+    setFacet: import("react").Dispatch<import("react").SetStateAction<number>>;
+    search: import("react-async-hook").UseAsyncReturn<any, any[]>;
+};
+//# sourceMappingURL=use-search.d.ts.map

package/es/lbm/components/instant-search/hooks/use-search.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-search.d.ts","sourceRoot":"","sources":["../../../../../src/lbm/components/instant-search/hooks/use-search.ts"],"names":[],"mappings":";AAOA,MAAM,MAAM,aAAa,GAAG;IAC1B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,IAAI,EAAE,MAAM,EAAE,OAAO,GAAE,aAAkB;;;;;;EAY1E"}

package/es/lbm/components/instant-search/hooks/use-search.js

@@ -0,0 +1,10 @@
+import getConfig from "next/config";
+import useDebouncedSearch from "./use-debounced-search";
+import * as API from "../services/api";
+const { publicRuntimeConfig } = getConfig();
+const { site } = publicRuntimeConfig;
+export default function useSearch(lang, options = {}) {
+    return useDebouncedSearch(async (query, facet) => {
+        return API.fetchResults(site, lang, query, facet, options.groupLimit, options.queryBy, options.queryByWeights);
+    });
+}

package/es/lbm/components/instant-search/i18n.json

@@ -0,0 +1,32 @@
+{
+  "fr": {
+    "try": "Essayez",
+    "pages": "Pages",
+    "faqs": "Questions fréquentes",
+    "information": "Informations",
+    "documents": "Documents",
+    "noProducts": "Pas de produit correspondant",
+    "showOtherResults": "Afficher les autres résultats",
+    "winter": "Hiver",
+    "summer": "Été",
+    "results": "résultats pour",
+    "result": "résultat pour",
+    "showAllFAQs": "Tout afficher",
+    "hideAllFAQs": "Réduire"
+  },
+  "en": {
+    "try": "Try",
+    "pages": "Pages",
+    "faqs": "FAQs",
+    "information": "Information",
+    "documents": "Documents",
+    "noProducts": "No matching product",
+    "showOtherResults": "Show other results",
+    "winter": "Winter",
+    "summer": "Summer",
+    "results": "results for",
+    "result": "result for",
+    "showAllFAQs": "Show all",
+    "hideAllFAQs": "Hide all"
+  }
+}

package/es/lbm/components/instant-search/index.d.ts

@@ -0,0 +1,3 @@
+import InstantSearch from "./instant-search";
+export default InstantSearch;
+//# sourceMappingURL=index.d.ts.map

package/es/lbm/components/instant-search/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/lbm/components/instant-search/index.tsx"],"names":[],"mappings":"AAAA,OAAO,aAAa,MAAM,kBAAkB,CAAC;AAE7C,eAAe,aAAa,CAAC"}

package/es/lbm/components/instant-search/index.js

@@ -0,0 +1,2 @@
+import InstantSearch from "./instant-search";
+export default InstantSearch;

package/es/lbm/components/instant-search/instant-search.d.ts

@@ -0,0 +1,19 @@
+import { type SearchOptions } from "./hooks/use-search";
+type Props = {
+    lang: string;
+    className?: string;
+    ubloContext: {
+        lang: string;
+        cmsMode: "connected" | "editing" | "info";
+        metadata: Record<string, string>;
+        path: string;
+    };
+    suggestions?: {
+        fr?: string[];
+        en?: string[];
+    };
+    options?: SearchOptions;
+};
+export default function InstantSearch({ lang, suggestions, className, options, }: Props): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=instant-search.d.ts.map

package/es/lbm/components/instant-search/instant-search.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"instant-search.d.ts","sourceRoot":"","sources":["../../../../src/lbm/components/instant-search/instant-search.tsx"],"names":[],"mappings":"AAOA,OAAkB,EAAE,KAAK,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAKnE,KAAK,KAAK,GAAG;IACX,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE;QACX,IAAI,EAAE,MAAM,CAAC;QACb,OAAO,EAAE,WAAW,GAAG,SAAS,GAAG,MAAM,CAAC;QAC1C,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;QACjC,IAAI,EAAE,MAAM,CAAC;KACd,CAAC;IACF,WAAW,CAAC,EAAE;QACZ,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC;QACd,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC;KACf,CAAC;IACF,OAAO,CAAC,EAAE,aAAa,CAAC;CACzB,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EACpC,IAAI,EACJ,WAAW,EACX,SAAS,EACT,OAAY,GACb,EAAE,KAAK,2CAmGP"}

package/es/lbm/components/instant-search/instant-search.js

@@ -0,0 +1,64 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import * as React from "react";
+import classNames from "classnames";
+import Router from "next/router";
+import Input from "dt-design-system/es/input";
+import Dialog from "dt-design-system/es/dialog";
+import SearchInput from "./search-input";
+import Results from "./results";
+import useSearch from "./hooks/use-search";
+import * as Plausible from "../../../common/components/plausible";
+import css from "./instant-search.module.css";
+export default function InstantSearch({ lang, suggestions, className, options = {}, }) {
+    const [opened, setOpened] = React.useState(false);
+    const { text, setText, facet, setFacet, search } = useSearch(lang, options);
+    const classes = classNames(css.search, className);
+    const openSearch = () => {
+        setOpened(true);
+        document.body.style.setProperty("overflow", "hidden");
+    };
+    const closeSearch = (skipEvent) => {
+        setOpened(false);
+        setText("");
+        document.body.style.removeProperty("overflow");
+        if (!skipEvent) {
+            const event = search?.result?.length === 0 ? "Search failed" : "Search canceled";
+            if (text.length > 0) {
+                Plausible.sendGoal(event, {
+                    Terms: text,
+                });
+            }
+        }
+    };
+    const sendPlausibleGoal = (path) => () => {
+        Plausible.sendGoal("Search", {
+            "Terms - Destination": `${text} - ${path}`,
+        });
+    };
+    Router.ready(() => {
+        Router.events.on("routeChangeStart", () => {
+            if (opened) {
+                closeSearch(true);
+            }
+        });
+    });
+    const handleKeyPresses = React.useCallback((e) => {
+        const allowedKeys = ["k"];
+        const { code, ctrlKey, key, metaKey } = e;
+        const isAllowed = (ctrlKey || metaKey) &&
+            (allowedKeys.includes(code) || allowedKeys.includes(key));
+        if (!isAllowed)
+            return;
+        e.preventDefault();
+        if (key === "k" && (ctrlKey || metaKey)) {
+            openSearch();
+        }
+    }, []);
+    React.useEffect(() => {
+        window.addEventListener("keydown", handleKeyPresses);
+        return () => {
+            window.removeEventListener("keydown", handleKeyPresses);
+        };
+    }, [handleKeyPresses]);
+    return (_jsxs(_Fragment, { children: [_jsx(Input, { icon: "Search", placeholder: "Que recherchez-vous ?", className: classes, onClick: openSearch, readOnly: true }), _jsxs(Dialog, { className: css.dialog, isOpened: opened, showCloseButton: false, close: closeSearch, container: "body", showAsModal: false, children: [_jsx(SearchInput, { lang: lang, text: text, setText: setText, closeSearch: closeSearch, loading: search.loading === true, suggestions: suggestions }), _jsx(Results, { lang: lang, text: text, facet: facet, setFacet: setFacet, results: search.result, loading: search.loading === true && search.result === undefined, sendPlausibleGoal: sendPlausibleGoal })] })] }));
+}

package/es/lbm/components/instant-search/instant-search.module.css

@@ -0,0 +1,8 @@
+.dialog {
+  width: 1400px;
+  max-width: calc(100% - 6px);
+  max-height: calc(100% - 6px);
+  background-color: transparent;
+  box-shadow: none;
+  pointer-events: auto;
+}

package/es/lbm/components/instant-search/links.d.ts

@@ -0,0 +1,12 @@
+import type { Hit } from "./results";
+type Props = {
+    linksTitle: string;
+    icon: "FileText" | "Info" | "Question" | "User" | "File";
+    links: Hit[];
+    pageTitleAsTitle?: boolean;
+    loading: boolean;
+    sendPlausibleGoal: (path: string) => void;
+};
+export default function Links({ icon, linksTitle, links, pageTitleAsTitle, loading, sendPlausibleGoal, }: Props): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=links.d.ts.map

package/es/lbm/components/instant-search/links.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"links.d.ts","sourceRoot":"","sources":["../../../../src/lbm/components/instant-search/links.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,WAAW,CAAC;AAGrC,KAAK,KAAK,GAAG;IACX,UAAU,EAAE,MAAM,CAAC;IACnB,IAAI,EAAE,UAAU,GAAG,MAAM,GAAG,UAAU,GAAG,MAAM,GAAG,MAAM,CAAC;IACzD,KAAK,EAAE,GAAG,EAAE,CAAC;IACb,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,OAAO,EAAE,OAAO,CAAC;IAEjB,iBAAiB,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CAC3C,CAAC;AAIF,MAAM,CAAC,OAAO,UAAU,KAAK,CAAC,EAC5B,IAAI,EACJ,UAAU,EACV,KAAK,EACL,gBAAgB,EAChB,OAAO,EACP,iBAAiB,GAClB,EAAE,KAAK,2CAmEP"}

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

@@ -0,0 +1,30 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+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";
+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, target } = link.document;
+                            const decodedPath = decodeURIComponent(target || path);
+                            const titleProperty = pageTitleAsTitle ? "pageTitle" : "title";
+                            const linkTitle = Utils.getHighlight(titleProperty, link.highlight) ||
+                                link.document[titleProperty].trim();
+                            const linkText = Utils.getHighlight("text", link.highlight, true) || text?.trim();
+                            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/lbm/components/instant-search/links.module.css

@@ -0,0 +1,96 @@
+.linksSection {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+}
+
+.linksTitle {
+  position: sticky;
+  top: 16px;
+  font-size: 17px;
+  font-weight: 700;
+  padding: 3px 8px;
+  background-color: var(--ds-grey-200, #efefef);
+  border-radius: var(--ds-radius-100, 6px);
+  z-index: 1;
+}
+
+@media (min-width: 730px) {
+  .linksTitle {
+    top: 0;
+  }
+}
+
+.links {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+}
+
+.loaderContainer {
+  position: relative;
+  width: 100%;
+  height: 44px;
+  border-radius: var(--ds-radius-100, 6px);
+}
+
+.link {
+  position: relative;
+  display: flex;
+  gap: 10px;
+  padding: 6px;
+  color: var(--ds-grey-500, #484848);
+  border-radius: var(--ds-radius-100, 6px);
+  transition: background-color 160ms
+    var(--ds-transition-easing, cubic-bezier(0.4, 0, 0.2, 1));
+}
+
+.link:is(:hover, :focus) {
+  background-color: var(--ds-grey-100, #f5f5f5);
+}
+
+.linkIcon {
+  flex: 0 0 16px;
+  width: 16px;
+  height: 16px;
+  margin-top: 2px;
+  fill: currentColor;
+}
+
+.linkContent {
+  flex: 1 1 auto;
+}
+
+.linkTitle {
+  font-size: 15px;
+}
+
+.link mark {
+  position: relative;
+  display: inline-block;
+  font-weight: 700;
+  color: var(--ds-secondary, var(--ds-blue-400, #4177f6));
+  background-color: transparent;
+}
+
+.link mark::before {
+  content: "";
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background-color: var(--ds-secondary, var(--ds-blue-400, #4177f6));
+  border-radius: calc(var(--ds-radius-100, 6px) / 3);
+  opacity: 0.15;
+}
+
+.linkParent {
+  text-transform: uppercase;
+  font-size: 10px;
+}
+
+.linkText {
+  font-size: 12px;
+  white-space: pre-wrap;
+}

package/es/lbm/components/instant-search/no-product.d.ts

@@ -0,0 +1,6 @@
+type Props = {
+    className?: string;
+};
+export default function NoProduct({ className }: Props): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=no-product.d.ts.map

package/es/lbm/components/instant-search/no-product.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"no-product.d.ts","sourceRoot":"","sources":["../../../../src/lbm/components/instant-search/no-product.tsx"],"names":[],"mappings":"AAEA,KAAK,KAAK,GAAG;IACX,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAAE,SAAS,EAAE,EAAE,KAAK,2CA2FrD"}