UNPKG

@copilotkit/react-core

Version:

<div align="center"> <a href="https://copilotkit.ai" target="_blank"> <img src="https://github.com/copilotkit/copilotkit/raw/main/assets/banner.png" alt="CopilotKit Logo"> </a>

287 lines (282 loc) • 9.49 kB
"use strict"; var __create = Object.create; var __defProp = Object.defineProperty; var __defProps = Object.defineProperties; var __getOwnPropDesc = Object.getOwnPropertyDescriptor; var __getOwnPropDescs = Object.getOwnPropertyDescriptors; var __getOwnPropNames = Object.getOwnPropertyNames; var __getOwnPropSymbols = Object.getOwnPropertySymbols; var __getProtoOf = Object.getPrototypeOf; var __hasOwnProp = Object.prototype.hasOwnProperty; var __propIsEnum = Object.prototype.propertyIsEnumerable; var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value; var __spreadValues = (a, b) => { for (var prop in b || (b = {})) if (__hasOwnProp.call(b, prop)) __defNormalProp(a, prop, b[prop]); if (__getOwnPropSymbols) for (var prop of __getOwnPropSymbols(b)) { if (__propIsEnum.call(b, prop)) __defNormalProp(a, prop, b[prop]); } return a; }; var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b)); var __export = (target, all) => { for (var name in all) __defProp(target, name, { get: all[name], enumerable: true }); }; var __copyProps = (to, from, except, desc) => { if (from && typeof from === "object" || typeof from === "function") { for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable }); } return to; }; var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps( // If the importer is in node compatibility mode or this is not an ESM // file that has been converted to a CommonJS file using a Babel- // compatible transform (i.e. "__esModule" has not been set), then set // "default" to the CommonJS "module.exports" for node compatibility. isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod )); var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod); // src/components/toast/toast-provider.tsx var toast_provider_exports = {}; __export(toast_provider_exports, { ToastProvider: () => ToastProvider, useToast: () => useToast }); module.exports = __toCommonJS(toast_provider_exports); var import_react2 = require("react"); // src/components/error-boundary/error-utils.tsx var import_react = require("react"); // src/components/toast/exclamation-mark-icon.tsx var import_jsx_runtime = require("react/jsx-runtime"); var ExclamationMarkIcon = ({ className, style }) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)( "svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: `lucide lucide-circle-alert ${className ? className : ""}`, style, children: [ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "12", cy: "12", r: "10" }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("line", { x1: "12", x2: "12", y1: "8", y2: "12" }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("line", { x1: "12", x2: "12.01", y1: "16", y2: "16" }) ] } ); // src/components/error-boundary/error-utils.tsx var import_react_markdown = __toESM(require("react-markdown")); var import_jsx_runtime2 = require("react/jsx-runtime"); function ErrorToast({ errors }) { const errorsToRender = errors.map((error, idx) => { var _a, _b, _c; const originalError = "extensions" in error ? (_a = error.extensions) == null ? void 0 : _a.originalError : {}; const message = (_b = originalError == null ? void 0 : originalError.message) != null ? _b : error.message; const code = "extensions" in error ? (_c = error.extensions) == null ? void 0 : _c.code : null; return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)( "div", { style: { marginTop: idx === 0 ? 0 : 10, marginBottom: 14 }, children: [ /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(ExclamationMarkIcon, { style: { marginBottom: 4 } }), code && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)( "div", { style: { fontWeight: "600", marginBottom: 4 }, children: [ "Copilot Cloud Error:", " ", /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { style: { fontFamily: "monospace", fontWeight: "normal" }, children: code }) ] } ), /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react_markdown.default, { children: message }) ] }, idx ); }); return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)( "div", { style: { fontSize: "13px", maxWidth: "600px" }, children: [ errorsToRender, /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { style: { fontSize: "11px", opacity: 0.75 }, children: "NOTE: This error only displays during local development." }) ] } ); } // src/components/toast/toast-provider.tsx var import_jsx_runtime3 = require("react/jsx-runtime"); var ToastContext = (0, import_react2.createContext)(void 0); function useToast() { const context = (0, import_react2.useContext)(ToastContext); if (!context) { throw new Error("useToast must be used within a ToastProvider"); } return context; } function ToastProvider({ enabled, children }) { const [toasts, setToasts] = (0, import_react2.useState)([]); const addToast = (0, import_react2.useCallback)( (toast) => { var _a; if (!enabled) { return; } const id = (_a = toast.id) != null ? _a : Math.random().toString(36).substring(2, 9); setToasts((currentToasts) => { if (currentToasts.find((toast2) => toast2.id === id)) return currentToasts; return [...currentToasts, __spreadProps(__spreadValues({}, toast), { id })]; }); if (toast.duration) { setTimeout(() => { removeToast(id); }, toast.duration); } }, [enabled] ); const addGraphQLErrorsToast = (0, import_react2.useCallback)((errors) => { addToast({ type: "error", message: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(ErrorToast, { errors }) }); }, []); const removeToast = (0, import_react2.useCallback)((id) => { setToasts((currentToasts) => currentToasts.filter((toast) => toast.id !== id)); }, []); const value = { toasts, addToast, addGraphQLErrorsToast, removeToast, enabled }; return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(ToastContext.Provider, { value, children: [ /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)( "div", { style: { position: "fixed", bottom: "1rem", left: "50%", transform: "translateX(-50%)", zIndex: 50, display: "flex", flexDirection: "column", gap: "0.5rem" }, children: [ toasts.length > 1 && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { style: { textAlign: "right" }, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)( "button", { onClick: () => setToasts([]), style: { padding: "4px 8px", fontSize: "12px", cursor: "pointer", background: "white", border: "1px solid rgba(0,0,0,0.2)", borderRadius: "4px" }, children: "Close All" } ) }), toasts.map((toast) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)( Toast, { message: toast.message, type: toast.type, onClose: () => removeToast(toast.id) }, toast.id )) ] } ), children ] }); } function Toast({ message, type = "info", onClose }) { const bgColors = { info: "#3b82f6", success: "#22c55e", warning: "#eab308", error: "#ef4444" }; return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)( "div", { style: { backgroundColor: bgColors[type], color: "white", padding: "0.5rem 1.5rem", borderRadius: "0.25rem", boxShadow: "0 2px 4px rgba(0,0,0,0.1)", position: "relative", minWidth: "200px" }, children: [ /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { children: message }), /* @__PURE__ */ (0, import_jsx_runtime3.jsx)( "button", { onClick: onClose, style: { position: "absolute", top: "0", right: "0", background: "none", border: "none", color: "white", cursor: "pointer", padding: "0.5rem", fontSize: "1rem" }, children: "\u2715" } ) ] } ); } // Annotate the CommonJS export names for ESM import in node: 0 && (module.exports = { ToastProvider, useToast }); //# sourceMappingURL=toast-provider.js.map