mongodb-chatbot-ui
Version:
UI React components for the MongoDB Chatbot Framework
481 lines (464 loc) • 18.7 kB
JavaScript
import p, { isValidElement as un, useState as cn, useEffect as fn, useMemo as hn } from "react";
import { m as r, z as M, ac as y, a2 as b, Y as v, v as m, aN as C, a3 as w, F as f, ag as Je, T as K, ab as G, b as mn, Q as pn, aI as gn, d as z, aO as O, n as x, ah as J, ad as bn, aU as yn } from "./index2.js";
import { S as vn, E as xn, B as Fn } from "./OpenNewTab.js";
function W(e, t) {
t > e.length && (t = e.length);
for (var n = 0, a = Array(t); n < t; n++)
a[n] = e[n];
return a;
}
function u(e, t, n) {
return (t = function(a) {
var i = function(l, s) {
if (typeof l != "object" || !l)
return l;
var d = l[Symbol.toPrimitive];
if (d !== void 0) {
var c = d.call(l, s);
if (typeof c != "object")
return c;
throw new TypeError("@@toPrimitive must return a primitive value.");
}
return String(l);
}(a, "string");
return typeof i == "symbol" ? i : i + "";
}(t)) in e ? Object.defineProperty(e, t, { value: n, enumerable: !0, configurable: !0, writable: !0 }) : e[t] = n, e;
}
function F() {
return F = Object.assign ? Object.assign.bind() : function(e) {
for (var t = 1; t < arguments.length; t++) {
var n = arguments[t];
for (var a in n)
({}).hasOwnProperty.call(n, a) && (e[a] = n[a]);
}
return e;
}, F.apply(null, arguments);
}
function S(e, t) {
if (e == null)
return {};
var n, a, i = function(s, d) {
if (s == null)
return {};
var c = {};
for (var h in s)
if ({}.hasOwnProperty.call(s, h)) {
if (d.indexOf(h) !== -1)
continue;
c[h] = s[h];
}
return c;
}(e, t);
if (Object.getOwnPropertySymbols) {
var l = Object.getOwnPropertySymbols(e);
for (a = 0; a < l.length; a++)
n = l[a], t.indexOf(n) === -1 && {}.propertyIsEnumerable.call(e, n) && (i[n] = e[n]);
}
return i;
}
function kn(e, t) {
return function(n) {
if (Array.isArray(n))
return n;
}(e) || function(n, a) {
var i = n == null ? null : typeof Symbol < "u" && n[Symbol.iterator] || n["@@iterator"];
if (i != null) {
var l, s, d, c, h = [], g = !0, k = !1;
try {
if (d = (i = i.call(n)).next, a !== 0)
for (; !(g = (l = d.call(i)).done) && (h.push(l.value), h.length !== a); g = !0)
;
} catch (N) {
k = !0, s = N;
} finally {
try {
if (!g && i.return != null && (c = i.return(), Object(c) !== c))
return;
} finally {
if (k)
throw s;
}
}
return h;
}
}(e, t) || function(n, a) {
if (n) {
if (typeof n == "string")
return W(n, a);
var i = {}.toString.call(n).slice(8, -1);
return i === "Object" && n.constructor && (i = n.constructor.name), i === "Map" || i === "Set" ? Array.from(n) : i === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(i) ? W(n, a) : void 0;
}
}(e, t) || function() {
throw new TypeError(`Invalid attempt to destructure non-iterable instance.
In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`);
}();
}
function o(e, t) {
return t || (t = e.slice(0)), Object.freeze(Object.defineProperties(e, { raw: { value: Object.freeze(t) } }));
}
function q(e) {
return q = typeof Symbol == "function" && typeof Symbol.iterator == "symbol" ? function(t) {
return typeof t;
} : function(t) {
return t && typeof Symbol == "function" && t.constructor === Symbol && t !== Symbol.prototype ? "symbol" : typeof t;
}, q(e);
}
var X, $, ee, ne, te, ae, re, oe, U = r(X || (X = o([`
margin: unset;
font-family: `, `;
color: `, `;
`])), M.default, y.light.text.primary.default), Ke = u(u({}, v.Body1, r($ || ($ = o([`
font-size: `, `px;
line-height: `, `px;
`])), b.body1.fontSize, b.body1.lineHeight)), v.Body2, r(ee || (ee = o([`
font-size: `, `px;
line-height: `, `px;
`])), b.body2.fontSize, b.body2.lineHeight)), Dn = u(u({}, v.Body1, r(ne || (ne = o([`
font-size: `, `px;
line-height: `, `px;
`])), b.code1.fontSize, b.code1.lineHeight)), v.Body2, r(te || (te = o([`
font-size: `, `px;
line-height: `, `px;
`])), b.code2.fontSize, b.code2.lineHeight)), R = u(u({}, m.Light, r(ae || (ae = o([`
color: `, `;
`])), y.light.text.primary.default)), m.Dark, r(re || (re = o([`
color: `, `;
`])), y.dark.text.primary.default)), H = function(e) {
var t = gn();
return e ? e === 16 ? v.Body2 : v.Body1 : t === 16 ? v.Body2 : v.Body1;
}, Nn = ["baseFontSize", "darkMode", "className", "weight", "as"], We = C(function(e) {
var t = e.baseFontSize, n = e.darkMode, a = e.className, i = e.weight, l = i === void 0 ? "regular" : i, s = e.as, d = s === void 0 ? "p" : s, c = S(e, Nn), h = z(n).theme, g = H(t), k = O(d).Component, N = r(oe || (oe = o([`
font-weight: `, `;
strong,
b {
font-weight: `, `;
}
`])), w[l], w.bold);
return p.createElement(k, F({ className: x(U, Ke[g], R[h], N, a) }, c));
});
We.displayName = "Body";
var ie, le, se, de, ht = We, wn = "lg-typography", Y = function() {
var e = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : wn;
return { root: e, label: "".concat(e, "-label"), description: "".concat(e, "-description") };
}, zn = function(e) {
return r(ie || (ie = o([`
color: `, `;
font-family: `, `;
font-weight: `, `;
margin-top: 0;
margin-bottom: 0;
`])), y[e].text.secondary.default, M.default, w.regular);
}, Sn = function(e) {
return r(le || (le = o([`
color: `, `;
`])), y[e].text.disabled.default);
}, En = u(u({}, v.Body1, r(se || (se = o([`
font-size: `, `px;
line-height: `, `px;
`])), b.body1.fontSize, b.body1.lineHeight)), v.Body2, r(de || (de = o([`
font-size: `, `px;
line-height: 20px; // Hardcoding because it does not match body2 lineHeight
`])), b.body2.fontSize)), Bn = ["as", "baseFontSize", "children", "className", "darkMode", "data-lgid", "disabled"], Xe = C(function(e) {
var t = e.as, n = e.baseFontSize, a = e.children, i = e.className, l = e.darkMode, s = e["data-lgid"], d = e.disabled, c = d !== void 0 && d, h = S(e, Bn), g = z(l).theme, k = H(n), N = ["string", "number"].includes(q(a)) ? "p" : "div", B = O(t ?? N).Component;
return p.createElement(B, F({ "data-lgid": Y(s).description, "data-testid": Y(s).description, className: x(zn(g), En[k], u({}, Sn(g), c), i) }, h), a);
});
Xe.displayName = "Description";
var ue, ce, fe, he, mt = Xe;
u(u({}, m.Light, r(ue || (ue = o([`
color: `, `;
`])), y.light.text.secondary.default)), m.Dark, r(ce || (ce = o([`
color: `, `;
`])), y.dark.text.secondary.default));
r(fe || (fe = o([`
display: block;
font-size: 11px;
line-height: 16px;
letter-spacing: 0.2px;
`])));
var me, pe, ge, Mn = function(e) {
var t = e.theme, n = e.baseFontSize, a = n === v.Body1 ? b.body1.fontSize : b.body2.fontSize, i = n === v.Body1 ? b.body1.lineHeight : 20;
return r(he || (he = o([`
font-family: `, `;
font-weight: `, `;
font-size: inherit;
line-height: inherit;
/* Unsets browser defaults */
margin-block-start: 0;
margin-block-end: 0;
/* Variable Styles */
color: `, `;
font-size: `, `px;
line-height: `, `px;
`])), M.default, w.regular, y[t].text.error.default, a, i);
}, Cn = ["as", "darkMode", "children", "className"], pt = C(function(e) {
var t = e.as, n = t === void 0 ? "p" : t, a = e.darkMode, i = e.children, l = e.className, s = S(e, Cn), d = z(a).theme, c = H(), h = O(n).Component;
return p.createElement(h, F({}, s, { className: x(Mn({ theme: d, baseFontSize: c }), l) }), i);
}), On = r(me || (me = o([`
font-weight: `, `;
font-size: 48px;
line-height: 64px;
font-family: `, `;
`])), w.regular, M.serif), jn = u(u({}, m.Light, r(pe || (pe = o([`
color: `, `;
`])), f.green.dark2)), m.Dark, r(ge || (ge = o([`
color: `, `;
`])), f.gray.light2)), An = ["darkMode", "className", "as"], $e = C(function(e) {
var t = e.darkMode, n = e.className, a = e.as, i = a === void 0 ? "h1" : a, l = S(e, An), s = z(t).theme, d = O(i).Component;
return p.createElement(d, F({ className: x(U, On, jn[s], n) }, l));
});
$e.displayName = "H1";
var be, ye, ve, gt = $e, Hn = r(be || (be = o([`
font-size: 32px;
line-height: 40px;
font-weight: `, `;
font-family: `, `;
`])), w.regular, M.serif), Ln = u(u({}, m.Light, r(ye || (ye = o([`
color: `, `;
`])), f.green.dark2)), m.Dark, r(ve || (ve = o([`
color: `, `;
`])), f.gray.light2)), Pn = ["darkMode", "className", "as"], en = C(function(e) {
var t = e.darkMode, n = e.className, a = e.as, i = a === void 0 ? "h2" : a, l = S(e, Pn), s = z(t).theme, d = O(i).Component;
return p.createElement(d, F({ className: x(U, Hn, Ln[s], n) }, l));
});
en.displayName = "H2";
var xe, bt = en, In = r(xe || (xe = o([`
font-size: 24px;
line-height: 32px;
font-weight: `, `;
`])), w.medium), Un = ["darkMode", "className", "as"], nn = C(function(e) {
var t = e.darkMode, n = e.className, a = e.as, i = a === void 0 ? "h3" : a, l = S(e, Un), s = z(t).theme, d = O(i).Component;
return p.createElement(d, F({ className: x(U, In, R[s], n) }, l));
});
nn.displayName = "H3";
var Fe, ke, De, Ne, we, ze, Se, Ee, Be, Me, yt = nn, I = Je(), Tn = r(Fe || (Fe = o([`
display: inline;
transition: all 0.15s ease-in-out;
border-radius: 3px;
font-family: `, `;
line-height: 20px;
.`, `:hover > & {
text-decoration: none;
}
`])), M.code, I), _n = u(u({}, m.Light, r(ke || (ke = o([`
background-color: `, `;
border: 1px solid `, `;
color: `, `;
.`, `:hover > & {
box-shadow: 0 0 0 3px `, `;
border: 1px solid `, `;
}
`])), y.light.background.secondary.default, y.light.border.secondary.default, f.gray.dark3, I, f.gray.light2, f.gray.light1)), m.Dark, r(De || (De = o([`
background-color: `, `;
border: 1px solid `, `;
color: `, `;
.`, `:hover > & {
box-shadow: 0 0 0 3px `, `;
border: 1px solid `, `;
}
`])), y.dark.background.secondary.default, f.gray.dark2, f.gray.light1, I, f.gray.dark2, f.gray.dark1)), Qn = u(u({}, m.Light, r(Ne || (Ne = o([`
.`, `:focus-visible > & {
box-shadow: `, `;
border: 1px solid `, `;
}
`])), I, K[m.Light].default, f.blue.base)), m.Dark, r(we || (we = o([`
.`, `:focus-visible > & {
box-shadow: `, `;
border: 1px solid `, `;
}
`])), I, K[m.Dark].default, f.blue.base)), Yn = u(u({}, m.Light, r(ze || (ze = o([`
color: `, `;
`])), f.blue.base)), m.Dark, r(Se || (Se = o([`
color: `, `;
`])), f.blue.light1)), Vn = r(Ee || (Ee = o([`
text-decoration: none;
margin: 0;
padding: 0;
line-height: 20px;
&:focus {
outline: none;
}
`]))), Rn = r(Be || (Be = o([`
white-space: nowrap;
`]))), Zn = r(Me || (Me = o([`
white-space: normal;
`]))), qn = ["children", "className", "darkMode", "baseFontSize", "as"], tn = G(function(e, t) {
var n = e.children, a = e.className, i = e.darkMode, l = e.baseFontSize, s = e.as, d = S(e, qn), c = z(i).theme, h = H(l), g = J(s, d, "code").Component, k = function(E) {
var T, _, j, L, P, D;
return typeof E == "string" ? (T = (_ = E.match(/(?:[\0-\t\x0B\f\x0E-\u2027\u202A-\uD7FF\uE000-\uFFFF]|[\uD800-\uDBFF][\uDC00-\uDFFF]|[\uD800-\uDBFF](?![\uDC00-\uDFFF])|(?:[^\uD800-\uDBFF]|^)[\uDC00-\uDFFF])/g)) === null || _ === void 0 ? void 0 : _.length) !== null && T !== void 0 ? T : 0 : Array.isArray(E) && E.every(function(Z) {
return typeof Z == "string";
}) ? (j = (L = E.join("").match(/(?:[\0-\t\x0B\f\x0E-\u2027\u202A-\uD7FF\uE000-\uFFFF]|[\uD800-\uDBFF][\uDC00-\uDFFF]|[\uD800-\uDBFF](?![\uDC00-\uDFFF])|(?:[^\uD800-\uDBFF]|^)[\uDC00-\uDFFF])/g)) === null || L === void 0 ? void 0 : L.length) !== null && j !== void 0 ? j : 0 : un(E) && (P = (D = bn(E).match(/(?:[\0-\t\x0B\f\x0E-\u2027\u202A-\uD7FF\uE000-\uFFFF]|[\uD800-\uDBFF][\uDC00-\uDFFF]|[\uD800-\uDBFF](?![\uDC00-\uDFFF])|(?:[^\uD800-\uDBFF]|^)[\uDC00-\uDFFF])/g)) === null || D === void 0 ? void 0 : D.length) !== null && P !== void 0 ? P : 0;
}(n), N = k <= 30 ? Rn : Zn, B = g !== "code", Q = p.createElement("code", { ref: t, className: x(Dn[h], Tn, _n[c], Qn[c], N, u({}, Yn[c], B), a) }, n);
return B ? p.createElement(g, F({ className: x(I, Vn, a) }, d), Q) : p.cloneElement(Q, d);
});
tn.displayName = "InlineCode";
var Ce, Oe, je, Ae, He, Le, Pe, vt = tn;
r(Ce || (Ce = o([`
font-family: `, `;
border: 1px solid;
border-radius: 3px;
padding-left: 5px;
padding-right: 5px;
`])), M.code);
u(u({}, m.Light, r(Oe || (Oe = o([`
color: `, `;
border-color: `, `;
background-color: `, `;
`])), y.light.text.primary.default, f.gray.dark3, f.white)), m.Dark, r(je || (je = o([`
color: `, `;
border-color: `, `;
background-color: `, `;
`])), y.dark.text.primary.default, f.gray.base, f.gray.dark3));
var Gn = function(e) {
return r(Ae || (Ae = o([`
color: `, `;
font-family: `, `;
font-weight: `, `;
`])), y[e].text.primary.default, M.default, w.bold);
}, Jn = function(e) {
return r(He || (He = o([`
color: `, `;
`])), y[e].text.disabled.default);
}, Kn = u(u({}, v.Body1, r(Le || (Le = o([`
font-size: `, `px;
line-height: `, `px;
`])), b.body1.fontSize, b.body1.lineHeight)), v.Body2, r(Pe || (Pe = o([`
font-size: `, `px;
line-height: 20px; // Hardcoding because it does not match body2 lineHeight
`])), b.body2.fontSize)), Wn = ["baseFontSize", "darkMode", "className", "children", "disabled", "as", "data-lgid"], an = C(function(e) {
var t = e.baseFontSize, n = e.darkMode, a = e.className, i = e.children, l = e.disabled, s = l !== void 0 && l, d = e.as, c = d === void 0 ? "label" : d, h = e["data-lgid"], g = S(e, Wn), k = z(n).theme, N = H(t), B = O(c).Component;
return p.createElement(B, F({ "data-lgid": Y(h).label, "data-testid": Y(h).label, className: x(Gn(k), Kn[N], u({}, Jn(k), s), a) }, g), i);
});
an.displayName = "Label";
var Ie, Ue, Te, _e, Qe, Ye, Ve, Re, xt = an, V = Je(), rn = r(Ie || (Ie = o([`
font-family: `, `;
display: inline;
align-items: center;
text-decoration: none;
text-decoration-color: transparent;
cursor: pointer;
font-size: inherit;
line-height: inherit;
appearance: none;
background: none;
border: none;
padding: 0;
&:hover,
&[data-hover='true'],
&:focus-visible,
&[data-focus='true'] {
text-decoration: underline;
transition: text-decoration `, `ms ease-in-out;
text-underline-offset: 4px;
text-decoration-thickness: 2px;
}
&:focus {
outline: none;
}
`])), M.default, mn.default), on = u(u({}, m.Light, r(Ue || (Ue = o([`
color: `, `;
font-weight: `, `;
&:hover,
&[data-hover='true'] {
text-decoration-color: `, `;
}
&:focus-visible,
&[data-focus='true'] {
text-decoration-color: `, `;
}
`])), f.blue.base, w.regular, f.gray.light2, f.blue.base)), m.Dark, r(Te || (Te = o([`
color: `, `;
font-weight: `, `;
&:hover,
&[data-hover='true'] {
text-decoration-color: `, `;
}
&:focus-visible,
&[data-focus='true'] {
text-decoration-color: `, `;
}
`])), f.blue.light1, w.bold, f.gray.dark2, f.blue.base)), ln = function(e) {
if (e)
return Ke[e];
}, Xn = r(_e || (_e = o([`
gap: `, `px;
display: inline-flex;
`])), pn[100]), $n = ["children", "className", "baseFontSize", "darkMode", "as"];
G(function(e, t) {
var n = e.children, a = e.className, i = e.baseFontSize, l = e.darkMode, s = e.as, d = S(e, $n), c = z(l).theme, h = H(i), g = J(s, d, "span").Component;
return p.createElement(g, F({ className: x(V, rn, ln(h), on[c], Xn, a), ref: t }, d), p.createElement(vn, { role: "presentation" }), n);
});
var et = r(Qe || (Qe = o([`
transform: translate3d(3px, 0, 0);
top: 1px;
position: relative;
`]))), nt = r(Ye || (Ye = o([`
opacity: 0;
transform: translate3d(-3px, 0, 0);
transition: 100ms ease-in;
transition-property: opacity, transform;
top: 1px;
position: relative;
.`, ":hover &, .", `[data-hover='true'] & {
opacity: 1;
transform: translate3d(3px, 0, 0);
}
`])), V, V), tt = r(Ve || (Ve = o([`
position: relative;
bottom: 2px;
left: -1px;
height: 12px;
`]))), at = "hover", rt = "persist", Ze = "none", ot = ["children", "className", "arrowAppearance", "hideExternalIcon", "baseFontSize", "darkMode", "as"], Ft = G(function(e, t) {
var n = e.children, a = e.className, i = e.arrowAppearance, l = i === void 0 ? Ze : i, s = e.hideExternalIcon, d = s !== void 0 && s, c = e.baseFontSize, h = e.darkMode, g = e.as, k = S(e, ot), N = kn(cn(""), 2), B = N[0], Q = N[1];
fn(function() {
Q(window.location.hostname);
}, []);
var E, T = z(h).theme, _ = H(c), j = J(g, k, "span"), L = j.Component, P = j.as, D = j.rest, Z = hn(function() {
if (yn(P, D))
return /^http(s)?:\/\//.test(D.href) ? new URL(D.href).hostname : B;
}, [P, D, B]), A = { target: void 0, rel: void 0 };
return D.target || D.rel ? (A.target = D.target, A.rel = D.rel) : L === "a" && (Z === B ? A.target = "_self" : (A.target = "_blank", A.rel = "noopener noreferrer")), A.target !== "_blank" || d ? l !== Ze && (E = p.createElement(xn, { role: "presentation", size: 12, className: x(u(u({}, nt, l === at), et, l === rt)) })) : E = p.createElement(Fn, { role: "presentation", className: tt }), p.createElement(L, F({ className: x(V, rn, ln(_), on[T], a), ref: t }, A, D), p.createElement("span", null, n), E);
}), it = r(Re || (Re = o([`
font-size: 12px;
font-weight: `, `;
text-transform: uppercase;
line-height: 20px;
letter-spacing: 0.4px;
`])), w.bold), lt = ["darkMode", "className", "as"], sn = C(function(e) {
var t = e.darkMode, n = e.className, a = e.as, i = a === void 0 ? "div" : a, l = S(e, lt), s = z(t).theme, d = O(i).Component;
return p.createElement(d, F({ className: x(U, it, R[s], n) }, l));
});
sn.displayName = "Overline";
var qe, kt = sn, st = r(qe || (qe = o([`
font-size: 18px;
line-height: 24px;
font-weight: `, `;
`])), w.bold), dt = ["darkMode", "className", "as"], dn = C(function(e) {
var t = e.darkMode, n = e.className, a = e.as, i = a === void 0 ? "h6" : a, l = S(e, dt), s = z(t).theme, d = O(i).Component;
return p.createElement(d, F({ className: x(U, st, R[s], n) }, l));
});
dn.displayName = "Subtitle";
var Ge, Dt = dn;
r(Ge || (Ge = o([`
flex: 1;
min-width: 0;
max-width: 100%;
white-space: inherit;
overflow: inherit;
text-overflow: inherit;
`])));
export {
Ke as $,
V as A,
H as J,
gt as O,
bt as P,
Ft as Q,
yt as Y,
mt as h,
xt as j,
Dt as l,
kt as n,
ht as t,
pt as w,
vt as y
};