@voltro/ui 0.84.0 → 0.86.0

package/THIRD-PARTY-NOTICES.md

@@ -1,70 +1,14 @@
 # Third-Party Notices — @voltro/ui
 
-This package depends on the open-source software listed below. Each is the
+This package uses the open-source software listed below. Each is the
 property of its respective copyright holders and is used under the terms of
 its license. This file is provided for attribution; it grants no rights in
 @voltro/ui itself, which is proprietary (see LICENSE).
 
-Generated from the resolved runtime dependency closure (13 packages).
+Generated from the resolved runtime dependency closure (10 packages).
 
 ---
 
-## @effect/experimental@0.61.1
-
-License: MIT
-
-```
-MIT License
-
-Copyright (c) 2023-present The Contributors
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.
-```
-
-## @effect/sql@0.52.1
-
-License: MIT
-
-```
-MIT License
-
-Copyright (c) 2023-present The Contributors
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.
-```
-
 ## @tanstack/devtools-event-client@0.4.4
 
 License: MIT
@@ -233,34 +177,6 @@ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
 SOFTWARE.
 ```
 
-## layerr@3.0.0
-
-License: MIT
-
-```
-MIT License
-
-Copyright (c) 2020 Perry Mitchell
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.
-```
-
 ## typeid-js@1.2.0
 
 License: Apache-2.0
@@ -469,14 +385,14 @@ Apache License
    limitations under the License.
 ```
 
-## ulidx@2.4.1
+## ulid@3.0.2
 
 License: MIT
 
 ```
-MIT License
+The MIT License (MIT)
 
-Copyright (c) 2021 Perry Mitchell
+Copyright (c) 2017 Alizain Feerasta
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

package/dist/agentChat.js

@@ -0,0 +1,117 @@
+import { useUiStrings as e } from "./strings.js";
+import { useState as t } from "react";
+import { useAgentChat as n } from "@voltro/client";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+//#region src/agentChat.tsx
+var a = (e) => typeof e.text == "string" ? e.text : "";
+function o({ text: t }) {
+	let n = e().agentChat;
+	return /* @__PURE__ */ i("details", {
+		"data-part": "reasoning",
+		children: [/* @__PURE__ */ r("summary", { children: n.reasoning }), /* @__PURE__ */ r("span", { children: t })]
+	});
+}
+function s({ part: e }) {
+	switch (e.type) {
+		case "text": return /* @__PURE__ */ r("span", {
+			"data-part": "text",
+			children: a(e)
+		});
+		case "reasoning": return /* @__PURE__ */ r(o, { text: a(e) });
+		case "tool": {
+			let t = e;
+			return /* @__PURE__ */ i("span", {
+				"data-part": "tool",
+				"data-tool": t.toolName,
+				"data-state": t.state,
+				children: ["🔧 ", t.toolName]
+			});
+		}
+		case "source": {
+			let t = e;
+			return t.url ? /* @__PURE__ */ r("a", {
+				"data-part": "source",
+				href: t.url,
+				rel: "noreferrer",
+				children: t.title ?? t.url
+			}) : /* @__PURE__ */ r("span", {
+				"data-part": "source",
+				children: t.title ?? t.id ?? "source"
+			});
+		}
+		case "file": {
+			let t = e;
+			return t.mediaType.startsWith("image/") ? /* @__PURE__ */ r("img", {
+				"data-part": "file",
+				alt: "",
+				src: `data:${t.mediaType};base64,${t.data}`
+			}) : /* @__PURE__ */ i("span", {
+				"data-part": "file",
+				"data-media": t.mediaType,
+				children: ["📎 ", t.mediaType]
+			});
+		}
+		default: return /* @__PURE__ */ r("span", {
+			"data-part": e.type,
+			children: JSON.stringify(e)
+		});
+	}
+}
+function c({ message: e }) {
+	let t = e.parts ?? [];
+	return /* @__PURE__ */ i("div", {
+		"data-voltro-agent-message": !0,
+		"data-role": e.role,
+		"data-streaming": e.streaming ? "true" : void 0,
+		"aria-busy": e.streaming ? "true" : void 0,
+		children: [t.length > 0 ? t.map((e, t) => /* @__PURE__ */ r(s, { part: e }, t)) : /* @__PURE__ */ r("span", {
+			"data-part": "text",
+			children: e.content
+		}), e.streaming ? /* @__PURE__ */ r("span", {
+			"data-cursor": !0,
+			"aria-hidden": "true",
+			children: "▍"
+		}) : null]
+	});
+}
+function l(a) {
+	let { api: o, agent: s, threadId: l, placeholder: u, sendLabel: d, emptyText: f } = a, p = e().agentChat, m = n(o, s, { threadId: l }), [h, g] = t(""), _ = () => {
+		let e = h.trim();
+		e.length === 0 || m.sending || (g(""), m.send(e));
+	};
+	return /* @__PURE__ */ i("div", {
+		"data-voltro-agent-chat": s,
+		children: [/* @__PURE__ */ r("div", {
+			"data-messages": !0,
+			role: "log",
+			"aria-live": "polite",
+			"aria-busy": m.streaming ? "true" : void 0,
+			children: m.messages.length === 0 && !m.loading ? /* @__PURE__ */ r("p", {
+				"data-empty": !0,
+				children: f ?? "No messages yet."
+			}) : m.messages.map((e) => /* @__PURE__ */ r(c, { message: e }, e.id))
+		}), /* @__PURE__ */ i("form", {
+			"data-composer": !0,
+			onSubmit: (e) => {
+				e.preventDefault(), _();
+			},
+			children: [/* @__PURE__ */ r("input", {
+				value: h,
+				onChange: (e) => g(e.target.value),
+				placeholder: u ?? p.messagePlaceholder,
+				"aria-label": p.messageLabel,
+				disabled: m.sending
+			}), /* @__PURE__ */ r("button", {
+				type: "submit",
+				disabled: m.sending || h.trim().length === 0,
+				children: d ?? p.send
+			})]
+		})]
+	});
+}
+function u(e) {
+	let t = n(e.api, e.agent, { threadId: e.threadId });
+	return e.children(t);
+}
+//#endregion
+export { l as AgentChat, c as AgentMessageView, s as AgentPartView, u as AgentStream };

package/dist/appAgent.js

@@ -0,0 +1,30 @@
+import { useUiStrings as e } from "./strings.js";
+import { AgentChat as t } from "./agentChat.js";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+//#region src/appAgent.tsx
+function i(i) {
+	let { tools: a, showTools: o, ...s } = i, c = e().appAgent, l = (o ?? (a !== void 0 && a.length > 0)) && a && a.length > 0;
+	return /* @__PURE__ */ r("div", {
+		"data-voltro-app-agent": s.agent,
+		children: [l ? /* @__PURE__ */ r("details", {
+			"data-agent-tools": !0,
+			children: [/* @__PURE__ */ n("summary", { children: c.toolsSummary(a.length) }), /* @__PURE__ */ n("ul", { children: a.map((e) => /* @__PURE__ */ r("li", {
+				"data-tool": e.name,
+				"data-write": e.write ? "true" : void 0,
+				children: [
+					/* @__PURE__ */ n("code", { children: e.name }),
+					e.confirm ? /* @__PURE__ */ r("span", {
+						"data-confirm": !0,
+						children: [" · ", c.needsConfirm]
+					}) : null,
+					e.description ? /* @__PURE__ */ r("span", {
+						"data-desc": !0,
+						children: [" — ", e.description]
+					}) : null
+				]
+			}, e.name)) })]
+		}) : null, /* @__PURE__ */ n(t, { ...s })]
+	});
+}
+//#endregion
+export { i as AppAgent };

package/dist/asyncSelect.js

@@ -0,0 +1,63 @@
+import { useUiStrings as e } from "./strings.js";
+import { useId as t } from "react";
+import { useQueryField as n } from "@voltro/client";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+//#region src/asyncSelect.tsx
+var a = (a) => {
+	let o = n(a.api, a.source, {
+		skipUntilTerm: !0,
+		...a.labelField === void 0 ? {} : { labelField: a.labelField },
+		...a.valueField === void 0 ? {} : { valueField: a.valueField },
+		...a.input === void 0 ? {} : { input: a.input },
+		...a.debounceMs === void 0 ? {} : { debounceMs: a.debounceMs }
+	}), s = e().asyncSelect, c = t(), l = a.value === void 0 || a.value === null ? "" : String(a.value), u = l !== "" && o.options.some((e) => e.value === l), d = `${c}-error`;
+	return /* @__PURE__ */ i("div", {
+		"data-voltro-field": !0,
+		"data-voltro-async-select": !0,
+		children: [
+			/* @__PURE__ */ i("label", {
+				htmlFor: c,
+				children: [a.label, a.required ? " *" : ""]
+			}),
+			/* @__PURE__ */ r("input", {
+				type: "search",
+				"aria-label": s.searchLabel(a.label),
+				placeholder: s.searchPlaceholder,
+				onChange: (e) => o.search(e.target.value),
+				disabled: a.disabled
+			}),
+			/* @__PURE__ */ i("select", {
+				id: c,
+				name: a.name,
+				value: l,
+				onChange: (e) => a.onChange(e.target.value),
+				disabled: a.disabled,
+				required: a.required,
+				"aria-invalid": a.error !== void 0,
+				"aria-describedby": a.error === void 0 ? void 0 : d,
+				"aria-busy": o.loading,
+				children: [
+					/* @__PURE__ */ r("option", {
+						value: "",
+						children: o.loading ? s.loading : s.empty
+					}),
+					l !== "" && !u ? /* @__PURE__ */ r("option", {
+						value: l,
+						children: l
+					}) : null,
+					o.options.map((e) => /* @__PURE__ */ r("option", {
+						value: e.value,
+						children: e.label
+					}, e.value))
+				]
+			}),
+			a.error === void 0 ? null : /* @__PURE__ */ r("p", {
+				id: d,
+				role: "alert",
+				children: a.error
+			})
+		]
+	});
+};
+//#endregion
+export { a as AsyncSelect };

package/dist/autoForm.js

@@ -0,0 +1,91 @@
+import { useWidget as e } from "./widgets.js";
+import { createContext as t, useContext as n, useMemo as r } from "react";
+import { FORM_KEY_FIELD as i, FORM_REDIRECT_FIELD as a, FormBindingProvider as o, formActionPath as s, formSections as c, useFormBinding as l, useFormFlash as u } from "@voltro/client";
+import { jsx as d, jsxs as f } from "react/jsx-runtime";
+//#region src/autoForm.tsx
+var p = t(null), m = () => {
+	let e = n(p);
+	if (e === null) throw Error("<Field> must be rendered inside <AutoForm>");
+	return e;
+}, h = (e, t) => {
+	let n = e.field(t.name);
+	return {
+		name: t.name,
+		label: t.label,
+		value: n.value,
+		onChange: n.setValue,
+		onBlur: n.onBlur,
+		required: t.required,
+		disabled: e.pending,
+		...n.error === void 0 ? {} : { error: n.error },
+		...t.options ? { options: t.options } : {},
+		...n.description === void 0 ? {} : { description: n.description },
+		...t.reference === void 0 ? {} : { reference: t.reference }
+	};
+}, g = ({ name: t, children: n }) => {
+	let { binding: r, fields: i } = m(), a = i.get(t), o = e(a?.widget ?? "custom");
+	if (a === void 0) return null;
+	let s = h(r, a);
+	return n ? n(s) : /* @__PURE__ */ d(o, { ...s });
+};
+function _(e) {
+	let t = e.formKey ?? e.mutation, n = u(t), m = l(e.api, e.mutation, {
+		...e.schema ? { schema: e.schema } : {},
+		...e.defaults ? { defaults: e.defaults } : {},
+		...n === void 0 ? {} : { flash: n }
+	}), h = r(() => {
+		let e = /* @__PURE__ */ new Map();
+		for (let t of m.fields) e.has(t.name) || e.set(t.name, t);
+		return e;
+	}, [m.fields]), _ = r(() => ({
+		binding: m,
+		fields: h
+	}), [m, h]), v = (t) => {
+		t.preventDefault(), m.submit().then((t) => {
+			t !== void 0 && e.onSuccess && e.onSuccess(t);
+		});
+	};
+	return /* @__PURE__ */ d(o, {
+		binding: m,
+		children: /* @__PURE__ */ d(p.Provider, {
+			value: _,
+			children: /* @__PURE__ */ f("form", {
+				...e.action === !1 ? {} : {
+					action: s(e.mutation),
+					method: "post"
+				},
+				onSubmit: v,
+				noValidate: !0,
+				"data-voltro-autoform": e.mutation,
+				children: [
+					e.action === !1 ? null : /* @__PURE__ */ d("input", {
+						type: "hidden",
+						name: i,
+						value: t
+					}),
+					e.action === !1 || e.redirectTo === void 0 ? null : /* @__PURE__ */ d("input", {
+						type: "hidden",
+						name: a,
+						value: e.redirectTo
+					}),
+					e.children ? e.children(m) : c(m.fields).map((e, t) => e.name === void 0 ? e.fields.map((e) => /* @__PURE__ */ d(g, { name: e.name }, e.name)) : /* @__PURE__ */ f("fieldset", {
+						"data-voltro-section": e.name,
+						children: [/* @__PURE__ */ d("legend", { children: e.label ?? e.name }), e.fields.map((e) => /* @__PURE__ */ d(g, { name: e.name }, e.name))]
+					}, e.name)),
+					m.formError === void 0 ? null : /* @__PURE__ */ d("p", {
+						role: "alert",
+						"data-voltro-form-error": "",
+						children: m.formError
+					}),
+					/* @__PURE__ */ d("button", {
+						type: "submit",
+						disabled: m.pending,
+						children: e.submitLabel ?? "Submit"
+					})
+				]
+			})
+		})
+	});
+}
+//#endregion
+export { _ as AutoForm, g as Field };

package/dist/commentsThread.js

@@ -0,0 +1,163 @@
+import { useUiStrings as e } from "./strings.js";
+import { useState as t } from "react";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+import { useComments as i } from "@voltro/plugin-comments/web";
+//#region src/commentsThread.tsx
+var a = (e) => [...e.matchAll(/@([\w.-]+)/g)].map((e) => e[1]);
+function o({ comment: i, onReact: a, onRemove: o, onEdit: s }) {
+	let c = e().comments, [l, u] = t(!1), [d, f] = t(i.body);
+	return /* @__PURE__ */ r("li", {
+		"data-comment": i.id,
+		"data-author": i.authorSubjectId,
+		children: [
+			/* @__PURE__ */ n("span", {
+				"data-comment-author": !0,
+				children: i.authorSubjectId
+			}),
+			l ? /* @__PURE__ */ r("form", {
+				"data-comment-edit": !0,
+				onSubmit: (e) => {
+					e.preventDefault(), s(d), u(!1);
+				},
+				children: [/* @__PURE__ */ n("input", {
+					value: d,
+					onChange: (e) => f(e.target.value),
+					"aria-label": c.editLabel
+				}), /* @__PURE__ */ n("button", {
+					type: "submit",
+					children: c.save
+				})]
+			}) : /* @__PURE__ */ r("p", {
+				"data-comment-body": !0,
+				children: [i.body, i.editedAt ? /* @__PURE__ */ r("em", {
+					"data-comment-edited": !0,
+					children: [
+						" (",
+						c.edited,
+						")"
+					]
+				}) : null]
+			}),
+			/* @__PURE__ */ r("span", {
+				"data-comment-reactions": !0,
+				children: [i.reactions.map((e) => /* @__PURE__ */ r("button", {
+					type: "button",
+					"data-reaction": e.emoji,
+					"data-mine": e.mine || void 0,
+					onClick: () => a(e.emoji),
+					children: [
+						e.emoji,
+						" ",
+						e.count
+					]
+				}, e.emoji)), /* @__PURE__ */ n("button", {
+					type: "button",
+					"data-reaction-add": !0,
+					onClick: () => a("👍"),
+					"aria-label": c.react,
+					children: "+👍"
+				})]
+			}),
+			/* @__PURE__ */ r("span", {
+				"data-comment-actions": !0,
+				children: [/* @__PURE__ */ n("button", {
+					type: "button",
+					onClick: () => u((e) => !e),
+					children: c.edit
+				}), /* @__PURE__ */ n("button", {
+					type: "button",
+					onClick: o,
+					children: c.remove
+				})]
+			})
+		]
+	});
+}
+function s({ thread: i, api: s }) {
+	let c = e().comments, [l, u] = t("");
+	return /* @__PURE__ */ r("section", {
+		"data-thread": i.id,
+		"data-status": i.status,
+		children: [
+			/* @__PURE__ */ r("header", {
+				"data-thread-header": !0,
+				children: [
+					i.unreadCount > 0 ? /* @__PURE__ */ n("span", {
+						"data-thread-unread": !0,
+						children: i.unreadCount
+					}) : null,
+					/* @__PURE__ */ n("button", {
+						type: "button",
+						"data-thread-resolve": !0,
+						onClick: () => void s.resolve(i.id, i.status !== "resolved"),
+						children: i.status === "resolved" ? c.reopen : c.resolve
+					}),
+					/* @__PURE__ */ n("button", {
+						type: "button",
+						"data-thread-markread": !0,
+						onClick: () => void s.markRead(i.id),
+						children: c.markRead
+					})
+				]
+			}),
+			i.quote === null ? null : /* @__PURE__ */ n("blockquote", {
+				"data-thread-quote": !0,
+				children: i.quote.exact
+			}),
+			/* @__PURE__ */ n("ul", {
+				"data-thread-comments": !0,
+				children: i.comments.map((e) => /* @__PURE__ */ n(o, {
+					comment: e,
+					onReact: (t) => void s.react(e.id, t),
+					onRemove: () => void s.remove(e.id),
+					onEdit: (t) => void s.edit(e.id, t)
+				}, e.id))
+			}),
+			/* @__PURE__ */ r("form", {
+				"data-thread-reply": !0,
+				onSubmit: (e) => {
+					e.preventDefault(), l.trim() !== "" && (s.create(l, {
+						threadId: i.id,
+						mentions: a(l)
+					}), u(""));
+				},
+				children: [/* @__PURE__ */ n("input", {
+					value: l,
+					onChange: (e) => u(e.target.value),
+					placeholder: c.replyPlaceholder,
+					"aria-label": c.replyLabel
+				}), /* @__PURE__ */ n("button", {
+					type: "submit",
+					children: c.reply
+				})]
+			})
+		]
+	});
+}
+function c({ anchor: o, api: c = "app" }) {
+	let l = e().comments, u = i(o, c), [d, f] = t("");
+	return /* @__PURE__ */ r("div", {
+		"data-comments": !0,
+		"data-anchor": o,
+		children: [u.threads.map((e) => /* @__PURE__ */ n(s, {
+			thread: e,
+			api: u
+		}, e.id)), /* @__PURE__ */ r("form", {
+			"data-comments-new": !0,
+			onSubmit: (e) => {
+				e.preventDefault(), d.trim() !== "" && (u.create(d, { mentions: a(d) }), f(""));
+			},
+			children: [/* @__PURE__ */ n("input", {
+				value: d,
+				onChange: (e) => f(e.target.value),
+				placeholder: l.newPlaceholder,
+				"aria-label": l.newLabel
+			}), /* @__PURE__ */ n("button", {
+				type: "submit",
+				children: l.comment
+			})]
+		})]
+	});
+}
+//#endregion
+export { c as CommentsThread };

package/dist/connectAccount.js

@@ -0,0 +1,99 @@
+import { useUiStrings as e } from "./strings.js";
+import { useState as t } from "react";
+import { useConnection as n } from "@voltro/client";
+import { Fragment as r, jsx as i, jsxs as a } from "react/jsx-runtime";
+//#region src/connectAccount.tsx
+var o = (e, t) => {
+	switch (e.status) {
+		case "connected": return e.accountLabel === null ? t.connected : t.connectedAs(e.accountLabel);
+		case "expired": return t.expired;
+		case "revoked": return t.revoked;
+		case "error": return t.errored;
+		default: return t.notConnected;
+	}
+}, s = ({ api: e, connectionId: t, ...r }) => {
+	let a = n(e, t);
+	return /* @__PURE__ */ i(c, {
+		connection: a,
+		loading: a.loading,
+		...r
+	});
+}, c = ({ connection: n, instructionsUrl: s, loading: c = !1, children: l, className: u }) => {
+	let d = e().connectAccount, [f, p] = t("");
+	if (l !== void 0) return l(n);
+	if (c) return /* @__PURE__ */ i("div", {
+		className: u,
+		"data-voltro-connect": n.connectionId,
+		children: d.loading
+	});
+	let m = async (e) => {
+		e.preventDefault(), f.trim() !== "" && (await n.submitToken(f), p(""));
+	};
+	return /* @__PURE__ */ a("div", {
+		className: u,
+		"data-voltro-connect": n.connectionId,
+		"data-status": n.status,
+		children: [/* @__PURE__ */ a("div", { children: [
+			/* @__PURE__ */ i("strong", { children: n.label }),
+			" — ",
+			/* @__PURE__ */ i("span", {
+				role: n.needsAttention ? "alert" : void 0,
+				children: o(n, d)
+			})
+		] }), n.connected || n.needsAttention ? /* @__PURE__ */ a(r, { children: [n.needsAttention && n.kind === "oauth2" && /* @__PURE__ */ i("button", {
+			type: "button",
+			disabled: n.pending,
+			onClick: () => {
+				n.connect();
+			},
+			children: d.reconnect
+		}), /* @__PURE__ */ i("button", {
+			type: "button",
+			disabled: n.pending,
+			onClick: () => {
+				n.disconnect();
+			},
+			children: d.disconnect
+		})] }) : n.kind === "oauth2" ? /* @__PURE__ */ i("button", {
+			type: "button",
+			disabled: n.pending,
+			onClick: () => {
+				n.connect();
+			},
+			children: d.connect(n.label)
+		}) : /* @__PURE__ */ a("form", {
+			onSubmit: (e) => {
+				m(e);
+			},
+			children: [
+				/* @__PURE__ */ i("label", {
+					htmlFor: `voltro-connect-${n.connectionId}`,
+					children: d.tokenLabel(n.label)
+				}),
+				/* @__PURE__ */ i("input", {
+					id: `voltro-connect-${n.connectionId}`,
+					type: "password",
+					autoComplete: "off",
+					value: f,
+					placeholder: d.tokenPlaceholder,
+					onChange: (e) => {
+						p(e.target.value);
+					}
+				}),
+				/* @__PURE__ */ i("button", {
+					type: "submit",
+					disabled: n.pending || f.trim() === "",
+					children: d.save
+				}),
+				s !== void 0 && /* @__PURE__ */ i("a", {
+					href: s,
+					target: "_blank",
+					rel: "noreferrer noopener",
+					children: d.howToGetToken
+				})
+			]
+		})]
+	});
+};
+//#endregion
+export { c as ConnectAccount, s as ConnectAccountFor };