mongodb-chatbot-ui
Version:
UI React components for the MongoDB Assistant
449 lines (443 loc) • 25.3 kB
JavaScript
import { jsx as M } from "react/jsx-runtime";
import { c as Se } from "./emotion-css.esm.js";
import F, { createContext as Ce, forwardRef as ge, useContext as Pe, useState as we, useRef as Y } from "react";
import { a as Ne, w as x, F as l, m as S, d as pe, r as $e, n as ve } from "./index2.js";
import { r as he } from "./index4.js";
import { p as Oe } from "./Refresh.js";
import { H as Le } from "./index6.js";
import { h as Ie, W as _e, Q as Te } from "./index12.js";
import { f as je, _ as Ae, l as me, c as Me, P as O, V as Re } from "./index5.js";
import { a as We, _ as be } from "./polished.esm.js";
import "./glyphCommon-cTThlth0.js";
import "./index7.js";
import "react-dom";
function Ve(a, o) {
return a.classList ? !!o && a.classList.contains(o) : (" " + (a.className.baseVal || a.className) + " ").indexOf(" " + o + " ") !== -1;
}
function ze(a, o) {
a.classList ? a.classList.add(o) : Ve(a, o) || (typeof a.className == "string" ? a.className = a.className + " " + o : a.setAttribute("class", (a.className && a.className.baseVal || "") + " " + o));
}
function Z(a, o) {
return a.replace(new RegExp("(^|\\s)" + o + "(?:\\s|$)", "g"), "$1").replace(/\s+/g, " ").replace(/^\s*|\s*$/g, "");
}
function Qe(a, o) {
a.classList ? a.classList.remove(o) : typeof a.className == "string" ? a.className = Z(a.className, o) : a.setAttribute("class", Z(a.className && a.className.baseVal || "", o));
}
var Ue = function(o, d) {
return o && d && d.split(" ").forEach(function(s) {
return ze(o, s);
});
}, z = function(o, d) {
return o && d && d.split(" ").forEach(function(s) {
return Qe(o, s);
});
}, U = /* @__PURE__ */ function(a) {
We(o, a);
function o() {
for (var s, f = arguments.length, u = new Array(f), p = 0; p < f; p++)
u[p] = arguments[p];
return s = a.call.apply(a, [this].concat(u)) || this, s.appliedClasses = {
appear: {},
enter: {},
exit: {}
}, s.onEnter = function(n, i) {
var c = s.resolveArguments(n, i), E = c[0], y = c[1];
s.removeClasses(E, "exit"), s.addClass(E, y ? "appear" : "enter", "base"), s.props.onEnter && s.props.onEnter(n, i);
}, s.onEntering = function(n, i) {
var c = s.resolveArguments(n, i), E = c[0], y = c[1], P = y ? "appear" : "enter";
s.addClass(E, P, "active"), s.props.onEntering && s.props.onEntering(n, i);
}, s.onEntered = function(n, i) {
var c = s.resolveArguments(n, i), E = c[0], y = c[1], P = y ? "appear" : "enter";
s.removeClasses(E, P), s.addClass(E, P, "done"), s.props.onEntered && s.props.onEntered(n, i);
}, s.onExit = function(n) {
var i = s.resolveArguments(n), c = i[0];
s.removeClasses(c, "appear"), s.removeClasses(c, "enter"), s.addClass(c, "exit", "base"), s.props.onExit && s.props.onExit(n);
}, s.onExiting = function(n) {
var i = s.resolveArguments(n), c = i[0];
s.addClass(c, "exit", "active"), s.props.onExiting && s.props.onExiting(n);
}, s.onExited = function(n) {
var i = s.resolveArguments(n), c = i[0];
s.removeClasses(c, "exit"), s.addClass(c, "exit", "done"), s.props.onExited && s.props.onExited(n);
}, s.resolveArguments = function(n, i) {
return s.props.nodeRef ? [s.props.nodeRef.current, n] : [n, i];
}, s.getClassNames = function(n) {
var i = s.props.classNames, c = typeof i == "string", E = c && i ? i + "-" : "", y = c ? "" + E + n : i[n], P = c ? y + "-active" : i[n + "Active"], V = c ? y + "-done" : i[n + "Done"];
return {
baseClassName: y,
activeClassName: P,
doneClassName: V
};
}, s;
}
var d = o.prototype;
return d.addClass = function(f, u, p) {
var n = this.getClassNames(u)[p + "ClassName"], i = this.getClassNames("enter"), c = i.doneClassName;
u === "appear" && p === "done" && c && (n += " " + c), p === "active" && f && je(f), n && (this.appliedClasses[u][p] = n, Ue(f, n));
}, d.removeClasses = function(f, u) {
var p = this.appliedClasses[u], n = p.base, i = p.active, c = p.done;
this.appliedClasses[u] = {}, n && z(f, n), i && z(f, i), c && z(f, c);
}, d.render = function() {
var f = this.props;
f.classNames;
var u = Ae(f, ["classNames"]);
return /* @__PURE__ */ F.createElement(me, be({}, u, {
onEnter: this.onEnter,
onEntered: this.onEntered,
onEntering: this.onEntering,
onExit: this.onExit,
onExiting: this.onExiting,
onExited: this.onExited
}));
}, o;
}(F.Component);
U.defaultProps = {
classNames: ""
};
U.propTypes = Ne.env.NODE_ENV !== "production" ? be({}, me.propTypes, {
/**
* The animation classNames applied to the component as it appears, enters,
* exits or has finished the transition. A single name can be provided, which
* will be suffixed for each stage, e.g. `classNames="fade"` applies:
*
* - `fade-appear`, `fade-appear-active`, `fade-appear-done`
* - `fade-enter`, `fade-enter-active`, `fade-enter-done`
* - `fade-exit`, `fade-exit-active`, `fade-exit-done`
*
* A few details to note about how these classes are applied:
*
* 1. They are _joined_ with the ones that are already defined on the child
* component, so if you want to add some base styles, you can use
* `className` without worrying that it will be overridden.
*
* 2. If the transition component mounts with `in={false}`, no classes are
* applied yet. You might be expecting `*-exit-done`, but if you think
* about it, a component cannot finish exiting if it hasn't entered yet.
*
* 2. `fade-appear-done` and `fade-enter-done` will _both_ be applied. This
* allows you to define different behavior for when appearing is done and
* when regular entering is done, using selectors like
* `.fade-enter-done:not(.fade-appear-done)`. For example, you could apply
* an epic entrance animation when element first appears in the DOM using
* [Animate.css](https://daneden.github.io/animate.css/). Otherwise you can
* simply use `fade-enter-done` for defining both cases.
*
* Each individual classNames can also be specified independently like:
*
* ```js
* classNames={{
* appear: 'my-appear',
* appearActive: 'my-active-appear',
* appearDone: 'my-done-appear',
* enter: 'my-enter',
* enterActive: 'my-active-enter',
* enterDone: 'my-done-enter',
* exit: 'my-exit',
* exitActive: 'my-active-exit',
* exitDone: 'my-done-exit',
* }}
* ```
*
* If you want to set these classes using CSS Modules:
*
* ```js
* import styles from './styles.css';
* ```
*
* you might want to use camelCase in your CSS file, that way could simply
* spread them instead of listing them one by one:
*
* ```js
* classNames={{ ...styles }}
* ```
*
* @type {string | {
* appear?: string,
* appearActive?: string,
* appearDone?: string,
* enter?: string,
* enterActive?: string,
* enterDone?: string,
* exit?: string,
* exitActive?: string,
* exitDone?: string,
* }}
*/
classNames: Me,
/**
* A `<Transition>` callback fired immediately after the 'enter' or 'appear' class is
* applied.
*
* **Note**: when `nodeRef` prop is passed, `node` is not passed.
*
* @type Function(node: HtmlElement, isAppearing: bool)
*/
onEnter: O.func,
/**
* A `<Transition>` callback fired immediately after the 'enter-active' or
* 'appear-active' class is applied.
*
* **Note**: when `nodeRef` prop is passed, `node` is not passed.
*
* @type Function(node: HtmlElement, isAppearing: bool)
*/
onEntering: O.func,
/**
* A `<Transition>` callback fired immediately after the 'enter' or
* 'appear' classes are **removed** and the `done` class is added to the DOM node.
*
* **Note**: when `nodeRef` prop is passed, `node` is not passed.
*
* @type Function(node: HtmlElement, isAppearing: bool)
*/
onEntered: O.func,
/**
* A `<Transition>` callback fired immediately after the 'exit' class is
* applied.
*
* **Note**: when `nodeRef` prop is passed, `node` is not passed
*
* @type Function(node: HtmlElement)
*/
onExit: O.func,
/**
* A `<Transition>` callback fired immediately after the 'exit-active' is applied.
*
* **Note**: when `nodeRef` prop is passed, `node` is not passed
*
* @type Function(node: HtmlElement)
*/
onExiting: O.func,
/**
* A `<Transition>` callback fired immediately after the 'exit' classes
* are **removed** and the `exit-done` class is added to the DOM node.
*
* **Note**: when `nodeRef` prop is passed, `node` is not passed
*
* @type Function(node: HtmlElement)
*/
onExited: O.func
}) : {};
const Xe = U;
function e(a, o, d) {
return (o = function(s) {
var f = function(u, p) {
if (typeof u != "object" || !u)
return u;
var n = u[Symbol.toPrimitive];
if (n !== void 0) {
var i = n.call(u, p);
if (typeof i != "object")
return i;
throw new TypeError("@@toPrimitive must return a primitive value.");
}
return String(u);
}(s, "string");
return typeof f == "symbol" ? f : f + "";
}(o)) in a ? Object.defineProperty(a, o, { value: d, enumerable: !0, configurable: !0, writable: !0 }) : a[o] = d, a;
}
var q, B, t = { Disabled: "disabled", Placeholder: "placeholder", Primary: "primary", Secondary: "secondary", Tertiary: "tertiary", InversePrimary: "inversePrimary", InverseSecondary: "inverseSecondary", Info: "info", Warning: "warning", Error: "error", Success: "success", Link: "link", OnError: "onError", OnSuccess: "onSuccess", OnSuccessLink: "onSuccessLink" }, r = { Default: "default", Hover: "hover", Focus: "focus" }, A = l.black, h = l.blue, g = l.gray, k = l.green, H = l.red, Ye = l.white, L = l.yellow, Ze = { background: e(e(e(e(e(e(e(e({}, t.Primary, e(e(e({}, r.Default, A), r.Hover, g.dark2), r.Focus, h.dark3)), t.Secondary, e(e(e({}, r.Default, g.dark4), r.Hover, g.dark2), r.Focus, h.dark3)), t.InversePrimary, e(e(e({}, r.Default, g.light2), r.Hover, g.light3), r.Focus, h.light2)), t.Info, e(e(e({}, r.Default, h.dark3), r.Hover, h.dark3), r.Focus, h.dark3)), t.Warning, e(e(e({}, r.Default, L.dark3), r.Hover, L.dark3), r.Focus, L.dark3)), t.Success, e(e(e({}, r.Default, k.dark3), r.Hover, k.dark3), r.Focus, k.dark3)), t.Error, e(e(e({}, r.Default, H.dark3), r.Hover, H.dark3), r.Focus, H.dark3)), t.Disabled, e(e(e({}, r.Default, g.dark3), r.Hover, g.dark3), r.Focus, g.dark3)), border: e(e(e(e(e(e(e(e({}, t.Primary, e(e(e({}, r.Default, g.base), r.Hover, g.base), r.Focus, h.light1)), t.Secondary, e(e(e({}, r.Default, g.dark2), r.Hover, g.dark2), r.Focus, h.light1)), t.Tertiary, e(e(e({}, r.Default, g.dark1), r.Hover, g.dark1), r.Focus, h.light1)), t.Success, e(e(e({}, r.Default, k.dark1), r.Hover, k.dark1), r.Focus, h.light1)), t.Error, e(e(e({}, r.Default, H.light1), r.Hover, H.light1), r.Focus, h.light1)), t.OnSuccess, e(e(e({}, r.Default, k.dark2), r.Hover, k.dark2), r.Focus, h.light1)), t.OnError, e(e(e({}, r.Default, H.dark2), r.Hover, H.dark2), r.Focus, h.light1)), t.Disabled, e(e(e({}, r.Default, g.dark2), r.Hover, g.dark2), r.Focus, g.dark2)), icon: e(e(e(e(e(e(e(e({}, t.Primary, e(e(e({}, r.Default, g.light1), r.Hover, g.light3), r.Focus, h.light3)), t.Secondary, e(e(e({}, r.Default, g.base), r.Hover, g.light3), r.Focus, h.light3)), t.InversePrimary, e(e(e({}, r.Default, Ye), r.Hover, A), r.Focus, h.dark2)), t.Info, e(e(e({}, r.Default, h.light1), r.Hover, h.light1), r.Focus, h.light1)), t.Warning, e(e(e({}, r.Default, L.base), r.Hover, L.base), r.Focus, L.base)), t.Success, e(e(e({}, r.Default, k.base), r.Hover, k.base), r.Focus, k.base)), t.Error, e(e(e({}, r.Default, H.light1), r.Hover, H.light1), r.Focus, H.light1)), t.Disabled, e(e(e({}, r.Default, g.dark1), r.Hover, g.dark1), r.Focus, g.dark1)), text: (e(e(e(e(e(e(e(e(e(e(q = {}, t.Primary, e(e(e({}, r.Default, g.light2), r.Hover, g.light2), r.Focus, h.light3)), t.Placeholder, e(e(e({}, r.Default, g.dark1), r.Hover, g.dark1), r.Focus, g.dark1)), t.Secondary, e(e(e({}, r.Default, g.light1), r.Hover, g.light2), r.Focus, h.light3)), t.InversePrimary, e(e(e({}, r.Default, A), r.Hover, A), r.Focus, h.dark2)), t.InverseSecondary, e(e(e({}, r.Default, g.dark2), r.Hover, A), r.Focus, h.dark2)), t.Disabled, e(e(e({}, r.Default, g.dark1), r.Hover, g.dark1), r.Focus, g.dark1)), t.Success, e(e(e({}, r.Default, k.light2), r.Hover, k.light2), r.Focus, k.light2)), t.Error, e(e(e({}, r.Default, H.light1), r.Hover, H.light1), r.Focus, H.light1)), t.OnSuccess, e(e(e({}, r.Default, k.light1), r.Hover, k.light1), r.Focus, k.light1)), t.OnSuccessLink, e(e(e({}, r.Default, k.light3), r.Hover, k.light3), r.Focus, k.light3)), e(e(q, t.OnError, e(e(e({}, r.Default, H.light2), r.Hover, H.light2), r.Focus, H.light2)), t.Link, e(e(e({}, r.Default, h.light1), r.Hover, h.light1), r.Focus, h.light1))) }, I = l.black, m = l.blue, v = l.gray, b = l.green, D = l.red, _ = l.white, T = l.yellow, qe = { background: e(e(e(e(e(e(e(e({}, t.Primary, e(e(e({}, r.Default, _), r.Hover, v.light2), r.Focus, m.light3)), t.Secondary, e(e(e({}, r.Default, v.light3), r.Hover, v.light2), r.Focus, m.light3)), t.InversePrimary, e(e(e({}, r.Default, I), r.Hover, v.dark3), r.Focus, m.dark2)), t.Info, e(e(e({}, r.Default, m.light3), r.Hover, m.light3), r.Focus, m.light3)), t.Warning, e(e(e({}, r.Default, T.light3), r.Hover, T.light3), r.Focus, T.light3)), t.Success, e(e(e({}, r.Default, b.light3), r.Hover, b.light3), r.Focus, b.light3)), t.Error, e(e(e({}, r.Default, D.light3), r.Hover, D.light3), r.Focus, D.light3)), t.Disabled, e(e(e({}, r.Default, v.light2), r.Hover, v.light2), r.Focus, v.light2)), border: e(e(e(e(e(e(e(e({}, t.Primary, e(e(e({}, r.Default, v.base), r.Hover, v.base), r.Focus, m.light1)), t.Secondary, e(e(e({}, r.Default, v.light2), r.Hover, v.light2), r.Focus, m.light1)), t.Tertiary, e(e(e({}, r.Default, v.light1), r.Hover, v.light1), r.Focus, m.light1)), t.Success, e(e(e({}, r.Default, b.dark1), r.Hover, b.dark1), r.Focus, m.light1)), t.Error, e(e(e({}, r.Default, D.base), r.Hover, D.base), r.Focus, m.light1)), t.Disabled, e(e(e({}, r.Default, v.light1), r.Hover, v.light1), r.Focus, v.light1)), t.OnSuccess, e(e(e({}, r.Default, b.light2), r.Hover, b.light2), r.Focus, b.light2)), t.OnError, e(e(e({}, r.Default, D.light2), r.Hover, D.light2), r.Focus, D.light2)), icon: e(e(e(e(e(e(e(e({}, t.Primary, e(e(e({}, r.Default, v.dark1), r.Hover, I), r.Focus, m.dark1)), t.Secondary, e(e(e({}, r.Default, v.base), r.Hover, I), r.Focus, m.dark1)), t.InversePrimary, e(e(e({}, r.Default, _), r.Hover, _), r.Focus, m.light2)), t.Info, e(e(e({}, r.Default, m.base), r.Hover, m.base), r.Focus, m.base)), t.Warning, e(e(e({}, r.Default, T.dark2), r.Hover, T.dark2), r.Focus, T.dark2)), t.Success, e(e(e({}, r.Default, b.dark1), r.Hover, b.dark1), r.Focus, b.dark1)), t.Error, e(e(e({}, r.Default, D.base), r.Hover, D.base), r.Focus, D.base)), t.Disabled, e(e(e({}, r.Default, v.base), r.Hover, v.base), r.Focus, v.base)), text: (e(e(e(e(e(e(e(e(e(e(B = {}, t.Primary, e(e(e({}, r.Default, I), r.Hover, I), r.Focus, m.dark1)), t.Secondary, e(e(e({}, r.Default, v.dark1), r.Hover, I), r.Focus, m.dark1)), t.InversePrimary, e(e(e({}, r.Default, _), r.Hover, _), r.Focus, m.light2)), t.InverseSecondary, e(e(e({}, r.Default, v.light1), r.Hover, _), r.Focus, m.light2)), t.Disabled, e(e(e({}, r.Default, v.base), r.Hover, v.base), r.Focus, v.base)), t.Success, e(e(e({}, r.Default, b.dark2), r.Hover, b.dark2), r.Focus, b.dark2)), t.Error, e(e(e({}, r.Default, D.base), r.Hover, D.base), r.Focus, D.base)), t.Placeholder, e(e(e({}, r.Default, v.base), r.Hover, v.base), r.Focus, v.base)), t.OnSuccess, e(e(e({}, r.Default, b.dark2), r.Hover, b.dark2), r.Focus, b.dark2)), t.OnSuccessLink, e(e(e({}, r.Default, b.dark3), r.Hover, b.dark3), r.Focus, b.dark3)), e(e(B, t.OnError, e(e(e({}, r.Default, D.dark2), r.Hover, D.dark2), r.Focus, D.dark2)), t.Link, e(e(e({}, r.Default, m.base), r.Hover, m.base), r.Focus, m.base))) }, Be = e(e({}, x.Dark, Ze), x.Light, qe), R = { Dark: "dark", Light: "light" }, G = e(e({}, R.Light, { default: "0 0 0 2px ".concat(l.white, ", 0 0 0 4px ").concat(l.blue.light1), input: "0 0 0 3px ".concat(l.blue.light1) }), R.Dark, { default: "0 0 0 2px ".concat(l.black, ", 0 0 0 4px ").concat(l.blue.light1), input: "0 0 0 3px ".concat(l.blue.light1) }), J = e(e({}, R.Light, { gray: "0 0 0 3px ".concat(l.gray.light2), green: "0 0 0 3px ".concat(l.green.light2), red: "0 0 0 3px ".concat(l.red.light2) }), R.Dark, { gray: "0 0 0 3px ".concat(l.gray.dark2), green: "0 0 0 3px ".concat(l.green.dark3), red: "0 0 0 3px ".concat(l.yellow.dark3) }), Ge = l.black, j = l.gray, Je = l.white;
e(e({}, t.Primary, e({}, r.Default, j.base)), t.Secondary, e({}, r.Default, j.dark1)), e(e({}, t.Primary, e({}, r.Default, Ge)), t.Secondary, e({}, r.Default, j.dark4)), e(e({}, t.Primary, e({}, r.Default, j.base)), t.Secondary, e({}, r.Default, j.light1)), e(e({}, t.Primary, e({}, r.Default, Je)), t.Secondary, e({}, r.Default, j.light3));
var N = e(e({}, x.Light, { 1: "color-mix(in srgb, ".concat(l.black, " 15%, transparent)"), 2: "color-mix(in srgb, ".concat(l.black, " 20%, transparent)"), 3: "color-mix(in srgb, ".concat(l.black, " 60%, transparent)"), overflow: "color-mix(in srgb, ".concat(l.gray.dark1, " 30%, transparent)") }), x.Dark, { 1: "transparent", 2: "color-mix(in srgb, #000000 45%, transparent)", 3: "color-mix(in srgb, #000000 60%, transparent)", overflow: "color-mix(in srgb, #000000 30%, transparent)" });
e(e({}, x.Light, { 1: "0px 2px 4px 1px ".concat(N[x.Light][1]), 2: "0px 18px 18px -15px ".concat(N[x.Light][2]), 3: "0px 8px 20px -8px ".concat(N[x.Light][3]), overflow: "0px 2px 4px 1px ".concat(N[x.Light].overflow) }), x.Dark, { 1: "unset", 2: "0 18px 18px -15px ".concat(N[x.Dark][2]), 3: "0 8px 20px -8px ".concat(N[x.Dark][3]), overflow: "0px 2px 4px 1px ".concat(N[x.Dark].overflow) });
e(e({}, x.Light, 2), x.Dark, 16);
var $ = { 0: 0, 25: 1, 50: 2, 100: 4, 150: 6, 200: 8, 300: 12, 400: 16, 500: 20, 600: 24, 800: 32, 900: 36, 1e3: 40, 1200: 48, 1400: 56, 1600: 64, 1800: 72, 1: 4, 2: 8, 3: 16, 4: 24, 5: 32, 6: 64, 7: 88 }, ke = { faster: 100, default: 150, slower: 300, slowest: 500 };
function w(a, o, d) {
return (o = function(s) {
var f = function(u, p) {
if (typeof u != "object" || !u)
return u;
var n = u[Symbol.toPrimitive];
if (n !== void 0) {
var i = n.call(u, p);
if (typeof i != "object")
return i;
throw new TypeError("@@toPrimitive must return a primitive value.");
}
return String(u);
}(s, "string");
return typeof f == "symbol" ? f : f + "";
}(o)) in a ? Object.defineProperty(a, o, { value: d, enumerable: !0, configurable: !0, writable: !0 }) : a[o] = d, a;
}
function W() {
return W = Object.assign ? Object.assign.bind() : function(a) {
for (var o = 1; o < arguments.length; o++) {
var d = arguments[o];
for (var s in d)
({}).hasOwnProperty.call(d, s) && (a[s] = d[s]);
}
return a;
}, W.apply(null, arguments);
}
function xe(a, o) {
if (a == null)
return {};
var d, s, f = function(p, n) {
if (p == null)
return {};
var i = {};
for (var c in p)
if ({}.hasOwnProperty.call(p, c)) {
if (n.indexOf(c) !== -1)
continue;
i[c] = p[c];
}
return i;
}(a, o);
if (Object.getOwnPropertySymbols) {
var u = Object.getOwnPropertySymbols(a);
for (s = 0; s < u.length; s++)
d = u[s], o.indexOf(d) === -1 && {}.propertyIsEnumerable.call(a, d) && (f[d] = a[d]);
}
return f;
}
function C(a, o) {
return o || (o = a.slice(0)), Object.freeze(Object.defineProperties(a, { raw: { value: Object.freeze(o) } }));
}
var K, ee, re, ae, te, se, De = Ce({ hasSelectedPrompt: !1 });
function ye(a) {
var o = a.hasSelectedPrompt, d = a.children;
return F.createElement(De.Provider, { value: { hasSelectedPrompt: o } }, d);
}
ye.displayName = "MessagePromptsProvider";
var oe, ne, ie, le, ce, ue, de, Ke = S(K || (K = C([`
display: block;
padding: `, "px ", `px;
border: 1px solid `, `;
border-radius: 12px;
transition: all `, `ms ease;
box-shadow: none;
outline: none;
text-align: left;
&[aria-disabled='false'][aria-pressed='false'] {
cursor: pointer;
}
`])), $[2], $[3], l.green.dark2, ke.slower), er = w(w({}, x.Dark, S(ee || (ee = C([`
background: `, `;
color: `, `;
&[aria-pressed='false'][aria-disabled='false']:hover {
box-shadow: `, `;
}
&[aria-pressed='false'][aria-disabled='false']:focus-visible {
box-shadow: `, `;
}
`])), l.black, l.gray.light2, J.dark.green, G.dark.default)), x.Light, S(re || (re = C([`
background: `, `;
color: `, `;
&[aria-pressed='false'][aria-disabled='false']:hover {
box-shadow: `, `;
}
&[aria-pressed='false'][aria-disabled='false']:focus-visible {
box-shadow: `, `;
}
`])), l.white, l.gray.dark3, J.light.green, G.light.default)), rr = w(w({}, x.Dark, S(ae || (ae = C([`
border-color: `, `;
color: `, `;
background: `, `;
`])), l.gray.dark1, l.gray.dark1, l.gray.dark3)), x.Light, S(te || (te = C([`
border-color: `, `;
color: `, `;
`])), l.gray.base, l.gray.base)), ar = S(se || (se = C([`
box-shadow: 0 0 0 2px `, `;
`])), l.green.dark1), tr = function(a) {
var o = a.className, d = a.disabled, s = a.selected, f = a.theme;
return ve(Ke, er[f], w(w({}, rr[f], d), ar, s), o);
}, sr = ["children", "onClick", "disabled", "selected", "className", "darkMode"], He = ge(function(a, o) {
var d = a.children, s = a.onClick, f = a.disabled, u = a.selected, p = a.className, n = a.darkMode, i = xe(a, sr), c = Pe(De).hasSelectedPrompt, E = pe(n).theme, y = f ?? (!u && c);
return F.createElement("button", W({ className: tr({ className: p, disabled: y, selected: u, theme: E }), onClick: function(P) {
!y && s && s(P);
}, "aria-disabled": !!y, "aria-pressed": !!u, tabIndex: u || y ? -1 : 0, ref: o, type: "button" }, i), F.createElement(he, { style: { color: "inherit" } }, d));
});
He.displayName = "MessagePrompt";
var or = S(oe || (oe = C([`
max-width: `, `px;
overflow: hidden;
margin: -`, `px;
padding: `, `px;
display: grid;
grid-template-rows: 1fr;
gap: `, `px;
`])), 400, 4, 4, $[200]), nr = S(ne || (ne = C([`
transform-origin: bottom right;
transition-property: grid-template-rows, opacity, transform;
transition-duration: `, `ms;
transition-timing-function: ease-out;
`])), ke.slower), ir = S(ie || (ie = C([`
grid-template-rows: 0fr;
opacity: 0;
transform: scale(0.8);
`]))), lr = function(a) {
var o = a.enableTransition, d = a.shouldHide;
return ve(or, w(w({}, nr, o), ir, d));
}, cr = S(le || (le = C([`
min-height: 0;
display: flex;
flex-direction: column;
gap: `, `px;
align-items: flex-start;
`])), $[200]), ur = S(ce || (ce = C([`
display: flex;
align-items: center;
gap: `, `px;
`])), $[50]), dr = function(a) {
return S(ue || (ue = C([`
color: `, `;
`])), Be[a].text[t.Secondary][r.Default]);
}, fr = S(de || (de = C([`
display: flex;
flex-direction: column;
gap: `, `px;
`])), $[200]), gr = ["children", "darkMode", "enableHideOnSelect", "label", "onClickRefresh"], Fe = ge(function(a, o) {
var d = a.children, s = a.darkMode, f = a.enableHideOnSelect, u = f === void 0 || f, p = a.label, n = a.onClickRefresh, i = xe(a, gr), c = pe(s), E = c.darkMode, y = c.theme, P = F.Children.toArray(d).some(function(X) {
return $e(X, "MessagePrompt") && X.props.selected;
}), V = u && P, Ee = p || n;
return F.createElement(ye, { hasSelectedPrompt: P }, F.createElement("div", W({ className: lr({ enableTransition: u, shouldHide: V }), ref: o }, i), F.createElement("div", { className: cr }, Ee && F.createElement("div", { className: ur }, p && F.createElement(he, { className: dr(y) }, p), n && F.createElement(Ie, { align: _e.Right, justify: Re.Middle, spacing: $[100], trigger: F.createElement(Le, { "aria-label": "Refresh prompts", darkMode: E, disabled: P, onClick: n }, F.createElement(Oe, null)), variant: Te.Compact }, "Refresh prompts")), F.createElement("div", { className: fr }, d))));
});
Fe.displayName = "MessagePrompts";
const Q = 400, fe = {
message_prompts: Se`
transition: opacity ${Q}ms ease-in;
&-enter {
opacity: 0;
}
&-enter-active {
opacity: 1;
}
&-exit {
opacity: 1;
}
&-exit-active {
opacity: 0;
}
`
}, Cr = ({
prompts: a,
onPromptClick: o,
canSubmit: d
}) => {
const [s, f] = we(void 0), u = Y(null), p = Y(!1), n = (i, c) => {
d(i) && (p.current || (p.current = !0, f(c), setTimeout(() => {
o(i);
}, Q)));
};
return /* @__PURE__ */ M(
Xe,
{
in: s === void 0,
timeout: Q,
nodeRef: u,
classNames: fe.message_prompts,
children: /* @__PURE__ */ M("div", { className: fe.message_prompts, ref: u, children: /* @__PURE__ */ M(Fe, { label: "Suggested Prompts", children: a.map((i, c) => /* @__PURE__ */ M(
He,
{
onClick: () => n(i, c),
selected: c === s,
children: i
},
i
)) }) })
}
);
};
export {
Cr as MessagePrompts
};