UNPKG

admesh-ui-sdk

Version:

Beautiful, modern React components for displaying AI-powered product recommendations with citation-based conversation ads, auto-triggered widgets, floating chat, conversational interfaces, persistent sidebar, and built-in tracking

1,234 lines (1,200 loc) 112 kB
import be, { useState as M, useMemo as V, useCallback as U, useRef as G, useEffect as $ } from "react"; function pe(r) { return r && r.__esModule && Object.prototype.hasOwnProperty.call(r, "default") ? r.default : r; } var Z = { exports: {} }, H = {}; /** * @license React * react-jsx-runtime.production.js * * Copyright (c) Meta Platforms, Inc. and affiliates. * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. */ var de; function ye() { if (de) return H; de = 1; var r = Symbol.for("react.transitional.element"), s = Symbol.for("react.fragment"); function t(i, n, a) { var o = null; if (a !== void 0 && (o = "" + a), n.key !== void 0 && (o = "" + n.key), "key" in n) { a = {}; for (var x in n) x !== "key" && (a[x] = n[x]); } else a = n; return n = a.ref, { $$typeof: r, type: i, key: o, ref: n !== void 0 ? n : null, props: a }; } return H.Fragment = s, H.jsx = t, H.jsxs = t, H; } var q = {}; /** * @license React * react-jsx-runtime.development.js * * Copyright (c) Meta Platforms, Inc. and affiliates. * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. */ var ce; function ve() { return ce || (ce = 1, process.env.NODE_ENV !== "production" && function() { function r(l) { if (l == null) return null; if (typeof l == "function") return l.$$typeof === K ? null : l.displayName || l.name || null; if (typeof l == "string") return l; switch (l) { case y: return "Fragment"; case b: return "Profiler"; case p: return "StrictMode"; case k: return "Suspense"; case _: return "SuspenseList"; case F: return "Activity"; } if (typeof l == "object") switch (typeof l.tag == "number" && console.error( "Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue." ), l.$$typeof) { case m: return "Portal"; case N: return (l.displayName || "Context") + ".Provider"; case L: return (l._context.displayName || "Context") + ".Consumer"; case v: var j = l.render; return l = l.displayName, l || (l = j.displayName || j.name || "", l = l !== "" ? "ForwardRef(" + l + ")" : "ForwardRef"), l; case A: return j = l.displayName || null, j !== null ? j : r(l.type) || "Memo"; case R: j = l._payload, l = l._init; try { return r(l(j)); } catch { } } return null; } function s(l) { return "" + l; } function t(l) { try { s(l); var j = !1; } catch { j = !0; } if (j) { j = console; var C = j.error, T = typeof Symbol == "function" && Symbol.toStringTag && l[Symbol.toStringTag] || l.constructor.name || "Object"; return C.call( j, "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.", T ), s(l); } } function i(l) { if (l === y) return "<>"; if (typeof l == "object" && l !== null && l.$$typeof === R) return "<...>"; try { var j = r(l); return j ? "<" + j + ">" : "<...>"; } catch { return "<...>"; } } function n() { var l = Y.A; return l === null ? null : l.getOwner(); } function a() { return Error("react-stack-top-frame"); } function o(l) { if (Q.call(l, "key")) { var j = Object.getOwnPropertyDescriptor(l, "key").get; if (j && j.isReactWarning) return !1; } return l.key !== void 0; } function x(l, j) { function C() { P || (P = !0, console.error( "%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)", j )); } C.isReactWarning = !0, Object.defineProperty(l, "key", { get: C, configurable: !0 }); } function g() { var l = r(this.type); return O[l] || (O[l] = !0, console.error( "Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release." )), l = this.props.ref, l !== void 0 ? l : null; } function h(l, j, C, T, W, z, se, te) { return C = z.ref, l = { $$typeof: f, type: l, key: j, props: z, _owner: W }, (C !== void 0 ? C : null) !== null ? Object.defineProperty(l, "ref", { enumerable: !1, get: g }) : Object.defineProperty(l, "ref", { enumerable: !1, value: null }), l._store = {}, Object.defineProperty(l._store, "validated", { configurable: !1, enumerable: !1, writable: !0, value: 0 }), Object.defineProperty(l, "_debugInfo", { configurable: !1, enumerable: !1, writable: !0, value: null }), Object.defineProperty(l, "_debugStack", { configurable: !1, enumerable: !1, writable: !0, value: se }), Object.defineProperty(l, "_debugTask", { configurable: !1, enumerable: !1, writable: !0, value: te }), Object.freeze && (Object.freeze(l.props), Object.freeze(l)), l; } function d(l, j, C, T, W, z, se, te) { var E = j.children; if (E !== void 0) if (T) if (re(E)) { for (T = 0; T < E.length; T++) u(E[T]); Object.freeze && Object.freeze(E); } else console.error( "React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead." ); else u(E); if (Q.call(j, "key")) { E = r(l); var D = Object.keys(j).filter(function(fe) { return fe !== "key"; }); T = 0 < D.length ? "{key: someKey, " + D.join(": ..., ") + ": ...}" : "{key: someKey}", ie[E + T] || (D = 0 < D.length ? "{" + D.join(": ..., ") + ": ...}" : "{}", console.error( `A props object containing a "key" prop is being spread into JSX: let props = %s; <%s {...props} /> React keys must be passed directly to JSX without using spread: let props = %s; <%s key={someKey} {...props} />`, T, E, D, E ), ie[E + T] = !0); } if (E = null, C !== void 0 && (t(C), E = "" + C), o(j) && (t(j.key), E = "" + j.key), "key" in j) { C = {}; for (var ae in j) ae !== "key" && (C[ae] = j[ae]); } else C = j; return E && x( C, typeof l == "function" ? l.displayName || l.name || "Unknown" : l ), h( l, E, z, W, n(), C, se, te ); } function u(l) { typeof l == "object" && l !== null && l.$$typeof === f && l._store && (l._store.validated = 1); } var c = be, f = Symbol.for("react.transitional.element"), m = Symbol.for("react.portal"), y = Symbol.for("react.fragment"), p = Symbol.for("react.strict_mode"), b = Symbol.for("react.profiler"), L = Symbol.for("react.consumer"), N = Symbol.for("react.context"), v = Symbol.for("react.forward_ref"), k = Symbol.for("react.suspense"), _ = Symbol.for("react.suspense_list"), A = Symbol.for("react.memo"), R = Symbol.for("react.lazy"), F = Symbol.for("react.activity"), K = Symbol.for("react.client.reference"), Y = c.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, Q = Object.prototype.hasOwnProperty, re = Array.isArray, S = console.createTask ? console.createTask : function() { return null; }; c = { "react-stack-bottom-frame": function(l) { return l(); } }; var P, O = {}, I = c["react-stack-bottom-frame"].bind( c, a )(), X = S(i(a)), ie = {}; q.Fragment = y, q.jsx = function(l, j, C, T, W) { var z = 1e4 > Y.recentlyCreatedOwnerStacks++; return d( l, j, C, !1, T, W, z ? Error("react-stack-top-frame") : I, z ? S(i(l)) : X ); }, q.jsxs = function(l, j, C, T, W) { var z = 1e4 > Y.recentlyCreatedOwnerStacks++; return d( l, j, C, !0, T, W, z ? Error("react-stack-top-frame") : I, z ? S(i(l)) : X ); }; }()), q; } var xe; function ke() { return xe || (xe = 1, process.env.NODE_ENV === "production" ? Z.exports = ye() : Z.exports = ve()), Z.exports; } var e = ke(), le = { exports: {} }; /*! Copyright (c) 2018 Jed Watson. Licensed under the MIT License (MIT), see http://jedwatson.github.io/classnames */ var ue; function je() { return ue || (ue = 1, function(r) { (function() { var s = {}.hasOwnProperty; function t() { for (var a = "", o = 0; o < arguments.length; o++) { var x = arguments[o]; x && (a = n(a, i(x))); } return a; } function i(a) { if (typeof a == "string" || typeof a == "number") return a; if (typeof a != "object") return ""; if (Array.isArray(a)) return t.apply(null, a); if (a.toString !== Object.prototype.toString && !a.toString.toString().includes("[native code]")) return a.toString(); var o = ""; for (var x in a) s.call(a, x) && a[x] && (o = n(o, x)); return o; } function n(a, o) { return o ? a ? a + " " + o : a + o : a; } r.exports ? (t.default = t, r.exports = t) : window.classNames = t; })(); }(le)), le.exports; } var we = je(); const w = /* @__PURE__ */ pe(we), Ne = "https://api.useadmesh.com/track"; let oe = { apiBaseUrl: Ne, enabled: !0, debug: !1, retryAttempts: 3, retryDelay: 1e3 }; const Ve = (r) => { oe = { ...oe, ...r }; }, _e = (r) => { const [s, t] = M(!1), [i, n] = M(null), a = V(() => ({ ...oe, ...r }), [r]), o = U((u, c) => { a.debug && console.log(`[AdMesh Tracker] ${u}`, c); }, [a.debug]), x = U(async (u, c) => { if (!a.enabled) { o("Tracking disabled, skipping event", { eventType: u, data: c }); return; } if (!c.adId || !c.admeshLink) { const p = "Missing required tracking data: adId and admeshLink are required"; o(p, c), n(p); return; } t(!0), n(null); const f = { event_type: u, ad_id: c.adId, admesh_link: c.admeshLink, product_id: c.productId, user_id: c.userId, session_id: c.sessionId, revenue: c.revenue, conversion_type: c.conversionType, metadata: c.metadata, timestamp: (/* @__PURE__ */ new Date()).toISOString(), user_agent: navigator.userAgent, referrer: document.referrer, page_url: window.location.href }; o(`Sending ${u} event`, f); let m = null; for (let p = 1; p <= (a.retryAttempts || 3); p++) try { const b = await fetch(`${a.apiBaseUrl}/events`, { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify(f) }); if (!b.ok) throw new Error(`HTTP ${b.status}: ${b.statusText}`); const L = await b.json(); o(`${u} event tracked successfully`, L), t(!1); return; } catch (b) { m = b, o(`Attempt ${p} failed for ${u} event`, b), p < (a.retryAttempts || 3) && await new Promise( (L) => setTimeout(L, (a.retryDelay || 1e3) * p) ); } const y = `Failed to track ${u} event after ${a.retryAttempts} attempts: ${m == null ? void 0 : m.message}`; o(y, m), n(y), t(!1); }, [a, o]), g = U(async (u) => x("click", u), [x]), h = U(async (u) => x("view", u), [x]), d = U(async (u) => (!u.revenue && !u.conversionType && o("Warning: Conversion tracking without revenue or conversion type", u), x("conversion", u)), [x, o]); return { trackClick: g, trackView: h, trackConversion: d, isTracking: s, error: i }; }, Fe = (r, s, t) => { try { const i = new URL(r); return i.searchParams.set("ad_id", s), i.searchParams.set("utm_source", "admesh"), i.searchParams.set("utm_medium", "recommendation"), t && Object.entries(t).forEach(([n, a]) => { i.searchParams.set(n, a); }), i.toString(); } catch (i) { return console.warn("[AdMesh] Invalid URL provided to buildAdMeshLink:", r, i), r; } }, De = (r, s) => ({ adId: r.ad_id, admeshLink: r.admesh_link, productId: r.product_id, ...s }), J = ({ adId: r, admeshLink: s, productId: t, children: i, onClick: n, trackingData: a, className: o }) => { const { trackClick: x, trackView: g } = _e(), h = G(null), d = G(!1); $(() => { if (!h.current || d.current) return; const c = new IntersectionObserver( (f) => { f.forEach((m) => { m.isIntersecting && !d.current && (d.current = !0, g({ adId: r, admeshLink: s, productId: t, ...a }).catch(console.error)); }); }, { threshold: 0.5, // Track when 50% of the element is visible rootMargin: "0px" } ); return c.observe(h.current), () => { c.disconnect(); }; }, [r, s, t, a, g]); const u = U(async (c) => { try { await x({ adId: r, admeshLink: s, productId: t, ...a }); } catch (y) { console.error("Failed to track click:", y); } n && n(), c.target.closest("a") || window.open(s, "_blank", "noopener,noreferrer"); }, [r, s, t, a, x, n]); return /* @__PURE__ */ e.jsx( "div", { ref: h, className: o, onClick: u, style: { cursor: "pointer" }, children: i } ); }; J.displayName = "AdMeshLinkTracker"; const ee = ({ recommendation: r, theme: s, showMatchScore: t = !0, showBadges: i = !0, onClick: n, className: a }) => { const o = V(() => { var f; const d = []; r.intent_match_score >= 0.8 && d.push("Top Match"), r.has_free_tier && d.push("Free Tier"), r.trial_days && r.trial_days > 0 && d.push("Trial Available"); const u = ["ai", "artificial intelligence", "machine learning", "ml", "automation"]; return (((f = r.keywords) == null ? void 0 : f.some( (m) => u.some((y) => m.toLowerCase().includes(y)) )) || r.title.toLowerCase().includes("ai")) && d.push("AI Powered"), d; }, [r]), x = Math.round(r.intent_match_score * 100), g = w( "admesh-component", "admesh-card", "relative p-3 rounded-lg bg-white dark:bg-slate-800 border border-gray-200 dark:border-slate-700 shadow-sm hover:shadow transition-shadow cursor-pointer", a ), h = s != null && s.accentColor ? { "--admesh-primary": s.accentColor, "--admesh-primary-hover": s.accentColor + "dd" // Add some transparency for hover } : void 0; return /* @__PURE__ */ e.jsx( J, { adId: r.ad_id, admeshLink: r.admesh_link, productId: r.product_id, onClick: () => n == null ? void 0 : n(r.ad_id, r.admesh_link), trackingData: { title: r.title, matchScore: r.intent_match_score }, className: g, children: /* @__PURE__ */ e.jsxs( "div", { className: "h-full flex flex-col", style: h, "data-admesh-theme": s == null ? void 0 : s.mode, children: [ /* @__PURE__ */ e.jsx("div", { className: "flex justify-between items-start mb-2", children: /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-2", children: [ i && o.includes("Top Match") && /* @__PURE__ */ e.jsx("span", { className: "text-xs font-semibold text-white bg-black px-2 py-0.5 rounded-full", children: "Top Match" }), /* @__PURE__ */ e.jsx("h4", { className: "font-semibold text-gray-800 dark:text-gray-200", children: r.title }), /* @__PURE__ */ e.jsx("div", { className: "flex gap-2", children: /* @__PURE__ */ e.jsxs("button", { className: "text-xs px-2 py-1 rounded-full bg-black text-white hover:bg-gray-800 flex items-center", children: [ "Visit", /* @__PURE__ */ e.jsx("svg", { className: "ml-1 h-3 w-3", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ e.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14" }) }) ] }) }) ] }) }), /* @__PURE__ */ e.jsx("p", { className: "text-sm text-gray-700 dark:text-gray-300 mb-3", children: r.reason }), t && typeof r.intent_match_score == "number" && /* @__PURE__ */ e.jsxs("div", { className: "mb-3", children: [ /* @__PURE__ */ e.jsxs("div", { className: "flex items-center justify-between text-xs text-gray-500 dark:text-gray-400 mb-1", children: [ /* @__PURE__ */ e.jsx("span", { children: "Confidence" }), /* @__PURE__ */ e.jsxs("span", { children: [ x, "%" ] }) ] }), /* @__PURE__ */ e.jsx("div", { className: "w-full bg-gray-200 dark:bg-slate-600 rounded h-1.5 overflow-hidden", children: /* @__PURE__ */ e.jsx( "div", { className: "bg-black h-1.5", style: { width: `${x}%` } } ) }) ] }), /* @__PURE__ */ e.jsxs("div", { className: "flex flex-wrap gap-2 text-xs mb-2", children: [ r.pricing && /* @__PURE__ */ e.jsxs("span", { className: "flex items-center text-gray-600 dark:text-gray-400", children: [ /* @__PURE__ */ e.jsx("svg", { className: "h-3 w-3 mr-1", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ e.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 8c-1.657 0-3 .895-3 2s1.343 2 3 2 3 .895 3 2-1.343 2-3 2m0-8c1.11 0 2.08.402 2.599 1M12 8V7m0 1v8m0 0v1m0-1c-1.11 0-2.08-.402-2.599-1" }) }), r.pricing ] }), r.has_free_tier && /* @__PURE__ */ e.jsxs("span", { className: "flex items-center px-1.5 py-0.5 bg-gray-100 dark:bg-gray-900/30 text-gray-700 dark:text-gray-400 rounded-full", children: [ /* @__PURE__ */ e.jsx("svg", { className: "h-3 w-3 mr-1", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ e.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 8v13m0-13V6a2 2 0 112 2h-2zm0 0V5.5A2.5 2.5 0 109.5 8H12zm-7 4h14M5 12a2 2 0 110-4h14a2 2 0 110 4M5 12v7a2 2 0 002 2h10a2 2 0 002-2v-7" }) }), "Free Tier" ] }), r.trial_days && r.trial_days > 0 && /* @__PURE__ */ e.jsxs("span", { className: "flex items-center text-gray-600 dark:text-gray-400", children: [ /* @__PURE__ */ e.jsx("svg", { className: "h-3 w-3 mr-1", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ e.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M8 7V3a2 2 0 012-2h4a2 2 0 012 2v4m-6 4v10m6-10v10m-6 0h6" }) }), r.trial_days, "-day trial" ] }) ] }), r.features && r.features.length > 0 && /* @__PURE__ */ e.jsxs("div", { className: "mb-2", children: [ /* @__PURE__ */ e.jsx("div", { className: "text-xs text-gray-500 dark:text-gray-400 mb-1", children: "Features:" }), /* @__PURE__ */ e.jsx("div", { className: "flex flex-wrap gap-1.5", children: r.features.map((d, u) => /* @__PURE__ */ e.jsxs( "span", { className: "text-xs px-2 py-0.5 rounded-full bg-gray-100 dark:bg-slate-700 text-gray-700 dark:text-gray-300", children: [ /* @__PURE__ */ e.jsx("svg", { className: "h-3 w-3 mr-0.5 inline text-gray-500", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ e.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" }) }), d ] }, u )) }) ] }), r.integrations && r.integrations.length > 0 && /* @__PURE__ */ e.jsxs("div", { className: "mb-2", children: [ /* @__PURE__ */ e.jsx("div", { className: "text-xs text-gray-500 dark:text-gray-400 mb-1", children: "Integrates with:" }), /* @__PURE__ */ e.jsx("div", { className: "flex flex-wrap gap-1.5", children: r.integrations.map((d, u) => /* @__PURE__ */ e.jsxs( "span", { className: "text-xs px-2 py-0.5 rounded-full bg-gray-100 dark:bg-gray-900/30 text-gray-700 dark:text-gray-300", children: [ /* @__PURE__ */ e.jsx("svg", { className: "h-3 w-3 mr-0.5 inline", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ e.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M19 11H5m14 0a2 2 0 012 2v6a2 2 0 01-2 2H5a2 2 0 01-2-2v-6a2 2 0 012-2m14 0V9a2 2 0 00-2-2M5 11V9a2 2 0 012-2m0 0V5a2 2 0 012-2h6a2 2 0 012 2v2M7 7h10" }) }), d ] }, u )) }) ] }), r.reviews_summary && /* @__PURE__ */ e.jsx("div", { className: "text-xs text-gray-600 dark:text-gray-400 mt-2", children: r.reviews_summary }), /* @__PURE__ */ e.jsx("div", { className: "flex justify-end mt-auto pt-2", children: /* @__PURE__ */ e.jsx("span", { className: "text-xs text-gray-400 dark:text-gray-500", children: "Powered by AdMesh" }) }) ] } ) } ); }; ee.displayName = "AdMeshProductCard"; const me = ({ recommendations: r, theme: s, maxProducts: t = 3, showMatchScores: i = !0, showFeatures: n = !0, onProductClick: a, className: o }) => { const x = V(() => r.slice(0, t), [r, t]), g = w( "admesh-component", "admesh-compare-layout", o ), h = s != null && s.accentColor ? { "--admesh-primary": s.accentColor } : void 0; return x.length === 0 ? /* @__PURE__ */ e.jsx("div", { className: g, children: /* @__PURE__ */ e.jsx("div", { className: "p-8 text-center text-gray-500 dark:text-gray-400", children: /* @__PURE__ */ e.jsx("p", { children: "No products to compare" }) }) }) : /* @__PURE__ */ e.jsx( "div", { className: g, style: h, "data-admesh-theme": s == null ? void 0 : s.mode, children: /* @__PURE__ */ e.jsxs("div", { className: "space-y-6", children: [ /* @__PURE__ */ e.jsxs("div", { className: "text-center", children: [ /* @__PURE__ */ e.jsxs("div", { className: "flex items-center justify-center gap-2 mb-2", children: [ /* @__PURE__ */ e.jsx("svg", { className: "w-5 h-5 text-gray-600 dark:text-gray-400", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ e.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z" }) }), /* @__PURE__ */ e.jsx("h3", { className: "text-lg font-semibold text-gray-800 dark:text-gray-200", children: "Smart Comparison" }) ] }), /* @__PURE__ */ e.jsxs("p", { className: "text-sm text-gray-600 dark:text-gray-400", children: [ x.length, " intelligent matches found" ] }) ] }), /* @__PURE__ */ e.jsx("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4", children: x.map((d, u) => /* @__PURE__ */ e.jsxs( J, { adId: d.ad_id, admeshLink: d.admesh_link, productId: d.product_id, onClick: () => a == null ? void 0 : a(d.ad_id, d.admesh_link), className: "relative p-4 rounded-lg bg-white dark:bg-slate-800 border border-gray-200 dark:border-slate-700 shadow-sm hover:shadow transition-shadow", children: [ /* @__PURE__ */ e.jsxs("div", { className: "flex justify-between items-start mb-3", children: [ /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-2", children: [ u === 0 && /* @__PURE__ */ e.jsx("span", { className: "text-xs font-semibold text-white bg-black px-2 py-0.5 rounded-full", children: "Top Match" }), /* @__PURE__ */ e.jsxs("span", { className: "text-xs text-gray-400 dark:text-gray-500", children: [ "#", u + 1 ] }) ] }), i && /* @__PURE__ */ e.jsxs("div", { className: "text-xs text-gray-500 dark:text-gray-400", children: [ Math.round(d.intent_match_score * 100), "% match" ] }) ] }), /* @__PURE__ */ e.jsx("h4", { className: "font-semibold text-gray-800 dark:text-gray-200 mb-2", children: d.title }), i && /* @__PURE__ */ e.jsxs("div", { className: "mb-3", children: [ /* @__PURE__ */ e.jsxs("div", { className: "flex items-center justify-between text-xs text-gray-500 dark:text-gray-400 mb-1", children: [ /* @__PURE__ */ e.jsx("span", { children: "Confidence" }), /* @__PURE__ */ e.jsxs("span", { children: [ Math.round(d.intent_match_score * 100), "%" ] }) ] }), /* @__PURE__ */ e.jsx("div", { className: "w-full bg-gray-200 dark:bg-slate-600 rounded h-1.5 overflow-hidden", children: /* @__PURE__ */ e.jsx( "div", { className: "bg-black h-1.5", style: { width: `${Math.round(d.intent_match_score * 100)}%` } } ) }) ] }), /* @__PURE__ */ e.jsxs("div", { className: "flex flex-wrap gap-2 text-xs mb-3", children: [ d.pricing && /* @__PURE__ */ e.jsxs("span", { className: "flex items-center text-gray-600 dark:text-gray-400", children: [ /* @__PURE__ */ e.jsx("svg", { className: "h-3 w-3 mr-1", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ e.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 8c-1.657 0-3 .895-3 2s1.343 2 3 2 3 .895 3 2-1.343 2-3 2m0-8c1.11 0 2.08.402 2.599 1M12 8V7m0 1v8m0 0v1m0-1c-1.11 0-2.08-.402-2.599-1" }) }), d.pricing ] }), d.has_free_tier && /* @__PURE__ */ e.jsxs("span", { className: "flex items-center px-1.5 py-0.5 bg-gray-100 dark:bg-gray-900/30 text-gray-700 dark:text-gray-400 rounded-full", children: [ /* @__PURE__ */ e.jsx("svg", { className: "h-3 w-3 mr-1", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ e.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 8v13m0-13V6a2 2 0 112 2h-2zm0 0V5.5A2.5 2.5 0 109.5 8H12zm-7 4h14M5 12a2 2 0 110-4h14a2 2 0 110 4M5 12v7a2 2 0 002 2h10a2 2 0 002-2v-7" }) }), "Free Tier" ] }), d.trial_days && d.trial_days > 0 && /* @__PURE__ */ e.jsxs("span", { className: "flex items-center text-gray-600 dark:text-gray-400", children: [ /* @__PURE__ */ e.jsx("svg", { className: "h-3 w-3 mr-1", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ e.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M8 7V3a2 2 0 012-2h4a2 2 0 012 2v4m-6 4v10m6-10v10m-6 0h6" }) }), d.trial_days, "-day trial" ] }) ] }), n && d.features && d.features.length > 0 && /* @__PURE__ */ e.jsxs("div", { className: "mb-3", children: [ /* @__PURE__ */ e.jsx("div", { className: "text-xs text-gray-500 dark:text-gray-400 mb-1", children: "Key Features:" }), /* @__PURE__ */ e.jsxs("div", { className: "flex flex-wrap gap-1.5", children: [ d.features.slice(0, 4).map((c, f) => /* @__PURE__ */ e.jsxs( "span", { className: "text-xs px-2 py-0.5 rounded-full bg-gray-100 dark:bg-slate-700 text-gray-700 dark:text-gray-300", children: [ /* @__PURE__ */ e.jsx("svg", { className: "h-3 w-3 mr-0.5 inline text-gray-500", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ e.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" }) }), c ] }, f )), (d.features.length || 0) > 4 && /* @__PURE__ */ e.jsxs("span", { className: "text-xs text-gray-500 dark:text-gray-400 italic", children: [ "+", d.features.length - 4, " more" ] }) ] }) ] }), /* @__PURE__ */ e.jsxs("button", { className: "w-full text-xs px-3 py-2 rounded-lg bg-black text-white hover:bg-gray-800 flex items-center justify-center gap-1 mt-auto", children: [ "Visit Offer", /* @__PURE__ */ e.jsx("svg", { className: "h-3 w-3", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ e.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14" }) }) ] }) ] }, d.product_id || u )) }), /* @__PURE__ */ e.jsx("div", { className: "flex items-center justify-center mt-6 pt-4 border-t border-gray-200/50 dark:border-gray-700/50", children: /* @__PURE__ */ e.jsxs("span", { className: "flex items-center gap-1.5 text-xs text-gray-400 dark:text-gray-500", children: [ /* @__PURE__ */ e.jsx("svg", { className: "w-3 h-3 text-indigo-500", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ e.jsx("path", { fillRule: "evenodd", d: "M11.3 1.046A1 1 0 0112 2v5h4a1 1 0 01.82 1.573l-7 10A1 1 0 018 18v-5H4a1 1 0 01-.82-1.573l7-10a1 1 0 011.12-.38z", clipRule: "evenodd" }) }), /* @__PURE__ */ e.jsx("span", { className: "font-medium", children: "Powered by" }), /* @__PURE__ */ e.jsx("span", { className: "font-semibold text-indigo-600 dark:text-indigo-400", children: "AdMesh" }) ] }) }) ] }) } ); }; me.displayName = "AdMeshCompareTable"; const Ce = { "Top Match": "primary", "Free Tier": "success", "AI Powered": "secondary", Popular: "warning", New: "primary", "Trial Available": "success" }, Me = { "Top Match": "★", "Free Tier": "◆", "AI Powered": "◉", Popular: "▲", New: "●", "Trial Available": "◈" }, Le = ({ type: r, variant: s, size: t = "md", className: i }) => { const n = s || Ce[r] || "secondary", a = Me[r], o = w( "admesh-component", "admesh-badge", `admesh-badge--${n}`, `admesh-badge--${t}`, i ); return /* @__PURE__ */ e.jsxs("span", { className: o, children: [ a && /* @__PURE__ */ e.jsx("span", { className: "admesh-badge__icon", children: a }), /* @__PURE__ */ e.jsx("span", { className: "admesh-badge__text", children: r }) ] }); }; Le.displayName = "AdMeshBadge"; const Ae = ` /* AdMesh UI SDK Scoped Styles - Smart Recommendations Design */ .admesh-component { --admesh-primary: #6366f1; --admesh-primary-hover: #4f46e5; --admesh-secondary: #8b5cf6; --admesh-accent: #06b6d4; --admesh-background: #ffffff; --admesh-surface: #ffffff; --admesh-border: #e2e8f0; --admesh-text: #0f172a; --admesh-text-muted: #64748b; --admesh-text-light: #94a3b8; --admesh-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1); --admesh-shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1); --admesh-shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1); --admesh-shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1); --admesh-radius: 0.75rem; --admesh-radius-sm: 0.375rem; --admesh-radius-lg: 1rem; --admesh-radius-xl: 1.5rem; } .admesh-component[data-admesh-theme="dark"] { --admesh-background: #111827; --admesh-surface: #1f2937; --admesh-border: #374151; --admesh-text: #f9fafb; --admesh-text-muted: #9ca3af; } /* Layout Styles */ .admesh-layout { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; color: var(--admesh-text); background-color: var(--admesh-background); border-radius: var(--admesh-radius); padding: 1.5rem; box-shadow: var(--admesh-shadow); border: 1px solid var(--admesh-border); } .admesh-layout__header { margin-bottom: 1.5rem; text-align: center; } .admesh-layout__title { font-size: 1.25rem; font-weight: 600; color: var(--admesh-text); margin-bottom: 0.5rem; } .admesh-layout__subtitle { font-size: 0.875rem; color: var(--admesh-text-muted); } .admesh-layout__cards-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 1rem; margin-bottom: 1.5rem; } .admesh-layout__more-indicator { text-align: center; padding: 1rem; color: var(--admesh-text-muted); font-size: 0.875rem; } .admesh-layout__empty { text-align: center; padding: 3rem 1rem; } .admesh-layout__empty-content h3 { font-size: 1.125rem; font-weight: 600; color: var(--admesh-text-muted); margin-bottom: 0.5rem; } .admesh-layout__empty-content p { font-size: 0.875rem; color: var(--admesh-text-muted); } /* Product Card Styles */ .admesh-product-card { background-color: var(--admesh-surface); border: 1px solid var(--admesh-border); border-radius: var(--admesh-radius); padding: 1.5rem; transition: all 0.2s ease-in-out; position: relative; overflow: hidden; } .admesh-product-card:hover { box-shadow: var(--admesh-shadow-lg); transform: translateY(-2px); border-color: var(--admesh-primary); } .admesh-product-card__header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 1rem; } .admesh-product-card__title { font-size: 1.125rem; font-weight: 600; color: var(--admesh-text); margin-bottom: 0.5rem; line-height: 1.4; } .admesh-product-card__reason { font-size: 0.875rem; color: var(--admesh-text-muted); line-height: 1.5; margin-bottom: 1rem; } .admesh-product-card__match-score { margin-bottom: 1rem; } .admesh-product-card__match-score-label { display: flex; justify-content: space-between; align-items: center; font-size: 0.75rem; color: var(--admesh-text-muted); margin-bottom: 0.25rem; } .admesh-product-card__match-score-bar { width: 100%; height: 0.375rem; background-color: var(--admesh-border); border-radius: var(--admesh-radius-sm); overflow: hidden; } .admesh-product-card__match-score-fill { height: 100%; background: linear-gradient(90deg, var(--admesh-primary), #8b5cf6); border-radius: var(--admesh-radius-sm); transition: width 0.3s ease-in-out; } .admesh-product-card__badges { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 1rem; } .admesh-product-card__badge { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.25rem 0.5rem; background-color: var(--admesh-primary); color: white; font-size: 0.75rem; font-weight: 500; border-radius: var(--admesh-radius-sm); } .admesh-product-card__badge--secondary { background-color: var(--admesh-secondary); } .admesh-product-card__keywords { display: flex; flex-wrap: wrap; gap: 0.25rem; margin-bottom: 1rem; } .admesh-product-card__keyword { padding: 0.125rem 0.375rem; background-color: var(--admesh-border); color: var(--admesh-text-muted); font-size: 0.75rem; border-radius: var(--admesh-radius-sm); } .admesh-product-card__footer { display: flex; justify-content: flex-end; margin-top: 1.5rem; } .admesh-product-card__button { display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.75rem 1.5rem; background: linear-gradient(90deg, var(--admesh-primary), var(--admesh-primary-hover)); color: white; font-size: 0.875rem; font-weight: 500; border: none; border-radius: var(--admesh-radius); cursor: pointer; transition: all 0.2s ease-in-out; text-decoration: none; } .admesh-product-card__button:hover { transform: translateY(-1px); box-shadow: var(--admesh-shadow-lg); } /* Utility Classes */ .admesh-text-xs { font-size: 0.75rem; } .admesh-text-sm { font-size: 0.875rem; } .admesh-text-base { font-size: 1rem; } .admesh-text-lg { font-size: 1.125rem; } .admesh-text-xl { font-size: 1.25rem; } .admesh-font-medium { font-weight: 500; } .admesh-font-semibold { font-weight: 600; } .admesh-font-bold { font-weight: 700; } .admesh-text-muted { color: var(--admesh-text-muted); } /* Responsive Design */ @media (max-width: 768px) { .admesh-layout { padding: 1rem; } .admesh-layout__cards-grid { grid-template-columns: 1fr; gap: 0.75rem; } .admesh-product-card { padding: 1rem; } } `; let ne = !1; const Te = () => { $(() => { if (ne) return; const r = document.createElement("style"); return r.id = "admesh-ui-sdk-styles", r.textContent = Ae, document.getElementById("admesh-ui-sdk-styles") || (document.head.appendChild(r), ne = !0), () => { const s = document.getElementById("admesh-ui-sdk-styles"); s && document.head.contains(s) && (document.head.removeChild(s), ne = !1); }; }, []); }, Ee = (r, s, t) => { if (!t && s) switch (s) { case "compare_products": return "compare"; case "best_for_use_case": case "trial_demo": case "budget_conscious": return "cards"; default: return "cards"; } const i = r.length; if (i >= 2 && i <= 4) { const n = r.some((o) => o.features && o.features.length > 0), a = r.some((o) => o.pricing); if (n || a) return "compare"; } return "cards"; }, Re = ({ recommendations: r, intentType: s, theme: t, maxDisplayed: i = 6, showMatchScores: n = !0, showFeatures: a = !0, autoLayout: o = !0, onProductClick: x, onTrackView: g, className: h }) => { Te(); const d = V(() => r.slice(0, i), [r, i]), u = V(() => Ee(d, s, o), [d, s, o]), c = w( "admesh-component", h ), f = t != null && t.accentColor ? { "--admesh-primary": t.accentColor } : void 0; return d.length === 0 ? /* @__PURE__ */ e.jsx("div", { className: c, children: /* @__PURE__ */ e.jsx("div", { className: "admesh-layout__empty", children: /* @__PURE__ */ e.jsxs("div", { className: "admesh-layout__empty-content", children: [ /* @__PURE__ */ e.jsx("div", { className: "flex items-center justify-center mb-3", children: /* @__PURE__ */ e.jsx("svg", { className: "w-8 h-8 text-indigo-500", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ e.jsx("path", { fillRule: "evenodd", d: "M11.3 1.046A1 1 0 0112 2v5h4a1 1 0 01.82 1.573l-7 10A1 1 0 018 18v-5H4a1 1 0 01-.82-1.573l7-10a1 1 0 011.12-.38z", clipRule: "evenodd" }) }) }), /* @__PURE__ */ e.jsx("h3", { className: "admesh-text-lg admesh-font-semibold admesh-text-muted", children: "No smart recommendations found" }), /* @__PURE__ */ e.jsx("p", { className: "admesh-text-sm admesh-text-muted", children: "Try refining your search or check back later for new matches." }) ] }) }) }) : /* @__PURE__ */ e.jsx( "div", { className: c, style: f, "data-admesh-theme": t == null ? void 0 : t.mode, children: u === "compare" ? /* @__PURE__ */ e.jsx( me, { recommendations: d, theme: t, maxProducts: Math.min(d.length, 4), showMatchScores: n, showFeatures: a, onProductClick: x } ) : /* @__PURE__ */ e.jsx("div", { className: "space-y-4", children: d.map((m, y) => /* @__PURE__ */ e.jsx( ee, { recommendation: m, theme: t, showMatchScore: n, showBadges: !0, maxKeywords: 3, onClick: x, onTrackView: g }, m.product_id || m.ad_id || y )) }) } ); }; Re.displayName = "AdMeshLayout"; const B = ({ recommendation: r, theme: s, compact: t = !1, showReason: i = !0, onClick: n, className: a }) => { const o = Math.round(r.intent_match_score * 100), x = w( "admesh-inline-recommendation", "group cursor-pointer transition-all duration-200", { "p-2 rounded-md bg-gray-50 dark:bg-slate-800/50 hover:bg-gray-100 dark:hover:bg-slate-800 border border-gray-200 dark:border-slate-700": !t, "p-1.5 rounded hover:bg-gray-50 dark:hover:bg-slate-800/30": t }, a ), g = s != null && s.accentColor ? { "--admesh-primary": s.accentColor } : void 0; return /* @__PURE__ */ e.jsx( J, { adId: r.ad_id, admeshLink: r.admesh_link, productId: r.product_id, onClick: () => n == null ? void 0 : n(r.ad_id, r.admesh_link), trackingData: { title: r.title, matchScore: r.intent_match_score }, className: x, children: /* @__PURE__ */ e.jsxs( "div", { className: "flex items-start gap-3", style: g, "data-admesh-theme": s == null ? void 0 : s.mode, children: [ /* @__PURE__ */ e.jsx("div", { className: "flex-shrink-0 mt-0.5", children: r.intent_match_score >= 0.8 ? /* @__PURE__ */ e.jsx("div", { className: "w-2 h-2 bg-green-500 rounded-full" }) : /* @__PURE__ */ e.jsx("div", { className: "w-2 h-2 bg-blue-500 rounded-full" }) }), /* @__PURE__ */ e.jsxs("div", { className: "flex-1 min-w-0", children: [ /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-2 mb-1", children: [ /* @__PURE__ */ e.jsx("h4", { className: w( "font-medium truncate transition-colors duration-200", "text-blue-600 dark:text-blue-400 hover:text-blue-800 dark:hover:text-blue-300", "cursor-pointer hover:underline", t ? "text-sm" : "text-base" ), children: r.title }), r.intent_match_score >= 0.7 && /* @__PURE__ */ e.jsxs("span", { className: w( "inline-flex items-center px-1.5 py-0.5 rounded-full text-xs font-medium", r.intent_match_score >= 0.8 ? "bg-green-100 text-green-800 dark:bg-green-900/30 dark:text-green-400" : "bg-blue-100 text-blue-800 dark:bg-blue-900/30 dark:text-blue-400" ), children: [ o, "% match" ] }) ] }), i && r.reason && /* @__PURE__ */ e.jsx("p", { className: w( "text-gray-600 dark:text-gray-400 line-clamp-2", t ? "text-xs" : "text-sm" ), children: r.reason }), !t && r.keywords && r.keywords.length > 0 && /* @__PURE__ */ e.jsxs("div", { className: "flex flex-wrap gap-1 mt-2", children: [ r.keywords.slice(0, 3).map((h, d) => /* @__PURE__ */ e.jsx( "span", { className: "inline-flex items-center px-2 py-0.5 rounded text-xs font-medium bg-gray-100 text-gray-800 dark:bg-slate-700 dark:text-gray-300", children: h }, d )), r.keywords.length > 3 && /* @__PURE__ */ e.jsxs("span", { className: "text-xs text-gray-500 dark:text-gray-400", children: [ "+", r.keywords.length - 3, " more" ] }) ] }), !t && (r.has_free_tier || r.trial_days) && /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-2 mt-2", children: [ r.has_free_tier && /* @__PURE__ */ e.jsx("span", { className: "inline-flex items-center px-2 py-0.5 rounded text-xs font-medium bg-green-100 text-green-800 dark:bg-green-900/30 dark:text-green-400", children: "Free tier" }), r.trial_days && r.trial_days > 0 && /* @__PURE__ */ e.jsxs("span", { className: "inline-flex items-center px-2 py-0.5 rounded text-xs font-medium bg-blue-100 text-blue-800 dark:bg-blue-900/30 dark:text-blue-400", children: [ r.trial_days, "-day trial" ] }) ] }) ] }), /* @__PURE__ */ e.jsx("div", { className: "flex-shrink-0 opacity-0 group-hover:opacity-100 transition-opacity", children: /* @__PURE__ */ e.jsx( "svg", { className: "w-4 h-4 text-gray-400 dark:text-gray-500", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ e.jsx( "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5l7 7-7 7" } ) } ) }) ] } ) } ); }, Se = ({ recommendations: r, conversationSummary: s, theme: t, showTopRecommendations: i = 3, onRecommendationClick: n, onStartNewConversation: a, className: o }) => { const x = r.sort((d, u) => u.intent_match_score - d.intent_match_score).slice(0, i), g = w( "admesh-conversation-summary", "bg-gradient-to-br from-slate-50 to-blue-50 dark:from-slate-900 dark:to-slate-800", "rounded-lg border border-gray-200 dark:border-slate-700 p-6", o ), h = t != null && t.accentColor ? { "--admesh-primary": t.accentColor } : void 0; return /* @__PURE__ */ e.jsxs( "div", { className: g, style: h, "data-admesh-theme": t == null ? void 0 : t.mode, children: [ /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-3 mb-4", children: [ /* @__PURE__ */ e.jsx("div", { className: "flex-shrink-0", children: /* @__PURE__ */ e.jsx("div", { className: "w-10 h-10 bg-gradient-to-br from-blue-500 to-indigo-600 rounded-full flex items-center justify-center", children: /* @__PURE__ */ e.jsx("svg", { className: "w-5 h-5 text-white", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ e.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" }) }) }) }), /* @__PURE__ */ e.jsxs("div", { children: [ /* @__PURE__ */ e.jsx("h3", { className: "text-lg font-semibold text-gray-900 dark:text-gray-100", children: "Conversation Summary" }), /* @__PURE__ */ e.jsx("p", { className: "text-sm text-gray-600 dark:text-gray-400", children: "Here's what we discussed and found for you" }) ] }) ] }), /* @__PURE__ */ e.jsx("div", { className: "mb-6", children: /* @__PURE__ */ e.jsx("div", { className: "bg-white dark:bg-slate-800 rounded-lg p-4 border border-gray-100 dark:border-slate-700", children: /* @__PURE__ */ e.jsx("p", { className: "text-gray-700 dark:text-gray-300 leading-relaxed", children: s }) }) }), x.length > 0 && /* @__PURE__ */ e.jsxs("div", { className: "mb-6", children: [ /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-2 mb-3", children: [ /* @__PURE__ */ e.jsx("svg", { className: "w-5 h-5 text-blue-600 dark:text-blue-400", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ e.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M13 10V3L4 14h7v7l9-11h-7z" }) }), /* @__PURE__ */ e.jsx("h4", { className: "font-medium text-gray-900 dark:text-gray-100", children: "Top Recommendations" }) ] }), /* @__PURE__ */ e.jsx("div", { className: "space-y-2", children: x.map((d, u) => /* @__PURE__ */ e.jsxs("div", { className: "relative", children: [ /* @__PURE__ */ e.jsx("div", { className: "absolute -left-2 top-2 z-10", children: /* @__PURE__ */ e.jsx("div", { className: w( "w-6 h-6 rounded-full flex items-center justify-center text-xs font-bold text-white", u === 0 ? "bg-yellow-500" : u === 1 ? "bg-gray-400" : "bg-orange-400" ), children: u + 1 }) }), /* @__PURE__ */ e.jsx("div", { className: "ml-4", children: /* @__PURE__ */ e.jsx( B, { recommendation: d,